@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--ink:#eaf2ff;--muted:#8b9ab4;--line:#22314d;--bg:#07101f;--panel:#0b1629;--cyan:#54e2e8;--pink:#ff6ca8}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -20%,#162d4a 0,#07101f 47%,#050b15 100%);color:var(--ink);font-family:'Space Grotesk',sans-serif;min-height:100vh;display:grid;place-items:center;padding:24px}.shell{width:min(100%,980px)}.topbar{display:flex;justify-content:space-between;align-items:center;padding:0 8px 18px}.brand{font-size:14px;letter-spacing:.16em;font-weight:700;display:flex;gap:10px;align-items:center}.brand-mark{color:var(--cyan);font-size:22px}.stats{display:flex;gap:30px;font:11px 'DM Mono';letter-spacing:.12em;color:var(--muted)}.stats b{color:var(--ink);margin-left:8px;font-weight:500}.game-wrap{position:relative;border:1px solid var(--line);background:var(--panel);box-shadow:0 25px 70px #0008;border-radius:8px;overflow:hidden}.game-wrap:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(transparent 50%,#ffffff03 50%);background-size:100% 4px}.game-wrap canvas{display:block;width:100%;height:auto;image-rendering:pixelated}.overlay{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#07101fdd;z-index:2;padding:25px}.overlay.hidden{display:none}.eyebrow{font:11px 'DM Mono';color:var(--cyan);letter-spacing:.18em;margin:0 0 17px}.overlay h1{font-size:clamp(30px,5vw,52px);line-height:1;margin:0 0 14px;letter-spacing:-.05em}.overlay p:not(.eyebrow){color:var(--muted);max-width:410px;line-height:1.5;margin:0 auto 27px}button{font:600 12px 'DM Mono';letter-spacing:.12em;color:#05121e;background:var(--cyan);border:0;border-radius:4px;padding:15px 20px;cursor:pointer;box-shadow:0 0 28px #54e2e855}button:hover{background:#a1fbf6}button span{font-size:19px;margin-left:12px;vertical-align:-2px}footer{display:flex;gap:26px;align-items:center;padding:16px 8px 0;color:var(--muted);font:11px 'DM Mono';letter-spacing:.08em}kbd{border:1px solid #314361;border-radius:3px;padding:5px 7px;margin-right:5px;color:var(--ink);font:10px 'DM Mono'}.status{margin-left:auto;color:#7dc9be}.status i{display:inline-block;width:6px;height:6px;background:#72e0a6;border-radius:50%;box-shadow:0 0 9px #72e0a6;margin-right:7px}@media(max-width:600px){body{padding:12px}.topbar{display:block}.stats{margin-top:15px;justify-content:space-between}.brand{font-size:12px}footer{gap:10px;flex-wrap:wrap}.status{margin-left:0}}