.cabinet-intro { display:flex;align-items:end;justify-content:space-between;gap:20px;margin:0 8px 18px; }
.cabinet-intro h1 { margin:0;font-size:clamp(2.6rem,7vw,5rem);line-height:.9;letter-spacing:-.075em; }
.cabinet-intro h1 span { color:var(--game-accent,var(--cyan));text-shadow:0 0 28px color-mix(in srgb,var(--game-accent,var(--cyan)) 35%,transparent); }
.cabinet-intro p { max-width:520px;margin:12px 0 0;color:#b6b8d2;font-size:.94rem;line-height:1.55; }
.game-cabinet { --game-accent:var(--cyan);position:relative;overflow:hidden;border:1px solid rgba(172,174,255,.28);border-radius:16px;background:linear-gradient(155deg,#20223e,#0c0d1d 64%);box-shadow:0 20px 80px rgba(0,0,0,.48),0 0 36px color-mix(in srgb,var(--game-accent) 11%,transparent),inset 0 1px rgba(255,255,255,.08); }
.game-cabinet[data-game="snake"] { --game-accent:#a5ffcf; }
.game-cabinet[data-game="breaker"] { --game-accent:#a38bff; }
.game-cabinet[data-game="racer"] { --game-accent:#ff8eac; }
.game-cabinet-top { display:flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-bottom:1px solid rgba(255,255,255,.07);font:700 .58rem var(--mono);letter-spacing:.13em;color:#8789a5; }
.game-cabinet-top i { width:6px;height:6px;border-radius:50%;background:var(--game-accent);box-shadow:0 0 9px var(--game-accent); }
.game-cabinet-top span:last-child { margin-left:auto;color:#5e607c; }
.game-scorebar { display:flex;align-items:center;gap:22px;height:62px;padding:0 22px; }
.game-score { display:grid;gap:3px;min-width:68px; }
.game-score span { color:#8284a2;font:700 .52rem var(--mono);letter-spacing:.15em; }
.game-score strong { color:var(--game-accent);font:900 1.25rem var(--mono);text-shadow:0 0 16px color-mix(in srgb,var(--game-accent) 32%,transparent); }
.game-score.best strong { color:var(--pink); }
.game-score.lives strong { color:#ffb36a; }
.game-pause { margin-left:auto;width:36px;height:36px;border:1px solid var(--line);border-radius:8px;background:#ffffff08;color:#d6d8ef;cursor:pointer;font:800 .72rem var(--mono); }
.game-pause:hover:not(:disabled) { border-color:var(--game-accent);color:var(--game-accent); }
.game-pause:disabled { opacity:.4;cursor:default; }
.game-playfield { position:relative;margin:0 14px;overflow:hidden;border:1px solid color-mix(in srgb,var(--game-accent) 18%,#3d4063);border-radius:9px;background:#070918;touch-action:none;overscroll-behavior:contain; }
.game-canvas { display:block;width:100%;height:auto;aspect-ratio:3/2;touch-action:none;user-select:none;-webkit-user-select:none;outline-offset:-4px; }
.game-overlay { position:absolute;inset:0;display:grid;place-items:center;padding:18px;background:linear-gradient(90deg,#060717a6,#06071738,#060717a6);backdrop-filter:blur(3px); }
.game-overlay[hidden] { display:none; }
.game-overlay-card { width:min(390px,100%);padding:21px 25px 18px;border:1px solid color-mix(in srgb,var(--game-accent) 33%,#62658b);border-radius:13px;background:#0d0f22ed;box-shadow:0 18px 60px #0008,0 0 27px color-mix(in srgb,var(--game-accent) 12%,transparent);text-align:center; }
.game-overlay-card p { margin:0 0 6px;color:var(--game-accent);font:800 .58rem var(--mono);letter-spacing:.17em; }
.game-overlay-card h2 { margin:7px 0 9px;font-size:clamp(1.45rem,4vw,2rem);letter-spacing:-.04em; }
.game-overlay-card .overlay-copy { margin:0 auto 16px;color:#b4b6d0;font-size:.8rem;line-height:1.5;letter-spacing:0;font-family:var(--sans);font-weight:400; }
.game-start { width:100%;min-height:46px;border:0;border-radius:8px;background:var(--game-accent);color:#08131b;cursor:pointer;font:900 .69rem var(--mono);letter-spacing:.1em;box-shadow:0 0 19px color-mix(in srgb,var(--game-accent) 24%,transparent); }
.game-start:hover { filter:brightness(1.08); }
.game-controls { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px 16px; }
.control-copy { max-width:56ch;margin:0;color:#9597b2;font-size:.67rem;line-height:1.55; }
.touch-controls { display:flex;align-items:center;gap:8px; }
.touch-controls button { display:grid;place-items:center;min-width:49px;min-height:43px;padding:0 12px;border:1px solid color-mix(in srgb,var(--game-accent) 38%,#555978);border-radius:9px;background:#ffffff08;color:var(--game-accent);cursor:pointer;touch-action:none;font:800 .9rem var(--mono); }
.touch-controls button:active { background:color-mix(in srgb,var(--game-accent) 19%,#121426); }
.game-back { display:flex;justify-content:space-between;align-items:center;gap:15px;margin:17px 7px 0; }
.game-back a { color:#aeb0cd;font:700 .66rem var(--mono);text-decoration:none; }
.game-back a:hover { color:var(--cyan); }
.game-back span { color:#686a85;font:700 .53rem var(--mono);letter-spacing:.12em; }
.game-note { color:#7f819d;font-size:.64rem;line-height:1.4; }
@media(max-width:680px) { .cabinet-intro { display:block;margin-inline:3px; }.cabinet-intro h1 { font-size:clamp(2.75rem,13vw,4.2rem); }.cabinet-intro p { font-size:.86rem; }.game-cabinet-top { height:36px;padding-inline:12px;font-size:.52rem; }.game-scorebar { gap:14px;height:54px;padding-inline:14px; }.game-score { min-width:57px; }.game-score strong { font-size:1.08rem; }.game-playfield { margin-inline:7px; }.game-overlay-card { padding:15px 18px 13px; }.game-controls { flex-direction:column;align-items:stretch;padding:11px 12px 13px; }.touch-controls { justify-content:center; }.touch-controls button { flex:1;min-height:49px; }.control-copy { max-width:none;text-align:center; }.game-back { align-items:flex-start; }.game-note { margin-top:10px; } }
@media(prefers-reduced-motion:reduce) { .game-start,.touch-controls button { transition:none; } }