@font-face{font-family:Cairo;src:url(/fonts/Cairo.woff2) format("woff2");font-weight:200 1000;font-display:swap}:root{--asphalt: #120e0b;--asphalt-2: #1c1714;--asphalt-3: #2a231e;--line: rgba(255, 214, 170, .14);--text: #f6efe6;--muted: #b9aa98;--sunset: #ff7a1a;--sunset-2: #ff4d2e;--gold: #f2b705;--nile: #22c3b5;--danger: #ff3b3b;--police-blue: #2f7bff;--metal: linear-gradient(180deg, #f2f2f2 0%, #9aa0a6 48%, #5d6166 52%, #c7cbd0 100%);--radius: 14px;--shadow: 0 18px 50px rgba(0, 0, 0, .55)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--asphalt);color:var(--text);font-family:Cairo,system-ui,-apple-system,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;user-select:none;-webkit-user-select:none;touch-action:none}#app{position:fixed;inset:0}#game-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;outline:none}#ui{position:absolute;inset:0;pointer-events:none}#ui>*{pointer-events:auto}#ui .passthrough{pointer-events:none}button{font-family:inherit}input,select{font-family:inherit;user-select:text;-webkit-user-select:text}.boot{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(ellipse at 50% 110%,#5a2a10,#1d120c 45%,#0b0807);z-index:50;transition:opacity .6s}.boot.hide{opacity:0;pointer-events:none}.boot-logo{font-size:clamp(34px,7vw,76px);font-weight:900;letter-spacing:.06em;font-style:italic}.boot-logo span{color:var(--sunset)}.boot-ar{font-size:clamp(20px,3.4vw,34px);color:var(--gold);font-weight:800;margin-top:-12px}.boot-bar{width:min(420px,70vw);height:6px;background:#ffffff14;border-radius:9px;overflow:hidden;margin-top:18px}.boot-bar i{display:block;height:100%;width:5%;background:linear-gradient(90deg,var(--sunset-2),var(--gold));transition:width .3s}.boot-msg{color:var(--muted);font-size:14px}.screen{position:absolute;inset:0;display:flex;flex-direction:column;padding:max(18px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left));animation:fadeIn .35s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.screen.dim{background:linear-gradient(90deg,#0a0705eb,#0a0705bf 45%,#0a070533)}.screen.full{background:#0a0705e0;backdrop-filter:blur(6px)}.brand{display:flex;align-items:baseline;gap:14px}.brand .logo{font-size:clamp(30px,5.2vw,64px);font-weight:900;font-style:italic;letter-spacing:.04em;line-height:1;text-shadow:0 4px 30px rgba(255,122,26,.35)}.brand .logo span{color:var(--sunset)}.brand .ar{font-size:clamp(18px,2.6vw,30px);color:var(--gold);font-weight:800}.tagline{color:var(--muted);margin:4px 0 0;font-size:14px}.menu-layout{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:24px;flex:1;min-height:0;margin-top:18px}.menu-list{display:flex;flex-direction:column;gap:8px;overflow:auto;padding-right:4px}.menu-btn{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;padding:12px 18px;border:1px solid var(--line);border-radius:12px;cursor:pointer;color:var(--text);background:linear-gradient(100deg,#2a231eeb,#1c1714d9);font-size:18px;font-weight:800;letter-spacing:.02em;transition:transform .12s,border-color .12s,background .12s;clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%)}.menu-btn small{display:block;font-size:12px;color:var(--muted);font-weight:600;letter-spacing:0}.menu-btn .ar{color:var(--gold);font-size:15px;font-weight:700}.menu-btn:hover,.menu-btn:focus-visible{transform:translate(6px);border-color:#ff7a1ab3;outline:none;background:linear-gradient(100deg,#ff7a1a47,#1c1714e6)}.menu-btn.primary{background:linear-gradient(100deg,var(--sunset-2),var(--sunset) 60%,#ffa040);border-color:transparent;font-size:22px;color:#1a0d05}.menu-btn.primary small,.menu-btn.primary .ar{color:#3b1a06}.menu-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.profile-chip{margin-left:auto;display:flex;align-items:center;gap:12px;background:#1c1714cc;border:1px solid var(--line);border-radius:40px;padding:6px 14px 6px 6px;cursor:pointer}.profile-chip .avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--sunset),var(--gold));display:grid;place-items:center;font-weight:900;color:#1a0d05}.profile-chip .cash{color:var(--gold);font-weight:800}.topbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.panel{background:#16120fe6;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}.panel h2{margin:0 0 10px;font-size:24px;font-weight:900}.panel h3{margin:14px 0 8px;font-size:16px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.back-btn{align-self:flex-start;background:none;border:1px solid var(--line);color:var(--text);padding:8px 16px;border-radius:30px;cursor:pointer;font-weight:700}.back-btn:hover{border-color:var(--sunset)}.screen-head{display:flex;align-items:center;gap:16px;margin-bottom:14px;flex-wrap:wrap}.screen-head h1{margin:0;font-size:clamp(24px,3.4vw,38px);font-weight:900;font-style:italic}.screen-head .ar{color:var(--gold);font-weight:800;font-size:20px}.scroll{overflow:auto;min-height:0;flex:1}.btn{border:0;border-radius:10px;padding:10px 18px;font-weight:800;font-size:15px;cursor:pointer;background:var(--asphalt-3);color:var(--text);border:1px solid var(--line)}.btn:hover{border-color:var(--sunset)}.btn.go{background:linear-gradient(100deg,var(--sunset-2),var(--sunset));color:#1a0d05;border:0}.btn.gold{background:var(--gold);color:#1a1205;border:0}.btn:disabled{opacity:.4;cursor:not-allowed}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}.card{position:relative;background:linear-gradient(160deg,#2a231ef2,#14100df2);border:1px solid var(--line);border-radius:14px;padding:14px;cursor:pointer;transition:transform .12s,border-color .12s}.card:hover{transform:translateY(-3px);border-color:#ff7a1a99}.card.locked{opacity:.5;cursor:not-allowed}.card.done:after{content:"✓";position:absolute;top:10px;right:12px;color:var(--nile);font-weight:900;font-size:20px}.card .num{font-size:12px;color:var(--sunset);font-weight:900;letter-spacing:.1em}.card h4{margin:2px 0;font-size:18px}.card .ar{color:var(--gold);font-weight:700}.card p{margin:6px 0 8px;color:var(--muted);font-size:13px}.tag{display:inline-block;font-size:11px;font-weight:800;padding:2px 8px;border-radius:20px;background:#ffffff14;margin:2px 4px 2px 0;letter-spacing:.04em}.tag.pol{background:#2f7bff40;color:#9cc1ff}.tag.cmb{background:#ff3b3b38;color:#ff9c9c}.tag.cash{background:#f2b70533;color:var(--gold)}.seg{display:inline-flex;background:#00000059;border-radius:10px;padding:3px;border:1px solid var(--line);flex-wrap:wrap}.seg button{border:0;background:none;color:var(--muted);font-weight:800;padding:7px 12px;border-radius:8px;cursor:pointer;font-size:13px}.seg button.on{background:var(--sunset);color:#1a0d05}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}.field label{font-size:12px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.06em}.field input[type=text],.field input[type=password],.field select{background:#0006;border:1px solid var(--line);color:var(--text);padding:10px 12px;border-radius:10px;font-size:16px;outline:none}.field input:focus{border-color:var(--sunset)}input[type=range]{width:100%;accent-color:var(--sunset)}.err{color:#ff8a7a;font-size:13px;min-height:18px}.ok{color:var(--nile);font-size:13px}.garage{display:grid;grid-template-columns:minmax(250px,340px) 1fr minmax(260px,360px);gap:16px;flex:1;min-height:0}.garage .bike-list{display:flex;flex-direction:column;gap:8px;overflow:auto}.bike-item{padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#1c1714e0;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:8px}.bike-item.sel{border-color:var(--sunset);background:#ff7a1a29}.bike-item .nm{font-weight:900}.bike-item .sub{font-size:12px;color:var(--muted)}.stat{display:grid;grid-template-columns:92px 1fr 44px;gap:8px;align-items:center;font-size:13px;margin:5px 0}.stat .bar{height:8px;background:#ffffff14;border-radius:6px;overflow:hidden}.stat .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--sunset-2),var(--gold))}.swatches{display:flex;flex-wrap:wrap;gap:8px}.swatch{width:34px;height:34px;border-radius:50%;border:2px solid rgba(255,255,255,.2);cursor:pointer;position:relative}.swatch.sel{border-color:#fff;box-shadow:0 0 0 3px var(--sunset)}.swatch .lock{position:absolute;inset:0;display:grid;place-items:center;font-size:11px;font-weight:900;color:#fff;text-shadow:0 1px 3px #000}.upg{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;margin:8px 0}.pips{display:flex;gap:3px}.pips i{width:18px;height:8px;border-radius:3px;background:#ffffff1a}.pips i.on{background:var(--nile)}table.board{width:100%;border-collapse:collapse;font-size:15px}table.board th{text-align:left;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;padding:8px;border-bottom:1px solid var(--line)}table.board td{padding:9px 8px;border-bottom:1px solid rgba(255,255,255,.05)}table.board tr.me td{background:#ff7a1a24}table.board td.pos{font-weight:900;color:var(--sunset);width:44px}.keys{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px 18px}.keyrow{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:14px}.keycap{min-width:74px;text-align:center;padding:4px 10px;border-radius:8px;background:#ffffff14;border:1px solid var(--line);cursor:pointer;font-weight:800;color:var(--text)}.keycap.listen{border-color:var(--gold);color:var(--gold);animation:blink .8s infinite}@keyframes blink{50%{opacity:.5}}.lobby{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:16px;flex:1;min-height:0}.players{display:flex;flex-direction:column;gap:6px}.player-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#0000004d;border-radius:10px;border:1px solid var(--line)}.player-row .dot{width:14px;height:14px;border-radius:50%}.player-row .ready{margin-left:auto;font-size:12px;font-weight:900;color:var(--muted)}.player-row .ready.on{color:var(--nile)}.code-box{font-size:34px;font-weight:900;letter-spacing:.25em;color:var(--gold);background:#00000059;padding:6px 16px;border-radius:12px;border:1px dashed rgba(242,183,5,.4);display:inline-block}.hud{position:absolute;inset:0;pointer-events:none;font-weight:800}.hud *{pointer-events:none}.hud .tl{position:absolute;top:max(14px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:8px}.hud .tr{position:absolute;top:max(14px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));display:flex;flex-direction:column;align-items:flex-end;gap:8px}.hud .bl{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:max(16px,env(safe-area-inset-left))}.hud .br{position:absolute;bottom:max(10px,env(safe-area-inset-bottom));right:max(14px,env(safe-area-inset-right));display:flex;align-items:flex-end;gap:14px}.pos-box{display:flex;align-items:baseline;gap:4px;text-shadow:0 3px 16px rgba(0,0,0,.7)}.pos-box .p{font-size:64px;line-height:.9;font-style:italic;font-weight:1000}.pos-box .n{font-size:24px;color:var(--muted)}.pos-box .suf{font-size:24px;color:var(--sunset)}.timer{font-size:22px;font-variant-numeric:tabular-nums;text-shadow:0 2px 10px rgba(0,0,0,.7)}.timer.warn{color:var(--danger);animation:blink .5s infinite}.distance{font-size:14px;color:var(--muted)}.hud-bars{display:flex;flex-direction:column;gap:6px;width:min(260px,36vw)}.hbar{display:grid;grid-template-columns:62px 1fr;align-items:center;gap:8px;font-size:11px;letter-spacing:.1em;color:var(--muted);text-shadow:0 1px 4px #000}.hbar .track{height:10px;background:#0000008c;border:1px solid rgba(255,255,255,.12);border-radius:6px;overflow:hidden;transform:skew(-18deg)}.hbar .fill{height:100%;width:50%;transition:width .12s}.hbar.health .fill{background:linear-gradient(90deg,#ff3b3b,#ffb13b)}.hbar.nitro .fill{background:linear-gradient(90deg,#1fa2ff,#12e6c9)}.hbar.nitro.on .fill{box-shadow:0 0 12px #12e6c9}.hbar.stamina .fill{background:linear-gradient(90deg,#f2b705,#fff1a6)}.heat{display:flex;gap:4px}.heat i{width:22px;height:22px;border-radius:6px;background:#00000073;border:1px solid rgba(255,255,255,.15)}.heat i.on{background:radial-gradient(circle at 30% 30%,#ff5252,#b00);box-shadow:0 0 10px #f33}.heat i.on:nth-child(2n){background:radial-gradient(circle at 30% 30%,#5ea0ff,#0846c7);box-shadow:0 0 10px #39f}.heat.flash i.on{animation:blink .4s infinite}.heat-label{font-size:11px;letter-spacing:.1em;color:#9cc1ff;text-align:right}.speedo{position:relative;width:190px;height:190px}.speedo svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 4px 14px rgba(0,0,0,.7))}.speedo .kmh{position:absolute;left:0;right:0;top:64px;text-align:center;font-size:46px;font-style:italic;line-height:1;font-variant-numeric:tabular-nums;font-weight:1000}.speedo .unit{position:absolute;left:0;right:0;top:112px;text-align:center;font-size:12px;letter-spacing:.25em;color:var(--muted)}.speedo .gear{position:absolute;left:0;right:0;top:130px;text-align:center;font-size:18px;color:var(--sunset)}.minimap{width:170px;height:170px;border-radius:50%;background:#0a080699;border:2px solid rgba(255,255,255,.15);box-shadow:0 6px 24px #0009}.progress{position:absolute;top:max(14px,env(safe-area-inset-top));left:50%;transform:translate(-50%);width:min(520px,46vw)}.progress .rail{position:relative;height:8px;background:#00000080;border:1px solid rgba(255,255,255,.15);border-radius:6px}.progress .rail .done{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--sunset-2),var(--gold));border-radius:6px}.progress .dot{position:absolute;top:50%;width:10px;height:10px;border-radius:50%;transform:translate(-50%,-50%);border:2px solid #000}.progress .dot.me{width:16px;height:16px;border-color:#fff;z-index:2}.progress .cp{position:absolute;top:-4px;width:2px;height:16px;background:var(--nile)}.progress .lbl{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:4px;letter-spacing:.08em}.district{position:absolute;top:58px;left:50%;transform:translate(-50%);font-size:13px;color:var(--muted);letter-spacing:.12em;text-shadow:0 1px 6px #000;white-space:nowrap}.district b{color:var(--gold)}.notes{position:absolute;top:34%;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}.note{font-size:26px;font-style:italic;font-weight:1000;text-shadow:0 3px 16px rgba(0,0,0,.8);animation:notePop 1.8s ease forwards;white-space:nowrap}.note.small{font-size:18px}.note.good{color:var(--gold)}.note.bad{color:#ff6b5b}.note.cop{color:#8fb8ff}.note.cool{color:var(--nile)}@keyframes notePop{0%{opacity:0;transform:scale(1.5)}12%{opacity:1;transform:scale(1)}80%{opacity:1}to{opacity:0;transform:translateY(-24px)}}.countdown{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(90px,18vw,200px);font-weight:1000;font-style:italic;color:var(--gold);text-shadow:0 8px 40px rgba(0,0,0,.8)}.countdown.go{color:var(--nile)}.combat-hint{position:absolute;bottom:30%;left:50%;transform:translate(-50%);display:flex;gap:220px;font-size:14px;opacity:.9}.combat-hint span{padding:4px 10px;border-radius:8px;background:#ff3b3b4d;border:1px solid rgba(255,59,59,.6);visibility:hidden}.combat-hint span.on{visibility:visible}.vignette-hit{position:absolute;inset:0;box-shadow:inset 0 0 160px #f000;transition:box-shadow .2s}.vignette-hit.on{box-shadow:inset 0 0 160px #ff1e008c}.vignette-nitro{position:absolute;inset:0;box-shadow:inset 0 0 200px #12e6c900;transition:box-shadow .3s}.vignette-nitro.on{box-shadow:inset 0 0 200px #12e6c94d}.net-badge{font-size:11px;color:var(--muted);letter-spacing:.08em}.standings{font-size:13px;display:flex;flex-direction:column;gap:2px;text-shadow:0 1px 5px #000;min-width:170px}.standings div{display:flex;gap:8px}.standings div.me{color:var(--gold)}.standings .pl{width:18px;color:var(--muted)}.pause-btn{position:absolute;top:max(12px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:none;pointer-events:auto!important}.touch{position:absolute;inset:0;pointer-events:none;display:none}.touch.on{display:block}.touch .tbtn{position:absolute;pointer-events:auto;border-radius:50%;background:#14100d73;border:2px solid rgba(255,255,255,.25);color:#fff;display:grid;place-items:center;font-weight:900;font-size:15px;touch-action:none;backdrop-filter:blur(2px)}.touch .tbtn.on{background:#ff7a1a8c;border-color:var(--sunset)}.touch .steerL{left:max(14px,env(safe-area-inset-left));bottom:26px;width:96px;height:96px}.touch .steerR{left:calc(max(14px,env(safe-area-inset-left)) + 110px);bottom:26px;width:96px;height:96px}.touch .gas{right:max(16px,env(safe-area-inset-right));bottom:24px;width:100px;height:100px;background:#22c3b566}.touch .brake{right:calc(max(16px,env(safe-area-inset-right)) + 112px);bottom:20px;width:78px;height:78px}.touch .nitro{right:max(26px,env(safe-area-inset-right));bottom:136px;width:72px;height:72px;background:#1fa2ff66}.touch .pl{left:max(14px,env(safe-area-inset-left));bottom:136px;width:60px;height:60px;font-size:12px}.touch .kl{left:calc(max(14px,env(safe-area-inset-left)) + 68px);bottom:150px;width:60px;height:60px;font-size:12px}.touch .pr{right:calc(max(16px,env(safe-area-inset-right)) + 104px);bottom:116px;width:60px;height:60px;font-size:12px}.touch .kr{right:calc(max(16px,env(safe-area-inset-right)) + 172px);bottom:104px;width:60px;height:60px;font-size:12px}.touch .guard{right:calc(max(16px,env(safe-area-inset-right)) + 110px);bottom:184px;width:56px;height:56px;font-size:11px}.touch .tpause{left:50%;transform:translate(-50%);top:max(64px,env(safe-area-inset-top));width:48px;height:48px;border-radius:12px;font-size:18px}.rotate-hint{position:absolute;inset:0;background:#0a0705f2;display:none;place-items:center;text-align:center;font-size:20px;z-index:40;padding:20px}.results{max-width:980px;width:100%;margin:auto;display:flex;flex-direction:column;gap:14px;max-height:100%}.results .head{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap}.results .big{font-size:clamp(42px,7vw,84px);font-weight:1000;font-style:italic;line-height:1}.results .big.win{color:var(--gold)}.results .big.lose{color:#ff6b5b}.results .kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}.kpi{background:#00000059;border:1px solid var(--line);border-radius:12px;padding:10px 12px}.kpi .v{font-size:24px;font-weight:900}.kpi .k{font-size:11px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.reward{font-size:28px;color:var(--gold);font-weight:1000}.toast{position:absolute;bottom:24px;left:50%;transform:translate(-50%);background:#14100df2;border:1px solid var(--line);padding:10px 18px;border-radius:30px;font-weight:700;z-index:60;animation:fadeIn .3s}.help{font-size:13px;color:var(--muted);line-height:1.6}.help kbd{background:#ffffff1a;border:1px solid var(--line);border-radius:5px;padding:0 6px;font-family:inherit;font-weight:800;color:var(--text)}@media (max-width: 900px){.menu-layout,.lobby{grid-template-columns:1fr}.garage{grid-template-columns:1fr;overflow:auto}.menu-btn{font-size:16px;padding:10px 14px}.speedo{width:140px;height:140px}.speedo .kmh{top:46px;font-size:34px}.speedo .unit{top:82px}.speedo .gear{top:96px;font-size:14px}.minimap{width:110px;height:110px}.pos-box .p{font-size:44px}.progress{width:40vw}.standings{display:none}.combat-hint{gap:120px}}@media (max-height: 520px){.hud .br{bottom:6px}.speedo{width:120px;height:120px}.speedo .kmh{top:38px;font-size:28px}.speedo .unit{top:68px}.speedo .gear{top:80px}.minimap{width:96px;height:96px}.hud-bars{width:180px}.district{top:44px}}body.touch-mode .hud .br{bottom:auto;top:70px}body.touch-mode .hud .bl,body.touch-mode .combat-hint{display:none}@media (orientation: portrait) and (max-width: 700px){body.touch-mode.in-race .rotate-hint{display:grid}}body.touch-mode .hud .br{top:max(8px,env(safe-area-inset-top));bottom:auto;right:max(10px,env(safe-area-inset-right))}body.touch-mode .minimap{display:none}body.touch-mode .speedo{width:104px;height:104px}body.touch-mode .speedo .kmh{top:32px;font-size:26px}body.touch-mode .speedo .unit{top:60px;font-size:9px}body.touch-mode .speedo .gear{top:72px;font-size:12px}body.touch-mode .hud .tr{top:120px}body.touch-mode .progress{width:34vw}.touch .tfull{left:calc(50% + 56px);top:max(64px,env(safe-area-inset-top));width:48px;height:48px;border-radius:12px;font-size:20px}.fs-btn{margin-left:auto}.fs-btn+.profile-chip{margin-left:0}body.is-fullscreen .rotate-hint{padding-top:env(safe-area-inset-top)}
