/* 0.9 — the race is the screen. */
body[data-view=race] main,body.in-race main{max-width:1700px;padding:14px 2.4vw 25px}body[data-view=race]{background-image:linear-gradient(#061820ed,#061820f7),url('assets/art/arena-v07.webp')}.race-status{height:35px;display:flex;align-items:center;gap:18px;font-size:10px;letter-spacing:1.6px;color:#e7d29c;margin:0 0 9px}.race-status>span{display:flex;align-items:center;gap:8px;font-weight:900}.race-status>b{margin-left:auto;color:#bed3ca;font-size:10px}.race-status>small{font-size:9px;color:#809d9e}.cockpit-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px;align-items:start}.race-world{min-width:0}.race-hud-scores{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px}.race-team{display:flex;align-items:center;gap:11px;background:linear-gradient(110deg,#284641,#10272e);border:1px solid #688c7955;border-left:3px solid #84d8c1;border-radius:9px;padding:9px 12px;height:65px}.race-team.team-1{border-left-color:#eba77d;background:linear-gradient(110deg,#483d36,#142830)}.race-team>img{width:42px;height:45px;object-fit:cover;border-radius:6px}.race-team>div{flex:1;min-width:0}.race-team>div>span{font-size:9px;color:#d0ddd3;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.race-distance{display:flex;align-items:center;gap:6px}.race-distance>b{font-size:26px;font-weight:1000;color:#f4eacf}.race-distance>small{font-size:10px;color:#97aea4}.race-distance>.momentum-pips{display:flex;gap:4px;margin-left:auto}.momentum-pips>i{width:7px;height:11px;border:1px solid #9cc4ab77;transform:skew(-15deg);background:#0a2227}.momentum-pips>i.charged{background:#f0d082;border-color:#ffe3a1;box-shadow:0 0 8px #dfb96044}.race-team.team-active{box-shadow:inset 0 0 20px #a6d39312}.race-cockpit .arena-stage{margin:0;border-radius:16px;height:clamp(275px,calc(100svh - 330px),600px);aspect-ratio:auto;background-position:center 55%}.race-cockpit .arena-sign{top:10px;padding:7px 15px}.race-cockpit .arena-sign span{font-size:9px}.race-cockpit .arena-sign small{font-size:7px}.race-cockpit .arena-key{font-size:8px;bottom:5px;gap:14px;padding:4px}.race-cockpit .arena-stage .arena-event{display:none}.race-cockpit .arena-stage.zoomed{height:620px}.race-cockpit .arena-stage.zoomed .arena-map{height:600px}.crew-dock{margin-top:11px}.dock-label{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.4px;color:#d8c184;margin:0 4px 8px}.dock-label small{font-size:8px;color:#91ada8}.driver-hand{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.driver-card{height:126px;position:relative;isolation:isolate;text-align:left;overflow:hidden;padding:0;border:1px solid #b19b6255;border-radius:10px;background:#112830;transition:transform .2s,border-color .2s!important}.driver-card:disabled{opacity:.85}.driver-card>img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;transition:transform .4s}.driver-card:hover:not(:disabled)>img{transform:scale(1.07)}.driver-card>div{position:absolute;bottom:0;left:0;right:0;padding:28px 12px 10px;background:linear-gradient(transparent,#071b23f5 60%)}.driver-card>div>b{font-size:18px;font-style:italic;letter-spacing:-.4px;color:#f8efdc}.driver-card.driver-selected{border:2px solid #f2d489;box-shadow:0 0 18px #ebc36722}.driver-stat{position:absolute;top:7px;left:8px;display:flex;align-items:center;gap:5px;background:#08232cd9;padding:4px 7px;border-radius:4px;color:#f1d391;font-size:18px;font-weight:900}.driver-stat small{font-size:7px;font-weight:600;color:#bbd2c7}.driver-fatigue{display:flex;align-items:center;gap:3px;margin-top:5px}.driver-fatigue>i{width:5px;height:7px;background:#8eaa9a4d;border-radius:1px}.driver-fatigue>i.tired{background:#f09c72}.driver-fatigue>small{font-size:6px;letter-spacing:.6px;margin-left:5px;color:#c1d4c8}.evolution-ready{position:absolute;right:6px;top:8px;font-size:6px;font-style:normal;background:#e9cb82;color:#122832;padding:5px;border-radius:4px;animation:ready-breathe 2.5s ease-in-out infinite}.action-dock{min-width:0;padding:12px;border:1px solid #bfa76555;border-radius:13px;background:linear-gradient(150deg,#233c3deb,#0e242eed);box-shadow:0 12px 35px #0004}.active-driver{height:142px;position:relative;overflow:hidden;border-radius:8px;margin-bottom:11px;border:1px solid #a9936366}.active-driver>img{width:100%;height:100%;object-fit:cover;object-position:50% 29%}.active-driver>div{position:absolute;inset:0;padding:43px 13px 10px;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(90deg,#09232bcc,transparent),linear-gradient(0deg,#08202cec,transparent 90%)}.active-driver h2{font-size:27px;font-style:italic;line-height:1.05;color:#ffebc0;margin:5px 0}.active-driver small{font-size:7px;letter-spacing:1.5px;color:#e5cd93}.active-driver span{font-size:8px;color:#b7cdbd}.pace-switch{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:10px}.pace-switch button{display:flex;justify-content:center;align-items:center;gap:6px;padding:9px 3px;background:#102731;border:1px solid #73978844;border-radius:5px;font-size:9px}.pace-switch button>b{font-size:16px;color:#eacb81}.pace-switch button[aria-pressed=true]{background:#365347;border-color:#ddc47f}.signature-control{display:flex;align-items:center;gap:10px;width:100%;min-height:86px;position:relative;isolation:isolate;padding:11px 10px;overflow:hidden;text-align:left;background:#284039;border:1px solid #b7b87688;border-radius:8px;margin-bottom:8px}.signature-control>img{position:absolute;right:0;top:0;width:60%;height:100%;object-fit:cover;opacity:.18;mask-image:linear-gradient(90deg,transparent,black);z-index:-1}.signature-control .ability-glyph{display:grid;place-items:center;min-width:34px;height:40px;font-size:30px;color:#ead398;text-shadow:0 0 15px #ffd57988}.signature-control>span:nth-of-type(2){min-width:0;flex:1}.signature-control small,.evolution-control small{display:block;font-size:6px;letter-spacing:.8px;color:#d4c28d;margin-bottom:5px}.signature-control b{display:block;font-size:15px;font-style:italic;color:#f6e9c6}.signature-control em{display:block;font-size:9px;line-height:1.4;font-style:normal;font-weight:400;color:#c4d4bf;margin-top:4px}.signature-control>i{font-style:normal;font-size:20px;color:#d0d79b}.signature-control.armed{border-color:#ffeeaa;background:#465837;box-shadow:0 0 18px #edd58126}.signature-control:disabled{opacity:.5}.evolution-control{display:flex;gap:10px;align-items:center;width:100%;text-align:left;padding:6px;background:#2c2a3d;border:1px solid #c6acd155;border-radius:8px;margin-bottom:9px}.evolution-control>img{width:40px;height:50px;object-fit:cover;border-radius:4px}.evolution-control b{display:block;font-size:12px;color:#f0e1fa}.evolution-control em{display:block;font-size:8px;font-style:normal;color:#bfaecc;margin-top:4px}.evolution-control strong{margin-left:auto;font-size:23px;color:#e1c789}.evolution-control.ready{border-color:#f6d496;animation:ready-breathe 2.5s ease-in-out infinite}.evolution-control:disabled{opacity:.65}.tactic-hand{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.tactic-hand button{padding:8px 3px 7px;text-align:center;background:linear-gradient(#26454b,#122a34);border:1px solid #8bab9866;border-radius:6px;min-width:0}.tactic-hand button>b{display:block;font-size:22px;color:#e1ce98;height:26px}.tactic-hand button>span{display:block;font-size:7px;margin-top:4px;color:#d5dcc9}.tactic-hand button[aria-pressed=true]{border-color:#efd17f;background:linear-gradient(#6c683c,#294137);transform:translateY(-3px)}.tactic-hand button:disabled{opacity:.28}.tactic-hint{font-size:8px;line-height:1.5;color:#afc7bf;min-height:24px;margin:8px 0}.race-roll{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:13px 16px;background:linear-gradient(115deg,#ffe4a0,#ddb359)!important;border:1px solid #fff0b7!important;border-radius:7px!important;color:#162e31!important;box-shadow:0 4px 0 #8a672c,0 8px 20px #0004;margin:8px 0 9px;font-weight:1000}.race-roll>span{font-size:19px;font-style:italic;line-height:1.1}.race-roll .roll-glyph{font-size:38px;line-height:1}.race-roll small{display:block;font-size:8px;font-style:normal;font-weight:600;margin-top:5px}.race-roll>b{font-size:25px}.race-roll:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-2px)}.race-roll:disabled{opacity:.45}.pit-control,.recovery-control{width:100%;font-size:10px;padding:10px;background:#15323a;border:1px solid #8cbaa36b;border-radius:6px;margin-top:7px}.race-help{font-size:9px;color:#a1bcb5;margin-top:12px}.race-help summary{cursor:pointer;padding:5px}.race-help p,.race-help li{font-size:10px;line-height:1.7;margin:6px 4px}.race-history{margin-top:10px}.landed-roll .dice-tray{height:150px;margin:5px 0;background:radial-gradient(ellipse,#53664d,#10272f 65%);border-radius:10px}.landed-roll .dice-caption{bottom:8px;font-size:7px}.distance-reveal{text-align:center;padding:11px 0 17px}.distance-reveal>small{font-size:8px;letter-spacing:2px;color:#dfc17d}.distance-reveal>b{display:block;font-size:58px;line-height:1.05;font-style:italic;color:#fbe1a5}.distance-reveal>b>span{font-size:16px;font-style:normal;margin-left:7px;color:#adcebc}.pit-symbol{display:block;text-align:center;font-size:76px;color:#afd1af}.go-button{justify-content:space-around}.rival-wait{font-size:13px;text-align:center;padding:15px;color:#d0dba9}.race-end-actions{margin:15px 0}.race-complete-note{padding:20px;color:#d8c594;font-style:italic}.speed-trail{fill:none;stroke:#ffe29b;stroke-width:9;stroke-linecap:round;filter:drop-shadow(0 0 7px #f5c567);stroke-dasharray:20 12;animation:trail-flow .35s linear infinite;pointer-events:none;opacity:.8}.race-cockpit .arena-racer{filter:drop-shadow(0 5px 4px #000b) drop-shadow(0 0 9px #ddbe7855)}
/* Real game events stage the art and dice; no simulated results. */
.race-theatre{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:radial-gradient(ellipse,#183c42b8,#03131bf2);backdrop-filter:blur(7px);overflow:hidden;--power:#f2ca78}.race-scene{width:min(1040px,92vw);height:min(680px,84svh);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;pointer-events:none}.skip-race-fx{position:absolute;bottom:22px;right:28px;display:flex;align-items:center;gap:10px;background:#102a34e8;border:1px solid #e1cf9788;color:#e9dcbb;padding:11px 16px;font-size:11px;z-index:5}.cinema-heading{position:absolute;top:5%;left:0;right:0;text-align:center}.cinema-heading>small{font-size:11px;letter-spacing:3px;color:#b7d1c9}.cinema-heading h2{font-size:clamp(32px,6vw,72px);font-weight:1000;font-style:italic;line-height:1;margin:14px 0;color:#f6dd9f;letter-spacing:-2px;text-shadow:0 5px 0 #071923}.hero-die{position:relative;width:100%;height:340px;display:grid;place-items:center}.hero-die .dice-tray{width:100%;height:340px;background:radial-gradient(ellipse at 50% 80%,#d2ad6d25,transparent 45%);border:0;overflow:visible;box-shadow:none;perspective:1100px;margin:0}.hero-die .die-camera{width:150px;height:150px;perspective:950px;margin:0}.hero-die .physical-die{width:150px;height:150px}.hero-die .cube-face{padding:23px;gap:10px;border-radius:24px;border-width:3px;box-shadow:inset 0 0 26px #fff6}.hero-die .face-1{transform:translateZ(75px)}.hero-die .face-2{transform:rotateY(90deg) translateZ(75px)}.hero-die .face-3{transform:rotateX(90deg) translateZ(75px)}.hero-die .face-4{transform:rotateX(-90deg) translateZ(75px)}.hero-die .face-5{transform:rotateY(-90deg) translateZ(75px)}.hero-die .face-6{transform:rotateY(180deg) translateZ(75px)}.hero-die .dice-caption{display:none}.hero-die .die-shadow{top:255px;width:210px;height:48px;filter:blur(13px)}.dice-racer-backdrop{position:absolute;left:-10%;top:0;height:100%;width:55%;object-fit:cover;opacity:.28;mask-image:linear-gradient(90deg,transparent,black 40%,transparent);z-index:-2}.cinema-roll-result{text-align:center;position:absolute;bottom:6%;left:0;right:0}.cinema-roll-result>b{display:block;font-size:clamp(38px,6vw,70px);font-style:italic;color:#ffe4a2;text-shadow:0 4px 0 #08232e}.cinema-roll-result>span{font-size:17px;color:#b9dccf;letter-spacing:1px}.ability-cut-in{display:flex;align-items:center;gap:40px;position:relative;width:100%;height:360px;background:linear-gradient(110deg,#143237,#23392f);border-top:3px solid var(--power);border-bottom:3px solid var(--power);box-shadow:0 0 65px #e0b16d33;isolation:isolate}.ability-cut-in>img{height:430px;width:38%;object-fit:cover;object-position:50% 25%;transform:rotate(-8deg);border:2px solid var(--power);border-radius:15px;box-shadow:10px 20px 40px #001923bb;margin-left:4%}.ability-cut-in>div{flex:1;padding-right:28px}.ability-cut-in small{font-size:10px;letter-spacing:2px;color:#b8d4c1}.ability-cut-in h2{font-size:clamp(32px,5vw,65px);font-style:italic;line-height:.98;margin:20px 0;color:var(--power);text-shadow:0 4px 0 #08222a}.ability-cut-in p{font-size:15px;line-height:1.6;color:#caddca;max-width:340px}.power-symbol{position:absolute;right:8%;top:7%;font-size:240px;opacity:.09;z-index:-1;color:var(--power)}.race-theatre[data-power=rest],.race-theatre[data-power=tune]{--power:#aee5aa}.race-theatre[data-power=rage],.race-theatre[data-power=launch]{--power:#ffad75}.race-theatre[data-power=corner],.race-theatre[data-power=patient]{--power:#cbb0ed}.power-rays{position:absolute;inset:-80%;background:repeating-conic-gradient(from 0deg,transparent 0 13deg,#e7c47a14 14deg 16deg);animation:power-turn 30s linear infinite;z-index:-3}.evolution-pair{display:flex;justify-content:center;align-items:center;gap:45px;margin-top:25px}.cinema-card{width:210px;height:310px;border:3px solid #f6d899;border-radius:16px;padding:5px;position:relative;background:linear-gradient(150deg,#c4a363,#213e44);box-shadow:0 15px 45px #0009;overflow:hidden}.cinema-card img{width:100%;height:100%;object-fit:cover;border-radius:10px}.cinema-card>b{position:absolute;bottom:6px;left:6px;right:6px;padding:45px 12px 18px;background:linear-gradient(transparent,#09202b);font-size:22px;font-style:italic;color:#fae6b7;border-radius:10px}.evolution-pair>span{font-size:40px;color:#e9cb87}.evolution-vortex{position:absolute;width:480px;height:480px;border-radius:50%;border:2px dashed #ecd49966;box-shadow:0 0 65px #d6b57733,inset 0 0 85px #c4a46433;animation:power-turn 16s linear infinite;z-index:-1}.evolution-vortex:before,.evolution-vortex:after{content:'';position:absolute;inset:-35px;border:1px dashed #cbb6e388;border-radius:50%}.evolution-vortex:after{inset:25px;border-width:8px;border-color:#a6d5c422}.evolution-caption{text-align:center;margin-top:24px}.evolution-caption>b{display:block;font-size:24px;color:#f4db9f}.evolution-caption>span{display:block;font-size:11px;letter-spacing:1px;color:#c6d8ca;margin-top:6px}.tactic-cinema{text-align:center}.tactic-cinema>b{font-size:130px;color:#edd69b;display:block}.tactic-cinema>small{font-size:10px;letter-spacing:4px;color:#c1d4c8}.tactic-cinema h2{font-size:60px;font-style:italic;color:#f0d596;margin:15px 0}.race-theatre.world-action{background:transparent;backdrop-filter:none;pointer-events:none}.world-action .skip-race-fx{pointer-events:auto}.world-action .race-scene{height:100%;width:100%;align-items:flex-start;justify-content:flex-start}.movement-callout{margin:105px 0 0 4vw;display:flex;align-items:center;gap:15px;background:linear-gradient(110deg,#102d37f5,#112b35e0);border-left:4px solid #e9ca7d;padding:12px 30px 12px 12px;border-radius:7px;box-shadow:0 8px 30px #0007}.movement-callout>img{width:65px;height:75px;object-fit:cover;border-radius:6px}.movement-callout small{display:block;color:#b9d4c5;font-size:9px;letter-spacing:1px}.movement-callout b{display:block;font-size:34px;font-style:italic;color:#f2d694;line-height:1.1;margin:5px 0}.movement-callout span{color:#a5dfcb;font-size:13px}.finish-cinema{text-align:center;width:100%}.finish-checkers{height:50px;background:repeating-conic-gradient(#fff0cf 0 25%,#132f36 0 50%) 0/50px 50px;transform:rotate(-4deg);margin-bottom:60px}.finish-cinema small{font-size:11px;letter-spacing:4px;color:#d0d7c0}.finish-cinema h2{font-size:clamp(35px,7vw,90px);font-style:italic;color:#f4d488;margin:15px 0}.finish-cinema p{font-size:24px;color:#c4e4d4}.victory-particles{z-index:81;pointer-events:none}
@keyframes power-turn{to{transform:rotate(360deg)}}@keyframes ready-breathe{50%{box-shadow:0 0 18px #e0c67933}}@keyframes trail-flow{to{stroke-dashoffset:-32}}
body.in-race .room-banner{margin:0 0 8px;padding:5px 10px;font-size:9px}body.in-race #connection{font-size:9px;margin:0 0 5px;padding:3px 0}body.in-race .race-cockpit .arena-stage{height:clamp(275px,calc(100svh - 390px),570px)}
@media(min-width:1400px){.cockpit-layout{grid-template-columns:minmax(0,1fr) 335px}.action-dock{padding:15px}.active-driver{height:170px}.signature-control{min-height:90px}.driver-card{height:140px}}
@media(max-width:1000px){.cockpit-layout{grid-template-columns:minmax(0,1fr) 275px;gap:12px}.action-dock{padding:9px}.active-driver{height:120px}.active-driver h2{font-size:22px}.driver-card>div>b{font-size:14px}.driver-card{height:113px}.signature-control{padding:8px;gap:6px}.signature-control b{font-size:13px}.signature-control em{font-size:8px}.signature-control .ability-glyph{min-width:24px;font-size:25px}.race-team{padding:7px;height:58px}.race-team>img{width:31px;height:36px}.momentum-pips>i{width:5px;height:9px}.race-distance>.momentum-pips{gap:3px}.race-status{letter-spacing:1px}.race-cockpit .arena-stage{height:clamp(285px,calc(100svh - 305px),570px)}}
@media(max-width:760px){.cockpit-layout{grid-template-columns:1fr}.race-status>small{display:none}.race-cockpit .arena-stage,body.in-race .race-cockpit .arena-stage{height:auto;aspect-ratio:1.3;min-height:250px}.race-cockpit .arena-sign span{font-size:7px}.race-cockpit .arena-sign small{font-size:6px}.race-cockpit .arena-sign{top:6px;padding:5px 10px}.race-cockpit .arena-key{font-size:6px;gap:8px}.race-team>div>span{font-size:8px}.race-team{gap:6px}.race-distance>b{font-size:23px}.driver-card{height:125px}.driver-card>div>b{font-size:13px}.driver-stat{font-size:14px;padding:3px 5px;top:5px;left:5px}.driver-stat small{font-size:5px}.driver-fatigue>small{font-size:5px}.driver-card>div{padding:25px 7px 9px}.evolution-ready{font-size:5px;top:32px;right:4px;padding:4px}.action-dock{padding:14px;margin-top:8px}.active-driver{height:155px}.active-driver h2{font-size:30px}.pace-switch button{font-size:12px;padding:12px}.signature-control{min-height:92px}.signature-control b{font-size:18px}.signature-control em{font-size:11px}.signature-control small{font-size:8px}.evolution-control b{font-size:15px}.evolution-control em{font-size:10px}.evolution-control small{font-size:8px}.evolution-control>img{width:49px;height:60px}.tactic-hand button{padding:10px 5px}.tactic-hand button>span{font-size:9px}.tactic-hint{font-size:10px}.race-roll{padding:15px 20px}.race-roll>span{font-size:23px}.race-roll small{font-size:10px}.race-help{font-size:10px}.race-theatre .race-scene{width:94vw;height:85svh}.ability-cut-in{height:460px;display:block;border-radius:14px;text-align:center}.ability-cut-in>img{width:155px;height:210px;margin:-20px auto 0;display:block;transform:rotate(-7deg)}.ability-cut-in>div{padding:15px 23px}.ability-cut-in h2{font-size:36px;margin:12px 0}.ability-cut-in p{font-size:12px;line-height:1.5;max-width:none}.ability-cut-in small{font-size:8px}.cinema-heading{top:5%}.cinema-heading>small{font-size:8px;letter-spacing:1.5px}.cinema-heading h2{font-size:38px}.cinema-roll-result{bottom:9%}.cinema-roll-result>span{font-size:13px}.cinema-card{width:135px;height:220px}.cinema-card>b{font-size:16px;padding:30px 7px 13px}.evolution-pair{gap:10px}.evolution-pair>span{font-size:24px}.evolution-vortex{width:260px;height:260px}.evolution-caption>b{font-size:20px}.evolution-caption>span{font-size:10px}.skip-race-fx{right:15px;bottom:16px;font-size:10px;padding:9px 12px}.movement-callout{margin:80px 0 0 4vw;padding:8px 18px 8px 8px;gap:9px}.movement-callout b{font-size:24px}.movement-callout>img{width:42px;height:53px}.movement-callout small{font-size:7px}.movement-callout span{font-size:11px}.world-action .race-scene{height:100%;width:100%}}
@media(prefers-reduced-motion:reduce){.race-cockpit *,.race-theatre *{animation:none!important;transition:none!important}}html[data-motion=quick] .race-cockpit *{animation:none!important;transition:none!important}
@media(min-width:761px) and (max-height:800px){.race-cockpit .arena-stage{height:clamp(245px,calc(100svh - 375px),600px)}.active-driver{height:110px}.driver-card{height:112px}.signature-control{min-height:77px}.action-dock{padding:10px}.active-driver h2{font-size:24px}body.in-race .race-cockpit .arena-stage{height:clamp(240px,calc(100svh - 430px),540px)}}
