/* =====================================================================
   ChainEx Mission Control · shared design system (tokens + components)
   Loaded after brand.css/desk.css/dashboard.css/portal.css on every app.
   html.cx is set by cx-ui.js; html.dark = night, else day. Preference: Auto (default) / Day / Night.
   ===================================================================== */
html.cx{--mono:"JetBrains Mono","SF Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--ease:cubic-bezier(.2,.8,.2,1);--t:180ms;--radius:14px;
  --font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",Ubuntu,sans-serif;font-family:var(--font);font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased}
html.cx.dark{color-scheme:dark;--bg:#060b14;--bg-2:#0a1220;--card:#0c1625;--card-2:#0f1b2d;--glass:rgba(11,20,34,.74);--glass-b:rgba(120,165,230,.16);
  --ink:#e7eefa;--muted:#90a5c1;--line:#19293f;--line-2:#132135;--chip:#14233a;--chip-ink:#bccde6;--sel:#0e2645;--topbar:#04080f;
  --blue:#4c95ff;--navy-blue:#2f7cf6;--accent:#3b8cff;--accent-2:#22d3ee;--glow:0 0 0 1px rgba(59,140,255,.45),0 0 22px -4px rgba(59,140,255,.55);
  --st-completed:#22c55e;--st-enroute:#3b8cff;--st-assigned:#7aa5ff;--st-exception:#f59e0b;--st-pending:#7d8da6;--st-unscanned:#f25f5f;--danger:#ef4444;
  --peach:#3a2417;--peach-ink:#ffb48a;--ok-bg:rgba(34,197,94,.14);--bad-bg:rgba(239,68,68,.15);--warn-bg:rgba(245,158,11,.15);--info-bg:rgba(59,140,255,.15);
  --shadow:0 1px 0 rgba(255,255,255,.035) inset,0 18px 40px -22px rgba(0,0,0,.85);--panel-hi:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 40%)}
html.cx:not(.dark){color-scheme:light;--bg:#f5f7fa;--bg-2:#eef2f6;--card:#ffffff;--card-2:#f3f6f9;--glass:rgba(255,255,255,.88);--glass-b:rgba(23,43,69,.12);
  --ink:#172b45;--muted:#51647c;--line:#d5deea;--line-2:#e8edf3;--chip:#edf2f8;--chip-ink:#2f4560;--sel:#e6effd;--topbar:#0f1b2d;
  --blue:#2563c9;--navy-blue:#172b45;--accent:#2563c9;--accent-2:#0891b2;--glow:0 0 0 1px rgba(37,99,201,.32),0 6px 18px -6px rgba(37,99,201,.42);
  --st-completed:#16a34a;--st-enroute:#1e6ae0;--st-assigned:#1f4f9a;--st-exception:#d97706;--st-pending:#8a99ad;--st-unscanned:#dc2626;--danger:#dc2626;
  --ok-bg:#e4f6ea;--bad-bg:#fde9e9;--warn-bg:#fff2df;--info-bg:#e6effd;
  --shadow:0 1px 2px rgba(13,27,47,.05),0 12px 30px -16px rgba(13,27,47,.22);--panel-hi:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0) 40%)}
html.cx body{background:var(--bg);color:var(--ink);font-family:var(--font)}
html.cx.dark body{background:radial-gradient(1100px 520px at 0% -8%,rgba(47,124,246,.16),transparent 60%),radial-gradient(800px 420px at 105% -5%,rgba(34,211,238,.08),transparent 60%),
  linear-gradient(rgba(120,165,230,.035) 1px,transparent 1px) 0 0/32px 32px,linear-gradient(90deg,rgba(120,165,230,.035) 1px,transparent 1px) 0 0/32px 32px,var(--bg);background-attachment:fixed}
html.cx:not(.dark) body{background:radial-gradient(1100px 520px at 0% -8%,rgba(37,99,201,.10),transparent 60%),radial-gradient(800px 420px at 105% -5%,rgba(8,145,178,.07),transparent 60%),var(--bg);background-attachment:fixed}
html.cx ::selection{background:rgba(59,140,255,.35)}
html.cx *::-webkit-scrollbar{width:9px;height:9px}html.cx *::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--muted) 35%,transparent);border-radius:9px;border:2px solid transparent;background-clip:padding-box}
html.cx *::-webkit-scrollbar-track{background:transparent}
html.cx :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
html.cx .num,html.cx .kpi b,html.cx .kc b,html.cx .clock,html.cx .count,html.cx .tile b{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
/* ---------- topbar ---------- */
html.cx .topbar{height:56px;background:linear-gradient(180deg,rgba(4,8,15,.94),rgba(6,12,22,.9));backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(120,165,230,.14);box-shadow:0 1px 0 rgba(59,140,255,.18),0 10px 30px -18px rgba(0,0,0,.8)}
html.cx .topbar:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(59,140,255,.7),rgba(34,211,238,.5),transparent);opacity:.7;pointer-events:none}
html.cx .topbar .wordmark{font-size:21px;letter-spacing:-.035em;text-shadow:0 0 18px rgba(91,147,234,.25)}html.cx .on-dark .wordmark .ex{color:#5ea0ff}
html.cx .topnav{display:flex;gap:2px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:11px;padding:3px}
html.cx .topnav .tn{color:#a9bcd7;border-radius:8px;padding:6px 12px;font-weight:650;font-size:13px;text-decoration:none;transition:background var(--t),color var(--t);border:none;height:auto}
html.cx .topnav .tn:hover{color:#fff;background:rgba(255,255,255,.06)}html.cx .topnav .tn.active{color:#fff;background:linear-gradient(180deg,rgba(59,140,255,.28),rgba(59,140,255,.14));box-shadow:inset 0 0 0 1px rgba(91,160,255,.35),0 0 18px -6px rgba(59,140,255,.7)}
html.cx .topnav .tn.active:after{display:none}
html.cx .tb-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#d5e2f5;border-radius:9px;padding:5px 10px;font-weight:650;font-size:12.5px;cursor:pointer;transition:all var(--t)}
html.cx .tb-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(91,160,255,.45);color:#fff}
html.cx .clock{color:#d8e5f7;font-size:12.5px}
html.cx .lineswitch{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:11px;padding:3px}
html.cx .lineswitch .ls{color:#a9bcd7;border-radius:8px;transition:all var(--t);border:none;background:none}
html.cx .lineswitch .ls:hover{color:#fff;background:rgba(255,255,255,.06)}
html.cx .lineswitch .ls.on{color:#fff;background:linear-gradient(180deg,#2f7cf6,#1f5fd0);box-shadow:0 0 0 1px rgba(120,180,255,.4),0 6px 18px -6px rgba(47,124,246,.9)}
html.cx .cxk-launch{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#9fb3d0;border-radius:9px;padding:5px 8px 5px 10px;font-size:12.5px;cursor:pointer;min-width:170px;transition:all var(--t)}
html.cx .cxk-launch:hover{border-color:rgba(91,160,255,.5);color:#fff}html.cx .cxk-launch kbd,html.cx kbd{font-family:var(--mono);font-size:10.5px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-bottom-width:2px;border-radius:5px;padding:0 5px;margin-left:auto;color:inherit}
html.cx:not(.dark) kbd{background:#f1f4f9;border-color:#d3dbe6}
html.cx .cx-theme-btn{width:34px;height:30px;display:inline-grid;place-items:center;padding:0}
/* ---------- surfaces ---------- */
html.cx .card{background:var(--panel-hi),var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
html.cx .wrap{max-width:none}
html.cx .pagehead{border-radius:16px;padding:12px 16px;align-items:center;position:relative;overflow:hidden}
html.cx .pagehead:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:linear-gradient(180deg,var(--accent),var(--accent-2))}
html.cx .ph-title h1{font-size:23px;letter-spacing:-.025em}
html.cx .eyebrow{letter-spacing:.13em;color:var(--muted)}
/* KPI tiles with sparklines */
html.cx .kpis{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
html.cx .kpi{position:relative;border:1px solid var(--line);border-left:1px solid var(--line);background:var(--card-2);border-radius:12px;padding:7px 12px 18px;min-width:108px;overflow:hidden;transition:transform var(--t) var(--ease),border-color var(--t),box-shadow var(--t)}
html.cx .kpi:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));box-shadow:var(--glow)}
html.cx .kpi b{font-size:21px;font-weight:750}html.cx .kpi .eyebrow{font-size:9px}html.cx .kpi .tiny{font-size:10.5px}
html.cx .kpi .spark{position:absolute;left:0;right:0;bottom:0;height:20px;pointer-events:none;opacity:.9}
html.cx .kpi.bump b{animation:bump .5s var(--ease)}@keyframes bump{0%{color:var(--accent);transform:translateY(-2px)}100%{transform:none}}
html.cx .kpi.warn b{color:var(--st-exception)}html.cx .kpi.risk b{color:var(--st-unscanned)}
/* buttons + inputs */
html.cx .btn{border-radius:9px;border-color:var(--line);background:var(--card-2);color:var(--ink);font-weight:650;transition:transform 120ms var(--ease),background var(--t),border-color var(--t),box-shadow var(--t)}
html.cx .btn:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
html.cx .btn:active{transform:scale(.97)}
html.cx .btn.primary,html.cx .btn.blue{background:linear-gradient(180deg,#3b8cff,#1f63d6);border-color:#2f74e6;color:#fff;box-shadow:0 0 0 1px rgba(120,180,255,.25) inset,0 8px 20px -10px rgba(47,124,246,.95)}
html.cx .btn.primary:hover{filter:brightness(1.08);box-shadow:0 0 0 1px rgba(120,180,255,.35) inset,0 10px 26px -10px rgba(47,124,246,1)}
html.cx .btn.ghost{background:transparent}
html.cx .btn.danger{background:linear-gradient(180deg,#f05252,#c92a2a);border-color:#d33}
html.cx .input,html.cx select.input,html.cx textarea.input{background:var(--card-2);border-color:var(--line);border-radius:9px;color:var(--ink);transition:border-color var(--t),box-shadow var(--t)}
html.cx .input:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
html.cx .input::placeholder{color:color-mix(in srgb,var(--muted) 80%,transparent)}
html.cx .seg{background:var(--chip);border:1px solid var(--line);border-radius:11px;padding:3px}
html.cx .seg button{border-radius:8px;color:var(--muted);transition:all var(--t)}html.cx .seg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 0 rgba(255,255,255,.05) inset,0 4px 14px -6px rgba(0,0,0,.5),0 0 0 1px var(--line)}
/* chips + status */
html.cx .chip{border-radius:7px;letter-spacing:.05em}
html.cx.dark .chip.blue{background:var(--info-bg);color:#a9ccff}html.cx.dark .chip.red{background:var(--bad-bg);color:#ffb1b1}html.cx.dark .chip.orange{background:var(--warn-bg);color:#ffcd85}html.cx.dark .chip.green{background:var(--ok-bg);color:#8ff0b4}
html.cx .status.st-active::before{animation:cxdot 1.6s infinite}
@keyframes cxdot{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--c) 70%,transparent)}70%{box-shadow:0 0 0 6px transparent}100%{box-shadow:0 0 0 0 transparent}}
html.cx .chip.red,html.cx .kpi.risk{--pulse:var(--st-unscanned)}
html.cx .riskc,html.cx .chip.pulse{animation:cxrisk 1.8s infinite}
@keyframes cxrisk{0%,100%{box-shadow:0 0 0 0 rgba(242,95,95,.35)}50%{box-shadow:0 0 0 5px rgba(242,95,95,0)}}
html.cx .ring{background:conic-gradient(var(--accent) calc(var(--p)*1%),var(--line) 0)}html.cx .ring>span{background:var(--card)}
/* tables */
html.cx .tbl{border-collapse:separate;border-spacing:0;width:100%}html.cx .tbl th{position:sticky;top:0;background:var(--card-2);color:var(--muted);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;border-bottom:1px solid var(--line);z-index:1}
html.cx .tbl td{border-bottom:1px solid var(--line-2)}html.cx .tbl tbody tr{transition:background 120ms}html.cx .tbl tbody tr:hover td{background:color-mix(in srgb,var(--accent) 7%,transparent)}
/* drawer, toast, backdrop */
html.cx .drawer{background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px);border-left:1px solid var(--glass-b);box-shadow:-30px 0 60px -30px rgba(0,0,0,.7);transition:transform 240ms var(--ease)}
html.cx .backdrop{background:rgba(2,6,14,.45);backdrop-filter:blur(2px)}
html.cx .toast{background:var(--glass);color:var(--ink);border:1px solid var(--glass-b);backdrop-filter:blur(14px);box-shadow:0 18px 40px -16px rgba(0,0,0,.6),var(--glow);transition:all 220ms var(--ease)}
/* map pins + markers */
html.cx.dark .pin{background:#0b1524;color:#e7eefa;border-color:var(--c,var(--st-pending));box-shadow:0 0 0 3px rgba(0,0,0,.25),0 0 14px -2px color-mix(in srgb,var(--c,#7d8da6) 70%,transparent)}
html.cx .pin{transition:transform 150ms var(--ease)}html.cx .pin:hover{transform:scale(1.18);z-index:9}
html.cx .pin.st-active,html.cx .pin.st-completed,html.cx .pin.st-failed{background:var(--c);color:#fff}
html.cx .pin.st-active{animation:cxpin 2s infinite}
@keyframes cxpin{0%{box-shadow:0 0 0 0 rgba(59,140,255,.6)}70%{box-shadow:0 0 0 10px rgba(59,140,255,0)}100%{box-shadow:0 0 0 0 rgba(59,140,255,0)}}
html.cx .drv-marker{width:20px;height:20px;background:radial-gradient(circle at 35% 35%,#6ff0a0,#16a34a);border:2.5px solid #eafff2;box-shadow:0 0 16px 2px rgba(34,197,94,.6)}
html.cx .drv-marker.sos{background:radial-gradient(circle at 35% 35%,#ff9a9a,#dc2626);box-shadow:0 0 18px 4px rgba(239,68,68,.7)}
html.cx.dark .map-fallback{background:radial-gradient(600px 300px at 50% 40%,#0f2140,#081221);}
html.cx.dark .map-fallback svg{opacity:.85}
html.cx .maplibregl-ctrl-group{background:var(--glass)!important;border:1px solid var(--glass-b);backdrop-filter:blur(10px);border-radius:10px!important;box-shadow:var(--shadow)!important}
html.cx.dark .maplibregl-ctrl-group button .maplibregl-ctrl-icon{filter:invert(1) brightness(1.4)}html.cx.dark .maplibregl-ctrl-group button+button{border-top-color:rgba(255,255,255,.1)}
html.cx.dark .maplibregl-ctrl-attrib{background:rgba(6,11,20,.7)!important;color:#8ea3bf}html.cx.dark .maplibregl-ctrl-attrib a{color:#a9c4ea}
/* ---------- DISPATCH BOARD: full-bleed map with glass rails ---------- */
html.cx .board:has(#mapCard:not([hidden])){display:block;position:relative;height:calc(100vh - 206px);min-height:560px;border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}
html.cx .board:has(#mapCard:not([hidden])) .mapcard{position:absolute;inset:0;border:none;border-radius:0;box-shadow:none;background:var(--bg-2)}
html.cx .board:has(#mapCard:not([hidden])) .mapbox{position:absolute;inset:0}
html.cx .board:has(#mapCard:not([hidden])) .mc-head{position:absolute;top:12px;right:56px;left:auto;z-index:6;background:var(--glass);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px);border:1px solid var(--glass-b);border-radius:14px;padding:8px 12px;gap:14px;box-shadow:var(--shadow)}
html.cx .board:has(#mapCard:not([hidden])) .side{position:absolute;left:12px;top:12px;bottom:12px;width:384px;z-index:7;background:var(--glass);backdrop-filter:blur(18px) saturate(1.35);-webkit-backdrop-filter:blur(18px);border:1px solid var(--glass-b);border-radius:16px;box-shadow:0 30px 60px -30px rgba(0,0,0,.75);transition:transform 240ms var(--ease),opacity 240ms}
html.cx .board:has(#mapCard:not([hidden])) .legend{background:var(--glass);backdrop-filter:blur(12px);border:1px solid var(--glass-b);border-radius:12px;left:auto;right:12px;bottom:28px}
html.cx.rail-off .board:has(#mapCard:not([hidden])) .side{transform:translateX(calc(-100% - 24px));opacity:0;pointer-events:none}
html.cx .rail-tg{position:absolute;z-index:8;top:24px;left:404px;width:26px;height:44px;border-radius:0 10px 10px 0;border:1px solid var(--glass-b);border-left:none;background:var(--glass);backdrop-filter:blur(12px);color:var(--ink);cursor:pointer;display:none;place-items:center;transition:left 240ms var(--ease)}
html.cx .board:has(#mapCard:not([hidden])) .rail-tg{display:grid}html.cx.rail-off .rail-tg{left:0}
html.cx .board .side-list{border-top-color:var(--line)}
html.cx .board .drv{background:transparent;border-top-color:var(--line-2);transition:background 120ms}
html.cx .board .drv:hover,html.cx .trow:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}
html.cx .board .drv.sel,html.cx .trow.sel{background:color-mix(in srgb,var(--accent) 14%,transparent);box-shadow:inset 3px 0 0 var(--accent)}
html.cx .board .drv .av,html.cx .av{background:linear-gradient(135deg,#3b8cff,#1f4f9a);color:#fff;box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 25%,transparent)}
html.cx .board .drv.on .av{box-shadow:0 0 0 2px rgba(34,197,94,.55),0 0 12px -2px rgba(34,197,94,.6)}
html.cx .board .drv.sosing{background:var(--bad-bg);animation:cxrisk 1.4s infinite}
html.cx .elig-note{border-radius:9px}html.cx.dark .elig-note.bad{background:var(--bad-bg);border-color:rgba(239,68,68,.35);color:#ffb9b9}html.cx.dark .elig-note.warn{background:var(--warn-bg);border-color:rgba(245,158,11,.35);color:#ffd28f}
html.cx.dark .elig-note.info,html.cx.dark .elig-note.edit{background:var(--info-bg);border-color:rgba(59,140,255,.35);color:#b5d2ff}
html.cx .side-foot{background:color-mix(in srgb,var(--card) 40%,transparent)}
html.cx .boardbar{margin:12px 2px 10px}
html.cx .foot{opacity:.7}
html.cx .mapbox:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,color-mix(in srgb,var(--accent) 10%,transparent) 50%,transparent 70%) 0 0/200% 100%,var(--bg-2);animation:shimmer 1.4s infinite linear;z-index:0}
@keyframes shimmer{to{background-position:-200% 0,0 0}}
html.cx .mapbox #map{z-index:1}
/* overview + settings panels */
html.cx .ov{transition:transform var(--t) var(--ease),box-shadow var(--t),border-color var(--t)}html.cx .ov:hover{transform:translateY(-2px);box-shadow:var(--glow);border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
html.cx.dark .drv,html.cx.dark .rules>div,html.cx.dark .ov-grid>div{background:transparent}
html.cx.dark .pod-ph,html.cx.dark .capture{background:var(--card-2)}
html.cx.dark .tb-blk{box-shadow:0 0 12px -4px currentColor}
/* external portals rail */
html.cx .rail{background:color-mix(in srgb,var(--card) 82%,transparent);backdrop-filter:blur(12px);border-right:1px solid var(--line)}
html.cx .rail .sn{transition:background var(--t),color var(--t)}html.cx .rail .sn.on{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 22%,transparent),transparent);box-shadow:inset 3px 0 0 var(--accent);color:var(--ink)}
html.cx.rail-off .dp-app{grid-template-columns:64px 1fr}html.cx.rail-off .rail .sn-l,html.cx.rail-off .rail .rail-note{display:none}html.cx.rail-off .rail .sn{justify-content:center}
html.cx .dp-login{background:var(--glass);backdrop-filter:blur(16px);border:1px solid var(--glass-b);box-shadow:0 40px 80px -40px rgba(0,0,0,.8),var(--glow)}
html.cx .dp-id,html.cx .rep,html.cx .pod-c,html.cx .trk{background:var(--card-2);transition:transform var(--t) var(--ease),border-color var(--t)}html.cx .dp-id:hover,html.cx .rep:hover,html.cx .pod-c:hover{transform:translateY(-1px)}
html.cx .trk-grid>div{background:var(--chip)}html.cx.dark .pod-photo{background:linear-gradient(135deg,#16304f,#0f2038);color:#a9c4ea}
html.cx .dp-form{background:color-mix(in srgb,var(--accent) 6%,transparent)}
/* ---------- command palette ---------- */
.cxk-back{position:fixed;inset:0;z-index:200;background:rgba(2,6,14,.5);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:flex-start;padding-top:12vh;animation:cxfade 140ms ease}
.cxk{width:min(640px,92vw);background:var(--glass,rgba(11,20,34,.92));backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px);border:1px solid var(--glass-b,rgba(120,165,230,.2));border-radius:16px;box-shadow:0 40px 90px -30px rgba(0,0,0,.85),var(--glow);overflow:hidden;color:var(--ink);animation:cxpop 180ms var(--ease)}
.cxk input{width:100%;border:none;background:transparent;padding:16px 18px;font-size:16px;outline:none;color:var(--ink);border-bottom:1px solid var(--line)}
.cxk-list{max-height:52vh;overflow:auto;padding:6px}.cxk-g{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:8px 12px 4px;font-weight:800}
.cxk-i{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;cursor:pointer;font-size:14px}.cxk-i small{color:var(--muted);font-size:12px;margin-left:auto}.cxk-i .ki{width:22px;text-align:center;opacity:.8}
.cxk-i.on{background:linear-gradient(90deg,color-mix(in srgb,var(--accent) 26%,transparent),color-mix(in srgb,var(--accent) 8%,transparent));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 40%,transparent)}
.cxk-f{display:flex;gap:14px;padding:8px 14px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted)}.cxk-empty{padding:22px;text-align:center;color:var(--muted)}
@keyframes cxfade{from{opacity:0}}@keyframes cxpop{from{opacity:0;transform:translateY(-8px) scale(.98)}}
/* shortcuts help */
.cxh{width:min(560px,92vw);padding:18px 20px}.cxh h3{margin-bottom:10px}.cxh-g{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}.cxh-g div{display:flex;justify-content:space-between;align-items:center;font-size:13px;padding:5px 0;border-bottom:1px solid var(--line-2)}
/* first-run tour */
.cxt-ring{position:fixed;z-index:210;border-radius:12px;box-shadow:0 0 0 9999px rgba(2,6,14,.55),0 0 0 2px var(--accent),0 0 30px 4px rgba(59,140,255,.5);pointer-events:none;transition:all 260ms var(--ease)}
.cxt-tip{position:fixed;z-index:211;width:320px;background:var(--glass,rgba(11,20,34,.95));backdrop-filter:blur(18px);border:1px solid var(--glass-b);border-radius:14px;padding:14px 16px;box-shadow:0 30px 70px -20px rgba(0,0,0,.8);color:var(--ink);transition:all 260ms var(--ease);animation:cxpop 200ms var(--ease)}
.cxt-tip b{font-size:15px;display:block;margin-bottom:4px}.cxt-tip p{margin:0 0 12px;font-size:13px;color:var(--muted);line-height:1.5}.cxt-f{display:flex;align-items:center;gap:8px}.cxt-f .dots{margin-right:auto;display:flex;gap:4px}.cxt-f .dots i{width:6px;height:6px;border-radius:50%;background:var(--line)}.cxt-f .dots i.on{background:var(--accent);box-shadow:0 0 8px var(--accent)}
/* hint chips (tooltips) */
[data-tip]{position:relative}
html.cx [data-tip]:hover:after{content:attr(data-tip);position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;background:var(--glass);color:var(--ink);border:1px solid var(--glass-b);backdrop-filter:blur(10px);font-size:11.5px;font-weight:600;padding:5px 9px;border-radius:8px;z-index:100;pointer-events:none;box-shadow:var(--shadow);animation:cxfade 120ms;letter-spacing:0;text-transform:none}
/* splash */
.cx-splash{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:var(--bg,#060b14);transition:opacity 320ms ease,visibility 320ms}.cx-splash.out{opacity:0;visibility:hidden}
.cx-splash .wm{font:800 34px/1 var(--font,system-ui);letter-spacing:-.04em;color:var(--ink)}.cx-splash .wm span{color:#4c95ff}.cx-splash .ln{width:160px;height:2px;margin:14px auto 0;border-radius:2px;background:linear-gradient(90deg,transparent,#3b8cff,#22d3ee,transparent) 0 0/200% 100%;animation:shimmer 1s linear infinite}
.cx-splash small{display:block;text-align:center;margin-top:10px;color:var(--muted,#90a5c1);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
@media (prefers-reduced-motion:reduce){html.cx *{animation:none!important;transition:none!important}}
html.cx .topbar{gap:14px;padding:0 16px}html.cx .topbar *{white-space:nowrap}html.cx .tb-right{gap:8px}
html.cx .cxk-launch{min-width:0}@media (max-width:1680px){html.cx .cxk-launch span{display:none}html.cx .pilot-badge{font-size:0;padding:4px}html.cx .pilot-badge::before{margin:0}}
@media (max-width:1400px){html.cx .topnav .tn{padding:6px 9px}}
@media (max-width:1680px){html.cx .pilot-badge{display:none}}
html.cx .sv-tools select.input{width:auto;flex:0 0 auto;min-width:170px}
html.cx .topbar .who-box .btn.ghost{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:#e8f0fa}
html.cx .topbar .who-box .btn.ghost:hover{background:rgba(255,255,255,.14)}


/* ---------- Day / Night polish + smooth theme transitions ---------- */
html.cx,html.cx body,html.cx .card,html.cx .topbar,html.cx .drawer,html.cx .toast,html.cx .kpi,html.cx .kc,html.cx .chip,html.cx .btn,html.cx .rail,html.cx .sheet,html.cx .phone,html.cx .cxk,html.cx .pagehead,html.cx .side,html.cx .mapcard,html.cx .tbl th,html.cx .tbl td,html.cx .legend,html.cx .cx-splash,html.cx .input,html.cx select,html.cx textarea{
  transition:background-color 360ms var(--ease),background 360ms var(--ease),color 280ms var(--ease),border-color 280ms var(--ease),box-shadow 360ms var(--ease)}
html.cx .cx-theme-sw,html.cx .cx-theme-seg,html.cx .cx-theme-seg button,html.cx .cx-theme-ind{transition:background 180ms var(--ease),color 180ms var(--ease),box-shadow 180ms var(--ease),border-color 180ms var(--ease)}
html.cx:not(.dark) .cxk-back{background:rgba(23,43,69,.38)}
html.cx:not(.dark) .cxt-ring{box-shadow:0 0 0 9999px rgba(23,43,69,.45),0 0 0 2px var(--accent),0 0 24px 4px rgba(37,99,201,.35)}
html.cx:not(.dark) .backdrop{background:rgba(15,27,45,.32)}
html.cx:not(.dark) .cxk,html.cx:not(.dark) .cxt-tip{background:rgba(255,255,255,.94);box-shadow:0 30px 70px -24px rgba(23,43,69,.35),var(--glow)}
html.cx:not(.dark) .map-fallback{background:radial-gradient(600px 300px at 50% 40%,#f4f7fb,#e4ebf3)}
html.cx:not(.dark) .map-fallback .note,html.cx.dark .map-fallback .note{background:var(--glass);color:var(--ink);border:1px solid var(--glass-b)}
html.cx.dark .map-fallback .note{background:rgba(8,16,28,.82)}
html.cx:not(.dark) .legend .status{color:var(--ink)!important}
html.cx .legend{color:var(--ink)}
html.cx:not(.dark) .toast{box-shadow:0 18px 40px -16px rgba(23,43,69,.28),var(--glow)}
html.cx:not(.dark) .dp-login{box-shadow:0 40px 80px -40px rgba(23,43,69,.35),var(--glow)}
html.cx:not(.dark) .cx-splash .wm span{color:#2563c9}
html.cx:not(.dark) .pilot-badge{background:rgba(255,255,255,.08);color:#d5e2f5}
/* Day map controls stay readable on the light basemap */
html.cx:not(.dark) .maplibregl-ctrl-attrib{background:rgba(255,255,255,.8)!important;color:#51647c}
html.cx:not(.dark) .mapbox{background:#e7eef5}
html.cx.dark .mapbox{background:#07101d}
/* Settings switcher inside light cards */
html.cx:not(.dark) .setview .cx-theme-sw,html.cx:not(.dark) .body .cx-theme-sw{filter:none}