:root{
  --bg:#070c17; --bg2:#0b1220; --panel:#111a2b; --panel2:#16223a; --line:#22304a; --line2:#2c3d5c;
  --tx:#e7eefc; --tx2:#9db0cf; --tx3:#6c809f;
  --amber:#ffb545; --amber2:#f59e0b; --teal:#34d3c4; --violet:#a78bfa; --rose:#fb7185; --green:#4ade80; --blue:#60a5fa;
  --shadow:0 18px 40px rgba(0,0,0,.45);
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0;padding:0;background:var(--bg);color:var(--tx);font-family:var(--sans);-webkit-font-smoothing:antialiased}
body{background:radial-gradient(1200px 600px at 85% -10%,rgba(255,181,69,.10),transparent 60%),radial-gradient(900px 500px at 5% 0%,rgba(52,211,196,.09),transparent 60%),var(--bg)}
button{font-family:inherit;color:inherit;cursor:pointer}
input,select,textarea{font-family:inherit;font-size:14px;background:#0d1626;border:1px solid var(--line);color:var(--tx);border-radius:9px;padding:9px 11px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--amber)}
h1,h2,h3,h4{margin:0;font-weight:650;letter-spacing:-.01em}
a{color:var(--teal)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#1d2b45;border-radius:8px}

.boot{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:60}
.boot-card{text-align:center}
.boot-logo{font-size:34px;font-weight:800;letter-spacing:-.02em;background:linear-gradient(90deg,var(--amber),var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}
.boot-sub{color:var(--tx3);font-size:13px;margin-top:8px}
.boot-bar{width:230px;height:3px;background:#152036;border-radius:9px;margin:18px auto 0;overflow:hidden}
.boot-bar span{display:block;height:100%;width:40%;background:linear-gradient(90deg,var(--amber),var(--teal));animation:slide 1.1s infinite}
@keyframes slide{0%{transform:translateX(-100%)}100%{transform:translateX(320%)}}

.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:16px;padding:10px 18px;background:rgba(7,12,23,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:9px}
.brand-mark{width:22px;height:22px;border-radius:7px;background:conic-gradient(from 210deg,var(--amber),var(--teal),var(--violet),var(--amber));box-shadow:0 0 16px rgba(255,181,69,.35)}
.brand-name{font-weight:800;letter-spacing:-.02em}
.brand-tag{color:var(--tx3);font-size:11px;margin-left:4px}
.surfnav{display:flex;gap:4px;margin-left:8px;flex-wrap:wrap}
.navbtn{background:transparent;border:1px solid transparent;color:var(--tx2);padding:7px 12px;border-radius:999px;font-size:13px;white-space:nowrap}
.navbtn:hover{color:var(--tx);background:#131f33}
.navbtn.on{background:linear-gradient(180deg,#1b2942,#152036);border-color:var(--line2);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.topctl{margin-left:auto;display:flex;align-items:center;gap:8px}
.clockchip{display:flex;align-items:center;gap:2px;background:#0d1626;border:1px solid var(--line);border-radius:999px;padding:3px}
.cc-date,.cc-time,.cc-play{background:transparent;border:0;font-size:12px}
.cc-date{color:var(--tx2);padding:4px 8px;border-radius:999px}
.cc-time{font-family:var(--mono);font-size:14px;color:var(--amber);padding:4px 8px;font-weight:600}
.cc-play{padding:4px 9px;border-radius:999px;background:#182742;color:var(--tx)}
.cc-play.on{background:var(--amber);color:#1a1206}
.ghostbtn{background:#0d1626;border:1px solid var(--line);border-radius:999px;padding:7px 12px;font-size:12.5px;color:var(--tx2)}
.ghostbtn:hover{color:var(--tx);border-color:var(--line2)}
.pill{display:inline-block;min-width:18px;text-align:center;background:#22314c;color:var(--tx);border-radius:999px;font-size:11px;padding:1px 6px;margin-left:4px;font-family:var(--mono)}
.clockpresets{position:sticky;top:56px;z-index:29;background:#0a1120;border-bottom:1px solid var(--line);padding:10px 18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.cp-label{font-size:12px;color:var(--tx3)}
#cpButtons{display:flex;gap:6px;flex-wrap:wrap}
.cp-btn{background:#14203a;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:12px;color:var(--tx2)}
.cp-btn:hover{border-color:var(--amber);color:var(--tx)}
.cp-btn.on{background:#26364f;color:#fff;border-color:var(--amber2)}
.cp-note{font-size:11.5px;color:var(--tx3);margin-left:auto;max-width:400px}

.view{padding:20px 18px 90px;max-width:1400px;margin:0 auto}
.phone{max-width:452px;margin:0 auto}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-2-1{grid-template-columns:2fr 1fr}
.g-1-2{grid-template-columns:1fr 2fr}
@media(max-width:1080px){.g3,.g4,.g-2-1,.g-1-2{grid-template-columns:1fr}.g2{grid-template-columns:1fr}}
.card{background:linear-gradient(180deg,var(--panel),#0e1727);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow)}
.card-h{display:flex;align-items:baseline;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.card-h h3{font-size:15px}
.card-h .sub{color:var(--tx3);font-size:12px}
.card-h .right{margin-left:auto;display:flex;gap:6px;align-items:center}
.sect-title{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--tx3);margin:0 0 10px}
.k{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--tx3)}
.mono{font-family:var(--mono)}
.big{font-size:26px;font-weight:700;letter-spacing:-.02em}
.muted{color:var(--tx2)} .dim{color:var(--tx3)} .tiny{font-size:11.5px} .sm{font-size:12.5px}
.hr{height:1px;background:var(--line);margin:12px 0}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spread{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.stack{display:flex;flex-direction:column;gap:10px}
.wrapgap{display:flex;gap:8px;flex-wrap:wrap}

.chip{display:inline-flex;align-items:center;gap:5px;background:#152239;border:1px solid var(--line);color:var(--tx2);border-radius:999px;padding:3px 9px;font-size:11.5px;white-space:nowrap}
.chip.amber{border-color:#6b4d1a;color:var(--amber);background:rgba(255,181,69,.10)}
.chip.teal{border-color:#176057;color:var(--teal);background:rgba(52,211,196,.10)}
.chip.green{border-color:#1d5c38;color:var(--green);background:rgba(74,222,128,.10)}
.chip.rose{border-color:#6e2536;color:var(--rose);background:rgba(251,113,133,.10)}
.chip.violet{border-color:#3f3272;color:var(--violet);background:rgba(167,139,250,.10)}
.chip.blue{border-color:#264a72;color:var(--blue);background:rgba(96,165,250,.10)}
.chip.solid-amber{background:var(--amber);color:#1a1206;border-color:var(--amber);font-weight:700}
.dotdot{width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block}
.pulse{position:relative}
.pulse:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid currentColor;opacity:.5;animation:pl 1.8s infinite}
@keyframes pl{0%{transform:scale(.6);opacity:.6}100%{transform:scale(1.9);opacity:0}}

.btn{background:#17233a;border:1px solid var(--line2);border-radius:10px;padding:9px 13px;font-size:13.5px;color:var(--tx)}
.btn:hover{border-color:var(--amber2)}
.btn.pri{background:linear-gradient(180deg,var(--amber),var(--amber2));border-color:#c8811a;color:#1a1206;font-weight:700}
.btn.teal{background:linear-gradient(180deg,#3fe0d0,#1fae9f);border-color:#178f83;color:#05231f;font-weight:700}
.btn.rose{background:linear-gradient(180deg,#fb7185,#e11d48);border-color:#9f1239;color:#fff;font-weight:700}
.btn.big{padding:14px 18px;font-size:15px;border-radius:12px;width:100%}
.btn.sm{padding:6px 10px;font-size:12px;border-radius:8px}
.btn:disabled{opacity:.45;cursor:not-allowed}

table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;color:var(--tx3);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;padding:7px 8px;border-bottom:1px solid var(--line);font-weight:600}
td{padding:9px 8px;border-bottom:1px solid #16223a;vertical-align:top}
tr:last-child td{border-bottom:0}
tr.hov:hover td{background:#101c2f}
td.num,th.num{text-align:right;font-family:var(--mono)}

.av{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-weight:700;font-size:14px;color:#0b1220;flex:0 0 auto}
.av.sm{width:30px;height:30px;font-size:12px;border-radius:9px}
.av.lg{width:48px;height:48px;font-size:17px;border-radius:14px}
.t1{background:linear-gradient(135deg,#ffd9a0,#ffb545)} .t2{background:linear-gradient(135deg,#a7f3ec,#34d3c4)}
.t3{background:linear-gradient(135deg,#d6ccff,#a78bfa)} .t4{background:linear-gradient(135deg,#fecdd3,#fb7185)}
.t5{background:linear-gradient(135deg,#bfdbfe,#60a5fa)} .t6{background:linear-gradient(135deg,#bbf7d0,#4ade80)}

.rail{display:flex;gap:0;align-items:stretch;overflow-x:auto;padding:4px 0}
.rail-step{flex:1 1 0;min-width:104px;border:1px solid var(--line);background:#0e1727;padding:8px 9px}
.rail-step:first-child{border-radius:10px 0 0 10px}.rail-step:last-child{border-radius:0 10px 10px 0}
.rail-step .rs-l{font-size:9.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--tx3)}
.rail-step .rs-t{font-size:11px;margin-top:3px;color:var(--tx2);font-weight:600}
.rail-step.done{background:rgba(52,211,196,.10);border-color:#176057}
.rail-step.done .rs-t{color:var(--teal)}
.rail-step.now{background:rgba(255,181,69,.14);border-color:var(--amber2)}
.rail-step.now .rs-t{color:var(--amber)}

.ph-hero{background:linear-gradient(160deg,#1a2740,#0e1727);border:1px solid var(--line2);border-radius:16px;padding:16px}
.bigbtn{display:block;width:100%;text-align:left;background:#14203a;border:1px solid var(--line2);border-radius:13px;padding:13px 15px;font-size:15px}
.bigbtn.danger{border-color:#6e2536;background:rgba(251,113,133,.10)}
.bigbtn:disabled{opacity:.5}
.tabs{display:flex;gap:5px;background:#0c1424;border:1px solid var(--line);padding:4px;border-radius:12px;overflow-x:auto;flex-wrap:wrap}
.tab{background:transparent;border:0;color:var(--tx2);padding:8px 11px;border-radius:9px;font-size:12.5px;white-space:nowrap}
.tab.on{background:#1d2c46;color:#fff}
.matrix{width:100%;font-size:11.5px}
.matrix td{padding:5px;height:78px;vertical-align:top}
.matrix th{text-align:center;padding:5px}
.mcell{border:1px dashed #22304a;border-radius:8px;height:100%;padding:5px 6px;font-size:10.5px;line-height:1.35}
.mcell.filled{border:1px solid var(--line2);background:#101c2f;border-style:solid}
.mcell.today{border-color:var(--amber2);background:rgba(255,181,69,.08)}
.mcell.skip{opacity:.5}
.cardlist{display:flex;flex-direction:column;gap:10px}
.item{background:#101c2f;border:1px solid var(--line);border-radius:12px;padding:11px 12px}
.item.hi{border-color:var(--amber2)}
.item.teal{border-color:#176057}
.item.danger{border-color:#6e2536;background:rgba(251,113,133,.07)}
.item .it-h{display:flex;align-items:center;gap:10px}
.item .it-b{margin-top:9px;font-size:12.5px;color:var(--tx2)}
.flag{font-size:11px;color:var(--rose);background:rgba(251,113,133,.10);border:1px solid #6e2536;border-radius:7px;padding:2px 7px;display:inline-block}
.logline{display:flex;gap:9px;font-size:12px;padding:7px 0;border-bottom:1px dashed #1b2842}
.logline:last-child{border-bottom:0}
.logline .lt{font-family:var(--mono);color:var(--tx3);flex:0 0 62px}

.mapbox{background:radial-gradient(600px 300px at 30% 20%,rgba(52,211,196,.07),transparent 60%),#0a1424;border:1px solid var(--line);border-radius:13px;position:relative;overflow:hidden}
.mapbox svg{display:block;width:100%;height:auto}
.mgrid{stroke:#152339;stroke-width:.6}
.mroad{stroke:#243354;stroke-width:3.4;fill:none;stroke-linecap:round}
.mroadlbl{fill:#4e6285;font-size:5px;font-family:var(--mono)}
.mleg{stroke:var(--amber);stroke-width:1.5;fill:none;stroke-dasharray:3 2.4}
.mleg.done{stroke:var(--teal);stroke-dasharray:none}
.stopdot{fill:#0a1424;stroke:var(--tx3);stroke-width:1.2}
.stopdot.act{stroke:var(--amber)}
.stopdot.venue{stroke:var(--teal)}
.stopdot.done{stroke:var(--green);fill:#0f2a24}
.stoplbl{fill:#b9c9e2;font-size:5.2px}
.van{filter:drop-shadow(0 0 6px rgba(255,181,69,.8))}
.geofence{fill:rgba(52,211,196,.07);stroke:rgba(52,211,196,.5);stroke-width:.7;stroke-dasharray:2 2}

.drawer{position:fixed;top:0;right:0;width:min(430px,94vw);height:100%;background:#0a1220;border-left:1px solid var(--line2);z-index:45;display:flex;flex-direction:column;box-shadow:-24px 0 60px rgba(0,0,0,.55)}
.drawer-head{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.drawer-title{font-weight:700}
.drawer-sub{font-size:11.5px;color:var(--tx3);margin-top:3px}
.drawer-body{overflow-y:auto;padding:12px 14px 40px;display:flex;flex-direction:column;gap:9px}
.xbtn{background:#14203a;border:1px solid var(--line);border-radius:8px;padding:6px 9px;font-size:12px;margin-left:auto}
.smscard{background:#0f1a2c;border:1px solid var(--line);border-left:3px solid var(--teal);border-radius:10px;padding:10px 12px;font-size:12.5px}
.smscard.milestone{border-left-color:var(--amber)}
.smscard.compliance{border-left-color:var(--rose)}
.smscard.marketing{border-left-color:var(--violet)}
.smscard.intake{border-left-color:var(--blue)}
.smscard .meta{display:flex;gap:8px;align-items:center;font-size:11px;color:var(--tx3);margin-bottom:5px;flex-wrap:wrap}
.smscard .body{color:var(--tx);line-height:1.45}
.modal{position:fixed;inset:0;background:rgba(4,8,16,.72);backdrop-filter:blur(4px);z-index:50;display:grid;place-items:center;padding:16px}
.modal-card{background:#0d1729;border:1px solid var(--line2);border-radius:16px;padding:18px;width:min(620px,96vw);max-height:88vh;overflow-y:auto;box-shadow:var(--shadow)}
.toasts{position:fixed;left:16px;bottom:16px;z-index:70;display:flex;flex-direction:column;gap:8px;max-width:min(420px,92vw)}
.toast{background:#122033;border:1px solid var(--line2);border-left:3px solid var(--amber);border-radius:11px;padding:10px 13px;font-size:12.5px;box-shadow:var(--shadow);animation:tin .25s ease}
.toast.ok{border-left-color:var(--green)} .toast.err{border-left-color:var(--rose)} .toast.sms{border-left-color:var(--teal)}
@keyframes tin{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}

.pad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:280px}
.pad button{background:#14203a;border:1px solid var(--line2);border-radius:12px;padding:16px 0;font-size:20px;font-family:var(--mono)}
.pad button:active{background:#1f2f4d}
.pinbox{display:flex;gap:7px}
.pinbox i{width:34px;height:42px;border:1px solid var(--line2);border-radius:9px;background:#0c1424;display:grid;place-items:center;font-family:var(--mono);font-size:20px;font-style:normal}
.pinbox i.on{border-color:var(--amber);color:var(--amber)}

.heat{display:grid;gap:6px}
.hcell{border-radius:10px;padding:9px 10px;border:1px solid var(--line);min-height:62px;display:flex;flex-direction:column;justify-content:space-between;gap:6px}
.hcell .hn{font-size:22px;font-weight:700;font-family:var(--mono)}
.bar{height:7px;background:#152239;border-radius:9px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--amber))}
.kv{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:5px 0;border-bottom:1px dashed #1b2842}
.kv:last-child{border-bottom:0}
.kv b{font-family:var(--mono);font-weight:600}
.lockbanner{border:1px solid #6e2536;background:rgba(251,113,133,.10);border-radius:12px;padding:12px 14px;font-size:13px}
.lockbanner.amber{border-color:#6b4d1a;background:rgba(255,181,69,.10)}
.lockbanner.teal{border-color:#176057;background:rgba(52,211,196,.10)}
.code{font-family:var(--mono);font-size:11.5px;background:#0c1424;border:1px solid var(--line);border-radius:9px;padding:10px;color:var(--tx2);white-space:pre-wrap;word-break:break-word}
.footnote{color:var(--tx3);font-size:11px;margin-top:18px;text-align:center}
.arch{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.archbox{background:#0f1a2c;border:1px solid var(--line);border-radius:12px;padding:12px 13px}
.archbox h4{font-size:13px;margin-bottom:6px}
.archbox ul{margin:0;padding-left:16px;color:var(--tx2);font-size:12px;line-height:1.6}

/* ---- portals, auth, maps ---- */
body[data-surface="parent"] .topbar{box-shadow:inset 0 -2px 0 var(--amber)}
body[data-surface="driver"] .topbar{box-shadow:inset 0 -2px 0 var(--teal)}
body[data-surface="academy"] .topbar{box-shadow:inset 0 -2px 0 var(--violet)}
body[data-surface="dispatch"] .topbar{box-shadow:inset 0 -2px 0 var(--rose)}
.who{font-size:11.5px;color:var(--tx2);background:#0d1626;border:1px solid var(--line);border-radius:999px;padding:6px 11px}
.who a{color:var(--tx2);text-decoration:none}
.launchhero{background:linear-gradient(150deg,#1a2740,#0d1626);border:1px solid var(--line2);border-radius:16px;padding:18px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.launchgrid .portalcard{display:block;text-decoration:none;color:inherit;background:linear-gradient(180deg,var(--panel),#0e1727);border:1px solid var(--line);border-radius:14px;padding:16px;transition:.16s}
.launchgrid .portalcard:hover{border-color:var(--amber2);transform:translateY(-2px)}
.loginwrap{display:grid;place-items:center;padding:24px 0}
.logincard{width:min(460px,100%);background:linear-gradient(180deg,var(--panel),#0e1727);border:1px solid var(--line2);border-radius:16px;padding:18px}
.login-brand{display:flex;gap:10px;align-items:center}
.login-brand .brand-mark{width:28px;height:28px;border-radius:9px}
.magictap{display:inline-block;background:var(--teal);color:#05231f;font-weight:700;border-radius:7px;padding:2px 8px;text-decoration:none}
.leafletmap{height:300px;border-radius:13px;border:1px solid var(--line);overflow:hidden;background:#0f1a2c;position:relative}
.leafletmap .mapidle,.mapidle{display:grid;place-items:center;height:100%;color:var(--tx3);font-size:12px;padding:12px;text-align:center}
.mapmeta{margin-top:6px}
.leaflet-container{background:#0f1a2c;font-family:var(--sans);font-size:12px}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#101c2f;color:var(--tx);border:1px solid var(--line2)}
.leaflet-popup-content{margin:9px 12px;line-height:1.45}
.leaflet-control-attribution{background:rgba(10,18,32,.72)!important;color:#7d90af!important;font-size:9.5px!important}
.leaflet-control-attribution a{color:#9fb6d6!important}
.vanicon{width:28px;height:28px;display:grid;place-items:center;font-size:16px;background:var(--amber);border-radius:9px;box-shadow:0 0 0 3px rgba(255,181,69,.3),0 4px 12px rgba(0,0,0,.5)}
.vanicon-wrap{background:none;border:0}
.leaflet-div-icon{background:none;border:0}

/* ---- published portal chrome + customer auth screens ---- */
body{background:radial-gradient(1200px 600px at 80% -10%,#16233a 0%,#0a1120 55%,#080e19 100%)}
.phead{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:12px 20px;background:rgba(9,15,26,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.pbrand{display:flex;align-items:center;gap:11px;min-width:0}
.pmark{width:30px;height:30px;border-radius:10px;flex:none;background:conic-gradient(from 210deg,#ffb545,#ff7a45,#4ad2c0,#6ea8ff,#ffb545);
  box-shadow:0 0 0 1px rgba(255,255,255,.12) inset,0 6px 18px rgba(0,0,0,.45)}
.pmark.big{width:40px;height:40px;border-radius:13px}
.pname{font-size:15px;font-weight:650;letter-spacing:.1px;white-space:nowrap}
.ptag{font-size:11.5px;color:var(--tx3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pctl{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.pwho{font-size:11.5px;color:var(--tx2);background:#0d1626;border:1px solid var(--line);border-radius:999px;padding:6px 11px;white-space:nowrap}
.plink{background:none;border:1px solid var(--line2);color:var(--tx2);border-radius:9px;padding:6px 11px;font-size:12px;cursor:pointer}
.plink:hover{border-color:var(--amber2);color:var(--tx)}
.pview{max-width:1180px;margin:0 auto;padding:18px 20px 60px}
.pfoot{max-width:1180px;margin:0 auto;padding:14px 20px 30px;color:var(--tx3);font-size:11.5px;border-top:1px solid var(--line)}
body.cust .pview{max-width:660px;padding-top:22px}
body[data-surface="parent"] .phead{box-shadow:inset 0 -2px 0 var(--amber)}
body[data-surface="driver"] .phead{box-shadow:inset 0 -2px 0 var(--teal)}
body[data-surface="academy"] .phead{box-shadow:inset 0 -2px 0 var(--violet)}
body[data-surface="dispatch"] .phead{box-shadow:inset 0 -2px 0 var(--rose)}

.authwrap{display:grid;place-items:center;padding:26px 0 10px}
.authcard{width:min(520px,100%);background:linear-gradient(180deg,#131e33,#0d1626);border:1px solid var(--line2);border-radius:20px;padding:22px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.8)}
.authcard.ops{width:min(560px,100%)}
.authbrand{display:flex;gap:12px;align-items:center;margin-bottom:16px}
.authhero{font-size:23px;line-height:1.25;margin:0 0 16px;font-weight:650}
.authform{display:flex;gap:9px;margin-top:6px}
.authform .inp{flex:1}
.inp.big{font-size:16px;padding:13px 14px}
.btn.big{padding:13px 18px;font-size:14px}
.inp.pin{letter-spacing:8px;font-size:22px;text-align:center}
.authfine{color:var(--tx3);font-size:12px;line-height:1.55;margin:14px 0 10px}
.authtrust{font-size:11.5px;color:var(--tx2);background:#0c1626;border:1px solid var(--line);border-radius:11px;padding:10px 12px;line-height:1.5}
.demopill{margin-top:14px;background:none;border:1px dashed var(--line2);color:var(--tx3);border-radius:999px;padding:6px 12px;font-size:11px;cursor:pointer}
.demopill:hover{color:var(--tx);border-color:var(--amber2)}
.demoreveal{margin-top:10px;background:#0b1424;border:1px solid var(--line);border-radius:12px;padding:11px 12px}
.demorow{display:flex;justify-content:space-between;gap:10px;width:100%;background:none;border:0;border-bottom:1px solid var(--line);
  color:var(--tx2);font-size:12px;padding:8px 2px;cursor:pointer;text-align:left}
.demorow:last-of-type{border-bottom:0}
.demorow:hover{color:var(--tx)}
.authout{margin-top:12px}
.autherr{background:rgba(251,113,133,.1);border:1px solid rgba(251,113,133,.4);color:#ffc2cd;border-radius:11px;padding:10px 12px;font-size:12.5px;line-height:1.5}
.phonesend{background:#0a1220;border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:14px}
.phonetop{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--tx3);margin-bottom:8px}
.phonebubble{background:#16243c;border-radius:14px;padding:12px 13px;font-size:13px;line-height:1.55;color:var(--tx)}
.phonefoot{font-size:10.5px;color:var(--tx3);margin-top:8px}
.linktap{color:var(--teal);font-weight:650;text-decoration:underline;word-break:break-all}
.block{display:block;width:100%;text-align:center}
.ghostline{background:none;border:1px dashed var(--line2);color:var(--tx3);margin-top:9px}
@media (max-width:700px){
  .phead{flex-wrap:wrap;gap:9px;padding:10px 14px}
  .ptag{display:none}
  .pview{padding:14px 14px 50px}
  .authcard{padding:18px;border-radius:16px}
  .authhero{font-size:20px}
  .authform{flex-direction:column}
}