/* DFD ONE Race Control · WEB 12.12 */
.race-page{--race-blue:#2eafff;--race-violet:#a855f7;--race-amber:#ffb000;--race-green:#00e88b;--race-danger:#ff3b48}
.race-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin:32px 0 24px}
.race-head h1{font-size:clamp(2.9rem,7vw,6.8rem);line-height:.86;margin:7px 0 14px;letter-spacing:-.045em}
.race-head h1 span{display:block;color:var(--red);font-size:.36em;letter-spacing:.21em;margin-top:17px}
.race-head>div:first-child>p:last-child{max-width:760px;color:#aeb8c5}
.race-context{width:min(390px,100%);padding:17px;border:1px solid var(--line);background:#090b0e}
.race-context label{display:block;margin-bottom:8px;color:var(--muted);font-size:.62rem;letter-spacing:.16em}
.race-context select{margin:0;background:#11151b}
.race-context-badges{display:flex;gap:8px;margin-top:11px}
.race-mode,.race-link-state,.race-permission{display:inline-flex;align-items:center;min-height:30px;padding:6px 9px;border:1px solid var(--line);font-size:.62rem;font-weight:800;letter-spacing:.1em}
.race-mode.live_hardware,.race-link-state.online{color:var(--race-green);border-color:#176846;background:#082219}
.race-mode.pi_simulation{color:#cf8fff;border-color:#69418a;background:#21102f}
.race-mode.offline,.race-link-state.offline{color:#87919e;background:#11151a}
.race-state-panel{display:grid;grid-template-columns:minmax(220px,.45fr) 1.55fr;gap:25px;align-items:center;margin:0 0 14px;padding:20px 24px;border:1px solid #383f49;border-left:4px solid var(--race-blue);background:linear-gradient(110deg,#11151b,#080a0d 65%);box-shadow:0 22px 70px #0008}
.race-state-copy span{display:block;color:var(--muted);font-size:.62rem;letter-spacing:.16em}
.race-state-copy strong{display:block;margin:7px 0 5px;font-size:1.75rem;letter-spacing:.05em}
.race-state-copy small{color:#99a5b3}
.race-state-panel.state-armed{border-left-color:var(--race-amber)}
.race-state-panel.state-starting,.race-state-panel.state-running{border-left-color:var(--race-green);box-shadow:0 0 45px #00e88b12}
.race-state-panel.state-stopping{border-left-color:var(--race-amber)}
.race-state-panel.state-aborted{border-left-color:var(--race-danger)}
.race-state-rail{display:grid;grid-template-columns:repeat(5,1fr);margin:0;padding:0;list-style:none}
.race-state-rail li{position:relative;padding:23px 5px 0;color:#66717f;text-align:center;font-size:.62rem;letter-spacing:.08em}
.race-state-rail li:before{content:"";position:absolute;left:0;right:0;top:7px;height:2px;background:#29303a}
.race-state-rail li:first-child:before{left:50%}.race-state-rail li:last-child:before{right:50%}
.race-state-rail i{position:absolute;z-index:1;left:50%;top:0;width:16px;height:16px;border:3px solid #29303a;border-radius:50%;background:#080a0d;transform:translateX(-50%)}
.race-state-rail li.done{color:#bcc6d2}.race-state-rail li.done:before{background:var(--race-green)}.race-state-rail li.done i{border-color:var(--race-green);background:var(--race-green)}
.race-state-rail li.active{color:#fff}.race-state-rail li.active i{border-color:#fff;background:var(--red);box-shadow:0 0 18px var(--red)}
.race-metrics{display:grid;grid-template-columns:1.2fr repeat(5,1fr);gap:1px;margin:0 0 20px;background:#303640;border:1px solid #303640}
.race-metric{position:relative;min-width:0;padding:18px;background:#090b0e;overflow:hidden}
.race-metric:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:#56606d}
.race-metric.speed:after{background:var(--race-blue)}.race-metric.best:after{background:var(--race-green)}
.race-metric span{display:block;color:var(--muted);font-size:.59rem;letter-spacing:.13em;white-space:nowrap}
.race-metric strong{display:block;margin:8px 0 2px;font-size:clamp(1.45rem,2.7vw,2.7rem);line-height:1;white-space:nowrap}
.race-metric small{color:#84909d;font-size:.62rem}
.race-columns{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;margin-bottom:18px}
.race-columns>.panel{margin:0}.race-columns .panel-title{align-items:flex-start}
.race-columns .panel-title h2{margin:4px 0 0}.race-columns .panel-title .btn{margin:0}
.track-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:18px 0;background:#303640}
.track-grid>div{min-width:0;padding:13px;background:#080a0d}
.track-grid span,.systems-grid span{display:block;color:var(--muted);font-size:.58rem;letter-spacing:.12em}
.track-grid strong{display:block;margin-top:7px;font-size:.78rem;overflow-wrap:anywhere}
.race-map{position:relative;height:190px;border:1px solid #2c343e;background:radial-gradient(circle at 50% 50%,#102230,#06080b 60%);overflow:hidden}
.race-map-grid{position:absolute;inset:0;background-image:linear-gradient(#39a7ff10 1px,transparent 1px),linear-gradient(90deg,#39a7ff10 1px,transparent 1px);background-size:28px 28px}
.race-map:before,.race-map:after{content:"";position:absolute;background:#2eafff22}.race-map:before{left:50%;top:0;bottom:0;width:1px}.race-map:after{top:50%;left:0;right:0;height:1px}
.race-position{position:absolute;left:50%;top:50%;width:12px;height:12px;border:2px solid #fff;border-radius:50%;background:var(--race-blue);box-shadow:0 0 20px var(--race-blue);transform:translate(-50%,-50%)}
.race-map>span{position:absolute;right:10px;bottom:8px;padding:5px 7px;background:#050608d9;color:#8eb9d4;font-size:.62rem}
.race-permission{color:var(--race-green);border-color:#176846}.race-permission.denied{color:#ff8b93;border-color:#79232b}
.readiness-list{display:grid;gap:7px;margin:16px 0}
.readiness-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 11px;border:1px solid #282f38;background:#080a0d;font-size:.73rem}
.readiness-item span{display:flex;align-items:center;gap:8px}.readiness-item span:before{content:"";width:8px;height:8px;border-radius:50%;background:#59616c}
.readiness-item.ok span:before{background:var(--race-green);box-shadow:0 0 10px #00e88b88}.readiness-item.bad span:before{background:var(--race-danger);box-shadow:0 0 10px #ff3b4877}
.readiness-item b{color:#8995a2;font-size:.62rem;font-weight:500;text-align:right}
.race-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:15px}
.race-actions button{min-height:48px;margin:0;border:1px solid transparent;font-size:.74rem;letter-spacing:.06em}
.race-actions button:disabled{opacity:.28;cursor:not-allowed;filter:saturate(.2)}
.race-arm{background:#422f09;color:#ffd36d;border-color:#896316!important}.race-arm:hover:not(:disabled){background:#73510a}
.race-start{background:#08623f;color:#fff;border-color:#0fa96d!important}.race-start:hover:not(:disabled){background:#078554}
.race-stop{background:#1c222b;color:#fff;border-color:#4c5866!important}.race-stop:hover:not(:disabled){background:#2d3642}
.race-abort{background:#3b1116;color:#ff9aa3;border-color:#8d2630!important}.race-abort:hover:not(:disabled){background:#6a111a;color:#fff}
.race-safety-note{margin:13px 0 0;color:#8794a3;font-size:.68rem;line-height:1.45}
.race-message{min-height:20px;margin-top:10px;color:#aeb8c5;font-size:.72rem}.race-message.ok{color:var(--race-green)}.race-message.error{color:#ff838c}
.race-systems-panel{margin-bottom:18px}.race-systems-panel .panel-title>span{color:var(--muted);font-size:.68rem}
.systems-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;margin-top:17px;background:#303640}
.systems-grid>div{min-width:0;padding:15px;background:#080a0d}.systems-grid strong{display:inline-block;margin-top:8px;font-size:1.5rem}.systems-grid small{margin-left:4px;color:#7f8a97}
.race-lower-columns{grid-template-columns:1.05fr .95fr}.event-entry{display:grid;grid-template-columns:1fr;gap:8px;margin-top:16px}.event-entry input{margin:0}.event-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.event-buttons button{margin:0;padding:9px 7px;background:#1a2028;font-size:.65rem}.event-buttons button[data-event="incident"]{color:#ff8992;border:1px solid #6e242c}
.event-timeline{display:flex;flex-direction:column;gap:7px;max-height:335px;margin-top:17px;overflow:auto}
.race-event{display:grid;grid-template-columns:75px 92px 1fr;gap:12px;align-items:start;padding:10px 11px;border-left:3px solid #59616c;background:#090b0e;font-size:.69rem}
.race-event.warning{border-left-color:var(--race-amber)}.race-event.critical{border-left-color:var(--race-danger)}
.race-event time{color:#8c98a6}.race-event b{color:#c7d0da;font-size:.62rem;letter-spacing:.08em}.race-event span{min-width:0;overflow-wrap:anywhere}
.race-report-empty{margin-top:17px;padding:28px;border:1px dashed #303741;color:#8995a2;text-align:center}
.race-report-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:17px;background:#303640}
.race-report-grid>div{padding:16px;background:#080a0d}.race-report-grid span{display:block;color:var(--muted);font-size:.58rem;letter-spacing:.12em}.race-report-grid strong{display:block;margin-top:7px;font-size:1.15rem}
.race-report-meta{display:flex;justify-content:space-between;gap:15px;margin-top:12px;color:#8995a2;font-size:.68rem}
@media(max-width:1150px){.race-metrics{grid-template-columns:repeat(3,1fr)}.systems-grid{grid-template-columns:repeat(3,1fr)}.race-columns{grid-template-columns:1fr}.race-head{align-items:flex-start}.race-context{width:330px}}
@media(max-width:760px){.race-head{flex-direction:column}.race-context{width:100%}.race-state-panel{grid-template-columns:1fr}.race-state-rail li span{display:none}.race-metrics{grid-template-columns:repeat(2,1fr)}.track-grid{grid-template-columns:repeat(2,1fr)}.systems-grid{grid-template-columns:repeat(2,1fr)}.event-buttons{grid-template-columns:repeat(2,1fr)}.race-report-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:430px){.race-head h1{font-size:2.8rem}.race-metrics{grid-template-columns:1fr 1fr}.race-metric{padding:14px 11px}.race-metric span{font-size:.51rem}.race-actions{grid-template-columns:1fr}.race-event{grid-template-columns:60px 1fr}.race-event span{grid-column:1/-1}.race-report-grid{grid-template-columns:1fr}}
