/* ===== avynt brand tokens (brand kit, October 2026) ===== */
:root{
  --bg:#F6F8FC; --card:#FFFFFF; --hover:#F3F6FF;
  --ink:#020F23; --ink2:#1B2538; --muted:#5B6577; --line:#E4E8F0;
  --indigo:#061233; --indigo2:#0B1F55; --pale:#EAF0FF; --hd:#061233;
  --sidebar:#FFFFFF; --sidebar-line:#E4E8F0;
  --accent:#0048FD; --accent2:#0036C2; --accent-ink:#FFFFFF;
  --avail:#1E8C63;  --availbg:#E1F1EA;
  --assign:#0036C2; --assignbg:#EAF0FF;
  --road:#7A54B8;   --roadbg:#EDE7F8;
  --done:#128577;   --donebg:#DBF1EC;
  --mech:#B9741C;   --mechbg:#FBEEDB;
  --oos:#C43B2D;    --oosbg:#FBE6E2;
  --warn:#B3720F;   --warnbg:#FBF0DC;
  --off:#8A93A6;    --offbg:#EAEDF1;
  --glass:rgba(2,15,35,.04);
  --grad1:#0048FD; --grad2:#0036C2;
  --r:9px;
}
[data-theme="dark"]{
  --bg:#061233; --card:#0B1F55; --hover:#12296B;
  --ink:#F6F8FC; --ink2:#C9D3EA; --muted:#8A93A6; --line:rgba(255,255,255,.10);
  --indigo:#04102B; --indigo2:#0B1F55; --pale:#12296B; --hd:#B9CBFF;
  --sidebar:#04102B; --sidebar-line:rgba(255,255,255,.08);
  --accent:#6B93FF; --accent2:#4D7DFF; --accent-ink:#020F23;
  --glass:rgba(255,255,255,.05);
  --grad1:#0048FD; --grad2:#0036C2;
  --avail:#43CE96; --availbg:#0c2a1f;
  --assign:#8FB0FF; --assignbg:#0f2550;
  --road:#B99BE8;   --roadbg:#221a3a;
  --done:#43CEB0;   --donebg:#0c2a24;
  --mech:#E5A85A;   --mechbg:#2b2110;
  --oos:#F0817B;    --oosbg:#301715;
  --warn:#E8C877;   --warnbg:#282010;
  --off:#8A93A6;    --offbg:#0B1F55;
}
/* ===== AFP Aira premium dark polish (dark theme only) ===== */
[data-theme="dark"] body{background:radial-gradient(1200px 720px at 80% -10%,#0B1F55 0%,#061233 58%) fixed}
[data-theme="dark"] .sidebar{background:linear-gradient(180deg,#04102B 0%,#04102B 100%);border-right:1px solid var(--sidebar-line)}
[data-theme="dark"] .sbrand{border-bottom:1px solid var(--sidebar-line)}
[data-theme="dark"] .snav button{border-radius:11px}
[data-theme="dark"] .snav button:hover{background:var(--glass)}
[data-theme="dark"] .snav button.on{background:linear-gradient(90deg,var(--grad1),var(--grad2));color:#fff;box-shadow:0 8px 22px rgba(0,72,253,.35)}
[data-theme="dark"] .snav button.navitem:not(.on):hover{background:var(--glass);color:var(--ink)}
[data-theme="dark"] .snav .navgroup.hasactive,[data-theme="dark"] .snav .navgroup.hasactive .ic{color:var(--accent)}
[data-theme="dark"] .ssync{background:var(--glass);border:1px solid var(--line)}
[data-theme="dark"] .ssync:hover{background:var(--hover)}
[data-theme="dark"] .card{background:linear-gradient(180deg,var(--card),#0A1A45);border:1px solid var(--line);box-shadow:0 2px 14px rgba(0,0,0,.30)}
[data-theme="dark"] .iconbtn,[data-theme="dark"] .btn{background:var(--glass);border:1.5px solid var(--line)}
[data-theme="dark"] .iconbtn:hover,[data-theme="dark"] .btn:hover{background:var(--hover);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
[data-theme="dark"] .dot{box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 0 7px rgba(0,0,0,.45)}
[data-theme="dark"] .trow{border-radius:0}
[data-theme="dark"] .trow:hover{background:var(--glass)}
[data-theme="dark"] .wkswitch select{background:var(--glass)}
[data-theme="dark"] .topbar{background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:saturate(1.4) blur(12px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;height:100%}
body{background:var(--bg);color:var(--ink);
  font:400 13.5px/1.5 "Inter","Inter var",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-feature-settings:"tnum" 1;
  text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

.layout{display:flex;min-height:100vh}

/* sidebar */
.sidebar{width:230px;flex-shrink:0;background:var(--sidebar);color:var(--ink);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;border-right:1px solid var(--sidebar-line)}
.sbrand{padding:18px 16px 14px;border-bottom:1px solid var(--sidebar-line)}
.sbrand .mark{display:flex;align-items:center;gap:11px}
.sbrand .glyph{width:32px;height:32px;border-radius:9px;flex-shrink:0;
  background:repeating-linear-gradient(90deg,var(--accent2) 0 3px,transparent 3px 7px),var(--accent);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35)}
.sbrand b{font-size:14.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;line-height:1.1;color:var(--ink)}
.sbrand small{display:block;font-size:10px;letter-spacing:.16em;color:var(--muted);font-weight:700;text-transform:uppercase;margin-top:3px}
.sbprod{margin-top:14px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:700}
.sbprod .vtag{background:var(--pale);color:var(--hd);border-radius:5px;padding:2px 7px;font-size:10px;margin-left:6px}
.snav{flex:1;padding:10px 9px;display:flex;flex-direction:column;gap:2px;overflow:auto}
.snav button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:transparent;border:0;color:var(--ink2);
  font:700 12.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.02em;padding:10px 11px;border-radius:8px;cursor:pointer;min-height:36px;transition:background .12s,color .12s}
.snav button .ic{width:17px;text-align:center;font-size:14px;opacity:.7}
.snav button:hover{background:var(--hover);color:var(--ink)}
.snav button.on{background:var(--accent);color:#fff;font-weight:800}
.snav button.on .ic{opacity:1}
/* clean menu: tabs stay neutral; each is differentiated by a coloured icon dot */
.snav button.navitem:not(.on){color:var(--ink2);border-radius:8px}
.snav button.navitem:not(.on) .ic{opacity:1;color:var(--tabc,var(--muted))}
.snav button.navitem:not(.on):hover{background:color-mix(in srgb,var(--tabc,var(--accent)) 12%,transparent);color:var(--ink)}
.snav button.nav-board{--tabc:#4F80C4}
.snav button.nav-shifts{--tabc:#3FA986}
.snav button.nav-schedule{--tabc:#8E6FC8}
.snav button.nav-todos{--tabc:#D79433}
.snav button.nav-handover{--tabc:#4F90CC}
.snav button.nav-tasks{--tabc:#6BAE56}
.snav button.nav-mech{--tabc:#D07E3A}
.snav button.nav-timeoff{--tabc:#6E77C0}
.snav button.nav-points{--tabc:#C06A96}
.snav button.nav-notepad{--tabc:#C9A93A}
.snav button.nav-dispshifts{--tabc:#4A9CA8}
.snav button.nav-fleet{--tabc:#6E7B96}
.snav button.nav-roster{--tabc:#74A05E}
.snav button.nav-driverdays{--tabc:#8A6FC2}
.snav button.nav-timings{--tabc:#5688BB}
.snav button.nav-activity{--tabc:#C0603C}
/* activity log (admin accountability view) */
.al-count{align-self:center;margin-left:auto;flex-shrink:0;font:800 11px/1 "Inter",system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--accent2);background:color-mix(in srgb,var(--accent2) 16%,transparent);border:1px solid color-mix(in srgb,var(--accent2) 40%,transparent);padding:6px 11px;border-radius:999px}
.al-tools{display:flex;gap:10px;align-items:center;margin:0 0 14px}
.al-search{flex:1;min-width:0;border:1px solid var(--line);border-radius:9px;padding:10px 13px;font:600 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.al-search:focus{outline:none;border-color:var(--accent)}
.al-wrap{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
table.al-table{border-collapse:collapse;width:100%;font-size:13px}
.al-table thead th{position:sticky;top:0;background:color-mix(in srgb,var(--accent) 8%,var(--card));color:var(--ink2);text-align:left;font:800 10.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:11px 14px;border-bottom:1px solid var(--line);z-index:1}
.al-table td{padding:10px 14px;border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);vertical-align:top}
.al-table tbody tr:last-child td{border-bottom:none}
.al-table tbody tr:hover td{background:color-mix(in srgb,var(--accent) 4%,transparent)}
.al-when{white-space:nowrap;color:var(--muted);font-weight:600;font-variant-numeric:tabular-nums;width:120px}
.al-who{font-weight:800;color:var(--ink)}
.al-user{width:120px}
.al-act{width:130px}
.al-detail{color:var(--ink2)}
.al-badge{display:inline-block;font:800 10px/1 "Inter",system-ui,sans-serif;letter-spacing:.03em;text-transform:uppercase;padding:4px 8px;border-radius:6px;white-space:nowrap;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.al-badge.aldeletedroute{color:var(--oos);background:var(--oosbg)}
.al-badge.aluser{color:var(--road);background:var(--roadbg)}
.al-badge.alpointmatrix{color:var(--accent2);background:color-mix(in srgb,var(--accent2) 15%,transparent)}
.al-badge.alboardstatus{color:var(--warn);background:var(--warnbg)}
.al-del,.al-del-h{width:74px;text-align:center}
.al-del .rowx{opacity:.55} .al-del .rowx:hover{opacity:1;color:var(--oos)}
.snav button.subnav{padding-left:30px;font-size:11.5px;font-weight:700}
.snav button.subnav .ic{font-size:11px;opacity:.6}
.snav button.subnav::before{content:"└";position:absolute;left:14px;color:var(--muted);font-weight:400;opacity:.6}
.snav button.subnav{position:relative}
/* grouped nav */
.snav .navgroup{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:10.5px;font-weight:800;min-height:32px}
.snav .navgroup .grlabel{flex:1}
.snav .navgroup .grchev{font-size:9px;opacity:.6}
.snav .navgroup:hover{background:var(--hover);color:var(--ink2)}
.snav .navgroup.hasactive{color:var(--accent)}
.snav .navgroup.hasactive .ic{opacity:1;color:var(--accent)}
.snav .navkids{display:flex;flex-direction:column;gap:2px;margin:1px 0 3px}
.snav button.navitem.sub{padding-left:30px;font-size:12px;position:relative}
.snav button.navitem.sub::before{content:"";position:absolute;left:18px;top:0;bottom:0;width:1.5px;background:var(--sidebar-line)}
.snav button.navitem.sub.on::before{background:var(--accent)}
.sfoot{padding:13px;border-top:1px solid var(--sidebar-line);display:flex;flex-direction:column;gap:8px}
.sfoot .metaline{font-size:11px;color:var(--muted);letter-spacing:.03em}
.ssync{background:var(--hover);border:1px solid var(--line);color:var(--ink2);font:700 12px/1 "Inter",system-ui,sans-serif;padding:10px;border-radius:8px;cursor:pointer;min-height:38px}
.ssync:hover{background:var(--pale);color:var(--ink)}

/* content */
.content{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px;padding:8px 18px;min-height:52px}
[data-theme="dark"] .topbar{background:color-mix(in srgb,var(--bg) 90%,transparent)}
.hamb{display:none;background:var(--card);border:1px solid var(--line);border-radius:8px;color:var(--ink);font-size:17px;width:42px;height:42px;cursor:pointer}
.wkswitch{display:flex;align-items:center;gap:6px}
.wkswitch select{appearance:none;background:var(--card);border:1.5px solid var(--line);color:var(--ink);font:800 13px/1 "Inter",system-ui,sans-serif;
  padding:10px 30px 10px 13px;border-radius:8px;cursor:pointer;min-height:42px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'%3E%3Cpath d='M1 1l4.5 4.5L10 1' stroke='%236E7590' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.wknav{background:var(--card);border:1.5px solid var(--line);color:var(--ink2);width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:15px;font-weight:800}
.wknav:hover{background:var(--hover)}
.tspace{flex:1}
/* client selector (top bar, mid-right) */
.clientbox{display:flex;align-items:center;gap:8px;margin-right:6px}
.clientlabel{font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.clientdd{position:relative}
.clientbtn{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--line);border-radius:9px;
  color:var(--ink);font:800 12.5px/1 "Inter",system-ui,sans-serif;padding:9px 12px;cursor:pointer;max-width:230px}
.clientbtn:hover{border-color:var(--accent)}
.clientbtn #clientcur{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clientbtn .caret{color:var(--muted);font-size:10px;flex-shrink:0}
.clientdd.open .clientbtn{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.clientmenu{position:absolute;top:calc(100% + 6px);right:0;min-width:250px;background:var(--card);border:1px solid var(--line);
  border-radius:11px;box-shadow:0 12px 30px -8px rgba(20,30,50,.28);padding:6px;display:none;z-index:60}
.clientdd.open .clientmenu{display:block}
.clientlist{max-height:280px;overflow:auto}
.clientrow{display:flex;align-items:center;gap:4px;border-radius:8px}
.clientrow.sel{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.clientpick{flex:1;text-align:left;background:transparent;border:0;color:var(--ink);font:700 12.5px/1.3 "Inter",system-ui,sans-serif;
  padding:9px 10px;cursor:pointer;border-radius:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.clientpick:hover{background:var(--hover)}
.clientrow.sel .clientpick{color:var(--accent);font-weight:800}
.clientdel{background:transparent;border:0;color:var(--muted);font:800 11px/1 "Inter",system-ui,sans-serif;padding:6px 8px;cursor:pointer;border-radius:7px;flex-shrink:0}
.clientdel:hover{color:var(--oos);background:var(--oosbg)}
.clientadd{display:flex;gap:6px;padding:8px 6px 4px;margin-top:4px;border-top:1px solid var(--line)}
.clientadd input{flex:1;border:1.5px solid var(--line);border-radius:8px;padding:8px 10px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.clientadd input:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.clientaddbtn{background:var(--accent);border:0;color:#fff;font:800 15px/1 "Inter",system-ui,sans-serif;padding:0 13px;border-radius:8px;cursor:pointer}
@media(max-width:720px){.clientlabel{display:none} .clientbtn{max-width:150px}}
.clock{font-variant-numeric:tabular-nums;font-weight:800;font-size:12px;color:var(--ink);letter-spacing:.02em;display:flex;align-items:center;gap:7px;white-space:nowrap}
.clock .clk-z b{color:var(--accent);font-weight:800;margin-right:3px;font-size:10.5px;letter-spacing:.04em}
.clock .clk-sep{color:var(--muted);font-weight:600}
@media(max-width:860px){.clock{font-size:11px;gap:5px}.clock .clk-z b{font-size:9.5px}}
/* presence — who's online now (like a shared Google Sheet) */
.xf-presence{position:relative}
.xfp-btn{display:flex;align-items:center;gap:7px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:4px 10px 4px 8px;cursor:pointer;min-height:34px;color:var(--ink);font:inherit}
.xfp-btn:hover{border-color:color-mix(in srgb,var(--avail) 45%,var(--line))}
.xfp-dot{width:8px;height:8px;border-radius:50%;background:var(--avail);box-shadow:0 0 0 3px color-mix(in srgb,var(--avail) 22%,transparent);flex-shrink:0}
.xfp-avs{display:flex;align-items:center}
.xfp-av{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#fff;font:800 11px/1 "Inter",system-ui,sans-serif;border:2px solid var(--card);margin-left:-7px;flex-shrink:0}
.xfp-av:first-child{margin-left:0}
.xfp-more{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--hover);color:var(--ink2);font:800 10px/1 "Inter",system-ui,sans-serif;border:2px solid var(--card);margin-left:-7px}
.xfp-count{font-size:11.5px;font-weight:800;color:var(--ink2);white-space:nowrap}
.xfp-menu{display:none;position:absolute;top:calc(100% + 8px);right:0;min-width:210px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px rgba(10,20,40,.28);padding:8px;z-index:60}
.xf-presence.open .xfp-menu{display:block}
.xfp-hd{font:800 10px/1 "Inter",system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:6px 8px 8px}
.xfp-row{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:8px}
.xfp-row:hover{background:var(--hover)}
.xfp-row .xfp-av{margin-left:0;width:26px;height:26px;border:none}
.xfp-name{font-weight:700;font-size:13px;color:var(--ink);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xfp-role{font:800 9px/1 "Inter",system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent);padding:3px 6px;border-radius:5px}
@media(max-width:860px){ .xfp-count{display:none} }
.iconbtn{background:var(--card);border:1.5px solid var(--line);color:var(--ink);width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:15px;display:grid;place-items:center}
.iconbtn:hover{background:var(--hover)}
.savebtn{background:var(--indigo);border:0;color:#fff;font:800 11.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase;padding:10px 14px;border-radius:8px;cursor:pointer;min-height:36px}
.savebtn.dirty{background:var(--accent2);color:#4A3800}
.savebtn:active{transform:scale(.98)}

main{max-width:1280px;width:100%;margin:0 auto;padding:18px 20px 54px}
h1{font-size:20px;line-height:1.14;letter-spacing:-.02em;margin:0 0 3px;font-weight:800}
.lede{color:var(--ink2);margin:0 0 14px;font-size:12.5px;max-width:74ch}
.pagehd{display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:4px}
/* per-page: a light background wash + a defined, professional header card */
#view[data-view]{--pgc:#6E7B96;--pgbg:#EFF2F7}
#view[data-view="board"]     {--pgc:#3E7AC0;--pgbg:#EEF4FB}
/* keep the Dispatch Board on a neutral light-grey canvas (header accent stays blue) */
#view[data-view="board"]{background:#FCFCFD!important}
[data-theme="dark"] #view[data-view="board"]{background:var(--card)!important}
#view[data-view="shifts"]    {--pgc:#2FA98A;--pgbg:#ECF7F2}
#view[data-view="schedule"]  {--pgc:#7E5FCB;--pgbg:#F4EFFC}
#view[data-view="todos"]     {--pgc:#D98A22;--pgbg:#FCF4E8}
#view[data-view="handover"]  {--pgc:#4F90CC;--pgbg:#EDF4FC}
#view[data-view="tasks"]     {--pgc:#5FA843;--pgbg:#F0F8ED}
#view[data-view="mech"]      {--pgc:#D07E3A;--pgbg:#FCF2E9}
#view[data-view="timeoff"]   {--pgc:#5E67B8;--pgbg:#F0F1FB}
#view[data-view="points"]    {--pgc:#BC5F8E;--pgbg:#FBF0F6}
#view[data-view="notepad"]   {--pgc:#C29A1E;--pgbg:#FCF8EA}
#view[data-view="dispshifts"]{--pgc:#3F98A5;--pgbg:#EBF6F7}
#view[data-view="fleet"]     {--pgc:#6E7B96;--pgbg:#EFF2F7}
#view[data-view="roster"]    {--pgc:#649050;--pgbg:#F1F7EE}
#view[data-view="driverdays"]{--pgc:#8367C4;--pgbg:#F4EFFC}
#view[data-view="timings"]   {--pgc:#4A82BE;--pgbg:#EDF3FA}
/* fill the content area with a very subtle, professional wash (barely-there tint) */
#view[data-view]{background:color-mix(in srgb,var(--pgc) 4%,#FBFBFC);border:1px solid color-mix(in srgb,var(--pgc) 14%,var(--line));border-radius:14px;padding:16px 18px 22px;min-height:calc(100vh - 120px)}
/* defined header card sitting on the wash */
#view[data-view] .pagehd{background:var(--card);border:1px solid color-mix(in srgb,var(--pgc) 22%,var(--line));border-left:5px solid var(--pgc);border-radius:10px;padding:13px 18px;margin:0 0 16px;box-shadow:0 1px 3px rgba(20,30,50,.06)}
#view[data-view] .pagehd h1{margin:0;color:var(--ink)}
/* dark mode: darker wash + card header keeps its coloured accent */
[data-theme="dark"] #view[data-view]{background:color-mix(in srgb,var(--pgc) 8%,var(--card));border-color:color-mix(in srgb,var(--pgc) 24%,var(--line))}
[data-theme="dark"] #view[data-view] .pagehd{background:color-mix(in srgb,var(--pgc) 14%,var(--card));border-color:color-mix(in srgb,var(--pgc) 30%,var(--line));border-left-color:var(--pgc)}
.pagehd .grow{flex:1;min-width:220px}
.pagehd .actions{display:flex;gap:8px;flex-wrap:wrap;padding-top:2px}
.btn{border:1.5px solid var(--line);background:var(--card);color:var(--ink);font:800 11.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.03em;
  padding:9px 13px;border-radius:8px;cursor:pointer;min-height:36px;display:inline-flex;align-items:center;gap:6px}
.btn:hover{background:var(--hover)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{filter:brightness(1.08)}

.eyebrow{font-weight:800;font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);
  margin:20px 0 10px;padding-bottom:6px;border-bottom:2px solid var(--line);display:flex;align-items:center;gap:8px}
.eyebrow .count{background:var(--pale);color:var(--hd);border-radius:20px;padding:2px 9px;font-size:10.5px;letter-spacing:.04em}
[data-theme="dark"] .eyebrow .count{color:var(--ink)}
.eyebrow .count.warn{background:var(--warnbg);color:var(--warn)}
.eyebrow .count.ok{background:var(--availbg);color:var(--avail)}
.suffix{font-variant-numeric:tabular-nums;font-weight:800;color:var(--assign);background:var(--assignbg);border-radius:5px;padding:1px 6px;font-size:11px}

/* metrics */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:6px}
.metrics.metrics6{grid-template-columns:repeat(6,1fr)}
@media(max-width:900px){.metrics.metrics6{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.metrics{grid-template-columns:repeat(2,1fr)}.metrics.metrics6{grid-template-columns:repeat(2,1fr)}}
.daysel{display:flex;gap:5px;flex-wrap:wrap;margin:0 0 12px}
.daysel button{flex:1 1 auto;min-width:66px;border:1.5px solid var(--line);background:var(--card);color:var(--ink2);border-radius:8px;
  padding:6px 5px;cursor:pointer;font:800 11.5px/1.1 "Inter",system-ui,sans-serif;display:flex;flex-direction:column;align-items:center;gap:2px}
.daysel button small{font-weight:700;font-size:9.5px;color:var(--muted)}
.daysel button.istoday{border-color:color-mix(in srgb,var(--accent) 50%,transparent)}
.daysel button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.daysel button.on small{color:rgba(255,255,255,.8)}
.daysel button:not(.on):hover{background:var(--hover)}
.metric{background:var(--card);border:1px solid color-mix(in srgb,var(--pgc,var(--accent)) 22%,var(--line));border-radius:10px;padding:11px 13px;position:relative;overflow:hidden;box-shadow:0 1px 3px rgba(20,30,50,.06)}
.metric::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--mc,var(--line))}
.metric .mnum{font-size:23px;font-weight:800;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--mc,var(--ink))}
.metric .mlab{font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px}
.metric.avail{--mc:var(--avail)} .metric.assign{--mc:var(--assign)} .metric.oos{--mc:var(--oos)}
.metric.susp{--mc:var(--mech)}
.metric.term{--mc:#B4451E} .metric.fleet{--mc:var(--indigo2)}

.card{background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden}
/* Distinct tints so the three dashboard cards are easy to tell apart */
.card-board{background:color-mix(in srgb,#3E7AC0 6%,var(--card));border-color:color-mix(in srgb,#3E7AC0 42%,var(--line))}
.card-board .cardhd{background:#3E7AC0;color:#fff;border-bottom:none}
.card-board .cardhd .sub{color:rgba(255,255,255,.85)}
.card-todo{background:color-mix(in srgb,#B98A4C 7%,var(--card));border-color:color-mix(in srgb,#B98A4C 40%,var(--line))}
.card-todo .cardhd{background:#B98A4C;color:#fff;border-bottom:none}
.card-todo .cardhd .sub{color:rgba(255,255,255,.85)}
.card-tours{background:color-mix(in srgb,#2FA98A 7%,var(--card));border-color:color-mix(in srgb,#2FA98A 44%,var(--line))}
.card-tours .cardhd{background:#2FA98A;color:#fff;border-bottom:none}
.card-tours .cardhd .sub{color:rgba(255,255,255,.85)}

.card-backup{background:color-mix(in srgb,#158A9B 7%,var(--card));border-color:color-mix(in srgb,#158A9B 40%,var(--line))}
.card-backup .cardhd{background:#158A9B;color:#fff;border-bottom:none}
.card-backup .cardhd .sub{color:rgba(255,255,255,.85)}
.card-backup .cardhd .minibtn{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.35)}
.bkchips{display:flex;flex-wrap:wrap;gap:6px;padding:11px 12px}
.bkchip{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink);background:var(--pale);border:1px solid var(--line);border-radius:8px;padding:4px 10px}
.bkchip-dot{width:8px;height:8px;border-radius:50%;background:var(--avail);flex-shrink:0}
.bkchip.mech .bkchip-dot{background:var(--mech)}
.bkchip.oos .bkchip-dot{background:var(--oos)}
.bkchip.road .bkchip-dot,.bkchip.assign .bkchip-dot{background:var(--assign)}
.card-tasks{background:color-mix(in srgb,#7E5FCB 7%,var(--card));border-color:color-mix(in srgb,#7E5FCB 44%,var(--line))}
.card-tasks .cardhd{background:#7E5FCB;color:#fff;border-bottom:none}
.card-tasks .cardhd .sub{color:rgba(255,255,255,.85)}
/* header action buttons (ALL TO-DOS / ALL TASKS) on colored bands */
.card-board .cardhd .minibtn,.card-todo .cardhd .minibtn,.card-tours .cardhd .minibtn,.card-tasks .cardhd .minibtn,
.card-board .cardhd button,.card-todo .cardhd button,.card-tours .cardhd button,.card-tasks .cardhd button{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.35)}
.cardhd{padding:10px 14px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;font-weight:800;font-size:12.5px}
/* ============================================================
   CLEAN LIGHT THEME — minimal color, single accent (brand blue).
   Scoped to light mode only; the dark premium look is untouched.
   ============================================================ */
[data-theme="light"]{ --bg:#F6F7F9; --card:#FFFFFF; --hover:#F1F3F6; --pale:#F1F4F8;
  --ink:#1F2733; --ink2:#556071; --muted:#8A93A1; --line:#E6E9EF;
  --sidebar:#FFFFFF; --sidebar-line:#EAEDF2; }
/* uniform neutral page surface + a single accent stripe on the page header (no per-view rainbow) */
[data-theme="light"] #view[data-view]{background:#FBFCFD;border:1px solid var(--line)}
[data-theme="light"] #view[data-view] .pagehd{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--accent)}
[data-theme="light"] .metric{border-color:var(--line)}
/* dashboard cards: clean neutral headers instead of solid colored bars */
[data-theme="light"] .card-board,[data-theme="light"] .card-todo,[data-theme="light"] .card-tours,[data-theme="light"] .card-backup,[data-theme="light"] .card-tasks{background:var(--card);border-color:var(--line)}
[data-theme="light"] .card-board .cardhd,[data-theme="light"] .card-todo .cardhd,[data-theme="light"] .card-tours .cardhd,[data-theme="light"] .card-backup .cardhd,[data-theme="light"] .card-tasks .cardhd{background:var(--card);color:var(--ink);border-bottom:1px solid var(--line)}
[data-theme="light"] .card-board .cardhd .sub,[data-theme="light"] .card-todo .cardhd .sub,[data-theme="light"] .card-tours .cardhd .sub,[data-theme="light"] .card-backup .cardhd .sub,[data-theme="light"] .card-tasks .cardhd .sub{color:var(--muted)}
/* blue accent bar on every card sub-header, matching the Dispatch Board page header */
[data-theme="light"] .cardhd{border-left:4px solid var(--accent);padding-left:10px}
[data-theme="light"] .card-board .cardhd .minibtn,[data-theme="light"] .card-todo .cardhd .minibtn,[data-theme="light"] .card-tours .cardhd .minibtn,[data-theme="light"] .card-tasks .cardhd .minibtn,[data-theme="light"] .card-backup .cardhd .minibtn,
[data-theme="light"] .card-board .cardhd button,[data-theme="light"] .card-todo .cardhd button,[data-theme="light"] .card-tours .cardhd button,[data-theme="light"] .card-tasks .cardhd button{background:var(--hover);color:var(--ink2);border-color:var(--line)}
/* status pills: near-neutral; keep a single alert colour only for out-of-service */
/* status pills — soft, light backgrounds with a readable saturated label per status */
[data-theme="light"] .pill.avail{color:#1F8A5B;background:#E7F6EE}
[data-theme="light"] .pill.assign{color:#B07C18;background:#FBF1DA}
[data-theme="light"] .pill.road{color:#2C6FB3;background:#E7F0FB}
[data-theme="light"] .pill.done{color:#2A8C7A;background:#E5F4F0}
[data-theme="light"] .pill.mech{color:#C2711C;background:#FBEBDC}
[data-theme="light"] .pill.oos{color:#C0392B;background:#FBE7E4}
[data-theme="light"] .pillbtn{border-color:var(--line)!important}
[data-theme="light"] .pillbtn.oos{border-color:#E7B7B2!important}
/* neutral tractor pill */
[data-theme="light"] .trow .unit{color:var(--ink2);background:var(--hover)}
[data-theme="light"] .trow .unit.none{color:var(--muted);background:var(--hover)}
/* sidebar: one muted tone for all items; accent only on the active one */
[data-theme="light"] .snav button.navitem:not(.on){--tabc:var(--muted)}
[data-theme="light"] .snav button.navitem:not(.on) .ic{color:var(--muted)}
[data-theme="light"] .snav button.navitem:not(.on):hover{background:var(--hover);color:var(--ink)}
[data-theme="light"] .snav .navgroup.hasactive,[data-theme="light"] .snav .navgroup.hasactive .ic{color:var(--accent)}
/* start-time badges: neutral for "not sent", single accent for "sent" (no loud red/green) */
[data-theme="light"] .up-sent{border-color:var(--line);background:var(--hover);color:var(--ink2)}
[data-theme="light"] .up-sent.on{border-color:color-mix(in srgb,var(--accent) 40%,transparent);background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent)}
[data-theme="light"] .ndsent{border-color:var(--line);background:var(--hover);color:var(--ink2)}
[data-theme="light"] .ndsent.on{border-color:color-mix(in srgb,var(--accent) 45%,transparent);background:var(--accent);color:#fff}
[data-theme="light"] .ndtour.sent{border-color:color-mix(in srgb,var(--accent) 35%,transparent);background:color-mix(in srgb,var(--accent) 7%,transparent)}
/* dispatch sheet: calmer rows — neutral section bands, subtle attention tint, no green wash */
[data-theme="light"] .stable tr.sgrp td{background:var(--hover);color:var(--ink2)}
[data-theme="light"] .stable tr.sgrp.eve td{background:var(--hover);color:var(--ink2)}
[data-theme="light"] .stable tr.sgrp.carry td{background:#F6EEDD;color:#8A6D3B}
[data-theme="light"] .stable tr.carryrow td{background:color-mix(in srgb,var(--warn) 5%,var(--card))}
[data-theme="light"] .stable tr.carryrow:hover td{background:color-mix(in srgb,var(--warn) 9%,var(--card))}
[data-theme="light"] .stable tr.sumrow.row-green td{background:var(--card)!important}
[data-theme="light"] .stable tr.sumrow.row-green td.su-exp{box-shadow:none}
[data-theme="light"] .stable tr.sumrow.row-red td{background:color-mix(in srgb,var(--oos) 6%,var(--card))!important}
[data-theme="light"] .stable tr.sumrow.row-warn td{background:color-mix(in srgb,var(--warn) 6%,var(--card))!important}
[data-theme="light"] .stable tr.sumrow.row-warn:hover td{background:color-mix(in srgb,var(--warn) 11%,var(--card))!important}
[data-theme="light"] .stable tr.sumrow.row-warn td.su-exp{box-shadow:inset 3px 0 0 color-mix(in srgb,var(--warn) 55%,transparent)}
[data-theme="light"] .stable tr.sumrow.row-warn td.su-driver::after{color:#8A6D3B}
/* neutral status tags / progress chip (blue → gray) */
[data-theme="light"] .sstag.pending{color:var(--ink2);background:var(--hover)}
[data-theme="light"] .sstag.done{color:var(--ink2);background:var(--hover)}
[data-theme="light"] .progchip.pending{background:var(--hover)}
[data-theme="light"] .progchip.pending b{color:var(--ink2)}
.cardhd .sub{margin-left:auto;font-weight:700;font-size:11px;color:var(--muted)}
.cardhd .minibtn{margin-left:8px;border:1px solid var(--line);background:var(--card);color:var(--accent);font:800 10px/1 "Inter",system-ui,sans-serif;padding:4px 8px;border-radius:6px;cursor:pointer;text-transform:uppercase;letter-spacing:.03em}
.cardhd .minibtn:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.cardhd .sub + .minibtn{margin-left:8px}
/* checklist card */
.ckwrap{padding:10px 12px;display:flex;flex-direction:column;gap:14px}
.ckblock{}
.ckhd{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.ckhd b{font-size:12px;font-weight:800}
.ckprog{font-size:10px;font-weight:800;color:var(--muted);background:var(--pale);padding:2px 7px;border-radius:10px}
.ckprog.full{color:var(--avail);background:var(--availbg)}
.ckbar{flex:1;height:6px;border-radius:5px;background:var(--pale);overflow:hidden}
.ckfill{height:100%;background:linear-gradient(90deg,var(--accent),var(--avail));transition:width .35s}
.cklist{display:flex;flex-direction:column;gap:3px}
.ckrow{display:flex;align-items:flex-start;gap:8px;padding:5px 6px;border-radius:7px;cursor:pointer;font-size:12.5px}
.ckrow:hover{background:var(--pale)}
.ckrow input{margin-top:1px;cursor:pointer;width:15px;height:15px;flex-shrink:0}
.ckrow.on span{text-decoration:line-through;color:var(--muted)}
/* dispatcher -> blocks card */
.daquick{display:flex;gap:6px;padding:10px 12px 6px}
.daquick input{flex:1;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:600 12.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.daquick .go{border:none;border-radius:8px;padding:0 12px;background:var(--accent);color:#fff;font-weight:800;font-size:15px;cursor:pointer}
.dalist{padding:4px 12px 12px;display:flex;flex-direction:column;gap:4px;max-height:340px;overflow:auto}
.darow{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid var(--line);border-radius:9px}
.darow:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.dablock{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.dabid{font:800 12px "JetBrains Mono",ui-monospace,monospace;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dadrv{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dadrv .none{opacity:.6;font-style:italic}
.dasel{flex-shrink:0;max-width:135px;border:1px solid var(--line);border-radius:7px;padding:5px 6px;font:700 11.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink);cursor:pointer}
.dasel.set{border-color:var(--accent);color:var(--accent)}
/* tasks card */
.tkquick{display:flex;gap:6px;padding:10px 12px 6px}
.tkquick input{flex:1;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:600 12.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.uplist{padding:6px 12px 12px;display:flex;flex-direction:column;gap:5px;max-height:360px;overflow:auto}
.uptour{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:9px}
.uptour:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.uptour.sent{background:color-mix(in srgb,var(--avail) 8%,transparent);border-color:color-mix(in srgb,var(--avail) 32%,var(--line))}
.up-l{display:flex;flex-direction:column;gap:1px;min-width:0}
.up-name{font-weight:800;font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up-meta{font-size:11px;color:var(--muted);font-weight:600}
.up-sent{flex-shrink:0;border:1px solid var(--oos);background:var(--oosbg);color:var(--oos);font:800 11px "Inter",system-ui,sans-serif;padding:5px 12px;border-radius:999px;cursor:pointer;white-space:nowrap}
.up-sent:hover{filter:brightness(.97)}
.up-sent.on{border-color:color-mix(in srgb,var(--avail) 45%,transparent);background:var(--availbg);color:var(--avail)}
.tdquick{display:flex;gap:6px;padding:10px 12px 6px}
.tdquick input{flex:1;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:600 12.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.tdquick .tdquick-sm{flex:0 0 90px}
.go{border:none;border-radius:8px;padding:0 14px;background:var(--accent);color:#fff;font-weight:800;font-size:15px;line-height:1;cursor:pointer;font-family:inherit;min-height:34px}
.go:hover{filter:brightness(1.06)}
.tdquick .go{border:none;border-radius:8px;padding:0 12px;background:var(--accent);color:#fff;font-weight:800;font-size:15px;cursor:pointer}
.tklist{padding:4px 12px 12px;display:flex;flex-direction:column;gap:4px;max-height:280px;overflow:auto}
.tklist.full{max-height:none;overflow:visible;padding:4px 0 12px}
.tkrow{display:flex;align-items:flex-start;gap:9px;padding:8px;border:1px solid var(--line);border-radius:9px}
.tkrow:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.tkcheck{border:1.5px solid var(--muted);background:var(--card);color:transparent;width:20px;height:20px;border-radius:50%;cursor:pointer;flex-shrink:0;font-size:12px;font-weight:900;line-height:1;transition:all .12s}
.tkcheck:hover{border-color:var(--avail);background:var(--avail);color:#fff}
.tkbody{min-width:0}
.tktitle{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.3}
.tkmeta{display:flex;gap:8px;margin-top:3px;font-size:10.5px;font-weight:700}
.tkwho{color:var(--accent)} .tkwho.none{color:var(--muted);font-weight:600;font-style:italic}
.tkdue{color:var(--oos)}
/* full task/checklist views */
.pagehint{color:var(--muted);font-size:13px;margin:-6px 0 16px}
.clitem{display:flex;gap:8px;align-items:center;margin-bottom:6px}
.clitem input.clitemtext{flex:1;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:600 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.clitem.add{margin-top:8px}
.clitem.add input{flex:1;border:1px dashed var(--line);border-radius:8px;padding:8px 10px;font:600 13px "Inter",system-ui,sans-serif;background:var(--pale);color:var(--ink)}
.shname{border:1px solid transparent;background:transparent;font:800 13px "Inter",system-ui,sans-serif;color:var(--ink);border-radius:6px;padding:4px 6px}
.shname:hover,.shname:focus{border-color:var(--line);background:var(--card)}
.addshift,.tkquick.full{display:flex;gap:8px;align-items:center;margin-top:8px}
.addshift input,.tkquick.full input,.tkquick.full select{border:1px solid var(--line);border-radius:8px;padding:9px 11px;font:600 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.addshift input,.tkquick.full input#full_task{flex:1}
.tklist.full .tkrow.full{flex-direction:row;align-items:flex-start;padding:10px}
.tkrow.full.done .tktitle-in{text-decoration:line-through;color:var(--muted)}
.tktitle-in{width:100%;border:1px solid transparent;background:transparent;font:700 13px "Inter",system-ui,sans-serif;color:var(--ink);border-radius:6px;padding:4px 6px}
.tktitle-in:hover,.tktitle-in:focus{border-color:var(--line);background:var(--card)}
.tkmeta-row{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.tkmeta-row select,.tkmeta-row input{border:1px solid var(--line);border-radius:7px;padding:5px 8px;font:600 11.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.tkmeta-row .tknote-in{flex:1;min-width:120px}
.tkcheck.on{border-color:var(--avail);background:var(--avail);color:#fff}
.todaywrap{display:grid;grid-template-columns:1.4fr .85fr;gap:16px;align-items:start}
@media(max-width:940px){.todaywrap{grid-template-columns:1fr}}

.trow{display:flex;align-items:center;gap:10px;padding:9px 12px;min-width:600px}
.boardscroll{overflow-x:auto}
.trow+.trow{border-top:1px solid var(--line)}
.trow .tstart{font-variant-numeric:tabular-nums;font-weight:800;font-size:12.5px;color:var(--ink2);width:48px;flex-shrink:0}
.trow .dname{flex:1 1 auto;min-width:165px;font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.trow .ucol{flex:0 0 110px;display:flex;justify-content:flex-start}
.dot{width:11px;height:11px;border-radius:50%;flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.trow .disp{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:120px}
.trow-right{flex-shrink:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;width:120px}
.trow .dispnone{color:var(--muted);opacity:.4;font-size:12px}
.trow .dispchip{font-weight:800;font-size:11px;color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 30%,transparent);padding:2px 9px;border-radius:999px;white-space:nowrap;flex-shrink:0;cursor:pointer;font-family:inherit}
.dispchip .dcur{white-space:nowrap}
.dispchip .dprior{margin-left:5px;font-size:9.5px;background:color-mix(in srgb,var(--accent) 22%,transparent);border-radius:999px;padding:1px 5px}
/* flag button + row tints */
.flagbtn{flex-shrink:0;border:none;background:transparent;cursor:pointer;line-height:0;padding:5px;border-radius:50%;order:-1;display:flex;align-items:center;justify-content:center}
.flagbtn:hover{background:rgba(0,0,0,.06)}
[data-theme="dark"] .flagbtn:hover{background:var(--glass)}
.fdot{width:11px;height:11px;border-radius:50%;display:block;flex-shrink:0}
.fdot.green{background:#2fbf71;box-shadow:0 0 9px 1px rgba(47,191,113,.55)}
.fdot.amber{background:#e0a34a;box-shadow:0 0 9px 1px rgba(224,163,74,.55)}
.fdot.red{background:#e5484d;box-shadow:0 0 9px 1px rgba(229,72,77,.6)}
.flagnote{flex-shrink:1;min-width:0;font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.flagnote-orange{color:var(--warn);background:var(--warnbg)}
.flagnote-red{color:var(--oos);background:var(--oosbg)}
.trow.flagrow-orange{background:color-mix(in srgb,var(--warn) 12%,transparent);box-shadow:inset 3px 0 0 var(--warn)}
.trow.flagrow-red{background:color-mix(in srgb,var(--oos) 13%,transparent);box-shadow:inset 3px 0 0 var(--oos)}
.trow.flagrow-red .dname{color:var(--oos)}
/* dispatcher handoff chain in popover */
.dispop-hd2{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:10px 4px 5px;padding-top:8px;border-top:1px solid var(--line)}
.dispop-chain{display:flex;flex-direction:column;gap:4px;margin:4px 0}
.dchain-row{display:flex;align-items:center;gap:6px;padding:5px 8px;border-radius:8px;background:var(--pale)}
.dchain-row.active{background:color-mix(in srgb,var(--avail) 14%,transparent);border:1px solid color-mix(in srgb,var(--avail) 30%,transparent)}
.dchain-name{flex:1;font-size:12px;font-weight:700;color:var(--ink);cursor:pointer}
.dchain-tag{font-size:9px;font-weight:800;text-transform:uppercase;color:var(--avail);margin-left:2px}
.dchain-tag.prior{color:var(--muted)}
.dchain-x{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;padding:0 3px}
.dchain-x:hover{color:var(--oos)}
.dispop-empty{font-size:11.5px;color:var(--muted);padding:6px 8px;font-style:italic}
/* flag popover */
.flagpop{min-width:220px}
.flagopts{display:flex;flex-direction:column;gap:5px;margin:6px 0}
.flagopt{text-align:left;border:1px solid var(--line);background:var(--card);border-radius:9px;padding:9px 11px;font:700 13px "Inter",system-ui,sans-serif;color:var(--ink);cursor:pointer}
.flagopt:hover{border-color:var(--accent)}
.flagopt.f-green.on{background:var(--availbg);border-color:color-mix(in srgb,var(--avail) 40%,transparent)}
.flagopt.f-orange.on{background:var(--warnbg);border-color:color-mix(in srgb,var(--warn) 45%,transparent)}
.flagopt.f-red.on{background:var(--oosbg);border-color:color-mix(in srgb,var(--oos) 45%,transparent)}
.flagnote-wrap{margin-top:8px;padding-top:8px;border-top:1px solid var(--line)}
.flagnote-wrap label{display:block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:5px}
.flagnote-wrap textarea{width:100%;box-sizing:border-box;min-height:56px;resize:vertical;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:600 12.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.flagnote-wrap #flagSave{margin-top:6px;width:100%;border:none;border-radius:8px;padding:8px;background:var(--accent);color:#fff;font-weight:800;font-size:12.5px;cursor:pointer}
.trow .dispchip:hover{background:color-mix(in srgb,var(--accent) 20%,transparent)}
.trow .dispchip.empty{color:var(--muted);background:transparent;border-style:dashed;border-color:var(--line);font-weight:700}
.trow .dispchip.empty:hover{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.trow .dispadd{font-size:10.5px}
.dispop{position:absolute;z-index:9999;min-width:190px;max-width:240px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 34px rgba(0,0,0,.18);padding:8px;font-family:"Inter",system-ui,sans-serif}
.dispop-hd{font-weight:800;font-size:12.5px;color:var(--ink);padding:2px 4px}
.dispop-sub{font-size:11px;color:var(--muted);padding:0 4px 6px;border-bottom:1px solid var(--line);margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dispop-list{display:flex;flex-direction:column;gap:2px;max-height:220px;overflow:auto}
.dispop-opt{text-align:left;border:none;background:transparent;color:var(--ink);font:700 12.5px "Inter",system-ui,sans-serif;padding:7px 9px;border-radius:8px;cursor:pointer}
.dispop-opt:hover{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.dispop-opt.on{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--accent)}
.dispop-add{display:flex;gap:5px;margin-top:7px;padding-top:7px;border-top:1px solid var(--line)}
.dispop-add input{flex:1;min-width:0;border:1px solid var(--line);border-radius:7px;padding:6px 8px;font:600 12px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.dispop-add button{border:none;border-radius:7px;padding:0 12px;background:var(--accent);color:#fff;font-weight:800;font-size:12px;cursor:pointer}
.trow .unit{font-variant-numeric:tabular-nums;font-weight:800;font-size:12px;color:var(--assign);background:var(--assignbg);border-radius:6px;padding:3px 8px;white-space:nowrap}
.trow .unit.none{background:transparent;color:var(--muted)}
.trow .unit.none{color:var(--muted);background:var(--hover);font-weight:600}
.pill{font-weight:800;font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:5px 9px;border-radius:6px;white-space:nowrap}
.pill.avail{color:var(--avail);background:var(--availbg)} .pill.assign{color:var(--assign);background:var(--assignbg)} .pill.road{color:var(--road);background:var(--roadbg)} .pill.done{color:var(--done);background:var(--donebg)} .pill.mech{color:var(--mech);background:var(--mechbg)} .pill.oos{color:var(--oos);background:var(--oosbg)}
.pillbtn{border:1.5px solid transparent;cursor:pointer;font:800 10px/1 "Inter",system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.pillbtn.assign{border-color:color-mix(in srgb,var(--assign) 30%,transparent)} .pillbtn.road{border-color:color-mix(in srgb,var(--road) 30%,transparent)} .pillbtn.done{border-color:color-mix(in srgb,var(--done) 30%,transparent)} .pillbtn.mech{border-color:color-mix(in srgb,var(--mech) 30%,transparent)}
.pillbtn:hover{filter:brightness(1.04)}
.metric.road{--mc:var(--road)} .metric.done{--mc:var(--done)} .metric.mech{--mc:var(--mech)}
.fcell.road{background:var(--roadbg);color:var(--road);border-color:color-mix(in srgb,var(--road) 26%,transparent)}
.fcell.done{background:var(--donebg);color:var(--done);border-color:color-mix(in srgb,var(--done) 26%,transparent)}
.fcell.mech{background:var(--mechbg);color:var(--mech);border-color:color-mix(in srgb,var(--mech) 26%,transparent)}
.seg button.on.road{background:var(--road);color:#fff} .seg button.on.done{background:var(--done);color:#fff} .seg button.on.mech{background:var(--mech);color:#fff}
/* action points panel */
.appanel{background:var(--card);border:1.5px solid color-mix(in srgb,var(--warn) 34%,transparent);border-radius:12px;overflow:hidden;margin-bottom:18px}
.aphd{display:flex;align-items:center;gap:9px;padding:11px 15px;background:var(--warnbg);border-bottom:1.5px solid color-mix(in srgb,var(--warn) 26%,transparent)}
.apttl{font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--warn)}
.apcount{font-weight:800;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:20px}
.apcount.bad{background:var(--oosbg);color:var(--oos)} .apcount.warn{background:var(--card);color:var(--warn)}
.apitem{display:flex;align-items:flex-start;gap:11px;padding:11px 15px}
.apitem+.apitem{border-top:1px solid var(--line)}
.apic{font-size:14px;line-height:1.3;flex-shrink:0}
.aptext{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.aptext b{font-size:13.5px;font-weight:800}
.aptext span{font-size:12.5px;color:var(--ink2);line-height:1.45}
.apitem.bad .aptext b{color:var(--oos)} .apitem.warn .aptext b{color:var(--warn)}
.apgo{flex-shrink:0;border:1.5px solid var(--line);background:var(--card);color:var(--ink2);font:800 11px/1 "Inter",system-ui,sans-serif;
  letter-spacing:.04em;text-transform:uppercase;padding:8px 11px;border-radius:7px;cursor:pointer}
.apgo:hover{background:var(--hover);color:var(--ink)}
tr.flash td{animation:fl 1.6s ease}
.apchip{border:1.5px solid var(--line);background:var(--card);border-radius:8px;padding:9px 13px;cursor:pointer;
  font:800 11.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.02em;display:inline-flex;align-items:center;gap:6px}
.apchip.ok{color:var(--avail);border-color:color-mix(in srgb,var(--avail) 34%,transparent);background:var(--availbg)}
.apchip.alert{color:var(--oos);border-color:color-mix(in srgb,var(--oos) 40%,transparent);background:var(--oosbg)}
.apchip:hover{filter:brightness(1.03)}
.streak{display:inline-flex;align-items:center;gap:1px;font-size:8px;letter-spacing:-1px;vertical-align:middle;white-space:nowrap}
.streak b{font-size:9.5px;font-weight:800;margin-left:3px;letter-spacing:0}
.streak.s2{color:var(--assign)} .streak.s3{color:var(--mech)} .streak.s5{color:var(--oos)}
@keyframes fl{0%,100%{background:transparent}20%,60%{background:var(--warnbg)}}
/* backup trucks */
.bkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:7px;padding:12px}
.bkcell{border-radius:9px;padding:9px 6px;text-align:center;border:1.5px dashed color-mix(in srgb,var(--indigo2) 45%,transparent);background:var(--pale)}
.bkcell .bu{font-variant-numeric:tabular-nums;font-weight:800;font-size:12.5px;color:var(--hd)}
[data-theme="dark"] .bkcell .bu{color:var(--ink)}
.bkcell .bs{font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin-top:3px;opacity:.85}
.bkbtn{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font:800 11px/1 "Inter",system-ui,sans-serif;
  padding:8px 11px;border-radius:7px;cursor:pointer;white-space:nowrap}
.bkbtn.on{background:var(--indigo);border-color:var(--hd);color:#fff}
.bkbtn:hover{filter:brightness(1.06)}
.autobtn{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font:800 11px/1 "Inter",system-ui,sans-serif;
  padding:8px 11px;border-radius:7px;cursor:pointer;white-space:nowrap}
.autobtn.on{background:var(--availbg);border-color:color-mix(in srgb,var(--avail) 40%,transparent);color:var(--avail)}
.delunit{border:1.5px solid var(--line);background:transparent;color:var(--muted);font:800 12px/1 "Inter",system-ui,sans-serif;width:30px;height:30px;border-radius:7px;cursor:pointer}
.delunit:hover{color:var(--oos);background:var(--oosbg);border-color:color-mix(in srgb,var(--oos) 34%,transparent)}
.rightcol{display:flex;flex-direction:column;gap:16px;min-width:0}
.untilnote{font-size:11px;font-weight:700;color:var(--road);white-space:nowrap}
.untilnote.done{color:var(--muted)} .untilnote.up{color:var(--assign)}
/* driver-days matrix */
table.ddm{border-collapse:collapse;width:100%;min-width:820px;font-size:12.5px}
table.ddm th,table.ddm td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);vertical-align:top}
table.ddm th:last-child,table.ddm td:last-child{border-right:0}
table.ddm thead th{position:sticky;top:0;z-index:2;background:var(--pale);color:var(--hd);font-weight:800;font-size:10.5px;
  letter-spacing:.05em;text-transform:uppercase;padding:9px 6px;text-align:center;line-height:1.2}
table.ddm thead th .dn{display:block;font-size:9.5px;font-weight:700;color:var(--indigo2);text-transform:none;margin-top:1px}
table.ddm thead th.today{background:var(--indigo);color:#fff}
table.ddm thead th.today .dn{color:#C3CBEA}
table.ddm th.dnh{text-align:left;width:150px} table.ddm th.dyh{width:52px}
.ddm td.ddname{padding:7px 10px;font-size:13px;white-space:nowrap}
.ddm td.dcount{text-align:center;font-variant-numeric:tabular-nums;font-weight:800;color:var(--ink);background:var(--hover)}
.ddm td.ddc{padding:4px 5px;text-align:center}
.ddm td.ddc.off{color:var(--muted);font-weight:700;background:color-mix(in srgb,var(--muted) 5%,transparent)}
.ddrun{display:flex;align-items:center;justify-content:center;gap:5px;padding:2px 0}
.ddrun+.ddrun{border-top:1px dashed var(--line);margin-top:2px;padding-top:3px}
.ddt{font-variant-numeric:tabular-nums;font-weight:700;font-size:11px;color:var(--ink2)}
.ddu{font-variant-numeric:tabular-nums;font-weight:800;font-size:11px;color:var(--assign);background:var(--assignbg);border-radius:5px;padding:1px 6px}
.ddu.none{color:var(--warn);background:var(--warnbg);font-weight:700;font-size:10px}
.ddu.train{color:var(--road);background:var(--roadbg);font-weight:800;font-size:10px}
.tbadge{font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--road);background:var(--roadbg);border-radius:5px;padding:2px 6px;margin-left:4px}
/* mechanical log */
.milog{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:flex-end;background:color-mix(in srgb,var(--pgc,var(--accent)) 5%,var(--card));border:1.5px solid color-mix(in srgb,var(--pgc,var(--accent)) 28%,var(--line));border-radius:12px;padding:14px;margin-bottom:18px;box-shadow:0 2px 6px rgba(20,30,50,.06)}
.mifield{display:flex;flex-direction:column;gap:5px}
.mifield.grow{flex:1 1 240px;min-width:200px}
.milog label{font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.milog input,.milog select{border:1.5px solid var(--line);border-radius:8px;padding:9px 11px;font:700 13px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.milog input:focus,.milog select:focus{outline:2px solid var(--indigo2);border-color:var(--indigo2)}
.milog .grow input{width:100%}
.miopt{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--ink2);text-transform:none;letter-spacing:0}
.milog .go{background:var(--indigo);border:0;color:#fff;font:800 13px/1 "Inter",system-ui,sans-serif;padding:11px 16px;border-radius:8px;cursor:pointer;height:38px}
table.mtable{border-collapse:collapse;width:100%;min-width:760px;font-size:13px}
table.mtable thead th{background:var(--pale);color:var(--hd);text-align:left;font-weight:800;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding:10px 13px}
table.mtable td{border-top:1px solid var(--line);padding:9px 13px;vertical-align:middle}
table.mtable tr:hover td{background:var(--hover)}
table.mtable tr.resolved td{opacity:.6}
.mtable .mdate{font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink2);white-space:nowrap}
.mtable .mnote{min-width:200px}
.woin{border:1.5px solid var(--line);border-radius:7px;padding:6px 9px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink);width:190px;min-width:170px}
.woin:focus{outline:2px solid var(--indigo2);border-color:var(--indigo2)}
.mact{white-space:nowrap;display:flex;gap:6px}
.mbtn{border:1.5px solid var(--line);background:var(--card);color:var(--ink2);font:800 11px/1 "Inter",system-ui,sans-serif;padding:7px 10px;border-radius:7px;cursor:pointer}
.mbtn.go{background:var(--avail);border-color:var(--avail);color:#fff}
.mbtn.del:hover{color:var(--oos);background:var(--oosbg);border-color:color-mix(in srgb,var(--oos) 34%,transparent)}
.mbtn:hover{filter:brightness(1.03)}
.issuebtn{border:1.5px solid color-mix(in srgb,var(--mech) 34%,transparent);background:var(--mechbg);color:var(--mech);font:800 11px/1 "Inter",system-ui,sans-serif;padding:6px 9px;border-radius:7px;cursor:pointer;white-space:nowrap}
.issuebtn:hover{filter:brightness(1.04)}
/* shift reports */
.shiftform{background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:16px}
.sfhd{font-weight:800;font-size:13px;color:var(--hd);margin-bottom:12px;letter-spacing:.02em}
.sfgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:11px 12px}
.sf{display:flex;flex-direction:column;gap:5px;min-width:0}
.sf.grow{grid-column:span 2} .sf.grow2{grid-column:1/-1}
@media(max-width:640px){.sf.grow{grid-column:span 1}}
.sf label{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.sf input,.sf select{border:1.5px solid var(--line);border-radius:8px;padding:9px 10px;font:700 13px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink);width:100%}
.sf input:focus,.sf select:focus{outline:2px solid var(--indigo2);border-color:var(--indigo2)}
.sf input.ro{background:var(--hover);color:var(--ink2);font-weight:800}
.sfactions{display:flex;gap:9px;margin-top:14px}
.sfactions .go{background:var(--indigo);border:0;color:#fff;font:800 13px/1 "Inter",system-ui,sans-serif;padding:11px 18px;border-radius:8px;cursor:pointer}
.sfactions .x{background:transparent;border:1.5px solid var(--line);color:var(--ink2);font:800 13px/1 "Inter",system-ui,sans-serif;padding:11px 15px;border-radius:8px;cursor:pointer}
.shiftbar{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.shiftbar .sf{flex-direction:column}
.shiftbar .spacer{flex:1}
.shiftbar .wknav{align-self:flex-end}
table.stable{border-collapse:separate;border-spacing:0;width:auto;min-width:100%;font-size:11.5px;table-layout:auto}
table.stable thead th{position:sticky;top:0;z-index:3;background:var(--pale);color:var(--hd);text-align:left;font-weight:800;font-size:9px;letter-spacing:.02em;text-transform:uppercase;padding:8px 8px;white-space:nowrap;border-bottom:2px solid var(--indigo2)}
[data-theme="dark"] table.stable thead th{color:var(--ink)}
table.stable td{border-bottom:1px solid var(--line);padding:4px 6px;white-space:nowrap;vertical-align:middle;background:var(--card)}
table.stable tr:hover td{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.stable .scell{font-weight:700}
/* frozen Date + Block ID + Driver columns (stay visible when scrolling right) */
.stable th.h-date,.stable td.sc-date{position:sticky;left:0;z-index:2;width:80px;min-width:80px;box-shadow:1px 0 0 var(--line)}
.stable th.h-blockId,.stable td.sc-blockId{position:sticky;left:80px;z-index:2;width:152px;min-width:152px;box-shadow:1px 0 0 var(--line)}
.stable th.h-driver,.stable td.sc-driver{position:sticky;left:232px;z-index:2;width:172px;min-width:172px;box-shadow:2px 0 4px -2px rgba(0,0,0,.18)}
.stable thead th.h-date,.stable thead th.h-blockId,.stable thead th.h-driver{z-index:5}
.stable tr:hover td.sc-date,.stable tr:hover td.sc-blockId,.stable tr:hover td.sc-driver{background:color-mix(in srgb,var(--accent) 5%,var(--card))}
/* section bands scroll normally (no sticky → no morning/evening collision) */
.stable tr.sgrp td{background:color-mix(in srgb,var(--indigo) 10%,var(--card));color:var(--hd);font-weight:800;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:8px 10px;cursor:pointer;user-select:none}
.stable tr.sgrp:hover td{background:color-mix(in srgb,var(--indigo) 16%,var(--card))}
.stable tr.sgrp.eve td{background:#5B6EA8;color:#fff}
.stable tr.sgrp.eve:hover td{background:#4F6199}
.stable tr.sgrp.morn td{background:#D69B3E;color:#fff}
.stable tr.sgrp.morn:hover td{background:#C68C33}
.stable tr.sgrp.eve:hover td{background:#5E4194}
.stable tr.sgrp.carry td{background:var(--warnbg);color:var(--warn)}
.secchev{display:inline-block;width:16px;color:inherit;font-size:10px;opacity:.7}
.stable tr.carryrow td{background:color-mix(in srgb,var(--warn) 9%,var(--card))}
.stable tr.carryrow:hover td{background:color-mix(in srgb,var(--warn) 15%,var(--card))}
.sin{border:1.5px solid var(--line);border-radius:6px;padding:5px 7px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.sin.num{width:70px} .sin.time{width:112px} .sin.note{width:200px}
/* stacked time + month/day date chip */
.tstack{display:flex;flex-direction:column;gap:3px}
.tdchip{position:relative;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;width:112px}
.tdchip-txt{pointer-events:none}
.tdchip .tdchip-txt{font-size:10.5px;font-weight:700;color:var(--muted);background:var(--pale);border:1px solid var(--line);border-radius:5px;padding:3px 6px;width:100%;text-align:center;white-space:nowrap;pointer-events:none}
.tdchip:hover .tdchip-txt{color:var(--ink);border-color:var(--accent)}
.tdchip input[type=date]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0;margin:0}
.sin.sumnote{width:100%;min-width:0;font-size:12px;resize:none;overflow:hidden;line-height:1.35;white-space:pre-wrap;word-break:break-word;min-height:30px;font-family:"Inter",system-ui,sans-serif}
.sin.timetext{width:100%;font-variant-numeric:tabular-nums}
table.stable td.su-notes{width:280px;min-width:200px;max-width:420px}
.sin.bid{width:132px;min-width:110px;font-variant-numeric:tabular-nums;text-overflow:ellipsis}
.sin.disp{width:120px;font-weight:700}
.sin.notebox{width:300px;min-height:32px;resize:vertical;white-space:pre-wrap;overflow:hidden;line-height:1.4;font-weight:600;vertical-align:top}
.stable td.sc-notes{white-space:normal;vertical-align:top;min-width:300px}
.sin:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.sin.bad{border-color:var(--oos);background:var(--oosbg);color:var(--oos);font-weight:800}
.ssel{border:1.5px solid var(--line);border-radius:6px;padding:5px 6px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.ssel:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.ssel.bad{border-color:var(--oos);background:var(--oosbg);color:var(--oos);font-weight:800}
/* trip / lateness colour coding */
.ssel.good{border-color:color-mix(in srgb,var(--avail) 45%,transparent);background:var(--availbg);color:var(--avail);font-weight:800}
.ssel.na{border-color:color-mix(in srgb,var(--mech) 30%,transparent);background:var(--warnbg);color:var(--warn);font-weight:700}
.tothrs{font-variant-numeric:tabular-nums;font-weight:800;color:var(--road)}
.sin.dname-in{width:170px;min-width:150px;font-weight:800;color:var(--ink)}
.sstag{font-size:8.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;padding:2px 5px;border-radius:4px;margin-left:5px;vertical-align:middle}
.sstag.cancelled{color:var(--oos);background:var(--oosbg)}
.sstag.callout{color:var(--mech);background:var(--mechbg)}
.sstag.pending{color:var(--assign);background:var(--assignbg)}
.sstag.done{color:var(--avail);background:var(--availbg)}
.db-stats .db-pending{color:var(--assign)}
.progchip{display:inline-flex;align-items:center;gap:2px;margin-left:6px;vertical-align:middle;padding:2px 6px;border-radius:6px;background:var(--pale)}
.progchip i{width:6px;height:6px;border-radius:50%;background:color-mix(in srgb,var(--muted) 45%,transparent);display:inline-block;transition:background .2s}
.progchip i.on{background:var(--accent)}
.progchip b{font-size:9px;font-weight:800;margin-left:4px;letter-spacing:.02em}
.progchip.pending{background:var(--assignbg)} .progchip.pending b{color:var(--assign)}
.progchip.partial b{color:var(--accent)}
.goodbtn{border:1.5px solid color-mix(in srgb,var(--avail) 45%,transparent);background:var(--availbg);color:var(--avail);
  font:800 12px/1 "Inter",system-ui,sans-serif;width:24px;height:24px;border-radius:6px;cursor:pointer;margin-left:5px;vertical-align:middle;transition:transform .1s}
.goodbtn:hover{background:var(--avail);color:#fff;transform:scale(1.1)}
.goodbtn:active{transform:scale(.9)}
.progwrap{min-width:200px;display:flex;flex-direction:column;gap:6px}
.progtop{font-size:12px;font-weight:700;color:var(--ink2)}
.progtop b{color:var(--ink);font-weight:800}
.progleft{color:var(--accent);font-weight:800}
.progcheer{color:var(--avail);font-weight:800}
.progbar{height:9px;border-radius:6px;background:var(--pale);overflow:hidden}
.progfill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--avail) 70%,var(--accent)));transition:width .5s cubic-bezier(.2,.8,.2,1)}
.progwrap.complete .progfill{background:linear-gradient(90deg,var(--avail),color-mix(in srgb,var(--avail) 60%,#fff))}
.progwrap.complete .progbar{box-shadow:0 0 0 2px color-mix(in srgb,var(--avail) 40%,transparent)}
@keyframes rowflash{0%{background:color-mix(in srgb,var(--avail) 45%,var(--card))}100%{background:var(--card)}}
.stable tr.rowdone td{animation:rowflash .7s ease-out}
/* rows still missing required times */
.stable tr.sumrow.missingtime td{background:color-mix(in srgb,var(--mech) 8%,transparent)}
.stable tr.sumrow.missingtime:hover td{background:color-mix(in srgb,var(--mech) 13%,transparent)}
.stable tr.sumrow.missingtime td.su-exp{box-shadow:inset 3px 0 0 var(--mech)}
/* overall row status colours */
.stable tr.sumrow.row-red td{background:color-mix(in srgb,var(--oos) 11%,var(--card))!important}
.stable tr.sumrow.row-red:hover td{background:color-mix(in srgb,var(--oos) 17%,var(--card))!important}
.stable tr.sumrow.row-red td.su-exp{box-shadow:inset 3px 0 0 var(--oos)}
.stable tr.sumrow.row-green td{background:color-mix(in srgb,var(--avail) 12%,var(--card))!important}
.stable tr.sumrow.row-green:hover td{background:color-mix(in srgb,var(--avail) 18%,var(--card))!important}
.stable tr.sumrow.row-green td.su-exp{box-shadow:inset 3px 0 0 var(--avail)}
/* completed on the board but not logged — violet (not amber) */
.stable tr.sumrow.row-warn td{background:color-mix(in srgb,#8b5cf6 13%,var(--card))!important}
.stable tr.sumrow.row-warn:hover td{background:color-mix(in srgb,#8b5cf6 20%,var(--card))!important}
.stable tr.sumrow.row-warn td.su-exp{box-shadow:inset 3px 0 0 #8b5cf6}
.stable tr.sumrow.row-warn td.su-driver::after{content:"● completed, not logged";display:block;font-size:9px;font-weight:800;color:#7c3aed;text-transform:uppercase;letter-spacing:.03em;margin-top:2px}
/* trip checks done but times still outstanding — slate blue */
.stable tr.sumrow.row-info td{background:color-mix(in srgb,var(--accent) 10%,var(--card))!important}
.stable tr.sumrow.row-info:hover td{background:color-mix(in srgb,var(--accent) 16%,var(--card))!important}
.stable tr.sumrow.row-info td.su-exp{box-shadow:inset 3px 0 0 var(--accent)}
.sstag.needtime{color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
.tothrs.over{color:var(--oos);font-weight:800}
.tothrs.err{color:var(--oos);font-weight:800}
/* next-day tours preview strip */
.ndstrip{background:linear-gradient(135deg,color-mix(in srgb,var(--assign) 10%,var(--card)),var(--card));
  border:1px solid color-mix(in srgb,var(--assign) 28%,transparent);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.ndhd{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;color:var(--ink);margin-bottom:10px}
.ndhd .ndday{color:var(--assign);font-weight:800}
.ndhd .ndcount{background:var(--assign);color:#fff;font-size:10px;font-weight:800;padding:2px 7px;border-radius:10px}
.ndhd .ndlabel{margin-left:auto;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.ndrows{display:flex;flex-wrap:wrap;gap:8px}
.ndtour{display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--line);border-radius:9px;padding:6px 8px 6px 11px}
.ndtour.sent{border-color:color-mix(in srgb,var(--avail) 40%,transparent);background:var(--availbg)}
.ndname{font-weight:800;font-size:12.5px;color:var(--ink);white-space:nowrap}
.ndunit{font-size:11px;font-weight:700;color:var(--ink2);font-variant-numeric:tabular-nums}
.ndtime{font-size:11px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.ndsent{border:1.5px solid color-mix(in srgb,var(--oos) 35%,transparent);background:var(--oosbg);color:var(--oos);
  font:800 11px/1 "Inter",system-ui,sans-serif;padding:6px 10px;border-radius:7px;cursor:pointer;white-space:nowrap}
.ndsent.on{border-color:color-mix(in srgb,var(--avail) 45%,transparent);background:var(--avail);color:#fff}
.ndsent:hover{filter:brightness(1.05)}
/* ---- compact summary rows ---- */
.stable tr.sumrow td{padding:8px 10px;vertical-align:middle}
.stable tr.sumrow{cursor:default}
/* Morning vs Evening: strong section header colors + a left-edge stripe that stays
   visible even when a row carries a status colour */
.sumrow.route-morn>td{background:color-mix(in srgb,#D69B3E 9%,var(--card))}
.sumrow.route-eve>td{background:color-mix(in srgb,#5B6EA8 9%,var(--card))}
.sumrow.route-morn:hover>td{background:color-mix(in srgb,#D69B3E 15%,var(--card))}
.sumrow.route-eve:hover>td{background:color-mix(in srgb,#5B6EA8 15%,var(--card))}
.sumrow.route-morn>td:first-child{box-shadow:inset 4px 0 0 #D69B3E}
.sumrow.route-eve>td:first-child{box-shadow:inset 4px 0 0 #5B6EA8}
.stable tr.sumrow:hover td{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.stable tr.sumrow.isopen td{background:color-mix(in srgb,var(--accent) 14%,transparent);border-bottom:0;font-weight:700}
.isopen td.su-exp{box-shadow:inset 3px 0 0 var(--accent)}
.stable tr.sumrow.iscomplete td.su-driver{min-width:180px;width:200px;max-width:230px}
.expbtn{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font:800 12px/1 "Inter",system-ui,sans-serif;width:26px;height:26px;border-radius:7px;cursor:pointer;transition:transform .12s}
.expbtn:hover{color:var(--accent);border-color:var(--accent)}
.expbtn.open{background:var(--accent);color:#fff;border-color:var(--accent)}
.su-date{font-weight:700;white-space:nowrap} .su-blockId{white-space:nowrap} .su-exp{width:1%}
.tksum{font-weight:700;font-variant-numeric:tabular-nums} .tksum.muted{color:var(--muted);font-weight:600}
/* at-a-glance status pills */
.strip{display:inline-flex;gap:4px}
.pchip{width:22px;height:22px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font:800 10px/1 "Inter",system-ui,sans-serif;font-style:normal;border:1.5px solid var(--line);color:var(--muted);background:var(--card);cursor:pointer;padding:0;transition:transform .08s}
.pchip:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.12)}
.carryignore{margin-left:8px;border:1px solid color-mix(in srgb,var(--oos) 40%,var(--line));background:transparent;color:var(--oos);font:800 10.5px "Inter",system-ui,sans-serif;padding:3px 9px;border-radius:999px;cursor:pointer}
.carryignore:hover{background:color-mix(in srgb,var(--oos) 12%,transparent)}
.btn.ignored-on{background:color-mix(in srgb,var(--muted) 18%,transparent);border-color:var(--muted);color:var(--ink)}
.pchip.ok{color:var(--avail);background:var(--availbg);border-color:color-mix(in srgb,var(--avail) 40%,transparent)}
.pchip.bad{color:var(--oos);background:var(--oosbg);border-color:color-mix(in srgb,var(--oos) 40%,transparent)}
.pchip.na{color:var(--warn);background:var(--warnbg);border-color:color-mix(in srgb,var(--mech) 35%,transparent)}
.pchip.empty{color:var(--muted);background:var(--pale);border-style:dashed}
.stag{font-size:9px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;padding:3px 8px;border-radius:5px}
.stag.cancelled{color:var(--oos);background:var(--oosbg)} .stag.callout{color:var(--mech);background:var(--mechbg)}
/* ---- roomy detail panel (clean stacked sections) ---- */
.stable tr.detailrow td{padding:0;background:transparent}
.detailpanel{margin:3px 10px 16px;border:1px solid color-mix(in srgb,var(--accent) 55%,#0a1420);border-radius:16px;overflow:hidden;box-shadow:0 14px 40px rgba(12,22,38,.34);--dpink:#EAF1FB;--dpink2:#AEC2DC;--dpsurf:rgba(255,255,255,.055);--dpline:rgba(255,255,255,.14);background:linear-gradient(160deg,#25406A 0%,#1B3050 46%,#152742 100%)}
.detailpanel.isdone{border-color:color-mix(in srgb,var(--avail) 55%,#0a1420);background:linear-gradient(160deg,#1B5140 0%,#123B30 50%,#0F3026 100%)}
.detailpanel.islocked{border-color:color-mix(in srgb,var(--muted) 50%,#0a1420);background:linear-gradient(160deg,#39424F 0%,#2B333E 50%,#232A34 100%)}
/* header band */
.dphead{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 18px;background:rgba(0,0,0,.18);border-bottom:1px solid var(--dpline)}
.dphead-l{display:flex;flex-direction:column;gap:2px;min-width:0}
.dphead-name{font-weight:800;font-size:16px;color:#fff;letter-spacing:.2px}
.dphead-meta{font-size:11.5px;color:var(--dpink2);font-weight:600}
.dphead-badge{font-size:11px;font-weight:800;padding:5px 12px;border-radius:999px;white-space:nowrap;border:1px solid transparent}
.dphead-badge.ok{color:#0e2a20;background:#7FE9C0;border-color:#7FE9C0}
.dphead-badge.todo{color:#fff;background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.28)}
.dpbody{padding:16px 16px 16px;display:flex;flex-direction:column;gap:12px;background:transparent}
.dprow4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 16px;padding:13px 15px;background:var(--dpsurf);border:1px solid var(--dpline);border-radius:12px}
/* frosted field-group cards on the dark surface */
.dpsection{background:var(--dpsurf);border:1px solid var(--dpline);border-radius:12px;padding:13px 15px;backdrop-filter:blur(2px)}
.dphd{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#DCE8F6;margin-bottom:11px;display:flex;align-items:center;gap:8px}
.dphd-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.dphd-dot.pun{background:#79A6E6} .dphd-dot.tim{background:#F0C069} .dphd-dot.com{background:#F0857E} .dphd-dot.note{background:#AEC2DC}
.dpgrid{display:grid;gap:12px 16px;align-items:end}
.dpgrid.four{grid-template-columns:repeat(4,1fr)}
.dpgrid.three{grid-template-columns:repeat(3,1fr)}
.ff{display:flex;flex-direction:column;gap:5px;min-width:0}
.ff label{font-size:11px;font-weight:800;color:#FFFFFF;letter-spacing:.02em}
.ff .ssel,.ff .sin{width:100%!important}
.detailpanel .ssel,.detailpanel .sin,.detailpanel input,.detailpanel select,.detailpanel textarea{background:rgba(255,255,255,.94);color:#1a2432;border-color:rgba(255,255,255,.25)}
.detailpanel .ssel:focus,.detailpanel .sin:focus,.detailpanel input:focus,.detailpanel select:focus,.detailpanel textarea:focus{border-color:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.25)}
/* value-based colour coding: problem = red, good = green, N/A = cream */
.detailpanel .ssel.bad{background:#FBE3E0!important;color:#B4271A!important;border-color:#E88C82!important;font-weight:800}
.detailpanel .ssel.good{background:#DFF3E9!important;color:#137A54!important;border-color:#7FD2AC!important;font-weight:800}
.detailpanel .ssel.na{background:#FBF1DC!important;color:#9A6B15!important;border-color:#E7C983!important;font-weight:800}
.detailpanel .sin.time.bad,.detailpanel input.time.bad{background:#FBE3E0!important;color:#B4271A!important;border-color:#E88C82!important}
.ff .tstack{width:100%} .ff .tdchip{width:100%}
.ff .tothrs{font-size:15px;padding:6px 0;color:var(--dpink)}
.dplocked{color:var(--dpink);background:rgba(255,255,255,.08);border:1px solid var(--dpline);border-radius:10px;padding:12px 14px}
.dplocked b{color:#fff}
.dpactions{display:flex;gap:10px;flex-wrap:wrap;padding:13px 15px;background:var(--dpsurf);border:1px solid var(--dpline);border-radius:12px}
.detailpanel .dpactions .btn{background:rgba(255,255,255,.1);border:1px solid var(--dpline);color:var(--dpink)}
.detailpanel .dpactions .btn:hover{background:rgba(255,255,255,.18)}
.detailpanel .dpactions .btn.good{background:#7FE9C0;border-color:#7FE9C0;color:#0e2a20}
.detailpanel .dpactions .btn.primary{background:#fff;border-color:#fff;color:#1a2432}
.detailpanel .dpactions .btn.ignored-on{background:rgba(255,255,255,.22);color:#fff}
@media(max-width:900px){.dpgrid.four,.dprow4{grid-template-columns:1fr 1fr}.dpgrid.three{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.dpgrid.four,.dpgrid.three,.dprow4{grid-template-columns:1fr 1fr}}

.statsel{font-weight:800}
.statsel.stcancelled{color:var(--oos);background:var(--oosbg);border-color:color-mix(in srgb,var(--oos) 40%,transparent)}
.statsel.stcallout{color:var(--mech);background:var(--mechbg);border-color:color-mix(in srgb,var(--mech) 40%,transparent)}
.dispsel{font-weight:700}

.ff .ssel,.ff .sin{width:100%!important}
.ff .tstack{width:100%} .ff .tdchip{width:100%}
.ff .tothrs{font-size:15px;padding:6px 0}
.milog.hidden{display:none!important}

/* ===== Shift Handover page ===== */
.hodatebar{display:flex;align-items:center;gap:8px;margin:0 0 16px}
.hodatewrap{position:relative;display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--card);border-radius:9px;padding:8px 14px;cursor:pointer;font-weight:800;font-size:13.5px;color:var(--ink)}
.hodatewrap input[type=date]{position:absolute;inset:0;opacity:0;cursor:pointer;border:0;width:100%;height:100%}
.hodatetxt{pointer-events:none}
.hodocgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hodoc{display:flex;flex-direction:column}
.hodochd{display:flex;align-items:center;justify-content:space-between;padding:0 4px 8px}
.hoshift{font-weight:800;font-size:15px;color:var(--ink)}
.howords{font-size:11.5px;font-weight:700;color:var(--muted)}
.hopaper{background:var(--card);border:1px solid var(--line);border-radius:6px;box-shadow:0 4px 18px rgba(0,0,0,.08);overflow:hidden}
.hopage{display:block;width:100%;box-sizing:border-box;min-height:520px;resize:vertical;border:0;outline:0;
  padding:30px 34px;background:transparent;color:var(--ink);
  font:400 15px/1.85 "Georgia","Times New Roman",serif;
  background-image:repeating-linear-gradient(var(--card) 0 calc(1.85em - 1px), color-mix(in srgb,var(--line) 55%,transparent) calc(1.85em - 1px) 1.85em);
  background-position:0 30px;background-attachment:local}
.profwrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;align-items:start}
.profcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:0 1px 3px rgba(20,30,50,.05)}
.profcardhd{font-weight:800;font-size:13px;color:var(--ink);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.proffield{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.proffield label{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.proffield input,.proffield select{border:1px solid var(--line);border-radius:8px;padding:10px 12px;font:600 13.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.proffield input:focus,.proffield select:focus{outline:none;border-color:var(--accent)}
.profsave .profsub,.profsub{font-size:12.5px;color:var(--muted);margin:0 0 14px;line-height:1.5}
.btn.big{width:100%;padding:12px;font-size:14px;font-weight:800}
/* trial badge (profile header, all roles) */
.trialbadge{align-self:center;margin-left:auto;flex-shrink:0;font:800 11px/1 "Inter",system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase;
  color:var(--accent2);background:color-mix(in srgb,var(--accent2) 16%,transparent);border:1px solid color-mix(in srgb,var(--accent2) 45%,transparent);
  padding:6px 12px;border-radius:999px;white-space:nowrap}
/* owner-only Data section */
.profdata{grid-column:1/-1}
.profdata-hd{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;margin-bottom:0;border-bottom:none;padding-bottom:0}
.profdata.open .profdata-hd{margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.profdata-sub{font:700 10px/1 "Inter",system-ui,sans-serif;letter-spacing:.05em;text-transform:uppercase;color:var(--accent2);background:color-mix(in srgb,var(--accent2) 14%,transparent);border-radius:5px;padding:3px 7px}
.profdata-chev{margin-left:auto;color:var(--muted);font-size:11px}
.profdata-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.profdata-block{border:1px solid var(--line);border-radius:10px;padding:14px 16px;background:color-mix(in srgb,var(--hover) 40%,transparent)}
.profdata-title{font-weight:800;font-size:13px;color:var(--ink);margin-bottom:8px}
.profinfo{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:13px;border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent)}
.profinfo:last-child{border-bottom:none}
.profinfo span{color:var(--muted);font-weight:600}
.profinfo b{color:var(--ink);font-weight:800}
.profver{font-size:11px;font-family:monospace;color:var(--muted);font-weight:600}
.hobyline{font-size:11px;font-weight:600;color:var(--muted);padding:6px 4px 0;font-style:italic;min-height:16px}
.ho-signspacer{flex:1}
.ho-signlabel{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.ho-signsel{border:1px solid var(--line);border-radius:8px;padding:8px 10px;font:700 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.hopage::placeholder{color:var(--muted);font-style:italic}
.hopage:focus{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 30%,transparent)}
@media(max-width:900px){.hodocgrid{grid-template-columns:1fr}}
/* ===== Shift Notepad page ===== */
.npadd{display:flex;gap:8px;align-items:flex-start;margin:0 0 18px}
.npadd-shift{flex:0 0 120px;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:700 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.npadd-text{flex:1;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:600 13.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink);resize:none;min-height:20px;max-height:200px}
.npadd-text:focus{outline:none;border-color:var(--accent)}
.npgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.npcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.npcard.pinned{border-color:color-mix(in srgb,var(--accent2) 55%,var(--line));background:color-mix(in srgb,var(--accent2) 6%,var(--card))}
.np-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.np-time{font-size:11px;color:var(--muted);font-weight:600}
.np-actions{margin-left:auto;display:flex;gap:4px;align-items:center}
.np-pin{border:none;background:transparent;cursor:pointer;font-size:15px;color:var(--muted);padding:0 2px}
.np-pin.on{color:var(--accent2)}
.np-text{width:100%;box-sizing:border-box;border:0;outline:0;background:transparent;resize:none;overflow:hidden;min-height:20px;font:600 13.5px/1.5 "Inter",system-ui,sans-serif;color:var(--ink);white-space:pre-wrap;word-break:break-word;padding:0}
.np-text:focus{outline:none}
/* ===== Dispatcher Shifts page ===== */
.dsbar{display:flex;align-items:center;gap:8px;margin:0 0 16px}
.dswk{font-weight:800;font-size:14px;color:var(--ink);min-width:200px;text-align:center}
.dstable{width:100%;border-collapse:collapse}
.dstable th{background:var(--indigo);color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:10px 12px;text-align:left;border:1px solid var(--line)}
.dstable td{border:1px solid var(--line);padding:8px 10px;vertical-align:top;background:var(--card)}
.dstable .ds-daycol{width:90px;white-space:nowrap}
.dstable .ds-daycol b{display:block;font-size:13px;color:var(--ink)}
.dstable .ds-daycol span{font-size:11px;color:var(--muted)}
.dstable tr.ds-today td{background:color-mix(in srgb,var(--accent) 8%,var(--card))}
.dscell{display:flex;flex-wrap:wrap;gap:6px;min-height:24px}
.dschip{border:1px solid var(--line);background:var(--card);color:var(--muted);font:700 12px "Inter",system-ui,sans-serif;padding:5px 11px;border-radius:999px;cursor:pointer}
.dschip:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.dschip.on{background:color-mix(in srgb,var(--accent) 15%,transparent);border-color:var(--accent);color:var(--accent);font-weight:800}
.dsnone{font-size:11.5px;color:var(--muted);font-style:italic}
.dsroster-row{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 14px}
.dsroster{display:inline-flex;align-items:center;gap:7px;background:var(--pale);border:1px solid var(--line);border-radius:999px;padding:5px 6px 5px 12px;font-weight:700;font-size:12.5px;color:var(--ink)}
.dsroster button{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;padding:0 3px}
.dsroster button:hover{color:var(--oos)}
.dsadd{display:flex;gap:8px;max-width:420px}
.dsadd input{flex:1;border:1px solid var(--line);border-radius:9px;padding:9px 12px;font:600 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
/* ===== To-Do list page ===== */
.tdadd{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}
.tdadd-text{flex:2;min-width:200px;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:600 13.5px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.tdadd-sm{flex:1;min-width:120px;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:600 13px "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.tdsec{margin-bottom:18px}
.tdlist{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.tditem{display:flex;align-items:flex-start;gap:11px;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:12px 14px}
.tditem:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.tditem.done{opacity:.6}
.tdcheck{width:24px;height:24px;flex-shrink:0;border:2px solid var(--muted);background:var(--card);border-radius:50%;cursor:pointer;font-weight:900;font-size:13px;color:#fff;display:flex;align-items:center;justify-content:center}
.tdcheck.on{background:var(--avail);border-color:var(--avail)}
.tdmain{flex:1;min-width:0}
.tdtext{font-weight:700;font-size:14px;color:var(--ink)}
.tditem.done .tdtext{text-decoration:line-through;color:var(--muted)}
.tdtags{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.tdtag{font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px}
.tdtag.drv{color:var(--assign);background:var(--assignbg)}
.tdtag.blk{color:var(--road);background:var(--roadbg)}

.fastentry{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.btn.good{background:var(--availbg);border:1.5px solid color-mix(in srgb,var(--avail) 45%,transparent);color:var(--avail);font-weight:800}
.btn.good:hover{background:var(--avail);color:#fff}
.kbhint{font-size:11px;color:var(--muted);white-space:nowrap}
.kbhint b{display:inline-block;background:var(--pale);border:1px solid var(--line);border-radius:4px;padding:1px 5px;color:var(--ink);font-size:10.5px;margin:0 1px}
.stable tr.kbfocus td{box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent)}
.stable tr.pendingrow td.sc-driver{background:color-mix(in srgb,var(--assign) 6%,var(--card))}
.stable tr.statusrow td{background:color-mix(in srgb,var(--muted) 7%,var(--card))}
.stable tr.statusrow:hover td{background:color-mix(in srgb,var(--muted) 12%,var(--card))}
.lockcell{display:inline-block;min-width:8px}
.unitsel2{width:82px}
.swapbtn{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font:800 12px/1 "Inter",system-ui,sans-serif;padding:5px 8px;border-radius:6px;cursor:pointer;margin-left:4px}
.swapbtn:hover{color:var(--road);border-color:color-mix(in srgb,var(--road) 40%,transparent);background:var(--roadbg)}
.swaparrow{color:var(--road);font-weight:800;margin:0 3px}
.swapx{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font:800 11px/1 "Inter",system-ui,sans-serif;padding:4px 6px;border-radius:6px;cursor:pointer;margin-left:3px}
.swapx:hover{color:var(--oos);background:var(--oosbg)}
.rowx{border:1.5px solid var(--line);background:var(--card);color:var(--muted);font:800 10px/1 "Inter",system-ui,sans-serif;padding:3px 6px;border-radius:6px;cursor:pointer;margin-left:6px}
.rowx:hover{color:var(--oos);background:var(--oosbg)}
/* on-duty count badge + export section */
.shifthead{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.daynav{display:flex;align-items:center;gap:6px}
.daypick{border:1.5px solid var(--line);border-radius:8px;padding:9px 11px;font:800 12.5px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.dutybadge{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,var(--card)),var(--card));
  border:1px solid color-mix(in srgb,var(--accent) 26%,transparent);border-radius:12px;padding:8px 16px 8px 12px}
.db-count{font-size:30px;font-weight:800;line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.db-txt{display:flex;flex-direction:column;line-height:1.25}
.db-txt b{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink)}
.db-txt span{font-size:11.5px;color:var(--muted);font-weight:600}
.db-stats{display:flex;gap:10px;margin-left:6px;padding-left:12px;border-left:1px solid var(--line);font-size:12px;font-weight:800}
.db-stats span{color:var(--ink2)} .db-stats .db-bad{color:var(--oos)} .db-stats .db-warn{color:var(--mech)}
.exportbar{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.exportbar .sf{display:flex;flex-direction:column;gap:3px}
.exportbar .sf label{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.exportbar .sf input{border:1.5px solid var(--line);border-radius:8px;padding:8px 10px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.exportbar .spacer{flex:1}
.exhint{font-size:11.5px;color:var(--muted);align-self:center;max-width:340px}
.minote{border:1.5px solid var(--line);border-radius:8px;padding:8px 10px;font:600 12.5px/1.35 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink);width:100%;min-height:38px;resize:vertical;white-space:pre-wrap;overflow:hidden}
.minote:focus{outline:2px solid var(--accent);border-color:var(--accent)}
/* time off */
table.totable,table.pttable{border-collapse:collapse;width:100%;font-size:13px;min-width:820px}
table.totable thead th,table.pttable thead th{position:sticky;top:0;background:var(--pale);color:var(--hd);text-align:left;font-weight:800;font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;padding:9px 12px;white-space:nowrap}
table.totable td,table.pttable td{border-top:1px solid var(--line);padding:9px 12px;vertical-align:top}
table.totable tr:hover td,table.pttable tr:hover td{background:var(--hover)}
tr.shortrow td{background:color-mix(in srgb,var(--oos) 9%,transparent)}
tr.shortrow:hover td{background:color-mix(in srgb,var(--oos) 15%,transparent)}
.ttag{font-size:10px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;padding:3px 9px;border-radius:20px}
.ttag.pto{color:var(--done);background:var(--donebg)} .ttag.req{color:var(--assign);background:var(--assignbg)}
.offdate{font-variant-numeric:tabular-nums;font-weight:700}
.dleft{font-variant-numeric:tabular-nums;font-weight:800;color:var(--hd)}
.dleft.now{color:var(--oos)}
.noticeok{color:var(--avail);font-weight:700} .noticebad{color:var(--oos);font-weight:800}
.tnotes{color:var(--ink2);max-width:280px}
.muted{color:var(--muted)}
/* point matrix */
.topgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:11px;margin-bottom:12px}
.topcard{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,var(--card)),var(--card));border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);border-radius:11px;padding:12px 14px}
.topcard.first{border-color:color-mix(in srgb,var(--oos) 40%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--oos) 12%,var(--card)),var(--card))}
.topbadge{font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.topcard.first .topbadge{color:var(--oos)}
.topname{font-size:17px;font-weight:800;margin:2px 0}
.toppts{font-size:24px;font-weight:800;color:var(--oos);font-variant-numeric:tabular-nums}
.toppts span{font-size:12px;font-weight:700;color:var(--muted);margin-left:4px}
.topnotes{margin-top:7px;display:flex;flex-direction:column;gap:2px}
.tnrow{font-size:11px;color:var(--ink2)} .tnrow .tnp{font-weight:800;color:var(--oos)}
.segtabs{display:inline-flex;gap:3px;background:var(--hover);border-radius:9px;padding:3px;margin:6px 0 4px}
.segtabs button{border:0;background:transparent;color:var(--ink2);font:800 11.5px/1 "Inter",system-ui,sans-serif;padding:8px 14px;border-radius:7px;cursor:pointer}
.segtabs button.on{background:var(--card);color:var(--accent);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.pttable tr.pt-zero td{color:var(--muted)}
.pttable tr.pt-high td{background:color-mix(in srgb,var(--oos) 8%,transparent)}
.pttable tr.pt-mid td{background:color-mix(in srgb,var(--mech) 7%,transparent)}
.ptcell{white-space:nowrap}
.ptnum{font-variant-numeric:tabular-nums;font-weight:800;font-size:16px;margin:0 8px;min-width:26px;display:inline-block;text-align:center}
.ptadj{border:1.5px solid var(--line);background:var(--card);color:var(--ink2);width:26px;height:26px;border-radius:6px;cursor:pointer;font-weight:800}
.ptadj:hover{background:var(--hover)}
.penotes{max-width:520px}
.peline{display:flex;align-items:flex-start;gap:7px;padding:2px 0}
.peline+.peline{border-top:1px dashed var(--line);margin-top:2px;padding-top:4px}
.pep{font-weight:800;color:var(--oos);font-variant-numeric:tabular-nums;min-width:26px} .pep.neg{color:var(--avail)}
.ped{font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}
.pen{flex:1;color:var(--ink2)}
.pex{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:11px;padding:2px 5px;border-radius:4px}
.pex:hover{color:var(--oos);background:var(--oosbg)}
/* pencil edit affordance + inline edit fields (Point Matrix entries) */
.pedit{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;padding:2px 5px;border-radius:4px}
.pedit:hover{color:var(--accent);background:var(--hover)}
.peline.editing{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:4px 0}
.pein{border:1.5px solid var(--line);border-radius:6px;padding:5px 7px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.pein.pts{width:66px}.pein.date{width:148px}.pein.note{flex:1;min-width:120px}
.pesave,.pecancel{border:1.5px solid var(--line);background:var(--card);color:var(--ink2);cursor:pointer;border-radius:6px;padding:5px 9px;font:800 11px/1 "Inter",system-ui,sans-serif}
.pesave{color:#fff;background:var(--accent);border-color:var(--accent)}
.pecancel:hover{color:var(--oos);border-color:var(--oos)}
/* pencil on Time Off / Mechanical rows + full-width inline edit form */
.mbtn.edit:hover{color:var(--accent);border-color:var(--accent)}
.milog.editrow{background:var(--hover);border-radius:10px;padding:10px 12px;margin:2px 0}
tr.editrow-tr td{padding:6px 8px}
.emptyline{padding:26px 16px;text-align:center;color:var(--muted);font-size:13.5px}

.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:7px;padding:12px}
.fcell{border-radius:9px;padding:9px 6px;text-align:center;border:1.5px solid transparent}
.fcell .fu{font-variant-numeric:tabular-nums;font-weight:800;font-size:12.5px}
.fcell .fs{font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;margin-top:3px;opacity:.92}
.fcell.avail{background:var(--availbg);color:var(--avail);border-color:color-mix(in srgb,var(--avail) 26%,transparent)}
.fcell.assign{background:var(--assignbg);color:var(--assign);border-color:color-mix(in srgb,var(--assign) 26%,transparent)}
.fcell.oos{background:var(--oosbg);color:var(--oos);border-color:color-mix(in srgb,var(--oos) 26%,transparent)}

.legend{display:flex;gap:12px;flex-wrap:wrap;margin:2px 0 16px}
.lgi{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--ink2)}
.lgi .ls{width:11px;height:11px;border-radius:3px}

/* schedule grid — compact */
.gridwrap{overflow-x:auto;border:1.5px solid var(--line);border-radius:12px;background:var(--card)}
table.sched{border-collapse:collapse;width:auto;min-width:100%;font-size:12.5px;table-layout:fixed}
table.sched th,table.sched td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);vertical-align:middle;white-space:nowrap}
table.sched th:last-child,table.sched td:last-child{border-right:0}
table.sched thead th{position:sticky;top:0;z-index:2;background:var(--pale);color:var(--hd);font-weight:800;
  font-size:11px;letter-spacing:.05em;text-transform:uppercase;padding:9px 10px;text-align:center;line-height:1.25}
table.sched thead th .dnum{display:block;font-size:10px;font-weight:700;color:var(--indigo2);opacity:.85;margin-top:1px;letter-spacing:.02em;text-transform:none}
table.sched thead th.today{background:var(--indigo);color:#fff}
table.sched thead th.today .dnum{color:#C3CBEA}
table.sched th.blkcol{text-align:left;width:1%;position:sticky;left:0;z-index:4}
.colresize{position:absolute;top:0;right:-3px;width:8px;height:100%;cursor:col-resize;z-index:5;user-select:none}
.colresize:hover{background:color-mix(in srgb,var(--accent) 40%,transparent)}
table.sched thead th{position:sticky;overflow:visible}
table.sched td.daycell{overflow:hidden}
.sectionrow td{background:var(--indigo);color:#fff;font-weight:800;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:7px 12px}
td.blkc{background:var(--hover);padding:3px 6px;white-space:nowrap;text-align:left;width:1%;position:sticky;left:0;z-index:3;box-shadow:2px 0 4px rgba(0,0,0,.06)}
.blkc .lblwrap{display:flex;align-items:center;gap:4px}
.blkc .lbl{font-variant-numeric:tabular-nums;font-weight:800;font-size:11.5px;color:var(--ink2)}
.blkrm{opacity:0;border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:11px;line-height:1;padding:2px 3px;border-radius:4px;margin-left:auto}
.blkmove{display:inline-flex;flex-direction:column;gap:0;opacity:0;margin-left:2px}
.blkc:hover .blkmove{opacity:.85}
.blkud{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:8px;line-height:1;padding:1px 2px}
.blkud:hover:not([disabled]){color:var(--accent)}
.blkud[disabled]{opacity:.25;cursor:default}
.blkmv{opacity:0;border:0;background:transparent;color:var(--accent);cursor:pointer;font-size:12px;line-height:1;padding:2px 3px;border-radius:4px;font-weight:800}
.blkc:hover .blkmv{opacity:.75}
.blkc:hover .blkmv:hover{opacity:1}
.addblk-div{width:1px;align-self:stretch;background:var(--line);margin:0 8px}
tr:hover .blkrm{opacity:.85}
.blkrm:hover{color:var(--oos);background:var(--oosbg);opacity:1}
td.daycell{padding:2px 4px;position:relative}
td.daycell.today{background:color-mix(in srgb,var(--indigo) 5%,transparent)}
td.daycell.wknd{background:transparent}
.cell{display:flex;flex-direction:column;gap:2px;min-height:26px}
.cellmain{display:flex;align-items:center;gap:2px;width:100%}
.cell.empty .drvin{width:100%;flex:1 1 100%}
.unassignbtn{flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--muted);font-size:10px;font-weight:800;width:18px;height:18px;border-radius:5px;cursor:pointer;padding:0;line-height:1;opacity:.55}
.unassignbtn:hover{opacity:1;border-color:var(--oos);color:var(--oos)}
.unassignbtn.on{opacity:1;background:var(--oosbg);border-color:var(--oos);color:var(--oos)}
.drvin{flex:1 1 auto;min-width:52px;width:auto;border:1px solid transparent;background:transparent;border-radius:5px;padding:2px 4px;
  font:800 12px/1.2 "Inter",system-ui,sans-serif;color:var(--ink);field-sizing:content}
.drvin::placeholder{color:var(--muted);font-weight:500}
.drvin:hover{background:var(--hover)}
.drvin:focus{outline:2px solid var(--indigo2);outline-offset:-1px;background:var(--card)}
.drvin.off{color:var(--off)!important;font-weight:800}
/* unassigned cells read as genuinely empty; a faint + hint appears on hover */
td.daycell.isempty{background:transparent}
td.daycell.isempty .cell.empty{position:relative}
td.daycell.isempty .cell.empty::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  color:var(--muted);font-weight:700;font-size:12px;opacity:0;pointer-events:none;transition:opacity .12s}
td.daycell.isempty:hover .cell.empty::after{opacity:.5}
.dash{display:none;color:var(--muted);font-weight:800;font-size:11px;flex-shrink:0}
.cell.has .dash{display:inline}
.dispin{width:100%;box-sizing:border-box;border:1px dashed transparent;border-radius:5px;padding:1px 5px;font:700 10px "Inter",system-ui,sans-serif;background:transparent;color:var(--accent);opacity:.5;transition:opacity .12s}
.dispin::placeholder{color:var(--muted);font-weight:600}
.dispin:hover,.dispin:focus{opacity:1;border-color:var(--line)}
.dispin.set{opacity:1;border-style:solid;border-color:color-mix(in srgb,var(--accent) 40%,var(--line));background:color-mix(in srgb,var(--accent) 8%,transparent)}
.dispin:focus{outline:none;border-color:var(--accent)}
.unitsel{flex:0 0 auto;width:auto;appearance:none;border:1px solid color-mix(in srgb,var(--assign) 32%,transparent);border-radius:5px;
  padding:2px 5px;text-align:center;text-align-last:center;font:800 11px/1.2 "Inter",system-ui,sans-serif;font-variant-numeric:tabular-nums;
  color:var(--assign);background:var(--assignbg);cursor:pointer}
.unitsel.empty{color:var(--muted);background:transparent;border-color:var(--line);font-weight:700}
.unitsel.conflict{border-color:var(--warn);box-shadow:0 0 0 1px var(--warn) inset;color:var(--warn)}
.unitsel:focus{outline:2px solid var(--indigo2);outline-offset:-1px}
/* filterable tractor field (type any part of the number to filter) */
.unitin{flex:0 0 auto;width:62px;border:1px solid color-mix(in srgb,var(--assign) 32%,transparent);border-radius:5px;
  padding:2px 5px;text-align:center;font:800 11px/1.2 "Inter",system-ui,sans-serif;font-variant-numeric:tabular-nums;
  color:var(--assign);background:var(--assignbg)}
.unitin.empty{color:var(--muted);background:transparent;border-color:var(--line);font-weight:700}
.unitin.empty::placeholder{color:var(--muted);font-weight:700}
.unitin.conflict{border-color:var(--warn);box-shadow:0 0 0 1px var(--warn) inset;color:var(--warn)}
.unitin:focus{outline:2px solid var(--indigo2);outline-offset:-1px}
/* add-block form */
.addblk{display:none;gap:8px;align-items:center;flex-wrap:wrap;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:11px 13px;margin:0 0 16px}
.addblk.show{display:flex}
.addblk label{font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.addblk select,.addblk input{border:1.5px solid var(--line);border-radius:8px;padding:9px 11px;font:700 13px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.addblk input{width:120px}
.addblk select:focus,.addblk input:focus{outline:2px solid var(--indigo2);border-color:var(--indigo2)}
.addblk .go{background:var(--indigo);border:0;color:#fff;font:800 13px/1 inherit;padding:10px 15px;border-radius:8px;cursor:pointer}
.addblk .x{background:transparent;border:1.5px solid var(--line);color:var(--ink2);font:800 13px/1 inherit;padding:10px 13px;border-radius:8px;cursor:pointer}
/* unassigned panel */
.ualist{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0}
.uchip{display:inline-flex;align-items:center;gap:8px;background:var(--warnbg);border:1.5px solid color-mix(in srgb,var(--warn) 30%,transparent);
  border-radius:9px;padding:7px 11px;font-size:12.5px;font-weight:700}
.uchip .ud{color:var(--warn);font-variant-numeric:tabular-nums;font-weight:800}
.uchip .un{color:var(--ink)}
.okbox{background:var(--availbg);border:1.5px solid color-mix(in srgb,var(--avail) 30%,transparent);color:var(--avail);
  border-radius:10px;padding:12px 15px;font-weight:700;font-size:13.5px;display:flex;gap:9px;align-items:center}
/* block-timings tab */
.tmlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:9px;margin-bottom:6px}
.tmrow{display:flex;align-items:center;gap:10px;background:var(--card);border:1.5px solid var(--line);border-radius:9px;padding:9px 12px}
.tmtime{font-variant-numeric:tabular-nums;font-weight:800;font-size:13px;color:var(--ink);min-width:46px}
.cov{font-size:11.5px;font-weight:800;color:var(--assign);white-space:nowrap}
.cov.t{color:var(--avail)}
.cov.muted{color:var(--muted)}
.tmrm{margin-left:auto;border:0;background:transparent;color:var(--muted);font:800 11px/1 "Inter",system-ui,sans-serif;cursor:pointer;padding:4px 7px;border-radius:5px}
.tmrm:hover{color:var(--oos);background:var(--oosbg)}
.wtable{width:100%;border-collapse:collapse;background:var(--card);border:1.5px solid var(--line);border-radius:12px;overflow:hidden;font-size:13.5px}
.wtable thead th{background:var(--pale);color:var(--hd);text-align:left;font-weight:800;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:11px 14px}
.wtable td{border-top:1px solid var(--line);padding:8px 14px;vertical-align:middle}
.wtable tr:hover td{background:var(--hover)}
.wtable .dcount{font-variant-numeric:tabular-nums;font-weight:800;color:var(--ink);width:60px}
.pips{display:flex;gap:4px}
.pip{width:16px;height:16px;border-radius:4px;background:var(--offbg);box-shadow:inset 0 0 0 1px var(--line)}
.pip.lbl{width:auto;height:auto;background:transparent;box-shadow:none;font-size:9.5px;font-weight:800;color:var(--muted);letter-spacing:.02em}
.distrow{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 6px}
.dchipm{display:inline-flex;align-items:center;gap:7px;background:var(--pale);color:var(--hd);border-radius:8px;padding:8px 12px;font-weight:800;font-size:12.5px}
.dchipm b{font-variant-numeric:tabular-nums;font-size:14px}
.metric.warn{--mc:var(--warn)}
/* coverage matrix */
.covlegend{display:flex;gap:14px;flex-wrap:wrap;margin:2px 0 12px}
.covlegend .lgi{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--ink2)}
.covlegend .sw{width:16px;height:16px;border-radius:5px;display:inline-grid;place-items:center;font-size:10px;font-weight:900}
.covwrap{overflow-x:auto;border:1.5px solid var(--line);border-radius:12px;background:var(--card);margin-bottom:8px}
.covwrap.sfreeze{overflow:visible}
table.stable thead th{position:sticky;top:53px;z-index:12}
.stable tr.detailrow{scroll-margin-top:96px}
table.covm{border-collapse:collapse;width:100%;min-width:680px;font-size:12.5px}
table.covm th,table.covm td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);text-align:center}
table.covm th:last-child,table.covm td:last-child{border-right:0}
table.covm thead th{position:sticky;top:0;z-index:2;background:var(--pale);color:var(--hd);font-weight:800;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;padding:9px 6px;line-height:1.2}
table.covm thead th .dn{display:block;font-size:9.5px;font-weight:700;color:var(--indigo2);text-transform:none;margin-top:1px}
table.covm thead th.today{background:var(--indigo);color:#fff}
table.covm thead th.today .dn{color:#C3CBEA}
table.covm th.blkh{text-align:left;width:120px}
.covm td.blk{text-align:left;font-variant-numeric:tabular-nums;font-weight:800;font-size:11.5px;color:var(--ink2);background:var(--hover);padding:6px 9px;white-space:nowrap;position:relative}
.covm td.blk .blkrm{opacity:0;position:static;margin-left:6px}
.covm tr:hover td.blk .blkrm{opacity:.85}
.covm .secrow td{background:var(--indigo);color:#fff;text-align:left;font-weight:800;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;padding:6px 10px}
.covm td.cv{padding:6px 4px;font-weight:800}
.covm td.cv.filled{background:color-mix(in srgb,var(--avail) 12%,transparent);color:var(--avail)}
.covm td.cv.off{color:var(--muted);font-weight:600}
.covm td.cv.empty{background:var(--warnbg);color:var(--warn)}
.covm td.gaps{font-variant-numeric:tabular-nums;font-weight:800;color:var(--warn);background:color-mix(in srgb,var(--warn) 7%,transparent);width:52px}
.covm td.gaps.z{color:var(--avail);background:color-mix(in srgb,var(--avail) 9%,transparent)}
.covm tfoot td{background:var(--pale);font-weight:800;font-size:11px;color:var(--hd);border-top:2px solid var(--line)}
.covm tfoot td.blk{background:var(--pale);color:var(--hd);text-transform:uppercase;letter-spacing:.05em;font-size:10.5px}

/* assignments table */
.atable{width:100%;border-collapse:collapse;background:var(--card);border:1.5px solid var(--line);border-radius:12px;overflow:hidden;font-size:13px}
.atable thead th{background:var(--pale);color:var(--hd);text-align:left;font-weight:800;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding:10px 13px}
.atable td{border-top:1px solid var(--line);padding:9px 13px;vertical-align:middle}
.atable tr:hover td{background:var(--hover)}
.atable .u{font-variant-numeric:tabular-nums;font-weight:800;color:var(--assign)}
.atable .dz{font-variant-numeric:tabular-nums;color:var(--ink2);font-weight:600}
.confbadge{display:inline-flex;align-items:center;gap:5px;color:var(--warn);background:var(--warnbg);font-weight:800;font-size:10.5px;letter-spacing:.03em;padding:4px 8px;border-radius:6px}

/* fleet page */
.fleettable{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:12.5px}
.fleettable thead th{background:var(--pale);color:var(--hd);text-align:left;font-weight:800;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase;padding:9px 12px}
.fleettable td{border-top:1px solid var(--line);padding:6px 12px;vertical-align:middle}
.fleettable tr:hover td{background:var(--hover)}
.ucell{font-variant-numeric:tabular-nums;font-weight:800}
/* simplified fleet layout */
.fleettable.simple .ucell{width:1%;white-space:nowrap;font-size:13px}
.fleetadd{display:flex;gap:8px;margin-bottom:12px;max-width:640px;flex-wrap:wrap}
.fleetadd .ftsearch{flex:1 1 100%;min-width:100%;font-size:13.5px;padding:11px 14px;border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}
.fleetadd input{flex:1;border:1.5px solid var(--line);border-radius:8px;padding:9px 12px;font:700 12.5px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.fleetadd input:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.stdot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--muted)}
.stdot.avail{background:var(--avail)} .stdot.assign{background:var(--assign)} .stdot.road{background:var(--road)} .stdot.done{background:var(--done)} .stdot.mech{background:var(--mech)} .stdot.oos{background:var(--oos)}
.fsel{appearance:none;border:1.5px solid var(--line);border-radius:7px;padding:6px 26px 6px 9px;font:800 12px/1 "Inter",system-ui,sans-serif;cursor:pointer;
  background-image:url("data:image/svg+xml,%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='%237A8698' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 9px center;background-color:var(--card);color:var(--ink)}
.fsel:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.fsel.avail{color:var(--avail);border-color:color-mix(in srgb,var(--avail) 34%,transparent);background-color:var(--availbg)}
.fsel.assign{color:var(--assign);border-color:color-mix(in srgb,var(--assign) 34%,transparent);background-color:var(--assignbg)}
.fsel.road{color:var(--road);border-color:color-mix(in srgb,var(--road) 34%,transparent);background-color:var(--roadbg)}
.fsel.done{color:var(--done);border-color:color-mix(in srgb,var(--done) 34%,transparent);background-color:var(--donebg)}
.fsel.mech{color:var(--mech);border-color:color-mix(in srgb,var(--mech) 34%,transparent);background-color:var(--mechbg)}
.fsel.oos{color:var(--oos);border-color:color-mix(in srgb,var(--oos) 34%,transparent);background-color:var(--oosbg)}
.mtag{font-size:9px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-left:6px}
.fsub{color:var(--ink2);font-size:12px;font-weight:600}
.bkcheck{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;color:var(--ink2);cursor:pointer;white-space:nowrap}
.bkcheck input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}
.delunit{border:1.5px solid var(--line);background:transparent;color:var(--muted);font:800 12px/1 "Inter",system-ui,sans-serif;width:28px;height:28px;border-radius:7px;cursor:pointer}
.delunit:hover{color:var(--oos);background:var(--oosbg);border-color:color-mix(in srgb,var(--oos) 34%,transparent)}
.driverby{color:var(--ink2);font-weight:600;font-size:12.5px}
.seg{display:inline-flex;border:1.5px solid var(--line);border-radius:8px;overflow:hidden;background:var(--card)}
.seg button{border:0;background:transparent;color:var(--muted);font:800 11.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.02em;padding:9px 12px;cursor:pointer;min-height:38px;white-space:nowrap}
.seg button+button{border-left:1.5px solid var(--line)}
.seg button.on.avail{background:var(--avail);color:#fff}
.seg button.on.assign{background:var(--assign);color:#fff}
.seg button.on.oos{background:var(--oos);color:#fff}
.seg button:not(.on):hover{background:var(--hover);color:var(--ink)}

/* roster */
.roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.dchip{display:flex;align-items:center;gap:11px;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:11px 13px}
.dchip .sw{width:20px;height:20px;border-radius:6px;flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)}
.dchip .dn{font-weight:700;font-size:14px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dchip .del{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:16px;padding:2px 4px;border-radius:5px}
.dchip .del:hover{color:var(--oos);background:var(--oosbg)}
.addrow{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.addrow input{flex:1;min-width:140px;padding:11px 13px;border:1.5px solid var(--line);border-radius:8px;font:600 14px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.addrow input:focus{outline:2px solid var(--indigo2);outline-offset:0;border-color:var(--indigo2)}
.addrow button{background:var(--indigo);border:0;color:#fff;font:800 13px/1 "Inter",system-ui,sans-serif;letter-spacing:.03em;padding:11px 18px;border-radius:8px;cursor:pointer}

.note{background:var(--warnbg);border:1.5px solid color-mix(in srgb,var(--warn) 32%,transparent);color:var(--warn);
  border-radius:10px;padding:11px 14px;font-size:13px;font-weight:600;margin-bottom:18px;display:flex;gap:9px;align-items:flex-start}
.note b{color:var(--warn)}

.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);opacity:0;max-width:min(90vw,460px);
  background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:10px;font-weight:700;font-size:13.5px;
  box-shadow:0 8px 30px rgba(0,0,0,.3);transition:.25s;pointer-events:none;z-index:200;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.warn{background:var(--warn);color:#2a2107}

.scrim{display:none}
@media(max-width:860px){
  .sidebar{position:fixed;left:0;top:0;z-index:120;transform:translateX(-100%);transition:transform .2s;box-shadow:0 0 40px rgba(0,0,0,.4)}
  .sidebar.open{transform:none}
  .hamb{display:grid;place-items:center}
  .scrim.show{display:block;position:fixed;inset:0;background:rgba(10,15,25,.5);z-index:110}
  .todaywrap{grid-template-columns:1fr}
  /* let dense board rows fit the phone instead of forcing horizontal scroll */
  .trow{min-width:0}
  .trow .dname{min-width:120px}
  .content{max-width:100vw;overflow-x:hidden}
  .tdquick-sm,.tdquick-sm input{max-width:100%}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------- print / PDF ---------- */
#printroot{display:none}
/* off-screen measure pass used to scale the schedule PDF to one page */
#printroot.measuring{display:block!important;position:fixed;left:-99999px;top:0;width:1000px;background:#fff}
@media print{
  .layout,.toast{display:none!important}
  #printroot{display:block!important}
  @page{size:landscape;margin:8mm}
  html,body{background:#fff!important}
  .p-doc{color:#111;font:400 10px/1.35 "Inter",Arial,sans-serif}
  /* schedule-only export: zoom the whole grid down so it always lands on a single page
     (zoom shrinks the real layout box, so pagination sees the smaller size — unlike transform) */
  .p-doc.p-schedonly{zoom:var(--pscale,1);width:1000px}
  .p-schedonly .p-capline{font-size:12px;font-weight:800;color:#2E3A73;margin:0 0 8px;padding-bottom:6px;border-bottom:2px solid #2E3A73}
  .p-schedonly table.p-grid tr{page-break-inside:avoid}
  .p-head{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2.5px solid #2E3A73;padding-bottom:8px;margin-bottom:12px}
  .p-title{font-size:19px;font-weight:800;letter-spacing:-.01em;color:#2E3A73}
  .p-sub{font-size:11px;color:#444;margin-top:2px;font-weight:600}
  .p-meta{text-align:right;font-size:9.5px;color:#666;line-height:1.5}
  .p-meta b{color:#222}
  table.p-grid{border-collapse:collapse;width:100%;table-layout:fixed}
  table.p-grid th,table.p-grid td{border:.75px solid #C4CAD8;padding:3px 5px;vertical-align:top}
  table.p-grid thead{display:table-header-group}
  table.p-grid thead th{background:#E7EAF6!important;color:#2E3A73;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;text-align:center;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  table.p-grid th.p-blk{width:52px;text-align:left}
  table.p-grid td.p-blk{background:#F2F4FA!important;font-weight:800;font-size:9px;white-space:nowrap;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  table.p-grid tr.p-sec td{background:#2E3A73!important;color:#fff;font-weight:800;font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .p-drv{font-weight:700;font-size:9.5px;color:#111}
  .p-drv.off{color:#9099ac;font-weight:800}
  .p-unit{font-size:8.5px;font-weight:800;color:#1D4ED8;font-variant-numeric:tabular-nums;margin-top:1px}
  .p-wknd{background:#F6F7FB!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .p-secttl{font-size:12px;font-weight:800;color:#2E3A73;margin:16px 0 6px;text-transform:uppercase;letter-spacing:.08em}
  table.p-assign{border-collapse:collapse;width:100%;margin-top:4px}
  table.p-assign th,table.p-assign td{border:.75px solid #C4CAD8;padding:4px 7px;font-size:9px;text-align:left}
  table.p-assign thead th{background:#E7EAF6!important;color:#2E3A73;font-weight:800;text-transform:uppercase;letter-spacing:.03em;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  table.p-assign td.u{font-weight:800;color:#1D4ED8;font-variant-numeric:tabular-nums}
  .p-foot{margin-top:14px;border-top:1px solid #C4CAD8;padding-top:6px;font-size:8.5px;color:#777;display:flex;justify-content:space-between}
  table.sp-grid{border-collapse:collapse;width:100%;table-layout:auto;margin-top:8px}
  table.sp-grid th,table.sp-grid td{border:.6px solid #C4CAD8;padding:3px 4px;font-size:7px;text-align:left;vertical-align:top;word-break:break-word}
  table.sp-grid thead{display:table-header-group}
  table.sp-grid thead th{background:#E7EAF6!important;color:#2E3A73;font-weight:800;text-transform:uppercase;letter-spacing:.02em;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  table.sp-grid td.pbad{color:#B4231C;font-weight:800;background:#FBE7E6!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .sp-band{margin:12px 0 2px;background:#2E3A73!important;color:#fff;font-weight:800;font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .sp-legend{font-size:8.5px;color:#555;margin:4px 0 2px;display:flex;align-items:center;gap:6px}
  .sp-legend .sp-key{display:inline-block;width:14px;height:9px;background:#FBE7E6;border:.6px solid #B4231C;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---- shared-board (Supabase) status UI ---- */
#xf-status{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;color:#1E8C63;background:#E1F1EA;border-radius:999px;padding:4px 10px;margin-right:8px;white-space:nowrap}
#xf-status.off{color:#B4451E;background:#FDECEC}
#xf-status .xf-dot{width:7px;height:7px;border-radius:50%;background:#1E8C63;flex-shrink:0}
#xf-status.off .xf-dot{background:#B4451E}
#xf-status .xf-who{color:#48566B;font-weight:600}
#xf-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#1E2A38;color:#fff;padding:9px 16px;border-radius:8px;font-size:13px;font-weight:700;opacity:0;transition:opacity .3s;z-index:9998;pointer-events:none}

/* ---- professional menu styling ---- */
.sidebar{border-right:1px solid var(--sidebar-line);box-shadow:inset -1px 0 0 rgba(20,30,50,.02)}
.snav{padding:12px 10px}
.snav button.navitem{border-radius:9px;padding:9px 11px;font:650 13px/1.1 "Inter",system-ui,sans-serif;letter-spacing:.005em;transition:background .12s,color .12s}
.snav .navgroup{color:#7A8699;font:800 10px/1 "Inter",system-ui,sans-serif;text-transform:uppercase;letter-spacing:.1em;margin:12px 4px 4px;min-height:26px}
.snav button.navitem.on{box-shadow:0 1px 3px rgba(62,111,168,.28)}
.snav button.navitem:not(.on){background:transparent}
.snav button.navitem:not(.on):hover{background:color-mix(in srgb,var(--tabc,var(--accent)) 14%,transparent)}
.brand{padding:16px 16px 12px}
.sfoot{background:color-mix(in srgb,var(--sidebar-line) 30%,var(--sidebar))}
.ssync.profbtn-side{background:var(--accent);color:#fff;border:none;font-weight:800;border-radius:9px;padding:11px}
.ssync.profbtn-side:hover{filter:brightness(1.07)}
/* content area keeps its own lighter background so the two clearly differ */
.content{background:var(--bg)}

/* ---- Block Timings: reorder shifts & blocks ---- */
.reorderwrap{display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 20px}
.rsec{flex:1 1 320px;min-width:300px;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px rgba(20,30,50,.05)}
.rsec-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;background:color-mix(in srgb,var(--indigo) 10%,var(--card));border-bottom:1px solid var(--line)}
.rsec-name{font-weight:800;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--hd)}
.rsec-move{display:flex;gap:6px;flex-shrink:0}
.rsec-blocks{padding:6px}
.rblk{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;border-radius:8px}
.rblk:hover{background:var(--hover)}
.rblk-lbl{font-weight:800;font-variant-numeric:tabular-nums;font-size:13px;color:var(--ink)}
.rblk-move{display:flex;gap:4px}
.rbtn{border:1px solid var(--line);background:var(--card);color:var(--ink2);font:800 11px/1 "Inter",system-ui,sans-serif;padding:6px 9px;border-radius:7px;cursor:pointer}
.rbtn:hover:not([disabled]){border-color:var(--accent);color:var(--accent)}
.rbtn[disabled]{opacity:.3;cursor:default}
.rbtn.sm{padding:5px 7px;font-size:11px}

.apignore{border:1px solid var(--line);background:var(--card);color:var(--muted);font:800 11px/1 "Inter",system-ui,sans-serif;padding:6px 10px;border-radius:7px;cursor:pointer;flex-shrink:0}
.apignore:hover{border-color:var(--mech);color:var(--mech)}
.aprestore{border:1px solid var(--line);background:var(--card);color:var(--accent);font:700 11px/1 "Inter",system-ui,sans-serif;padding:4px 9px;border-radius:999px;cursor:pointer;margin-left:auto}
.aprestore:hover{background:color-mix(in srgb,var(--accent) 12%,transparent)}

/* ---- strike-through a driver on the schedule ---- */
.strikebtn{flex:0 0 auto;border:1px solid var(--line);background:var(--card);color:var(--muted);font:800 10px/1 "Inter",system-ui,sans-serif;width:18px;height:18px;border-radius:5px;cursor:pointer;padding:0;opacity:0;transition:opacity .12s}
.cell:hover .strikebtn{opacity:.6}
.cell:hover .strikebtn:hover{opacity:1;border-color:var(--oos);color:var(--oos)}
.strikebtn.on{opacity:1;background:var(--oosbg);border-color:var(--oos);color:var(--oos)}
.drvin.struck{text-decoration:line-through;text-decoration-thickness:2px;color:var(--muted)!important;opacity:.7}
.struckcell{background:color-mix(in srgb,var(--oos) 6%,transparent)}

/* ---- user-management ---- */
.xfa-spin{width:16px;height:16px;border-radius:50%;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;display:inline-block;animation:xfaspin .7s linear infinite}
.xfa-spin.dark{width:14px;height:14px;border-width:2.2px;border-color:color-mix(in srgb,currentColor 28%,transparent);border-top-color:currentColor}
.xfu-toggle{margin-bottom:12px;padding:10px 12px;background:var(--hover);border-radius:9px}
.xfu-authtoggle{display:flex;align-items:center;gap:9px;font-size:13px;cursor:pointer}
.xfu-list{display:flex;flex-direction:column;gap:10px}
.xfu-row{border:1px solid var(--line);border-radius:10px;padding:10px 12px;background:var(--card)}
.xfu-main{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.xfu-name{font-weight:800;font-size:13.5px;color:var(--ink);min-width:100px}
.xfu-role,.xfu-newrole{border:1px solid var(--line);border-radius:7px;padding:6px 8px;font:700 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.xfu-edit{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--ink2);font-weight:600}
.xfu-pw{border:1px solid var(--line);background:var(--card);color:var(--ink2);font:700 11px/1 "Inter",system-ui,sans-serif;padding:6px 9px;border-radius:7px;cursor:pointer}
.xfu-del{border:1px solid var(--line);background:var(--card);color:var(--muted);font-weight:800;padding:5px 9px;border-radius:7px;cursor:pointer;margin-left:auto}
.xfu-del:hover{border-color:var(--oos);color:var(--oos)}
.xfu-pages{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.xfu-pglbl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);width:100%}
.xfu-pg{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--muted);cursor:pointer}
.xfu-pg.on{color:var(--ink2);font-weight:600}
.xfu-add{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.xfu-add input{border:1px solid var(--line);border-radius:8px;padding:9px 11px;font:600 13px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
/* view-only: disable editing controls in the content area */
body.xf-viewonly #view input:not([type=date]),
body.xf-viewonly #view select,
body.xf-viewonly #view textarea{pointer-events:none;background:var(--hover);opacity:.85}
body.xf-viewonly #view .go,
body.xf-viewonly #view .btn.primary,
body.xf-viewonly #view button[onclick*="add"],
body.xf-viewonly #view button[onclick*="Add"],
body.xf-viewonly #view .strikebtn,
body.xf-viewonly #view .blkmv,
body.xf-viewonly #view .rbtn,
body.xf-viewonly #view .apignore{display:none!important}

.xfu-pgtoggle{border:none;background:transparent;color:var(--ink2);font:800 11px/1 "Inter",system-ui,sans-serif;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;padding:2px 0;display:flex;align-items:center;gap:6px}
.xfu-pgtoggle:hover{color:var(--accent)}
.xfu-pgcount{background:var(--pale);color:var(--ink2);border-radius:999px;padding:2px 8px;font-weight:800;letter-spacing:0}
.xfu-pglist{display:flex;flex-wrap:wrap;gap:6px 10px;margin-top:8px}

/* ---- dispatch sheet: move a tour up/down ---- */
.rowmove{display:inline-flex;flex-direction:column;gap:0;vertical-align:middle;margin-right:2px}
.tourmv{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:8px;line-height:1;padding:1px 2px}
.tourmv:hover{color:var(--accent)}
td.su-exp{white-space:nowrap}

.sin.sumblock{width:78px;min-width:60px;font-variant-numeric:tabular-nums;font-weight:700;text-align:center}
table.stable td.su-block{width:80px}

td.su-move{width:26px;padding:0 2px}
td.su-move .rowmove{display:flex;flex-direction:column;gap:0;align-items:center;opacity:0;transition:opacity .12s}
tr.sumrow:hover td.su-move .rowmove{opacity:.55}
td.su-move .rowmove:hover{opacity:1}
.su-move .tourmv{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:9px;line-height:1;padding:1px 3px}
.su-move .tourmv:hover{color:var(--accent)}

/* ---- dispatch board: visible tour note + comment emoji ---- */
.trow{flex-wrap:wrap}
.notemoji{margin-left:8px;display:inline-flex;align-items:center;gap:4px;vertical-align:middle;cursor:pointer;padding:2px 9px 2px 7px;line-height:1.5;border-radius:999px;font:800 10.5px/1.5 "Inter",system-ui,sans-serif;letter-spacing:.02em;transition:background .12s,border-color .12s;border:1px solid var(--avail);background:var(--avail);color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.14)}
.notemoji .nmi{font-size:10px;filter:brightness(0) invert(1)}
.notemoji:not(.has){background:transparent;color:var(--avail);border-color:color-mix(in srgb,var(--avail) 55%,transparent);box-shadow:none;opacity:.85}
.notemoji:not(.has) .nmi{filter:none;opacity:.7}
.notemoji:hover{filter:brightness(1.06)}
.trow.shownote .notemoji{filter:brightness(1.05)}
.trownote{display:none;flex-basis:100%;width:100%;margin:6px 0 3px;padding:9px 13px;background:var(--availbg);border:1px solid color-mix(in srgb,var(--avail) 35%,transparent);border-left:4px solid var(--avail);border-radius:8px;box-shadow:0 1px 3px rgba(30,140,99,.12)}
.trow.shownote .trownote{display:block}
.trownote::before{content:"💬 NOTE";display:block;font-weight:800;font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--avail);margin-bottom:5px}
.trownote-in{width:100%;border:0;background:transparent;resize:none;overflow:hidden;font:600 12.5px/1.5 "Inter",system-ui,sans-serif;color:var(--ink);min-height:22px;padding:0}
.trownote-in:focus{outline:none}
.trownote-in::placeholder{color:var(--muted);font-weight:500}
.trow.shownote .trownote{display:block}
.trow.shownote .notemoji{transform:scale(1.15)}

/* ---- collapsible sidebar ---- */
.sbrand{position:relative}
.navcollapse{position:absolute;top:14px;right:10px;border:1px solid var(--sidebar-line);background:var(--card);color:var(--muted);width:24px;height:24px;border-radius:7px;cursor:pointer;font-size:13px;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center}
.navcollapse:hover{color:var(--accent);border-color:var(--accent)}
.navexpand{display:none;border:1px solid var(--line);background:var(--card);color:var(--ink2);width:34px;height:34px;border-radius:9px;cursor:pointer;font-size:16px;font-weight:800;align-items:center;justify-content:center;margin-right:6px}
.navexpand:hover{color:var(--accent);border-color:var(--accent)}
body.nav-collapsed .sidebar{width:0;min-width:0;border-right:0;overflow:hidden;padding:0}
body.nav-collapsed .navexpand{display:inline-flex}
@media(max-width:900px){ .navcollapse{display:none} .navexpand{display:none!important} }

/* sheet: header scrolls with the table (non-sticky) so it never overlaps rows when horizontally scrolled */


td.su-driver{max-width:210px}
td.su-driver > *{max-width:100%}
.stable td.su-driver .sstag, .stable td.su-driver .progchip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* keep the driver-cell status indicators under the name, not spilling into the Truck column */
td.su-driver{overflow:hidden}
td.su-driver .dname-in{display:block}
td.su-driver .progchip{margin-left:0;margin-top:3px}
td.su-driver .sstag{margin-left:0;margin-top:3px}
td.su-driver .goodbtn{margin-top:3px}

.milog{position:relative}
.addbar-close{position:absolute;top:-10px;right:-6px;border:1px solid var(--line);background:var(--card);color:var(--muted);width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:12px;font-weight:800;line-height:1;z-index:2}
.addbar-close:hover{border-color:var(--oos);color:var(--oos)}

.shifthead-more{display:flex;align-items:center;gap:14px;flex-wrap:wrap;flex:1}
.headtoggle{font-size:11px;padding:6px 10px;opacity:.85}

.mtable tr.mdaterow td{background:#2B3A4D !important;padding:0 !important;text-align:center !important;border:none !important}
.mdaterow-lbl{display:inline-block;color:#fff;font-weight:800;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;padding:8px 18px}
.mtable td.missue{font-weight:700;color:var(--ink);max-width:220px}
.mtable td.mnote{max-width:340px;color:var(--ink);font-weight:600}

.bkadd{display:flex;gap:6px;padding:6px 12px 10px}
.bkadd select{flex:1;border:1px solid var(--line);border-radius:8px;padding:7px 9px;font:600 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.bkadd-btn{border:0;background:#158A9B;color:#fff;font:800 12px/1 "Inter",system-ui,sans-serif;padding:8px 12px;border-radius:8px;cursor:pointer;white-space:nowrap}
.bkadd-btn:hover{filter:brightness(1.08)}
.bkchip-x{border:0;background:transparent;color:currentColor;opacity:.5;cursor:pointer;font-size:10px;padding:0 0 0 4px;font-weight:800}
.bkchip-x:hover{opacity:1}

/* ---- report download picker ---- */
.rp-overlay{position:fixed;inset:0;z-index:9000;background:rgba(20,30,50,.4);display:flex;align-items:center;justify-content:center;padding:20px}
.reportpop{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 20px 60px rgba(20,30,50,.35);padding:18px;width:360px;max-width:94vw;max-height:86vh;overflow:auto}
.rp-hd{font-weight:800;font-size:15px;color:var(--ink);margin-bottom:12px;display:flex;justify-content:space-between;align-items:center}
.rp-close{border:0;background:transparent;color:var(--muted);font-size:15px;font-weight:800;cursor:pointer;padding:2px 6px}
.rp-close:hover{color:var(--oos)}
.rp-assign{margin:12px 0;border-top:1px solid var(--line);padding-top:12px}
.rp-hint{font-size:9.5px;font-weight:600;color:var(--muted);text-transform:none;letter-spacing:0}
.rp-alist{max-height:230px;overflow:auto;margin-top:8px;display:flex;flex-direction:column;gap:5px}
.rp-arow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 2px}
.rp-abl{font-weight:800;font-variant-numeric:tabular-nums;font-size:12.5px;color:var(--ink);display:flex;align-items:center;gap:7px}
.rp-acount{background:var(--pale);color:var(--muted);border-radius:999px;padding:1px 7px;font-size:10px;font-weight:700}
.rp-asel{border:1px solid var(--line);border-radius:7px;padding:5px 8px;font:700 11.5px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink);min-width:110px}
.rp-lbl{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:5px}
.rp-sel{width:100%;border:1px solid var(--line);border-radius:8px;padding:9px 10px;font:700 13px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.rp-newrow{display:flex;gap:6px;margin:10px 0}
.rp-newinput{flex:1;border:1px solid var(--line);border-radius:8px;padding:8px 9px;font:600 12px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}
.rp-newbtn{border:1px solid var(--line);background:var(--hover);color:var(--ink2);font:700 12px/1 "Inter",system-ui,sans-serif;padding:8px 12px;border-radius:8px;cursor:pointer}
.rp-newbtn:hover{border-color:var(--accent);color:var(--accent)}
.rp-actions{display:flex;gap:8px;margin-top:6px}
.rp-btn{flex:1;border:0;color:#fff;font:800 12.5px/1 "Inter",system-ui,sans-serif;padding:10px;border-radius:8px;cursor:pointer}
.rp-btn.excel{background:var(--avail)}
.rp-btn.pdf{background:var(--accent)}
.rp-btn:hover{filter:brightness(1.07)}
/* report-group override in the shift detail header */
.dp-rg{display:inline-flex;align-items:center;gap:6px;margin-right:10px}
.dp-rg label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.dp-rgsel{border:1px solid var(--line);border-radius:7px;padding:5px 8px;font:700 11px/1 "Inter",system-ui,sans-serif;background:var(--card);color:var(--ink)}

.xfu-ownertag{display:inline-block;margin-left:7px;background:#7A5AF8;color:#fff;font:800 8.5px/1 "Inter",system-ui,sans-serif;letter-spacing:.05em;padding:3px 6px;border-radius:5px;vertical-align:middle}
.xfu-clients .xfu-pgtoggle{color:#2b7a5a}
.xfu-clients .xfu-pgcount{background:color-mix(in srgb,#2b7a5a 14%,transparent);color:#2b7a5a}



.brandlogo{width:172px;height:auto;max-height:74px;object-fit:contain;margin:2px 0;display:block}