*{box-sizing:border-box;margin:0;padding:0}
:root{--neon:#00e5ff;--pink:#ff2fb3;--hot:#ffb000;--bg:#05060a}
html{scroll-behavior:smooth}
body{background:var(--bg);color:#e9f1ff;font-family:"Exo 2",system-ui,sans-serif;overflow-x:hidden}
#gl{position:fixed;inset:0;width:100vw;height:100vh;display:block;z-index:0}
.scan{position:fixed;inset:0;z-index:1;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 3px);mix-blend-mode:overlay}

#loader{position:fixed;inset:0;z-index:50;background:#020306;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity .8s}
#loader .lg{font-family:"Russo One";font-size:clamp(34px,6vw,64px);letter-spacing:.08em;color:#fff;text-shadow:0 0 18px var(--neon),0 0 40px var(--neon)}
#loader .bar{width:min(420px,70vw);height:4px;background:#14202c;overflow:hidden;transform:skewX(-20deg)}
#loader .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--neon),var(--pink));box-shadow:0 0 12px var(--neon);transition:width .2s}
#loader #lpct{font-size:12px;letter-spacing:.3em;color:#8aa3bd}

header{position:fixed;top:0;left:0;right:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:18px 4vw;background:linear-gradient(#000a,#0000)}
.brand{font-family:"Russo One";font-size:20px;letter-spacing:.12em}
.brand b{color:var(--neon);text-shadow:0 0 12px var(--neon);margin-left:4px;font-weight:400}
nav{display:flex;gap:26px}
nav a{color:#cfe3ff;text-decoration:none;font-size:13px;letter-spacing:.2em;text-transform:uppercase;opacity:.8;transition:.2s}
nav a:hover{opacity:1;color:var(--neon);text-shadow:0 0 10px var(--neon)}

#hud{position:fixed;right:4vw;bottom:4vh;z-index:10;text-align:right;font-family:"Russo One";pointer-events:none}
#hud .spd b{font-size:clamp(46px,6vw,78px);line-height:1;color:#fff;text-shadow:0 0 16px var(--neon)}
#hud .spd span{font-size:14px;color:var(--neon);margin-left:6px;letter-spacing:.2em}
#hud .gear{font-size:12px;letter-spacing:.3em;color:#8aa3bd;margin-top:4px}
#hud .gear b{color:var(--hot);font-size:20px;margin-left:6px}
#hud .nos{display:flex;align-items:center;gap:8px;justify-content:flex-end;margin-top:8px;font-size:11px;letter-spacing:.3em;color:#7fd8ff}
#hud .nb{width:160px;height:8px;background:#0d1a26;transform:skewX(-25deg);overflow:hidden;border:1px solid #1f3a52}
#hud .nb i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#1a8cff,var(--neon));box-shadow:0 0 10px var(--neon)}

main{position:relative;z-index:5}
.sec{min-height:100vh;display:flex;align-items:center;padding:0 6vw;position:relative}
.sec.right{justify-content:flex-end}
.box{max-width:470px;padding:30px 32px;background:linear-gradient(135deg,rgba(6,10,18,.72),rgba(6,10,18,.35));border-left:3px solid var(--neon);backdrop-filter:blur(6px);clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%);opacity:0;transform:translateY(40px);transition:opacity .8s,transform .8s}
.sec.right .box{border-left:0;border-right:3px solid var(--pink)}
.box.in{opacity:1;transform:none}
.box.center{margin:0 auto;text-align:center;border-left:0;border-top:3px solid var(--hot)}
.kick{font-size:12px;letter-spacing:.3em;color:var(--neon);text-transform:uppercase;margin-bottom:14px}
.sec.right .kick{color:var(--pink)}
h1,h2{font-family:"Russo One";font-weight:400;line-height:1;letter-spacing:.02em;margin-bottom:16px}
h1{font-size:clamp(42px,6.4vw,92px)}
h1 em{font-style:normal;color:transparent;-webkit-text-stroke:2px var(--neon);text-shadow:0 0 30px rgba(0,229,255,.5)}
h2{font-size:clamp(34px,4.6vw,64px)}
.box p{font-size:17px;line-height:1.55;color:#c5d4e8;margin-bottom:22px}
.btn{display:inline-block;font-family:"Russo One";font-size:15px;letter-spacing:.15em;text-transform:uppercase;color:#001018;background:var(--neon);border:0;padding:15px 28px;text-decoration:none;cursor:pointer;clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);box-shadow:0 0 24px rgba(0,229,255,.55);transition:.2s;user-select:none;-webkit-user-select:none}
.btn:hover{background:#fff;box-shadow:0 0 40px rgba(0,229,255,.9)}
.btn.nitro{background:linear-gradient(90deg,#1a8cff,var(--neon));color:#fff;text-shadow:0 0 8px #000}
.btn.nitro.on{background:#fff;color:#0050ff;box-shadow:0 0 60px #4dd2ff,0 0 120px #1a8cff}
.hint{position:absolute;bottom:5vh;left:50%;transform:translateX(-50%);font-size:12px;letter-spacing:.3em;color:#7a90a8;animation:bob 1.6s infinite}
@keyframes bob{50%{transform:translate(-50%,6px)}}
.specs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.specs div{border:1px solid #1d3348;padding:10px 6px;text-align:center;background:rgba(0,229,255,.04)}
.specs b{display:block;font-family:"Russo One";font-size:24px;color:#fff}
.specs span{font-size:11px;color:#7f97b0;letter-spacing:.05em}
.sw{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.sw button{width:42px;height:42px;border:2px solid #2a3d52;cursor:pointer;transform:skewX(-12deg);transition:.2s}
.sw button.on,.sw button:hover{border-color:#fff;box-shadow:0 0 16px var(--neon)}
.tg label{font-size:14px;color:#b6c8de;cursor:pointer}
.tg input{accent-color:var(--pink);margin-right:8px}
footer{position:relative;z-index:5;padding:26px 6vw 120px;font-size:11px;color:#5d7088;line-height:1.6}

@media(max-width:760px){
  nav{display:none}
  .sec,.sec.right,#s-race{justify-content:center;align-items:flex-end;padding:0 5vw 14vh}
  .hint{display:none}
  h1{font-size:34px}h2{font-size:30px}.box p{margin-bottom:14px}
  .box{padding:22px;max-width:100%}
  .box p{font-size:14px}
  .specs{grid-template-columns:repeat(2,1fr)}
  #hud{bottom:2vh}#hud .nb{width:110px}
}

#s-race{align-items:flex-start;padding-top:16vh}

#go{margin-top:6px}
.gonote{font-size:11px;letter-spacing:.2em;color:#7f97b0;text-transform:uppercase}
#music{position:fixed;left:4vw;bottom:4vh;z-index:10;display:flex;align-items:center;gap:10px;padding:8px 10px 8px 8px;background:rgba(6,10,18,.75);border:1px solid #1d3348;backdrop-filter:blur(6px);clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%)}
#music .yt{width:96px;height:54px;overflow:hidden;background:#000}
#music .yt iframe{width:96px!important;height:54px!important;pointer-events:none}
#music .mi{display:flex;flex-direction:column;font-size:11px;line-height:1.35;max-width:150px}
#music .mi b{font-weight:600;color:#cfe3ff}#music .mi span{color:var(--neon)}
#music button{background:none;border:1px solid #2a3d52;color:#fff;width:34px;height:34px;cursor:pointer;font-size:15px}
#music.on .mi span::after{content:" ▮▮";font-size:9px;letter-spacing:-1px;animation:eq .6s infinite alternate}
@keyframes eq{to{opacity:.3}}
@media(max-width:760px){#music{left:3vw;bottom:2vh;padding:6px}#music .yt{width:64px;height:36px}#music .yt iframe{width:64px!important;height:36px!important}#music .mi{max-width:90px;font-size:10px}#music .mi b{display:none}}

.btn.ghost{background:transparent;color:#e9f1ff;border:1px solid var(--neon);box-shadow:none}
.btn.ghost:hover{background:rgba(0,229,255,.15)}
#drivehud{display:none}
body.drive{overflow:hidden}
body.drive main,body.drive footer,body.drive nav,body.drive .hint{display:none!important}
body.drive #drivehud{display:block}
#drivehud .score{white-space:nowrap;position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:12;display:flex;align-items:baseline;gap:12px;font-family:"Russo One";letter-spacing:.2em;font-size:13px;color:#8aa3bd}
#drivehud .score b{font-size:44px;color:#fff;text-shadow:0 0 16px var(--pink);letter-spacing:0}
#drivehud .best i{font-style:normal;color:var(--hot)}
#drivehud .keys{position:fixed;bottom:4vh;left:50%;transform:translateX(-50%);z-index:12;font-size:12px;letter-spacing:.25em;color:#9fb3cc;text-transform:uppercase;white-space:nowrap}
#exitDrive{position:fixed;top:14px;right:4vw;z-index:13;padding:10px 18px;font-size:12px}
#toast{position:fixed;top:32%;left:50%;transform:translate(-50%,-50%) scale(.8);z-index:12;font-family:"Russo One";font-size:clamp(28px,4vw,54px);letter-spacing:.08em;color:#fff;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;text-shadow:0 0 20px var(--pink),0 0 40px var(--pink);white-space:nowrap}
#toast.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
#toast.crash{color:#ff3b4f;text-shadow:0 0 20px #ff0022}
#toast.near{color:var(--hot);text-shadow:0 0 20px var(--hot)}
#flash{position:fixed;inset:0;z-index:11;pointer-events:none;background:radial-gradient(circle,transparent 40%,rgba(255,0,40,.55));opacity:0;transition:opacity .4s}
#flash.on{opacity:1;transition:none}
#drivehud .touch{display:none}
@media(hover:none),(max-width:760px){
  #drivehud .keys{display:none}
  #drivehud .touch{display:flex;position:fixed;left:0;right:0;bottom:12vh;z-index:12;justify-content:space-between;padding:0 5vw;pointer-events:none}
  #drivehud .touch button{pointer-events:auto;width:76px;height:76px;border-radius:50%;border:2px solid var(--neon);background:rgba(6,10,18,.55);color:#fff;font-size:28px;touch-action:none;-webkit-user-select:none;user-select:none}
  #drivehud .touch #tN{border-color:#4dd2ff;width:64px;height:64px;align-self:center}
  #drivehud .score{top:62px}
}
body.drive #music{bottom:auto;top:62px;left:3vw}
@media(max-width:760px){body.drive #music{display:none}}

#nethud,#count{display:none}
body.net #nethud{display:block}
body.net #drivehud .score{display:none}
#nethud .place{position:fixed;top:140px;left:4vw;z-index:12;font-family:"Russo One";color:#fff}
#nethud .place b{font-size:56px;text-shadow:0 0 18px var(--neon)}
#nethud .place span{font-size:22px;color:#8aa3bd}
#nethud .track{position:fixed;top:78px;left:50%;transform:translateX(-50%);width:min(520px,60vw);z-index:12;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.2em;color:#6f86a0;padding-top:16px}
#nethud .line{position:absolute;top:6px;left:0;right:0;height:3px;background:#1d3348}
#nethud .line i{position:absolute;top:-5px;width:12px;height:12px;border-radius:50%;transform:translateX(-50%);box-shadow:0 0 10px currentColor;border:2px solid #000}
#nethud .left{position:fixed;top:124px;left:50%;transform:translateX(-50%);z-index:12;font-size:12px;letter-spacing:.15em;color:#9fb3cc;white-space:nowrap}
#nethud .left b{color:#fff;font-family:"Russo One";font-size:16px}
body.counting #count{display:flex}
#count{position:fixed;inset:0;z-index:30;align-items:center;justify-content:center;font-family:"Russo One";font-size:min(30vw,220px);color:#fff;text-shadow:0 0 40px var(--pink),0 0 90px var(--pink);pointer-events:none}
#count.go{color:#39ff88;text-shadow:0 0 40px #39ff88,0 0 90px #39ff88}
#lobby{position:fixed;inset:0;z-index:40;background:rgba(2,3,8,.72);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;padding:4vw}
#lobby[hidden]{display:none}
#lobby .lb{position:relative;width:min(520px,100%);max-height:92vh;overflow:auto;padding:30px;background:linear-gradient(135deg,rgba(8,12,22,.96),rgba(8,12,22,.88));border-top:3px solid var(--pink);clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%)}
#lobby .x{position:absolute;top:12px;right:14px;background:none;border:0;color:#8aa3bd;font-size:20px;cursor:pointer}
#lobby p{color:#c5d4e8;line-height:1.5;margin-bottom:16px}
#lobby .nk{display:block;font-size:12px;letter-spacing:.2em;color:#8aa3bd;text-transform:uppercase;margin-bottom:16px}
#lobby input,#lobby select{display:block;width:100%;margin-top:6px;background:#0b1220;border:1px solid #23405c;color:#fff;padding:12px 14px;font:16px "Exo 2"}
#lobby select{display:inline-block;width:auto;margin:0 10px}
#lobby .code{font-size:13px;letter-spacing:.2em;color:#8aa3bd;margin-bottom:10px}
#lobby .code b{font-family:"Russo One";font-size:26px;color:#fff;letter-spacing:.15em;text-shadow:0 0 12px var(--neon)}
#lobby .share{display:flex;gap:8px;margin-bottom:16px}
#lobby .share input{margin:0;font-size:12px;padding:10px}
#lobby .share .btn{padding:10px 14px;font-size:11px;white-space:nowrap}
#plist{list-style:none;margin-bottom:18px}
#plist li{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #1d3348;margin-bottom:6px;background:rgba(0,229,255,.03)}
#plist li i{width:14px;height:14px;border-radius:50%;display:inline-block;box-shadow:0 0 8px currentColor}
#plist li em{margin-left:auto;font-style:normal;font-size:11px;letter-spacing:.15em;color:var(--hot)}
#plist li.free{color:#4a5d72;border-style:dashed}
#hostCtl{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;color:#9fb3cc}
#waitHost,#againWait{font-size:13px;color:#8aa3bd}
#lbMsg{margin-top:12px;color:var(--hot);font-size:14px}
#lbRes h3{font-family:"Russo One";font-weight:400;margin:6px 0 10px}
#rlist{margin:0 0 16px 20px;color:#dfe9f7;line-height:2}
#rlist b{font-family:"Russo One";font-weight:400}
[hidden]{display:none!important}
@media(max-width:760px){#nethud .place{top:60px}}