/* RK Vacancy Self-Serve: staff Request Review (queue, drawer and request workspace).
   One visual language: dark green top bar, a system UI font, 8px-radius controls at 40px
   (44px on touch screens), one custom dropdown for every simple select, and one toggle style. */
:root{
  --g900:#1F3D14;--g800:#2E5A1C;--g600:#3D7325;--g100:#E3EEDC;--g50:#F1F6EE;
  --bg:#F4F6F3;--card:#fff;--line:#E3E8E0;--line2:#CDD6C9;--ink:#17211A;--ink2:#3E4A3F;--muted:#667365;
  --amber-ink:#7A4600;--amber-bg:#FFF5E3;--amber-line:#F0D29C;--amber-dot:#D98A00;--red-ink:#A3321F;
  --focus:#B87800;
  --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-family:var(--font);color:var(--ink);background:var(--bg);font-size:14px;line-height:1.45;-webkit-text-size-adjust:100%
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font);-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}
p{line-height:1.55}
svg{flex:none}
small{display:block;color:var(--muted);font-size:13px;line-height:1.45;margin-top:2px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
/* Focus the page moved there itself (a cold load, deep link or mouse open) draws no ring until a key is pressed. */
[data-quiet-focus]:focus-visible{outline:none!important;box-shadow:none!important}
button{font:inherit;font-weight:600;font-size:14px;background:var(--g600);color:#fff;border:1px solid var(--g600);border-radius:8px;padding:9px 16px;cursor:pointer;min-height:40px;line-height:1.3}
button:hover{background:var(--g800);border-color:var(--g800)}
button:disabled{background:#EEF0EC;color:#626862;border-color:#DADFD7;cursor:default}
input,textarea{font:inherit;color:var(--ink)}

/* ---- Top bar ------------------------------------------------------------------- */
.topbar{background:var(--g900);color:#fff}
.topbar-in{max-width:1440px;margin:0 auto;padding:0 24px;min-height:56px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;row-gap:8px}
.topbar-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-left:auto}
/* The desk name stays on every width (Joe: drop "vacancy", keep "Contract Logistics Desk"): beside the wordmark on
   wide screens, stacked under it (smaller) where the header is tight. */
.brand-lockup{display:inline-flex;align-items:center;gap:14px;min-width:0}
@media(max-width:1100px) and (min-width:641px){.topbar-in{padding-top:8px;padding-bottom:8px}.brand-lockup{flex-direction:column;align-items:flex-start;gap:1px}.brand-lockup .brand-sub{padding-left:0;border-left:0;font-size:12px;line-height:1.25}}
.brand{font-weight:800;letter-spacing:.14em;font-size:13px;white-space:nowrap;color:#fff;text-decoration:none}
a.brand:hover{text-decoration:underline;text-underline-offset:4px}
.brand-sub{color:#BCD0B3;font-size:13px;padding-left:14px;border-left:1px solid rgba(255,255,255,.22);white-space:nowrap}
.dev-badge{margin-left:0;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#F8E6BC;background:rgba(248,230,188,.10);border:1px solid rgba(248,230,188,.35);border-radius:999px;padding:3px 10px;white-space:nowrap;cursor:help}
.dev-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:#F2C14E}
.topbar-signout,.topbar-link{background:transparent;border:1px solid rgba(255,255,255,.28);color:#fff;min-height:34px;padding:5px 12px;font-size:13px;white-space:nowrap}
a.topbar-link{display:inline-flex;align-items:center;gap:6px;border-radius:8px;font-weight:600;line-height:1.3;text-decoration:none;box-sizing:border-box}
a.topbar-link svg{width:13px;height:13px;flex:none}
.topbar-signout:hover,.topbar-link:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.5)}
.topbar-who{color:#DDE8D6;font-size:13px;font-weight:600;overflow-wrap:anywhere;min-width:0}
.topbar :focus-visible{outline-color:#F2C14E}
@media(max-width:640px){
  .topbar-nav{display:contents}
  .topbar-in{padding:6px 12px;gap:6px 10px;flex-wrap:wrap}
  .brand-lockup{order:1;flex-direction:column;align-items:flex-start;gap:1px}
  .brand-lockup .brand-sub{padding-left:0;border-left:0;font-size:12px;line-height:1.25;white-space:nowrap}
  .brand{font-size:12px;letter-spacing:.1em}
  .topbar-signout{min-height:44px;order:2;margin-left:auto}
  .dev-badge{order:3}
  .topbar-who{order:4}
  .topbar-link{order:5;min-height:44px}
}
@media(max-width:560px){.dev-badge{margin-left:0;margin-bottom:4px}}
/* Pages menu: the staff pages (Exceptions, Pilot Numbers, Capability Register, Facility File, Staff Accounts)
   share one header button so the header stays on one row. */
.topbar-menu{position:relative;display:inline-flex}
#nav-pages{display:inline-flex;align-items:center;gap:6px}
#nav-pages svg{width:13px;height:13px;flex:none;transition:transform .15s}
#nav-pages[aria-expanded="true"] svg{transform:rotate(180deg)}
.topbar-menu-list{position:absolute;right:0;top:calc(100% + 6px);z-index:60;display:flex;flex-direction:column;gap:2px;min-width:220px;padding:6px;background:#fff;border:1px solid var(--line2);border-radius:10px;box-shadow:0 10px 28px rgba(16,32,16,.18)}
.topbar-menu-list[hidden],.topbar-menu-item[hidden]{display:none}
.topbar-menu-item{background:transparent;border:0;color:var(--ink);text-align:left;font-size:14px;font-weight:600;padding:9px 12px;border-radius:6px;min-height:40px;white-space:nowrap}
.topbar-menu-item:hover,.topbar-menu-item:focus-visible{background:#EEF3EA;color:var(--g900)}
.topbar .topbar-menu-item:focus-visible{outline:2px solid var(--g600);outline-offset:-2px}
@media(max-width:640px){
  /* On phones the list opens under the whole header, inset like the page, wherever the button wrapped to. */
  .topbar-in{position:relative}
  .topbar-menu{order:5;position:static}
  #nav-pages{min-height:44px}
  .topbar-menu-list{left:12px;right:12px;top:calc(100% + 4px);min-width:0}
  .topbar-menu-item{min-height:44px}
}

@media(max-width:360px){.brand{letter-spacing:.06em;font-size:11px}.dev-badge{padding:3px 8px;font-size:11px}}

/* ---- Page --------------------------------------------------------------------- */
main{max-width:1440px;margin:0 auto;padding:20px 24px 48px}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ttl{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0}
h1{font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
.meta{color:var(--muted);font-size:13px}
.actions{display:flex;gap:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border-radius:8px;font-weight:600;font-size:13px;white-space:nowrap}
.btn svg{width:16px;height:16px}
.btn-primary{background:var(--g600);color:#fff;border:1px solid var(--g600)}
.btn-primary:hover{background:var(--g800);border-color:var(--g800)}
.btn-secondary{background:#fff;color:var(--g800);border:1px solid var(--line2)}
.btn-secondary:hover{background:var(--g50);border-color:#9DB096}
.btn-secondary:disabled{background:#fff;color:#8A9588;border-color:var(--line)}
.btn-ghost{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;min-height:32px;padding:0 8px;background:transparent;border:0;color:var(--g800);font-weight:600;font-size:13px;border-radius:6px}
.btn-ghost svg{width:14px;height:14px}
.btn-ghost:hover{background:var(--g100);color:var(--g800)}
.panel{background:#fff;border:1px solid var(--line);border-radius:10px}
#message:empty{display:none}
#message:not(:empty){margin:0 0 12px;padding:10px 12px;border:1px solid var(--amber-line);border-radius:8px;background:var(--amber-bg);color:var(--amber-ink);font-size:14px}
.signin{max-width:560px;padding:20px 22px}
.signin h2{font-size:18px;margin:0 0 6px}
.signin p{margin:0 0 14px;color:var(--ink2)}
.signin label{display:block;font-size:13px;font-weight:600;color:var(--ink2)}
.signin input{display:block;width:100%;max-width:420px;height:40px;margin:6px 0 16px;padding:0 12px;border:1px solid var(--line2);border-radius:8px;background:#fff}

/* ---- Summary --------------------------------------------------------------------- */
.queue-summary{margin-bottom:12px;padding:0}
/* One strip across the top: the five counts share the full width equally, the Routed to line beneath. */
#queue-summary-body{padding:14px 16px 12px}
.sum-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch}
.metric{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px;min-width:0;min-height:52px;padding:2px 16px;margin:0;border:0;border-left:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:inherit;text-align:left;white-space:normal}
.metric:first-child{padding-left:0;border-left:0}
.metric b{font-size:22px;line-height:1.15;font-weight:700;font-variant-numeric:tabular-nums}
.metric span{color:var(--muted);font-weight:400;font-size:13px;line-height:1.3}
button.metric{cursor:pointer}
button.metric:hover{background:transparent;border-color:var(--line);color:var(--ink)}
button.metric:hover span{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
button.metric.is-on span{color:var(--g800);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.metric.warn b{color:var(--amber-ink)}
.metric.bad b{color:var(--red-ink)}
@media(max-width:760px){
  #queue-summary-body{padding:12px 12px 10px}
  .sum-metrics{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:10px}
  .metric{min-height:0;padding:0 10px}
  .metric:nth-child(3n+1){padding-left:0;border-left:0}
  .metric b{font-size:19px}
  .metric span{font-size:12.5px}
}
.routes{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);color:var(--ink2);font-size:13px}
.routes-title{color:var(--muted)}
.routes b{font-weight:700;margin-left:4px;font-variant-numeric:tabular-nums}
.route{white-space:nowrap}
button.route{display:inline-flex;align-items:baseline;min-height:30px;padding:0;border:0;border-radius:0;background:transparent;color:inherit;font:inherit;font-weight:400;line-height:inherit;cursor:pointer}
button.route:hover{background:transparent;border-color:transparent;color:var(--ink)}
button.route:hover .route-label{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
button.route.is-on .route-label{color:var(--g800);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* ---- Toolbar: search, dropdowns, Clear filters, count ------------------------------ */
.queue-panel{overflow:visible}
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;border-bottom:1px solid var(--line)}
.search-wrap{position:relative;flex:0 1 300px;min-width:0}
.search-wrap svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--muted);pointer-events:none}
.search{display:block;width:100%;height:40px;margin:0;padding:0 12px 0 36px;border:1px solid var(--line2);border-radius:8px;background:#fff;font-size:13px;color:var(--ink)}
.search::placeholder{color:#7A8578}
.search:hover{border-color:#9DB096}
.search:focus{outline:none;border-color:var(--g600);box-shadow:0 0 0 3px rgba(61,115,37,.18)}
.search:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.sel{flex:none;min-width:0}
#main .toolbar .rk-select-button{font-size:13px}
.m-sort{display:none!important}
.toolbar .count{margin:0 0 0 auto;color:var(--muted);white-space:nowrap;font-size:13px;line-height:1.3}
#queue-clear{min-height:32px}

/* ---- Custom dropdown (button + listbox) ------------------------------------------ */
/* Behaviour and menu rules are shared with the public form: /css/vacancy-ui.css. */
#main .rk-select-button{display:flex;align-items:center;gap:8px;width:100%;min-height:40px;margin:0;padding:8px 12px;border:1px solid var(--line2);border-radius:8px;background:#fff;color:var(--ink);font:400 14px/1.35 var(--font);text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s,background-color .15s}
#main .rk-select-inline .rk-select-button{width:auto;max-width:100%}
.rk-select-label{color:var(--muted)}
#main .rk-select-button:hover{background:#fff;border-color:#9DB096;color:var(--ink)}
#main .rk-select-button:focus{outline:none}
#main .rk-select-button:focus-visible,#main .rk-select.is-open .rk-select-button{border-color:var(--g600);box-shadow:0 0 0 3px rgba(61,115,37,.18)}
#main .rk-select-button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
#main .rk-select.is-set .rk-select-button{border-color:var(--g600);background:var(--g50);color:var(--g900)}
#main .rk-select-button:disabled{background:#F3F4F2;color:#6B736B;border-color:var(--line);cursor:default;box-shadow:none}
#main .rk-select.is-invalid .rk-select-button{border-color:var(--red-ink)}
.rk-menu{font:400 14px/1.35 var(--font);color:var(--ink)}
@media(max-width:960px),(pointer:coarse){#main .rk-select-button{min-height:44px}}

/* ---- Table --------------------------------------------------------------------- */
#requests{min-width:0}
#requests > .empty{margin:0;padding:40px 16px;text-align:center;color:var(--muted)}
.tbl{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.tbl th{background:#FAFBF9;font-size:12px;font-weight:600;color:var(--muted);text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:bottom}
.tbl th:first-child,.tbl td:first-child{padding-left:16px}
.tbl th:last-child,.tbl td:last-child{padding-right:16px}
.tbl td{padding:9px 10px;border-bottom:1px solid #EDF0EB;vertical-align:top;line-height:1.4;color:var(--ink)}
.tbl tbody tr:last-child td{border-bottom:0}
.queue-table tbody tr{cursor:pointer}
.queue-table tbody tr:hover td,.queue-table tbody tr.is-open td{background:#F6F9F4}
.th-sort{display:inline-flex;align-items:center;gap:4px;min-height:0;padding:4px 6px;margin:-4px -6px;border:0;border-radius:6px;background:transparent;color:inherit;font:inherit;font-weight:inherit;white-space:nowrap;transition:background .15s,color .15s}
.th-sort:hover,.th-sort:focus-visible{background:rgba(23,33,26,.06);color:var(--ink);border:0}
.th-sort.is-sorted{color:var(--ink)}
.sort-ico{width:12px;height:12px}
.th-sort[data-dir=asc] .sort-ico{transform:rotate(180deg)}
.request-link{display:inline;min-height:0;padding:0;margin:0;border:0;background:none;color:var(--ink);font-weight:600;font-size:13px;line-height:1.4;text-align:left;white-space:normal;overflow-wrap:anywhere;border-radius:3px}
.request-link:hover{background:none;color:var(--g800);border:0;text-decoration:underline;text-underline-offset:2px}
.queue-table tr:hover .request-link{color:var(--g800);text-decoration:underline;text-underline-offset:2px}
.sub{display:block;color:var(--muted);font-size:13px;margin:0}
.c-co{min-width:190px}
.c-next{min-width:150px}
/* Saved text (company, warehouse, owner, next action) wraps, and unbroken tokens break, so no
   value can push the table wider than its card. Short fixed values stay on one line. */
.queue-table td{overflow-wrap:break-word}
.queue-table :is(.c-co,.c-next){overflow-wrap:anywhere}
.queue-table .c-owner{min-width:8.5em;overflow-wrap:anywhere}
.c-status,.c-due,.c-attn,.c-saved{white-space:nowrap}
.c-routed > span:first-child{white-space:nowrap}
.c-routed small.sub{white-space:normal;max-width:200px}
.owner-sub{display:none}
/* The company column keeps a steady share, so ordinary names stay on one line and only very
   long ones wrap (instead of widening the table past the card). */
@media(min-width:961px){.queue-table .c-co{width:26%}}
.dash{color:#A3AFA0}
.st-wrap{display:inline}
.st{display:inline-flex;align-items:baseline;gap:6px;font-weight:600;white-space:nowrap}
.st-dot{width:8px;height:8px;border-radius:50%;flex:none;align-self:center}
.st-sub{color:var(--g900)}.st-sub .st-dot{background:var(--g600)}
.st-prog{color:var(--ink2)}.st-prog .st-dot{background:transparent;border:2px solid #7D8A7B}
.st-none .st-dot{background:#C9CFC6}
.st-date{color:var(--muted);font-weight:400;white-space:nowrap}
.badge-attn{display:inline-flex;align-items:center;gap:6px;min-height:22px;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--amber-bg);color:var(--amber-ink);border:1px solid var(--amber-line);line-height:1.2}
.badge-attn::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amber-dot)}
.due{white-space:nowrap}
.due.is-overdue{color:var(--red-ink);font-weight:600}
.nr{color:#7A8578}
.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-top:1px solid var(--line)}
.pager span{color:var(--muted);font-size:13px}
.pager .btn{min-width:96px}
/* Filter refetch: keep the current results on screen, dimmed, until the new ones arrive. */
.queue-refreshing :is(#requests,#queue-count,#queue-summary-body,.pager){opacity:.5;transition:opacity .12s ease}
@media(prefers-reduced-motion:reduce){.queue-refreshing :is(#requests,#queue-count,#queue-summary-body,.pager){transition:none}}
/* Plain list (work queue projection disabled). */
.plain-table th:first-child{width:30%}
.plain-table td{overflow-wrap:anywhere}
/* Folding: Owner moves under Routed to and the submitted date drops below the status. */
/* QA fix 3 integration: the reply clock's date and time never split (NEW-8), so from 1181 to 1280 px the submitted
   date drops below the status too and the eight columns still fit (no sideways scroll at 1181 px). */
@media(max-width:1280px){.queue-table .st-date{display:block;margin-top:1px}}
@media(max-width:1180px){
  .queue-table .c-owner{display:none}
  .queue-table .owner-sub{display:block}
  .queue-table .st-date{display:block;margin-top:1px}
  .c-co{min-width:160px}
  .c-next{min-width:120px}
}
@media(max-width:1000px){.queue-table .c-routed small.sub{max-width:150px}}
/* Phones and narrow tablets: each request becomes a compact card; nothing scrolls sideways.
   Below about 960px the eight columns cannot fit without the page scrolling sideways. */
@media(max-width:960px){
  main{padding:16px 12px 32px}
  .page-head{align-items:flex-start}
  .actions{width:100%}.actions .btn{flex:1;min-height:44px}
  .toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .toolbar .search-wrap{grid-column:1/-1;flex:none}
  .search{height:44px;font-size:16px}
  .sel{min-width:0}
  .toolbar .rk-select-inline{display:block}
#main .toolbar .rk-select-inline .rk-select-button{width:100%}
  .toolbar .rk-select-inline .rk-select-text{white-space:normal}
  /* A long choice wraps; the box beside it in the same row matches its height. */
  .toolbar .sel{align-self:stretch}.toolbar .sel>.rk-select-inline{height:100%}#main .toolbar .sel .rk-select-button{height:100%}
  .m-sort{display:block!important;grid-column:1/-1}
  .toolbar .count{margin:0;grid-column:1;align-self:center}
  #queue-clear{grid-column:2;justify-self:end;min-height:44px}
  .queue-table thead{display:none}
  .queue-table,.queue-table tbody{display:block}
  .queue-table tr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"co co saved" "st at at" "ro ro ro" "nx nx nx" "du du du";gap:3px 10px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .queue-table tbody tr:last-child{border-bottom:0}
  .queue-table td{display:block;padding:0!important;border:0!important;background:none!important;white-space:normal;min-width:0}
  .queue-table .c-co{grid-area:co;min-width:0}
  .queue-table .c-saved{grid-area:saved;text-align:right;color:var(--muted)}
  .queue-table .c-status{grid-area:st}
  .queue-table .c-attn{grid-area:at;align-self:center}
  /* Pre-Joe integration: a long attention badge ('Offer accepted') wraps inside its cell instead of running past the
     card when the status beside it is long (it ran to the screen edge at 390 px). */
  .queue-table .c-attn .badge-attn{white-space:normal;max-width:100%}
  .queue-table .c-routed{grid-area:ro;color:var(--ink2)}
  .queue-table .c-routed > span:first-child::before{content:"Routed to ";color:var(--muted)}
  .queue-table .c-routed .owner-sub{display:block}
  .queue-table .c-routed small.sub{max-width:none}
  .queue-table .c-owner{display:none}
  .queue-table .c-next{grid-area:nx;min-width:0;color:var(--ink2)}
  .queue-table .c-due{grid-area:du}
  .queue-table .c-due .due::before{content:"Due "}
  .queue-table td.is-empty{display:none}
  .queue-table .st-date{display:inline;margin:0}
  .request-link{font-size:14px;padding:2px 0}
  .plain-table,.plain-table tbody,.plain-table tr,.plain-table td{display:block;width:100%}
  .plain-table thead{display:none}
  .plain-table tr{border-bottom:1px solid #EDF0EB;padding:10px 14px}
  .plain-table td{border:0;padding:3px 0!important}
  .plain-table td[data-label]::before{content:attr(data-label) ': ';font-size:12px;color:var(--muted);font-weight:600}
  .pager{flex-wrap:wrap}
  .pager .btn{min-height:44px}
}
/* Very narrow phones: the submitted date drops under the status so the attention badge fits beside it. */
@media(max-width:359px){.queue-table .c-status .st-date{display:block}}

/* ---- Drawer ----------------------------------------------------------------------- */
html.drawer-open{overflow:hidden}
.scrim{position:fixed;inset:0;background:rgba(18,28,15,.32);z-index:50;opacity:0;transition:opacity .2s}
.scrim.show{opacity:1}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(500px,100%);background:#fff;z-index:60;display:flex;flex-direction:column;box-shadow:-12px 0 40px rgba(18,28,15,.16);transform:translateX(100%);transition:transform .24s cubic-bezier(.2,.8,.2,1);font-size:14px}
.drawer.show{transform:none}
@media(prefers-reduced-motion:reduce){.drawer,.scrim{transition:none}}
.drawer-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 16px;border-bottom:1px solid var(--line)}
.drawer-close{min-height:36px;border:1px solid transparent}
.drawer-nav{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:13px;white-space:nowrap}
.icon-btn{width:36px;height:36px;min-height:0;display:grid;place-items:center;padding:0;border:0;border-radius:8px;background:transparent;color:var(--ink2)}
.icon-btn:hover{background:var(--g50);color:var(--ink2)}
.icon-btn:disabled{opacity:.35;background:none}
.icon-btn svg{width:16px;height:16px}
.drawer-body{flex:1;overflow:auto;padding:20px 24px 8px;overflow-wrap:anywhere}
.drawer-foot{padding:14px 24px;border-top:1px solid var(--line);display:flex;justify-content:flex-end}
.drawer-foot svg{width:16px;height:16px}
.d-wh{font-size:13px;color:var(--muted);margin:0 0 2px}
.d-title{font-size:20px;line-height:1.25;font-weight:700;color:var(--ink);margin:0}
.d-badges{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:10px}
.d-sec{padding:16px 0;border-top:1px solid var(--line)}
.d-head+.d-sec,.d-head+.ws-state{margin-top:16px}
.d-sec h3{font-size:13px;font-weight:700;color:var(--ink);margin:0 0 10px;display:flex;align-items:center;gap:8px}
.d-dl{display:grid;grid-template-columns:112px minmax(0,1fr);gap:7px 16px;margin:0}
.d-dl dt{color:var(--muted);font-weight:400}
.d-dl dd{margin:0;color:var(--ink);overflow-wrap:anywhere}
.d-attn ul{list-style:none;display:grid;gap:8px;margin:0;padding:0}
.d-attn li{position:relative;padding-left:16px}
.d-attn li::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--amber-dot)}
.d-link{display:inline;min-height:0;padding:0;border:0;background:none;color:var(--ink);font:inherit;font-weight:400;text-align:left;white-space:normal;text-decoration:underline;text-decoration-color:#B9C4B5;text-underline-offset:3px}
.d-link:hover{background:none;color:var(--g800);text-decoration-color:currentColor}
.d-evidence dt .d-link{color:var(--g800);font-weight:600}
.tag{display:inline-flex;align-items:center;height:20px;padding:0 7px;border-radius:5px;background:#EEF0EC;color:var(--ink2);font-size:11px;font-weight:600;letter-spacing:.01em}
@media(max-width:760px){
  .drawer{left:0;width:auto}
  .drawer-bar{padding:6px 12px}
  .drawer-close,.icon-btn{min-height:44px;height:44px}
  .icon-btn{width:44px}
  .drawer-body{padding:16px 16px 8px}
  .d-dl{grid-template-columns:minmax(96px,34%) minmax(0,1fr);gap:7px 12px}
  .drawer-foot{padding:12px 16px}.drawer-foot .btn{width:100%;min-height:44px}
}

/* ---- Request workspace ------------------------------------------------------------- */
/* Detail mode: Back replaces the page head so section navigation stays above the fold. */
main:not(:has(#detail-panel:not([hidden]))) #back{display:none}
main:has(#detail-panel:not([hidden])) .page-head{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ws-back{display:inline-flex;align-items:center;gap:4px;margin:0 0 10px -8px;min-height:40px;padding:0 10px 0 6px;background:transparent;border:0;color:var(--g800);font-weight:600;font-size:14px;border-radius:6px}
.ws-back svg{width:16px;height:16px}
.ws-back:hover{background:var(--g100);color:var(--g800);border:0}
:is(#detail,#offer-settings-body),:is(#detail,#offer-settings-body) *{font-family:var(--font)}
#detail :is(pre,code,kbd,samp),#detail :is(pre,code,kbd,samp) *{font-family:ui-monospace,Menlo,monospace}
:is(#detail,#offer-settings-body) h2,:is(#detail,#offer-settings-body) h3,:is(#detail,#offer-settings-body) h4{color:var(--ink)}
:is(#detail,#offer-settings-body) :is(input:not([type=checkbox]):not([type=radio]),textarea){border:1px solid var(--line2)!important;border-radius:8px!important;background:#fff;color:var(--ink);min-height:40px}
:is(#detail,#offer-settings-body) :is(input:not([type=checkbox]):not([type=radio]),textarea):hover{border-color:#9DB096!important}
:is(#detail,#offer-settings-body) :is(input,textarea):focus-visible{outline:3px solid var(--focus);outline-offset:2px}
:is(#detail,#offer-settings-body) :is(input,textarea):disabled{background:#F3F4F2}
:is(#detail,#offer-settings-body) .rk-select{margin-top:6px}
:is(#detail,#offer-settings-body) label > .rk-select,:is(#detail,#offer-settings-body) .ws-select .rk-select{font-weight:400}
section{min-width:0}
/* ---- Request workspace ------------------------------------------------ */
#detail-panel{background:transparent;border:0;padding:0;margin-top:0}
#detail{overflow-wrap:anywhere}
:is(#detail,#offer-settings-body) h2,:is(#detail,#offer-settings-body) h3,:is(#detail,#offer-settings-body) h4{color:#163a26}
#detail dt{text-transform:none}
.ws-header{background:#fff;border:1px solid var(--line);border-radius:10px 8px 0 0;border-bottom:0;padding:18px 22px 14px}
.ws-title{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ws-title h2{margin:0;font-size:26px;line-height:1.25}
.ws-status{display:inline-flex;align-items:baseline;gap:6px;font-size:14px;line-height:1.3}
.ws-status .st-wrap{display:inline-flex;align-items:baseline;flex-wrap:wrap;gap:0 6px}
.ws-chip{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.3px;padding:4px 10px;border-radius:999px;background:#eef3ea;color:#2c4f1d;border:1px solid #cfdcc8;white-space:nowrap}
.ws-chip-unassigned{background:#f3f4f2;color:#4d564d;border-color:#d9ddd7}.ws-chip-waiting{background:#fff6e0;color:#6d4a00;border-color:#ecd7a4}.ws-chip-closed{background:#eceff3;color:#3c4652;border-color:#d3d9e0}
.ws-chip-loading{background:#f6f7f5;color:#6b736b;border-style:dashed}.ws-chip-unavailable{background:#fff8e8;color:#7a4a00;border:1px dashed #d9a94a}
.ws-meta{margin:6px 0 12px;font-size:14px;color:#536052;line-height:1.5}
.ws-meta{margin:6px 0 0}
/* Owner · Next · Due on one line (pieces that are not recorded are left out). */
.ws-facts{margin:8px 0 0;font-size:14px;line-height:1.5}
.ws-facts[hidden]{display:none}
.ws-fact,.ws-fact dt,.ws-fact dd{display:inline}
.ws-fact dt{font-weight:700;color:#163a26;margin:0 6px 0 0}
.ws-fact dd{margin:0;color:#20302a;white-space:normal}
.ws-fact:not(:last-child)::after{content:"·";margin:0 10px;color:#8a958a}
/* Key facts: four tiles (two a row on phones). Amounts never split mid-number. */
.ws-keyfacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:10px;margin:14px 0 0}
.ws-kf{background:#f4f8f1;border:1px solid #e1e9dc;border-radius:8px;padding:10px 12px;min-width:0}
.ws-kf dt{font-size:12px;font-weight:600;color:#5d6b5e;line-height:1.3}
.ws-kf dd{margin:2px 0 0;font-size:16px;font-weight:700;color:#163a26;line-height:1.35;white-space:normal}
.ws-kf dd.dash{color:#6b736b;font-weight:600}
#ws-kf-estimate dd{overflow-wrap:normal;word-break:normal}
.ws-missing{color:#6b736b!important;font-style:italic}
.ws-unavailable{color:#7a4a00!important;font-style:normal}
dd.ws-unavailable::before{content:"⚠ ";speak:never}
/* Section navigation */
.ws-nav{position:sticky;top:0;z-index:5;background:#fff;border:1px solid #d8e1d4;border-top:1px solid #e4e9e1;border-radius:0 0 8px 8px;padding:0 14px;box-shadow:0 2px 0 rgba(22,58,38,.03)}
.ws-tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.ws-tabs::-webkit-scrollbar{display:none}
.ws-tabs [role=tab]{background:transparent;color:#3f4b40;border:0;border-bottom:3px solid transparent;border-radius:0;padding:14px 14px 11px;min-height:48px;font-size:15px;font-weight:600;white-space:nowrap}
.ws-tabs [role=tab]:hover{background:#f3f6f2;color:#163a26}
.ws-tabs [role=tab][aria-selected=true]{color:#163a26;border-bottom-color:#3d7325}
.ws-tabs [role=tab]:focus-visible{outline:3px solid #b87800;outline-offset:-3px}
.ws-select{display:none;padding:10px 0 12px}
.ws-select label{font-size:13px;font-weight:700;color:#536052}
.ws-select select{display:block;width:100%;margin-top:6px;font:600 16px/1.3 var(--font);color:#163a26;padding:10px 12px;min-height:46px;border:1px solid #7c877c;border-radius:6px;background:#fff}
.ws-select select:focus-visible{outline:3px solid #b87800;outline-offset:2px}
.ws-panels{margin-top:16px}
.ws-panel{outline:none}
.ws-panel:focus-visible{outline:3px solid #b87800;outline-offset:4px;border-radius:8px}
/* Cards */
:is(#detail,#offer-settings-body) .ws-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px 22px;margin:0 0 16px;min-width:0}
:is(#detail,#offer-settings-body) .ws-card > h3,:is(#detail,#offer-settings-body) .ws-card section > h3,:is(#detail,#offer-settings-body) .ws-card [class$=-head] > h3{font-size:18px;line-height:1.3;margin:0}
:is(#detail,#offer-settings-body) .ws-card > h3{margin-bottom:12px}
:is(#detail,#offer-settings-body) .ws-card h4{font-size:15px;margin:18px 0 8px}
:is(#detail,#offer-settings-body) .ws-card > section{background:transparent;border:0;border-radius:0;padding:0;margin:0;max-width:none;font:inherit;color:inherit}
:is(#detail,#offer-settings-body) .ws-card p{font-size:15px;line-height:1.55;margin:8px 0}
/* Two columns sized by their own content: no card is stretched to match its neighbour. */
.ws-overview-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;align-items:start}
#detail .ws-summary-grid{margin:0 0 16px}
/* Pricing: the assistant (wider) beside the RK Estimate; one card alone takes the row. */
.ws-pricing-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;align-items:start;margin:0 0 16px}
.ws-pricing-grid[data-count='1']{grid-template-columns:minmax(0,1fr)}
:is(#detail,#offer-settings-body) .ws-pricing-grid .ws-card{margin:0}
/* Follow-Up: Time Spent is a part of the card, laid out for the narrow column. */
#detail .ws-workflow{container-type:inline-size}
#detail .ws-time{border-top:1px solid #e4e9e1;margin-top:14px;padding-top:4px}
#detail .ws-time > .tl-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin:0 0 8px}
#detail .ws-time .tl-head h4{margin:0;font-size:15px}
.ws-overview-grid > .ws-column{display:flex;flex-direction:column;gap:16px;min-width:0}
:is(#detail,#offer-settings-body) .ws-overview-grid .ws-card{margin:0}
.ws-dl{display:grid;grid-template-columns:minmax(120px,38%) minmax(0,1fr);gap:8px 16px;margin:0}
.ws-dl dt{font-weight:600;color:#4b574c;font-size:14px}
.ws-dl dd{margin:0;font-size:15px;white-space:pre-wrap}
#request-details h4:first-of-type{margin-top:4px}
/* Summary (Oct 22 2026): the Request spans the page with its sections side by side (newspaper columns, each section
   kept whole), then two equal columns of cards. */
#detail .ws-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
#detail .ws-summary-grid[data-count='1']{grid-template-columns:minmax(0,1fr)}
/* The Summary's bands under the Request: Follow-Up & Emails, then Customer & Site. */
#detail .ws-band{margin:8px 0 0}
#detail .ws-band > h3.ws-band-title{font-size:18px;font-weight:700;color:#163a26;margin:8px 0 12px;padding:0 2px}
#detail #request-details{margin:0 0 16px}
/* The Request (Oct 22 2026, "a wall of text"): the chosen cards as tiles across the top, each answer a label and value
   row; then What They Need, Where and When and Contact as equal panels side by side; Routing across the last row. */
#request-details .ws-op-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:16px}
#request-details .ws-op-card{background:#fff;border:1px solid #dfe7da;border-top:4px solid #2f6b3f;border-radius:10px;padding:14px 16px 16px;min-width:0}
#request-details .ws-op-card h5{margin:0 0 12px;font-size:15px;font-weight:700;color:#163a26;line-height:1.3}
#request-details .ws-op-card .ws-dl{gap:8px 14px}
#request-details .ws-op-none{margin:0;color:#5d6b5e;font-size:14px}
#request-details > .ws-req-section.ws-req-ops{margin:0 0 18px}
#request-details .ws-req-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
/* A version three request at full width: What They Need and Where and When as two tall panels, Contact over Routing in
   the third column (four narrow panels squeezed email addresses and the Facility File line). */
@media(min-width:1180px){
  #request-details .ws-req-sections.ws-req-v3{grid-template-columns:repeat(3,minmax(0,1fr))}
  #request-details .ws-req-v3 > .ws-req-section:nth-child(-n+2){grid-row:span 2}
}
@media(max-width:719px){#request-details .ws-req-sections{grid-template-columns:minmax(0,1fr)}}
#request-details .ws-req-sections > .ws-req-section{background:#f7faf5;border:1px solid #e3ebdf;border-radius:10px;padding:14px 16px 16px;min-width:0}
#request-details .ws-req-section > h4{margin:0 0 12px}

.ws-link{background:transparent;color:#315f22;border:0;padding:0;min-height:32px;text-align:left;font-weight:600;text-decoration:underline;text-underline-offset:3px;white-space:normal}
.ws-link:hover{background:transparent;color:#1f3d14}
/* Needs Attention: a calm vertical list, one full sentence per row, wrapping instead of truncating. */
.ws-attention-list{list-style:none;margin:0;padding:0;border-top:1px solid #edf1ea}
.ws-attention-list > li{margin:0;padding:0;border-bottom:1px solid #edf1ea}
#detail .ws-attention-link{display:flex;align-items:flex-start;gap:10px;width:100%;padding:11px 4px 11px 14px;min-height:44px;color:#20302a;text-decoration:none;font:600 15px/1.45 var(--font);white-space:normal;overflow-wrap:anywhere;background:transparent;position:relative}
#detail .ws-attention-link::before{content:"";position:absolute;left:0;top:13px;bottom:13px;width:3px;border-radius:2px;background:#c98a12}
#detail .ws-attention-link::after{content:"›" / "";margin-left:auto;padding-left:8px;color:#315f22;font-size:20px;line-height:1}
#detail .ws-attention-link:hover{color:#163a26;text-decoration:underline;text-underline-offset:3px}
#detail .ws-attention-link:focus-visible{outline:3px solid #b87800;outline-offset:-3px}
.ws-quiet-note{font-size:14px!important;color:#5d6b5e;margin:0!important}
/* Saved Evidence: one compact row per evidence type. */
#ws-evidence dl.ws-evidence-list{display:block;margin:0}
.ws-evidence-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px 16px;padding:9px 0;border-bottom:1px solid #edf1ea;min-width:0;align-items:baseline}
.ws-evidence-item:first-child{padding-top:0}.ws-evidence-item:last-child{border-bottom:0;padding-bottom:0}
.ws-evidence-item dt{font-size:14px}
.ws-evidence-item dd{margin:0;font-size:14px;color:#4b574c}
/* Quiet refresh: a text control, not another equally prominent button. */
:is(#detail,#offer-settings-body) button.ws-quiet{background:transparent!important;color:#315f22!important;border:0!important;padding:8px 2px!important;min-height:44px;font:600 14px/1.3 var(--font)!important;text-decoration:underline;text-underline-offset:3px;box-shadow:none}
:is(#detail,#offer-settings-body) button.ws-quiet:hover{color:#1f3d14!important;background:transparent!important}
:is(#detail,#offer-settings-body) button.ws-quiet:disabled{color:#7a837a!important;text-decoration:none;cursor:default}
/* State notes: none, unavailable and disabled look different. */
.ws-state{font-size:14px!important;line-height:1.5;border-radius:6px;padding:10px 12px;margin:6px 0!important}
.ws-none{background:#f5f7f4;color:#4d564d;border:1px solid #e1e6de}
.ws-unavailable.ws-state{background:#fff8e8;color:#6d4a00;border:1px solid #ecd7a4;border-left:4px solid #c98a12}
.ws-disabled{background:repeating-linear-gradient(135deg,#f6f7f5,#f6f7f5 8px,#eff1ee 8px,#eff1ee 16px);color:#4d564d;border:1px dashed #b9c2b6}
.ws-loading{color:#6b736b;font-style:italic}
.ws-info{background:#eef3f7;color:#2b3e4f;border:1px solid #d3dee8}
/* Secondary affordances */
.ws-setup label{font-size:14px}
.ws-hint{font-size:13px!important;color:#5d6b5e;line-height:1.5}
.ws-warn{display:inline-block;font-size:13px!important;line-height:1.4;color:#6d4a00;background:#fff8e8;border-radius:4px;padding:4px 8px;margin:4px 0!important}
.ws-warn:empty{display:none}
.ws-technical pre{font:12px/1.45 ui-monospace,Menlo,monospace;white-space:pre-wrap;overflow-wrap:anywhere;background:#f3f6f2;padding:10px;border-radius:4px;margin:6px 0}
:is(#detail,#offer-settings-body) .ws-edit,:is(#detail,#offer-settings-body) .ws-secondary,:is(#detail,#offer-settings-body) [class$=-secondary]{background:#fff;color:#2c5a1c;border:1px solid #8aa77e;font-weight:600}
:is(#detail,#offer-settings-body) .ws-edit:hover,:is(#detail,#offer-settings-body) .ws-secondary:hover,:is(#detail,#offer-settings-body) [class$=-secondary]:hover{background:#eef3ea}
:is(#detail,#offer-settings-body) .ws-edit:disabled,:is(#detail,#offer-settings-body) .ws-secondary:disabled,:is(#detail,#offer-settings-body) [class$=-secondary]:disabled{background:#f3f4f2;color:#6b736b;border-color:#d9ddd7}
:is(#detail,#offer-settings-body) [class$=-head]{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
:is(#detail,#offer-settings-body) select{font:inherit;max-width:100%;min-width:0}
/* Quote & Agreement */
.estimate-controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:4px 0 8px}
#estimate-feedback{font-size:14px;font-weight:600;color:#24441c}
.estimate-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:12px;margin-top:12px}
.estimate-list > .ws-state{grid-column:1/-1}
.estimate-card{border:1px solid #e1e6de;border-radius:6px;padding:12px 14px;background:#fbfcfa;overflow-wrap:anywhere;display:flex;flex-direction:column}
.estimate-card .estimate-meta{font-size:13px!important;color:#5d6b5e;margin:0 0 4px!important}
.estimate-card h4{margin:0 0 6px!important;font-size:17px!important}
.estimate-card p{font-size:14px!important}
.estimate-card .ws-technical{margin-top:auto}
.estimate-card dl{display:grid;grid-template-columns:minmax(110px,42%) minmax(0,1fr);gap:4px 10px;font-size:13px;margin:6px 0}
.estimate-card dt{font-weight:600}.estimate-card dd{margin:0}
.ws-estimate-choice{padding-bottom:14px;margin-bottom:14px;border-bottom:1px solid #e4e9e1}
.ws-estimate-choice label{display:block;font-size:14px;color:#3f4b40}
.ws-estimate-choice select{display:block;width:100%;max-width:560px;margin-top:6px;padding:10px;min-height:44px;border:1px solid #7c877c;border-radius:4px;background:#fff;color:#20302a}
/* History */
#activity-history ol,.wf-audit ol{padding-left:22px;margin:4px 0}
#detail li p{margin-top:4px}
#detail li small{margin-top:2px}

@media(max-width:719px){
  .ws-tabs{display:none}.ws-select{display:block}
  .ws-nav{padding:0 12px}
}
@media(max-width:860px){
  .ws-overview-grid,.ws-pricing-grid{grid-template-columns:minmax(0,1fr)}
  #detail .ws-summary-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:650px){
  .ws-header{padding:14px 14px 12px}
  .ws-title h2{font-size:21px}
  .ws-meta{font-size:13px;margin:4px 0 0}
  .ws-facts{margin-top:6px;font-size:13.5px}
  .ws-fact dt{white-space:nowrap}
  .ws-keyfacts{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:10px}
  .ws-kf{padding:6px 9px}
  .ws-kf dt{font-size:11.5px}
  .ws-kf dd{font-size:14px;line-height:1.3}
}
/* Small phones (320): the key facts become one compact list so the section menu stays on the first screen; the last
   saved time is in History. */
@media(max-width:360px){
  .ws-back{margin-bottom:4px}
  .ws-header{padding-top:12px}
  .ws-title{gap:4px 8px}
  .ws-title h2{font-size:20px}
  .ws-facts{margin-top:4px;font-size:13px;line-height:1.4}
  .ws-select{padding:8px 0}
  .ws-meta{display:none}
  .ws-keyfacts{display:block;background:#f4f8f1;border:1px solid #e1e9dc;border-radius:8px;padding:4px 10px;margin-top:8px}
  .ws-kf{display:grid;grid-template-columns:84px minmax(0,1fr);gap:8px;align-items:baseline;background:none;border:0;border-radius:0;padding:2px 0}
  .ws-kf dd{margin:0;font-size:13.5px}
  :is(#detail,#offer-settings-body) .ws-card{padding:16px 14px}
  .ws-dl{grid-template-columns:minmax(0,1fr);gap:0}
  .ws-dl dt{margin-top:8px;font-size:13px}
  .ws-evidence-item{grid-template-columns:minmax(0,1fr);gap:0}
  .estimate-list{grid-template-columns:minmax(0,1fr)}
}


/* History cards: the toggle opens the card's history; the meta line shows while it is closed. */
#detail .ws-history-card{display:flex;flex-direction:column}
:is(#detail,#offer-settings-body) .ws-history-card > details,:is(#detail,#offer-settings-body) .ws-history-card > div > details{order:1}
#detail .ws-history-card > div{display:flex;flex-direction:column}
:is(#detail,#offer-settings-body) .ws-history-card details{margin:0}
.ws-history-card .ws-history-meta{order:2;margin:2px 0 0!important}
.ws-history-card:has(details[open]) .ws-history-meta{display:none}
.ws-agreements .ag-panel > h3{display:none}
.ws-choice{margin:-4px 0 12px!important}
:is(#detail,#offer-settings-body) .ws-choice .ws-link,:is(#detail,#offer-settings-body) .ws-card .ws-link{background:transparent;color:#315f22;border:0;padding:0;min-height:32px;font:600 13px/1.4 var(--font);text-decoration:underline}
:is(#detail,#offer-settings-body) .ws-evidence-item .ws-link{font-size:14px}
/* Form controls inside the workspace: consistent checkbox rows and full-width fields. */
:is(#detail,#offer-settings-body) input:not([type=checkbox]),:is(#detail,#offer-settings-body) select,:is(#detail,#offer-settings-body) textarea{font-weight:400;max-width:none;margin:6px 0 0}
:is(#detail,#offer-settings-body) label:has(> input[type=checkbox]){display:flex!important;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;font-weight:600;min-height:40px}
:is(#detail,#offer-settings-body) input[type=checkbox]{order:-1;flex:none;width:18px;height:18px;margin:0;display:inline-block;accent-color:#3d7325}
:is(#detail,#offer-settings-body) fieldset{min-width:0}
:is(#detail,#offer-settings-body) legend{font-weight:700;color:#163a26;padding:0 4px}
/* Card titles in the same row line up whether or not the card has a header action. */
:is(#detail,#offer-settings-body) .ws-card > h3,:is(#detail,#offer-settings-body) .ws-card [class$=-head]{min-height:44px;display:flex;align-items:center;margin:0 0 12px}
:is(#detail,#offer-settings-body) .ws-card [class$=-head]{justify-content:space-between}

/* Workflow card: version line sits under the title; notes follow. */
#workflow .wf-version{margin:-4px 0 8px}
#workflow .wf-panel h4{margin-top:4px}
#workflow .wf-footer{margin-top:4px}
.ar-panel .ar-status{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.ar-panel .ar-status-detail{font-weight:400;font-size:13px;color:#4b574c}
#workflow .wf-notes{margin:0 0 4px}
#workflow .wf-notes li{padding:4px 0 8px}
#workflow .wf-notes li p{margin:0 0 2px}
/* Invoices & Balances: one shared label column so values line up across cards. */
@media(min-width:601px){
  #detail .ar-panel .ar-facts,#detail .aging-panel .aging-facts{grid-template-columns:230px minmax(0,1fr)}
  #detail .aging-panel .aging-card dl{grid-template-columns:calc(230px - 1rem - 5px) minmax(0,1fr)}
}
/* Status lines take no space until there is something to say. */
#detail :is(.ar-message,.aging-message,.pt-message,.ag-message,.wf-message,.billing-message):empty{display:none}
#detail :is(.ar-footer,.aging-footer,.pt-footer,.wf-footer){justify-content:flex-end}
#detail :is(.ar-footer,.aging-footer,.pt-footer,.wf-footer) > p:not(:empty){flex:1 1 200px}
#workflow .wf-footer{justify-content:flex-start}
@media(max-width:600px){
  #detail :is(.ar-facts,.aging-facts,.aging-card dl,.billing-facts) dd{margin-bottom:8px}
  #detail :is(.ar-footer,.aging-footer,.pt-footer){justify-content:flex-start}
}
/* Derived BD routing (read-only; separate from the recorded owner) */
.ws-route-note{display:block;margin-top:2px;font-size:13px;color:#5d6b5e;white-space:normal}


/* ---- Toggles ---------------------------------------------------------------
   Every <details> disclosure in the staff workspace is drawn as one secondary button
   with a chevron on the right (the same family as .btn-secondary). Native <details>
   semantics, keyboard support and the open attribute are unchanged. */
summary{list-style:none}
summary::-webkit-details-marker{display:none}
summary::marker{content:""}
:where(#listing,:is(#detail,#offer-settings-body),.drawer) details{min-width:0;max-width:100%;margin:10px 0}
:is(#listing,:is(#detail,#offer-settings-body)) details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;box-sizing:border-box;width:fit-content;max-width:100%;min-height:44px;margin:0;padding:10px 14px;border:1px solid var(--line2);border-radius:8px;background:#fff;color:var(--g800);font:600 14px/1.35 var(--font);text-align:left;text-transform:none;letter-spacing:normal;white-space:normal;overflow-wrap:anywhere;cursor:pointer;user-select:none}
:is(#listing,:is(#detail,#offer-settings-body)) details>summary::after{content:"";flex:none;width:7px;height:7px;margin:-4px 2px 0 0;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .15s ease}
:is(#listing,:is(#detail,#offer-settings-body)) details[open]>summary::after{margin-top:4px;transform:rotate(-135deg)}
:is(#listing,:is(#detail,#offer-settings-body)) details>summary:hover{background:var(--g50);border-color:#9DB096;color:var(--g900)}
:is(#listing,:is(#detail,#offer-settings-body)) details>summary:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
:is(#listing,:is(#detail,#offer-settings-body)) details[open]>summary{margin-bottom:10px;background:var(--g50)}
@media(prefers-reduced-motion:reduce){:is(#listing,#detail) details>summary::after{transition:none}}
/* Workspace buttons: primary green, secondary outlined, both 8px radius like the queue. */
:is(#detail,#offer-settings-body) button:not(.ws-link):not(.ws-quiet):not([role=tab]):not(.rk-select-button){border-radius:8px}
:is(#detail,#offer-settings-body) .ws-edit,:is(#detail,#offer-settings-body) .ws-secondary,:is(#detail,#offer-settings-body) [class$=-secondary]{border-color:var(--line2)!important;color:var(--g800)}
:is(#detail,#offer-settings-body) .ws-edit:hover,:is(#detail,#offer-settings-body) .ws-secondary:hover,:is(#detail,#offer-settings-body) [class$=-secondary]:hover{background:var(--g50);border-color:#9DB096!important}
@media(max-width:760px){#detail button{min-height:44px}}
@media(max-width:650px){
  .ws-title{gap:8px}
  .ws-facts dt,.ws-facts dd{font-size:13.5px}
  .ws-select{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px}
  :is(#detail,#offer-settings-body) .ws-select .rk-select{margin-top:0}
}

/* ---- Staff accounts ------------------------------------------------------------------
   Staff Accounts page (admins), the one dialog used for every account action, and the
   Set Your Password page a setup link opens. */
body.on-accounts :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#exceptions-page,#capability-page){display:none!important}
.accounts-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
/* The page's own title: the Request Review <h1> stays the document heading. */
#accounts-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#accounts-page > .ws-back{margin-bottom:6px}
#accounts-table > .empty{margin:0;padding:40px 16px;text-align:center;color:var(--muted)}
.accounts-table td{vertical-align:middle;overflow-wrap:anywhere}
.accounts-table .a-name{min-width:160px}
.a-display{font-weight:600}
.accounts-table .a-user{font-variant-numeric:normal}
.accounts-table :is(.a-role,.a-added){white-space:nowrap}
.accounts-table .a-actions{text-align:right;width:1%;white-space:nowrap}
.a-actions-in{display:flex;gap:6px;justify-content:flex-end}
.btn-row{min-height:34px;padding:0 12px}
.acct-st{display:inline-flex;align-items:baseline;gap:6px;font-weight:600;white-space:nowrap}
.acct-active{color:var(--g900)}.acct-active .st-dot{background:var(--g600)}
.acct-waiting{color:var(--amber-ink)}.acct-waiting .st-dot{background:var(--amber-dot)}
.acct-needs_link{color:var(--ink2)}.acct-needs_link .st-dot{background:transparent;border:2px solid #7D8A7B}
.acct-off{color:var(--muted)}.acct-off .st-dot{background:#C9CFC6}
.acct-expiry{white-space:normal}
@media(max-width:1100px){.a-actions-in{flex-wrap:wrap}.accounts-table .a-actions{white-space:normal;width:auto;min-width:150px}}
@media(max-width:760px){
  .accounts-head h2{flex:1 1 auto}
  .accounts-head .btn{min-height:44px}
  .accounts-table thead{display:none}
  .accounts-table,.accounts-table tbody{display:block}
  .accounts-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"name role" "user user" "status status" "added added" "actions actions";gap:4px 12px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .accounts-table tbody tr:last-child{border-bottom:0}
  .accounts-table td{display:block;padding:0!important;border:0!important;min-width:0;white-space:normal}
  .accounts-table .a-name{grid-area:name;min-width:0;font-size:14px}
  .accounts-table .a-role{grid-area:role;color:var(--ink2)}
  .accounts-table .a-user{grid-area:user;color:var(--ink2)}
  .accounts-table .a-status{grid-area:status}
  .accounts-table .a-added{grid-area:added;color:var(--ink2)}
  .accounts-table :is(.a-user,.a-added)::before{content:attr(data-label) " ";color:var(--muted)}
  .accounts-table .a-actions{grid-area:actions;text-align:left;width:auto;margin-top:6px}
  .a-actions-in{justify-content:flex-start;flex-wrap:wrap}
  .btn-row{min-height:44px}
}
/* Dialog */
.dialog{width:min(520px,calc(100vw - 24px));max-width:none;max-height:calc(100vh - 24px);border:0;border-radius:12px;padding:0;color:var(--ink);background:#fff;box-shadow:0 20px 60px rgba(18,28,15,.28);font-family:var(--font);font-size:14px}
.dialog::backdrop{background:rgba(18,28,15,.38)}
#account-dialog-body{padding:20px 22px}
.dialog-title{font-size:18px;line-height:1.3;margin:0 0 14px}
.dlg-text{margin:0 0 12px;color:var(--ink);font-size:14px;overflow-wrap:anywhere}
.dlg-field{margin:0 0 14px}
.dlg-field label{display:block;font-size:13px;font-weight:600;color:var(--ink2);margin:0 0 6px}
.dlg-field input{display:block;width:100%;height:40px;margin:0;padding:0 12px;border:1px solid var(--line2);border-radius:8px;background:#fff;font-size:14px}
.dlg-field input:hover{border-color:#9DB096}
.dlg-field input:focus-visible,.dlg-check input:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.dlg-field input[readonly]{background:#F3F4F2;color:var(--ink2)}
.dlg-hint{margin:6px 0 0;font-size:13px;color:var(--muted)}
.dlg-check{display:inline-flex;align-items:center;gap:8px;min-height:40px;font-weight:600;font-size:14px;cursor:pointer}
.dlg-check input{width:18px;height:18px;margin:0;accent-color:var(--g600);cursor:pointer}
.dlg-check:has(input:disabled){cursor:default;color:var(--muted)}
.dlg-facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin:0 0 14px}
.dlg-facts dt{font-size:13px;font-weight:600;color:var(--ink2)}
.dlg-facts dd{margin:0;overflow-wrap:anywhere}
.dlg-error{margin:4px 0 0;color:var(--red-ink);font-size:14px;font-weight:600}
.dlg-error:empty{display:none}
.dlg-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:18px}
.copy-status{margin-right:auto;color:var(--g800);font-size:13px;font-weight:600}
.link-box{margin:0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--g50);font:13px/1.5 ui-monospace,Menlo,monospace;overflow-wrap:anywhere;word-break:break-all;user-select:all}
@media(max-width:480px){
  #account-dialog-body{padding:16px}
  .dlg-actions .btn{flex:1 1 auto;min-height:44px}
  .copy-status{flex-basis:100%;order:3}
}
/* Set Your Password: the page shows only this panel (no Request Review heading). */
main:has(#setup:not([hidden])) #page-head,main:has(#renew:not([hidden])) #page-head{display:none}
#renew-why{margin:0 0 14px;color:var(--ink2)}
#setup-for{margin:0 0 14px;color:var(--ink2);font-weight:600}
.signin .field-hint{margin:-10px 0 16px;font-size:13px;color:var(--muted)}
.signin input[readonly]{background:#F3F4F2;color:var(--ink2)}
/* Show/hide password: an eye button inside every password box (sign-in, setup, renew, Change Password). The global
   button style is reset explicitly so the toggle stays a small icon inside the field. */
.pw-field{position:relative;display:block}
.signin .pw-field{max-width:420px;margin:6px 0 16px}
.signin .pw-field input{margin:0}
.pw-field input{padding-right:48px!important}
.pw-field input::-ms-reveal{display:none}
.pw-toggle{position:absolute;top:50%;right:4px;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:36px;height:32px;min-height:0;padding:0;margin:0;border:0;border-radius:6px;background:transparent;color:var(--muted);line-height:1;cursor:pointer}
.pw-toggle:hover{background:#EEF2EC;border:0;color:var(--ink)}
.pw-toggle[aria-pressed=true]{color:var(--ink2)}
.pw-toggle:focus-visible{outline:3px solid var(--focus);outline-offset:0}
.pw-toggle svg{width:20px;height:20px;display:block}

/* ---- Facility File -------------------------------------------------------------------
   The weekly Facility File page (all staff; admins upload) and each request's Facility File
   line with its flags. Internal figures: staff pages only. */
body.on-facility :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#exceptions-page,#capability-page){display:none!important}
#facility-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#facility-page > .ws-back{margin-bottom:6px}
.facility-result{margin:0 0 12px;padding:10px 12px;border:1px solid var(--line2);border-radius:8px;background:var(--g50);color:var(--g900);font-weight:600;overflow-wrap:anywhere}
.facility-result:empty{display:none}
.facility-result.is-error{border-color:#E9B8AC;background:#FDF2EF;color:var(--red-ink)}
#facility-current > .empty{margin:0;padding:40px 16px;text-align:center;color:var(--muted)}
.facility-meta{margin:0;padding:12px 16px;border-bottom:1px solid var(--line);color:var(--ink2);overflow-wrap:anywhere}
.facility-meta strong{color:var(--ink)}
.facility-table{overflow-wrap:normal}
.facility-table td{vertical-align:middle}
.facility-table .f-num{text-align:right;white-space:nowrap}
.facility-table th.f-num{text-align:right}
.facility-table .f-lease{white-space:nowrap}
.facility-table .f-name{font-weight:600}
.facility-table small{margin-top:0}
.facility-table .is-none{color:var(--muted)}
.facility-earlier{margin-top:20px}
.facility-earlier h3{font-size:15px;line-height:1.3;margin:0 0 8px}
.facility-earlier ul{list-style:none;margin:0;padding:0;display:grid;gap:6px;color:var(--ink2);overflow-wrap:anywhere}
.facility-earlier strong{color:var(--ink)}
.ff-line{display:block;overflow-wrap:break-word}
.ff-avail{display:block;margin-top:6px;color:var(--g800);font-weight:600}
.ff-flag{display:block;position:relative;margin-top:6px;padding-left:16px;color:var(--amber-ink);font-weight:600;white-space:normal}
.ff-flag::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--amber-dot)}
@media(max-width:760px){
  .facility-table thead{display:none}
  .facility-table,.facility-table tbody{display:block}
  .facility-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"wh wh" "total open" "pct lease";gap:4px 12px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .facility-table tbody tr:last-child{border-bottom:0}
  .facility-table td{display:block;padding:0!important;border:0!important;min-width:0;text-align:left!important;white-space:normal}
  .facility-table .f-wh{grid-area:wh;font-size:14px}
  .facility-table .f-wh small{display:inline;margin-left:6px}
  .facility-table .f-total{grid-area:total}.facility-table .f-open{grid-area:open}
  .facility-table .f-pct{grid-area:pct}.facility-table .f-lease{grid-area:lease}
  .facility-table td:not(.f-wh)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px}
  #facility-upload,#facility-choose{width:100%}
  #facility-choose{min-height:44px}
}

/* ---- Pilot Numbers ---------------------------------------------------------------------
   Funnel counts and reply times (staff only). Same dense table as the queue; cards below 560px. */
body.on-pilot :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#exceptions-page,#capability-page){display:none!important}
#pilot-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#pilot-page > .ws-back{margin-bottom:6px}
.pilot-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.pilot-wide{grid-column:1/-1}
.pilot-panel{overflow:hidden;min-width:0}
.pilot-panel h3{margin:0;padding:12px 16px;border-bottom:1px solid var(--line);font-size:15px;line-height:1.3}
.pilot-panel > div > .empty{margin:0;padding:24px 16px;text-align:center;color:var(--muted)}
.pilot-table{overflow-wrap:normal}
.pilot-table td{vertical-align:middle}
.pilot-table .p-num{text-align:right;white-space:nowrap;width:1%}
.pilot-table th.p-num{text-align:right}
.pilot-table .p-wh{overflow-wrap:anywhere}
.pilot-note{margin:14px 0 0;color:var(--muted);font-size:13px;line-height:1.45}
@media(max-width:860px){.pilot-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:560px){
  .pilot-wh-table thead{display:none}
  .pilot-wh-table,.pilot-wh-table tbody{display:block}
  .pilot-wh-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 12px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .pilot-wh-table tbody tr:last-child{border-bottom:0}
  .pilot-wh-table td{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
  .pilot-wh-table .p-wh{grid-column:1/-1;font-weight:600;font-size:14px}
  .pilot-wh-table td:not(.p-wh)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400}
}

/* ---- Exceptions and Capability Register ---------------------------------------------------
   Exceptions: one row per (request, reason). Capability Register: approved services per warehouse,
   its editor (staff admins) and change history. Same dense tables as the queue; cards on phones. */
body.on-exceptions :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#capability-page){display:none!important}
body.on-capability :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page){display:none!important}
/* Customer Accounts page (its own styles load with customer-accounts.js). */
body.on-customers :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page){display:none!important}
/* AI Assistant page (RK_VACANCY_AI_ASSISTANT): its own ?page=ai entry; panels styled in ai-assistant.css. */
body.on-ai :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page){display:none!important}
#ai-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#ai-page > .ws-back{margin-bottom:6px}
:is(#exceptions-title,#capability-title){outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
:is(#exceptions-page,#capability-page) > .ws-back{margin-bottom:6px}
.page-ttl{display:flex;align-items:baseline;gap:4px 12px;flex-wrap:wrap;min-width:0}
:is(#exceptions-table,#capability-table,#capability-history) > .empty{margin:0;padding:40px 16px;text-align:center;color:var(--muted)}
.sort-table{overflow-wrap:normal}
.sort-table td{overflow-wrap:anywhere}
.sort-table .sub{font-size:12.5px;margin-top:2px;overflow-wrap:anywhere}
.exc-table .x-req{min-width:180px;width:26%}
.exc-table .x-reason{min-width:170px;width:28%}
.exc-table .x-since{white-space:nowrap;overflow-wrap:normal;width:1%}
.exc-table .x-next{min-width:200px}
.exc-table .request-link{font-size:13px}
.cap-filters{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.cap-panel{overflow:hidden;min-width:0}
.cap-table td{vertical-align:middle}
.cap-table :is(.c-date,.c-st){white-space:nowrap;overflow-wrap:normal}
.cap-table .c-wh{min-width:150px}
.cap-table .c-ev{min-width:160px;white-space:pre-line}
.cap-table .c-act{text-align:right;width:1%;white-space:nowrap}
.cap-st{display:inline-flex;align-items:baseline;gap:6px;font-weight:600;white-space:nowrap}
.cap-st-approved{color:var(--g900)}.cap-st-approved .st-dot{background:var(--g600)}
.cap-st-expired{color:var(--amber-ink)}.cap-st-expired .st-dot{background:var(--amber-dot)}
.cap-st-not_approved{color:var(--ink2)}.cap-st-not_approved .st-dot{background:transparent;border:2px solid #7D8A7B}
.cap-history{margin-top:22px}
.cap-history h3{margin:0 0 10px;font-size:16px;line-height:1.3}
.cap-history-table .h-when{white-space:nowrap;overflow-wrap:normal;width:1%}
.cap-history-table .h-change .sub{white-space:pre-line}
.cap-editor{padding:16px;margin:0 0 14px}
.cap-editor h3{margin:0 0 12px;font-size:16px;line-height:1.3}
.cap-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 16px}
.cap-grid .cap-wide{grid-column:1/-1}
.cap-grid .dlg-field[hidden]{display:none}
.cap-editor .dlg-field textarea{display:block;width:100%;min-height:72px;margin:0;padding:8px 12px;border:1px solid var(--line2);border-radius:8px;background:#fff;font-size:14px;line-height:1.4;resize:vertical}
.cap-editor .dlg-field textarea:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.cap-editor .dlg-field .rk-select{display:block}
.cap-editor .dlg-actions{justify-content:flex-end}
.cap-facts{margin-bottom:14px}
.cap-item{display:block;overflow-wrap:break-word}
.cap-item + .cap-item{margin-top:4px}
.cap-item:not(.cap-approved){position:relative;padding-left:16px;color:var(--amber-ink);font-weight:600}
.cap-item:not(.cap-approved)::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--amber-dot)}
.cap-svc{font-weight:600}
@media(max-width:960px){
  .cap-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cap-table thead{display:none}
  .cap-table,.cap-table tbody{display:block}
  .cap-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .cap-table tbody tr:last-child{border-bottom:0}
  .cap-table td{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal;grid-column:1/-1}
  /* Warehouse and Edit share the first row; every other line spans it in order (empty lines are left out). */
  .cap-table .c-wh{grid-column:1;grid-row:1;font-weight:600;font-size:14px;min-width:0}
  .cap-table .c-act{grid-column:2;grid-row:1;align-self:start}
  .cap-table .c-ev{min-width:0}
  .cap-table :is(.c-by,.c-date,.c-ev)::before{content:attr(data-label) " ";color:var(--muted)}
  .cap-table td.is-empty{display:none}
  .cap-table .c-ev::before{white-space:normal}
}
@media(max-width:720px){
  .exc-table thead,.cap-history-table thead{display:none}
  :is(.exc-table,.cap-history-table),:is(.exc-table,.cap-history-table) tbody{display:block}
  :is(.exc-table,.cap-history-table) tr{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  :is(.exc-table,.cap-history-table) tbody tr:last-child{border-bottom:0}
  :is(.exc-table,.cap-history-table) td{display:block;padding:0!important;border:0!important;min-width:0;width:auto;white-space:normal}
  .exc-table td:not(.x-req)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px}
  .exc-table .x-since::before{display:inline;font-size:inherit;margin-right:4px}
  .cap-history-table td:not(.h-when)::before{content:attr(data-label) " ";color:var(--muted)}
  .cap-history-table .h-change .sub{margin-top:2px}
  .exc-table :is(.x-req,.x-reason,.x-since,.x-next){width:auto;min-width:0}
  .exc-table .x-req{font-size:14px}
  .cap-history-table .h-when{font-weight:600}
  .cap-grid{grid-template-columns:minmax(0,1fr)}
  :is(#exceptions-page,#capability-page) .accounts-head .btn{min-height:44px}
}

/* Customer Files: values read from files, under the form answer they are compared with. */
#detail .ws-from-files{margin-top:4px;white-space:normal;overflow-wrap:anywhere}
#detail .ws-from-files .ws-link{font-size:13px;min-height:24px;text-align:left}
#detail .ws-from-files[data-status=open] .ws-link{color:#6d4a00}
/* Scope measures (time to useful result, data completeness, human time, baseline): one short line per number. */
.pilot-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 12px 6px 0;border-bottom:1px solid var(--line)}
.pilot-head h3{border-bottom:0}
.pilot-head .btn-row{min-height:36px;padding:0 12px}
.p-measure{display:flex;flex-direction:column;gap:1px;min-width:0}
.p-hint{color:var(--muted);font-size:12px;line-height:1.35;overflow-wrap:anywhere}
.pilot-table .p-missing{color:var(--muted);font-style:italic}
.pilot-table tr.p-total td{font-weight:700;border-top:1px solid var(--line)}
.pilot-sub{margin:0;padding:10px 16px 12px;border-top:1px solid #EDF0EB;color:var(--muted);font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.dlg-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}
@media(max-width:560px){
  .pilot-effort-table thead,.pilot-base-table thead{display:none}
  .pilot-effort-table,.pilot-effort-table tbody,.pilot-base-table,.pilot-base-table tbody{display:block}
  .pilot-effort-table tr,.pilot-base-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .pilot-base-table tr{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pilot-effort-table tbody tr:last-child,.pilot-base-table tbody tr:last-child{border-bottom:0}
  .pilot-effort-table td,.pilot-base-table td{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
  .pilot-effort-table .p-fn,.pilot-base-table .p-fn{grid-column:1/-1;font-weight:600;font-size:14px}
  .pilot-effort-table td:not(.p-fn)::before,.pilot-base-table td:not(.p-fn)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400;font-style:normal}
  .pilot-effort-table tr.p-total{border-top:1px solid var(--line)}
}
@media(max-width:400px){.dlg-row{grid-template-columns:minmax(0,1fr)}}
/* Weekly Totals (Pilot Numbers page): one row per week, sortable; cards when the columns don't fit. */
#weekly-panel{margin-top:16px}
.weekly-head{flex-wrap:wrap;padding:8px 12px 8px 16px}
.weekly-head h3{padding:4px 12px 4px 0}
.weekly-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
.weekly-tools .sel{min-width:0;max-width:100%}
.weekly-subhead{margin:0;padding:12px 16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:14px;line-height:1.3}
.weekly-table .w-col,.weekly-service-table .w-col{white-space:nowrap}
.w-week{display:flex;flex-direction:column;gap:1px}
.w-sofar{color:var(--muted);font-size:12px;font-weight:400}
.pilot-table th.p-num .th-sort{flex-direction:row-reverse}
@media(max-width:1100px){
  .weekly-table thead,.weekly-service-table thead{display:none}
  .weekly-table,.weekly-table tbody,.weekly-service-table,.weekly-service-table tbody{display:block}
  .weekly-table tr,.weekly-service-table tr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px 12px;padding:12px 16px;border-bottom:1px solid #EDF0EB}
  .weekly-table tbody tr:last-child,.weekly-service-table tbody tr:last-child{border-bottom:0}
  .weekly-table td,.weekly-service-table td,.weekly-table td.p-num,.weekly-service-table td.p-num{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
  .weekly-table .w-col,.weekly-service-table .w-col{grid-column:1/-1;font-weight:600;font-size:14px}
  .w-week{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:0 8px}
  .weekly-table td:not(.w-col)::before,.weekly-service-table td:not(.w-col)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400;overflow-wrap:anywhere}
}
@media(max-width:700px){.weekly-table tr,.weekly-service-table tr{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){
  .weekly-head{padding:10px 16px}
  .weekly-tools,.weekly-tools .sel{width:100%}
  .weekly-tools .rk-select-inline,#main .weekly-tools .rk-select-inline .rk-select-button{width:100%}
  .weekly-tools .rk-select-inline .rk-select-text{white-space:normal}
  .weekly-tools .btn{min-height:44px;width:100%}
}

/* ---- Time Spent (workspace Overview) and Access Log (History, admins) ------------------- */
#detail .tl-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0 0 14px;border:1px solid #edf1ea;border-radius:8px;overflow:hidden}
#detail .tl-total{padding:8px 12px;border-right:1px solid #edf1ea;border-bottom:1px solid #edf1ea;min-width:0}
#detail .tl-total:nth-child(3n){border-right:0}
#detail .tl-total:nth-last-child(-n+3){border-bottom:0}
#detail .tl-total dt{font-size:12px;font-weight:600;color:#5d6b5e}
#detail .tl-total dd{margin:0;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
#detail .tl-all{background:#f6f8f5}
#detail .tl-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) minmax(0,1.6fr);gap:10px 12px;align-items:start}
#detail .tl-field{display:flex;flex-direction:column;font-size:13px;font-weight:600;color:#4b574c;min-width:0}
#detail .tl-field input{width:100%;box-sizing:border-box;padding:0 10px;font-size:15px}
#detail .tl-field .rk-select{width:100%}
#detail .tl-note{grid-column:1 / 3}
#detail .tl-actions .btn{flex:1 1 auto}
#detail .tl-form[hidden]{display:none}
#detail .tl-actions{display:flex;gap:8px;align-items:center;align-self:end;flex-wrap:wrap}
#detail .tl-actions button{min-height:40px;padding:0 16px}
#detail .ws-card > .tl-head{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin:0 0 12px}
#detail .tl-head h3{margin:0;font-size:18px;line-height:1.3}
@media(max-width:960px),(pointer:coarse){#detail .tl-field input{min-height:44px}#detail .tl-actions button{min-height:44px}}
#detail .tl-message{margin:8px 0 0!important;font-size:14px!important;font-weight:600;color:#24441c}
#detail .tl-message:empty{display:none}
#detail .tl-list{margin-top:14px}
#detail .tl-table,#detail .access-table{overflow-wrap:normal}
#detail .tl-table th:first-child,#detail .tl-table td:first-child,#detail .access-table th:first-child,#detail .access-table td:first-child{padding-left:4px}
#detail .tl-table th:last-child,#detail .tl-table td:last-child,#detail .access-table th:last-child,#detail .access-table td:last-child{padding-right:4px}
#detail .tl-table .t-num{text-align:right;white-space:nowrap}
#detail .tl-table th.t-num{text-align:right}
#detail .tl-table .t-date,#detail .access-table .a-opened{white-space:nowrap}
#detail .tl-table .t-note{overflow-wrap:anywhere;min-width:120px}
#detail .tl-table .t-who > span{display:flex;flex-direction:column}
#detail .tl-table .t-when,#detail .tl-table .t-removed{font-size:12px;color:#5d6b5e}
#detail .tl-table .t-act{text-align:right;white-space:nowrap}
#detail .tl-table .t-remove{min-height:32px}
#detail .tl-table tr.is-removed td:not(.t-act){color:#7a837a}
#detail .tl-table tr.is-removed .t-num{text-decoration:line-through}
@media(max-width:1180px) and (min-width:861px){#detail .tl-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#detail .tl-note,#detail .tl-actions{grid-column:1/-1}}
@media(max-width:860px){#detail .tl-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}}
@media(max-width:600px){
  #detail .tl-totals{grid-template-columns:repeat(2,minmax(0,1fr))}
  #detail .tl-total:nth-child(n){border-right:1px solid #edf1ea;border-bottom:1px solid #edf1ea}
  #detail .tl-total:nth-child(2n){border-right:0}
  #detail .tl-total:nth-last-child(-n+2){border-bottom:0}
  #detail .tl-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #detail .tl-note,#detail .tl-actions{grid-column:1/-1}
  #detail .tl-table thead{display:none}
  #detail .tl-table,#detail .tl-table tbody{display:block}
  #detail .tl-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:2px 12px;padding:10px 0;border-bottom:1px solid #edf1ea}
  #detail .tl-table tbody tr:last-child{border-bottom:0}
  #detail .tl-table td{display:block;padding:0!important;border:0!important;min-width:0;text-align:left!important}
  #detail .tl-table .t-date{font-weight:600}
  #detail .tl-table .t-num{grid-column:3;grid-row:1;text-align:right!important}
  #detail .tl-table .t-num::after{content:' min'}
  #detail .tl-table .t-note,#detail .tl-table .t-who,#detail .tl-table .t-act{grid-column:1/-1}
  #detail .tl-table .t-note:has(.dash){display:none}
  #detail .tl-table .t-who > span{flex-direction:row;flex-wrap:wrap;gap:0 6px;font-size:13px;color:#4b574c}
  #detail .tl-table .t-act:empty{display:none}
}
@container (max-width:560px){
  #detail .ws-time .tl-totals{grid-template-columns:repeat(2,minmax(0,1fr))}
  #detail .ws-time .tl-total:nth-child(n){border-right:1px solid #edf1ea;border-bottom:1px solid #edf1ea}
  #detail .ws-time .tl-total:nth-child(2n){border-right:0}
  #detail .ws-time .tl-total:nth-last-child(-n+2){border-bottom:0}
  #detail .ws-time .tl-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #detail .ws-time .tl-note,#detail .ws-time .tl-actions{grid-column:1/-1}
  #detail .ws-time .tl-table thead{display:none}
  #detail .ws-time .tl-table,#detail .ws-time .tl-table tbody{display:block}
  #detail .ws-time .tl-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:2px 12px;padding:10px 0;border-bottom:1px solid #edf1ea}
  #detail .ws-time .tl-table tbody tr:last-child{border-bottom:0}
  #detail .ws-time .tl-table td{display:block;padding:0!important;border:0!important;min-width:0;text-align:left!important}
  #detail .ws-time .tl-table .t-date{font-weight:600}
  #detail .ws-time .tl-table .t-num{grid-column:3;grid-row:1;text-align:right!important}
  #detail .ws-time .tl-table .t-num::after{content:' min'}
  #detail .ws-time .tl-table .t-note,#detail .ws-time .tl-table .t-who,#detail .ws-time .tl-table .t-act{grid-column:1/-1}
  #detail .ws-time .tl-table .t-note:has(.dash){display:none}
  #detail .ws-time .tl-table .t-who > span{flex-direction:row;flex-wrap:wrap;gap:0 6px;font-size:13px;color:#4b574c}
  #detail .ws-time .tl-table .t-act:empty{display:none}
}

/* ---- Offer Settings (staff; the cards are offers.css's and after-signing.css's) ---- */
body.on-offer-settings :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page,#api-keys-page,#review-rules-page){display:none!important}
#offer-settings-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#offer-settings-page > .ws-back{margin-bottom:6px}
#offer-settings-body{margin-top:16px}

/* ---- API Keys (admins; the page itself is styled in api-keys.css, loaded with its module) ---- */
body.on-api-keys :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page){display:none!important}
#api-keys-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#api-keys-page > .ws-back{margin-bottom:6px}

/* ---- Review Rules (staff; the page itself is styled in review-rules.css, loaded with its module) ---- */
body.on-review-rules :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page,#api-keys-page){display:none!important}
#review-rules-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#review-rules-page > .ws-back{margin-bottom:6px}

/* Version two request page (Oct 16, 2026): Nearest RK Sites and Follow-Up Questions cards on Summary. */
#detail .ws-question-list { margin: 0; padding-left: 20px; }
#detail .ws-question-list li { margin: 0 0 8px; line-height: 1.5; overflow-wrap: anywhere; }
#detail .ws-question-list li:last-child { margin-bottom: 0; }
#detail .ws-site-list dd { overflow-wrap: normal; }
#detail .ws-nearest .ws-quiet-note { margin-top: 10px !important; }

/* ---- Owners (Contract Logistics V3 routing; the page itself is styled in owners.css, loaded with its module) ---- */
body.on-owners :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page,#api-keys-page,#review-rules-page,#offer-settings-page,#finance-page){display:none!important}
#owners-title{outline:none;font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.01em;margin:0}
#owners-page > .ws-back{margin-bottom:6px}
#owners-body{margin-top:16px}
/* Reply clock (24 hours from submission): queue Due cell, drawer badges and the request header chip. */
.sla{color:var(--ink2);font-weight:600}
/* "Reply by" on one line and the whole date and time on the next (never three lines; QA fix round 3, NEW-8). */
small.sla{display:block;margin-top:2px;font-size:12.5px;white-space:normal;max-width:12.5em}
.sla-when{white-space:nowrap}
/* QA fix 3 integration: 961-1024 px has no room for the whole stamp beside seven columns; the time goes under the
   date there instead of the queue scrolling sideways (each part still never splits). */
@media(min-width:961px) and (max-width:1024px){.queue-table .sla-when{white-space:normal}}
.sla-overdue,.sla.is-late{color:var(--red-ink)}
.sla-replied:not(.is-late){color:var(--g800);font-weight:500}
.sla-closed{color:var(--muted);font-weight:500}
.d-badges .sla{font-size:13px}
.ws-chip.sla{font-weight:700}
.ws-chip.sla-overdue,.ws-chip.sla.is-late{background:#fdf0ec;color:var(--red-ink);border-color:#efc5b8}
@media(max-width:960px){
  .queue-table .c-due .due + small.sla{display:inline;margin:0 0 0 8px}
  small.sla{max-width:none}
}
/* Finance page (Oct 20, 2026): billing, invoice and aging items, out of the sales queue. Same table as Exceptions. */
body.on-finance :is(#page-head,#back,#listing,#detail-panel,#signin,#setup,#accounts-page,#facility-page,#pilot-page,#exceptions-page,#capability-page,#api-keys-page,#review-rules-page,#offer-settings-page,#owners-page){display:none!important}
#finance-page > .ws-back{margin-bottom:6px}
.finance-note{margin:-4px 0 12px;color:var(--muted);font-size:13px}
.fin-table .f-req{min-width:200px;width:32%}
.fin-table .f-items{min-width:240px}
.fin-table .f-owner{width:16%}
.fin-table .f-saved{white-space:nowrap;overflow-wrap:normal;width:1%}
.fin-table .request-link{font-size:13px}
.fin-table tbody tr{cursor:pointer}
.f-list{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.f-list .d-link{text-align:left}
@media (max-width:760px){
  .fin-table thead{display:none}
  .fin-table,.fin-table tbody{display:block}
  .fin-table tr{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .fin-table tbody tr:last-child{border-bottom:0}
  .fin-table td{display:block;padding:0!important;border:0!important;min-width:0;width:auto;white-space:normal}
  .fin-table td:not(.f-req)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px}
  .fin-table :is(.f-req,.f-items,.f-owner,.f-saved){width:auto;min-width:0}
}
/* Drawer: the request's finance items under their own heading (same list style as Needs attention). */
.d-finance ul{list-style:none;display:grid;gap:8px;margin:0;padding:0}
.d-finance li{position:relative;padding-left:16px}
.d-finance li::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--line2)}
/* Pilot Numbers by work type (Oct 20, 2026): one row per work type; cards when the seven columns don't fit. */
.p-missing-text{color:var(--muted);font-style:italic;white-space:nowrap}
.p-draft-note{display:block;color:var(--muted);font-size:12px;font-weight:500;white-space:nowrap}
.pilot-measures-table .p-hint{display:block}
@media(max-width:760px){
  .pilot-wt-table thead{display:none}
  .pilot-wt-table,.pilot-wt-table tbody{display:block}
  .pilot-wt-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 12px;padding:12px 14px;border-bottom:1px solid #EDF0EB}
  .pilot-wt-table tbody tr:last-child{border-bottom:0}
  .pilot-wt-table td{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
  .pilot-wt-table .p-wh{grid-column:1/-1;font-weight:600;font-size:14px}
  .pilot-wt-table td:not(.p-wh)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400;font-style:normal}
  .pilot-wt-table tr.p-total{border-top:1px solid var(--line)}
}
/* Weekly Totals: Submitted by Work Type (same layout as Submitted by Service; cards only at 1024 px and below, QA fix
   round 3: it reads straight across from 1025 px). */
.weekly-work-type-table .w-col{white-space:nowrap}
@media(max-width:1024px){
  .weekly-work-type-table thead{display:none}
  .weekly-work-type-table,.weekly-work-type-table tbody{display:block}
  .weekly-work-type-table tr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px 12px;padding:12px 16px;border-bottom:1px solid #EDF0EB}
  .weekly-work-type-table tbody tr:last-child{border-bottom:0}
  .weekly-work-type-table td,.weekly-work-type-table td.p-num{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
  .weekly-work-type-table .w-col{grid-column:1/-1;font-weight:600;font-size:14px}
  .weekly-work-type-table td:not(.w-col)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400;overflow-wrap:anywhere}
}
@media(max-width:700px){.weekly-work-type-table tr{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Every work type across (CL V3 QA fix round 3, RECHECK NEW-2): headers wrap between words and the cells are compact;
   when it still cannot fit, staff.js foldWorkTypes() adds .is-folded and each week becomes the card above. */
@media(min-width:1025px){
  .weekly-work-type-table th.p-num{white-space:normal;width:auto}
  .weekly-work-type-table th.p-num .th-sort{white-space:normal;text-align:right;align-items:flex-end}
  .weekly-work-type-table th:not(:first-child),.weekly-work-type-table td:not(:first-child){padding-left:6px;padding-right:6px}
  .weekly-work-type-table th:first-child,.weekly-work-type-table td:first-child{padding-right:6px}
  .weekly-work-type-table th:last-child,.weekly-work-type-table td:last-child{padding-right:16px}
}
@media(min-width:1101px){
  .weekly-service-table th.p-num{white-space:normal;width:auto}
  .weekly-service-table th.p-num .th-sort{white-space:normal;text-align:right;align-items:flex-end}
}
.weekly-service-table.is-folded thead{display:none}
.weekly-service-table.is-folded,.weekly-service-table.is-folded tbody{display:block}
.weekly-service-table.is-folded tr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px 12px;padding:12px 16px;border-bottom:1px solid #EDF0EB}
.weekly-service-table.is-folded td,.weekly-service-table.is-folded td.p-num{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
.weekly-service-table.is-folded .w-col{grid-column:1/-1;font-weight:600;font-size:14px}
.weekly-service-table.is-folded td:not(.w-col)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400;overflow-wrap:anywhere}
.weekly-work-type-table.is-folded thead{display:none}
.weekly-work-type-table.is-folded,.weekly-work-type-table.is-folded tbody{display:block}
.weekly-work-type-table.is-folded tr{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px 12px;padding:12px 16px;border-bottom:1px solid #EDF0EB}
.weekly-work-type-table.is-folded tbody tr:last-child{border-bottom:0}
.weekly-work-type-table.is-folded td,.weekly-work-type-table.is-folded td.p-num{display:block;padding:0!important;border:0!important;min-width:0;width:auto;text-align:left!important;white-space:normal}
.weekly-work-type-table.is-folded .w-col{grid-column:1/-1;font-weight:600;font-size:14px}
.weekly-work-type-table.is-folded td:not(.w-col)::before{content:attr(data-label);display:block;color:var(--muted);font-size:12px;font-weight:400;overflow-wrap:anywhere}
.weekly-work-type-table.is-folded .w-week{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:0 8px}
/* ---- Value and contribution on every request (CL v3 queue gaps, G9) ------------------------------------------------
   Desktop: two right-aligned columns before Last saved, the range's basis (sent / approved / draft) under the value.
   1180px and below: the contribution folds under the value. Phone cards: one secondary line under the company. */
.queue-table :is(td,th):is(.c-value,.c-contrib){text-align:right;white-space:nowrap}
.val-amt{font-weight:600;color:var(--ink)}
.val-basis{display:block;color:var(--muted);font-size:12px;line-height:1.3}
.val-basis.is-draft{color:var(--amber-ink)}
.contrib-sub{display:none;color:var(--muted);font-size:12px;line-height:1.3}
.val-phone{display:none}
/* Two more columns: the submitted date drops under the status (as below 1180px) and the company share narrows a
   little, so Due (the reply clock) keeps its two lines at 1440. */
@media(min-width:961px){.queue-table.has-values .st-date{display:block;margin-top:1px}.queue-table.has-values .c-co{width:22%}
  .queue-table.has-values td.c-due{min-width:8.5em}}
/* Pre-Joe QA edges N3: with the two value columns, 1181-1366 px had no room for all ten (the table ran up to 91 px past
   its card at 1280 and the page scrolled sideways), so Owner and the contribution fold there as they do below 1180 px;
   and at 961-1100 px a long Routed to name may wrap and Next action gives up 20 px, so Last Saved stays inside the card
   (it ran 9 px past at 1024 and 71 px at 961). */
@media(min-width:1181px) and (max-width:1380px){
  .queue-table.has-values .c-owner,.queue-table.has-values .c-contrib{display:none}
  .queue-table.has-values .owner-sub,.queue-table.has-values .contrib-sub{display:block}
  .queue-table.has-values td.c-value{white-space:normal;min-width:6.5em}
  .queue-table.has-values .val-amt{white-space:nowrap}
}
@media(min-width:961px) and (max-width:1100px){.queue-table .c-routed > span:first-child{white-space:normal}.queue-table .c-next{min-width:100px}}
@media(max-width:1180px){
  .queue-table .c-contrib{display:none}
  .queue-table .contrib-sub{display:block}
  /* The folded contribution may break after its word, so the reply clock in Due keeps its room. */
  .queue-table td.c-value{white-space:normal;min-width:6.5em}
  .queue-table .val-amt{white-space:nowrap}
}
@media(max-width:960px){
  .queue-table.has-values tr{grid-template-areas:"co co saved" "va va va" "st at at" "ro ro ro" "nx nx nx" "du du du"}
  .queue-table td.c-value{grid-area:va;text-align:left;white-space:normal;color:var(--ink2)}
  .queue-table .c-value > *{display:inline;font-size:13px}
  .queue-table .c-value .val-phone{display:inline;font-weight:400;color:var(--muted)}
  .queue-table .c-value .contrib-sub{white-space:nowrap}
  .queue-table td.c-contrib{display:none}
}
/* The request's stage (CL V3 QA fix round 3): one short line under the queue status, a badge in the drawer and the
   header chip. Derived stages read in the brand green; a follow-up status set by hand in the neutral ink. */
.st-stage{display:block;margin-top:2px;font-size:12px;font-weight:600;color:var(--g700,#2c4f1d);white-space:normal}
.st-stage.is-manual{color:var(--ink2)}
.d-badges .st-stage.d-stage{display:inline-block;margin:0;padding:2px 8px;border-radius:999px;background:#eef3ea;border:1px solid #cfdcc8;line-height:1.3}
.d-badges .st-stage.d-stage.is-manual{background:#f3f4f2;border-color:#d9ddd7}
.ws-chip-stage{background:#e5f0de;color:#24461a;border-color:#bcd3ae}
@media(max-width:960px){.queue-table .c-status .st-stage{display:inline;margin:0;white-space:nowrap}.queue-table .c-status .st-stage::before{content:" · ";color:var(--muted);font-weight:400}}
/* Deal History (History tab): what happened, newest first, grouped by day. */
#detail .deal-body{display:flex;flex-direction:column;gap:12px}
#detail .deal-day h4{margin:0 0 6px;font-size:13px;color:var(--muted);font-weight:600}
#detail .deal-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
#detail .deal-item{display:grid;grid-template-columns:7.5em minmax(0,1fr);gap:4px 12px;align-items:baseline}
#detail .deal-time{color:var(--muted);font-size:13px;white-space:nowrap}
#detail .deal-what{display:flex;flex-direction:column;gap:1px;min-width:0}
#detail .deal-what strong{font-weight:600}
#detail .deal-what small{color:var(--muted);font-size:13px;overflow-wrap:anywhere}
@media(max-width:420px){#detail .deal-item{grid-template-columns:minmax(0,1fr)}}
/* Header range tile: the figure, then when it was emailed (QA fix round 3, FRESH N10). */
.ws-kf dd .ws-kf-sub{display:block;margin-top:2px;font-size:12px;font-weight:400;color:var(--muted)}

/* Long free-text answers on the Request (fix round Nov 5 2026, QA edges B9): four lines, then a Show More text button
   with a chevron under the answer. */
#detail .ws-clamp-text{display:block;white-space:pre-wrap}
#detail .ws-clamp-text.is-clamped{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden}
#detail button.ws-quiet.ws-more{display:inline-flex;align-items:center;gap:6px;margin:2px 0 0}
#detail button.ws-quiet.ws-more[hidden]{display:none}
#detail .ws-more .ws-more-icon{width:14px;height:14px;flex:none;transition:transform .15s ease}
#detail .ws-more[aria-expanded=true] .ws-more-icon{transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){#detail .ws-more .ws-more-icon{transition:none}}