:root{--ink:#07131f;--ink2:#0b2130;--cyan:#66ead8;--blue:#39a5ff;--paper:#eaf5f3;--muted:#92a7ae;--coral:#ff6e76}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--paper);background:radial-gradient(circle at 80% 0%,#0e4350 0,transparent 34rem),radial-gradient(circle at 4% 80%,#17294a 0,transparent 30rem),var(--ink);font-family:"Space Grotesk",system-ui,sans-serif}.game-shell{width:min(1180px,calc(100% - 36px));margin:auto;padding:28px 0 42px}.topbar{display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:12px;color:inherit;text-decoration:none;align-items:center}.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--cyan);color:#062033;border-radius:11px;font:500 12px "DM Mono"}.brand strong,.brand small{display:block}.brand strong{font-size:14px;letter-spacing:.04em}.brand small,.eyebrow,.label,.console-bottom{font:500 10px "DM Mono";letter-spacing:.12em;text-transform:uppercase}.brand small{color:var(--muted);margin-top:2px}.live{font:500 11px "DM Mono";color:var(--muted);display:flex;gap:7px;align-items:center}.live i{width:7px;height:7px;background:var(--cyan);display:block;border-radius:99px;box-shadow:0 0 12px var(--cyan)}.intro{padding:88px 0 48px;max-width:760px}.eyebrow{color:var(--cyan);margin:0 0 14px}.intro h1{margin:0;font-size:clamp(44px,8vw,92px);line-height:.91;letter-spacing:-.065em}.intro h1 span{color:var(--cyan)}.lede{max-width:610px;color:#b3c6ca;font-size:18px;line-height:1.55;margin:28px 0 0}.console{border:1px solid rgba(167,232,224,.24);border-radius:20px;background:rgba(4,20,31,.7);box-shadow:0 24px 80px rgba(0,0,0,.34);overflow:hidden}.console-top,.console-bottom{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border-bottom:1px solid rgba(167,232,224,.14)}.console-top strong{display:block;margin-top:4px;font:500 15px "DM Mono"}.label{color:var(--muted)}.scores{text-align:right}.game-frame{position:relative;aspect-ratio:960/520;overflow:hidden;background:linear-gradient(rgba(102,234,216,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(102,234,216,.045) 1px,transparent 1px),#061725;background-size:34px 34px}.game-frame:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,transparent 30%,rgba(3,11,22,.55) 100%);pointer-events:none;z-index:1}canvas{width:100%;height:100%;display:block;touch-action:none}.overlay{position:absolute;inset:0;z-index:2;display:grid;align-content:center;justify-items:center;text-align:center;background:rgba(5,20,31,.25);backdrop-filter:blur(2px);transition:.35s}.overlay.is-hidden{opacity:0;pointer-events:none}.overlay h2{font-size:clamp(32px,5vw,56px);letter-spacing:-.055em;margin:0}.overlay p:not(.eyebrow){color:#b3c6ca;max-width:460px;line-height:1.6}.overlay kbd{font:500 11px "DM Mono";padding:4px 6px;margin:0 1px;border:1px solid rgba(255,255,255,.28);border-radius:5px;background:rgba(255,255,255,.08)}button{border:0;cursor:pointer;margin-top:13px;padding:14px 18px;border-radius:9px;background:var(--cyan);color:#052033;font:600 13px "Space Grotesk";transition:transform .2s,box-shadow .2s}button:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(102,234,216,.23)}button span{margin-left:10px}.scanline{height:1px;position:absolute;inset:0 0 auto;background:rgba(102,234,216,.38);box-shadow:0 0 24px 4px rgba(102,234,216,.2);opacity:.35;animation:scan 5s linear infinite;pointer-events:none;z-index:3}@keyframes scan{to{transform:translateY(520px)}}.console-bottom{border:0;color:var(--muted);gap:18px;justify-content:flex-start;flex-wrap:wrap}.console-bottom span:last-child{margin-left:auto}.console-bottom b{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:7px}.console-bottom b.danger{background:var(--coral)}footer{margin:32px 0 0;display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-size:13px}footer a{color:var(--paper);text-decoration:none}footer a span{color:var(--cyan)}@media(max-width:620px){.game-shell{width:min(100% - 24px,1180px);padding-top:18px}.intro{padding:58px 0 36px}.lede{font-size:16px}.console-top{padding:13px}.console-top strong{font-size:12px}.console-bottom span:last-child{display:none}.overlay{padding:24px}.overlay p:not(.eyebrow){font-size:13px}footer{font-size:12px;flex-direction:column}.live{font-size:9px}}


/* Mobile-first game surface */
@media (max-width: 620px) {
  body { min-height: 100dvh; }
  .game-shell { width: 100%; padding: 14px 12px 22px; }
  .topbar { padding: 0 6px; }
  .intro { padding: 32px 12px 20px; }
  .intro h1 { max-width: 330px; font-size: clamp(40px, 14vw, 58px); }
  .lede { max-width: 330px; margin-top: 16px; font-size: 15px; }
  .console { border-radius: 16px; }
  .console-top { gap: 10px; padding: 11px 13px; }
  .console-top > div:first-child { margin-right: auto; }
  .console-top strong { font-size: 11px; }
  .scores { min-width: 42px; }
  .scores .label { font-size: 8px; }
  .game-frame { height: min(60dvh, 540px); min-height: 360px; aspect-ratio: auto; }
  .overlay { padding: 24px 22px 28px; }
  .overlay h2 { max-width: 270px; font-size: 35px; }
  .overlay p:not(.eyebrow) { max-width: 280px; font-size: 13px; }
  .overlay kbd { display: none; }
  .console-bottom { gap: 12px; padding: 10px 13px; font-size: 8px; }
  .console-bottom span:last-child { display: none; }
  footer { flex-direction: column; margin: 18px 12px 0; font-size: 11px; }
  .live { font-size: 9px; }
}


/* Fullscreen: the game becomes the whole application surface. */
.fullscreen-button { display:grid; width:34px; height:34px; margin:0 0 0 4px; padding:0; place-items:center; border:1px solid rgba(102,234,216,.3); border-radius:8px; background:rgba(102,234,216,.06); color:var(--paper); font:500 19px/1 "DM Mono"; }
:fullscreen { background:var(--ink); }
:fullscreen .game-shell { width:min(100%,1500px); height:100dvh; padding:12px; }
:fullscreen .intro, :fullscreen footer { display:none; }
:fullscreen .topbar { height:46px; padding:0 8px; }
:fullscreen .console { height:calc(100dvh - 70px); }
:fullscreen .game-frame { height:calc(100% - 94px); min-height:0; aspect-ratio:auto; }
@media (max-width:620px) { .fullscreen-button { width:32px; height:32px; margin-left:0; font-size:17px; } :fullscreen .game-shell { padding:8px; } :fullscreen .console { height:calc(100dvh - 58px); } :fullscreen .game-frame { height:calc(100% - 82px); } }


/* Mobile arcade — dedicated responsive surface. */
@media (pointer:coarse){
 html,body{margin:0;min-height:100%;overflow:hidden;overscroll-behavior:none;background:#03131f}
 .rotate-device{display:none}
 @media (orientation:portrait){.rotate-device{position:fixed;z-index:999;inset:0;display:grid;place-content:center;justify-items:center;gap:9px;padding:34px;text-align:center;color:#efffff;background:radial-gradient(circle at 70% 12%,#0b4960 0,transparent 32rem),#04121e}.rotate-glyph{display:grid;place-items:center;width:68px;height:68px;border:1px solid #32e8ed;border-radius:19px;color:#59f6f1;font-size:45px;transform:rotate(90deg)}.rotate-device h2{margin:5px 0;font-size:34px}.rotate-device p{max-width:260px;color:#9cb8c3}.game-shell{display:none}}
 @media (orientation:landscape){
  .topbar,.intro,footer,.console-bottom{display:none!important}
  .game-shell,.console{width:100%;height:100dvh;min-height:100svh;padding:0;margin:0;border:0;border-radius:0;background:#03131f;box-shadow:none}
  .console-top{position:absolute;z-index:7;top:max(8px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));display:grid;grid-template-columns:1fr auto auto auto;align-items:center;min-height:0;padding:7px 10px;border:1px solid rgba(69,229,238,.27);border-radius:13px;background:rgba(3,20,33,.72);backdrop-filter:blur(12px)}
  .console-top .label{font-size:8px;color:#89b8c6}.console-top strong{font-size:13px}.console-top>div:first-child strong{display:none}.console-top>div:first-child:after{content:'SIGNAL DRIFT';font:600 11px 'DM Mono';letter-spacing:.14em;color:#eaffff}.scores{min-width:54px;text-align:center}.scores strong{font-size:16px}.fullscreen-button,.icon-button{display:grid!important;width:34px;height:34px;margin-left:7px;place-items:center;border:1px solid rgba(93,241,239,.45);border-radius:10px;background:rgba(3,28,42,.8);color:#eaffff}
  .game-frame{position:relative;display:grid;place-items:center;width:100%;height:100%;min-height:0;background:radial-gradient(circle at 50% 50%,rgba(13,97,137,.21),transparent 42%),#03131f;overflow:hidden}
  #game{width:100%;height:auto;max-width:100%;max-height:100%;aspect-ratio:960/520;object-fit:contain;background:linear-gradient(rgba(46,194,216,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(46,194,216,.09) 1px,transparent 1px),#031926;background-size:38px 38px}
  .overlay{z-index:6;padding:20px 150px;text-align:center;background:radial-gradient(circle,rgba(4,22,35,.2),rgba(4,22,35,.86));}.overlay h2{font-size:clamp(26px,4vw,42px)}.overlay p:not(.eyebrow){font-size:13px}.overlay button{padding:12px 18px;border-radius:12px;background:#45e9e0;color:#06222a}
  .mobile-controls{position:absolute;z-index:8;bottom:max(16px,env(safe-area-inset-bottom));left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));display:flex!important;align-items:center;justify-content:space-between;pointer-events:none}
  .joystick{position:relative;display:block!important;width:112px;height:112px;pointer-events:auto;touch-action:none;border:1px solid rgba(77,240,239,.58);border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(39,181,239,.18) 0 28%,transparent 29%),rgba(2,22,35,.77);box-shadow:inset 0 0 24px rgba(50,225,245,.18),0 0 20px rgba(15,174,231,.18)}
  .joystick:before,.joystick:after{position:absolute;content:'';background:rgba(109,242,238,.2)}.joystick:before{top:55px;left:12px;right:12px;height:1px}.joystick:after{left:55px;top:12px;bottom:12px;width:1px}.joystick i{position:absolute;top:34px;left:34px;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c8ffff,#38aeea 48%,#064f83);box-shadow:0 0 18px #46d9ff;transition:transform 70ms}
  .boost{position:relative;display:grid!important;place-items:center;width:90px;height:90px;margin:0;padding:5px;pointer-events:auto;border:0;border-radius:50%;background:conic-gradient(#55f3ec calc(var(--charge,1)*1turn),rgba(48,148,205,.25) 0);box-shadow:0 0 20px rgba(57,194,255,.38)}.boost span{display:grid;place-items:center;width:72px;height:72px;border:1px solid #9befff;border-radius:50%;background:radial-gradient(circle at 35% 28%,#277dc6,#06243d 68%);color:#fff;font:600 10px 'DM Mono';letter-spacing:.08em}.boost span:before{content:'⚡';display:block;font-size:27px;line-height:25px}.boost i{display:none}
 }
}

/* Strict rotation gate: only coarse-pointer portrait devices. */
.rotate-device{display:none!important}
@media (pointer:coarse) and (orientation:portrait){.rotate-device{display:grid!important;position:fixed;z-index:999;inset:0;place-content:center;justify-items:center;padding:34px;text-align:center;color:#efffff;background:radial-gradient(circle at 70% 12%,#0b4960 0,transparent 32rem),#04121e}.rotate-device h2{margin:5px 0;font-size:34px}.rotate-device p{max-width:260px;color:#9cb8c3}.rotate-glyph{display:grid;place-items:center;width:68px;height:68px;border:1px solid #32e8ed;border-radius:19px;color:#59f6f1;font-size:45px;transform:rotate(90deg)}}