:root{ --logo:url("https://static.wixstatic.com/media/3c7737_307c06515cc24fa7a9257d139a87adc9~mv2.png"); --photo:url("https://static.wixstatic.com/media/3c7737_7b593a0dae4349eca84f5465c580ac30~mv2.jpg");
  --navy:#0e2038; --navy2:#16304f; --ink:#0f1522; --mut:#6b7686;
  --yellow:#f7b71c; --yellow2:#ffca4d;
  --bg:#f2f4f8; --card:#fff; --line:#e8ebf1;
  --green:#12a06a; --greenbg:#e3f6ee; --amber:#6d3bd8; --amberbg:#f0e9fd; /* v89.5 — "amber" slots render purple (Isaac: no gold-on-white pills) */
  --red:#d94334; --redbg:#fdeceb; --sky:#4bb0e6; --skybg:#e8f4fc;
  --dbg:#0b1526; --dcard:#122036; --dline:#1e3252; --dtxt:#e8eef7; --dmut:#8fa2bd;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;min-width:0;scrollbar-width:none;}
*::-webkit-scrollbar{display:none;width:0;height:0;}
html,body{margin:0;padding:0;background:#c7ccd6;font-family:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);letter-spacing:-.011em;}
img{max-width:100%;display:block;}
.stage{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:14px;}
.phone{width:100%;max-width:392px;height:min(852px,95vh);background:var(--bg);border-radius:46px;overflow:hidden;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.35);border:12px solid #05070b;display:flex;flex-direction:column;}
.notch{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:118px;height:29px;background:#05070b;border-radius:18px;z-index:40;}
.sbar{position:absolute;top:0;left:0;right:0;padding:17px 27px 0;display:flex;justify-content:space-between;font-size:13px;font-weight:600;z-index:39;pointer-events:none;color:var(--ink);transition:color .3s;}
.phone.dark .sbar{color:#fff;}
.screen{flex:1;overflow-y:auto;display:flex;flex-direction:column;}
.view{animation:vin .32s cubic-bezier(.2,.8,.2,1);flex:1;display:flex;flex-direction:column;}
@keyframes vin{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.06)}100%{transform:scale(1);opacity:1}}
@keyframes slideL{from{opacity:0;transform:translateX(46px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(247,183,28,.45)}50%{box-shadow:0 0 0 16px rgba(247,183,28,0)}}
@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* ------- sign in (MUBI style) ------- */
.login{flex:1;position:relative;background:#000;display:flex;flex-direction:column;}
.login .bgimg{position:absolute;inset:0;background:var(--photo) center/cover no-repeat;opacity:.72;}
.login .scrim{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(3,8,16,.25) 0%,rgba(3,8,16,.55) 45%,rgba(3,8,16,.96) 78%);}
.login .inner{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;padding:64px 26px 34px;color:#fff;}
.llogo{width:74px;height:74px;border-radius:19px;background:var(--navy) var(--logo) center/cover no-repeat;box-shadow:0 10px 30px rgba(0,0,0,.5);}
.lbrand{margin-top:14px;font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.08;}
.lbrand em{font-style:normal;color:var(--yellow);}
.ltag{font-size:13px;color:#c3cedd;margin-top:6px;}
.lspacer{flex:1;}
.lform{animation:rise .5s .1s both;}
.ltrouble{font-size:12.5px;color:#aab8ca;text-align:right;margin-bottom:9px;font-weight:500;}
.lin{width:100%;padding:16px 18px;border-radius:13px;border:none;font-size:16px;font-family:inherit;background:#fff;color:var(--ink);margin-bottom:11px;}
.lin:focus{outline:3px solid var(--yellow);}
.lbtn{width:100%;padding:16px;border-radius:13px;border:none;background:var(--yellow);color:#161206;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;transition:.15s;}
.lbtn:active{transform:scale(.97);}
.ldemo{display:flex;gap:8px;justify-content:center;margin-top:16px;}
.ldemo button{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.22);color:#dfe7f0;font-size:12px;font-weight:600;padding:8px 15px;border-radius:99px;cursor:pointer;font-family:inherit;backdrop-filter:blur(6px);}
.ldemo button:active{background:rgba(255,255,255,.25);}
.lsafe{margin-top:20px;text-align:center;font-size:11.5px;color:#8ea0b5;font-weight:500;}

/* ------- common light chrome ------- */
.pad{padding:0 20px 110px;}
.ghead{padding:64px 20px 6px;display:flex;align-items:center;gap:12px;}
.ghead .gsm{font-size:13px;color:var(--mut);font-weight:500;}
.ghead .glg{font-size:25px;font-weight:800;letter-spacing:-.03em;line-height:1.1;}
.gava{margin-left:auto;width:46px;height:46px;border-radius:50%;background:var(--navy) var(--logo) center/cover no-repeat;border:2.5px solid var(--yellow);flex:0 0 auto;}
.gbell{width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;flex:0 0 auto;}
.gbell:active{transform:scale(.93);}
.gbell .bdg{position:absolute;top:-3px;right:-3px;background:var(--red);color:#fff;font-size:10px;font-weight:700;min-width:17px;height:17px;border-radius:99px;display:flex;align-items:center;justify-content:center;padding:0 4px;}
.chiprow{display:flex;gap:8px;padding:14px 20px 4px;overflow-x:auto;}
.ibwrap{display:block;}
.iblist{display:none;}
.ibrow{display:flex;gap:10px;padding:10px;border-radius:12px;cursor:pointer;}
.ibrow:hover{background:#f2f5fa;}
.ibrow.sel{background:#e9eefb;}
.chip{padding:9px 16px;border-radius:99px;font-size:13px;font-weight:600;background:#fff;border:1px solid var(--line);color:var(--mut);cursor:pointer;white-space:nowrap;transition:.15s;}
.chip.on{background:var(--navy);color:#fff;border-color:var(--navy);}
.card{background:#fff;border-radius:22px;padding:18px;margin-top:14px;border:1px solid var(--line);animation:rise .35s both;}
.card.tinted-g{background:var(--greenbg);border-color:#cdeede;}
.card.tinted-y{background:var(--amberbg);border-color:#ded0f7;}
.card.tinted-b{background:var(--skybg);border-color:#d3e9f8;}
.hh{font-size:16.5px;font-weight:700;letter-spacing:-.02em;display:flex;align-items:center;gap:8px;}
.hh .see{margin-left:auto;font-size:12.5px;color:var(--mut);font-weight:600;cursor:pointer;}
.sub{font-size:13px;color:var(--mut);margin-top:3px;}
.pill{font-size:12px;font-weight:700;padding:6px 12px;border-radius:99px;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;}
.pill.g{background:var(--greenbg);color:var(--green);}
.pill.y{background:var(--amberbg);color:var(--amber);}
.pill.r{background:var(--redbg);color:var(--red);}
.pill.b{background:var(--skybg);color:#1272a8;}
.pill.n{background:#edf0f5;color:var(--navy);}
.pill.v{background:#efeafc;color:#6d4fc4;} /* v95 — violet tint: In Progress tickets, Corrected tags */
.tkresp{background:#f2f6fb;border-radius:10px;padding:9px 12px;font-size:13px;color:var(--ink);line-height:1.5;} /* v95 — ticket response block, dark-safe */
.rowitem{display:flex;align-items:center;gap:13px;padding:13px 0;border-bottom:1px solid var(--line);}
.rowitem:last-child{border-bottom:none;padding-bottom:2px;}
.rowitem:first-of-type{padding-top:14px;}
.ava{width:46px;height:46px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14.5px;color:#fff;flex:0 0 auto;background:linear-gradient(145deg,#2a4a76,#0e2038);}
.ava.round{border-radius:50%;}
.rmain{flex:1;min-width:0;}
.rname{font-size:15px;font-weight:600;}
.rsub{font-size:12.5px;color:var(--mut);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tkdet{font-size:13.5px;color:var(--mut);margin-top:7px;line-height:1.6;white-space:normal;word-break:break-word;}
.tkdet b{color:var(--ink);}
/* v97 — Push Readiness report */
.audtile{border:1px solid var(--line);border-radius:12px;padding:8px 10px;text-align:center;}
.audtile b{display:block;font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.2;}
.audtile span{font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);}
.audrow{padding:10px 0;border-bottom:1px solid var(--line);}
.audrow:last-child{border-bottom:none;}
.btn{width:100%;padding:16px;border-radius:15px;border:none;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;background:var(--navy);color:#fff;transition:.15s;margin-top:14px;}
.btn:active{transform:scale(.97);}
.btn.yel{background:var(--yellow);color:#181206;}
.btn.ghost{background:#fff;border:1.5px solid var(--line);color:var(--ink);}
.btn.sm{padding:11px 16px;width:auto;font-size:13px;margin:0;border-radius:11px;}
.kidcard{border-radius:24px;overflow:hidden;background:#fff;border:1px solid var(--line);margin-top:14px;animation:rise .35s both;}
.kidtop{padding:16px 18px 12px;display:flex;align-items:center;gap:13px;}
.kidphoto{width:52px;height:52px;border-radius:18px;background:linear-gradient(145deg,#2a4a76,#0e2038);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:17px;}
.kidtrips{border-top:1px solid var(--line);padding:6px 18px 14px;}
.trip{display:flex;align-items:center;gap:11px;padding:10px 0;}
.tic{width:36px;height:36px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.tic.am{background:var(--amberbg);color:var(--amber);}
.tic.pm{background:var(--skybg);color:#1272a8;}
.metric{border-radius:20px;padding:16px;animation:rise .35s both;}
.metric .mn{font-size:27px;font-weight:800;letter-spacing:-.03em;}
.metric .ml{font-size:12px;font-weight:600;color:var(--mut);margin-top:3px;}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:14px;}
.seg{display:flex;background:#e9ecf2;border-radius:14px;padding:4px;margin-top:14px;}
/* v100.6.1 — "Assignments" rendered OUTSIDE the rounded pill. Reported repeatedly;
   previous passes adjusted the max-width, which is why it kept coming back at a
   different label length. The actual cause: a flex item's default min-width is
   `auto`, so these buttons could not shrink below their own text. With .routeseg
   capped at a hard 300px, the labels had nowhere to go and simply drew past the
   container's edge. Three defences, each sufficient at a different width:
     1. min-width:0  — the buttons may now shrink (this is the bug)
     2. the pill sizes to its own content instead of a magic number
     3. if it ever does run out of room the label clips INSIDE the pill
   No max-width to tune the next time a label gets longer. */
.seg button{flex:1 1 0;min-width:0;border:none;background:transparent;padding:11px 10px;border-radius:11px;font-weight:700;font-size:13px;color:#57637a;cursor:pointer;font-family:inherit;transition:.15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} /* v93 — inactive label a step darker than --mut for readability */
.seg button.on{background:#fff;color:var(--navy);box-shadow:0 2px 8px rgba(14,32,56,.14);}
/* v94 — heavier segment variant (Routes|Assignments, Data, parent Messages) + count badge */
.seg.segstrong{border:1px solid #c8d1df;}
.seg.segstrong button{font-weight:800;}
.segbdg{background:var(--red);color:#fff;font-size:10px;font-weight:800;min-width:17px;height:17px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;margin-left:6px;vertical-align:middle;flex:0 0 auto;}
.dwrap .seg{background:#16233b;}
.dwrap .seg button{color:var(--dmut);}
.dwrap .seg button.on{background:#243a5e;color:#fff;box-shadow:none;}
.radio{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:13px 14px;margin-top:9px;cursor:pointer;transition:.14s;}
.radio.on{border-color:var(--navy);background:#f0f4fa;}
.radio .rr{width:21px;height:21px;border-radius:50%;border:2px solid #c8d0dd;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:.14s;}
.radio.on .rr{border-color:var(--navy);}
.radio.on .rr::after{content:"";width:11px;height:11px;border-radius:50%;background:var(--navy);}
.tog2{display:flex;gap:9px;margin-top:12px;}
.tog2 .t{flex:1;text-align:center;padding:13px;border:1.5px solid var(--line);border-radius:14px;font-weight:700;font-size:13.5px;color:var(--mut);cursor:pointer;transition:.14s;background:#fff;}
.tog2 .t.on{border-color:var(--navy);background:var(--navy);color:#fff;}
.fld{width:100%;padding:14px;border:1.5px solid var(--line);border-radius:13px;font-size:15px;font-family:inherit;background:#fff;color:var(--ink);margin-top:8px;}
/* v94 — edge-spacing pass: every dropdown gets a consistent custom chevron with a
   guaranteed inset (no more native arrows flush against card edges). Inline
   padding overrides on compact selects were widened to match (padding-right ≥26px). */
select.fld{appearance:none;-webkit-appearance:none;padding-right:30px;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2357637a' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;}
.rowitem>.pill{flex:0 0 auto;}
.fld:focus{outline:none;border-color:var(--navy);}
label.flb{display:block;font-size:12px;font-weight:700;color:var(--mut);margin-top:14px;text-transform:uppercase;letter-spacing:.5px;}
.notiitem{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);}
.notiitem:last-child{border-bottom:none;}
.nico{width:40px;height:40px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.nico.g{background:var(--greenbg);color:var(--green);}
.nico.y{background:#e7dcfb;color:#5b2fb8;} /* v89.5 — purple (gold-on-white vetoed for good) */
.nico.s{background:#e9edf4;color:#46536b;}
.nico.b{background:var(--skybg);color:#1272a8;}
.nico.r{background:var(--redbg);color:var(--red);}
.nt{font-size:14px;font-weight:600;line-height:1.35;}
.nm{font-size:12.5px;color:var(--mut);margin-top:2px;line-height:1.4;}
.ntm{font-size:11px;color:#9aa6b7;margin-top:5px;font-weight:600;}
.udot{width:8px;height:8px;border-radius:50%;background:var(--yellow);margin-top:7px;flex:0 0 auto;}

/* chat */
.chat{display:flex;flex-direction:column;gap:8px;padding:12px 0;}
.bub{max-width:80%;padding:11px 15px;border-radius:18px;font-size:14px;line-height:1.45;animation:rise .25s both;}
.bub.them{background:#fff;border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:6px;}
.bub.me{background:var(--navy);color:#fff;align-self:flex-end;border-bottom-right-radius:6px;}
.bub .bt{font-size:10.5px;opacity:.6;margin-top:4px;}
.chatbar{display:flex;gap:9px;position:absolute;left:16px;right:16px;bottom:96px;z-index:34;background:rgba(242,244,248,.94);backdrop-filter:blur(10px);padding:8px;border-radius:99px;box-shadow:0 8px 26px rgba(14,32,56,.14);}
.chat{padding-bottom:88px;}
.chatbar input,.chatbar textarea{flex:1;padding:14px 16px;border:1.5px solid var(--line);border-radius:22px;font-size:14.5px;font-family:inherit;background:#fff;min-width:0;}
.chatbar input:focus,.chatbar textarea:focus{outline:none;border-color:var(--navy);}
.chatbar textarea{resize:none;max-height:120px;line-height:1.4;overflow-y:auto;}
.chatbar{align-items:flex-end;}
.sendb{width:50px;height:50px;border-radius:50%;border:none;background:var(--yellow);color:#181206;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;}
.sendb:active{transform:scale(.92);}
.convrow{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);cursor:pointer;}
.convrow:last-child{border-bottom:none;}
.convrow:active{opacity:.55;}
.ctime{font-size:11px;color:var(--mut);font-weight:600;}
.cbadge{background:var(--yellow);color:#181206;font-size:11px;font-weight:800;min-width:20px;height:20px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;}
.backb{width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;}
.backb:active{transform:scale(.92);}

/* ------- DRIVER DARK MODE ------- */
.dwrap{flex:1;background:linear-gradient(180deg,#0a1322 0%,#0d1a2e 100%);color:var(--dtxt);display:flex;flex-direction:column;}
.dwrap .pad{padding:0 20px 110px;}
.dhead{padding:64px 20px 4px;position:relative;}
.sobtn{position:absolute;right:20px;top:66px;width:38px;height:38px;border-radius:50%;background:#1c3050;border:none;color:var(--dmut);display:flex;align-items:center;justify-content:center;cursor:pointer;}
.sobtn:active{transform:scale(.92);}
.dhead .dsm{font-size:13.5px;color:var(--dmut);font-weight:500;}
.dhead .dlg{font-size:24px;font-weight:800;letter-spacing:-.03em;margin-top:2px;}
.dcard{background:var(--dcard);border:1px solid var(--dline);border-radius:22px;padding:18px;margin-top:14px;animation:rise .35s both;}
.dcard .hh{color:var(--dtxt);}
.dcard .rsub,.dcard .sub{color:var(--dmut);}
.dcard .rowitem{border-color:var(--dline);}
.dcard .rname{color:var(--dtxt);}
.dstop{background:var(--dcard);border:1px solid var(--dline);border-radius:26px;padding:26px 20px;text-align:center;margin-top:12px;animation:slideL .35s both;}
.dphoto{width:150px;height:150px;border-radius:32px;margin:0 auto;background:linear-gradient(145deg,#2a4a76,#16304f);display:flex;align-items:center;justify-content:center;font-size:44px;font-weight:800;color:#fff;position:relative;overflow:hidden;border:3px solid var(--dline);}
.dphoto .cap{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.55);font-size:9.5px;font-weight:700;letter-spacing:.8px;padding:5px;color:#cdd8e6;}
.dname{font-size:25px;font-weight:800;margin-top:14px;letter-spacing:-.02em;}
.daddr{font-size:14px;color:var(--dmut);margin-top:7px;display:flex;align-items:center;justify-content:center;gap:6px;}
.dtag{display:inline-flex;margin-top:10px;}
.dring{width:190px;height:190px;border-radius:50%;margin:18px auto 6px;display:flex;align-items:center;justify-content:center;background:conic-gradient(var(--yellow) var(--deg,360deg),#1c3050 0);animation:pop .4s both;}
.dring .in{width:166px;height:166px;border-radius:50%;background:var(--dbg);display:flex;flex-direction:column;align-items:center;justify-content:center;}
.dring .tt{font-size:44px;font-weight:800;letter-spacing:-.03em;color:#fff;line-height:1;}
.dring .tl{font-size:11px;color:var(--dmut);font-weight:600;margin-top:6px;text-transform:uppercase;letter-spacing:1px;}
.dprog{display:flex;gap:6px;justify-content:center;padding:14px 0 2px;}
.dseg{width:26px;height:5px;border-radius:99px;background:#1c3050;transition:.2s;}
.dseg.done{background:var(--green);}
.dseg.cur{background:var(--yellow);}
.dstatus{display:flex;gap:10px;margin-top:16px;}
.dsb{flex:1;border:none;border-radius:18px;padding:16px 6px;font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;color:#fff;transition:.13s;}
.dsb svg{width:23px;height:23px;}
.dsb.g{background:var(--green);} .dsb.a{background:#c98a00;} .dsb.r{background:var(--red);}
.dsb:active{transform:scale(.94);}
.dbtn{width:100%;padding:17px;border-radius:16px;border:none;font-size:15.5px;font-weight:700;font-family:inherit;cursor:pointer;margin-top:14px;transition:.15s;}
.dbtn.yel{background:var(--yellow);color:#181206;animation:pulse 2.2s infinite;}
.dbtn.dim{background:#1c3050;color:var(--dmut);animation:none;}
.dbtn.ghostd{background:transparent;border:1.5px solid var(--dline);color:var(--dmut);}
.dbtn:active{transform:scale(.97);}
/* v105.10 — .pbanner: the needs-attention banner for WHITE parent sheets (lavender), where the gold .dbanner (made for navy) would put gold text on white */
.pbanner{background:#efeafc;border:1px solid #ded0f7;color:#4b3a8a;border-radius:15px;padding:12px 15px;font-size:13px;font-weight:600;margin-top:0;display:flex;gap:9px;align-items:flex-start;line-height:1.4;}
.dbanner{background:rgba(247,183,28,.12);border:1px solid rgba(247,183,28,.35);color:var(--yellow2);border-radius:15px;padding:12px 15px;font-size:13px;font-weight:600;margin-top:14px;display:flex;gap:9px;align-items:flex-start;line-height:1.4;}
.ddone{width:76px;height:76px;border-radius:50%;background:var(--green);display:flex;align-items:center;justify-content:center;margin:26px auto 0;color:#fff;animation:pop .5s both;}
.ddone svg{width:38px;height:38px;}

/* v104 — one-flow run queue (approved mockup: /tmp/oneflow).
 * FINAL REVISION (Isaac): FROSTED CARDS ON NAVY — the whole flow is one
 * navy shell; the active card, rider rows, Up Next and done-screen metrics
 * are translucent light-glass overlays (light-BLUE-tinted rgba fill + tinted
 * hairline, backdrop blur where supported) — the treatment generalized
 * from the mockup's translucent footer note. Text is white/near-white
 * with muted secondary. Accents keep their meaning: gold = action,
 * green = positive, lavender = needs attention / look ahead. */
.pill.navy{background:#1c3050;color:var(--dmut);}
.ofdark .dcard{background:rgba(150,195,240,.12);border:1px solid rgba(170,205,245,.22);color:var(--dtxt);box-shadow:0 14px 34px rgba(3,8,18,.35);}
.ofdark .dstop{background:rgba(150,195,240,.12);border:1px solid rgba(170,205,245,.22);box-shadow:0 14px 34px rgba(3,8,18,.35);}
@supports ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
 .ofdark .dcard,.ofdark .dstop,.ofdark .metric,.ofdark .peek{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);}
}
.ofdark .dname{color:#fff;}
.ofdark .daddr{color:#b9c6da;}
.ofdark .hh{color:#fff;}
.ofdark .hh .see{color:var(--dmut);}
.ofdark .rowitem{border-bottom:1px solid rgba(170,205,245,.18);cursor:pointer;}
.ofdark .rowitem:last-child{border-bottom:none;}
.ofdark .rname{color:#f2f6fb;}
.ofdark .rsub{color:#9fb0c8;}
.ofdark .dphoto{border-color:rgba(170,205,245,.3);}
.ofdark .dcard .pill.navy,.ofdark .dstop .pill.navy{background:rgba(8,17,32,.55);color:#dbe4f1;border:1px solid rgba(170,205,245,.14);}
.ofdark .metric{background:rgba(150,195,240,.12);border:1px solid rgba(170,205,245,.22);}
.ofdark .metric .mn{color:#fff;}
.ofdark .metric .ml{color:var(--dmut);}
/* dispatch-note inset — DEEPER dark glass sunk INTO the frosted card, gold
   kicker (gold-on-dark is the approved accent), near-white body. Darker
   than the card so the hierarchy survives glass-on-glass. */
.ofnote{background:rgba(4,11,22,.55);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:11px 14px;margin-top:10px;text-align:left;}
.ofnote .nfl{font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--yellow);display:flex;align-items:center;gap:6px;}
.ofnote .nfb{font-size:13.5px;font-weight:600;color:#f4f7fc;margin-top:3px;line-height:1.45;}
.rail{display:flex;gap:6px;justify-content:center;align-items:center;padding:14px 0 2px;cursor:pointer;}
.rseg{width:22px;height:5px;border-radius:99px;background:#1c3050;transition:.2s;flex:0 1 auto;}
.rseg.done{background:var(--green);}
.rseg.cur{background:var(--yellow);width:30px;}
.rseg.sch{height:8px;}
/* v104.1 — day-passed stop: the dot is skipped/neutral, and STAYS neutral even
 * while current or completed (it was never this driver's work today) */
.rseg.skp,.rseg.skp.cur,.rseg.skp.done{background:#233046;opacity:.55;}
/* v104.5 — collapsed (fully-absent) stop: its own muted lavender dot, so the
 * stop is visibly still there and real stops are never renumbered */
.rseg.gone,.rseg.gone.cur,.rseg.gone.done{background:#4a3f7a;opacity:.65;width:12px;}
/* v104.5 — the SKIPPED LINE: compact, inert, lavender-muted (needs attention,
 * never alarm-red), tap anywhere to put the stop back on the run */
.ofskip{display:flex;align-items:center;gap:11px;background:rgba(103,71,223,.14);border:1px solid rgba(143,110,232,.34);border-left:4px solid #8f6ee8;border-radius:14px;padding:11px 13px;margin-top:12px;cursor:pointer;animation:rise .35s both;}
.ofskip:active{transform:scale(.99);}
.ofskip .skn{flex:0 0 auto;min-width:26px;height:26px;padding:0 6px;border-radius:9px;background:rgba(11,21,38,.5);color:#cabdfa;font-size:12.5px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.ofskip .skm{flex:1;min-width:0;}
.ofskip .skt{font-size:13.5px;font-weight:800;color:#e9e4ff;line-height:1.3;white-space:normal;overflow-wrap:anywhere;}
.ofskip .sks{font-size:11.5px;font-weight:600;color:#b3a7dd;line-height:1.35;white-space:normal;overflow-wrap:anywhere;}
.ofskip .skb{flex:0 0 auto;font-size:11.5px;font-weight:800;color:#cabdfa;border:1px solid rgba(143,110,232,.5);border-radius:99px;padding:6px 10px;white-space:nowrap;}
.jrow.skp{background:#f6f4fe;border-color:rgba(103,71,223,.3);}
.jrow.skp .jn{background:#4a3f7a;}
.railhint{text-align:center;font-size:11px;color:#5f7398;font-weight:600;margin-top:4px;cursor:pointer;}
/* Up Next — frosted glass strip like the cards, with a LAVENDER kicker and
   left rule (lavender = look ahead; green stays "completed" on the rail).
   White text on the glass. */
.peek{background:rgba(150,195,240,.11);border:1px solid rgba(170,205,245,.2);border-left:4px solid #8f6ee8;border-radius:14px;padding:12px 16px;margin-top:12px;display:flex;align-items:center;gap:11px;color:#eef2f9;animation:rise .35s both;}
.peek .pk{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#cabdfa;flex:0 0 auto;}
.peek .pt{font-size:13.5px;font-weight:700;color:#f0f4fa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.keepnote{display:flex;align-items:center;gap:8px;justify-content:center;font-size:11.5px;font-weight:600;color:#5f7398;margin-top:12px;text-align:center;}
.keepnote svg{flex:0 0 auto;}
.jrow{display:flex;align-items:center;gap:12px;width:100%;border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:11px 13px;margin-bottom:8px;cursor:pointer;text-align:left;font-family:inherit;transition:.12s;}
.jrow:active{transform:scale(.98);}
.jrow.cur{border-color:var(--navy);background:#f0f4fa;}
.jrow.dn{opacity:.6;}
.jrow .jn{width:30px;height:30px;border-radius:10px;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;flex:0 0 auto;}
.jrow.dn .jn{background:var(--green);}
.jrow .jt{font-size:14px;font-weight:700;color:var(--ink);}
.jrow .js{font-size:11.5px;color:var(--mut);margin-top:1px;}

/* map strip */
.mapdot{position:absolute;width:34px;height:34px;border-radius:50%;background:var(--yellow);border:3px solid #fff;box-shadow:0 4px 12px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;color:#181206;}

/* tabbar */
.tabbar{position:absolute;bottom:14px;left:16px;right:16px;background:rgba(15,23,38,.92);backdrop-filter:blur(14px);border-radius:26px;display:flex;padding:8px;z-index:35;box-shadow:0 12px 34px rgba(0,0,0,.35);}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0;border-radius:19px;cursor:pointer;color:#8fa2bd;font-size:10px;font-weight:600;transition:.15s;position:relative;}
.tab.on{color:#fff;}
.tab.on .tic2{background:var(--yellow);color:#181206;}
.tic2{width:42px;height:30px;border-radius:13px;display:flex;align-items:center;justify-content:center;transition:.15s;}
.tbdg{position:absolute;top:2px;right:16%;background:var(--red);color:#fff;font-size:9px;font-weight:800;min-width:16px;height:16px;border-radius:99px;display:flex;align-items:center;justify-content:center;padding:0 4px;}

/* sheet + toast */
.sheetw{position:absolute;inset:0;z-index:50;display:none;}
.sheetw.open{display:block;}
.sheetbg{position:absolute;inset:0;background:rgba(5,10,18,.55);animation:fdin .2s;}
@keyframes fdin{from{opacity:0}to{opacity:1}}
.choice{display:flex;align-items:center;gap:13px;width:100%;border:1.5px solid var(--line);background:#fff;border-radius:16px;padding:14px;margin-bottom:9px;cursor:pointer;text-align:left;font-family:inherit;transition:.12s;}
.choice:active{transform:scale(.98);}
.choice .cic{width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.choice .ct{font-size:15px;font-weight:700;color:var(--ink);}
.choice .cs{font-size:12px;color:var(--mut);margin-top:1px;}
.c-green .cic{background:var(--greenbg);color:var(--green);}.c-green{border-color:#c8ead9;}
.c-amber .cic{background:var(--amberbg);color:var(--amber);}.c-amber{border-color:#ded0f7;}
.c-red .cic{background:var(--redbg);color:var(--red);}.c-red{border-color:#f3cdc8;}
.rrow .ava img{width:100%;height:100%;object-fit:cover;border-radius:16px;}
.sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:28px 28px 0 0;padding:12px 22px 30px;animation:shup .28s cubic-bezier(.2,.8,.2,1);max-height:88%;overflow-y:auto;overscroll-behavior:contain;}
@keyframes shup{from{transform:translateY(100%)}to{transform:none}}
.grab{width:42px;height:5px;border-radius:99px;background:#e0e4ea;margin:8px auto 16px;}
.toast{position:absolute;left:20px;right:20px;bottom:96px;background:#0f1726;color:#fff;padding:14px 17px;border-radius:16px;font-size:13.5px;font-weight:600;z-index:60;display:flex;align-items:center;gap:10px;opacity:0;transform:translateY(16px);transition:.28s;box-shadow:0 14px 40px rgba(0,0,0,.4);pointer-events:none;}
.toast.show{opacity:1;transform:none;}
.toast .tico{width:30px;height:30px;border-radius:10px;background:var(--yellow);color:#181206;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}

body.embed .notch{display:none!important;}
body.embed .stage{padding:0;min-height:100vh;}
body.embed .phone{max-width:none;width:100%;height:100vh;border:none;border-radius:0;box-shadow:none;}
body.embed .sbar{display:none;}
body.embed .ghead,body.embed .dhead{padding-top:26px;}
body.embed .login .inner{padding-top:34px;}
body.embed{overflow:hidden;height:100vh;overscroll-behavior:none;}
.screen{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
/* v88 — inbox thread polish */
.ibcol{max-width:1100px;margin:0 auto;width:100%;padding-bottom:26px;}
/* v88.3 — iMessage-style bubbles in the admin thread */
.ibcol .bub.them{background:#e9e9eb;border:none;color:#111;}
.ibcol .bub.them .bt{color:#5f6570;opacity:1;}
.ibcol .bub.me{background:#0a84ff;color:#fff;}
.ibcol .bub{max-width:100%;width:fit-content;box-shadow:none;font-size:14.5px;align-self:auto;overflow-wrap:anywhere;word-break:break-word;}
.ibmrow{display:flex;gap:10px;align-items:flex-end;margin-top:16px;}
.ibmrow.ibgrp{margin-top:4px;}
.ibmrow.mine{justify-content:flex-end;}
.ibmrow .ibmcol{display:flex;flex-direction:column;min-width:0;max-width:min(78%,760px);align-items:flex-start;}
.ibmrow.mine .ibmcol{align-items:flex-end;}
.ibava{width:30px;height:30px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex:0 0 auto;}
.ibava.ghost{visibility:hidden;}
.ibwho{font-size:11.5px;font-weight:800;color:var(--mut);margin:0 0 3px 4px;}
.ibmrow.ibgrp .bub .bt{display:none;}
.ibmrow .bub{animation:none;}
.ibdate{display:flex;align-items:center;gap:12px;margin:16px 0 8px;}
.ibdate:before,.ibdate:after{content:"";flex:1;height:1px;background:var(--line);}
.ibdate span{font-size:11px;font-weight:800;color:var(--mut);letter-spacing:.05em;text-transform:uppercase;}
.ibnew{display:flex;align-items:center;gap:12px;margin:12px 0 8px;}
.ibnew:before,.ibnew:after{content:"";flex:1;height:1.5px;background:#e8483f;}
.ibnew span{font-size:10.5px;font-weight:900;color:#e8483f;letter-spacing:.08em;text-transform:uppercase;}
.ibrow.sel{background:var(--skybg,#e8f3fa)!important;border-left:3px solid var(--yellow);}
.ibrow.unrd .rsub{color:var(--ink);font-weight:600;}
.mdh{font-size:1.06em;font-weight:800;margin:8px 0 3px;letter-spacing:-.01em;}
.mdh:first-child{margin-top:0;}
.mdli{padding:1px 0 1px 6px;}
.mdhr{height:1px;background:currentColor;opacity:.18;margin:8px 0;}
/* v91 — the Owner tab renders in the standard light console theme (dev skin removed) */
body.embed .ldemo{display:none!important;}
body.embed.demook .ldemo{display:flex!important;}
body.embed .login{min-height:var(--vvh,100dvh);max-height:var(--vvh,100dvh);overflow:hidden;transition:max-height .15s;}
body.embed .login .inner{justify-content:flex-start;padding-top:min(34vh,300px);}
body.embed .lspacer{display:none;}
body.embed .lform{max-width:420px;width:100%;}
body.embed .lsafe{margin-top:26px;}
body.kb .lsafe{display:none;}
body.kb .lin{padding:14px 16px;margin-bottom:9px;}
body.kb .lbtn{padding:14px;}
body.kb .ltrouble{margin-bottom:7px;}
body.embed .llogo{position:absolute;top:calc(env(safe-area-inset-top,0px) + 30px);left:26px;width:58px;height:58px;}
body.embed .lbrand{position:absolute;top:calc(env(safe-area-inset-top,0px) + 34px);left:96px;font-size:19px;}
body.embed .ltag{position:absolute;top:calc(env(safe-area-inset-top,0px) + 78px);left:96px;font-size:12px;}

sg-app{display:block;width:100%;height:100vh;overflow:hidden;}
body.nochrome .tabbar{display:none!important;}
body.nochrome .chatbar{bottom:calc(12px + env(safe-area-inset-bottom,0px));}
body.nochrome .chat{padding-bottom:80px;}

html,body{background:#0b1526!important;}
body.embed .phone{height:100vh;height:100dvh;}
sg-app{height:100vh;height:100dvh;}
body.embed .tabbar{bottom:calc(10px + env(safe-area-inset-bottom,0px));}
body.embed .ghead,body.embed .dhead{padding-top:calc(20px + env(safe-area-inset-top,0px));}
/* v105.14 — the parent's message thread put its header inside the scrolling
   area, so Back rode away with the messages and a parent had to scroll all the
   way up to leave. .screen is the scroller, so top:0 pins to it. Scoped to
   .pmhead: every other .ghead sits on a short page and gains nothing. */
.pmhead{position:sticky;top:0;z-index:20;background:var(--bg);}
body.embed .sobtn{top:calc(22px + env(safe-area-inset-top,0px));}
body.embed .login .inner{padding-top:calc(env(safe-area-inset-top,0px) + min(30vh,280px));}

.bub.them{color:var(--ink);}
.bub.me{color:#fff;}
body.embed .phone{height:var(--vvh,100dvh);transition:height .12s ease-out;}
body.kb .tabbar{display:none;}
body.kb .chatbar{bottom:12px;}

body.kb .login .inner{justify-content:flex-end;padding-top:0;padding-bottom:14px;transition:padding .15s;}

body.embed .stage{align-items:flex-start;justify-content:center;min-height:0;height:var(--vvh,100dvh);padding:0;}
body.kb .ltag{display:none;}
@media (min-width:900px){
 .pad{max-width:960px;margin:0 auto;padding-left:28px;padding-right:28px;}
 .ghead,.chiprow{max-width:960px;margin-left:auto;margin-right:auto;padding-left:28px;padding-right:28px;}
 .g2{grid-template-columns:repeat(4,1fr);}
 body.embed .tabbar{left:50%;transform:translateX(-50%);width:600px;right:auto;}
 .dhead{max-width:960px;margin:0 auto;padding-left:28px;padding-right:28px;}
 .login .inner{max-width:520px;margin:0 auto;width:100%;}
 .chatbar{left:50%;transform:translateX(-50%);width:640px;right:auto;}
}
.sbbrand,.sbout{display:none;}
#dock{display:none;}
.tab.deskonly{display:none;}
/* v84 — mobile admin is informational: heavy-edit controls hide under 1100px */
@media (max-width:1099px){
 body.adminview .deskaction{display:none!important;}
 .ibdetail,.ibjump{display:none!important;}
 /* v100.3 — mobile admin inbox is a real full-height thread. Previously the
    desktop flex/scroll rules disappeared below 1100px while the view itself
    remained overflow:hidden, leaving messages and the composer fighting the
    page container. */
 body.adminview.threadopen .screen,body.adminview.threadopen .view{min-height:0;overflow:hidden!important;}
 body.adminview.threadopen .view,body.adminview .ibwrap,body.adminview .ibthread{height:100%;}
 body.adminview .ibwrap{min-height:0;}
 body.adminview .ibthread{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;position:relative;}
 body.adminview .ibthread .ghead{flex:0 0 auto;position:static;padding:calc(12px + env(safe-area-inset-top,0px)) 14px 10px;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line);}
 body.adminview .ibmsgs{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:12px 14px 8px;}
 body.adminview .ibcomposer{flex:0 0 auto;position:static!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;width:auto!important;margin:0 10px calc(10px + env(safe-area-inset-bottom,0px));padding:8px;border-top:1px solid var(--line);border-radius:18px!important;}
 body.adminview .ibmrow{gap:8px;}
 body.adminview .ibmrow .ibmcol{max-width:calc(88% - 36px);}
 body.adminview .ibmrow.mine .ibmcol{max-width:88%;}
 body.adminview .ibava{width:28px;height:28px;font-size:10px;}
 body.adminview .ibhead{gap:8px;align-items:flex-start;}
 body.adminview .ibhead .glg{font-size:17px!important;}
 body.adminview .ibhead .gsm{white-space:normal;line-height:1.3;}
 body.adminview .ibactions{gap:5px!important;}
 body.adminview .ibactions .btn{padding:8px 10px!important;}
 body.adminview .ibtaskbtn{display:none;}
}
.nmbtn{display:flex;align-items:center;gap:7px;background:var(--yellow);color:#181206;border:none;border-radius:99px;padding:10px 16px;font-size:13px;font-weight:800;font-family:inherit;cursor:pointer;margin-right:12px;box-shadow:0 4px 14px rgba(247,183,28,.35);transition:.13s;white-space:nowrap;}
.nmbtn:active{transform:scale(.95);}
/* v100.6.1 — "Assignments" drew OUTSIDE the pill. Every previous pass adjusted
   the max-width, which is why it came back each time a label changed.
   The real cause is two things compounding:
     1. The admin view renders inside a 392px phone frame, but the rule that gives
        this control its own row is keyed to the VIEWPORT (@media 620px). On any
        desktop window that rule never fires, so the pill was squeezed to ~200px
        while its labels needed ~230px.
     2. A flex item's default min-width is `auto`, so the buttons could not shrink
        below their own text — with nowhere to go, they rendered past the edge.
   Fix: the header may wrap, so a squeezed control drops to its own line at full
   width instead of being compressed; the pill sizes to its content rather than a
   magic number; and min-width:0 + ellipsis means that even in a case neither of
   us has thought of, the label clips INSIDE the pill rather than escaping it. */
.routehead{flex-wrap:wrap;row-gap:10px;}
.routehead>div:first-child{min-width:0;}
.routeseg{width:max-content;max-width:100%;margin:0 0 0 18px;flex:0 0 auto;}
.tripseg{width:max-content;max-width:100%;}
@media (max-width:620px){
 body.adminview .routehead{flex-wrap:wrap;align-items:center;gap:9px;padding-bottom:12px;}
 body.adminview .routehead>div:first-child{flex:1 1 auto;}
 body.adminview .routehead .routeseg{order:3;width:100%;max-width:none;margin:2px 0 0;flex:1 0 100%;}
 body.adminview .tripseg{width:100%;max-width:none;margin-top:0;}
}
.mfancy{display:flex;align-items:center;gap:12px;text-align:left;background:#fff;padding:14px 15px;min-height:78px;}
.mfancy .mn{font-size:24px;line-height:1.1;}
.mfancy .ml{margin-top:3px;font-size:12.5px;}
.mico{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.tpick{width:44px;height:44px;border-radius:13px;border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--mut);cursor:pointer;transition:.12s;}
.tpick.on{border-color:var(--amber);background:var(--amberbg);color:var(--amber);}
.echip{width:38px;height:38px;border-radius:11px;border:1.5px solid var(--line);background:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.12s;padding:0;}
.echip:hover{border-color:var(--amber);background:var(--amberbg);}
.echip:active{transform:scale(.9);}
.lcol,.rcol{display:contents;}
.dbabsside{display:flex;gap:6px;align-items:center;flex:0 0 auto;margin-left:auto;} /* v105.19 — an absence row's chip, pill and Remove wrap as one unit, never Remove alone */
@media(max-width:520px){.dbabsside{flex:1 0 100%;margin-left:0;justify-content:flex-end;}} /* on a phone the unit takes its own line under the name */
#vas{position:fixed;left:16px;bottom:90px;z-index:80;} /* v92 — fixed to the viewport; #vas now lives outside the (transformed) phone */
/* v105.18 — on an admin phone the yellow pill sat on the tab bar; View As is a row in More. The red return pill stays. */
@media(max-width:820px){body.adminview #vas .vaspill:not(.on){display:none;}}
.vaspill{display:flex;align-items:center;gap:8px;background:var(--yellow);color:#181206;border-radius:99px;padding:9px 12px;font-size:12px;font-weight:700;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.35);border:none;}
.vaspill.on{background:var(--red);color:#fff;}
.vastab{color:var(--yellow)!important;}
.vastab .tic2{background:rgba(247,183,28,.16)!important;}
.vastab.impon{color:#ff7d72!important;}
.vastab.impon .tic2{background:rgba(232,72,63,.22)!important;}
/* v105.13 — MAP TILE STYLE. CARTO's pale basemap began demanding an API key
   (v105.10.2), so the tiles became OpenStreetMap's own: far denser and more
   colourful than the grey basemap this map was designed around — the "overly
   complex map" Isaac reported. Rather than take a key or a third party, the
   pale look is reproduced with a filter over the same tiles. The markers,
   tooltips and controls sit in other panes, so only the basemap is touched.
   Tune by eye: lower saturate = greyer, higher brightness = washier.
   #livemap.mapstd is the opt-out, toggled by mapStyleTog(). */
#livemap .leaflet-tile-pane{filter:saturate(.15) brightness(1.10) contrast(.88);}
#livemap.mapstd .leaflet-tile-pane{filter:none;}
.leaflet-tooltip.bustip{border:none;box-shadow:0 12px 34px rgba(15,23,38,.2);border-radius:14px;padding:11px 13px;}
.maplink{animation:mappulse 2.8s ease-in-out infinite;}
@keyframes mappulse{0%,100%{box-shadow:0 8px 24px rgba(15,23,38,.07);}50%{box-shadow:0 10px 32px rgba(90,111,240,.4);}}
.livepill{display:inline-flex;align-items:center;gap:5px;background:var(--greenbg);color:var(--green);font-size:10px;font-weight:800;letter-spacing:.6px;padding:4px 9px;border-radius:99px;margin-left:auto;}
.ldot{width:6px;height:6px;border-radius:50%;background:var(--green);animation:lpulse 1.5s infinite;}
@keyframes lpulse{0%,100%{opacity:1}50%{opacity:.25}}
.dockhead{display:flex;align-items:center;gap:10px;padding:20px 18px 12px;border-bottom:1px solid #eef1f6;}
.dockhead .dt{font-size:16px;font-weight:800;color:var(--ink);}
.dockhead .ds{font-size:11px;color:var(--mut);font-weight:600;}
.dcompose{margin-left:auto;width:34px;height:34px;border-radius:11px;background:var(--yellow);color:#181206;display:flex;align-items:center;justify-content:center;cursor:pointer;font-weight:900;font-size:18px;box-shadow:0 3px 10px rgba(247,183,28,.35);}
.docklist{flex:1;overflow-y:auto;}
.dockrow{display:flex;gap:10px;padding:13px 18px;cursor:pointer;border-bottom:1px solid #f2f4f8;align-items:center;}
.dockrow:hover{background:#f6f8fb;}
.dockchat{flex:1;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:5px;}
.dockbar{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #eef1f6;align-items:flex-end;}
.fmtbar{display:flex;gap:6px;}
.fmtbar button{padding:5px 15px;border-radius:8px;border:1.5px solid var(--line);background:#fff;font-family:inherit;font-size:13px;cursor:pointer;color:var(--navy);}
#dock .fmtbar{border-top:1px solid rgba(255,255,255,.08);padding:10px 14px 0;}
#dock .fmtbar button{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.45);color:#fff;}
.dockbar input,.dockbar textarea{flex:1;border:1.5px solid var(--line);border-radius:12px;padding:11px 13px;font-size:13.5px;font-family:inherit;outline:none;min-width:0;}
.dockbar textarea{resize:none;max-height:110px;line-height:1.4;overflow-y:auto;}
#dock .dockhead{border-bottom:1px solid rgba(255,255,255,.08);}
#dock .dt{color:#fff;}
#dock .ds{color:#8fa2bd;}
#dock .dockrow{border-bottom:1px solid rgba(255,255,255,.05);}
#dock .dockrow:hover{background:rgba(255,255,255,.05);}
#dock .rname{color:#fff;}
#dock .rsub{color:#8fa2bd;}
#dock .dockbar{border-top:1px solid rgba(255,255,255,.08);}
#dock .dockbar input,#dock .dockbar textarea{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff;}
#dock .dockbar input::placeholder,#dock .dockbar textarea::placeholder{color:#7f92ae;}
#dock .backb{color:#fff;background:rgba(255,255,255,.09);}
#dock .ava{border:2px solid rgba(255,255,255,.14);}
@media (min-width:1100px){
 body.adminview.embed .tabbar{left:0;top:0;bottom:0;right:auto;width:232px;border-radius:0;flex-direction:column;padding:18px 14px;gap:4px;justify-content:flex-start;background:#0b1526;box-shadow:none;transform:none;}
 body.adminview.nochrome .tabbar{display:flex!important;}
 body.adminview .tab{flex:0 0 auto;flex-direction:row;justify-content:flex-start;gap:12px;padding:10px 12px;border-radius:12px;font-size:13.5px;width:100%;}
 body.adminview .tab:hover{background:rgba(255,255,255,.05);}
 body.adminview .tab.on{background:rgba(247,183,28,.13);}
 body.adminview .tab.deskonly{display:flex;}
 body.adminview .tab.moponly{display:none;}
 body.adminview .tic2{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.06);flex:0 0 auto;}
 body.adminview .tbdg{position:static;margin-left:auto;}
 body.adminview .sbbrand{display:flex;align-items:center;gap:11px;padding:6px 8px 18px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:14px;width:100%;}
 body.adminview .sblogo{width:38px;height:38px;border-radius:11px;background:url(/icon-192.png) center/cover;flex:0 0 auto;}
 body.adminview .sbt{font-size:12.5px;font-weight:800;color:#fff;letter-spacing:.4px;line-height:1.25;}
 body.adminview .sbt em{font-style:normal;color:var(--yellow);}
 body.adminview .sbs{font-size:10.5px;color:#8fa2bd;font-weight:600;margin-top:2px;}
 body.adminview .sbout{display:flex;margin-top:auto;color:#8fa2bd;}
 body.adminview .screen{background:#0b1526;overflow:hidden;}
 body.adminview .view{position:absolute;top:16px;left:248px;right:16px;bottom:16px;background:linear-gradient(168deg,#f2f5fa,#ffffff 34%);border-radius:26px;box-shadow:0 24px 70px rgba(0,0,0,.45);overflow-y:auto;overscroll-behavior:contain;animation:none;}
 body.adminview .ghead{margin:0;max-width:none;padding:26px 30px 18px;}
 body.adminview .ghead .glg{font-size:26px;}
 body.adminview .chiprow{margin:0;max-width:none;padding-left:30px;padding-right:30px;}
 body.adminview .pad{margin:0;width:auto;max-width:none;padding:0 28px 36px;display:grid;grid-template-columns:1fr 1fr;gap:13px;align-items:start;}
 body.adminview .pad>*{margin-top:0;}
 body.adminview .lcol,body.adminview .rcol{display:flex;flex-direction:column;gap:13px;min-width:0;}
 body.adminview .card{padding:16px 18px;}
 body.adminview .rowitem{padding-top:8px;padding-bottom:8px;}
 body.adminview .notiitem{padding-top:8px;padding-bottom:8px;}
 body.adminview .ghead{padding-top:20px;padding-bottom:12px;}
 body.adminview .card{margin-top:0;box-shadow:0 8px 24px rgba(15,23,38,.07);border:1px solid #e7ecf5;background:linear-gradient(155deg,#ffffff 0%,#f3f7ff 100%);}
 body.adminview .gava{display:none;}
 body.adminview .metric{margin:0;box-shadow:0 5px 16px rgba(15,23,38,.05);border:1px solid #e9edf4;}
 body.adminview .rowitem:hover{background:#f6f8fb;}
 body.adminview .rowitem{border-radius:12px;transition:background .12s;} /* v93 — hover fades instead of snapping */
 body.adminview .g2{grid-column:1/-1;grid-template-columns:repeat(6,1fr);}
 body.adminview .seg{grid-column:1/-1;max-width:520px;}
 body.adminview .chat{grid-column:1/-1;}
 body.adminview .chatbar{left:calc(50% + 116px);transform:translateX(-50%);width:640px;right:auto;bottom:30px;}
 body.adminview .toast{left:auto;right:24px;bottom:24px;width:360px;z-index:70;}
 body.adminview #vas{display:none;}
 body.adminview .sheet{left:50%;right:auto;bottom:auto;top:50%;transform:translate(-50%,-50%);width:600px;max-height:82vh;overflow-y:auto;border-radius:24px;animation:fdin .2s;padding:22px 26px 26px;}
 body.adminview .sheet .grab{display:none;}
 body.adminview.threadopen .view{overflow:hidden;}
 body.adminview .ibwrap{position:absolute;top:0;left:0;right:0;bottom:0;display:grid;grid-template-columns:340px minmax(0,1fr) 360px;min-height:0;overflow:hidden;}
 body.adminview .ibthread{display:flex!important;flex-direction:column;min-width:0;min-height:0;overflow:hidden!important;position:relative;}
 body.adminview .ibthread .ghead{flex:0 0 auto;position:static;background:rgba(255,255,255,.96);border-bottom:1px solid #eef1f6;}
 body.adminview .ibmsgs{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:20px 36px 10px;}
 body.adminview .ibcomposer{flex:0 0 auto;position:static!important;left:auto!important;transform:none!important;width:auto!important;margin:0 22px 16px;border-top:1px solid var(--line);}
 body.adminview .ibdetail{display:flex;flex-direction:column;gap:11px;overflow-y:auto;padding:16px 14px;border-left:1px solid #e7ecf5;background:#fbfcfe;border-radius:0 26px 26px 0;}
 /* v91 — collapsible details rail: the thread column takes the freed width */
 body.adminview .ibwrap.railmin{grid-template-columns:340px minmax(0,1fr);}
 body.adminview .ibwrap.railmin .ibdetail{display:none;}
 /* v92 — collapsed-rail affordance: slim tab on the thread's right edge re-opens Details */
 .railtab{display:none;}
 /* v93 — reopen tab was rendering but invisible: near-white on white, z-index 8 under the
    composer (.chatbar keeps z-index:34 as a flex item even when static). Contrast + z fix. */
 body.adminview .railtab{position:absolute;right:0;top:0;bottom:0;width:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--navy);background:#eef2fa;border-left:1px solid #d7dfec;border-radius:0 26px 26px 0;z-index:36;font-size:17px;font-weight:800;user-select:none;transition:background .12s;}
 body.adminview .railtab:hover{color:var(--navy);background:#e2e9f5;}
 body.adminview .ibwrap.railmin .ibmsgs{padding-right:56px;}
 body.adminview .ibdetail .dcard{background:#fff;border:1px solid #e9edf4;border-radius:14px;padding:12px 14px;}
 body.adminview .ibdetail .dlbl{font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);margin-bottom:7px;}
 body.adminview .ibdetail .drow{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 0;font-size:13px;}
 body.adminview .ibdetail .drow .rsub{font-size:12.5px;}
 body.adminview .ibrow.resv{opacity:.55;}
 body.adminview .ibjump{position:absolute;bottom:132px;left:50%;transform:translateX(-50%);z-index:7;background:#0f1726;color:#fff;border:none;border-radius:99px;padding:9px 16px;font-size:12.5px;font-weight:800;font-family:inherit;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.3);display:none;}
 body.adminview .ibthread.scrolled .ibjump{display:block;}
 body.adminview .iblist{display:block;overflow-y:auto;padding:18px 14px;border-right:1px solid #e7ecf5;background:#fbfcfe;border-radius:26px 0 0 26px;}
 body.adminview .ibthread{position:relative;overflow-y:auto;min-width:0;}


 /* v84 — impersonation phone frame: "View as" renders inside a phone mock-up in the
    work area while the dark left rail stays for the trip back to the console. */
 body.embed.impframe{background:#0b1526!important;}
 body.embed.impframe .stage{align-items:center;justify-content:center;padding-left:232px;height:100vh;overflow:hidden;}
 /* v91 — fixed 390×780 frame: the app is mobile-first, so a constrained container is
    the true phone experience. transform:scale() (set by render()) fits small windows. */
 /* v93 — border-box was subtracting the 22px bezel from the APP (368px inner, right-edge
    clipping). Outer 412×802 = true 390×780 app inside; the scale math already used 412/802. */
 body.embed.impframe .phone{width:412px;min-width:412px;max-width:412px;height:802px;min-height:802px;flex:0 0 auto;transform:scale(var(--impscale,1));transform-origin:center center;border-radius:44px;border:11px solid #05070b;box-shadow:0 30px 90px rgba(0,0,0,.55);transition:none;}
 /* guard: desktop-width layout rules must not leak into the phone frame */
 body.embed.impframe .pad,body.embed.impframe .ghead,body.embed.impframe .chiprow,body.embed.impframe .dhead{max-width:none;padding-left:22px;padding-right:22px;}
 body.embed.impframe .g2{grid-template-columns:repeat(2,1fr);}
 body.embed.impframe .tabbar{position:absolute;left:14px;right:14px;bottom:12px;top:auto;width:auto;transform:none;border-radius:26px;flex-direction:row;padding:8px;}
 body.embed.impframe .chatbar{left:14px;right:14px;width:auto;transform:none;}
 body.embed.impframe .toast{left:20px;right:20px;width:auto;}
 body.embed.impframe #vas{display:block;}
 .imprail{position:fixed;left:0;top:0;bottom:0;width:232px;background:#0b1526;z-index:80;display:flex;flex-direction:column;padding:18px 14px;box-shadow:inset -1px 0 0 rgba(255,255,255,.06);}
 .imprail .irbrand{display:flex;align-items:center;gap:11px;padding:6px 8px 18px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:14px;}
 .imprail .irlogo{width:38px;height:38px;border-radius:11px;background:url(/icon-192.png) center/cover;flex:0 0 auto;}
 .imprail .irt{font-size:12.5px;font-weight:800;color:#fff;letter-spacing:.4px;line-height:1.25;}
 .imprail .irt em{font-style:normal;color:var(--yellow);}
 .imprail .ircard{background:rgba(232,72,63,.14);border:1px solid rgba(232,72,63,.35);border-radius:14px;padding:12px 13px;color:#ffb4ae;font-size:12.5px;font-weight:700;line-height:1.45;}
 .imprail .ircard b{color:#fff;display:block;font-size:13.5px;margin-bottom:2px;}
 .imprail .irback{display:flex;align-items:center;gap:10px;background:var(--yellow);color:#181206;border:none;border-radius:13px;padding:12px 14px;font-size:13.5px;font-weight:800;font-family:inherit;cursor:pointer;margin-top:12px;width:100%;justify-content:center;}
 .imprail .irhint{color:#8fa2bd;font-size:11.5px;line-height:1.5;margin-top:auto;padding:0 4px 6px;}
}
@media (min-width:1280px){
 body.adminview:not(.inboxview) #dock{display:flex;flex-direction:column;position:absolute;top:16px;right:16px;bottom:16px;width:352px;background:linear-gradient(180deg,#20305a,#15203d);border-radius:26px;z-index:30;box-shadow:0 24px 70px rgba(0,0,0,.45);overflow:hidden;border:1px solid rgba(255,255,255,.07);}
 body.adminview:not(.inboxview) .view{right:384px;}
 body.adminview:not(.inboxview) .toast{right:400px;}
 /* v91 — minimizable dock: slim strip keeps the unread count; the view reclaims the width */
 body.adminview.dockmin:not(.inboxview) #dock{width:52px;cursor:pointer;}
 body.adminview.dockmin:not(.inboxview) .view{right:84px;}
 body.adminview.dockmin:not(.inboxview) .toast{right:100px;}

 /* ===== v92 — owner dark mode: scoped to body.darkmode.adminview only, so the
    login, parent, driver and impersonation surfaces are untouched. Opt-in via
    Settings (owner-gated), persisted in localStorage sg_dark. ===== */
 body.darkmode.adminview{--dmbg:#0f1420;--dmcard:#171e2c;--dmcard2:#1c2434;--dmtext:#e8edf5;--dmmut:#94a2b8;--dmline:rgba(255,255,255,.09);}
 body.darkmode.adminview .view{background:linear-gradient(168deg,#131a28,#0f1420 40%);color:var(--dmtext);}
 body.darkmode.adminview .card,body.darkmode.adminview .kidcard{background:var(--dmcard);background-image:none;border-color:var(--dmline);color:var(--dmtext);box-shadow:0 8px 24px rgba(0,0,0,.4);}
 body.darkmode.adminview .ghead .glg,body.darkmode.adminview .rname,body.darkmode.adminview .hh,body.darkmode.adminview .nt,body.darkmode.adminview .dt{color:var(--dmtext);}
 body.darkmode.adminview .ghead .gsm,body.darkmode.adminview .rsub,body.darkmode.adminview .nm,body.darkmode.adminview .ml,body.darkmode.adminview .flb,body.darkmode.adminview label.flb,body.darkmode.adminview .hh .see,body.darkmode.adminview .ctime,body.darkmode.adminview .ibwho,body.darkmode.adminview .ibdate span{color:var(--dmmut);}
 body.darkmode.adminview .rowitem,body.darkmode.adminview .convrow{border-color:var(--dmline);}
 body.darkmode.adminview .tkdet{color:var(--dmmut);}body.darkmode.adminview .tkdet b{color:var(--dmtext);}
 body.darkmode.adminview .audtile{border-color:var(--dmline);}
 body.darkmode.adminview .audtile b{filter:brightness(1.5);}
 body.darkmode.adminview .audtile span{color:var(--dmmut);}
 body.darkmode.adminview .audrow{border-color:var(--dmline);}
 body.darkmode.adminview .fld{background:#10182a;border-color:rgba(255,255,255,.14);color:var(--dmtext);}
 body.darkmode.adminview .fld::placeholder{color:#66758c;}
 body.darkmode.adminview .fld:focus{border-color:#6d3bd8;}
 body.darkmode.adminview select.fld option{background:#171e2c;color:var(--dmtext);}
 body.darkmode.adminview .seg{background:#0d1320;}
 body.darkmode.adminview .seg.segstrong{border-color:rgba(170,205,245,.3);}
 body.darkmode.adminview select.fld{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23b6c2d6' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");}
 body.darkmode.adminview .seg button{color:#b6c2d6;} /* v93 — inactive label a step lighter than --dmmut */
 body.darkmode.adminview .seg button.on{background:#26334c;color:#fff;box-shadow:none;}
 body.darkmode.adminview .chip{background:var(--dmcard2);border-color:rgba(255,255,255,.13);color:#a7b4c9;}
 body.darkmode.adminview .chip.on{background:#6d3bd8;border-color:#6d3bd8;color:#fff;}
 body.darkmode.adminview .echip{background:var(--dmcard2);border-color:rgba(255,255,255,.13);color:var(--dmtext);}
 body.darkmode.adminview .sheet{background:var(--dmcard);color:var(--dmtext);}
 body.darkmode.adminview .grab{background:#33405a;}
 body.darkmode.adminview .btn.ghost{background:var(--dmcard2);border-color:rgba(255,255,255,.15);color:var(--dmtext);}
 body.darkmode.adminview .tog2 .t{background:var(--dmcard2);border-color:rgba(255,255,255,.13);color:var(--dmmut);}
 body.darkmode.adminview .radio{background:var(--dmcard2);border-color:rgba(255,255,255,.13);}
 body.darkmode.adminview .metric{background:var(--dmcard);border-color:var(--dmline);box-shadow:none;}
 body.darkmode.adminview .mfancy{background:var(--dmcard);}
 body.darkmode.adminview .metric .mn{filter:brightness(1.5);}
 body.darkmode.adminview .metric .ml{color:var(--dmmut);}
 /* pills keep their semantic hue but get a dark-tinted bg for ≥4.5:1 on dark cards */
 body.darkmode.adminview .pill.g{background:rgba(18,160,106,.18);color:#52d6a2;}
 body.darkmode.adminview .pill.y{background:rgba(109,59,216,.24);color:#c3aaf5;}
 body.darkmode.adminview .pill.r{background:rgba(232,72,63,.2);color:#f5928b;}
 body.darkmode.adminview .pill.b{background:rgba(75,176,230,.18);color:#7cc7ef;}
 body.darkmode.adminview .pill.n{background:rgba(255,255,255,.1);color:#c6d1e2;}
 body.darkmode.adminview .pill.v{background:rgba(109,59,216,.24);color:#c3aaf5;} /* v95 */
 body.darkmode.adminview .tkresp{background:var(--dmcard2);color:var(--dmtext);} /* v95 */
 body.darkmode.adminview .nico.b{background:rgba(75,176,230,.16);color:#7cc7ef;}
 body.darkmode.adminview .nico.y{background:rgba(138,99,210,.2);color:#b9a1ef;}
 body.darkmode.adminview .nico.g{background:rgba(18,160,106,.18);color:#52d6a2;}
 body.darkmode.adminview .nico.r{background:rgba(232,72,63,.18);color:#f5928b;}
 body.darkmode.adminview .nico.s{background:rgba(255,255,255,.09);color:#aab8cf;}
 /* inbox three-pane */
 body.darkmode.adminview .iblist,body.darkmode.adminview .ibdetail{background:#131a28;border-color:var(--dmline);}
 body.darkmode.adminview .ibthread .ghead{background:rgba(23,30,44,.96);border-bottom-color:var(--dmline);}
 body.darkmode.adminview .ibrow:hover{background:rgba(255,255,255,.05);}
 body.darkmode.adminview .ibrow.sel{background:#22304a!important;border-left-color:#6d3bd8;}
 body.darkmode.adminview .ibdetail .dcard{background:var(--dmcard2);border-color:var(--dmline);}
 body.darkmode.adminview .railtab{background:#1c2434;border-left-color:rgba(255,255,255,.14);color:var(--dmtext);}
 body.darkmode.adminview .railtab:hover{background:#26334c;color:#fff;}
 /* v93 — soft dark highlights: the light hover (#f6f8fb) leaked into dark mode with no
    override — solid near-white rows under near-white text (worst in sheets like View-as,
    which share the same .rowitem class). Feathered translucent treatment instead. */
 body.darkmode.adminview .rowitem:hover{background:rgba(255,255,255,.07);box-shadow:0 0 0 1px rgba(255,255,255,.05);}
 body.darkmode.adminview .radio.on{background:#26334c;border-color:#6d3bd8;}
 body.darkmode.adminview .choice{background:var(--dmcard2);border-color:rgba(255,255,255,.13);color:var(--dmtext);}
 body.darkmode.adminview .sheet [style*="--amberbg"],body.darkmode.adminview .card [style*="--amberbg"]{background:rgba(109,59,216,.18)!important;color:var(--dmtext)!important;}
 body.darkmode.adminview .bub.them{background:var(--dmcard2);border-color:var(--dmline);color:var(--dmtext);}
 body.darkmode.adminview .bub.me{background:#2a3a5c;color:#fff;}
 body.darkmode.adminview .ibdate:before,body.darkmode.adminview .ibdate:after{background:var(--dmline);}
 body.darkmode.adminview .chatbar{background:rgba(23,30,44,.94);border-color:var(--dmline)!important;}
 body.darkmode.adminview .chatbar input,body.darkmode.adminview .chatbar textarea{background:#10182a;border-color:rgba(255,255,255,.14);color:var(--dmtext);}
 body.darkmode.adminview .chatbar input::placeholder,body.darkmode.adminview .chatbar textarea::placeholder{color:#66758c;}
 body.darkmode.adminview .fmtbar button{background:var(--dmcard2);border-color:rgba(255,255,255,.14);color:var(--dmtext);}
 /* reports tables (sticky header included) */
 body.darkmode.adminview .reptab th{color:var(--dmmut);border-color:rgba(255,255,255,.14);background:var(--dmcard)!important;box-shadow:0 1.5px 0 var(--dmline)!important;}
 body.darkmode.adminview .reptab td{border-color:rgba(255,255,255,.07);}
 /* inline light-theme hardcodes that would sit on dark cards */
 body.darkmode.adminview [style*="color:var(--ink)"]{color:var(--dmtext)!important;}
 body.darkmode.adminview [style*="color:var(--navy)"]{color:#c6d1e2!important;}
 body.darkmode.adminview .card [style*="background:#fff"]{background:var(--dmcard2)!important;color:var(--dmtext)!important;}
 body.darkmode.adminview .sheet [style*="background:#fff"]{background:var(--dmcard2)!important;color:var(--dmtext)!important;}
 body.darkmode.adminview [style*="background:var(--skybg"]{background:rgba(75,176,230,.14)!important;color:#a7cfe8!important;}
 body.darkmode.adminview [style*="background:var(--amberbg"]{background:rgba(109,59,216,.18)!important;color:#c3aaf5!important;}
 body.darkmode.adminview [style*="background:var(--redbg"]{background:rgba(232,72,63,.16)!important;}
 body.darkmode.adminview [style*="background:var(--greenbg"]{background:rgba(18,160,106,.16)!important;}
 body.darkmode.adminview .card.tinted-y,body.darkmode.adminview .card.tinted-b,body.darkmode.adminview .card.tinted-g{background:var(--dmcard2);border-color:var(--dmline);}
 body.darkmode.adminview [style*="background:#efeafc"]{background:rgba(109,59,216,.22)!important;color:#c3aaf5!important;}
 body.darkmode.adminview [style*="background:#e9eef6"]{background:#243147!important;}
 body.darkmode.adminview [style*="background:#eef2f8"]{background:rgba(255,255,255,.1)!important;}
 body.darkmode.adminview [style*="background:#edf0f5"]{background:rgba(255,255,255,.1)!important;}
 /* v105.21 — Isaac's dark-mode screenshots (Sep 19): white boxes OUTSIDE a .card or .sheet (the Help & Updates guide cards and release-note rail, the Knowledge Base library column, the intake panels) kept their white background under the remapped ink; the lavender day-pass strip and group cards hid their titles; the selected intake row was a light box; and every select.fld tiled its chevron across the whole control because the .fld dark rule's background shorthand reset background-repeat. */
 body.darkmode.adminview .view [style*="background:#fff"]{background:var(--dmcard2)!important;color:var(--dmtext)!important;}
 body.darkmode.adminview [style*="background:#f5f1fd"]{background:rgba(109,59,216,.14)!important;border-color:rgba(109,59,216,.35)!important;}
 body.darkmode.adminview [style*="background:var(--bg"]{background:rgba(255,255,255,.08)!important;}
 body.darkmode.adminview select.fld{background-repeat:no-repeat!important;background-position:right 11px center!important;background-color:#10182a!important;}
 body.darkmode.adminview [style*="color:#2456ad"]{color:#8fb4f5!important;background:rgba(47,111,219,.22)!important;}
 /* v105.21.2 — Isaac, Sep 19: the school stop cards on Routes (drop-off lavender #efeafb, pickup sky #e7f2fb) and the People › Intake panels (.regcard and friends carry their own inline stylesheet) were still light boxes in dark mode. */
 body.darkmode.adminview [style*="background:#efeafb"]{background:rgba(109,59,216,.16)!important;border-color:rgba(109,59,216,.4)!important;}
 body.darkmode.adminview [style*="background:#e7f2fb"]{background:rgba(75,176,230,.14)!important;border-color:rgba(75,176,230,.4)!important;}
 body.darkmode.adminview [style*="color:#1c4f9c"]{color:#a7cfe8!important;}
 body.darkmode.adminview [style*="background:#e3edfb"]{background:rgba(75,176,230,.16)!important;border-color:rgba(75,176,230,.4)!important;}
 /* v105.23 — Routes › Schedules dark rules (dark mode is the desktop console's, hence inside this block like every other darkmode rule) */
 body.darkmode.adminview .schtile{background:var(--dmcard2);border-color:var(--dmline);}
 body.darkmode.adminview .schtile .scham{color:var(--dmtext);}
 body.darkmode.adminview .schtile.ov,body.darkmode.adminview .schnote{background:rgba(109,59,216,.18);border-color:rgba(109,59,216,.4);}
 body.darkmode.adminview .schtile.ov .schpm{color:#c3aaf5;}
 body.darkmode.adminview .schnote{color:var(--dmtext);}
 body.darkmode.adminview .schcmp.chg .schcmpp{background:rgba(109,59,216,.18);color:#c3aaf5;}
 body.darkmode.adminview .schlist{border-color:var(--dmline);}
 body.darkmode.adminview .schcmp{border-color:var(--dmline);}

 body.darkmode.adminview .regcard{background:var(--dmcard2);border-color:var(--dmline);}
 body.darkmode.adminview .regcard.bad{background:rgba(232,72,63,.14);border-color:rgba(232,72,63,.35);}
 body.darkmode.adminview .regcard.warn2{background:rgba(109,59,216,.16);border-color:rgba(109,59,216,.4);}
 body.darkmode.adminview .regcard.fixed{background:rgba(18,160,106,.14);border-color:rgba(18,160,106,.35);}
 body.darkmode.adminview .regcard.dim{background:var(--dmcard);}
 body.darkmode.adminview .regwell,body.darkmode.adminview .reglock{background:#10182a;border-color:rgba(255,255,255,.14);}
 body.darkmode.adminview .regreceipt{background:rgba(18,160,106,.14);border-color:rgba(18,160,106,.35);}
 body.darkmode.adminview .regmap{background:repeating-linear-gradient(135deg,#1c2434 0 10px,#171e2c 10px 20px);}
 body.darkmode.adminview .regnum{background:#233046;color:#8fa2bd;}
 body.darkmode.adminview .regstep.done .regnum{background:var(--green,#0d9b67);color:#fff;}
 body.darkmode.adminview .regstep.cur .regnum{background:var(--yellow);color:#181206;}
 body.darkmode.adminview .regpill.n2{background:rgba(255,255,255,.1);color:var(--dmmut);}
 body.darkmode.adminview .regpill.r{background:rgba(232,72,63,.18);color:#f0a09a;}
 body.darkmode.adminview .regpill.g2{background:rgba(18,160,106,.18);color:#7fd7ad;}
 body.darkmode.adminview .regpill.y2{background:rgba(109,59,216,.22);color:#c3aaf5;border-color:rgba(109,59,216,.4);}
 body.darkmode.adminview .regundo{color:#c6d1e2;}
 body.darkmode.adminview .reglbl{color:var(--dmmut);}
 .dockminbody{flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 0;color:#cfe0f5;}
 .dockminbody .cbadge{margin:0;}
}

/* v105.23 — Routes › Schedules: the weekday tiles and the heads-up rows as classes.
   The override tile was gold text on a cream box (Isaac, Sep 19: "this color on white"); it is
   the needs-attention lavender now, and dark mode has its own rule instead of an attribute match. */
.schtile{flex:1;min-width:64px;background:var(--bg,#f2f4f8);border:1px solid var(--line);border-radius:10px;padding:7px 8px;text-align:center;}
.schtile .schdow{font-size:9.5px;font-weight:800;letter-spacing:.05em;color:var(--mut);}
.schtile .scham{font-size:13px;font-weight:800;}
.schtile .schpm{font-size:12px;font-weight:700;color:var(--mut);}
.schtile.ov{background:var(--amberbg);border-color:#ded0f7;}
.schtile.ov .schpm{color:var(--amber);}
.schnote{background:var(--amberbg);border:1px solid #ded0f7;border-radius:11px;padding:8px 11px;margin-top:7px;font-size:12.5px;font-weight:600;color:var(--ink);}
.schnote svg{color:var(--amber);vertical-align:-1px;}
/* v105.23 — Import Schedules: the proposal strip and the Current / Proposed review rows */
.schprop{border-left:4px solid var(--amber);}
.schcmp{display:grid;grid-template-columns:minmax(70px,.8fr) 1fr 1fr;gap:8px;padding:6px 0;border-top:1px solid var(--line);font-size:12.5px;align-items:center;}
.schcmp.schcmph{border-top:0;font-size:10.5px;font-weight:800;letter-spacing:.05em;color:var(--mut);text-transform:uppercase;}
.schcmp .schcmpl{font-weight:700;}
.schcmp .schcmpc{color:var(--mut);}
.schcmp .schcmpp{font-weight:700;}
.schcmp.chg .schcmpp{color:var(--amber);background:var(--amberbg);border-radius:8px;padding:3px 8px;}
.schlist{max-height:300px;overflow-y:auto;border:1px solid var(--line);border-radius:12px;padding:4px 10px;}


body.kb .login .llogo{display:block;position:static;width:46px;height:46px;margin:0 auto 6px;}
body.kb .login .lbrand{position:static;left:auto;top:auto;text-align:center;font-size:14px;line-height:1.25;margin-bottom:10px;}

/* Baseline keyboard and assistive-technology support for the legacy UI. */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}
.linkbtn{display:block;width:auto;margin-left:auto;padding:0;border:0;background:transparent;font:inherit;cursor:pointer;}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid #ffca2f;outline-offset:2px;}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}}

/* ===== v97 — Owner Workbench (owner tab only) ===== */
body.adminview .pad.wbwrap{grid-template-columns:340px minmax(0,1fr) 278px;gap:13px;align-items:start;}
.wbqueue{display:flex;flex-direction:column;gap:10px;min-width:0;max-height:calc(100vh - 190px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:8px;}
.wbstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:0 0 auto;}
.wbstat{border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 8px;text-align:center;}
.wbstat b{font-size:20px;font-weight:800;display:block;color:var(--ink);}
.wbstat span{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--mut);}
.wbstat.hot b{color:#6d3bd8;}
.wbchips{display:flex;gap:6px;flex-wrap:wrap;flex:0 0 auto;}
#wblist{display:flex;flex-direction:column;gap:8px;}
.wbcard{background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 12px;cursor:pointer;transition:background .12s,border-color .12s;}
.wbcard:hover{background:#f6f8fb;}
.wbcard.sel{border-color:#6d3bd8;box-shadow:0 0 0 1px #6d3bd8;}
.wbrow1{display:flex;align-items:center;gap:8px;min-width:0;}
.wbid{font-size:11px;font-weight:800;color:var(--mut);letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.wbago{margin-left:auto;font-size:11px;color:var(--mut);font-weight:600;flex:0 0 auto;display:flex;align-items:center;gap:5px;}
.wbdot{width:8px;height:8px;border-radius:50%;background:var(--red);flex:0 0 auto;}
.wbtitle{font-size:13.5px;font-weight:700;color:var(--ink);margin-top:5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.wbsub{font-size:12px;color:var(--mut);margin-top:4px;display:flex;gap:7px;align-items:center;flex-wrap:wrap;}
/* pulsing activity dot on the Live · In Progress pill — text label always present */
.pill .pdot{width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block;animation:wbpulse 1.3s ease-in-out infinite;}
@keyframes wbpulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.05)}}
@media (prefers-reduced-motion:reduce){.pill .pdot{animation:none;}}
/* detail pane: sticky header + scrolling body + sticky composer */
.wbdetail{display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;max-height:calc(100vh - 190px);}
.wbdhead{display:flex;gap:11px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);background:#fff;flex:0 0 auto;}
.wbdbody{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 16px 8px;}
.wbtl{display:flex;flex-direction:column;gap:13px;padding:14px 2px;}
.wbent{max-width:80%;align-self:flex-start;}
.wbent.mine{align-self:flex-end;text-align:right;}
.wblbl{font-size:9.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--mut);margin-bottom:3px;}
.wbbub{background:#f2f4f8;border:1px solid var(--line);border-radius:14px;padding:9px 12px;font-size:13.5px;line-height:1.5;text-align:left;color:var(--ink);white-space:normal;word-break:break-word;}
.wbent.mine .wbbub{background:#efeafc;border-color:#ddd0f6;}
.wbent.int .wbbub{background:var(--amberbg,#fdf3d7);border-color:#eadfbe;}
.wbent.int .wblbl{color:#9a7200;background:var(--amberbg,#fdf3d7);display:inline-block;padding:1px 8px;border-radius:99px;} /* v103.10 — no amber on white: the label wears the tint */
.wbmeta{font-size:11px;color:var(--mut);margin-top:3px;}
.wbsys{text-align:center;}
.wbsysline{display:inline-block;font-size:11.5px;color:var(--mut);border:1px dashed #c8d1df;border-radius:99px;padding:4px 12px;}
.wbcomposer{flex:0 0 auto;border-top:1px solid var(--line);background:#fff;padding:10px 14px 12px;}
.wbcomposer .seg{margin-top:0;}
.wbhint{font-size:11.5px;color:var(--mut);line-height:1.4;min-width:0;}
/* rail */
.wbrail{display:flex;flex-direction:column;gap:11px;min-width:0;max-height:calc(100vh - 190px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:8px;}
/* v105.15 review — the Owner strip (14 + 45 + 14 = ~74 px) now sits between
   .ghead and .pad.wbwrap, and the three panes above were sized without it: on
   the desktop console they overran .view by ~30 px, so the detail composer sat
   below the fold behind a second scrollbar. .view.hasownerseg is the Tickets
   view with the strip; the panes give the strip its height back. Phones
   (≤ 760 px) are untouched — there the panes stack and the queue has no cap. */
@media (min-width:761px){
 .view.hasownerseg .wbqueue,.view.hasownerseg .wbdetail,.view.hasownerseg .wbrail{max-height:calc(100vh - 264px);}
}
.wbseecard .wbsee{background:linear-gradient(160deg,#1b2438,#0f1420);border-radius:14px;padding:12px 13px;color:#e8edf5;}
/* responsive: 761–1150px queue+detail, rail becomes a drawer; <=760px card list first */
.wbrailbtn{display:none;}
.wbback{display:none;}
@media (max-width:1150px){
 body.adminview .pad.wbwrap{grid-template-columns:340px minmax(0,1fr);}
 .wbrail{display:none;}
 .wbrailbtn{display:inline-flex;}
 .wbwrap.railopen .wbrail{display:flex;position:fixed;top:0;right:0;bottom:0;width:302px;max-height:none;background:var(--bg);z-index:60;padding:16px 14px;box-shadow:-14px 0 44px rgba(0,0,0,.28);}
}
@media (max-width:760px){
 body.adminview .pad.wbwrap,.pad.wbwrap{display:grid;grid-template-columns:1fr;}
 .wbqueue{max-height:none;overflow:visible;}
 .wbdetail{display:none;}
 .wbwrap.hassel .wbqueue{display:none;}
 .wbwrap.hassel .wbdetail{display:flex;position:fixed;top:0;left:0;right:0;bottom:0;z-index:55;max-height:none;border-radius:0;}
 .wbback{display:inline-flex;}
 .wbcomposer{padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));}
}
/* dark mode (owner-only surface, so every workbench element gets an override) */
body.darkmode.adminview .wbstat{background:#171e2c;border-color:rgba(255,255,255,.09);}
body.darkmode.adminview .wbstat b{color:#e8edf5;}
body.darkmode.adminview .wbstat span{color:#94a2b8;}
body.darkmode.adminview .wbstat.hot b{color:#c3aaf5;}
body.darkmode.adminview .wbcard{background:#171e2c;border-color:rgba(255,255,255,.09);}
body.darkmode.adminview .wbcard:hover{background:#1c2434;}
body.darkmode.adminview .wbcard.sel{border-color:#6d3bd8;box-shadow:0 0 0 1px #6d3bd8;}
body.darkmode.adminview .wbtitle{color:#e8edf5;}
body.darkmode.adminview .wbid,body.darkmode.adminview .wbago,body.darkmode.adminview .wbsub,body.darkmode.adminview .wblbl,body.darkmode.adminview .wbmeta,body.darkmode.adminview .wbhint{color:#94a2b8;}
body.darkmode.adminview .wbdetail{background:#171e2c;border-color:rgba(255,255,255,.09);}
body.darkmode.adminview .wbdhead,body.darkmode.adminview .wbcomposer{background:#171e2c;border-color:rgba(255,255,255,.09);}
body.darkmode.adminview .wbbub{background:#1c2434;border-color:rgba(255,255,255,.09);color:#e8edf5;}
body.darkmode.adminview .wbent.mine .wbbub{background:rgba(109,59,216,.24);border-color:rgba(109,59,216,.4);}
body.darkmode.adminview .wbent.int .wbbub{background:rgba(247,183,28,.12);border-color:rgba(247,183,28,.28);}
body.darkmode.adminview .wbent.int .wblbl{color:#e6c26a;}
body.darkmode.adminview .wbsysline{color:#94a2b8;border-color:rgba(255,255,255,.18);}
body.darkmode.adminview .wbwrap.railopen .wbrail{background:#0f1420;}

/* ===== v99 — stop-conflict classification (admin routes only) =====
   Red here is true urgency: nothing on this route can be saved until Daisy
   classifies each duplicate stop number. */
.cfcard{border-color:#f3cdc8!important;background:linear-gradient(180deg,#fff6f5,#fff)!important;}
.cfcard .hh{color:var(--red);}
.cfitem{border:1px solid #f3cdc8;background:var(--redbg);border-radius:14px;padding:10px 12px;margin:8px 0;}
.cfhd{font-weight:800;font-size:13.5px;color:var(--red);margin-bottom:2px;letter-spacing:.01em;}
.cfacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px;}
.cfblock{font-size:12px;font-weight:700;color:var(--red);margin:-2px 0 8px;text-align:right;}
.cfnote{padding:10px 13px;border-radius:12px;background:var(--redbg);color:var(--red);margin-bottom:10px;font-weight:700;font-size:12.5px;}
/* owner dark mode lives at the same breakpoint as the rest of the dark theme */
@media (min-width:1280px){
 body.darkmode.adminview .cfcard{background:#171e2c!important;border-color:rgba(232,72,63,.42)!important;}
 body.darkmode.adminview .cfcard .hh{color:#f5928b;}
 body.darkmode.adminview .cfitem{background:rgba(232,72,63,.14);border-color:rgba(232,72,63,.36);}
 body.darkmode.adminview .cfitem .rname{color:#e8edf5;}
 body.darkmode.adminview .cfitem .rsub{color:#94a2b8;}
 body.darkmode.adminview .cfhd{color:#f5928b;}
 body.darkmode.adminview .cfblock{color:#f5928b;}
 body.darkmode.adminview .cfnote{background:rgba(232,72,63,.16);color:#f5928b;}
}

/* v100.11.3 — the article view breathes with the window instead of pinning a
   720px column against the rail and leaving the right half of a wide screen
   empty. The pair (rail + article) centers as a unit; the article grows to a
   readable ceiling; below ~1240px the ceiling releases and the article takes
   whatever is left. */
.kbartwrap{display:grid;grid-template-columns:250px minmax(0,880px);gap:26px;justify-content:center;padding:22px 34px 40px;}
.kbartrail{position:sticky;top:14px;align-self:start;}
@media (max-width:1500px){
 .kbartwrap{grid-template-columns:250px minmax(0,1fr);justify-content:start;}
}
@media (max-width:1240px){
 .kbartwrap{grid-template-columns:minmax(0,1fr);padding:18px 22px 34px;}
 .kbartrail{position:static;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
 .kbartrail>div{margin-bottom:0!important;}
}
/* v100.11.3 — the article top bar stays pinned while reading; the back control
   is styled as an unmistakable button, not gray text that vanishes on scroll. */
.kbarttop{position:sticky;top:0;z-index:6;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.kbartback{border:0;cursor:pointer;font-family:inherit;display:flex;align-items:center;gap:8px;background:var(--navy);color:#fff;font-weight:800;font-size:13px;padding:9px 15px 9px 11px;border-radius:11px;transition:.13s;flex:0 0 auto;}
.kbartback:hover{background:#16304f;box-shadow:0 4px 14px rgba(14,32,56,.25);}
.kbartback .kbchev{color:var(--yellow);font-size:15px;line-height:1;}

/* v103.2 — collapsible admin rail (icon-only). body.sbmin is applied only on
   the desktop console (≥1100px); widths under 1280px auto-collapse. Tooltips
   ride the title= attribute; badges pin to the icon's corner. */
@media (min-width:1100px){
 body.adminview.sbmin.embed .tabbar{width:82px;padding:18px 10px;}
 body.adminview.sbmin .tab{justify-content:center;gap:0;padding:10px 6px;position:relative;}
 body.adminview.sbmin .tab .tlbl{display:none;}
 body.adminview.sbmin .tbdg{position:absolute;top:3px;right:5px;margin:0;}
 body.adminview.sbmin .sbbrand{justify-content:center;padding:6px 0 14px;}
 body.adminview.sbmin .sbbrand>div:last-child{display:none;}
 body.adminview.sbmin .view{left:98px;}
 body.adminview.sbmin .sbtog .tic2 svg{transform:rotate(180deg);}
 body.adminview .sbtog{color:#8fa2bd;}
}

/* =====================================================================
 * v103.13 — HELP CENTER DESIGN BLOCKS (flip card, image + text, image pins)
 * Reader + preview share these classes; the composer reuses the tone/side
 * pills and the pin stage. Everything here is container-relative (flex-wrap
 * and calc() against the figure, not the viewport) because the reader also
 * renders inside the 392px phone frame on a wide desktop window — a
 * viewport-keyed @media never fires there. That exact trap is what put
 * "Assignments" outside its pill in v100.6.1.
 * =================================================================== */

/* ---- flip card ----------------------------------------------------
 * The faces are grid-STACKED, not absolutely positioned. Both stay in
 * flow in the same 1/1 cell, so the card is always as tall as its taller
 * face and a long answer can never be clipped away invisibly (v103.13
 * defect 3). The rotation is decoration on top of that; backface plus an
 * opacity swap at the halfway point means exactly one face is painted
 * even where preserve-3d is unreliable. */
.kbflip{display:block;width:100%;text-align:left;font-family:inherit;color:inherit;border:0;border-radius:16px;background:transparent;padding:0;margin:12px 0;cursor:pointer;-webkit-perspective:1200px;perspective:1200px;}
.kbflip-in{display:grid;transition:transform .48s cubic-bezier(.2,.8,.2,1);-webkit-transform-style:preserve-3d;transform-style:preserve-3d;}
.kbflip[aria-expanded="true"] .kbflip-in{-webkit-transform:rotateY(180deg);transform:rotateY(180deg);}
.kbflip-face{grid-area:1 / 1;display:block;min-width:0;padding:16px 18px 14px;border-radius:16px;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:opacity .01s linear .24s;}
.kbflip-face.bk{-webkit-transform:rotateY(180deg);transform:rotateY(180deg);opacity:0;}
.kbflip[aria-expanded="true"] .kbflip-face.ft{opacity:0;}
.kbflip[aria-expanded="true"] .kbflip-face.bk{opacity:1;}
.kbflip-t{display:block;font-size:15.5px;font-weight:800;line-height:1.3;letter-spacing:-.01em;}
.kbflip-b{display:block;font-size:13.5px;line-height:1.6;margin-top:6px;white-space:normal;word-break:break-word;}
.kbflip-cue{display:block;margin-top:11px;font-size:10.5px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;opacity:.7;}
.kbflip.tnavy .kbflip-face{background:#0e2038;color:#fff;}
.kbflip.tnavy .kbflip-face.bk{background:#16304f;}
.kbflip.tgold .kbflip-face{background:#f7b71c;color:#181206;}
.kbflip.tgold .kbflip-face.bk{background:#ffca4d;}
.kbflip.tlav .kbflip-face{background:#6d3bd8;color:#fff;}
.kbflip.tlav .kbflip-face.bk{background:#5a2fc0;}
.kbflip:hover{box-shadow:0 10px 26px rgba(14,32,56,.18);}
@media (prefers-reduced-motion:reduce){.kbflip-in{transition:none;}.kbflip-face{transition:none;}}

/* ---- image + text -------------------------------------------------- */
.kbsplit{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:14px 0;border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px;}
.kbsplit>.kbsplit-img,.kbsplit>.kbsplit-txt{flex:1 1 300px;min-width:0;}
.kbsplit>.kbsplit-img img{display:block;width:100%;border-radius:11px;border:1px solid var(--line);}
.kbsplit.right>.kbsplit-img{order:2;}
.kbsplit-t{font-size:15.5px;font-weight:800;color:var(--ink);line-height:1.3;margin-bottom:5px;}
.kbsplit-b{font-size:13.5px;line-height:1.6;color:var(--mut);white-space:normal;word-break:break-word;}
@media (max-width:720px){
 .kbsplit>.kbsplit-img,.kbsplit>.kbsplit-txt{flex:1 1 100%;}
 .kbsplit.right>.kbsplit-img{order:0;}
}

/* ---- image pins (hotspot) ------------------------------------------
 * Each pin owns a full-stage, pointer-transparent layer so its callout can
 * be sized against the FIGURE (calc on 100%) instead of a zero-width
 * anchor. .fx flips the callout to the other side of a pin past the
 * midpoint and .fy flips it above a low pin, so nothing is pushed off the
 * edge at 360px (v103.13 defect 4). */
.kbhot{margin:14px 0;border:1px solid var(--line);border-radius:16px;background:#f8fafc;}
.kbhot-stage{position:relative;}
.kbhot-stage>img{display:block;width:100%;border-radius:15px 15px 0 0;}
.kbhot-cap{padding:9px 12px;font-size:12px;color:var(--mut);border-top:1px solid var(--line);line-height:1.5;}
.kbhot-cap b{color:var(--ink);}
.kbhot-hint{padding:8px 12px;font-size:11.5px;color:var(--mut);border-top:1px solid var(--line);}
.kbpinwrap{position:absolute;left:0;top:0;right:0;bottom:0;pointer-events:none;}
.kbpin{position:absolute;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);pointer-events:auto;width:26px;height:26px;padding:0;border-radius:50%;border:2px solid #fff;background:#f7b71c;color:#181206;font-family:inherit;font-size:12.5px;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 9px rgba(9,23,43,.35);}
.kbpin:hover{background:#ffca4d;}
.kbcall{position:absolute;z-index:4;width:212px;background:#0e2038;color:#fff;border-radius:12px;padding:10px 12px;box-shadow:0 14px 32px rgba(9,23,43,.36);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .14s ease;left:calc(var(--px) + 20px);top:calc(var(--py) - 16px);max-width:calc(100% - var(--px) - 30px);}
.kbpinwrap.fx>.kbcall{left:auto;right:calc(100% - var(--px) + 20px);max-width:calc(var(--px) - 30px);}
.kbpinwrap.fy>.kbcall{top:auto;bottom:calc(100% - var(--py) - 16px);}
.kbpinwrap:hover>.kbcall,.kbpinwrap:focus-within>.kbcall,.kbpinwrap.on>.kbcall,.kbpin:focus>.kbcall,.kbpin:focus+.kbcall{opacity:1;visibility:visible;pointer-events:auto;}
.kbcall-t{font-size:12.5px;font-weight:800;margin-bottom:3px;}
.kbcall-b{font-size:12.5px;line-height:1.5;color:#c9d6e6;white-space:normal;word-break:break-word;}

/* ---- composer: sticky add bar + design buttons ---------------------- */
.kbaddbar{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;gap:7px;align-items:center;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:14px;padding:9px 10px;margin:0 0 11px;box-shadow:0 6px 18px rgba(14,32,56,.08);}
.kbdesignbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:1 1 96px;border:1.5px solid var(--line);background:#fff;color:var(--ink);border-radius:11px;padding:9px 11px;font-family:inherit;font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap;transition:.12s;}
.kbdesignbtn:hover{border-color:#6d3bd8;background:#f4efff;color:#4d2aa0;}
.kbdesignbtn:active{transform:scale(.96);}
.kbaddsel{flex:1 1 136px;min-width:0;border:1.5px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);font-family:inherit;font-size:12.5px;font-weight:700;padding:9px 10px;cursor:pointer;}
.kbblkhead{display:flex;align-items:center;gap:9px;flex-wrap:wrap;row-gap:7px;margin-bottom:9px;}
.kbblksel{flex:1 1 132px;min-width:0;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);font-family:inherit;font-size:11.5px;font-weight:700;padding:7px 8px;cursor:pointer;}
.kbtone{border:1.5px solid var(--line);background:#fff;color:var(--mut);border-radius:99px;padding:6px 12px;font-family:inherit;font-size:11.5px;font-weight:800;cursor:pointer;white-space:nowrap;}
.kbtone.on{background:#0e2038;border-color:#0e2038;color:#fff;}
.kbpinrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:7px 0;border-top:1px dashed #dfe6ef;}
.kbpinno{flex:0 0 auto;width:24px;height:24px;border-radius:50%;background:#f7b71c;color:#181206;font-size:11.5px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.kbpinf{border:1px solid var(--line);border-radius:9px;background:#fff;padding:8px 10px;font-size:12.5px;font-family:inherit;color:var(--ink);min-width:0;}
.kbpinf.num{flex:0 0 68px;width:68px;}
/* the composer's pin stage — click to drop, drag a handle to move */
.kbhotedit{position:relative;border-radius:10px;border:1px solid var(--line);background:#fff;cursor:crosshair;overflow:hidden;-webkit-user-select:none;user-select:none;}
.kbhotedit>img{display:block;width:100%;max-height:340px;object-fit:contain;pointer-events:none;}
.kbpinh{position:absolute;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:26px;height:26px;padding:0;border-radius:50%;border:2px solid #fff;background:#6d3bd8;color:#fff;font-family:inherit;font-size:12px;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;cursor:grab;box-shadow:0 2px 9px rgba(9,23,43,.35);touch-action:none;}
.kbpinh:active{cursor:grabbing;}

/* ---- v105.8: the composer has to admit what is unfinished ------------
 * A media block whose image has not arrived keeps every word it was given
 * and is marked pending server-side instead of being wiped. Lavender is the
 * app's "needs attention" colour, so that is what marks it here, on the
 * block chip and on the placeholder the owner preview shows in place of the
 * missing picture. Nothing gold: this all sits on white. */
.kbneed{background:var(--amberbg);color:var(--amber);border-radius:7px;padding:4px 8px;font-size:10.5px;font-weight:800;letter-spacing:.02em;flex:0 0 auto;}
.kbrepnote{font-size:11px;line-height:1.5;color:var(--mut);margin:6px 0 0;white-space:normal;}
.kbrepnote b{color:var(--amber);font-weight:800;}
/* the pin label and explanation are the two tightest fields in the composer
   and the only ones an owner can overrun without seeing it happen */
.kbpinfw{display:flex;flex-direction:column;gap:2px;min-width:0;}
.kbcnt{font-size:10px;font-weight:700;color:#98a4b5;text-align:right;padding-right:2px;}
.kbcnt.near{color:var(--amber);font-weight:800;}
/* the block the backend refused to publish, so nobody has to count cards */
.kbblk{transition:box-shadow .18s,border-color .18s;}
.kbblk.kbflash{border-color:var(--amber)!important;box-shadow:0 0 0 3px var(--amberbg);}

/* dark console: these blocks live on the owner's light surface, but the
   preview and the article reader both ride the admin view. */
@media (min-width:1280px){
 body.darkmode.adminview .kbsplit{background:var(--dmcard2);border-color:var(--dmline);}
 body.darkmode.adminview .kbsplit-t{color:var(--dmtext);}
 body.darkmode.adminview .kbsplit-b,body.darkmode.adminview .kbhot-cap,body.darkmode.adminview .kbhot-hint{color:var(--dmmut);}
 body.darkmode.adminview .kbhot{background:var(--dmcard2);border-color:var(--dmline);}
 body.darkmode.adminview .kbhot-cap b{color:var(--dmtext);}
 /* v105.21 — the reader in dark mode: the ON THIS PAGE rail, the Was This Helpful card, the callouts and the FAQ cards were white boxes with light text; the breadcrumb title was ink on the light bar. */
 body.darkmode.adminview .kbrailcard,body.darkmode.adminview .kbcallout{background:var(--dmcard)!important;border-color:var(--dmline)!important;color:var(--dmtext);}
 body.darkmode.adminview .kbrailcard div{color:var(--dmtext);}
 body.darkmode.adminview .kbrailcard{--kbhov:var(--dmcard2);}
 body.darkmode.adminview .kbkey{background:var(--dmcard2)!important;border-color:rgba(255,255,255,.22)!important;color:var(--dmtext)!important;}
 body.darkmode.adminview .kbrailcard div[onclick]>span:first-child{background:#0e2038!important;color:#fff!important;}
 body.darkmode.adminview .kbrailcard .btn[style*="var(--navy)"]{background:#6d3bd8!important;}
 body.darkmode.adminview .kbrailcard .btn.ghost{background:var(--dmcard2);border-color:rgba(255,255,255,.13);color:var(--dmtext);}
 body.darkmode.adminview .kbfaq{background:var(--dmcard2);border-color:var(--dmline)!important;}
 body.darkmode.adminview .kbfaq>div:first-child{color:var(--dmtext);}
 body.darkmode.adminview .kbfaq>div:last-child{color:var(--dmmut)!important;}
 body.darkmode.adminview .kbarttop{background:rgba(23,30,44,.96);border-color:var(--dmline);}
 body.darkmode.adminview .kbarttop b{color:var(--dmtext)!important;}
 body.darkmode.adminview .kbaddbar{background:rgba(23,30,44,.97);border-color:var(--dmline);}
 body.darkmode.adminview .kbdesignbtn,body.darkmode.adminview .kbaddsel,body.darkmode.adminview .kbblksel,body.darkmode.adminview .kbtone,body.darkmode.adminview .kbpinf,body.darkmode.adminview .kbhotedit{background:var(--dmcard2);border-color:rgba(255,255,255,.13);color:var(--dmtext);}
 body.darkmode.adminview .kbtone.on{background:#0e2038;border-color:#0e2038;color:#fff;}
 body.darkmode.adminview .kbrepnote,body.darkmode.adminview .kbcnt{color:var(--dmmut);}
 body.darkmode.adminview .kbneed{background:rgba(109,59,216,.22);color:#cabdfa;}
 body.darkmode.adminview .kbrepnote b,body.darkmode.adminview .kbcnt.near{color:#cabdfa;}
}
/* v103.13 — the Owner composer is reached from a .deskaction control, so it
   normally only opens at >=1100px. If it is ever reached narrower than that,
   the two-column split stacks instead of pushing the editor to zero width. */
@media (max-width:820px){
 .kbownerwrap{grid-template-columns:minmax(0,1fr)!important;}
 .kbownerwrap #kblib{max-height:40vh;}
}
/* v105.15 owner seg — all five Owner sub-views in ONE strip; on a 360 px phone
   the strip scrolls sideways inside itself instead of wrapping or squeezing the
   labels (never below 13px, never truncated). */
.seg.ownerseg{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;width:max-content;max-width:100%;box-sizing:border-box;margin:0;}
.seg.ownerseg::-webkit-scrollbar{display:none;}
.seg.ownerseg button{flex:0 0 auto;overflow:visible;text-overflow:clip;font-size:13px;padding:11px 14px;}
body.adminview .seg.ownerseg{max-width:100%;}
/* v105.15 review — (a) the strip wrapper is `.pad.ownersegwrap`: it borrows
   .pad's side padding at every width (20 px phones / 28 px ≥ 900 px and the
   desktop console) so the strip lines up with the ticket panes, but it is a
   plain block (never the desktop .pad grid) with no bottom clearance of its
   own, and the strip keeps its 14 px rhythm above and below even where
   `body.adminview .pad>*` zeroes margins. (b) .ownersegbox is the fade's
   anchor: on a phone the five labels never fit, so a right-edge fade in the
   pill's own colour says "more this way"; ownerSegScroll drops it (.atend)
   once the strip is scrolled to its end. Label text stays 13 px. */
.pad.ownersegwrap{display:block;padding-bottom:0;}
body.adminview .pad.ownersegwrap{display:block;padding-bottom:0;}
.ownersegbox{position:relative;margin:14px 0;}
body.adminview .pad.ownersegwrap>.ownersegbox{margin-top:14px;}
.ownersegbox::after{content:"";position:absolute;top:0;right:0;bottom:0;width:44px;border-radius:0 14px 14px 0;pointer-events:none;opacity:0;transition:opacity .15s;background:linear-gradient(90deg,rgba(233,236,242,0),#e9ecf2 62%);}
@media (max-width:620px){
 .ownersegbox::after{opacity:1;}
 .ownersegbox.atend::after{opacity:0;}
 body.darkmode.adminview .ownersegbox::after{background:linear-gradient(90deg,rgba(13,19,32,0),#0d1320 62%);}
}
/* v105.15 gate chip — the gate code drivers can read from arm's length
   (Isaac #5). Navy on white, 2px navy border, big letter-spaced digits, one-tap
   Copy. Works on the dark driver cards AND the white admin builder cards. */
.gatechip{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;background:#fff;color:var(--navy);border:2px solid var(--navy);border-radius:16px;padding:10px 14px;margin:0 0 12px;max-width:100%;box-sizing:border-box;text-align:left;}
.gatechip .gl{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--navy);flex:0 0 auto;}
.gatechip .gc{font-size:30px;line-height:1.1;font-weight:900;letter-spacing:.14em;font-variant-numeric:tabular-nums;color:var(--navy);flex:1 1 auto;min-width:0;white-space:nowrap;}
.gatechip .gcp{flex:0 0 auto;margin-left:auto;border:2px solid var(--navy);background:var(--navy);color:#fff;border-radius:12px;font-weight:800;font-size:13px;padding:9px 14px;cursor:pointer;font-family:inherit;min-height:40px;}
.gatechip.big{padding:14px 16px;margin:0 0 14px;border-radius:20px;}
.gatechip.big .gc{font-size:40px;}
.gatechip.big .gcp{font-size:14px;padding:11px 18px;min-height:44px;}
.gatechip.sm{padding:6px 10px;margin:8px 0 0;border-radius:12px;gap:4px 10px;display:inline-flex;}
.gatechip.sm .gc{font-size:20px;}
.gatechip.sm .gcp{font-size:12px;padding:6px 10px;min-height:32px;}
/* v105.15 review — a code never splits mid-digits. word-break:break-all broke
   "2211*" at 40 px inside the 242 px one-flow chip; now the code is nowrap and
   steps DOWN by length instead (gateChipHtml adds gl7 / gl12 / gl16): ≥ 7
   chars → 28 px (big) / 24 px (card) / 17 px (builder), ≥ 12 → 22 / 19 / 14.
   ≥ 16 chars (the field allows 24) is the last resort: 18 px and allowed to
   break, since nothing that long fits a phone card on one line. */
.gatechip.gl7 .gc{font-size:24px;}
.gatechip.gl12 .gc{font-size:19px;letter-spacing:.1em;}
.gatechip.big.gl7 .gc{font-size:28px;}
.gatechip.big.gl12 .gc{font-size:22px;letter-spacing:.1em;}
.gatechip.sm.gl7 .gc{font-size:17px;}
.gatechip.sm.gl12 .gc{font-size:14px;letter-spacing:.1em;}
.gatechip.gl16 .gc,.gatechip.big.gl16 .gc{font-size:18px;letter-spacing:.08em;white-space:normal;overflow-wrap:anywhere;}
.gatechip.sm.gl16 .gc{font-size:13px;letter-spacing:.06em;white-space:normal;overflow-wrap:anywhere;}
.dstop .gatechip{margin:0 auto 14px;justify-content:center;}