/* All Areas Load: the web app's styles. ui/app.css (the suite's look, a copy) comes first.

   The dashboard look, copied from Tour's tour.css as General asked (29 Oct 2026: "build against the tour.css classes
   until the Patch chat lands packages/ui/dash.css"). When packages/ui/dash.css lands, delete this first part and load
   that instead. The only changes: the pass (load, not tour) and the accent, Load's olive (#A9C95A on dark, from
   ui/app.css's dark Load colours). Tour-only bits (day sheets, rooming, settlements) are left out. */
:root.dash{color-scheme:dark;--mono:"Source Code Pro",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
:root.dash:not(.x) body[data-pass="load"]{
  --page:#171717; --panel:#1C1C1C; --head:#1F1F1F; --raise:#232323; --hover:#2A2A2A;
  --text:#EDEDED; --text-2:#A1A1A1; --text-3:#8F8F8F; --line:#2E2E2E; --line-soft:#2A2A2A; --line-2:#3A3A3A;
  --link:#EDEDED; --focus:#C5DE7E;
  --ok:#3ECF8E; --ok-bg:#15291F; --warn:#F0C25A; --warn-bg:#352B12; --bad:#F38B82; --bad-bg:#3A1C1A; --info-bg:#262626;
  --brand:#A9C95A; --brand-ink:#1A2200; --brand-soft:#2A2A2A; --accent-text:#A9C95A; --aa:#C0362D;
  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:14px; line-height:1.5}
.dash a:hover{color:#FFFFFF}
.dash h1{font-size:22px;font-weight:500}
.dash h2{font-size:13px;font-weight:500}
.dash h3{font-size:13px;font-weight:600}

/* the frame: sidebar, then the trail bar over the page */
.dash .shell{display:flex;min-height:100vh}
.dash .topbar{flex:none;width:232px;height:100vh;position:sticky;top:0;overflow-y:auto;background:var(--panel);border:0;border-right:1px solid var(--line)}
.dash .topbar-in{max-width:none;margin:0;min-height:100%;padding:14px 10px;display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:2px}
.dash .aa-home{border:0;padding:4px 8px;min-height:32px;font-size:13px;color:var(--text-2)}
.dash .aa-mark{font-size:.72rem}
.dash .logo{padding:6px 8px 14px;gap:10px;font-size:14px;font-weight:600}
.dash .logo .mark{min-width:0;height:24px;padding:0 6px;border-radius:5px;font-size:.85rem}
/* Just the two marks, side by side (Angus, 28 Oct 2026: "most people will know that the all areas button is home"):
   "Home" and "Tour" stay for screen readers only. */
.dash .aa-mark{display:inline-flex;align-items:center;height:24px;padding:0 7px;border-radius:5px}
.dash .aa-word,.dash .logo-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (min-width:901px){
  .dash .topbar-in{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;align-items:center;column-gap:8px;row-gap:0}
  .dash .topbar-in > :not(.aa-home):not(.logo){grid-column:1/-1}
  .dash .side-nav{align-self:stretch}
  .dash .aa-home{padding:4px 0 4px 8px;margin-bottom:12px}
  .dash .logo{padding:4px 0;margin-bottom:12px;justify-self:start}
}
@media (max-width:900px){.dash .topbar .aa-home{padding:4px 0 4px 6px}.dash .topbar .logo{padding:4px 0}}
.dash .side-nav{display:flex;flex-direction:column;gap:2px;flex:1}
.dash .side-toggle{display:none}
.dash .menu{flex-direction:column;flex-wrap:nowrap;gap:2px}
.dash .menu a{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:6px;color:var(--text-2);font-size:13px}
.dash .menu a svg{flex:none}
.dash .menu a:hover{background:var(--hover);color:var(--text)}
.dash .menu a[aria-current]{background:var(--hover);color:var(--text);font-weight:500;box-shadow:none}
.dash .menu-head{margin:14px 10px 4px;font-size:11px;color:#7A7A7A;text-transform:uppercase;letter-spacing:.5px}
.dash .topbar .who{margin:auto 0 0;padding:10px 8px 0;border-top:1px solid var(--line);display:grid;gap:4px;font-size:13px}
.dash .me{display:flex;align-items:center;gap:10px;min-width:0}
.dash .avatar{flex:none;width:26px;height:26px;border-radius:13px;background:var(--line-2);color:var(--text);font-size:11px;display:grid;place-items:center}
.dash .me-name{color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash .me-acts{display:flex;flex-wrap:wrap;gap:0 6px;margin-left:-.4rem}
.dash .me-acts button.link{font-size:12px;color:var(--text-3);min-height:28px}
.dash .work{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.dash .crumbbar{position:sticky;top:0;z-index:5;min-height:48px;display:flex;align-items:center;gap:8px;padding:0 24px;border-bottom:1px solid var(--line);background:var(--page);font-size:13px}
.dash .crumbpath{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;white-space:nowrap;color:var(--text)}
.dash .crumbpath a{color:var(--text-2);text-decoration:none;overflow:hidden;text-overflow:ellipsis}
.dash .crumbpath a:hover{color:var(--text)}
.dash .crumbpath .sep{color:#555555}
.dash .live{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-2);white-space:nowrap}
.dash .live:empty{display:none}
.dash .live-dot{width:7px;height:7px;border-radius:4px;background:var(--accent-text)}
.dash .page{max-width:1440px;margin:0;width:100%;padding:22px 24px 64px;gap:18px}
.dash .page-head p{font-size:13px;color:var(--text-3)}

/* panels, tables and controls */
.dash .panel{background:var(--panel);border-color:var(--line);border-radius:8px}
.dash .panel-head{padding:10px 14px;background:var(--panel);border-bottom-color:var(--line);border-radius:8px 8px 0 0}
.dash .panel-head .count{font-size:12px;background:var(--hover);color:var(--text-2)}
.dash .panel-head .aside{font-size:12px}
.dash .panel-body{padding:14px}
.dash table.list{font-size:13px}
.dash table.list th{padding:8px 14px;font-size:12px;font-weight:500;color:var(--text-3);background:var(--head);border-bottom-color:var(--line);text-transform:lowercase}
.dash table.list td{padding:10px 14px;border-bottom-color:var(--line-soft);background:#171717}
.dash label{font-size:13px;font-weight:500;color:var(--text-2)}
.dash input,.dash select,.dash textarea{background:#171717;border-color:var(--line-2);border-radius:6px;min-height:32px;padding:5px 8px;font-size:13px;color:var(--text)}
.dash input:hover,.dash select:hover,.dash textarea:hover{border-color:#4A4A4A}
.dash .btn,.dash button{min-height:32px;padding:0 12px;border-radius:6px;font-size:13px;font-weight:500}
.dash button.secondary,.dash a.btn.secondary{background:var(--raise);color:var(--text);border:1px solid var(--line-2);min-height:32px;padding:0 12px}
.dash button.secondary:hover,.dash a.btn.secondary:hover{background:var(--hover)}
.dash button.link{color:var(--text-2);min-height:28px}
.dash button.link:hover{color:var(--text)}
.dash .tag{font-size:11px;font-weight:500}
.dash .tag.info{background:var(--hover);color:var(--text-2)}
.dash .note{background:var(--panel)}
.dash .quick{background:var(--head)}
.dash .quick-row input{min-height:36px;font-size:13px}
.dash .crumbs{font-size:13px}
.dash .toast{background:#EDEDED;color:#111111;font-weight:500;font-size:13px}
.dash .toast-btn{color:#111111}
.dash dialog{border-color:var(--line-2)}
.dash dialog::backdrop{background:rgba(0,0,0,.6)}
.dash kbd{font-family:var(--mono)}
/* times and codes in Source Code Pro */

/* the day sheet's summary tiles, changed lines and change log */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.tile{background:var(--head);border:1px solid var(--line);border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.tile .k{font-size:12px;color:var(--text-3)}
.tile .v{font-size:20px;line-height:1.25;overflow-wrap:anywhere}
.tile .v small{font-size:13px;color:var(--text-3)}
.tile .v .mono{font-size:14px;color:var(--text-3)}
@media (max-width:560px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tile{padding:10px 12px;gap:4px}.tile .v{font-size:17px}}
.chg{display:inline-block;margin-top:4px;font-size:11px;border:1px solid var(--accent-text);color:var(--accent-text);border-radius:4px;padding:2px 6px;white-space:nowrap;font-weight:500}
.log{list-style:none;margin:0;padding:0}
.log li{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-bottom:1px solid var(--line-soft);font-size:13px}
.log li:last-child{border-bottom:0}
.log .sub{font-size:12px;color:var(--text-3)}
.log-foot{display:block;padding:10px 14px;border-top:1px solid var(--line);font-size:12px;color:var(--text-2);text-decoration:none}

/* phones and small windows: the sidebar becomes a bar, and the menu folds away behind Menu */
@media (max-width:900px){
  .dash .shell{flex-direction:column}
  .dash .topbar{width:auto;height:auto;position:sticky;top:0;z-index:10;border-right:0;border-bottom:1px solid var(--line);overflow:visible}
  .dash .topbar-in{flex-direction:row;flex-wrap:wrap;align-items:center;padding:8px 12px;gap:4px 8px;min-height:0}
  .dash .logo{padding:4px 6px}
  .dash .side-toggle:not([hidden]){display:inline-flex;align-items:center;margin-left:auto;background:var(--raise);color:var(--text);border:1px solid var(--line-2);min-height:36px}
  .dash .side-nav{display:none;flex-basis:100%;padding:6px 0 4px}
  .dash .topbar.open .side-nav{display:flex}
  .dash .menu{overflow:visible;margin:0;padding:0;order:0;flex:none}
  .dash .menu a{padding:10px;font-size:14px}
  .dash .topbar .who{margin-top:8px}
  .dash .crumbbar{position:static;padding:0 16px}
  .dash .page{padding:16px 16px 56px}
  .dash input,.dash select,.dash textarea,.dash .btn,.dash button{min-height:40px}
  .dash button.link{min-height:32px}
}
@media (max-width:560px){.dash .live{display:none}}
@media print{
  .dash .shell{display:block}
  .dash .crumbbar{display:none}
  .dash body,:root.dash:not(.x) body[data-pass="load"]{background:#fff;color:#111}
  .dash .page{padding:0}
}

/* ================================================================ Load's own bits */
[hidden]{display:none!important}
.grid{display:grid;gap:12px;min-width:0}
.grid > *{min-width:0}
.table-wrap{position:relative} /* keeps screen-reader-only labels inside the scroll box */
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:900px){.grid.cols-4,.grid.cols-5{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.cols-3{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.grid.cols-2,.grid.cols-3{grid-template-columns:1fr}}
.dash .menu a.sub{padding-left:24px;font-size:12.5px}
.dash .menu a.sub svg{width:14px;height:14px}
.sub{display:block}
.checks{display:flex;flex-wrap:wrap;gap:6px 18px}
.dash .check{display:flex;align-items:center;gap:8px;font-weight:400;color:var(--text)}
.dash .check input{width:16px;height:16px;min-height:0}
.dash label.inline{display:inline-flex;align-items:center;gap:8px}
.dash label.inline select{width:auto}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.job-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.job-acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.link.danger{color:var(--bad)}
.dims{display:inline-flex;align-items:center;gap:4px}
.dims input{width:6.2rem}
.search input{max-width:28rem}
details summary{cursor:pointer;min-height:28px;color:var(--text-2)}
details[open] summary{margin-bottom:8px}
fieldset.pickcases{border:1px solid var(--line);border-radius:8px;padding:10px 12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px 14px;margin:0}
fieldset.pickcases legend{padding:0 6px;font-size:12px;color:var(--text-3)}
.tile.bad .v{color:var(--bad)}
.status.ok{color:var(--ok)}.status.bad{color:var(--bad)}
.linkbox{display:flex;gap:8px}
.linkbox input{flex:1;font-family:var(--mono)}

/* the truck pack (from the prototype) */
table.packrows{min-width:1080px}
table.packrows td{vertical-align:middle;padding:6px 8px}
table.packrows td.num input{width:5.4rem}
table.packrows td.name{min-width:14rem}
table.packrows .guess{display:block;margin-top:3px;font-size:12px;color:var(--warn)}
.tcol{display:none}
table.multi .tcol{display:table-cell}
.trucktabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:0 0 12px}
.trucktabs [role=tab],.viewtabs [role=tab]{background:none;color:var(--text-2);border:0;border-bottom:2px solid transparent;border-radius:0;padding:6px 12px;font-weight:500;text-align:left;min-height:36px}
.trucktabs [role=tab][aria-selected=true],.viewtabs [role=tab][aria-selected=true]{color:var(--text);border-bottom-color:var(--brand)}
.trucktabs .tsub{display:block;font-size:12px;font-weight:400;color:var(--text-3)}
.viewtabs{display:flex;gap:4px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:14px 0 8px}
.viewtabs .heat{margin-left:auto}
.layouts{border:1px solid var(--line);border-radius:8px;padding:10px 12px;margin:12px 0 0}
.lay-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lay-title{flex:1 1 260px;min-width:0}
.lay-btns{display:flex;gap:8px}
.score{display:inline-block;font-size:12px;border-radius:4px;padding:0 6px;background:var(--ok-bg);color:var(--ok);font-weight:600;white-space:nowrap}
.score.mid{background:var(--warn-bg);color:var(--warn)}
.score.low{background:var(--bad-bg);color:var(--bad)}
.lay-notes{margin:6px 0 0;padding-left:1.1rem;font-size:13px;color:var(--text-2)}
.deck{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:#1F1F1F}
.deck svg{display:block;width:100%;min-width:760px;height:auto;touch-action:pan-x pan-y}
.deck g.stk{cursor:grab;outline:none;touch-action:none}
.deck g.stk:focus rect.box,.deck g.stk.dragging rect.box{stroke:var(--text);stroke-width:3;stroke-dasharray:6 3}
.deck g.stk.dragging{cursor:grabbing;opacity:.85}
.deck-help{color:var(--text-3);font-size:12.5px;margin:6px 0 0}
.view-h{font-size:13px;margin:14px 0 6px;color:var(--text-2);font-weight:500}
.legend{list-style:none;display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 6px;padding:0;font-size:12px;color:var(--text-2)}
.legend li{display:flex;align-items:center;gap:6px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;border:1px solid #0006}
.stage3d{margin-top:10px;border:1px solid var(--line);border-radius:6px;min-height:280px;overflow:hidden;background:#1F1F1F}
.stage3d canvas{display:block}
.stage3d .msg{padding:16px;margin:0;color:var(--text-2)}
.axles{display:grid;gap:6px;margin:12px 0 0}
.axrow{display:grid;grid-template-columns:minmax(6.5rem,auto) minmax(60px,1fr) auto;gap:10px;align-items:center;font-size:13px}
.axrow .track{height:10px;border-radius:5px;background:var(--raise);border:1px solid var(--line);overflow:hidden}
.axrow .track i{display:block;height:100%;background:var(--ok)}
.axrow.warnish .track i{background:var(--warn)}
.axrow.over .track i{background:var(--bad)}
.axrow.over .av{color:var(--bad);font-weight:600}
@media (max-width:480px){.axrow{grid-template-columns:1fr auto}.axrow .track{grid-column:1 / -1;grid-row:2}}
details.axlebox{border:1px solid var(--line);border-radius:8px;padding:8px 12px}
ol.order{columns:3 16rem;margin:0;padding-left:1.6rem;font-size:13px}
ol.order li{break-inside:avoid;margin-bottom:2px}
ul.warnlist{margin:10px 0 0;padding-left:1.1rem;color:var(--bad);font-size:13px}
ul.warnlist:empty{display:none}
.offlist{list-style:none;margin:0;padding:0}
.offlist li{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line-soft)}
.offlist .what{flex:1 1 220px;min-width:0}
.offlist .why{display:block;color:var(--text-3);font-size:12.5px}
.lblctl{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;align-items:start}
.lblctl:empty{display:none}
.lblctl .lbl-tune{grid-column:1 / -1}
.lblctl .lbl-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}

/* tour trucking */
ul.legs{list-style:none;margin:0;padding:0}
ul.legs .leg{display:flex;gap:14px;justify-content:space-between;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--line-soft)}
ul.legs .leg-main{display:grid;gap:3px;min-width:0}
ul.legs .leg.stay{display:grid;gap:2px;color:var(--text-2)}
ul.legs .km{display:grid;gap:4px;font-size:12px;width:7.5rem;flex:none}
ul.legs .notes{margin:4px 0 0;padding-left:1.1rem;font-size:12.5px;color:var(--warn)}

/* printing: only the print areas show */
.labels,.sheets{display:none}
@media print{
  @page{size:A4;margin:12mm}
  body{background:#fff!important;color:#000!important}
  .shell,.toast,dialog{display:none!important}
  body[data-print=labels] .labels{display:grid;grid-template-columns:1fr 1fr;gap:6mm;padding:6mm}
  body[data-print=sheet] .sheets{display:block}
  .label{border:2px solid #000;border-radius:3mm;padding:4mm;break-inside:avoid;font:12pt/1.3 Arial,sans-serif}
  .label .big{font:700 18pt/1.1 Arial,sans-serif}
  .label .meta{display:flex;justify-content:space-between;margin-top:2mm;font-size:10pt}
  .label .first{display:inline-block;border:2px solid #000;padding:0 2mm;font-weight:700;margin-left:2mm}
  .label .lqr{float:right;margin:0 0 2mm 3mm}
  .label .lqr svg{width:26mm;height:26mm;display:block}
  .packlist table{width:100%;border-collapse:collapse;font:10pt Arial,sans-serif}
  .packlist th,.packlist td{border:1px solid #000;padding:1.5mm 2mm;text-align:left}
  .gl{break-after:page;font:9pt/1.3 Arial,sans-serif;color:#000}
  .gl:last-child{break-after:auto}
  .gl header{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid #000;padding-bottom:2mm;margin-bottom:2mm}
  .gl h1{font:700 14pt Arial,sans-serif;margin:0}
  .gl .meta{display:grid;grid-template-columns:auto auto;gap:0 6mm;font-size:9pt}
  .gl table{width:100%;border-collapse:collapse}
  .gl th,.gl td{border:1px solid #000;padding:1.2mm 1.5mm;vertical-align:top;text-align:left}
  .gl th{font-size:8.5pt;background:#eee}
  .gl td.n{text-align:right;white-space:nowrap}
  .gl .foot{font-size:8pt;margin-top:2mm}
}
ul.legs .leg-main .tag{justify-self:start}
.dash input::placeholder{color:#6B6B6B}