@font-face{font-family:Phantom;src:local('Phantom'),local('Phantom Sans')}@font-face{font-family:Rajdhani;src:url('vendor/rajdhani.ttf')}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#101211;color:#f3f4ed;font-family:Phantom,Rajdhani,'Arial Narrow','PingFang SC',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}button:focus-visible,a:focus-visible{outline:2px solid #d6fa45;outline-offset:5px}button{transition:background .2s,transform .2s}button:hover{filter:brightness(1.15)}[hidden]{display:none!important}#world{position:fixed;inset:0}#world canvas{display:block;width:100%;height:100%}.vignette{position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(9,12,10,.65),transparent 45%,rgba(9,12,10,.2)),linear-gradient(0deg,#101211 0%,transparent 45%)}header{position:relative;height:92px;margin:0 3.5%;border-bottom:1px solid #ffffff1c;display:flex;align-items:center;justify-content:space-between;z-index:2}.brand{text-decoration:none;color:#f5f5ec;font-size:29px;font-weight:700;font-style:italic;letter-spacing:1px;display:flex;align-items:center;gap:12px}.brand i{color:#d6fa45;font-size:39px;letter-spacing:-8px;margin-right:8px}.brand span{font:10px 'PingFang SC',sans-serif;letter-spacing:3px;color:#92988c;border-left:1px solid #ffffff30;padding-left:17px;margin-left:4px}nav{display:flex;height:100%;gap:35px}.nav{position:relative;font-size:13px;color:#92998f;display:flex;align-items:center;gap:8px}.nav small{font-size:11px;letter-spacing:1px}.nav.active{color:#e5ff74}.nav.active:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#d6fa45}.profile{display:flex;align-items:center;gap:11px;font-size:11px;color:#aab1a2}.profile b{margin-left:14px;padding:6px 12px;background:#ffffff08;color:#f1f3eb;font-size:13px;letter-spacing:1px}.online{display:inline-block;background:#d6fa45;width:5px;height:5px;border-radius:100%;box-shadow:0 0 8px #d6fa4555}.icon{font-size:22px;margin-left:5px}#garage{position:relative;height:calc(100% - 92px);margin:0 3.5%}.season{position:absolute;top:26px;display:flex;align-items:center;gap:15px;font-size:10px;color:#a1a89b;letter-spacing:2px;width:100%}.tag{border:1px solid #b5c98a55;padding:5px 8px;color:#d6fa45;font-size:11px;letter-spacing:1px}.season-line{width:38px;height:1px;background:#5d6751}.season>span:last-child{font-size:10px;color:#697263}.car-info{position:absolute;top:105px;left:0;pointer-events:none}.eyebrow{font-size:12px;letter-spacing:3px;color:#c2c9b9;display:flex;align-items:center;gap:10px}.green-line{width:23px;height:3px;background:#d6fa45}h1{font-size:clamp(44px,4.6vw,76px);line-height:.95;margin:20px 0 18px;font-weight:700;letter-spacing:-2px;font-style:italic}h1 span{display:block;font-size:.52em;letter-spacing:3px;margin-top:8px}#carDescription{font-size:12px;letter-spacing:2px;color:#969f90;margin:0 0 26px}.class-tag{display:flex;align-items:center;gap:11px;font-size:11px}.class-tag b{color:#12170b;background:#d6fa45;font-size:18px;line-height:24px;width:27px;text-align:center;transform:skew(-10deg)}.class-tag em{font-size:11px;font-style:normal;color:#889381;margin-left:5px;letter-spacing:1px}.stage-label{position:absolute;left:38%;right:26%;bottom:320px;display:flex;justify-content:space-between;color:#788473;font-size:10px;letter-spacing:2px}.stage-label i{color:#d6fa45;font-size:16px}.specs{position:absolute;right:0;top:115px;width:215px}.specs>.eyebrow{font-size:11px;justify-content:space-between;letter-spacing:2px;border-bottom:1px solid #ffffff1c;padding-bottom:15px}.specs>.eyebrow span{color:#d6fa45;font-size:25px;font-style:italic}.spec{margin-top:19px}.spec>div:first-child{display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#9da794}.spec b{font-size:23px;font-weight:600;color:#eff2e9}.spec small{font-size:9px;color:#818e77;font-weight:400}.bar{height:3px;margin-top:8px;background:#ffffff12}.bar i{display:block;height:100%;background:linear-gradient(90deg,#6c833f,#d6fa45);width:90%}.ability-card{border:1px solid #b8dc532c;background:#b7de3906;display:flex;gap:13px;margin-top:25px;padding:15px 12px}.ability-icon{color:#d6fa45;font-size:33px}.ability-card small{font-size:9px;color:#919d84}.ability-card strong{display:block;font-size:14px;letter-spacing:2px;margin:5px 0}.ability-card p{font-size:9px;line-height:1.7;margin:0;color:#839078}.garage-bottom{position:absolute;bottom:0;left:0;right:0}.section-label{display:flex;justify-content:space-between;font-size:11px;color:#aeb7a6;margin-bottom:13px}.section-label small{font-size:9px;letter-spacing:2px;color:#5d6b57;margin-left:10px}.section-label>span:last-child{color:#75836b;font-size:10px}.car-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.car-card{height:105px;text-align:left;padding:15px 16px;position:relative;border:1px solid #ffffff1c;background:linear-gradient(125deg,#ffffff09,#ffffff02);overflow:hidden}.car-card.selected{border-color:#d6fa45;background:linear-gradient(120deg,#d6fa451a,#d6fa4503)}.car-card.selected:before{content:'';position:absolute;top:0;left:0;width:30px;height:3px;background:#d6fa45}.car-card .number{font-size:9px;color:#7f8a76;letter-spacing:2px}.car-card .car-mini{position:absolute;right:12px;top:9px;width:98px;height:43px;color:var(--car-color)}.car-card strong{display:block;font-size:16px;letter-spacing:1px;font-style:italic;margin-top:15px}.car-card small{font-size:9px;color:#839078;letter-spacing:1px}.car-card.locked{opacity:.4}.car-card .check{position:absolute;bottom:12px;right:12px;color:#d6fa45;font-size:14px}.race-strip{display:flex;align-items:center;border-top:1px solid #ffffff1c;margin-top:24px;padding-top:20px;gap:40px}.track-preview{display:flex;text-align:left;align-items:center;gap:14px;flex:1;padding:0}.track-preview canvas{width:100px;height:55px}.track-preview small{color:#909c82;letter-spacing:2px;font-size:9px}.track-preview strong{display:block;font-size:15px;font-weight:500;margin-top:8px}.track-preview strong span{color:#d6fa45;margin-left:12px}.race-fact small{display:block;font-size:9px;color:#7f8b72;margin-bottom:5px}.race-fact b{font-size:25px;font-weight:600}.race-fact b span{color:#8c9980;font-size:10px;font-weight:400;margin-left:5px}.primary{background:#d6fa45;color:#182005;min-width:220px;padding:17px 24px;text-align:left;position:relative;font-size:16px;font-weight:bold;clip-path:polygon(0 0,100% 0,100% 78%,94% 100%,0 100%)}.primary>span{position:absolute;right:23px;top:19px;font-size:28px}.primary small{display:block;font-size:9px;letter-spacing:2px;margin-top:4px;font-weight:600}footer{display:flex;justify-content:space-between;margin-top:22px;padding:16px 0;border-top:1px solid #ffffff0a;font-size:9px;color:#66745e;letter-spacing:1px}footer i{margin-right:7px}footer em{font-style:normal;margin:0 10px;color:#37472e}.modal{position:fixed;inset:0;background:#080c09b8;backdrop-filter:blur(14px);display:grid;place-items:center;z-index:20;padding:24px}.modal-card{position:relative;background:#151b16;border:1px solid #ffffff24;width:600px;max-width:100%;padding:40px;max-height:90vh;overflow:auto;box-shadow:0 40px 150px #0009}.close{position:absolute;right:20px;top:12px;color:#87977e;font-size:30px}.modal h2{font-size:36px;font-style:italic;letter-spacing:1px;margin:10px 0 22px}.modal .eyebrow{color:#d6fa45;font-size:10px}.modal p{color:#9da996;font-size:13px;line-height:1.9}.track-option{display:block;width:100%;border:1px solid #ffffff22;padding:20px;text-align:left;margin:12px 0;background:#ffffff03}.track-option.selected{border-color:#d6fa45}.track-option strong{font-size:18px}.track-option span{float:right;color:#d6fa45;font-size:11px}.track-option small{display:block;color:#8c9b83;font-size:11px;margin-top:8px}.modal-actions{display:flex;gap:12px;margin-top:24px}.secondary{padding:15px 24px;border:1px solid #ffffff30;font-size:13px}kbd{border:1px solid #ffffff40;background:#ffffff0a;padding:4px 7px;font:12px Rajdhani,sans-serif;border-radius:3px}.instructions{display:grid;grid-template-columns:120px 1fr;gap:20px;font-size:13px;color:#a8b49e;margin:28px 0}.setting{display:flex;align-items:center;justify-content:space-between;margin:24px 0;color:#b5c0ad;font-size:14px}.setting select{padding:8px;color:#d6fa45;background:#222b20;border:1px solid #ffffff22}.setting input{accent-color:#d6fa45}.race-top{position:fixed;top:35px;left:40px;right:40px;display:flex;justify-content:space-between}.position{width:235px;background:linear-gradient(100deg,#101910c9,transparent);padding:20px}.position>small{font-size:10px;color:#bdc6b3;letter-spacing:2px}.position>div{display:flex;align-items:baseline;gap:10px}.position>div>b{font-size:76px;color:#d6fa45;line-height:1.1;font-style:italic}.position>div>span{font-size:25px;color:#a3ae96}#leaderboard{list-style:none;padding:15px 0 0;margin:10px 0 0;border-top:1px solid #ffffff30}#leaderboard li{display:flex;justify-content:space-between;gap:12px;margin:13px 0;font-size:12px;color:#bac3b4}#leaderboard li.me{color:#d6fa45}#leaderboard li span:nth-child(2){flex:1}#leaderboard small{font-size:10px}.lap-panel{text-align:center;text-shadow:0 2px 8px #000}.lap-panel>span{display:block;font-size:11px;letter-spacing:3px;color:#bac7b3}.lap-panel>b{display:block;font-size:21px;letter-spacing:2px;margin:13px}.lap-panel em{color:#d6fa45;font-size:35px;font-style:normal}.lap-panel>small{font-size:21px;letter-spacing:3px}.speed-panel{text-align:right;width:230px;text-shadow:0 3px 8px #000}.speed-panel>small{font-size:12px;letter-spacing:4px;color:#d6fa45}.speed-panel>b{display:block;font-size:100px;font-style:italic;line-height:1}.rpm{height:4px;background:#ffffff30;margin:8px 0 14px}.rpm i{display:block;height:100%;background:#d6fa45}.speed-panel>span{display:flex;align-items:center;justify-content:flex-end;gap:16px;font-size:9px;letter-spacing:2px}.speed-panel>span>b{background:#d6fa45;padding:3px 10px;color:#1e290d;font-size:20px}.race-bottom{position:fixed;bottom:34px;left:40px;right:40px;display:flex;align-items:flex-end;justify-content:space-between}.minimap{background:#0d170b99;border:1px solid #ffffff14;padding:8px 10px;text-align:center}.minimap canvas{width:210px;height:150px;display:block}.minimap span{font-size:11px;letter-spacing:2px;color:#b8c8a8}.race-keys{display:grid;gap:18px;font-size:10px;color:#c3ccbb;text-shadow:0 2px 8px #000;padding:16px}.race-keys kbd{margin-left:10px}.skill-meter{width:240px;background:#0c160bbb;padding:20px;border:1px solid #d6fa4522}.skill-meter>div:first-child{display:flex;justify-content:space-between;font-size:13px}.skill-meter b{color:#d6fa45;font-size:20px}.charge{background:#ffffff20;height:5px;margin:15px 0}.charge i{display:block;height:100%;background:#d6fa45;transition:width .15s}.skill-meter small{font-size:10px;color:#9cad8d}.skill-meter kbd{margin-right:6px}#countdown{position:fixed;top:34%;width:100%;text-align:center;color:#d6fa45;text-shadow:0 5px 50px #000;font-size:150px;font-weight:bold;font-style:italic;pointer-events:none}#raceMessage{position:fixed;top:25%;width:100%;text-align:center;font-size:18px;color:#d6fa45;letter-spacing:4px;text-shadow:0 2px 12px #000}#pauseBtn{position:fixed;right:40px;top:240px;background:#18201488;border:1px solid #ffffff30;padding:8px 13px}#toast{position:fixed;bottom:35px;left:50%;transform:translateX(-50%) translateY(100px);opacity:0;background:#d6fa45;color:#1c280f;padding:14px 25px;font-size:13px;z-index:40;transition:.3s;pointer-events:none}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}#loading{position:fixed;inset:0;background:#101211;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;z-index:50}#loading b{font-size:50px;letter-spacing:10px;font-style:italic;color:#d6fa45}#loading span{font-size:12px;color:#8c9d7d;letter-spacing:3px}#touchControls{display:none}.result-rank{font-size:100px;font-style:italic;color:#d6fa45;line-height:1}.result-table{width:100%;border-collapse:collapse;margin:20px 0;color:#aab89c;font-size:12px}.result-table td{padding:10px 0;border-bottom:1px solid #ffffff10}.result-table tr:first-child{color:#d6fa45}@media(min-height:920px){.garage-bottom{bottom:20px}.car-info{top:140px}.specs{top:145px}}@media(max-height:760px){header{height:72px}#garage{height:calc(100% - 72px)}.car-info{top:85px}h1{font-size:51px}.specs{top:75px;width:195px}.spec{margin-top:12px}.ability-card{margin-top:15px;padding:10px}.car-card{height:88px}.car-card strong{margin-top:7px}.race-strip{padding-top:14px;margin-top:17px}footer{margin-top:12px;padding:12px 0}.stage-label{bottom:275px}.season{top:19px}}@media(max-width:1050px){.brand span{display:none}nav{gap:20px}.nav small{display:none}.race-strip{gap:22px}.opponents{display:none}.primary{min-width:190px}.specs{width:180px}.car-card{padding:12px}.car-card .car-mini{width:75px}.car-card strong{font-size:13px}.car-info{max-width:30%}h1{font-size:48px}.race-keys{display:none}}@media(max-width:700px){header{height:64px;margin:0 5%}.brand{font-size:22px}.brand i{font-size:30px}.profile{font-size:0;gap:5px}.profile b{font-size:11px;margin:0}.nav{font-size:11px}nav{gap:14px}.icon{font-size:19px}#garage{height:calc(100% - 64px);margin:0 5%}.season{font-size:9px;gap:8px}.season-line,.season>span:last-child{display:none}.car-info{top:80px;max-width:70%}h1{font-size:43px}.specs{top:90px;width:110px}.specs .eyebrow{font-size:9px;letter-spacing:0}.specs .eyebrow span{font-size:22px}.spec{margin-top:13px}.spec b{font-size:18px}.spec small{font-size:8px}.ability-card{display:none}.stage-label{display:none}.car-cards{gap:8px;overflow-x:auto;display:flex;padding-bottom:4px}.car-card{min-width:160px;height:86px}.section-label small{display:none}.race-strip{gap:15px;flex-wrap:wrap;margin-top:10px;padding-top:12px}.track-preview{width:100%;flex:1}.track-preview canvas{width:60px}.track-preview strong{font-size:12px}.track-preview small{font-size:8px;letter-spacing:1px}.race-fact b{font-size:20px}.race-fact small{font-size:8px}.primary{width:100%;padding:12px 20px;text-align:center}.primary small{display:inline;margin-left:15px}.primary>span{top:6px}footer{font-size:8px;padding:10px 0}footer>span:nth-child(2){display:none}.race-top{top:16px;left:12px;right:12px}.position{width:150px;padding:10px}.position>small{font-size:8px}.position>div>b{font-size:50px}#leaderboard li{font-size:10px;gap:6px}.lap-panel>span{font-size:8px;letter-spacing:0}.lap-panel>b{font-size:12px;margin:9px 0}.lap-panel em{font-size:26px}.lap-panel>small{font-size:13px;letter-spacing:0}.speed-panel{width:100px}.speed-panel>b{font-size:60px}.speed-panel>span{font-size:7px;letter-spacing:0;gap:7px}.race-bottom{bottom:100px;left:12px;right:12px}.minimap canvas{width:140px;height:100px}.minimap span{font-size:8px}.skill-meter{width:150px;padding:12px}.skill-meter>div:first-child{font-size:11px}.skill-meter small{font-size:8px}.skill-meter kbd{padding:2px}.modal-card{padding:30px 25px}.modal h2{font-size:27px}.modal-actions{flex-direction:column}#pauseBtn{right:15px;top:180px}.class-tag em{display:none}#touchControls{display:flex;position:fixed;bottom:15px;left:12px;right:12px;justify-content:space-between;gap:8px}#touchControls button{touch-action:none;user-select:none;background:#d6fa4522;border:1px solid #d6fa4566;border-radius:8px;padding:15px;flex:1;font-size:14px}#touchControls button:active{background:#d6fa45;color:#14200b}}@media(max-height:640px) and (min-width:701px){.car-info{top:65px}.specs{top:55px}.car-info h1{font-size:42px}.car-info p{margin-bottom:12px}.spec{margin-top:8px}.ability-card{display:none}.car-card{height:72px}.car-card .car-mini{width:65px;top:0}.car-card strong{margin-top:5px}.section-label{margin-bottom:8px}.stage-label{display:none}.season{top:12px}.race-strip{padding-top:10px;margin-top:10px}.primary{padding:12px 20px}footer{padding:8px 0;margin-top:8px}}
/* Motion pass: keep the road clear, concentrate speed effects at the edges. */
#speedFX{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}#hud{position:relative;z-index:2}#actionBanner{position:fixed;bottom:24%;left:50%;transform:translateX(-50%) skew(-9deg);text-align:center;pointer-events:none;white-space:nowrap;filter:drop-shadow(0 2px 12px #000)}#actionTitle{display:block;color:var(--fx-color,#d6fa45);font-size:32px;font-weight:700;letter-spacing:7px;text-shadow:0 0 24px var(--fx-color,#d6fa45)}#actionDetail{display:block;margin-top:5px;font-size:10px;letter-spacing:3px;color:#efffff}.boost-active .speed-panel>b{color:#edfcff;text-shadow:3px 0 #4ccfff70,-3px 0 #987dff55,0 0 28px #45cfff50}.boost-active .skill-meter{border-color:var(--fx-color);box-shadow:inset 0 0 25px #45cfff18,0 0 35px #45cfff16}.boost-active .rpm i{background:var(--fx-color);box-shadow:0 0 12px var(--fx-color)}.boost-active #actionBanner{animation:boost-arrive .45s cubic-bezier(.16,1,.3,1)}.drift-active:not(.boost-active) #actionTitle{color:#e6fa78;text-shadow:0 0 25px #d6fa4560}.car-card.selected{box-shadow:inset 0 0 30px #d6fa4507}.car-card:hover .car-mini{transform:translateX(-5px);transition:transform .25s}.primary:hover{transform:translateY(-2px);box-shadow:0 7px 25px #d6fa4533}.modal:not([hidden]) .modal-card{animation:panel-arrive .3s ease-out}#countdown:not(:empty){animation:count-beat 1s cubic-bezier(.1,.8,.3,1) infinite}.result-rank{animation:rank-arrive .7s cubic-bezier(.16,1,.3,1)}@keyframes boost-arrive{from{opacity:0;letter-spacing:16px;transform:translateX(-50%) translateY(12px) skew(-9deg) scale(1.15)}to{opacity:1;transform:translateX(-50%) skew(-9deg) scale(1)}}@keyframes panel-arrive{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}@keyframes count-beat{0%{transform:scale(1.2);opacity:.3}20%{opacity:1}80%{transform:scale(1);opacity:1}100%{transform:scale(.95);opacity:.3}}@keyframes rank-arrive{from{opacity:0;transform:translateX(-35px)}to{opacity:1;transform:none}}@media(max-width:700px){#actionBanner{bottom:34%}#actionTitle{font-size:23px;letter-spacing:3px}#actionDetail{font-size:8px;letter-spacing:1px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
/* Chaos loadout: same garage, wildly different rules. */
.chaos-picker{margin-top:9px;padding:7px 13px;border:1px solid #b6dd64;background:#d6fa4515;color:#d6fa45;cursor:pointer;font:inherit;font-size:12px;letter-spacing:1px}.chaos-picker:hover{background:#d6fa45;color:#111}.chaos-options{display:grid;gap:10px;margin-top:24px}.chaos-option{display:flex;align-items:center;gap:17px;padding:16px;text-align:left;color:#e9f3e4;border:1px solid #53634a;background:#172019;cursor:pointer;font:inherit}.chaos-option.selected{border-color:#d6fa45;background:#d6fa4512}.chaos-option:disabled{opacity:.4;cursor:not-allowed}.chaos-option:not(:disabled):hover{border-color:#d6fa45}.chaos-option .chaos-icon{font-size:34px;color:#d6fa45;width:35px;flex-shrink:0}.chaos-option strong{display:block;font-size:18px;margin:5px 0}.chaos-option small{color:#a5ba91;font-size:10px;letter-spacing:1px}.chaos-option p{font-size:12px!important;margin:0!important;line-height:1.6!important}.chaos-option>b{margin-left:auto;white-space:nowrap;color:#d6fa45;font-size:14px}.ability-card p{line-height:1.5}.chaos-disco #actionBanner{border-color:#f574d4;background:linear-gradient(110deg,#6d2854bb,#163c61bb)}.chaos-disco #actionTitle{color:#ffa3ed}.chaos-disco .vignette{box-shadow:inset 0 0 95px #b948a74a}
@media(max-width:600px){.chaos-option{padding:12px;gap:10px}.chaos-option>b{font-size:11px}.chaos-option .chaos-icon{font-size:26px;width:26px}.chaos-picker{padding:6px 9px}.chaos-option strong{font-size:16px}}
@media(max-width:700px){nav{gap:11px}.nav{font-size:10px}#guideBtn{font-size:0}#guideBtn:after{content:'指南';font-size:10px}header{margin:0 4%}.brand{font-size:19px}.brand i{font-size:24px}}
.nitro{display:flex;align-items:center;justify-content:flex-end;gap:9px;margin-top:10px;font-size:10px;letter-spacing:2px;color:#9fe8ff}.nitro small{font-weight:700}.nitro>div{width:150px;height:6px;background:#ffffff1c;transform:skewX(-20deg);overflow:hidden}.nitro i{display:block;height:100%;width:30%;background:linear-gradient(90deg,#2b8cff,#7ff0ff);box-shadow:0 0 10px #59d8ff;transition:width .12s}.nitro kbd{font-size:9px}.nitro.burning i{background:linear-gradient(90deg,#7ff0ff,#fff);box-shadow:0 0 18px #9ff3ff}.nitro.burning small{color:#fff;text-shadow:0 0 12px #7ff0ff}
.item-slot{display:flex;align-items:center;gap:14px;background:#0c160bbb;border:1px solid #ffffff1a;padding:14px 18px;min-width:190px;margin-right:16px;transition:border-color .2s,box-shadow .2s}.item-slot>span{width:46px;height:46px;display:grid;place-items:center;font-size:26px;color:#ffffff40;border:1px solid #ffffff22;background:#ffffff08;border-radius:9px}.item-slot>span{line-height:1}.item-slot>div{display:grid;gap:3px}.item-slot small{font-size:9px;letter-spacing:2px;color:#8fa086}.item-slot b{font-size:16px}.item-slot kbd{justify-self:start;font-size:9px}.item-slot.ready{border-color:#ffe36b88;box-shadow:0 0 26px #ffe36b22}.item-slot.ready>span{color:#ffe36b;border-color:#ffe36b;background:linear-gradient(135deg,#ffe36b22,#7dfcff22,#ff7ce022);text-shadow:0 0 14px #ffe36b}.item-slot.shielded{border-color:#5fd4ff;box-shadow:0 0 26px #5fd4ff44}
.race-bottom{gap:0}.race-bottom>.minimap{margin-right:auto}#actionBanner[data-tier="1"] #actionTitle{color:#7cc4ff;text-shadow:0 0 25px #3aa8ff}#actionBanner[data-tier="2"] #actionTitle{color:#ffab5c;text-shadow:0 0 25px #ff7a18}#actionBanner[data-tier="3"] #actionTitle{color:#de9bff;text-shadow:0 0 25px #c24dff}
@media(max-width:1050px){.item-slot{min-width:0;padding:10px}.item-slot>div small{display:none}}
@media(max-width:700px){.nitro>div{width:70px}.nitro kbd{display:none}.item-slot{padding:8px;gap:8px;margin-right:8px}.item-slot>span{width:30px;height:30px;font-size:16px}.item-slot b{font-size:11px}.item-slot kbd{display:none}#touchControls button{padding:15px 4px;font-size:12px}}

/* Cut-scenes: letterbox bars, title card, skip button; in-race sweeping banner. */
.cine{position:fixed;inset:0;z-index:15;pointer-events:none}.cine-bar{position:absolute;left:0;right:0;height:0;background:#050605;transition:height .55s cubic-bezier(.16,1,.3,1)}.cine-bar.top{top:0}.cine-bar.bottom{bottom:0}.cine.letterbox .cine-bar{height:11vh}
.cine-card{position:absolute;left:6%;bottom:16vh;max-width:min(620px,80vw);opacity:0;text-shadow:0 3px 18px #000}.cine-card small{display:block;color:#d6fa45;font-size:12px;letter-spacing:6px}.cine-card strong{display:block;font-size:clamp(34px,5vw,64px);font-style:italic;letter-spacing:2px;margin:6px 0 10px;line-height:1.05}.cine-card span{display:block;font-size:14px;letter-spacing:2px;color:#d3dccb;border-left:3px solid #d6fa45;padding-left:12px}
.cine-card.show{animation:cine-card 2.6s cubic-bezier(.16,1,.3,1) forwards}@keyframes cine-card{0%{opacity:0;transform:translateX(-40px);filter:blur(6px)}18%{opacity:1;transform:none;filter:none}82%{opacity:1}100%{opacity:.0;transform:translateX(18px)}}
.cine-skip{position:absolute;right:4%;bottom:calc(11vh + 18px);pointer-events:auto;color:#cfd8c6;font-size:12px;letter-spacing:2px;background:#0b0f0b99;border:1px solid #ffffff2a;padding:8px 12px}.cine-skip kbd{margin-left:6px}
body.cinematic .race-top,body.cinematic .race-bottom,body.cinematic #touchControls,body.cinematic #pauseBtn,body.cinematic #actionBanner,body.cinematic #raceMessage{opacity:0;transition:opacity .4s}.race-top,.race-bottom,#pauseBtn{transition:opacity .4s}
.race-banner{position:fixed;top:30%;left:0;right:0;text-align:center;pointer-events:none;z-index:14;opacity:0}.race-banner b{display:inline-block;font-size:clamp(42px,7vw,96px);font-style:italic;letter-spacing:8px;color:#f4f8ec;background:linear-gradient(90deg,transparent,#0b100bcc 15%,#0b100bcc 85%,transparent);padding:4px 12vw;text-shadow:0 0 30px var(--banner,#d6fa45)}.race-banner span{display:block;margin-top:8px;font-size:14px;letter-spacing:4px;color:var(--banner,#d6fa45)}
.race-banner[data-kind=final]{--banner:#ff6a4a}.race-banner[data-kind=flight]{--banner:#7fe9ff}.race-banner[data-kind=boost]{--banner:#ffcf5a}
.race-banner.show{animation:banner-sweep 2.2s cubic-bezier(.16,1,.3,1) forwards}@keyframes banner-sweep{0%{opacity:0;transform:translateX(30%) skew(-12deg)}14%{opacity:1;transform:translateX(0) skew(-12deg)}78%{opacity:1;transform:translateX(-3%) skew(-12deg)}100%{opacity:0;transform:translateX(-30%) skew(-12deg)}}
@media(max-width:700px){.cine-card{bottom:14vh}.cine-card span{font-size:11px}.race-banner b{letter-spacing:3px}}
/* Thumb controls: coarse-pointer tablets and landscape phones, as well as narrow screens. */
@media (pointer:coarse),(max-width:700px){
 #touchControls{display:flex;position:fixed;z-index:10;left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));align-items:flex-end;justify-content:space-between;gap:12px;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none}
 .stick-zone{width:140px;flex:none;text-align:center}.joystick{width:136px;height:136px;border-radius:50%;position:relative;pointer-events:auto;touch-action:none;background:radial-gradient(circle,#101e2780 0 43%,#20352788 44% 46%,#0c141bb3 47%);border:1px solid #efffc84d;box-shadow:inset 0 0 28px #0006,0 4px 20px #0004}
 .joystick:before,.joystick:after{content:'';position:absolute;background:#e9ffd71c;pointer-events:none}.joystick:before{height:1px;left:12px;right:12px;top:50%}.joystick:after{width:1px;top:12px;bottom:12px;left:50%}
 .stick-axis{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-around;color:#e9ffb599;font-size:25px}.stick-axis i{font-size:14px;font-style:normal;color:#e9ffb54a}
 .joystick-knob{position:absolute;left:calc(50% - 27px);top:calc(50% - 27px);width:54px;height:54px;border-radius:50%;border:2px solid #d6fa4599;background:radial-gradient(circle at 35% 25%,#c5d48e,#566638 65%,#26351c);box-shadow:0 4px 12px #0008;pointer-events:none;will-change:transform}
 .joystick.held{border-color:#d6fa45;box-shadow:0 0 24px #d6fa4526}.joystick.held .joystick-knob{border-color:#eeffaf}.stick-label{display:block;margin-top:9px;font-size:10px;letter-spacing:1px;color:#dce6d0;text-shadow:0 1px 5px #000}
 .touch-actions{width:180px;display:flex;flex-direction:column;gap:8px;pointer-events:none}.touch-tools,.touch-boosts,.touch-pedals{display:flex;gap:8px}
 #touchControls button{pointer-events:auto;touch-action:none;flex:1;min-width:0;min-height:44px;padding:0 6px;border-radius:14px;border:1px solid #dbeeb54d;background:#13202bd9;color:#eff5e4;font-size:12px;font-weight:600;box-shadow:0 3px 14px #0004;transition:background .1s,box-shadow .1s}
 #touchControls .touch-pedals button{height:64px;font-size:16px}.touch-pedals [data-touch-key="w"]{flex:1.35!important;background:#d6fa45df!important;color:#172208!important;border-color:#e5ff8e!important}.touch-pedals span{font-size:24px;margin-left:5px}
 #touchControls button.held{background:#d6fa45;color:#14200b;box-shadow:inset 0 0 0 2px #edffb0,0 0 20px #d6fa4555}#touchControls .touch-pedals button.held{background:#efffc1!important}
 .touch-boosts [data-touch-key="shift"]{border-color:#6ce0ff99!important;color:#9eeaff!important}.touch-boosts [data-touch-key="shift"].held{color:#10252d!important;background:#80e5ff!important}
 .race-keys{display:none}.race-top{top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right))}.position{width:125px;padding:8px}.position>small{font-size:8px}.position>div>b{font-size:42px}#leaderboard li{font-size:9px;gap:5px;padding:3px 0}.lap-panel>span{font-size:8px;letter-spacing:0}.lap-panel>b{font-size:12px;margin:8px 0}.lap-panel em{font-size:25px}.lap-panel>small{font-size:12px}.speed-panel{width:90px}.speed-panel>b{font-size:48px}.speed-panel>span{font-size:7px;letter-spacing:0}.speed-panel>small{font-size:9px}.nitro kbd{display:none}.nitro>div{width:55px}
 .race-bottom{bottom:calc(max(18px,env(safe-area-inset-bottom)) + 184px);left:16px;right:16px;gap:8px;pointer-events:none;align-items:flex-end}.minimap{padding:5px;width:94px}.minimap canvas{width:84px;height:64px}.minimap span{font-size:7px}.skill-meter{width:132px;padding:8px}.skill-meter>div:first-child{font-size:10px}.skill-meter small{font-size:8px}.skill-meter kbd,.item-slot kbd{display:none}.item-slot{min-width:0;padding:7px;gap:5px;margin:0}.item-slot>span{width:22px;height:22px;font-size:14px}.item-slot b{font-size:10px}.item-slot small{display:none}
 #pauseBtn{top:132px;right:max(12px,env(safe-area-inset-right));width:44px;height:44px}#raceMessage{font-size:12px;max-width:90vw}#actionTitle{font-size:21px;letter-spacing:2px}#actionBanner{bottom:46%}#actionDetail{font-size:9px;letter-spacing:0}
 body.cinematic #touchControls,body.cinematic #touchControls *{pointer-events:none!important}
}
@media (pointer:coarse) and (orientation:landscape){
 .stick-zone{width:124px}.joystick{width:120px;height:120px}.touch-actions{width:206px;gap:6px}.touch-tools,.touch-boosts,.touch-pedals{gap:6px}#touchControls .touch-pedals button{height:52px}.stick-label{font-size:9px}
 .race-bottom{left:164px;right:240px;bottom:max(18px,env(safe-area-inset-bottom));justify-content:center}.minimap{width:80px}.minimap canvas{width:70px;height:50px}.skill-meter{width:120px}.skill-meter small{display:none}.item-slot>div{display:none}#leaderboard li{padding:1px 0}#pauseBtn{top:110px}#raceMessage{top:29%;font-size:11px}#actionBanner{bottom:42%}
}
@media(max-width:370px){.stick-zone{width:112px}.joystick{width:110px;height:110px}.touch-actions{width:164px}#touchControls{left:10px;right:10px;gap:8px}.race-bottom{left:10px;right:10px;gap:4px}.skill-meter{width:115px}.item-slot b{max-width:48px;overflow:hidden;text-overflow:ellipsis}}
@media(pointer:coarse),(max-width:700px){#leaderboard{padding-top:7px;margin-top:5px}#leaderboard li{margin:5px 0;line-height:12px}#leaderboard small{font-size:9px}.skill-meter .charge{margin:8px 0}}
@media(pointer:coarse) and (orientation:landscape){#leaderboard li{margin:2px 0;padding:0;line-height:11px}.position>div>b{font-size:35px}.position{padding:6px 8px}#leaderboard{padding-top:5px}}
@media(pointer:coarse) and (orientation:landscape) and (max-width:740px){.race-bottom .minimap{display:none}.race-bottom{left:150px;right:230px;gap:5px}.skill-meter{width:110px}}
/* Legendary fuel: rainbow speedo, item slot and drive state while it burns. */
body.legend-active .speed-panel>b,body.legend-active #driveState,body.legend-active #actionTitle{background:linear-gradient(90deg,#ff3b3b,#ffb02e,#fff23a,#42f56c,#3ad7ff,#8a5bff,#ff3bd1,#ff3b3b);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;animation:legend-hue .8s linear infinite}
body.legend-active #itemSlot,body.legend-active .skill-meter{box-shadow:0 0 0 2px #fff6,0 0 26px #ff7ae6aa,0 0 46px #5fdcff77;animation:legend-glow 1.2s ease-in-out infinite alternate}
@keyframes legend-hue{to{background-position:200% 0}}@keyframes legend-glow{from{filter:hue-rotate(0)}to{filter:hue-rotate(300deg)}}
