/* A shelf to browse, then one generous stage to look closer. */
.gallery-hint{font-size:13px;color:var(--muted);margin:-8px 0 22px}
.games-grid,.games-grid.filtered{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 20px}
.games-grid .game-card,.games-grid.filtered .game-card{grid-column:auto;position:relative;overflow:visible;border:0;background:none;box-shadow:none}
.games-grid .game-art,.games-grid.filtered .game-art{aspect-ratio:16/9;border:3px solid #665069;border-radius:14px;box-shadow:0 8px 25px #120b2240}
.games-grid .game-info,.games-grid.filtered .game-info{padding:15px 0 0;display:block}
.games-grid .game-info>div{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.games-grid .game-info h3,.games-grid.filtered .game-info h3{font:800 24px/1.14 var(--display);letter-spacing:-.6px;margin:0}
.games-grid .game-info p,.games-grid.filtered .game-info p{font:400 14px/1.45 var(--body);margin:0}
.games-grid .game-info .scene-players{font-size:11px;margin:0;color:var(--accent)}
.card-zoom{position:absolute;bottom:8px;right:8px;width:30px;height:30px;display:grid;place-items:center;background:var(--accent);color:var(--bg);border-radius:50%;font-size:22px;box-shadow:0 2px 12px #0006}
.game-card:hover .game-art{border-color:var(--accent)}
.game-card[hidden]{display:none}
.gallery-dialog{width:min(1180px,96vw);max-width:none;max-height:94dvh;padding:0;overscroll-behavior:contain}
.gallery-dialog .dialog-close{position:sticky;top:10px;float:right;margin:10px 12px -54px 0;z-index:10;width:44px;height:44px}
.gallery-toolbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;min-height:68px;padding:10px 72px 10px 20px;background:var(--panel);border-bottom:1px solid var(--line)}
.gallery-toolbar button{display:grid;place-items:center;flex-shrink:0;min-width:44px;min-height:44px;background:var(--bg);color:var(--cream);border:1px solid var(--line);border-radius:50%;font-size:24px;cursor:pointer}
.gallery-toolbar button:hover{background:var(--accent);color:var(--bg)}
.gallery-count{min-width:45px;text-align:center;font-size:12px;color:var(--muted)}
.gallery-toolbar strong{font-size:14px;margin-left:8px;line-height:1.2}
.gallery-toolbar button:focus-visible,.gallery-dialog .scene-switches button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.gallery-dialog .dialog-game-frame{aspect-ratio:auto;background:#181322;touch-action:pan-y pinch-zoom}
.gallery-dialog .dialog-game-frame>.dialog-image{position:static;width:100%;height:auto;max-height:62dvh;aspect-ratio:16/9;object-fit:contain}
.gallery-dialog .dialog-body{padding:26px 34px 32px}
.gallery-dialog .dialog-body h2{font-size:34px;margin-bottom:10px}
.gallery-dialog .dialog-body>p{margin-bottom:20px}
.gallery-dialog .scene-switches{margin:0 0 22px}
.gallery-dialog .gallery-rules-title{font-size:15px;margin:0 0 12px;color:var(--accent)}
.gallery-dialog .dialog-body ul{margin-top:0}
@media(max-width:1100px){
 .games-grid,.games-grid.filtered{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 22px}
}
@media(max-width:640px){
 .games-grid,.games-grid.filtered{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 13px}
 .games-grid .game-art,.games-grid.filtered .game-art{border-width:2px;border-radius:9px}
 .games-grid .game-info,.games-grid.filtered .game-info{padding-top:11px}
 .games-grid .game-info>div{gap:7px}
 .games-grid .game-info h3,.games-grid.filtered .game-info h3{font-size:20px;letter-spacing:-.4px;line-height:1.15}
 .games-grid .game-info p,.games-grid.filtered .game-info p{font-size:12px;line-height:1.45}
 .games-grid .game-info .scene-players{font-size:10px}
 .card-zoom{width:25px;height:25px;right:5px;bottom:5px;font-size:19px}
 .gallery-hint{font-size:12px;line-height:1.5}
 .gallery-dialog{width:100%;max-height:100dvh;height:100dvh;max-width:100vw;margin:0;border-radius:0;border:0}
 .gallery-toolbar{padding:10px 64px 10px 12px;gap:7px;min-height:68px}
 .gallery-toolbar strong{display:none}
 .gallery-dialog .dialog-body{padding:24px 20px}
 .gallery-dialog .dialog-body h2{font-size:30px}
 .gallery-dialog .dialog-game-frame>.dialog-image{max-height:60dvh}
}
@media(max-width:360px){.games-grid .game-info h3,.games-grid.filtered .game-info h3{font-size:18px}}
@media(prefers-reduced-motion:reduce){.game-card,.game-art>img{transition:none}}
