.hsm{width:100%;min-width:0;margin:32px 0;border:1px solid #49362b;background:#0b0c0c;color:#efe4d4;border-radius:12px;overflow:hidden}
.hsm *{box-sizing:border-box}.hsm [hidden]{display:none!important}
.hsm-head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px;background:linear-gradient(120deg,#23130d,#0c0d0d)}
.hsm-kicker{font:700 10px/1.6 monospace;letter-spacing:2px;text-transform:uppercase;color:#ff6538}.hsm .hsm-head h2{margin:6px 0 0;font:700 clamp(24px,2.6vw,36px)/1.15 Arial,sans-serif;letter-spacing:-.6px;text-transform:none}
.hsm-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;padding:10px 28px;border-top:1px solid #30281f;border-bottom:1px solid #30281f;background:#090b0a}.hsm-filters button{--hsm-live:0%;position:relative;display:grid;grid-template-columns:44px minmax(0,1fr) auto;grid-template-rows:minmax(48px,auto) 3px;align-items:center;gap:0 8px;min-width:0;padding:0 9px;border:1px solid #41382e;border-radius:6px;background:linear-gradient(180deg,#171918,#101211);box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 2px 8px rgba(0,0,0,.24);color:#d8cbb8;cursor:pointer;text-align:left;transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}.hsm-filters button::before{content:"";position:absolute;inset:0;border-radius:5px;background:linear-gradient(110deg,rgba(238,98,55,.16),transparent 68%);opacity:0;transition:opacity .18s ease}.hsm-filters button:hover{transform:translateY(-2px);border-color:#856047;box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 6px 14px rgba(0,0,0,.34)}.hsm-filters button:hover::before,.hsm-filters button[aria-pressed=true]::before{opacity:1}.hsm-filters button[aria-pressed=true]{border-color:#ef7148;background:linear-gradient(180deg,#2a1812,#171311);box-shadow:inset 0 0 0 1px rgba(255,124,77,.18),0 4px 14px rgba(0,0,0,.3);color:#fff0df}.hsm-filters button[aria-pressed=true] .hsm-game-icon{border-color:#e86139;background:#22130f}.hsm-game-icon{position:relative;z-index:1;display:grid;width:42px;height:25px;place-items:center;overflow:hidden;color:#b7aa97;border:1px solid #55483b;border-radius:4px;background:#0b0d0c;transition:border-color .18s,background .18s}.hsm-game-icon img{display:block;width:100%;height:100%;object-fit:cover}.hsm-game-name{position:relative;z-index:1;display:grid;min-width:0;gap:1px}.hsm-game-name small{color:#e57852;font:700 8px/1.2 monospace;letter-spacing:1.3px;text-transform:uppercase}.hsm-game-name strong{overflow:hidden;color:inherit;font:700 13px/1.15 Arial,sans-serif;text-overflow:ellipsis;white-space:nowrap}.hsm-game-count{position:relative;z-index:1;display:flex;align-items:baseline;gap:2px;font-family:monospace}.hsm-game-count b{color:#fff0de;font-size:17px}.hsm-game-count small{color:#a09687;font-size:9px}.hsm-game-meter{position:relative;z-index:1;grid-column:1/-1;align-self:end;height:3px;background:#292a25;border-radius:4px 4px 0 0;overflow:hidden}.hsm-game-meter span{display:block;width:var(--hsm-live);height:100%;background:linear-gradient(90deg,#e9502c,#ff9860);box-shadow:0 0 8px rgba(255,101,56,.45);transition:width .25s ease}.hsm-filters button[aria-pressed=true] .hsm-game-meter{background:#4a2c22}
.hsm-controls{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 28px;border-bottom:1px solid #30281f}.hsm-controls p{margin:0;color:#a69b8b;font-size:12px;line-height:1.6}.hsm-controls a,.hsm-game-head a{font-size:12px;color:#dcb381;white-space:nowrap}.hsm-panel{padding:20px 28px 28px}.hsm-game-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 16px}.hsm .hsm-game-head h3{margin:0;font:700 18px Arial,sans-serif;text-transform:none}
.hsm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.hsm-card{min-width:0;border:1px solid #393128;background:#111312;border-radius:8px;overflow:hidden}.hsm-art{height:118px;position:relative;padding:14px;background-image:linear-gradient(0deg,#111312 1%,#0c0c0c22 100%),var(--hsm-art);background-size:cover;background-position:center 45%;display:flex;align-items:flex-end}.hsm-art div small{display:block;color:#c5b8a5;font-size:9px;text-transform:uppercase;letter-spacing:1px}.hsm-art div strong{font:700 21px/1.3 Arial,sans-serif}.hsm-state{position:absolute;top:10px;right:10px;font:700 9px Arial,sans-serif;background:#0a211de6;color:#a6dca2;border:1px solid #446143;padding:5px 7px;border-radius:4px}.hsm-card:not([data-state=online]) .hsm-state{background:#202222eb;color:#c3b9a7;border-color:#514b40}.hsm-card:not([data-state=online]) .hsm-art{filter:saturate(.35)}
.hsm-card-body{padding:4px 14px 14px}.hsm .hsm-card h4{font:700 15px/1.35 Arial,sans-serif;margin:8px 0 12px;min-height:40px;overflow-wrap:anywhere;text-transform:none}.hsm-population{display:flex;justify-content:space-between;color:#b8ac9a;font-size:12px}.hsm-population strong{color:#ede3d3}.hsm-capacity{height:3px;background:#2d302a;margin:7px 0 12px}.hsm-capacity i{height:100%;display:block;background:#d98344}.hsm-address{display:block;margin:0 0 12px;padding:7px 9px;border:1px solid #34332d;border-radius:4px;background:#0b0d0c;color:#e2c9a9;font:700 12px/1.4 monospace;letter-spacing:.1px;overflow-wrap:anywhere;user-select:all}
.hsm-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:stretch}.hsm-actions a,.hsm-actions button,.hsm-disabled{display:flex;justify-content:center;align-items:center;gap:7px;min-width:0;min-height:42px;padding:8px 11px;border:1px solid #6a5846;border-radius:4px;color:#f0dfc9;background:#171816;font:700 12px/1 Arial,sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer;text-align:center}.hsm-actions .hsm-primary{background:#c64825;border-color:#ee6b3a;color:#fff2df}.hsm-steam-action img{width:19px;height:19px;flex:0 0 19px}.hsm-steam-action small{font:11px/1 Arial,sans-serif;opacity:.75}.hsm-copy-icon{font:700 16px/1 monospace;transform:translateY(-1px)}.hsm-ip-action{min-width:64px!important;padding-inline:10px!important}.hsm-actions .hsm-disabled{opacity:.55;cursor:default}.hsm-empty{grid-column:1/-1;padding:24px;color:#b9aa94}
.hsm-help{border-top:1px solid #30281f;padding:20px 28px;background:#10110f}.hsm-help strong{font-size:13px}.hsm-help p{margin:8px 0 0;color:#aa9c87;font-size:12px;line-height:1.7;max-width:950px}.hsm-feedback{margin:0;padding:0 28px;color:#e8ba82;line-height:1.6;overflow-wrap:anywhere;user-select:all}.hsm-feedback:not(:empty){padding:12px 28px}.hsm a:focus-visible,.hsm button:focus-visible{outline:2px solid #ffc885;outline-offset:3px}.hsm-actions a:hover,.hsm-actions button:hover{filter:brightness(1.15)}
@media(min-width:1600px){.hsm-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1180px){.hsm-filters{grid-template-columns:repeat(4,minmax(150px,1fr))}}
@media(max-width:1000px){.hsm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hsm-head{align-items:flex-start;flex-direction:column;gap:12px}.hsm-filters{grid-template-columns:repeat(3,minmax(150px,1fr))}}
@media(max-width:700px){.hsm-filters{grid-template-columns:repeat(2,minmax(140px,1fr))}}
@media(max-width:580px){.hsm-head,.hsm-panel,.hsm-help{padding:20px 16px}.hsm-filters{padding:12px 16px;grid-template-columns:1fr}.hsm-filters button{padding:0 16px}.hsm-grid{grid-template-columns:1fr}.hsm-controls{align-items:flex-start;flex-direction:column;padding:12px 16px;gap:8px}.hsm-game-head{align-items:flex-start;flex-direction:column;gap:8px}.hsm-card h4{min-height:0!important}.hsm-art{height:145px}.hsm-actions a,.hsm-actions button{min-height:46px}.hsm-feedback:not(:empty){padding:12px 16px}}

/* Match the square framed cards used by the main game gallery. */
body[data-home="1"] .hsm,
body[data-home="1"] .hsm-filters button,
body[data-home="1"] .hsm-filters button::before,
body[data-home="1"] .hsm-game-icon,
body[data-home="1"] .hsm-card,
body[data-home="1"] .hsm-state,
body[data-home="1"] .hsm-address,
body[data-home="1"] .hsm-actions a,
body[data-home="1"] .hsm-actions button,
body[data-home="1"] .hsm-disabled { border-radius:0; }
body[data-home="1"] .hsm,
body[data-home="1"] .hsm-card { transition:border-color .18s ease,box-shadow .18s ease; }
body[data-home="1"] .hsm:hover,
body[data-home="1"] .hsm-card:hover { border-color:#f06a3f;box-shadow:inset 0 0 0 1px rgba(240,106,63,.08); }