:root{
  --bg:#F3F6FA;--surface:#FFFFFF;--surface-2:#EDF1F7;--ink:#0A1428;--ink-2:#44516A;--ink-3:#7C889E;--line:#E0E6EF;--line-2:#C7D0DD;
  --blue:#0A6CF5;--blue-2:#0058D6;--blue-soft:#E4EFFF;--amber:#FFB020;--amber-soft:#FFF2D6;
  --ok:#0F9657;--ok-soft:#E0F4EA;--warn:#B87400;--warn-soft:#FFF4DE;--err:#D5383A;--err-soft:#FDE8E8;
  --navy:#03122B;--navy-2:#0A1C3C;--navy-3:#10264D;--navy-line:#1B3263;--on-navy:#EAF2FF;--on-navy-2:#98ACCD;
  --m-land:#0D2042;--m-edge:#1D3868;--m-water:#03122B;--m-hi:#1A3A72;
  --shadow-1:0 1px 2px rgba(10,20,40,.05);--shadow-2:0 1px 2px rgba(10,20,40,.06),0 14px 34px -16px rgba(10,20,40,.25);
  --display:"Unbounded","Arial Black",system-ui,sans-serif;--body:"Onest","Segoe UI",Roboto,Helvetica,Arial,sans-serif;--mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.2,.7,.2,1);--side:248px;
  --c1:#0A6CF5;--c2:#FFB020;--c3:#0F9657;--c4:#8B5CF6;--c5:#E5484D;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;
  --bg:#060D1C;--surface:#0E1830;--surface-2:#14203B;--ink:#E8F0FC;--ink-2:#A4B2CA;--ink-3:#6C7A95;--line:#1D2A47;--line-2:#2D3C60;
  --blue:#3D8BFF;--blue-2:#62A2FF;--blue-soft:#0F2447;--amber-soft:#35290F;--ok:#35C483;--ok-soft:#0F2E22;--warn:#F2A93B;--warn-soft:#33260E;--err:#FF6B6B;--err-soft:#3A1518;
  --navy:#020B1C;--navy-2:#081733;--navy-3:#0E2144;--navy-line:#1A2F5A;--shadow-2:0 1px 2px rgba(0,0,0,.4),0 14px 36px -16px rgba(0,0,0,.7);--c1:#3D8BFF}}
:root[data-theme="dark"]{color-scheme:dark;
  --bg:#060D1C;--surface:#0E1830;--surface-2:#14203B;--ink:#E8F0FC;--ink-2:#A4B2CA;--ink-3:#6C7A95;--line:#1D2A47;--line-2:#2D3C60;
  --blue:#3D8BFF;--blue-2:#62A2FF;--blue-soft:#0F2447;--amber-soft:#35290F;--ok:#35C483;--ok-soft:#0F2E22;--warn:#F2A93B;--warn-soft:#33260E;--err:#FF6B6B;--err-soft:#3A1518;
  --navy:#020B1C;--navy-2:#081733;--navy-3:#0E2144;--navy-line:#1A2F5A;--shadow-2:0 1px 2px rgba(0,0,0,.4),0 14px 36px -16px rgba(0,0,0,.7);--c1:#3D8BFF}
*{box-sizing:border-box}[hidden]{display:none!important}
html,body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.5 var(--body);-webkit-font-smoothing:antialiased}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:600;letter-spacing:-.02em}
h1{font-size:clamp(22px,2.4vw,28px);line-height:1.15}h2{font-size:18px;line-height:1.25}h3{font-size:15px;font-family:var(--body);font-weight:700;letter-spacing:0}
p{margin:0}
.mono{font-family:var(--mono)}.tnum{font-variant-numeric:tabular-nums}.muted{color:var(--ink-2)}.faint{color:var(--ink-3)}.small{font-size:13px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:10px;border:1px solid var(--line-2);background:var(--surface);font-weight:600;font-size:14px;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,transform .1s;text-decoration:none!important;color:var(--ink)}
.btn:hover{border-color:var(--ink-3)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-p{background:var(--blue);border-color:var(--blue);color:#fff}.btn-p:hover{background:var(--blue-2);border-color:var(--blue-2)}
.btn-ok{background:var(--ok);border-color:var(--ok);color:#fff}
.btn-d{color:var(--err);border-color:color-mix(in srgb,var(--err) 40%,transparent)}
.btn-g{background:transparent;border-color:transparent}.btn-g:hover{background:var(--surface-2)}
.btn-sm{height:32px;padding:0 11px;font-size:13px;border-radius:8px}.btn-lg{height:48px;padding:0 22px;font-size:15px}
.icon-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);display:inline-grid;place-items:center;cursor:pointer;position:relative;color:var(--ink-2)}
.icon-btn:hover{color:var(--ink);border-color:var(--line-2)}
.icon-btn .dot{position:absolute;top:6px;right:6px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--err);color:#fff;font:700 10px/16px var(--body);text-align:center}
/* forms */
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld>label,.lbl{font:600 12px/1.3 var(--body);color:var(--ink-2);text-transform:uppercase;letter-spacing:.06em}
.inp{height:42px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface);padding:0 12px;width:100%;min-width:0}
textarea.inp{height:auto;min-height:88px;padding:10px 12px;resize:vertical}
.inp:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--blue) 18%,transparent)}
.inp.bad{border-color:var(--err)}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:640px){.g2,.g3{grid-template-columns:minmax(0,1fr)}}
.stack{display:flex;flex-direction:column;gap:14px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.spread{justify-content:space-between}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.chip[aria-pressed="true"]{background:var(--blue-soft);border-color:var(--blue);color:var(--blue)}
.seg{display:inline-flex;background:var(--surface-2);border-radius:10px;padding:3px;gap:2px}
.seg button{border:0;background:transparent;height:32px;padding:0 12px;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;color:var(--ink-2)}
.seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1)}
/* layout */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:100vh;background:linear-gradient(90deg,var(--navy) var(--side),transparent 0)}
.side{background:var(--navy);color:var(--on-navy);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:18px 14px;gap:6px;overflow:auto}
.side .who{margin:0 4px 12px;padding:12px;border:1px solid var(--navy-line);border-radius:12px;background:var(--navy-2)}
.side .who b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side .who span{font:600 10.5px var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--amber)}
.nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:var(--on-navy-2);font-weight:600;font-size:14px;text-decoration:none!important}
.nav a:hover{background:var(--navy-2);color:#fff}.nav a[aria-current="page"]{background:var(--navy-3);color:#fff}
.nav a svg{width:18px;height:18px;flex:none;opacity:.9}.nav a .cnt{margin-left:auto;background:var(--amber);color:#1a1000;border-radius:999px;font:700 11px/18px var(--body);min-width:20px;text-align:center;padding:0 6px}
.side .foot{margin-top:auto;display:flex;flex-direction:column;gap:4px;padding-top:12px;border-top:1px solid var(--navy-line)}
.side .foot a,.side .foot button{background:none;border:0;color:var(--on-navy-2);text-align:left;padding:8px 12px;border-radius:8px;cursor:pointer;font-size:13.5px;text-decoration:none!important}
.side .foot a:hover,.side .foot button:hover{background:var(--navy-2);color:#fff}
.main{min-width:0;display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:20;height:62px;display:flex;align-items:center;gap:10px;padding:0 clamp(16px,3vw,32px);background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.top h1{font-size:18px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.top .sp{margin-left:auto;display:flex;align-items:center;gap:8px}
.top select{height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface);padding:0 8px;font-weight:600}
.content{padding:clamp(16px,3vw,32px);display:flex;flex-direction:column;gap:20px;max-width:1320px;width:100%}
.hamb{display:none}
@media (max-width:960px){
 .shell{grid-template-columns:minmax(0,1fr);background:none}
 .side{position:fixed;inset:0 auto 0 0;width:min(300px,86vw);z-index:60;transform:translateX(-102%);transition:transform .25s var(--ease)}
 .shell.open .side{transform:none;box-shadow:0 0 0 100vmax rgba(2,8,20,.5)}
 .hamb{display:inline-grid}
}
.demo-bar{background:var(--amber);color:#1a1000;font-weight:600;font-size:13px;padding:8px clamp(16px,3vw,32px);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.demo-bar .seg{background:rgba(0,0,0,.08)}.demo-bar .seg button{color:#1a1000}
/* cards */
.card{background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-1)}
.card>.hd{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line)}
.card>.bd{padding:18px}
.card.pad{padding:18px}
.grid-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media (max-width:1100px){.grid-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.kpi .l{font:600 12px var(--body);color:var(--ink-2);text-transform:uppercase;letter-spacing:.06em}
.kpi .v{font:600 26px/1.1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kpi .d{font-size:12.5px;color:var(--ink-3)}.kpi .d b.up{color:var(--ok)}.kpi .d b.dn{color:var(--err)}
.cols{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:1100px){.cols{grid-template-columns:minmax(0,1fr)}}
/* pills */
.pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font:600 12px var(--body);white-space:nowrap;background:var(--surface-2);color:var(--ink-2)}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.s-new,.s-quoted{background:var(--amber-soft);color:var(--warn)}
.s-confirmed,.s-assigned{background:var(--blue-soft);color:var(--blue)}
.s-pickup,.s-in_transit{background:color-mix(in srgb,var(--c4) 14%,transparent);color:var(--c4)}
.s-delivered,.s-completed,.s-verified{background:var(--ok-soft);color:var(--ok)}
.s-cancelled,.s-rejected,.s-suspended{background:var(--err-soft);color:var(--err)}
.s-pending{background:var(--amber-soft);color:var(--warn)}
/* tables */
.tbl-wrap{overflow:auto}
table.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th{text-align:left;font:600 11.5px var(--body);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);padding:10px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl tr.click{cursor:pointer}.tbl tr.click:hover td{background:var(--surface-2)}
.tbl td.num,.tbl th.num{text-align:right;font-variant-numeric:tabular-nums}
.tbl tr:last-child td{border-bottom:0}
/* order cards */
.olist{display:flex;flex-direction:column;gap:12px}
.oc{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:16px 18px;cursor:pointer;transition:border-color .15s,box-shadow .15s;text-decoration:none!important;color:inherit}
.oc:hover{border-color:var(--line-2);box-shadow:var(--shadow-2)}
.oc .rt{font-weight:700;font-size:16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.oc .rt i{color:var(--amber);font-style:normal}
.oc .meta{display:flex;gap:6px 14px;flex-wrap:wrap;color:var(--ink-2);font-size:13px;margin-top:4px}
.oc .pr{text-align:right;font:600 18px var(--display);font-variant-numeric:tabular-nums}
.bar{height:6px;border-radius:3px;background:var(--surface-2);overflow:hidden;margin-top:12px;grid-column:1/-1}
.bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,var(--blue),var(--amber));transition:width .6s var(--ease)}
/* stepper */
.steps{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;counter-reset:s}
.steps .s{display:flex;flex-direction:column;gap:8px;font-size:12px;color:var(--ink-3);font-weight:600;min-width:0}
.steps .s .b{height:6px;border-radius:3px;background:var(--surface-2)}
.steps .s.done{color:var(--ink-2)}.steps .s.done .b{background:var(--blue)}
.steps .s.cur{color:var(--ink)}.steps .s.cur .b{background:linear-gradient(90deg,var(--blue),var(--amber));animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.55}}
@media (max-width:760px){.steps{grid-template-columns:repeat(7,minmax(0,1fr))}.steps .s span{display:none}.steps .s.cur span{display:block;white-space:nowrap}}
/* tabs */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tabs button{border:0;background:none;padding:12px 14px;font-weight:600;font-size:14px;color:var(--ink-2);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;display:inline-flex;gap:6px;align-items:center}
.tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--blue)}
.tabs .cnt{background:var(--surface-2);border-radius:999px;padding:0 7px;font-size:12px}
/* definition lists */
.dl{display:grid;grid-template-columns:minmax(120px,auto) minmax(0,1fr);gap:10px 18px;font-size:14px}
.dl dt{color:var(--ink-3)}.dl dd{margin:0;font-weight:600;min-width:0;overflow-wrap:anywhere}
/* timeline */
.tl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.tl li{display:grid;grid-template-columns:18px minmax(0,1fr);gap:12px;padding-bottom:16px;position:relative}
.tl li::before{content:"";position:absolute;left:8px;top:18px;bottom:0;width:2px;background:var(--line)}
.tl li:last-child::before{display:none}
.tl .dotc{width:18px;height:18px;border-radius:50%;border:3px solid var(--surface);background:var(--blue);box-shadow:0 0 0 1px var(--line-2);margin-top:2px}
.tl .dotc.n{background:var(--ink-3)}.tl .dotc.w{background:var(--amber)}
.tl .tx b{font-size:14px}.tl .tx p{font-size:13.5px;color:var(--ink-2);margin-top:2px;white-space:pre-wrap}.tl .tx time{display:block;font-size:12px;color:var(--ink-3)}
/* chat */
.chat{display:flex;flex-direction:column;height:min(560px,70vh)}
.chat .msgs{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:78%;display:flex;flex-direction:column;gap:3px}
.msg .b{padding:10px 13px;border-radius:14px;background:var(--surface-2);font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.msg.me{align-self:flex-end;align-items:flex-end}.msg.me .b{background:var(--blue);color:#fff;border-bottom-right-radius:4px}
.msg:not(.me) .b{border-bottom-left-radius:4px}
.msg small{font-size:11.5px;color:var(--ink-3)}.msg small b{color:var(--ink-2)}
.chat form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}
/* docs */
.docs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.doc{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface);display:flex;flex-direction:column;text-decoration:none!important;color:inherit}
.doc .th{aspect-ratio:4/3;background:var(--surface-2) center/cover no-repeat;display:grid;place-items:center;color:var(--ink-3)}
.doc .nm{padding:8px 10px;font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc .kd{padding:0 10px 8px;font-size:11.5px;color:var(--ink-3)}
.drop{border:2px dashed var(--line-2);border-radius:14px;padding:18px;display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap;color:var(--ink-2);text-align:center}
.drop.over{border-color:var(--blue);background:var(--blue-soft)}
/* maps */
.map{position:relative;border-radius:14px;overflow:hidden;background:var(--m-water);min-height:320px}
.map svg{display:block;width:100%;height:100%;position:absolute;inset:0}
.map .cty{fill:var(--m-land);stroke:var(--m-edge);stroke-width:.6;vector-effect:non-scaling-stroke}
.map .cty.hi{fill:var(--m-hi)}
.map .hud{position:absolute;left:12px;top:12px;right:12px;display:flex;gap:8px;flex-wrap:wrap;pointer-events:none}
.map .hud span{background:rgba(3,18,43,.85);color:#EAF2FF;border:1px solid var(--navy-line);border-radius:10px;padding:7px 11px;font-size:12.5px;font-weight:600;backdrop-filter:blur(6px)}
.map .hud b{color:var(--amber)}
.map .legend{position:absolute;left:12px;bottom:12px;display:flex;gap:6px;flex-wrap:wrap}
.map .legend span{background:rgba(3,18,43,.85);color:#EAF2FF;border-radius:8px;padding:5px 9px;font:600 11.5px var(--mono)}
.pulse-dot{animation:pd 2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes pd{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
/* charts */
.chart{width:100%;display:block}
.chart text{fill:var(--ink-3);font:500 11px var(--body)}
.chart .gl{stroke:var(--line);stroke-width:1}
.legend-row{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-2)}
.legend-row i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.hbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;font-size:13.5px;align-items:center}
.hbar .tr{grid-column:1/-1;height:8px;border-radius:4px;background:var(--surface-2);overflow:hidden;margin-bottom:8px}
.hbar .tr i{display:block;height:100%;border-radius:4px;background:var(--blue)}
.funnel{display:flex;flex-direction:column;gap:8px}
.funnel .f{display:grid;grid-template-columns:130px minmax(0,1fr) 44px;gap:10px;align-items:center;font-size:13px}
.funnel .f .tr{height:22px;border-radius:6px;background:var(--surface-2);overflow:hidden}
.funnel .f .tr i{display:block;height:100%;border-radius:6px}
.funnel .f b{text-align:right;font-variant-numeric:tabular-nums}
/* banners */
.banner{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:14px;border:1px solid;flex-wrap:wrap}
.banner.info{background:var(--blue-soft);border-color:color-mix(in srgb,var(--blue) 30%,transparent)}
.banner.warn{background:var(--warn-soft);border-color:color-mix(in srgb,var(--warn) 30%,transparent)}
.banner.ok{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 30%,transparent)}
.banner .tx{flex:1;min-width:220px}.banner .tx b{display:block;margin-bottom:2px}
.progress{height:8px;border-radius:4px;background:var(--surface-2);overflow:hidden}.progress i{display:block;height:100%;background:var(--ok);border-radius:4px}
.att{display:flex;flex-direction:column}
.att a{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);color:inherit;text-decoration:none!important}
.att a:last-child{border-bottom:0}.att a b{font:600 20px var(--display);min-width:36px;color:var(--amber)}
/* modal & toast */
.modal{position:fixed;inset:0;z-index:80;background:rgba(2,8,20,.55);display:grid;place-items:center;padding:16px;animation:fade .2s}
.modal .box{background:var(--surface);border-radius:18px;width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;box-shadow:0 30px 80px -20px rgba(0,0,0,.5)}
.modal .box.wide{width:min(860px,100%)}
.modal .mh{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--surface);z-index:2}
.modal .mb{padding:20px}.modal .mf{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid var(--line);position:sticky;bottom:0;background:var(--surface)}
@keyframes fade{from{opacity:0}}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:90;background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:12px;font-weight:600;font-size:14px;box-shadow:var(--shadow-2);animation:fade .25s}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(400px,100vw);background:var(--surface);z-index:70;box-shadow:-20px 0 60px -20px rgba(0,0,0,.4);display:flex;flex-direction:column;animation:slide .25s var(--ease)}
@keyframes slide{from{transform:translateX(30px);opacity:0}}
.drawer .dh{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}
.drawer .db{overflow:auto;flex:1}
.nt{display:block;padding:14px 18px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none!important}
.nt.unread{background:var(--blue-soft)}.nt b{display:block;font-size:14px}.nt span{font-size:13px;color:var(--ink-2)}.nt time{font-size:12px;color:var(--ink-3)}
/* brand (matches transportte.com) */
.brand{display:flex;align-items:center;gap:10px;text-decoration:none!important;color:inherit}
.brand .lg{width:34px;height:34px;border-radius:9px;display:block;flex:none;box-shadow:0 0 0 1px rgba(40,150,255,.35),0 6px 18px -6px rgba(0,122,253,.7)}
.wm{font:800 21px/1 "Poppins","Onest",system-ui,sans-serif;letter-spacing:-.035em;white-space:nowrap}
.wm i{font-style:normal;background:linear-gradient(180deg,#22B2FF,#0A6CF5);-webkit-background-clip:text;background-clip:text;color:transparent}
.side .brand{padding:4px 8px 16px;color:#fff;font:inherit}.side .brand .lg{width:32px;height:32px}.side .brand .wm{font-size:19px}
/* language picker */
.lp{position:relative;display:inline-block}
.lp-b{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 10px 0 8px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:600 13.5px var(--body);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.lp-b:hover{border-color:var(--line-2)}.lp-b[aria-expanded="true"]{border-color:var(--c1);box-shadow:0 0 0 3px color-mix(in srgb,var(--c1) 18%,transparent)}
.lp-b .cv{opacity:.6;transition:transform .2s}.lp-b[aria-expanded="true"] .cv{transform:rotate(180deg)}
.fl{width:22px;height:16px;border-radius:4px;overflow:hidden;display:inline-grid;place-items:center;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.12)}
.fl svg{width:100%;height:100%;display:block}
.cd{font:600 11.5px var(--mono);letter-spacing:.04em;color:var(--ink-3)}
.lp-b .cd{color:var(--ink);font-size:12px}
.lp-m{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:200px;margin:0;padding:6px;list-style:none;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 18px 50px -12px rgba(3,18,43,.35);animation:lpIn .16s ease-out}
@keyframes lpIn{from{opacity:0;transform:translateY(-4px) scale(.98)}}
.lp-m li{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer;font-size:14px;font-weight:500;outline:none}
.lp-m li .cd{margin-left:auto}
.lp-m li:hover,.lp-m li:focus{background:var(--surface-2)}
.lp-m li[aria-selected="true"]{background:color-mix(in srgb,var(--c1) 12%,transparent);color:var(--c1);font-weight:700}
.lp-m li[aria-selected="true"] .cd{color:var(--c1)}
/* auth v2 */
.auth2{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--bg)}
.au-art{position:sticky;top:0;height:100vh;height:100dvh;align-self:start;overflow:hidden;background:var(--navy) url(/hero-poster.webp) center/cover no-repeat;color:var(--on-navy);display:flex;flex-direction:column;justify-content:space-between;padding:36px clamp(28px,4vw,56px) 44px;isolation:isolate}
.au-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.au-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(3,18,43,.55) 0%,rgba(3,18,43,.35) 38%,rgba(3,18,43,.92) 100%),radial-gradient(700px 480px at 20% 100%,rgba(10,108,245,.35),transparent 70%)}
.au-top .brand{color:#fff}
.au-copy{max-width:520px}
.au-eye{display:inline-flex;align-items:center;gap:8px;font:700 11.5px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#8FC2FF;margin-bottom:14px}
.au-eye::before{content:"";width:22px;height:2px;border-radius:2px;background:linear-gradient(90deg,#22B2FF,#0A6CF5)}
.au-copy h2{font-size:clamp(26px,2.8vw,38px);line-height:1.12;color:#fff;margin-bottom:26px;text-wrap:balance}
.au-copy ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.au-copy li{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:14px;background:rgba(8,23,51,.55);border:1px solid rgba(143,194,255,.16);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.au-copy li .ai{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;background:rgba(10,108,245,.22);color:#7DB8FF}
.au-copy li b{display:block;font-size:14px;color:#fff;margin-bottom:2px}
.au-copy li small{display:block;font-size:12.5px;line-height:1.4;color:var(--on-navy-2)}
.au-main{display:flex;flex-direction:column;align-items:center;padding:22px clamp(16px,4vw,48px) 20px;min-width:0}
.au-bar{width:100%;display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:40px}
.au-mb{display:none;margin-right:auto}
.au-card{width:min(440px,100%);margin:auto 0;padding:28px 0;display:flex;flex-direction:column;gap:22px;animation:auIn .35s ease-out}
@keyframes auIn{from{opacity:0;transform:translateY(8px)}}
.au-h h1{font-size:clamp(26px,2.6vw,32px);margin-bottom:8px}
.au-h p{margin:0;font-size:15px}
.au-foot{font-size:12.5px;color:var(--ink-3);margin:0}.au-foot a{color:inherit}
.au-tabs{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line)}
.au-tabs .ind{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:9px;background:var(--surface);box-shadow:var(--shadow-1),0 0 0 1px var(--line);transition:transform .28s cubic-bezier(.3,.7,.2,1)}
.au-tabs button{position:relative;z-index:1;height:40px;border:0;background:transparent;font:600 14px var(--body);color:var(--ink-2);cursor:pointer;border-radius:9px}
.au-tabs button[aria-selected="true"]{color:var(--ink)}
.au-f{display:flex;flex-direction:column;gap:14px}
.af{display:flex;flex-direction:column;gap:7px}
.af>label{font:600 13px var(--body);color:var(--ink-2)}
.af .lr{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.af .lr label{font:600 13px var(--body);color:var(--ink-2)}
.aw{position:relative;display:flex;align-items:center;height:50px;border:1.5px solid var(--line-2);border-radius:12px;background:var(--surface);transition:border-color .15s,box-shadow .15s}
.aw:hover{border-color:var(--ink-3)}
.aw:focus-within{border-color:var(--c1);box-shadow:0 0 0 4px color-mix(in srgb,var(--c1) 16%,transparent)}
.aw.bad{border-color:var(--err);box-shadow:0 0 0 4px color-mix(in srgb,var(--err) 14%,transparent)}
.aw .ai2{width:46px;display:grid;place-items:center;color:var(--ink-3);flex:none}
.aw:focus-within .ai2{color:var(--c1)}
.aw input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--ink);font:500 15.5px var(--body);padding:0 14px 0 0}
.aw input::placeholder{color:var(--ink-3)}
.aw input:-webkit-autofill{-webkit-box-shadow:0 0 0 40px var(--surface) inset;-webkit-text-fill-color:var(--ink)}
.eye{width:44px;height:44px;margin-right:3px;border:0;background:transparent;color:var(--ink-3);display:grid;place-items:center;cursor:pointer;border-radius:10px}
.eye:hover{color:var(--ink)}.eye.on{color:var(--c1)}
.lnk{border:0;background:none;padding:0;color:var(--c1);font:600 13px var(--body);cursor:pointer}.lnk:hover{text-decoration:underline}
.pwm{display:flex;flex-direction:column;gap:6px;margin-top:-4px}
.pwm .bars{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.pwm i{height:4px;border-radius:4px;background:var(--line);transition:background .25s}
.pwm i.s1{background:#E5484D}.pwm i.s2{background:#F59E0B}.pwm i.s3{background:#22A06B}.pwm i.s4{background:#0F9657}
.pwm small{font-size:12.5px;color:var(--ink-3)}
.roles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.roles button{position:relative;text-align:left;display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:14px;border:1.5px solid var(--line-2);background:var(--surface);color:var(--ink);cursor:pointer;transition:border-color .15s,box-shadow .15s,transform .1s}
.roles button:hover{border-color:var(--ink-3)}
.roles button[aria-checked="true"]{border-color:var(--c1);box-shadow:0 0 0 4px color-mix(in srgb,var(--c1) 14%,transparent);background:color-mix(in srgb,var(--c1) 5%,var(--surface))}
.roles .ri{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--surface-2);color:var(--ink-2);margin-bottom:6px}
.roles button[aria-checked="true"] .ri{background:var(--c1);color:#fff}
.roles b{font-size:14.5px}.roles small{font-size:12.5px;line-height:1.35;color:var(--ink-2)}
.roles .tick{position:absolute;top:10px;right:10px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;border:1.5px solid var(--line-2);color:transparent}
.roles button[aria-checked="true"] .tick{background:var(--c1);border-color:var(--c1);color:#fff}
.au-go{width:100%;height:52px;border-radius:12px;font-size:15.5px;gap:10px;background:linear-gradient(180deg,#1C7DFF,#0A6CF5);border-color:#0A5FD8;color:#fff;box-shadow:0 10px 24px -10px rgba(10,108,245,.7),inset 0 1px 0 rgba(255,255,255,.2)}
.au-go:hover{filter:brightness(1.06);border-color:#0A5FD8}
.au-go svg{transition:transform .2s}.au-go:hover svg{transform:translateX(3px)}
.au-go.busy{pointer-events:none;color:transparent;position:relative}.au-go.busy svg{opacity:0}
.au-go.busy::after{content:"";position:absolute;width:20px;height:20px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.au-magic{width:100%;height:50px;border-radius:12px;font-size:15px}
.or{display:flex;align-items:center;gap:12px;color:var(--ink-3);font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.au-terms{margin:0;text-align:center}
.au-demo{display:flex;flex-direction:column;gap:12px;padding:16px;border-radius:16px;border:1px dashed var(--line-2);background:color-mix(in srgb,var(--surface-2) 60%,transparent)}
.au-demo b{display:block;font-size:14px}.au-demo small{font-size:12.5px;color:var(--ink-2)}
.au-demo .dr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.chipb{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:40px;padding:0 10px;border-radius:10px;border:1px solid var(--line-2);background:var(--surface);color:var(--ink);font:600 13px var(--body);text-decoration:none!important;transition:border-color .15s,color .15s,transform .1s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chipb svg{flex:none}.chipb:hover{border-color:var(--c1);color:var(--c1)}.chipb:active{transform:translateY(1px)}
.au-sent{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.au-sent .big{width:72px;height:72px;border-radius:22px;display:grid;place-items:center;background:color-mix(in srgb,var(--c1) 12%,transparent);color:var(--c1);margin-bottom:6px}
.au-sent .big svg{width:34px;height:34px}
.au-sent p{margin:0;max-width:36ch}.au-sent .btn{margin-top:10px}
@media (max-width:1100px){.au-copy ul{grid-template-columns:1fr}}
@media (max-width:900px){.auth2{grid-template-columns:minmax(0,1fr)}.au-art{display:none}.au-mb{display:block}.au-main{padding-top:14px}.au-card{padding-top:18px}}
@media (max-width:340px){.au-demo .dr{grid-template-columns:1fr}}
@media (max-width:420px){.roles small{display:none}.roles button{padding:12px}}
@media (prefers-reduced-motion:reduce){.au-card,.lp-m{animation:none}.au-tabs .ind{transition:none}}
.err{color:var(--err);font-size:13.5px;font-weight:600}.ok-t{color:var(--ok);font-size:13.5px;font-weight:600}
.divider{display:flex;align-items:center;gap:10px;color:var(--ink-3);font-size:12px}.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
/* photo report */
.angles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:560px){.angles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ang{position:relative;aspect-ratio:4/3;border-radius:12px;border:2px dashed var(--line-2);background:var(--surface-2) center/cover no-repeat;display:grid;place-items:center;cursor:pointer;overflow:hidden;color:var(--ink-2);font-size:13px;font-weight:600;text-align:center}
.ang.has{border-style:solid;border-color:var(--ok)}.ang.has span{position:absolute;left:6px;bottom:6px;background:rgba(0,0,0,.6);color:#fff;border-radius:6px;padding:2px 7px;font-size:11.5px}
.ang input{position:absolute;inset:0;opacity:0;cursor:pointer}
.cardiag{width:100%;max-width:420px;margin:0 auto;display:block;cursor:crosshair;touch-action:manipulation}
.cardiag .body{fill:var(--surface-2);stroke:var(--ink-3);stroke-width:2}
.sig{width:100%;height:160px;border:1px solid var(--line-2);border-radius:12px;background:#fff;touch-action:none;display:block}
.cmp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.cmp h3{font-size:13px;margin-bottom:6px;color:var(--ink-2)}
.skel{background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));background-size:200% 100%;animation:sk 1.2s infinite;border-radius:10px;min-height:18px}
@keyframes sk{to{background-position:-200% 0}}
.empty{padding:36px 20px;text-align:center;color:var(--ink-3);display:flex;flex-direction:column;gap:12px;align-items:center}
.stars{display:inline-flex;gap:4px}.stars button{border:0;background:none;padding:2px;cursor:pointer;color:var(--line-2)}.stars button.on{color:var(--amber)}
.track-page{min-height:100vh;display:flex;flex-direction:column}
.track-page header{background:var(--navy);color:#fff;padding:14px clamp(16px,3vw,32px);display:flex;align-items:center;gap:12px}
.track-page .content{margin:0 auto}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001s!important;transition-duration:.001s!important}}

/* theme toggle */
#lpTop,#lpHost{display:inline-flex;align-items:center;gap:8px}
.thm{display:inline-grid;place-items:center}
.thm svg{grid-area:1/1;transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .25s}
.thm .i-sun{opacity:0;transform:rotate(-60deg) scale(.6)}
:root[data-theme="light"] .thm .i-sun{opacity:1;transform:none}
:root[data-theme="light"] .thm .i-moon{opacity:0;transform:rotate(60deg) scale(.6)}
.thm:hover{color:var(--amber)}
html.tt-swap,html.tt-swap *{transition:background-color .3s,border-color .3s,color .3s!important}
.demo-bar .seg button[aria-pressed="true"]{background:#03122B;color:#fff;box-shadow:none}
/* mobile top bar */
@media (max-width:600px){
 .top{gap:8px;padding:0 12px}
 .top h1{flex:1;min-width:0;font-size:16px}
 .top .sp{gap:6px;margin-left:0}
 .top .sp .bl{display:none}
 .top .sp .btn-sm{width:38px;height:38px;padding:0;font-size:20px}
 .top .lp-b{padding:0 8px}
 .top .lp-b .cd,.top .lp-b .cv{display:none}
}
/* lead statuses */
.ld-new{background:var(--amber-soft);color:var(--warn)}
.ld-contacted{background:var(--blue-soft);color:var(--blue)}
.ld-demo{background:color-mix(in srgb,var(--c4) 14%,transparent);color:var(--c4)}
.ld-won{background:var(--ok-soft);color:var(--ok)}
.ld-lost{background:var(--surface-2);color:var(--ink-3)}
.lead a{color:var(--c1)}

.lp-m{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;min-width:380px;max-height:min(70vh,560px);overflow:auto}
@media (max-width:480px){.lp-m{grid-template-columns:minmax(0,1fr);min-width:220px}}
/* admin: training kit */
.gdh{align-items:center}.gdh .row{gap:10px;flex-wrap:wrap}
.gdg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.gd{overflow:hidden;display:flex;flex-direction:column}
.gth{position:relative;display:block;aspect-ratio:1.55;overflow:hidden;background:radial-gradient(420px 220px at 80% 0%,rgba(10,108,245,.35),transparent 60%),#061430;border-bottom:1px solid var(--line)}
.gth img{position:absolute;left:50%;top:16px;width:62%;transform:translateX(-50%) rotate(-3deg);border-radius:6px;box-shadow:0 20px 40px -18px rgba(0,0,0,.85),0 0 0 1px rgba(120,160,230,.25);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.gd:hover .gth img{transform:translateX(-50%) rotate(0) translateY(-4px) scale(1.03)}
.gth b{position:absolute;left:14px;bottom:10px;font:600 30px/1 var(--display);color:var(--amber);text-shadow:0 2px 12px rgba(0,0,0,.6)}
.gl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding-top:8px;border-top:1px solid var(--line)}
.gn{flex:none;width:26px;height:26px;border-radius:50%;background:var(--amber);color:#0A1428;display:grid;place-items:center;font-size:13px}
@media (max-width:1100px){.gdg{grid-template-columns:1fr 1fr}}
@media (max-width:700px){.gdg{grid-template-columns:1fr}}
.foot a svg{vertical-align:-3px;margin-right:6px}
.lead a.btn-p{color:#fff}.gl .faint{white-space:nowrap}
