:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07111f;--panel:#0b1829;--panel-2:#0f2034;--line:#1d3148;--muted:#7990a8;--text:#f4f7fb;--red:#ef3d45;--blue:#5ba7ff;--green:#19d4a5;--amber:#f6a740}*{box-sizing:border-box}html{background:var(--bg)}body{background:radial-gradient(circle at 50% -20%,#3a6a9b2e,transparent 44%),var(--bg);color:var(--text);min-height:100dvh;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{width:min(100%,860px);min-height:100dvh;margin:0 auto;padding-bottom:84px}.app-header{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);z-index:20;background:#07111fe6;border-bottom:1px solid #2c445fa8;justify-content:space-between;align-items:center;height:64px;padding:0 14px;display:flex;position:sticky;top:0}.brand-lockup,.header-actions,.gateway-strip,.alert-strip{align-items:center;display:flex}.brand-lockup{gap:10px;min-width:0}.brand-logo{flex:none;width:clamp(54px,15vw,68px);height:auto;display:block}.brand-lockup div{min-width:0;display:grid}.brand-lockup strong{letter-spacing:.01em;font-size:15px}.brand-lockup span{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;max-width:136px;font-size:10px;overflow:hidden}.header-actions{justify-content:flex-end;gap:7px;min-width:0}.connection-pill{background:#102033;border:1px solid #233951;border-radius:999px;align-items:center;gap:5px;height:36px;padding:0 9px;display:flex}.connection-pill i{background:#74869a;border-radius:50%;width:7px;height:7px}.connection-pill span{letter-spacing:.08em;font-size:10px;font-weight:800}.connection-pill small{color:var(--muted);font-size:9px}.connection-pill.is-live{color:#6df0cf;background:#19d4a517;border-color:#19d4a55c}.connection-pill.is-live i{background:var(--green);animation:1.8s ease-out infinite live-pulse}.connection-pill.is-stale{color:var(--amber)}.connection-pill.is-stale i{background:var(--amber)}.connection-pill.is-offline{color:#ff737a}.connection-pill.is-offline i{background:var(--red)}@keyframes live-pulse{0%,to{box-shadow:0 0 #19d4a500}45%{box-shadow:0 0 0 5px #19d4a524}}.icon-button{color:#aab9c9;background:0 0;border:0;border-radius:8px;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.icon-button:active{background:var(--panel-2)}.icon-button svg{width:19px;height:19px}.content-frame{padding:12px}.hero-metrics,.drive-metrics{gap:1px;display:grid;overflow:hidden}.hero-metrics{border:1px solid var(--line);border-radius:10px;grid-template-columns:.7fr 1.15fr 1.15fr 1.15fr}.drive-metrics{background:var(--line);border:1px solid var(--line);border-radius:10px;grid-template-columns:repeat(3,1fr);margin-top:8px}.metric{background:var(--panel);min-width:0;padding:11px 9px;display:grid}.metric span,.system-card span{color:var(--muted);letter-spacing:.09em;text-transform:uppercase;font-size:9px;font-weight:700}.metric strong{font-variant-numeric:tabular-nums;letter-spacing:-.04em;white-space:nowrap;margin-top:4px;font-size:clamp(14px,4vw,19px)}.metric.accent strong{color:var(--green)}.metric.compact{padding:12px}.metric.compact strong{font-size:clamp(22px,7vw,32px)}.metric strong small{color:var(--muted);letter-spacing:0;margin-left:4px;font-size:9px;font-weight:600}.surface-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-top:10px;overflow:hidden}.surface-tabs{border-bottom:1px solid var(--line);background:#081422;grid-template-columns:.8fr 1.25fr 1.15fr;padding:0 5px;display:grid}.surface-tabs button{color:#7890a8;white-space:nowrap;background:0 0;border:0;border-bottom:2px solid #0000;justify-content:center;align-items:center;gap:5px;height:48px;padding:0 4px;font-size:10px;font-weight:700;display:flex}.surface-tabs button.active{border-bottom-color:var(--red);color:var(--text)}.surface-tabs svg{width:14px;height:14px}.surface-pager{overscroll-behavior-inline:contain;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;height:clamp(340px,53vh,460px);display:flex;overflow-x:auto}.surface-pager::-webkit-scrollbar{display:none}.surface-page{scroll-snap-align:start;flex:0 0 100%;min-width:0}.surface-caption{justify-content:space-between;align-items:center;padding:13px 14px 0;display:flex}.surface-caption span,.time-distance-heading span{font-size:13px;font-weight:800}.surface-caption strong{color:var(--muted);font-size:10px;font-weight:600}.track-surface{height:100%;position:relative}.track-surface .recharts-responsive-container{height:calc(100% - 36px)!important}.track-position{border:3px solid var(--red);background:#fff;border-radius:50%;width:13px;height:13px;position:absolute;top:48%;left:68%;box-shadow:0 0 0 5px #ef3d452e}.pager-dots{justify-content:center;align-items:center;gap:5px;height:24px;display:flex}.pager-dots i{background:#2a3f56;border-radius:99px;width:4px;height:4px;transition:width .16s,background .16s}.pager-dots i.active{background:var(--red);width:17px}.time-distance{height:100%;padding:12px 10px 0}.time-distance-heading{justify-content:space-between;align-items:center;display:flex}.time-distance-heading>div{display:grid}.time-distance-heading small{color:var(--muted);margin-top:2px;font-size:9px}.time-distance-heading .lap-chip{color:var(--text);background:#102238;border:1px solid #2a435e;border-radius:7px;align-items:center;gap:6px;min-height:36px;padding:0 10px;font-size:10px;font-weight:700;display:flex}.sector-band{grid-template-columns:1.1fr .85fr 1.2fr .8fr 1fr;margin:11px 0 5px 72px;display:grid}.sector-band i{border-right:1px solid var(--panel);color:#a9bdd1;text-align:center;background:#5ba7ff24;padding:4px 0;font-size:8px;font-style:normal;font-weight:700}.sector-band i:nth-child(2),.sector-band i:nth-child(5){background:#19d4a524}.sector-band i:nth-child(3){background:#ef3d4524}.trace-stack{border-bottom:1px solid var(--line);border-top:1px solid var(--line)}.trace-row{grid-template-columns:72px 1fr;height:63px;display:grid}.trace-row+.trace-row{border-top:1px solid #24384eb3}.trace-label{align-content:center;padding-left:3px;display:grid}.trace-label>span{text-transform:uppercase;font-size:8px;font-weight:800}.trace-label strong{font-variant-numeric:tabular-nums;margin-top:3px;font-size:14px}.trace-label small{color:var(--muted);font-size:7px}.trace-chart{background:repeating-linear-gradient(90deg,#0000 0 19.7%,#25384e47 20%),#050f1b6b;min-width:0}.distance-axis{color:#668098;justify-content:space-between;margin-left:72px;padding-top:5px;font-size:7px;display:flex}.brake-surface{height:100%}.brake-layout{grid-template-rows:repeat(2,1fr);grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr);grid-template-areas:"fl truck fr""rl truck rr";gap:14px;height:calc(100% - 41px);padding:24px 14px 17px;display:grid}.brake-wheel{background:#0b192a;border:1px solid #253a51;border-radius:9px;align-self:stretch;min-width:0;padding:10px;display:grid;overflow:hidden}.brake-wheel.fl{grid-area:fl}.brake-wheel.fr{grid-area:fr}.brake-wheel.rl{grid-area:rl}.brake-wheel.rr{grid-area:rr}.brake-wheel>span{color:var(--muted);text-transform:uppercase;font-size:8px;font-weight:700}.brake-wheel>strong{font-variant-numeric:tabular-nums;font-size:clamp(24px,8vw,36px)}.brake-wheel>strong small{color:var(--amber);margin-left:2px;font-size:11px}.brake-wheel.hot{border-color:#ef3d459e}.truck-marker{color:#637b93;grid-area:truck;justify-content:center;align-items:center;display:flex;position:relative}.truck-marker:before{content:"";background:linear-gradient(#0000,#2b4259 20% 80%,#0000);width:1px;height:85%;position:absolute;left:50%}.truck-marker svg{background:var(--panel);width:36px;height:36px;padding:5px;position:relative;transform:rotate(-90deg)}.systems-grid{grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px;display:grid}.system-card{background:var(--panel);border:1px solid var(--line);border-radius:9px;min-width:0;padding:10px;display:grid}.system-card strong{font-variant-numeric:tabular-nums;margin-top:4px;font-size:18px}.system-card small{color:var(--muted);margin-left:3px;font-size:8px}.driver-state-row{grid-template-columns:repeat(3,1fr);gap:7px;margin-top:8px;display:grid}.driver-state-chip{background:var(--panel);border:1px solid var(--line);border-radius:9px;align-items:center;gap:5px;min-width:0;min-height:40px;padding:0 8px;transition:background .16s,border-color .16s;display:flex}.driver-state-chip i{background:#74869a;border-radius:50%;flex:none;width:7px;height:7px}.driver-state-chip span{color:var(--muted);letter-spacing:.07em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap;font-size:9px;font-weight:700;overflow:hidden}.driver-state-chip strong{letter-spacing:.05em;font-size:10px;font-weight:800}.driver-state-chip small{color:var(--muted);text-transform:lowercase;margin-left:auto;font-size:7px}.driver-state-chip.unknown strong{color:var(--muted)}.driver-state-chip.is-coast.lit{background:#5ba7ff1a;border-color:#5ba7ff66}.driver-state-chip.is-coast.lit i{background:var(--blue)}.driver-state-chip.is-coast.lit strong{color:#9cc8ff}.driver-state-chip.is-overlap.lit{background:#f6a7401f;border-color:#f6a74073}.driver-state-chip.is-overlap.lit i{background:var(--amber)}.driver-state-chip.is-overlap.lit strong{color:#ffcd8a}.driver-state-chip.is-full-throttle.lit{background:#19d4a517;border-color:#19d4a55c}.driver-state-chip.is-full-throttle.lit i{background:var(--green)}.driver-state-chip.is-full-throttle.lit strong{color:#6df0cf}.gateway-strip,.alert-strip{border:1px solid var(--line);border-radius:9px;gap:7px;min-height:44px;margin-top:8px;padding:9px 11px;font-size:10px}.gateway-strip{background:#19d4a50d}.gateway-strip svg,.alert-strip svg{width:15px;height:15px}.gateway-strip svg{color:var(--green)}.gateway-strip strong,.alert-strip strong{color:var(--muted);text-transform:uppercase;margin-left:auto;font-size:9px}.alert-strip{background:#f6a74017;border-color:#f6a74059}.alert-strip svg{color:var(--amber)}.bottom-nav{max-width:860px;height:72px;padding:5px max(8px,env(safe-area-inset-right))max(5px,env(safe-area-inset-bottom))max(8px,env(safe-area-inset-left));z-index:30;background:#081320f5;border:1px solid #23364b;border-bottom:0;border-radius:16px 16px 0 0;grid-template-columns:repeat(5,1fr);width:auto;margin:0 auto;display:grid;position:fixed;bottom:0;left:0;right:0}.bottom-nav button{color:#6e8399;background:0 0;border:0;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-height:44px;font-size:10px;font-weight:700;display:flex}.bottom-nav button.active{color:#fff}.bottom-nav button.active:after{background:var(--red);content:"";border-radius:99px;width:24px;height:2px;position:absolute;transform:translateY(28px)}.bottom-nav button>span{position:relative}.bottom-nav svg{width:20px;height:20px}.bottom-nav i{background:var(--red);color:#fff;border:2px solid #081320;border-radius:99px;justify-content:center;align-items:center;min-width:15px;height:15px;padding:0 3px;font-size:8px;font-style:normal;display:flex;position:absolute;top:-7px;right:-9px}.page-section{min-height:calc(100dvh - 160px)}.section-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:flex-end;margin-bottom:14px;padding:12px 3px 16px;display:flex}.section-heading h1{letter-spacing:-.04em;margin:2px 0 0;font-size:30px}.section-heading>svg{color:var(--red);width:25px;height:25px}.session-picker{gap:4px;display:grid}.session-picker span{color:var(--muted);text-transform:uppercase;font-size:8px;font-weight:700}.session-picker select{color:var(--text);background:#0c1a2b;border:1px solid #2c4259;border-radius:7px;max-width:155px;height:44px;padding:0 8px}.eyebrow{color:var(--red);letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:9px;font-weight:800}.lap-list,.alert-list{gap:7px;display:grid}.lap-list button{background:var(--panel);border:1px solid var(--line);color:var(--text);text-align:left;border-radius:9px;grid-template-columns:1fr 1fr .7fr;align-items:center;min-height:58px;padding:10px 12px;display:grid}.lap-list button.selected{border-color:var(--red);background:#12243a}.lap-list button span{color:var(--muted);font-size:11px}.lap-list button strong{font-variant-numeric:tabular-nums;font-size:16px}.lap-list button small{color:var(--muted);text-align:right;font-size:9px}.lap-list button small:first-letter{color:var(--green)}.lap-detail{background:var(--panel);border:1px solid var(--line);border-radius:10px;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;padding:14px;display:grid}.lap-detail div{display:grid}.lap-detail span{color:var(--muted);text-transform:uppercase;font-size:9px}.lap-detail strong{margin-top:3px;font-size:18px}.lap-detail p{color:var(--muted);grid-column:1/-1;margin:0;font-size:11px;line-height:1.55}.retained-traces{grid-column:1/-1;gap:1px;display:grid}.mini-lap-trace{background:#071321;grid-template-columns:62px 1fr;align-items:center;min-height:50px;padding-left:8px;display:grid}.mini-lap-trace>span{font-size:8px;font-weight:800}.alert-card{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:8px;gap:9px;padding:12px;display:grid}.alert-card.severity-critical{border-left-color:var(--red)}.alert-card.cleared{opacity:.55}.alert-card div{gap:2px;display:grid}.alert-card strong{font-size:13px}.alert-card span,.alert-card small{color:var(--muted);font-size:9px}.empty-state{color:var(--muted);text-align:center;flex-direction:column;align-items:center;min-height:50vh;padding:48px 30px;display:flex}.empty-state svg{color:#3f5871;width:34px;height:34px;margin-bottom:14px}.empty-state strong{color:var(--text)}.empty-state p{max-width:270px;font-size:12px;line-height:1.5}.login-shell{background:radial-gradient(circle at 50% 18%,#ef3d451a,transparent 31rem),var(--bg);min-height:100dvh;padding:max(20px,env(safe-area-inset-top))16px max(20px,env(safe-area-inset-bottom));place-items:center;display:grid;overflow-y:auto}.login-panel{gap:30px;width:min(100%,360px);display:grid}.login-brand{place-items:center;display:grid}.login-logo{width:min(74vw,250px);height:auto}.login-content{text-align:center}.pin-lock{gap:19px;display:grid}.pin-dots{justify-content:center;align-items:center;gap:13px;height:22px;display:flex}.pin-dot{background:0 0;border:2px solid #53677c;border-radius:999px;width:13px;height:13px;transition:background .12s,border-color .12s,transform .12s}.pin-dot.is-filled{background:var(--red);border-color:var(--red);transform:scale(1.08)}.pin-dots.is-pending .pin-dot.is-filled{animation:.7s ease-in-out infinite alternate pin-checking}@keyframes pin-checking{0%{opacity:.5}to{opacity:1}}.pin-keypad{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:min(100%,310px);margin:0 auto;display:grid}.pin-key{color:#f4f7fa;font-variant-numeric:tabular-nums;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:linear-gradient(#14273a,#0d1c2c);border:1px solid #2d4359;border-radius:17px;justify-content:center;align-items:center;min-height:60px;font-size:27px;font-weight:650;transition:background .14s,border-color .14s,transform 80ms;display:flex;box-shadow:0 5px 12px #0000002e,inset 0 1px #ffffff09}.pin-key:hover:not(:disabled){background:linear-gradient(#1a3046,#102238);border-color:#496178}.pin-key:active:not(:disabled){transform:scale(.96)}.pin-key:focus-visible{outline-offset:3px;outline:3px solid #ef3d458c}.pin-key:disabled{cursor:wait;opacity:.52}.pin-key-backspace{box-shadow:none;color:#aebdcc;background:0 0;border-color:#0000}.pin-key-backspace svg{width:25px;height:25px}.pin-status{color:#8395a8;text-align:center;min-height:17px;margin:0;font-size:11px}.pin-status.is-error{color:#ff9b9f}@media (max-height:560px) and (min-width:560px){.login-panel{grid-template-columns:minmax(160px,220px) minmax(270px,320px);align-items:center;gap:30px;width:min(100%,590px)}.login-logo{width:min(100%,210px)}.pin-lock{gap:10px;margin-top:13px}.pin-keypad{gap:7px;width:270px}.pin-key{border-radius:13px;min-height:45px}}.commissioning-banner{color:#ffb0b4;background:#ef3d4517;border:1px solid #ef3d4559;border-radius:9px;align-items:center;gap:9px;margin-bottom:10px;padding:10px 12px;font-size:11px;line-height:1.45;display:flex}.commissioning-banner.is-info{color:#a9c8ec;background:#5ba7ff14;border-color:#5ba7ff4d}.commissioning-banner svg{flex:none;width:16px;height:16px}.commissioning-banner code{color:var(--text);font-size:10px}.commissioning-summary{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line);z-index:10;background:#091524f0;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;padding:11px 12px;display:flex;position:sticky;top:70px}.commissioning-summary>div{gap:3px;min-width:0;display:grid}.commissioning-summary strong{font-size:14px}.commissioning-summary span{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:9px;overflow:hidden}.commissioning-summary code{font-size:9px}.commissioning-progress{border-radius:99px;width:100%;height:4px;margin-top:3px;display:block}.commissioning-export{background:var(--red);color:#fff;border:0;border-radius:8px;flex:none;align-items:center;gap:6px;min-height:44px;padding:0 14px;font-size:11px;font-weight:800;display:flex}.commissioning-export svg{width:15px;height:15px}.commissioning-report{background:var(--panel);border:1px solid var(--line);border-radius:10px;margin-bottom:10px;overflow:hidden}.commissioning-report>div{border-bottom:1px solid var(--line);align-items:center;gap:8px;padding:9px 11px;display:flex}.commissioning-report strong{font-size:11px}.commissioning-report>div span{color:var(--muted);min-width:0;font-size:9px}.commissioning-report>div button{background:var(--panel-2);border:1px solid var(--line);color:var(--text);border-radius:7px;min-height:34px;margin-left:auto;padding:0 10px;font-size:10px;font-weight:700}.commissioning-report pre{color:#b8c9da;-webkit-user-select:all;user-select:all;max-height:260px;margin:0;padding:10px 12px;font-size:9px;line-height:1.5;overflow:auto}.commissioning-list{gap:7px;display:grid}.commissioning-list.frozen{opacity:.62}.commissioning-row{background:var(--panel);border:1px solid var(--line);border-radius:9px;overflow:hidden}.commissioning-row.outcome-verified{border-color:#19d4a573}.commissioning-row.outcome-failed{border-color:#ef3d458c}.commissioning-row.outcome-skipped{opacity:.72}.commissioning-row.out-of-scope{opacity:.45;padding:10px 12px}.commissioning-row.out-of-scope code{color:var(--muted);font-size:9px}.commissioning-row>button{color:var(--text);text-align:left;background:0 0;border:0;gap:6px;width:100%;min-height:44px;padding:11px 12px;display:grid}.commissioning-row-head{align-items:center;gap:7px;display:flex}.commissioning-row-head strong{min-width:0;font-size:13px}.commissioning-row-head .outcome-icon{flex:none;width:15px;height:15px}.outcome-icon.verified{color:var(--green)}.outcome-icon.failed{color:var(--red)}.outcome-icon.skipped{color:var(--muted)}.commissioning-value{font-variant-numeric:tabular-nums;letter-spacing:-.02em;white-space:nowrap;margin-left:auto;font-size:17px;font-style:normal}.commissioning-value small{color:var(--muted);margin-left:3px;font-size:9px}.commissioning-row-meta,.commissioning-row-stats{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.commissioning-row-meta code{color:var(--muted);font-size:9px}.commissioning-chip{color:#9fb2c5;white-space:nowrap;background:#102033;border:1px solid #233951;border-radius:99px;padding:3px 8px;font-size:9px;font-weight:700}.commissioning-chip.is-pass{color:#6df0cf;background:#19d4a517;border-color:#19d4a55c}.commissioning-chip.is-warn{color:#ffcd8a;background:#f6a7401a;border-color:#f6a74066}.commissioning-chip.is-fail{color:#ff9499;background:#ef3d451f;border-color:#ef3d4580}.commissioning-note{color:var(--muted);margin:0;font-size:10px;line-height:1.4}.commissioning-actions{border-top:1px solid var(--line);gap:8px;padding:10px 12px 12px;display:grid}.commissioning-actions input{color:#fff;background:#071321;border:1px solid #2b4159;border-radius:8px;outline:none;width:100%;height:44px;padding:0 11px}.commissioning-actions input:focus{border-color:var(--red)}.commissioning-actions>div{gap:6px;display:flex}.commissioning-actions>div button{border:1px solid var(--line);border-radius:8px;flex:1;justify-content:center;align-items:center;gap:5px;min-height:44px;font-size:11px;font-weight:800;display:flex}.commissioning-actions svg{width:14px;height:14px}.commissioning-actions .act-verify{color:#6df0cf;background:#19d4a51f;border-color:#19d4a566}.commissioning-actions .act-fail{color:#ff9499;background:#ef3d451f;border-color:#ef3d4573}.commissioning-actions .act-skip{background:var(--panel-2);color:#9fb2c5}.commissioning-actions .act-clear{color:var(--muted);background:0 0;flex:none;padding:0 10px}.commissioning-scope-note{color:var(--muted);margin:8px 0 0;font-size:10px}@media (max-width:420px){.brand-lockup{gap:8px}.connection-pill small{display:none}.brand-lockup span{max-width:72px}}@media (min-width:620px){.content-frame{padding:18px 22px}.surface-pager{height:470px}.systems-grid{grid-template-columns:repeat(6,1fr)}.brake-layout{grid-template-columns:minmax(0,1fr) 130px minmax(0,1fr);gap:26px;padding-inline:40px}}@media (orientation:landscape) and (max-height:520px){.app-header{height:54px}.surface-pager{height:300px}.bottom-nav{height:62px}.app-shell{padding-bottom:68px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.connection-pill.is-live i{animation:none}.pin-dot,.pin-key{transition:none;animation:none!important}}