:root{--bg:#050816;--cyan:#3df0ff;--magenta:#ff3d9a;--gold:#ffd24a;--ink:#e8f6ff;--panel:rgba(6,10,28,.78);--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;height:100dvh;overflow:hidden;background:#050816;color:var(--ink);font-family:"Segoe UI","Trebuchet MS",sans-serif;touch-action:none;user-select:none}#app,#c{position:fixed;inset:0;width:100%;height:100%}
.panel{position:fixed;left:0;right:0;top:0;padding:calc(10px + var(--safe-top)) calc(10px + var(--safe-right)) 8px calc(10px + var(--safe-left));pointer-events:none;z-index:5}.panel .row{display:grid;grid-template-columns:auto repeat(3,max-content);gap:7px;align-items:center}.panel button,.screen button{pointer-events:auto;cursor:pointer;font:800 .76rem/1 ui-monospace,monospace;letter-spacing:.07em;text-transform:uppercase}.panel button{min-height:44px;border:1px solid #6f8190;background:#1a222b;color:#eef7fb;border-radius:2px;padding:8px 11px;box-shadow:inset 4px 0 0 #ffce43}.panel span{background:#ece9d9;color:#18222a;border:2px solid #1a242b;border-radius:2px;padding:6px 10px;font:900 .74rem/1 ui-monospace,monospace;font-variant-numeric:tabular-nums;box-shadow:3px 3px 0 rgba(0,0,0,.4)}.mission,.powers{margin-top:6px;display:inline-block;padding:.32rem .55rem;background:#17212a;color:#c2e8f4;border-left:4px solid #43d4f5;font:700 .68rem/1.25 ui-monospace,monospace;opacity:.95}
.panel button:focus-visible,.screen button:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.screen{position:fixed;inset:0;z-index:8;display:block;padding:0;background:linear-gradient(180deg,rgba(18,30,39,.24) 0 25%,rgba(5,8,14,.9) 74%),linear-gradient(90deg,#111923,#1f3541 50%,#101820);overflow:hidden}.screen::before{content:'';position:absolute;left:0;right:0;bottom:12%;height:12px;background:#d9dbd5;box-shadow:0 -42px 0 #2a3034,0 18px 0 #090c0e}.screen::after{content:'PLATFORM 07   ◉  NEON LINE   NEXT TRAIN 00:42';position:absolute;left:max(5vw,calc(var(--safe-left) + 12px));top:max(7vh,calc(var(--safe-top) + 12px));padding:.52rem .85rem;background:#e4dfa8;color:#162028;border:3px solid #162028;box-shadow:5px 5px 0 #162028;font:900 .72rem/1 ui-monospace,monospace;letter-spacing:.11em}
.screen h1,.screen h2{position:absolute;left:max(6vw,calc(var(--safe-left) + 14px));top:max(20vh,calc(var(--safe-top) + 70px));margin:0;color:#eff7f5;font:900 clamp(3.2rem,10vw,7rem)/.72 Impact,"Arial Narrow",sans-serif;letter-spacing:-.035em;text-align:left;text-shadow:6px 6px 0 #10161b}.screen h1::after{content:'NEON RUSH';display:block;margin-top:.18em;color:#ffce43;font:900 .42em/1 ui-monospace,monospace;letter-spacing:.22em;text-shadow:none}.tag{position:absolute;left:max(6vw,calc(var(--safe-left) + 14px));top:max(14vh,calc(var(--safe-top) + 48px));margin:0;padding:.32rem .6rem;background:#df365f;color:#fff;border:3px solid #151d22;box-shadow:4px 4px 0 #151d22;font:900 .72rem/1 ui-monospace,monospace;letter-spacing:.13em}.sub{position:absolute;left:max(6vw,calc(var(--safe-left) + 14px));top:48vh;width:min(43vw,520px);margin:0;padding:.65rem .8rem;background:#e8e3d1;color:#223039;border-left:7px solid #df365f;box-shadow:6px 6px 0 rgba(0,0,0,.35);line-height:1.45;font-weight:700;text-align:left}.screen button{position:absolute;right:max(6vw,calc(var(--safe-right) + 14px));width:min(31vw,350px);min-height:54px;border:3px solid #182229;background:#e5e2d5;color:#182229;border-radius:2px;padding:11px 14px;box-shadow:6px 6px 0 #11181d;text-align:left}.screen #btn-play{top:24vh;min-height:76px;background:#df365f;color:#fff;border-color:#7d1d36;font-size:.95rem}.screen #btn-mission{top:39vh;background:#ffda62!important;color:#182229!important;border-color:#7a6424!important}.hints{position:absolute;right:max(6vw,calc(var(--safe-right) + 14px));bottom:max(8vh,calc(var(--safe-bottom) + 16px));width:min(31vw,350px);padding:.5rem .7rem;background:#162128;color:#b8cbd3;border-left:4px solid #43d4f5;font:700 .66rem/1.4 ui-monospace,monospace;text-align:left;opacity:1}.ghost{background:#d9d6c9!important;border-color:#1a242b!important;color:#1a242b!important}
#pause{background:linear-gradient(90deg,rgba(7,10,12,.32),rgba(7,10,12,.94))}#pause h2,#over h2{left:auto;right:max(7vw,calc(var(--safe-right) + 14px));top:18vh;width:min(38vw,430px);font-size:clamp(3rem,8vw,5.7rem);text-align:left}#pause button,#over button{right:max(7vw,calc(var(--safe-right) + 14px))}#btn-resume{top:40vh}#btn-restart{top:51vh}#btn-home,#btn-over-home{top:62vh}#over{background:linear-gradient(180deg,rgba(12,17,20,.48),rgba(5,8,10,.95))}#results{position:absolute;left:max(6vw,calc(var(--safe-left) + 14px));top:38vh;width:min(43vw,500px);padding:1rem;background:#e5e1d1;color:#1c272e;border-left:8px solid #df365f;box-shadow:7px 7px 0 #141b20;font:900 .85rem/1.75 ui-monospace,monospace;text-align:left;font-variant-numeric:tabular-nums}#btn-again{top:42vh}.hidden{display:none!important}
@media(max-width:640px){.panel{padding-left:calc(7px + var(--safe-left));padding-right:calc(7px + var(--safe-right))}.panel .row{grid-template-columns:auto 1fr 1fr 1fr;gap:4px}.panel button{min-height:44px;padding:8px}.panel span{padding:6px 5px;font-size:.59rem}.screen::after{left:max(4vw,calc(var(--safe-left) + 8px));top:max(5vh,calc(var(--safe-top) + 8px));font-size:.56rem;padding:.42rem .55rem}.screen h1,.screen h2{left:max(5vw,calc(var(--safe-left) + 10px));top:max(16vh,calc(var(--safe-top) + 58px));font-size:clamp(2.8rem,16vw,5rem);max-width:90vw}.tag{left:max(5vw,calc(var(--safe-left) + 10px));top:max(11vh,calc(var(--safe-top) + 38px))}.sub{left:max(5vw,calc(var(--safe-left) + 10px));top:38vh;width:43vw;font-size:.67rem;padding:.48rem}.screen button{right:max(4vw,calc(var(--safe-right) + 8px));width:51vw;min-height:44px;font-size:.6rem}.screen #btn-play{top:auto;bottom:max(27vh,calc(var(--safe-bottom) + 128px));min-height:56px}.screen #btn-mission{top:auto;bottom:max(18vh,calc(var(--safe-bottom) + 78px))}.hints{right:max(4vw,calc(var(--safe-right) + 8px));bottom:max(6vh,calc(var(--safe-bottom) + 8px));width:51vw;font-size:.56rem}#pause h2,#over h2{left:max(5vw,calc(var(--safe-left) + 10px));right:auto;top:18vh;width:90vw}#pause button,#over button{right:max(4vw,calc(var(--safe-right) + 8px))}#btn-resume{top:auto;bottom:28vh}#btn-restart{top:auto;bottom:19vh}#btn-home,#btn-over-home{top:auto;bottom:10vh}#results{left:max(5vw,calc(var(--safe-left) + 10px));top:39vh;width:43vw;font-size:.65rem;padding:.55rem}#btn-again{top:auto;bottom:25vh}}
/* Mobile pause uses document flow so browser chrome / safe areas cannot clip HOME. */
@media(max-width:640px){
  #pause{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:8px;padding:max(62px,var(--safe-top)) calc(4vw + var(--safe-right)) max(16px,var(--safe-bottom)) calc(4vw + var(--safe-left));overflow:auto}
  #pause::after{top:max(14px,var(--safe-top));left:calc(4vw + var(--safe-left));right:calc(4vw + var(--safe-right));width:auto}
  #pause h2{position:static!important;left:auto!important;right:auto!important;top:auto!important;width:auto!important;max-width:92vw;margin:auto auto 8px 0!important;font-size:clamp(2.5rem,15vw,4.4rem)!important;line-height:.82!important}
  #pause button{position:static!important;right:auto!important;top:auto!important;bottom:auto!important;width:100%!important;max-width:none!important;min-height:48px!important;margin:0!important}
  #pause #btn-resume{background:#df365f!important;color:#fff!important;border-color:#7d1d36!important}
  #pause #btn-home{margin-bottom:0!important}
}
@media(max-height:480px) and (orientation:landscape){#pause{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.75fr);grid-template-rows:auto repeat(3,min-content);align-content:center;column-gap:18px;row-gap:6px;padding:max(30px,var(--safe-top)) calc(5vw + var(--safe-right)) max(10px,var(--safe-bottom)) calc(5vw + var(--safe-left))}#pause h2{grid-column:1;grid-row:1 / span 4;align-self:center;font-size:clamp(2.2rem,12vh,3.4rem)!important}#pause button{grid-column:2;min-height:44px!important;font-size:.56rem!important}#pause::after{font-size:.48rem}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}