:root{color-scheme:dark;--gold:#ffcc59;--bg:#081320;--panel:rgba(8,19,31,.93);--text:#f4f7f9;--faint:#a8bac9;--line:rgba(217,240,255,.2)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#0b1927;color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;user-select:none;-webkit-user-select:none;touch-action:none}button{font:inherit;cursor:pointer;color:inherit;-webkit-touch-callout:none;user-select:none;touch-action:manipulation}button:focus-visible{outline:2px solid #a7f9ff;outline-offset:3px}#scene{width:100vw;height:100dvh;position:absolute;inset:0;display:block;background:linear-gradient(180deg,#172f47 0%,#f3a45d 62%,#4b3640 100%)}#vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(1,6,13,.88),rgba(4,12,21,.52) 36%,transparent 75%),linear-gradient(0deg,rgba(3,7,13,.52),transparent 31%);transition:opacity .25s}.racing #vignette{opacity:0}.screen{position:absolute;inset:0;display:flex;flex-direction:column;padding:clamp(16px,3vw,35px);z-index:5}.hidden,[hidden]{display:none!important}.home-head,.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:32px}.studio{font-size:11px;letter-spacing:.22em;font-weight:900}.studio-line{color:#8a9fae}.dot,.pulse{display:inline-block;background:var(--gold);width:8px;height:8px;border-radius:50%;box-shadow:0 0 16px var(--gold);margin-right:6px}.small-btn,.outline,.back{background:rgba(10,24,38,.76);border:1px solid var(--line);border-radius:9px;padding:10px 15px;font-size:12px;font-weight:850;letter-spacing:.065em}.small-btn:hover,.outline:hover,.back:hover{border-color:var(--gold)}.hero{display:flex;flex:1;flex-direction:column;align-items:flex-start;justify-content:center;width:min(690px,72vw);margin-left:1.5vw;gap:0}.overline,.eyebrow{font-size:11px;color:var(--gold);letter-spacing:.2em;font-weight:900}.hero h1{font-size:clamp(48px,7.6vw,120px);line-height:.83;letter-spacing:-.075em;font-style:italic;margin:18px 0 18px;font-weight:1000;text-shadow:0 9px 48px #0008}.hero h1 strong{color:var(--gold);font-weight:1000}.hero h1 em{font-style:normal;letter-spacing:.04em}.h1slash{display:inline-block;color:var(--gold);font-weight:300;transform:translateX(8px)}.tagline{line-height:1.6;font-size:clamp(12px,1.3vw,17px);color:#d8e3ee;margin:0 0 23px}.tagline b{color:#fff}.action-bar{display:flex;gap:12px;flex-wrap:wrap}.primary{background:linear-gradient(120deg,#ffdd7e,#f6ac37);color:#162032;border:0;border-radius:10px;padding:14px 24px;min-height:50px;font-weight:1000;font-style:italic;letter-spacing:.065em;box-shadow:0 8px 30px #f99c3449}.primary:hover{filter:brightness(1.12)}.primary span{margin-left:24px}.hero-info{margin-top:25px;display:flex;gap:15px;flex-wrap:wrap;font-size:10px;letter-spacing:.1em;color:#b5cbd9;font-weight:800}.home-bottom{display:flex;justify-content:space-between;color:#b9c7d1;font-size:10px;font-weight:800;letter-spacing:.14em}.section-head{align-items:flex-start}.head-center{text-align:center}.head-center>span{font-size:10px;letter-spacing:.17em;color:var(--gold);font-weight:800}.head-center h2{font-size:clamp(22px,3vw,40px);line-height:1.05;font-style:italic;margin:7px}.head-extra{font-size:10px;color:#ddd;letter-spacing:.14em;border:1px solid var(--line);border-radius:9px;padding:9px}.car-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-content:end;flex:1;padding-bottom:8vh;max-width:980px;width:100%;margin:auto}.car-option{border:1px solid var(--line);background:rgba(7,18,28,.8);padding:14px 12px 18px;text-align:left;border-radius:13px;min-width:0;transition:background .15s, transform .15s}.car-option.selected{border-color:var(--gold);background:rgba(45,39,28,.92);transform:translateY(-6px);box-shadow:0 8px 40px #000a}.car-option .swatch{height:10px;width:44px;border-radius:3px;background:var(--car);box-shadow:0 0 16px var(--car);margin-bottom:18px}.car-option h3{font-size:clamp(14px,2vw,24px);font-style:italic;margin:0 0 6px}.car-option p{color:#a5bccb;font-size:12px;margin:0}.car-option .car-preview{font-size:clamp(24px,3vw,45px);text-align:center;display:block;margin:6px 0 14px;filter:drop-shadow(0 10px 7px #000)}.garage-bottom{position:absolute;bottom:clamp(13px,2vw,30px);left:clamp(16px,3vw,35px);right:clamp(16px,3vw,35px);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:13px;color:#d8e2eb}.track-panel{margin:auto 0 auto auto;max-width:510px;background:rgba(8,20,32,.9);border:1px solid var(--line);border-radius:20px;padding:clamp(22px,3vw,37px);box-shadow:0 20px 60px #0009}.track-heading{display:flex;align-items:center;gap:12px;font-size:clamp(21px,2.6vw,36px);font-weight:1000;font-style:italic}.track-panel p{line-height:1.55;color:#d1e1ea;font-size:14px}.track-chips{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0}.track-chips span{background:#ffffff0e;border:1px solid #ffffff24;padding:7px 10px;border-radius:8px;font-size:10px;font-weight:800;letter-spacing:.09em}.pilot-brief{background:#fdbd4e11;border-left:3px solid var(--gold);padding:12px 16px;margin:20px 0}.pilot-brief b{font-size:11px;color:var(--gold);letter-spacing:.1em}.pilot-brief p{font-size:12px;margin:7px 0 0}.track-panel .primary{width:100%}#raceHud{position:absolute;inset:0;z-index:7;pointer-events:none}.hud-head{position:absolute;top:env(safe-area-inset-top,0px);left:env(safe-area-inset-left,0px);right:env(safe-area-inset-right,0px);display:flex;gap:8px;align-items:stretch;padding:10px 13px;justify-content:center}.hud-pill{background:rgba(5,15,27,.82);border:1px solid #ffffff27;border-radius:10px;min-width:88px;padding:6px 14px;backdrop-filter:blur(4px)}.hud-pill small{display:block;font-size:9px;letter-spacing:.16em;color:#9db3c2;font-weight:900}.hud-pill b{font-style:italic;font-size:clamp(18px,2.4vw,31px);white-space:nowrap}.hud-pill.place b{color:var(--gold)}.hud-pill b sup{font-size:11px}.hud-pill b i{font-size:12px;color:#9db3c2;font-weight:500}.pausebtn{pointer-events:auto;background:rgba(5,15,27,.82);border:1px solid #ffffff27;border-radius:10px;font-size:19px;padding:6px 17px}.rankbar{position:absolute;top:68px;left:50%;transform:translateX(-50%);display:flex;gap:6px}.rank-chip{background:rgba(5,15,27,.76);border:1px solid #ffffff22;border-radius:6px;padding:4px 9px;font-size:10px;font-weight:800;white-space:nowrap}.rank-chip.me{border-color:var(--gold);color:var(--gold)}.racebottom{position:absolute;bottom:max(14px,env(safe-area-inset-bottom));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));display:flex;align-items:flex-end;justify-content:space-between;gap:9px}.steering,.actions{display:flex;gap:10px;pointer-events:auto}.steering button,.actions button{height:clamp(66px,10vw,90px);width:clamp(67px,11vw,100px);background:#07182ab5;border:1px solid #bde6fb6b;border-radius:17px;font-size:29px;font-weight:850;backdrop-filter:blur(5px);touch-action:none}.actions #boost{background:#e6a33aee;border-color:#ffda8a;color:#141c27;box-shadow:0 0 30px #ffb64662}.actions #drift{background:#07182ab5}.steering button.pressed,.actions button.pressed{transform:scale(.94);filter:brightness(1.3)}.actions button small{font-size:9px;display:block;letter-spacing:.1em}.race-extra{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:170px}.race-extra>span{font-size:10px;color:#c7d9e6;letter-spacing:.1em;text-shadow:0 3px 10px #000;font-weight:800}.boostbar{width:min(210px,23vw);background:rgba(6,17,27,.82);border:1px solid #ffffff44;border-radius:9px;padding:7px 8px;display:flex;align-items:center;gap:8px;font-size:10px;font-weight:900}.boostbar>div{flex:1;height:9px;background:#354959;border-radius:20px;overflow:hidden}.boostbar>div i{display:block;background:linear-gradient(90deg,#e98c3c,#ffea89);height:100%;width:100%}.boostbar strong{font-size:10px}.count{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-size:clamp(90px,22vw,220px);font-weight:1000;font-style:italic;color:#ffe09a;text-shadow:0 0 50px #ff8328,0 12px 30px #000}.toast{position:absolute;top:33%;left:50%;transform:translateX(-50%);background:rgba(9,23,35,.86);padding:12px 23px;border:1px solid #ffd47a88;border-radius:12px;font-size:clamp(12px,2vw,19px);font-weight:950;color:var(--gold);white-space:nowrap}.orientation{display:none}.modal{position:absolute;inset:0;z-index:9;background:#02060bbf;display:flex;align-items:center;justify-content:center;padding:18px}.modal-card{max-width:530px;width:min(96vw,530px);background:#0c1b2b;border:1px solid #5e81916e;border-radius:21px;padding:clamp(20px,3vw,34px);text-align:center;box-shadow:0 30px 80px #000e}.modal-card h2{font-size:clamp(25px,4vw,40px);font-style:italic;margin:10px 0}.modal-card p{font-size:13px;color:#b9cdda;line-height:1.55}.modal-card button{margin:5px;min-width:180px}.medal{font-size:48px}.finish-card{max-height:94vh;overflow:auto}.finish-order{display:grid;grid-template-columns:1fr;gap:4px;text-align:left;margin:12px auto;max-width:350px}.finish-order .row{padding:6px 13px;background:#ffffff12;border-radius:7px;font-weight:750;font-size:12px;display:flex;justify-content:space-between}.finish-order .row.me{border:1px solid #ffcf70}.finish-actions{display:flex;justify-content:center;flex-wrap:wrap}.help-grid{display:grid;grid-template-columns:36px 1fr;gap:9px;text-align:left;align-items:center}.help-grid>span{font-size:24px;color:var(--gold)}.help-grid p{margin:0;font-size:12px}.fine{font-size:10px!important}#unsupported{position:absolute;z-index:40;inset:0;background:#061321;padding:15vh 12vw;text-align:center}body:has(#unsupported:not([hidden])) #app{display:none}@media(max-height:550px){.screen{padding:10px 17px}.hero h1{font-size:clamp(43px,8vh,68px);margin:8px 0}.hero{margin-left:10px}.tagline{margin-bottom:12px}.hero-info{margin-top:12px}.primary{padding:10px 18px;min-height:40px}.car-picker{padding-bottom:9vh}.car-option{padding:9px}.car-option .car-preview{margin:0 0 5px}.car-option .swatch{margin-bottom:7px}.racebottom{bottom:8px}.steering button,.actions button{height:62px;width:68px}.hud-head{padding:5px}.hud-pill{padding:4px 10px}.rankbar{top:57px}.home-bottom{font-size:9px}}@media(max-width:630px){.studio-line,.head-extra,.hud-pill.time{display:none}.hero{width:92vw}.hero h1{font-size:clamp(44px,10vw,80px)}.hero-info{gap:9px}.car-picker{gap:5px}.car-option{padding:7px}.car-option h3{font-size:11px}.car-option p{font-size:9px}.car-option .car-preview{font-size:24px}.garage-bottom{font-size:10px}.hud-pill{min-width:50px;padding:4px 7px}.hud-pill b{font-size:16px}.hud-pill small{font-size:7px}.race-extra>span{display:none}.boostbar{width:105px}.boostbar>span{display:none}.racebottom{left:7px;right:7px}.steering,.actions{gap:5px}.steering button,.actions button{width:53px;height:55px;font-size:21px}.rank-chip{font-size:8px;padding:2px 4px}}@media(orientation:portrait) and (max-width:850px){#raceHud .orientation{position:absolute;display:block;top:45%;left:4%;width:92%;text-align:center;background:#071825dd;padding:18px;border-radius:12px;color:#ffcf76;font-size:13px;letter-spacing:.1em;font-weight:900}.racebottom{bottom:13px}.hero h1{font-size:clamp(52px,10vw,90px)}.hero{width:95vw}}@media(prefers-reduced-motion:reduce){.car-option{transition:none}}

/* Actualizaciones visibles desde el menú sin invadir la carrera */
.home-bottom{align-items:center;gap:12px}.home-bottom .edition{color:#ffcf79;margin-left:8px}.home-bottom .update-btn{font-size:10px;padding:9px 12px;min-height:39px;white-space:nowrap;letter-spacing:.06em}.update-btn:disabled{opacity:.7;cursor:progress}@media(max-width:670px){.home-bottom{font-size:8px;letter-spacing:.03em}.home-bottom .update-btn{font-size:9px;padding:8px 10px}.home-bottom .edition{display:block;margin:4px 0 0}}

/* V0.3.3 — tarjetas táctiles de selección real, tres mundos 3D, feedback de colisión. */
.track-layout{width:min(1050px,95vw);margin:auto;display:flex;flex-direction:column;gap:12px;max-height:calc(100dvh - 88px);overflow:auto;padding:2px 5px 12px}
.track-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.track-card{border:2px solid #68869b66;background:linear-gradient(155deg,#132e43ed,#07141fe8);padding:17px 12px;min-height:170px;text-align:center;border-radius:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;box-shadow:0 15px 27px #0008;touch-action:manipulation}
.track-card.selected{border-color:#ffcb68;background:linear-gradient(155deg,#344359,#141f2d);box-shadow:0 0 22px #ffbd3544}
.track-card:active{transform:scale(.98)}.track-icon{font-size:clamp(27px,4vw,47px)}.track-card-body{display:flex;flex-direction:column;align-items:center;gap:5px}
.track-card-body strong{font-size:clamp(12px,2vw,21px);font-style:italic}.track-card-body small{font-size:11px;color:#d4e1eb;line-height:1.4}.track-card-body .track-tag{color:#ffd27b;font-size:9px}
.track-pick{color:#ffdc92;font-weight:900;font-size:11px}.track-commit{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#0b2035ef;padding:12px 16px;border:1px solid #89adbd54;border-radius:12px}
.track-commit strong{font-size:clamp(12px,2vw,18px);color:#ffdc92}.track-commit p{font-size:10px;color:#d0dfe9;flex:1}.track-commit .primary{padding:11px 16px;white-space:nowrap}
#impactFx{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;background:radial-gradient(ellipse at center,transparent 30%,#e94b215c 100%)}
#impactFx.impact{animation:impactblink .32s ease-out}@keyframes impactblink{0%{opacity:0}15%{opacity:.85}100%{opacity:0}}
@media(max-height:600px){.track-layout{gap:6px;max-height:calc(100dvh - 57px)}.track-card{min-height:110px;padding:7px;gap:4px}.track-icon{font-size:24px}.track-card-body small{font-size:9px}.track-commit{padding:6px 12px}.track-commit p{display:none}.track-commit .primary{min-height:35px}}
@media(max-width:600px){.track-gallery{gap:5px}.track-card{min-height:118px;padding:5px}.track-card-body strong{font-size:11px}.track-card-body .track-tag{display:none}.track-commit{flex-wrap:wrap;justify-content:center;text-align:center}.track-commit .primary{width:100%}}

/* v0.3.4: indicador compacto de agarre/derrape; no ocupa la pista central */
.drift-hud{position:absolute;z-index:8;left:max(12px,env(safe-area-inset-left,0px));top:110px;width:155px;padding:7px 10px;background:#06121dba;border:1px solid #ffffff30;border-radius:10px;color:#bdd4db;font-weight:900;letter-spacing:.065em;font-size:10px;opacity:.55;transition:border-color .15s,opacity .15s,background .15s}
.drift-hud.active{opacity:1;background:#112a37db;border-color:#58dfff;color:#bcf8ff;box-shadow:0 0 15px #3bdcff44}
.drift-meter{height:5px;border-radius:100px;background:#fff2;overflow:hidden;margin-top:5px}
.drift-meter i{display:block;width:0;height:100%;background:linear-gradient(90deg,#40cfff,#f4f5a2);transition:width .12s}
#drift.pressed{background:#3a92ad;border-color:#b0faff;box-shadow:0 0 14px #38d2fe}
@media(max-height:470px){.drift-hud{top:67px;width:112px;font-size:8px;padding:5px 8px}}
