/* The client portal (EMM #628, 2026-10-03). The Work look: the same token names and values as
   work_shell.html's palette (dark by default, light re-reads every token), the same chip rungs,
   the same dark top bar in both themes. Restated here because the portal is its own service and
   shares no template with the main app. */
/* New request's shop and checkout colours (EMM #1138, 2026-10-26), one place for both themes:
   solid chips and buttons whose white words hold 4.5:1 on either page */
:root{ --on-solid:#fff;
  --step-done:#1a7f37; --danger-solid:#c9372c; --danger-solid-hover:#a92c22;
  --shop-lift:0 1px 4px rgba(0,0,0,.35); --shop-sheet-shadow:0 -8px 24px rgba(0,0,0,.35);
  /* the shop and checkout's type scale (her #1138 pick, 2026-10-26): four sizes, 12 / 14 / 16 / 20 */
  --fs-xs:.75rem; --fs-sm:.875rem; --fs-md:1rem; --fs-lg:1.25rem; }
:root{
  color-scheme:dark;
  --page:#0d1117; --panel:#151b24; --panel3:#12171f; --card-ground:#1b212b; --col-bg:#161b22;
  --line:#1b222c; --line3:#2a323d; --line4:#3a4453; --rule:#202634;
  --ink:#dbe3ec; --ink-strong:#e6edf3; --dim:#8593a3; --faded:#9fb2c8; --head:#aab6c4;
  --blue:#4c9aff; --blue-ink:#9cc5ff; --blue-line:#4a89d0; --bluebox:#1e2a3f; --blueline2:#2f4668;
  --link:#79b8ff; --late:#ff8079; --entry-well:#0e1117; --hover:#161c26;
  --chip-good-bg:#14532d; --chip-good-ink:#b5f0c8; --chip-good-line:#1f6b3a;
  --chip-warn-bg:#3a3320; --chip-warn-ink:#ffd27a; --chip-warn-line:#5d5334;
  --chip-info-bg:var(--bluebox); --chip-info-ink:var(--blue-ink); --chip-info-line:var(--blueline2);
  --chip-off-bg:#242b36; --chip-off-ink:#c8d2dd; --chip-off-line:#3a4453;
  --chip-alert-bg:#4a1d1d; --chip-alert-ink:#ffb3b3; --chip-alert-line:#743030;
  --internal-bg:rgba(144,133,233,.16); --internal-ink:#b9b0f5; --internal-line:rgba(144,133,233,.5);
  --go-bg:#238636; --go-ink:#ffffff; --accent-bg:#1f6feb; --accent-ink:#ffffff;
  --topbar:#0a0d12; --topbar-ink:#dbe3ec;
  /* Work's board tokens (work_shell.html), for the columns, the cards and the Find box */
  --col-line:#232b36; --line2:#202733; --card-line:#2a323d; --card-line-w:1px; --faded3:#9aa7b6;
  --find-bg:#0e1117; --accent:#1f6feb; --due-late:#ff8079; --due-today:#d0b12f; --chip-radius:999px;
}
html[data-bs-theme=light]{
  color-scheme:light;
  --page:#f3f5f8; --panel:#ffffff; --panel3:#f6f8fa; --card-ground:#ffffff; --col-bg:#e9edf2;
  --line:#e2e7ed; --line3:#cfd7e0; --line4:#c9d2dc; --rule:#cbd1df;
  --ink:#1e242b; --ink-strong:#16191d; --dim:#57626e; --faded:#4d5b6b; --head:#4b5866;
  --blue:#1668cf; --blue-ink:#0f4c96; --blue-line:#2e6cb5; --bluebox:#dbe7f7; --blueline2:#a9c3e6;
  --link:#0b5cc0; --late:#c0392f; --entry-well:#e8ebf1; --hover:#edf1f5;
  --chip-good-bg:#d6f0de; --chip-good-ink:#14532d; --chip-good-line:#8fcca2;
  --chip-warn-bg:#fdf1d3; --chip-warn-ink:#6b4a00; --chip-warn-line:#e2c27a;
  --chip-off-bg:#e6eaf0; --chip-off-ink:#3b4652; --chip-off-line:#c9d2dc;
  --chip-alert-bg:#fde2e1; --chip-alert-ink:#8a1c17; --chip-alert-line:#eaa3a0;
  --internal-bg:#ece9fc; --internal-ink:#4a3fa8; --internal-line:#c3bcf0;
  --col-line:#d5dce5; --line2:#dde3ea; --card-line:#c3ccd7; --card-line-w:1.5px; --faded3:#4f5c6a;
  --find-bg:#ffffff; --accent:#1668cf; --due-late:#c0392f; --due-today:#8a6d00;
}
*{ box-sizing:border-box; }
body{ margin:0; background:var(--page); color:var(--ink); font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
a{ color:var(--link); }
.skip{ position:absolute; left:-999px; top:0; background:var(--panel); padding:6px 10px; z-index:9; }
.skip:focus{ left:8px; }
:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }

/* the top bar stays dark in both themes, like Work's */
/* the bar itself is Work's .navbar.bg-dark: #0a0d12 with the theme's line under it */
.topbar{ display:flex; align-items:center; gap:18px; padding:8px 16px; background:var(--topbar); color:var(--topbar-ink); border-bottom:1px solid var(--line); flex-wrap:wrap; }
.brand{ display:flex; align-items:center; gap:8px; color:var(--topbar-ink); text-decoration:none; font-weight:600; }
.brand img{ border-radius:3px; display:block; }
.brand-x{ color:#8593a3; font-weight:400; }
.brand-client{ font-size:1.05rem; }
/* the OnQ view mark (EMM #689, 2026-10-15): OnQ staff on a client's portal, in the internal tint */
.onq-view-mark{ padding:2px 10px; border-radius:999px; font-size:.75rem; font-weight:700; letter-spacing:.02em; background:var(--internal-bg); color:var(--internal-ink); border:1px solid var(--internal-line); white-space:nowrap; }
/* Work's nav links (EMM #977, 2026-10-14): the plain Bootstrap navbar-dark nav-link Work's #nav
   wears (work_shell.html, "nav matches Capacity exactly"), restated because the portal loads no
   Bootstrap: the current page white, the rest at 55% white, 75% on hover, no box behind them */
.topnav{ display:flex; gap:0; flex-wrap:wrap; }
.topnav .nav-link{ display:block; color:rgba(255,255,255,.55); text-decoration:none; padding:.5rem .5rem; font-size:1rem; line-height:1.5;
  transition:color .15s ease-in-out; }
.topnav .nav-link:hover, .topnav .nav-link:focus-visible{ color:rgba(255,255,255,.75); }
.topnav .nav-link.active{ color:#fff; }
.topbar-right{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.who{ color:#c3cdd8; text-decoration:none; }
.mode-switch{ background:#161c26; color:#c3cdd8; border:1px solid #2a323d; border-radius:999px; padding:3px 10px; cursor:pointer; font-size:.8rem; }
html[data-bs-theme=dark] .mode-dark, html:not([data-bs-theme=light]) .mode-dark{ display:none; }
html[data-bs-theme=light] .mode-light{ display:none; }
.preview-bar{ background:var(--internal-bg); color:var(--internal-ink); border-bottom:1px solid var(--internal-line); padding:8px 16px; font-weight:600; }

.page{ max-width:1500px; margin:0 auto; padding:20px 16px 48px; }
.page-title{ font-size:1.35rem; margin:0 0 4px; color:var(--ink-strong); }
.page-sub{ color:var(--dim); margin:0 0 16px; }
.card{ background:var(--panel); border:1px solid var(--line3); border-radius:10px; margin-bottom:16px; }
.card-h{ padding:10px 14px; border-bottom:1px solid var(--line3); font-weight:600; color:var(--head); display:flex; align-items:center; gap:8px; }
.card-b{ padding:12px 14px; }
.muted{ color:var(--dim); }
.small{ font-size:.85rem; }
.row{ display:flex; gap:16px; flex-wrap:wrap; }
.col{ flex:1 1 320px; min-width:0; }
.grid2{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px 16px; }

.chip{ display:inline-block; font-size:.72rem; font-weight:600; padding:1px 7px; border-radius:999px; border:1px solid var(--chip-off-line); background:var(--chip-off-bg); color:var(--chip-off-ink); white-space:nowrap; }
.chip-good{ background:var(--chip-good-bg); color:var(--chip-good-ink); border-color:var(--chip-good-line); }
.chip-warn{ background:var(--chip-warn-bg); color:var(--chip-warn-ink); border-color:var(--chip-warn-line); }
.chip-info{ background:var(--chip-info-bg); color:var(--chip-info-ink); border-color:var(--chip-info-line); }
.chip-alert{ background:var(--chip-alert-bg); color:var(--chip-alert-ink); border-color:var(--chip-alert-line); }
.chip-off{ background:var(--chip-off-bg); color:var(--chip-off-ink); border-color:var(--chip-off-line); }

.btn{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line4); background:var(--panel3); color:var(--ink); padding:6px 12px; border-radius:6px; cursor:pointer; font:inherit; text-decoration:none; }
.btn:hover{ background:var(--hover); }
.btn:disabled{ opacity:.55; cursor:not-allowed; }
.btn-go{ background:var(--go-bg); color:var(--go-ink); border-color:transparent; font-weight:600; }
.btn-accent{ background:var(--accent); color:#fff; border-color:transparent; font-weight:600; }
.btn-accent:hover{ background:var(--accent); filter:brightness(1.1); }
.btn-soft{ background:transparent; }
.btn-sm{ padding:3px 9px; font-size:.85rem; }
.btn-danger{ color:var(--late); border-color:var(--chip-alert-line); background:transparent; }

label.field{ display:block; margin-bottom:12px; }
label.field > span{ display:block; color:var(--head); font-size:.85rem; margin-bottom:4px; font-weight:600; }
input[type=text], input[type=email], input[type=date], input[type=number], input[type=search], select, textarea{
  width:100%; background:var(--entry-well); color:var(--ink); border:1px solid var(--line4); border-radius:6px; padding:7px 9px; font:inherit; }
textarea{ min-height:90px; resize:vertical; }
.hint{ color:var(--dim); font-size:.8rem; margin-top:3px; }
.hp{ position:absolute; left:-5000px; width:1px; height:1px; overflow:hidden; }
.errors{ background:var(--chip-alert-bg); color:var(--chip-alert-ink); border:1px solid var(--chip-alert-line); border-radius:8px; padding:10px 14px; margin-bottom:14px; }
.errors ul{ margin:4px 0 0; padding-left:18px; }
.notice{ background:var(--chip-info-bg); color:var(--chip-info-ink); border:1px solid var(--chip-info-line); border-radius:8px; padding:10px 14px; margin-bottom:14px; }
.notice-warn{ background:var(--chip-warn-bg); color:var(--chip-warn-ink); border-color:var(--chip-warn-line); }
.nr-short-ok{ display:flex; gap:8px; align-items:center; margin:0 0 10px; font-weight:600; }   /* EMM #1324 */

/* the Requests toolbar: filters on the left, the view switch and Board settings on the far right */
.toolbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.toolbar .grow{ flex:1; }
.toolbar select{ width:auto; }
.toggle{ display:inline-flex; align-items:center; gap:6px; cursor:pointer; user-select:none; }
.seg{ display:inline-flex; border:1px solid var(--line4); border-radius:8px; overflow:hidden; }
.seg button{ background:transparent; color:var(--faded); border:0; padding:6px 11px; cursor:pointer; font:inherit; }
.seg button + button{ border-left:1px solid var(--line4); }
.seg button[aria-pressed=true]{ background:var(--bluebox); color:var(--blue-ink); font-weight:600; }
.pop{ position:relative; }
.pop-list{ position:absolute; right:0; top:calc(100% + 4px); background:var(--panel); border:1px solid var(--line3); border-radius:10px; padding:.3rem; min-width:236px; max-width:min(92vw,560px); z-index:20; box-shadow:0 10px 28px rgba(0,0,0,.45); color:var(--ink); }
.pop-list[hidden]{ display:none; }
/* Work's menu rows (.pan-menu-list in work_shell.html) */
.pan-menu-list a:not(.btn), .pan-menu-list button:not(.btn){ display:flex; align-items:center; gap:.5rem; width:100%; text-align:left; background:transparent;
  border:0; color:var(--ink); font:inherit; font-size:.82rem; padding:.42rem .6rem; border-radius:7px; text-decoration:none; cursor:pointer; }
.pan-menu-list a:not(.btn):hover, .pan-menu-list button:not(.btn):hover{ background:var(--line); color:var(--ink-strong); }
.pan-menu-list button.pm-danger{ color:var(--late); }
.pan-menu-list button.pm-danger:hover{ background:#c9372c; color:#fff; }
.pan-menu-list form{ margin:0; }
.pf-h{ font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); margin:0 0 .4rem; }
.mb-3{ margin-bottom:.9rem; }
.jf-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.15rem .8rem; }
.jf-opt{ display:flex; align-items:center; gap:.5rem; padding:.3rem .4rem; border-radius:7px; cursor:pointer; color:var(--ink); font-size:.83rem; margin:0; }
.jf-opt span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.jf-opt:hover{ background:var(--line); }
.jf-opt input{ width:15px; height:15px; flex:none; accent-color:var(--blue-line); }
.rf-panel{ left:0; right:auto; width:min(560px,92vw); max-height:70vh; overflow:auto; padding:.9rem; }
.pf-foot{ display:flex; gap:.5rem; }
#board-settings{ padding:.7rem .8rem; }

/* the top bar's + New request (Work's blue) and the profile pill (Work's .tb-pill, wide) */
.nav-new{ white-space:nowrap; }
.tb-pill{ height:34px; border-radius:999px; border:1.5px solid #4a5871; background:#1a2231; color:#e4eaf2; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; padding:0 11px 0 4px; font:inherit; font-size:.78rem; font-weight:600; }
.tb-pill:hover{ border-color:#79b8ff; color:#79b8ff; }
.avx{ width:24px; height:24px; border-radius:50%; background:#2563eb; color:#fff; font-size:.62rem; font-weight:700; display:inline-grid; place-items:center; }
.profile-menu{ min-width:260px; }
.profile-menu .pm-head{ padding:.5rem .6rem .6rem; border-bottom:1px solid var(--line3); margin-bottom:.3rem; }
.profile-menu .pm-head .chip{ margin-top:4px; }

/* the Requests head: the title, the view switch and Board settings; under it Work's find row */
.page-head{ display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.page-head .grow{ flex:1; }
.find-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.find-row .count{ margin-left:auto; }
input.find{ width:220px; background:var(--find-bg); border-color:var(--line3); color:var(--ink); font-size:.8rem; height:29.2px; padding:4px 9px; }
input.find::placeholder{ font-size:.8rem; }
.scope-pills{ display:inline-flex; gap:6px; }
.fchips{ display:inline-flex; gap:6px; flex-wrap:wrap; }
.fchip{ display:inline-flex; align-items:center; gap:4px; background:transparent; border:0; padding:0; cursor:pointer; color:var(--dim); font:inherit; font-size:.75rem; }
.fchip .fx{ font-size:.9rem; line-height:1; }
.fchip:hover .fx{ color:var(--late); }
.tdot{ width:9px; height:9px; border-radius:50%; background:var(--c); flex:none; display:inline-block; }
.board-msg{ min-height:1.2em; margin-top:8px; }

/* the columns and cards: Work's .kanban, .kcol and .tcard (work_shell.html), restated */
/* one row of columns that scrolls sideways (a client board has six at most), so a column never
   wraps under the others at full width */
/* the columns WRAP onto the next row and the page scrolls, as Work's boards (EMM #79 there; the
   portal's By team, EMM #977, 2026-10-14), never one endless row scrolled sideways */
.kanban{ display:flex; flex-wrap:wrap; gap:.8rem; align-items:flex-start; padding-bottom:.4rem; overflow:visible; }
.kcol{ min-width:236px; flex:1 1 236px; background:var(--col-bg); border:1px solid var(--col-line); border-radius:12px; }
.kcol-h{ padding:.7rem .85rem; border-bottom:1px solid var(--line2); font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--head); display:flex; align-items:center; gap:.45rem; position:sticky; top:0; z-index:3; background:var(--col-bg); border-radius:12px 12px 0 0; }
.kcol-h .kcol-name{ cursor:pointer; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kcol-h .n{ margin-left:auto; }
.kcol-b{ padding:.6rem; display:flex; flex-direction:column; gap:.55rem; min-height:40px; }
.kcol-empty{ font-size:.75rem; color:var(--dim); padding:.2rem; }
.kcol-shut{ min-width:44px; max-width:44px; flex:0 0 44px; cursor:pointer; }
.kcol-shut-label{ writing-mode:vertical-rl; transform:rotate(180deg); padding:.7rem .2rem; font-size:.72rem; font-weight:700; letter-spacing:.06em; color:var(--head); white-space:nowrap; cursor:pointer; }
.kcol.drop-no{ outline:1px dashed var(--late); outline-offset:-2px; }
.tcard{ position:relative; display:block; background:var(--card-ground); border:var(--card-line-w) solid var(--card-line); border-radius:9px; padding:.6rem .65rem; color:var(--ink); cursor:pointer; }
.tcard:hover{ border-color:var(--blue-line); }
.tcard.dragging{ opacity:.5; }
.tcard .tc-id{ position:absolute; top:5px; right:8px; font-size:.64rem; }
.tcard .tc-kind{ font-size:.62rem; text-transform:uppercase; letter-spacing:.07em; color:var(--dim); margin-bottom:.15rem; display:flex; align-items:baseline; gap:.4rem; padding-right:3.5em; }
.tcard .tc-kind .tc-job{ min-width:5.4ch; letter-spacing:0; white-space:nowrap; }
.tcard .tt{ font-size:.82rem; font-weight:600; color:var(--ink); line-height:1.3; }
.tcard .tc-prog{ font-size:.68rem; color:var(--dim); }
.tcard .tc-chips{ display:flex; align-items:center; gap:.25rem; flex-wrap:wrap; margin-top:.35rem; }
.tcard .tc-foot{ display:flex; align-items:center; gap:.5rem; margin-top:.45rem; flex-wrap:wrap; }
.tcard .tc-by{ font-size:.68rem; color:var(--faded3); }
.tc-icons{ display:inline-flex; align-items:center; gap:.7rem; margin-left:auto; }
.rq-badge{ display:inline-flex; align-items:center; gap:4px; padding:1px 6px; border-radius:9px; background:var(--panel); border:1px solid var(--line3);
  color:var(--faded3); font-size:.7rem; line-height:1.2; white-space:nowrap; text-decoration:none; }
.rq-badge:hover{ color:var(--link); }
.rq-badge.none{ opacity:.45; }
.rq-badge .ico{ width:12px; height:12px; }
.rq-badge .jobnum{ font-size:.7rem; line-height:1; color:inherit; }
.tc-icons .rq-badge{ background:transparent; border-color:transparent; padding:0; }
.s.tmchip{ border-radius:var(--chip-radius); padding-inline:6px; max-width:100%; overflow:hidden; text-overflow:ellipsis; font-weight:700; }
.s.due{ border-radius:var(--chip-radius); border:1px solid var(--line4); color:var(--faded3); background:transparent; }
.s.due-late{ color:var(--due-late); border-color:var(--due-late); }
.s.due-today{ color:var(--due-today); border-color:var(--due-today); }
.s[class*="stc-"]{ min-width:84px; text-align:center; }
table.rq-list .icons-col{ width:104px; white-space:nowrap; }
table.rq-list td.icons-col .rq-badge + .rq-badge{ margin-left:6px; }
table.rq-list th .ico{ width:12px; height:12px; }

/* Set up a passkey, and the sign-in's folded code form */
.setup-steps{ margin:0 0 14px; padding-left:18px; color:var(--ink); }
.setup-steps li{ margin-bottom:6px; }
details.code-alt > summary{ cursor:pointer; list-style:none; }
details.code-alt > summary::-webkit-details-marker{ display:none; }
details.code-alt:not([open]) > summary{ color:var(--link); }

table.tbl{ width:100%; border-collapse:collapse; }
.tbl th{ text-align:left; color:var(--head); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; padding:8px 10px; border-bottom:1px solid var(--line3); white-space:nowrap; }
.tbl td{ padding:8px 10px; border-bottom:1px solid var(--rule); vertical-align:top; }
.tbl tr:hover td{ background:var(--hover); }
.tbl td.num, .tbl th.num{ text-align:right; font-variant-numeric:tabular-nums; }
.tbl-wrap{ overflow-x:auto; }
.jobnum{ font-family:ui-monospace,Menlo,Consolas,monospace; font-size:.82rem; color:var(--faded); }
.empty{ padding:18px; color:var(--dim); text-align:center; }

/* Calendar */
.cal-head{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.cal{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border:1px solid var(--line3); border-radius:10px; overflow:hidden; }
.cal .dow{ background:var(--panel3); color:var(--head); font-size:.75rem; padding:6px; text-align:center; border-bottom:1px solid var(--line3); }
.cal .day{ min-height:96px; border-right:1px solid var(--rule); border-bottom:1px solid var(--rule); padding:4px; background:var(--panel); }
.cal .day.out{ background:var(--panel3); opacity:.6; }
.cal .day.today{ outline:2px solid var(--blue-line); outline-offset:-2px; }
.cal .dnum{ font-size:.75rem; color:var(--dim); }
.cal .ev{ display:block; font-size:.75rem; margin-top:3px; padding:2px 5px; border-radius:4px; background:var(--bluebox); color:var(--blue-ink); text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* the thread */
.thread{ display:flex; flex-direction:column; gap:10px; max-height:300px; overflow-y:auto; overscroll-behavior:contain; }
/* a message is Work's line wherever it is drawn (the card, the pill window, a topic), never a
   bubble (EMM #977, 2026-10-14) */
.msg{ position:relative; }
.msg .by{ font-weight:600; color:var(--blue-ink); }
.msg .when{ color:var(--dim); font-size:.75rem; margin-left:6px; }
.msg .body{ white-space:pre-wrap; margin-top:3px; }
dl.facts{ display:grid; grid-template-columns:max-content 1fr; gap:4px 14px; margin:0; }
dl.facts dt{ color:var(--dim); }
dl.facts dd{ margin:0; white-space:pre-wrap; }

/* the inventory picker */
.picker-tabs{ margin-bottom:10px; }
.pick-line td{ vertical-align:middle; }
.ok{ color:var(--chip-good-ink); }
.short{ color:var(--late); font-weight:600; }
.held-note{ font-size:.78rem; color:var(--dim); }
.qty-in{ width:80px; }

.signin{ max-width:420px; margin:40px auto; }
.or{ text-align:center; color:var(--dim); margin:14px 0; }
.wide{ width:100%; justify-content:center; }
@media (max-width:640px){ .page{ padding:14px 12px 40px; } .kcol{ min-width:100%; }
  .topbar{ gap:10px; } .tb-pill .tb-name{ display:none; } .tb-pill{ padding:0 4px; } input.find{ width:100%; } .find-row .count{ margin-left:0; } }

/* ── the third round (EMM #628, 2026-10-03) ─────────────────────────────────────────────── */
b.req{ color:var(--late); font-weight:700; }
.flab{ display:block; color:var(--head); font-size:.85rem; margin-bottom:4px; font-weight:600; }
div.field{ margin-bottom:12px; }
.addnew{ display:flex; gap:6px; margin-top:6px; }
.addnew input{ flex:1; }
input[type=url], input[type=time]{ background:var(--entry-well); color:var(--ink); border:1px solid var(--line4); border-radius:6px; padding:7px 9px; font:inherit; width:100%; }

/* the multi-picks: Work's filter checklist, the ticked ones as removable chips under it */
.ms .ms-btn{ width:100%; justify-content:space-between; }
.ms .ms-list{ left:0; right:auto; width:min(320px,90vw); max-height:340px; overflow:auto; padding:.5rem; }
.ms .ms-list .find{ width:100%; margin-bottom:6px; }
.ms-opts{ display:flex; flex-direction:column; }
.ms-add{ display:flex; gap:6px; border-top:1px solid var(--line3); margin-top:6px; padding-top:6px; }
.ms-add input{ flex:1; padding:4px 8px; }
.ms-chips{ display:flex; flex-wrap:wrap; gap:5px; margin-top:6px; }
.ms-chip{ display:inline-flex; align-items:center; gap:5px; border:1px solid var(--chip-info-line); background:var(--chip-info-bg); color:var(--chip-info-ink);
  border-radius:999px; padding:1px 4px 1px 9px; font:inherit; font-size:.78rem; cursor:pointer; }
.ms-chip .fx{ font-size:.95rem; line-height:1; padding:0 3px; }
.ms-chip:hover .fx{ color:var(--late); }
.wave-row, .xl-row{ display:flex; gap:6px; align-items:center; margin-bottom:6px; flex-wrap:wrap; }
.wave-row input[type=date]{ width:170px; }
.wave-row input[type=text], .xl-row .xl-url{ flex:1 1 220px; }
.xl-row .xl-name{ flex:0 1 200px; }
.wave-n{ font-size:.78rem; color:var(--dim); min-width:52px; }
.irt-ed{ background:var(--entry-well); }

/* the programs panel and a program's page */
.pg-sec{ font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--dim); padding:10px 14px 4px; }
.pg-list{ list-style:none; margin:0; padding:0 0 6px; }
.pg-list li.empty{ padding:10px 14px; text-align:left; }
.pg-item{ display:flex; flex-direction:column; gap:3px; padding:7px 14px; text-decoration:none; color:var(--ink); border-left:3px solid transparent; }
.pg-item:hover{ background:var(--hover); border-left-color:var(--blue-line); }
.pg-name{ font-weight:600; font-size:.88rem; }
.pg-meta{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.ver{ border-bottom:1px solid var(--rule); padding:8px 0; }
.ver:last-child{ border-bottom:0; }
.ver .chip{ margin-left:4px; }
ul.chg{ margin:4px 0 0; padding-left:18px; font-size:.85rem; }
.intake-rich p{ margin:0 0 .35rem; } .intake-rich ul, .intake-rich ol{ margin:0 0 .35rem; padding-left:1.3rem; }
.intake-rich h1{ font-size:1.15rem; } .intake-rich h2{ font-size:1.05rem; } .intake-rich h3{ font-size:.95rem; }

/* Inventory in Work's Kits & Parts look: small, dense, a state edge on each row */
table.kp{ font-size:.78rem; }
table.kp th{ font-size:.66rem; letter-spacing:.05em; padding:5px 8px; position:sticky; top:0; background:var(--panel); z-index:1; }
table.kp th.sortable{ cursor:pointer; user-select:none; }
table.kp th[aria-sort=ascending]::after{ content:" \25b2"; } table.kp th[aria-sort=descending]::after{ content:" \25bc"; }
table.kp td{ padding:3px 8px; vertical-align:middle; }
.kp-edge{ width:4px; padding:0 !important; }
tr.st-short td.kp-edge, tr.st-out td.kp-edge{ background:var(--late); }
tr.st-low td.kp-edge{ background:#e0a100; }
tr.st-ok td.kp-edge{ background:#2f9e5b; }
tr.st-short .kp-av, tr.st-out .kp-av{ color:var(--late); font-weight:700; }
tr.st-low .kp-av{ color:var(--chip-warn-ink); font-weight:700; }
tr.st-ok .kp-av{ color:var(--chip-good-ink); font-weight:700; }
.kp-st{ font-size:.62rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:0 6px; border-radius:4px; white-space:nowrap; }
tr.st-short .kp-st, tr.st-out .kp-st{ background:var(--chip-alert-bg); color:var(--chip-alert-ink); }
tr.st-low .kp-st{ background:var(--chip-warn-bg); color:var(--chip-warn-ink); }
tr.st-ok .kp-st{ background:var(--chip-good-bg); color:var(--chip-good-ink); }
.sdot{ display:inline-block; width:8px; height:8px; border-radius:2px; margin-left:6px; vertical-align:middle; }
.sdot.st-short{ background:var(--late); } .sdot.st-low{ background:#e0a100; } .sdot.st-ok{ background:#2f9e5b; }
.kp-pn{ font-weight:600; color:var(--ink-strong); }
.kp-desc{ min-width:200px; max-width:320px; }
.kp-note{ font-size:.7rem; color:var(--dim); }
.kp-pend{ font-size:.66rem; color:var(--chip-warn-ink); }
.kp-type, .kp-kit{ font-size:.62rem; padding:0 6px; border-radius:4px; background:color-mix(in srgb, var(--c) 14%, transparent); color:var(--c);
  border:1px solid color-mix(in srgb, var(--c) 40%, transparent); white-space:nowrap; display:inline-block; }
html[data-bs-theme=light] .kp-type, html[data-bs-theme=light] .kp-kit{ color:color-mix(in srgb, var(--c) 70%, #000); }
.kp-kits{ white-space:nowrap; } .kp-kits .kp-kit{ margin-right:3px; max-width:170px; overflow:hidden; text-overflow:ellipsis; vertical-align:middle; }
.kp-more{ font-size:.62rem; color:var(--dim); }
table.kp .jobnum{ font-size:.72rem; }
.kp-prog{ white-space:nowrap; }
table.kp .tmchip{ font-size:.6rem; }
.d-none{ display:none !important; }
.addnew[hidden], .ms-list[hidden]{ display:none; }
.when-pair input[type=date]{ flex:1 1 auto; min-width:0; width:auto; }
.kp-edit{ font-size:.72rem; padding:1px 7px; white-space:nowrap; }
.inv-sel{ width:auto; font-size:.8rem; padding:3px 8px; height:29.2px; }
.inv-key{ white-space:nowrap; }
.inv-edit{ position:absolute; z-index:60; width:380px; max-width:calc(100vw - 24px); box-shadow:0 12px 32px rgba(0,0,0,.35); }

/* the thread: mentions, reactions, Work's composer */
.mention{ color:#b9b0f5; font-weight:600; }
html[data-bs-theme=light] .mention{ color:#4a3fa8; }
.msg .body ul{ margin:2px 0; padding-left:18px; }
/* Work's reactions (js/work/reactions.js rxChips: a status chip per emoji, the row hidden while
   empty) and its message tools on hover (work_shell.html .msg .mtools: the smile opens the five),
   inside the message at its top-right corner as on every Work thread (EMM #1068; EMM #1148, 2026-10-25) */
.rxrow{ display:flex; gap:4px; align-items:center; flex-wrap:wrap; margin-top:4px; }
.rxrow .s{ text-transform:none; letter-spacing:0; cursor:pointer; font:inherit; font-size:var(--chip-fs-sm, .72rem); background:transparent; color:var(--ink); }
.rxrow .s.me{ border-color:var(--blue); color:var(--react-ink, var(--blue-ink)); }
.msg .mtools{ display:none; position:absolute; top:4px; right:6px; gap:2px; align-items:center; background:var(--deep2, var(--panel)); border:1px solid var(--line3); border-radius:6px; padding:1px 3px; z-index:6; }
.msg .mtools:has(.msg-react-box:not([hidden])){ display:flex; }
@media (hover: hover){ .msg:hover .mtools{ display:flex; } }
@media (hover: none){ .msg.msg-tools-on .mtools{ display:flex; } .msg .mtools .btn{ min-width:36px; min-height:36px; } }
.msg .mtools .btn{ line-height:1; color:var(--faded); background:transparent; }
.msg .mtools .btn:hover{ color:var(--ink-strong); }
.msg .mtools .pan-menu{ position:relative; display:inline-block; }
.msg-react-box{ position:absolute; bottom:120%; right:0; background:var(--panel3); border:1px solid var(--line3); border-radius:6px; padding:2px 5px; white-space:nowrap; display:flex; gap:3px; }
.msg-react-box[hidden]{ display:none; }
.emoji-menu button{ background:transparent; border:0; font-size:1.05rem; cursor:pointer; padding:2px 4px; border-radius:6px; }
.emoji-menu button:hover{ background:var(--line); }
.composer{ margin-top:12px; position:relative; }
.fmtbar{ display:flex; align-items:center; gap:2px; margin-bottom:4px; flex-wrap:wrap; }
.fb{ background:transparent; border:0; color:var(--faded); font:inherit; font-size:.82rem; padding:3px 7px; border-radius:5px; cursor:pointer; }
.fb:hover{ background:var(--line); color:var(--ink-strong); }
.fb-b{ font-weight:700; } .fb-i{ font-style:italic; } .fb-u{ text-decoration:underline; }
.emoji-menu{ left:0; right:auto; min-width:0; display:flex; gap:2px; padding:3px 4px; white-space:nowrap; }
.cbox{ min-height:64px; max-height:200px; overflow-y:auto; white-space:pre-wrap; background:var(--entry-well); border:1px solid var(--line4); border-radius:6px; padding:7px 9px; color:var(--ink); outline:none; }
.cbox:focus{ border-color:var(--blue-line); box-shadow:0 0 0 2px color-mix(in srgb, var(--blue) 30%, transparent); }
.cbox:empty::before{ content:attr(data-ph); }
.cbox.over{ box-shadow:inset 0 0 0 2px var(--blue); }
.cbox ul{ margin:0; padding-left:18px; }
.mention-menu{ position:absolute; z-index:30; left:0; margin-top:2px; min-width:240px; background:var(--panel); border:1px solid var(--line3); border-radius:8px; padding:3px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.mm-opt{ display:flex; justify-content:space-between; gap:12px; padding:5px 8px; border-radius:6px; cursor:pointer; font-size:.84rem; }
.mm-opt.on, .mm-opt:hover{ background:var(--bluebox); color:var(--blue-ink); }
.csend{ display:flex; align-items:center; gap:10px; margin-top:8px; }

/* a calendar card as a pop-up, and the page inside it */
.card-pop{ position:fixed; inset:0; z-index:100; background:rgba(5,8,12,.55); display:flex; align-items:center; justify-content:center; padding:16px; }
.card-pop-box{ width:min(1120px,100%); height:min(88vh,920px); background:var(--page); border:1px solid var(--line3); border-radius:12px; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.card-pop-h{ display:flex; align-items:center; gap:8px; padding:8px 12px; border-bottom:1px solid var(--line3); background:var(--panel); }
.card-pop-h .grow{ flex:1; }
.card-pop iframe{ flex:1; border:0; width:100%; background:var(--page); }
body.embed .page{ padding-top:10px; }

/* the Requests list: the program small at the far left, the number small */
table.rq-list th.prog-col, table.rq-list td.prog-col{ max-width:190px; }
a.rq-prog{ font-size:.72rem; color:var(--faded); text-decoration:none; display:inline-block; max-width:190px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:middle; }
a.rq-prog:hover{ color:var(--link); text-decoration:underline; }
table.rq-list .id-col{ font-size:.7rem; width:52px; }

/* New request: priority labels, yes/no, the time beside the date, the store list drop zone */
.prio{ display:flex; gap:6px; flex-wrap:wrap; }
.prio-opt input, .yn-opt input{ position:absolute; opacity:0; width:1px; height:1px; }
.prio-opt span{ display:inline-block; padding:3px 12px; border-radius:999px; border:1px solid color-mix(in srgb, var(--c) 55%, transparent); color:var(--c); font-weight:600; font-size:.82rem; cursor:pointer; }
html[data-bs-theme=light] .prio-opt span{ color:color-mix(in srgb, var(--c) 75%, #000); }
.prio-opt input:checked + span{ background:var(--c); color:#fff; }
.prio-opt input:focus-visible + span, .yn-opt input:focus-visible + span{ outline:2px solid var(--blue); outline-offset:2px; }
.yn{ display:inline-flex; border:1px solid var(--line4); border-radius:8px; overflow:hidden; }
.yn-opt span{ display:inline-block; padding:5px 16px; cursor:pointer; color:var(--faded); }
.yn-opt + .yn-opt span{ border-left:1px solid var(--line4); }
.yn-opt input:checked + span{ background:var(--bluebox); color:var(--blue-ink); font-weight:600; }
.when-pair{ display:flex; gap:6px; }
.when-pair input[type=time]{ width:130px; flex:none; }
.drop{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; border:1.5px dashed var(--line4); border-radius:10px; padding:18px 12px; margin-bottom:12px; cursor:pointer; text-align:center; background:var(--panel3); position:relative; }
.drop input[type=file]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
.drop.over{ border-color:var(--blue); background:var(--bluebox); }
.drop.has{ border-style:solid; border-color:var(--chip-good-line); }
.places-el{ display:block; margin-top:6px; width:100%; color-scheme:inherit; }
@media (max-width:640px){ .inv-edit{ left:12px !important; } .card-pop{ padding:0; } .card-pop-box{ height:100vh; border-radius:0; } }

/* ── EMM #898, 2026-10-13: the Requests list's heads in Work's size (work_shell.html's
   `table thead th`), its sort marks and column drag, and Board settings as Work's gear ── */
.tbl.rq-list th{ font-size:.64rem; font-weight:700; letter-spacing:.07em; color:var(--dim); position:relative; overflow:hidden; text-overflow:ellipsis; }
.tbl.rq-list td{ overflow:hidden; text-overflow:ellipsis; }
.tbl th.sortable{ cursor:pointer; user-select:none; }
.tbl th.sort-asc::after{ content:" \25B2"; font-size:.55rem; }
.tbl th.sort-desc::after{ content:" \25BC"; font-size:.55rem; }
.tbl th.col-drop{ box-shadow:inset 3px 0 0 var(--blue-ink); }
.tbl th:focus-visible{ outline:2px solid var(--blue-ink); outline-offset:-2px; }
.bs-gear{ font-size:1rem; line-height:1; padding:5px 8px; }
.bs-row{ display:flex; align-items:center; gap:4px; padding:1px 4px; }
.bs-row .grow{ flex:1; }
.bs-row .jf-opt{ flex:0 1 auto; }
.bs-mv{ padding:0 7px; min-width:28px; }

/* ── EMM #898, 2026-10-13: Work's composer bar, tags and pictures in the box, the app's own
   dialogs, the Attachments box's Edit, the file button and the popped-out pills. The few
   Bootstrap utilities Work's shared markup carries are restated here (the portal loads no
   Bootstrap). ── */
.p-0{ padding:0 !important; } .px-1{ padding-left:.25rem !important; padding-right:.25rem !important; }
.py-0{ padding-top:0 !important; padding-bottom:0 !important; } .ms-2{ margin-left:.5rem !important; }
.border-0{ border:0 !important; } .fw-bold{ font-weight:700 !important; } .fst-italic{ font-style:italic !important; }
.text-decoration-underline{ text-decoration:underline !important; } .text-danger{ color:var(--late) !important; }
.text-warning{ color:#d29922 !important; } .small{ font-size:.82rem; }
.fmtbar .btn{ background:transparent; color:var(--faded, var(--dim)); min-width:26px; min-height:26px; }
.fmtbar .btn:hover{ color:var(--ink); background:var(--line); }
.fmtbar .pan-menu{ position:relative; display:inline-block; }
.fmtbar .pan-menu-list{ position:absolute; top:calc(100% + 2px); z-index:40; background:var(--panel); border:1px solid var(--line3); border-radius:8px; box-shadow:0 10px 28px rgba(0,0,0,.35); }
.cbox .mention, [contenteditable="true"] .mention{ color:#b9b0f5; background:rgba(137,87,229,.18); font-weight:600; border-radius:4px; padding:0 .2em; white-space:nowrap; }
html[data-bs-theme=light] .cbox .mention, html[data-bs-theme=light] .msg .mention{ color:#4a3fa8; background:rgba(110,84,200,.12); }
.msg .mention{ background:rgba(137,87,229,.18); border-radius:4px; padding:0 .2em; }
.msg-edit-pic{ display:inline-block; position:relative; vertical-align:top; margin:.25rem 0; user-select:none; }
.msg-edit-pic img{ display:block; max-width:100%; max-height:160px; border-radius:6px; }
.msg-edit-pic-x{ position:absolute; top:4px; right:4px; width:22px; height:22px; line-height:20px; padding:0; border-radius:50%; border:1px solid var(--line3); background:var(--panel); color:var(--ink); font-size:14px; cursor:pointer; }
.csend{ display:flex; align-items:center; gap:8px; margin-top:6px; }
.csend .grow, .card-h .grow{ flex:1; }
.card-h{ display:flex; align-items:center; gap:6px; }
#tk-mention-box [role=option]:hover, #tk-mention-box [role=option]:focus{ background:var(--line); }
.onq-ask{ position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:16px; }
.onq-ask-back{ position:absolute; inset:0; background:rgba(5,8,12,.55); }
.onq-ask-box{ position:relative; width:min(440px,100%); background:var(--panel); color:var(--ink); border:1px solid var(--line3); border-radius:12px; padding:16px; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.onq-ask-title{ font-weight:700; margin-bottom:6px; }
.onq-ask-body{ white-space:pre-wrap; color:var(--dim); font-size:.88rem; }
.onq-ask-in{ width:100%; margin-top:10px; }
.onq-ask-row{ display:flex; justify-content:flex-end; gap:8px; margin-top:14px; }
.onq-ask-x{ position:absolute; top:8px; right:10px; background:transparent; border:0; color:var(--dim); cursor:pointer; }
#tk-files > div{ padding:2px 0; }
#tk-files .at-name{ width:100%; max-width:320px; }
.file-pick-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.file-pick-row label.btn{ cursor:pointer; }
body.embed .page{ padding-top:10px; }

/* ── EMM #898, 2026-10-13: Find a request in the top bar (Work's nav search) ── */
.nav-find{ position:relative; display:flex; align-items:center; }
.nav-find-in{ width:220px; padding:5px 10px; border-radius:8px; border:1px solid var(--line3); background:var(--panel); color:var(--ink); font-size:.85rem; }
.nav-find-btn{ display:none; }
.nav-find-list{ right:0; left:auto; width:min(420px, 92vw); padding:4px; }
.nav-find-hit{ display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:7px; color:var(--ink); text-decoration:none; }
.nav-find-hit:hover, .nav-find-hit.on{ background:var(--line); }
.nav-find-t{ display:flex; flex-direction:column; flex:1; min-width:0; }
.nav-find-title{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-find-msg{ padding:6px 8px; }
@media (max-width:900px){
  .nav-find-btn{ display:inline-flex; }
  .nav-find-in{ display:none; }
  .nav-find.open .nav-find-in{ display:block; position:absolute; right:0; top:calc(100% + 4px); width:min(300px, 80vw); z-index:25; }
  .nav-find.open .nav-find-list{ top:calc(100% + 40px); right:0; left:auto; }
}

/* ── EMM #898, 2026-10-13: Programs like Work's Jobs, and a program's tabs ── */
.pg-tabs .seg{ flex-wrap:wrap; max-width:100%; }
.pg-table tr.pg-group th{ background:var(--panel); font-size:.72rem; letter-spacing:.05em; text-transform:uppercase; color:var(--dim); padding:6px 10px; }
.pg-tabbar{ display:flex; gap:2px; border-bottom:1px solid var(--line3); margin:6px 0 12px; overflow-x:auto; }
.pg-tab{ padding:8px 14px; color:var(--dim); text-decoration:none; border-bottom:2px solid transparent; white-space:nowrap; font-weight:600; font-size:.88rem; }
.pg-tab[aria-selected=true]{ color:var(--ink); border-bottom-color:var(--blue-ink); }
.pg-tab:hover{ color:var(--ink); }
.pg-tab-off{ opacity:.45; cursor:not-allowed; }
.pg-topics{ list-style:none; margin:0 0 12px; padding:0; }
.pg-topics li{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:6px 0; border-bottom:1px solid var(--rule); }
.pg-newtopic{ max-width:620px; }
.pg-desc{ white-space:pre-wrap; margin-top:2px; }
.pg-state-pick{ display:flex; align-items:center; gap:6px; }
td.nowrap{ white-space:nowrap; }

/* ── EMM #898, 2026-10-13: Inventory's catalogue cards, kits nested, Qty Reminder ── */
.kp-icon{ background:transparent; border:1px solid var(--line3); border-radius:6px; color:var(--dim); cursor:pointer; padding:2px 5px; line-height:1; }
.kp-icon:hover{ color:var(--ink); border-color:var(--blue-ink); }
td.kp-ico, th.kp-ico{ width:34px; }
button.kp-kit, button.kp-more{ cursor:pointer; font:inherit; }
.kp-rem{ background:transparent; border:1px solid transparent; border-radius:6px; color:var(--faded, var(--dim)); cursor:pointer; padding:2px 6px; white-space:nowrap; font-size:.78rem; }
.kp-rem:hover{ border-color:var(--line3); color:var(--ink); }
.kp-rem.on{ color:#d29922; border-color:rgba(210,153,34,.45); }
details.kv{ border-bottom:1px solid var(--rule); }
.kv-h{ display:flex; align-items:center; gap:8px; padding:8px 12px; cursor:pointer; list-style:none; flex-wrap:wrap; }
.kv-h::-webkit-details-marker{ display:none; }
.kv-h .grow{ flex:1; }
.kv-caret{ width:12px; color:var(--dim); }
.kv-desc{ font-weight:600; }
.kv-short{ color:var(--late); font-weight:600; }
.kv-lines{ margin:0 0 8px 34px; width:calc(100% - 46px); }
.cat-box{ height:auto; max-height:88vh; width:min(820px,100%); }
.cat-body{ padding:12px 14px; overflow:auto; }
.cat-sub{ margin-bottom:8px; font-weight:600; }
.cat-photos{ display:flex; gap:8px; flex-wrap:wrap; margin:8px 0 12px; }
.cat-photos img{ height:120px; max-width:200px; object-fit:cover; border-radius:8px; border:1px solid var(--line3); }
.cat-thumb{ height:36px; width:36px; object-fit:cover; border-radius:5px; }
.cat-kits{ display:flex; gap:6px; flex-wrap:wrap; }

/* ── EMM #898, 2026-10-13: the New request kit picker's filters and preview ── */
.kit-filters{ display:flex; gap:8px; flex-wrap:wrap; align-items:flex-end; }
.kit-filters .field{ flex:0 1 160px; min-width:120px; }
.kit-filters .field.col{ flex:1 1 200px; }
.kit-preview{ margin-top:8px; border:1px solid var(--line3); border-radius:10px; padding:10px; }
.kp-prev{ display:flex; gap:12px; align-items:flex-start; margin-bottom:6px; }
.kp-pic img{ width:120px; height:90px; object-fit:cover; border-radius:8px; border:1px solid var(--line3); display:block; }
.kp-nopic{ width:120px; height:90px; border:1px dashed var(--line3); border-radius:8px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:var(--dim); font-size:.72rem; text-align:center; padding:4px; }
.kp-prev-t{ flex:1; min-width:0; }
@media (max-width:640px){ .kp-prev{ flex-direction:column; } }

/* ── EMM #898, 2026-10-13, round 3: the Requests list and the request card ── */
body{ --faded2:var(--faded3); }                         /* the due chip's quiet ink (js/work/due_chip.js) */
button.rq-badge{ font:inherit; font-size:.7rem; cursor:pointer; }
table.rq-list tr.rq-row{ cursor:pointer; }
table.rq-list tr.rq-row:hover td{ background:var(--hover); }
table.rq-list td.when-col{ font-size:.7rem; white-space:nowrap; }
.rq-t{ display:flex; align-items:center; gap:6px; min-width:0; }
.rq-t .rq-title{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); text-decoration:none; font-weight:600; }
.rq-t .rq-title:hover{ color:var(--link); }
.due-pair{ display:inline-flex; align-items:center; gap:4px; flex:none; }
.due-pair .s{ font-size:.68rem; padding:1px 7px; border-radius:var(--chip-radius); white-space:nowrap; }
.s.slipchip{ font-size:.66rem; padding-inline:5px; white-space:nowrap; text-transform:none; letter-spacing:0; }
.s-warn{ color:#e3b341; background:rgba(210,153,34,.12); border:1px solid rgba(210,153,34,.30); }
html[data-bs-theme=light] .s-warn{ color:#8a6410; }
.s-early{ background:var(--bluebox); color:var(--blue-ink); border:1px solid var(--blueline2); }
.trk{ display:inline-block; font-size:.66rem; font-weight:700; padding:1px 7px; border-radius:var(--chip-radius); white-space:nowrap; border:1px solid; }
.trk-pending{ background:var(--chip-warn-bg); color:var(--chip-warn-ink); border-color:var(--chip-warn-line); }
.trk-shared{ background:var(--chip-good-bg); color:var(--chip-good-ink); border-color:var(--chip-good-line); }
.pop-ico{ background:transparent; border:0; color:var(--faded); padding:2px 4px; }
.pop-ico:hover{ color:var(--ink); background:var(--line); }
.card-h .grow{ flex:1; }
.cal-legend{ display:flex; gap:12px; flex-wrap:wrap; margin:0 0 8px; color:var(--dim); }
.cal-key{ display:inline-flex; align-items:center; gap:4px; }
.cal .ev{ border:0; }
/* Work's drop box (_ticket_attach_drop.html) in the portal's card */
#tk-attach-card .px-3{ padding-left:14px; padding-right:14px; } #tk-attach-card .pb-2{ padding-bottom:8px; }
.mb-0{ margin-bottom:0; }
.btn-outline-accent{ background:transparent; border:1px solid var(--blue-line); color:var(--blue-ink); }
.btn-outline-accent:hover{ background:var(--bluebox); }
.att-hd{ display:flex; align-items:center; gap:6px; }
#tk-attach-card .att-plus{ width:calc(100% - 28px); margin:0 14px 10px; }
/* Programs, round 3: Find a program as a pill on the team row; Work's Jobs status chips */
input.find.pill-find{ border-radius:999px; padding-inline:12px; }
.stchips{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.stchip{ border:1.5px solid var(--line4); background:transparent; color:var(--ink); border-radius:999px; padding:4px 11px; font:inherit; font-size:.74rem;
  display:inline-flex; gap:6px; align-items:center; cursor:pointer; user-select:none; }
.stchip:hover{ border-color:var(--link); }
.stchip.on{ border-color:var(--accent); background:var(--bluebox); color:var(--ink-strong); font-weight:600; }
html[data-bs-theme=light] .stchip.on{ background:var(--accent); color:#fff; }
.stchip .n{ font-weight:800; font-family:ui-monospace,monospace; color:var(--blue-ink); }
.stchip.on .n{ color:inherit; }
/* Inventory, round 3: the kits count and its row of kits; the reminder in Work's blue */
.kp-count{ background:transparent; border:1px solid var(--line3); border-radius:6px; color:var(--faded); font:inherit; font-size:.74rem; padding:1px 7px; cursor:pointer; white-space:nowrap; }
.kp-count:hover{ color:var(--ink); border-color:var(--blue-line); }
.kp-count[aria-expanded=true]{ color:var(--blue-ink); border-color:var(--blueline2); background:var(--bluebox); }
.kp-count .kv-caret{ display:inline-block; width:10px; }
tr.kp-sub td{ background:var(--panel3); padding:6px 10px 8px 60px; }
.kp-sub-list{ display:flex; flex-wrap:wrap; gap:6px 14px; }
.kp-sub-item{ display:inline-flex; align-items:center; gap:6px; }
.kp-sub-item .kp-kit{ font-size:.7rem; padding:1px 7px; border:0; }
.kp-rem.on{ color:var(--blue); border-color:var(--blueline2); }
/* Profile, round 3: the team names */
.team-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.team-row input{ flex:1 1 200px; max-width:320px; }
/* New request, round 3: the team chips, the date box, the part rows picked to add */
.team-pick{ position:relative; }
.team-pick-btn{ display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; min-height:34px; padding:4px 10px;
  background:var(--entry-well); border:1px solid var(--line3); border-radius:6px; color:var(--ink); font:inherit; cursor:pointer; text-align:left; }
.team-pick-btn:focus-visible{ outline:2px solid var(--blue); outline-offset:1px; }
.team-pick-btn .caret{ color:var(--dim); }
.team-pick-list{ position:absolute; left:0; right:0; top:calc(100% + 4px); z-index:30; max-height:280px; overflow:auto; display:flex; flex-direction:column; gap:2px; padding:4px; }
.team-opt{ display:flex; align-items:center; background:transparent; border:0; padding:5px 6px; border-radius:6px; cursor:pointer; text-align:left; font:inherit; }
.team-opt:hover, .team-opt:focus, .team-opt[aria-selected=true]{ background:var(--line); outline:none; }
.prio-opt span{ border:1px solid; }
.when-pair .due-day{ min-width:30px; text-align:right; }
.when-pair input[data-needed-face]{ max-width:110px; }
table.part-hits tr[data-hit]{ cursor:pointer; }
table.part-hits tr[data-hit].on td{ background:var(--bluebox); }
table.part-hits td.hit-add{ color:var(--blue-ink); font-weight:700; width:24px; text-align:center; }
.when-pair{ flex-wrap:wrap; align-items:center; }
.when-pair select[data-needed-time]{ min-width:112px; flex:none; width:auto; }
/* Shipping tracking on a request (round 3, the owner's answer) */
.ship-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:4px 0; border-bottom:1px solid var(--rule); }
.ship-car{ font-weight:600; min-width:52px; }
.ship-add{ display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-top:10px; }
.ship-add input{ flex:1 1 140px; min-width:0; }
.ship-add select{ flex:none; width:auto; }

/* ── EMM #930, 2026-10-13: the thread as Work draws it (js/work/thread_send.js threadMsgHtml),
   not bubbles; the @ list's ground (thread_compose.js reads --panel4); the Discussion topics ── */
:root{ --panel4:var(--card-ground); }
#tk-mention-box{ background:var(--card-ground) !important; box-shadow:0 10px 30px rgba(0,0,0,.35); padding:3px; }
#tk-mention-box [role=option]{ padding:5px 8px; border-radius:6px; cursor:pointer; color:var(--ink); }
.thread{ gap:0; }
.thread .msg{ border:0; border-bottom:1px solid var(--rule); border-radius:0; background:transparent; max-width:none; align-self:stretch; padding:6px 2px; }
.thread .msg.from-client{ background:transparent; }
.thread .msg .fw-semibold{ font-weight:600; }
.thread .msg .text-secondary{ color:var(--dim); margin-left:4px; }
.thread .msg .msg-body{ margin-top:2px; font-size:.9rem; }
.thread .msg .msg-body ul, .thread .msg .msg-body ol{ margin:2px 0; padding-left:18px; }
.py-1{ padding-top:.25rem; padding-bottom:.25rem; }
.topic-tag{ display:inline-flex; align-items:center; gap:3px; font-size:.68rem; font-weight:600; color:var(--blue-ink); background:var(--bluebox);
  border:1px solid var(--blueline2); border-radius:999px; padding:0 7px; margin-left:6px; vertical-align:1px; font-family:inherit; cursor:default; }
button.topic-tag{ cursor:pointer; }
.disc-topics{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:8px; }
.topic-pick{ color:var(--dim); margin:8px 0 2px; }

/* ── EMM #931, 2026-10-13: New request ── */
/* placeholders: the one --placeholder rule in _theme_compat.html (EMM #1234, 2026-10-26) */
/* each box's header row tinted so the boxes read as a hierarchy (theme tokens) */
.nr-box > .card-h{ background:var(--bluebox); color:var(--ink-strong); border-bottom:1px solid var(--blueline2); border-left:3px solid var(--blue-line); border-radius:10px 10px 0 0; }
.nr-box.is-na > .card-h{ background:var(--panel3); color:var(--dim); border-left-color:var(--line4); border-bottom:0; border-radius:10px; }
.na-tog{ display:inline-flex; align-items:center; gap:5px; font-weight:500; color:var(--dim); cursor:pointer; }
/* Needed by on one line: the weekday, the box, the calendar, the time and its zone */
.when-pair{ flex-wrap:nowrap; }
.when-pair input[data-needed-face]{ max-width:88px; min-width:76px; }
.when-pair select[data-needed-time]{ min-width:104px; width:auto; flex:0 0 auto; }
.tz-tag{ white-space:nowrap; }
/* Priority: Work's Labels dropdown of ticks */
.prio-list{ padding:6px; }
.prio-list .jf-opt{ display:flex; align-items:center; gap:8px; padding:5px 6px; border-radius:6px; cursor:pointer; }
.prio-chip{ display:inline-block; padding:1px 10px; border-radius:999px; font-weight:600; font-size:.78rem; }
.prio-face{ display:inline-flex; gap:4px; flex-wrap:wrap; }
.mt-4{ margin-top:6px; }
/* New request, EMM #939: Find a kit, then a loose part, each a clear section */
.pick-sec{ border:1px solid var(--line3); border-radius:10px; padding:10px 12px; margin-top:10px; }
h2.pick-h, .pick-h{ font-size:.86rem; font-weight:700; color:var(--ink-strong); margin:0 0 4px; }
.pick-sec input[type=search]{ width:100%; margin-top:6px; }
.kit-narrow{ margin-top:6px; } .kit-narrow summary{ cursor:pointer; color:var(--link); }
.kit-add-row{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-top:8px; }
table.part-hits tr[data-khit]{ cursor:pointer; } table.part-hits tr[data-khit].on td{ background:var(--bluebox); }
table.part-hits tr[data-khit].picked td:first-child{ box-shadow:inset 3px 0 0 var(--blue-line); }

/* ── EMM #938, 2026-10-14: Work's Discussion module on the portal (js/work/job_discussion.js
   draws with Bootstrap's names; the few it uses, in the portal's tokens, inside its box only) ── */
#job-discussion{ margin-top:14px; }
#job-discussion .card{ background:var(--panel); border:1px solid var(--line3); border-radius:10px; }
#job-discussion .card-header{ padding:10px 14px; border-bottom:1px solid var(--line3); font-weight:600; color:var(--head); display:flex; align-items:center; gap:8px; }
#job-discussion .card-body{ padding:8px 14px; }
#job-discussion .mb-2{ margin-bottom:.5rem; } #job-discussion .mb-3{ margin-bottom:0; } #job-discussion .mb-1{ margin-bottom:.25rem; }
#job-discussion .mt-1{ margin-top:.25rem; } #job-discussion .mt-2{ margin-top:.5rem; } #job-discussion .ms-1{ margin-left:.25rem; } #job-discussion .ms-2{ margin-left:.5rem; }
#job-discussion .ms-auto{ margin-left:auto; } #job-discussion .w-100{ width:100%; }
#job-discussion .d-flex{ display:flex; } #job-discussion .flex-wrap{ flex-wrap:wrap; } #job-discussion .align-items-center{ align-items:center; }
#job-discussion .gap-1{ gap:.25rem; } #job-discussion .gap-2{ gap:.5rem; } #job-discussion .p-0{ padding:0; } #job-discussion .px-1{ padding:0 .25rem; } #job-discussion .py-2{ padding:.5rem 0; }
#job-discussion .border-0{ border:0 !important; } #job-discussion .text-decoration-none{ text-decoration:none; }
#job-discussion .small{ font-size:.8rem; } #job-discussion .text-secondary{ color:var(--dim); } #job-discussion .fw-semibold{ font-weight:600; }
#job-discussion .visually-hidden{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
#job-discussion .list-group{ display:flex; flex-direction:column; }
#job-discussion .list-group-item{ padding:.5rem 0; border-bottom:1px solid var(--rule); background:transparent; color:var(--ink); }
#job-discussion .btn-link{ background:transparent; border:0; color:var(--link); padding:0; }
#job-discussion .btn-link:hover{ text-decoration:underline; }
#job-discussion .alert{ padding:8px 10px; border-radius:8px; background:var(--chip-warn-bg); color:var(--chip-warn-ink); }
#job-discussion .form-control{ display:block; width:100%; background:var(--entry-well); border:1px solid var(--line3); border-radius:6px; color:var(--ink); padding:6px 8px; }
#job-discussion .disc-row .disc-fold, #job-discussion .disc-fold{ background:transparent; }
#job-discussion details > summary{ cursor:pointer; color:var(--dim); }
#job-discussion .msg{ border-bottom:1px solid var(--rule); padding:4px 0; }
#job-discussion .msg .text-secondary{ margin-left:4px; }
#job-discussion .disc-rx{ margin-top:2px; }

/* ── EMM #977, 2026-10-14: Teams on Profile, each team a tab to pick; who is on it, Add
   teammate, Sign out; the calendar's Settings ── */
.team-tabs{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.team-tab{ display:inline-flex; align-items:center; gap:6px; font:inherit; font-size:.85rem; padding:4px 10px; border-radius:999px;
  border:1px solid var(--line3); background:transparent; color:var(--ink); cursor:pointer; }
.team-tab:hover{ background:var(--line); }
.team-tab[aria-selected="true"]{ border-color:var(--blue); background:var(--bluebox); color:var(--blue-ink); font-weight:600; }
.team-tab .n{ font-size:.72rem; color:var(--dim); }
.team-pane .ev{ font-size:.66rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); margin:10px 0 4px; }
.tm-row{ display:flex; align-items:center; gap:8px; padding:5px 0; border-bottom:1px solid var(--rule); }
.tm-who{ min-width:0; overflow-wrap:anywhere; }
.tm-add{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:10px; }
.tm-add input[type=email]{ flex:1 1 220px; } .tm-add input[type=text]{ flex:1 1 140px; }
.cal-set{ right:0; left:auto; min-width:200px; padding:8px 10px; }
.cal-set .jf-opt{ display:flex; align-items:center; gap:6px; padding:3px 0; cursor:pointer; }

/* a file's own remove button on a request (EMM #690, 2026-10-15) */
.at-del{ padding:0 6px; margin-left:6px; line-height:1.4; }
/* People on a program (EMM #690, 2026-10-15) */
.pg-people{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:4px 0 10px; }
.pp-side{ font-size:.7rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--dim); margin-left:6px; }
.pp-side:first-child{ margin-left:0; }
.pp-chip{ border:1px solid var(--line3); border-radius:999px; padding:2px 10px; font-size:.8rem; }
.pg-oc{ font-size:.78rem; }
/* the inventory counts' sync line (EMM #1012, 2026-10-15) */
.sync-line{ text-align:right; font-size:.72rem; color:var(--dim); margin:-6px 0 6px; }
.sync-line.stale{ color:var(--amber-ink, #d29922); }
/* Needed by, compact (EMM #690, 2026-10-15): one line that wraps on a phone; the weekday only once
   a date is in; a button or list marked hidden stays hidden whatever its display class says */
.when-pair{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.when-pair input[data-needed-face]{ width:96px; max-width:96px; min-width:0; flex:none; }
.when-pair .due-day{ min-width:0; text-align:left; }
.when-pair .due-day:empty{ display:none; }
.when-pair select[data-needed-time]{ min-width:0; width:auto; flex:none; }
.nr-time-add{ padding:2px 4px; font-size:.82rem; color:var(--blue-ink); text-decoration:none; background:none; border:0; }
.btn[hidden], .when-pair [hidden]{ display:none !important; }
/* the bell and notifications (EMM #690 item 2, 2026-10-15) */
.nt-bell{ position:relative; }
.nt-bell-btn{ position:relative; }
.nt-count{ position:absolute; top:-5px; right:-6px; min-width:16px; height:16px; padding:0 4px; border-radius:8px; background:#e5534b; color:#fff; font-size:.62rem; font-weight:700; line-height:16px; text-align:center; }
.nt-list{ right:0; left:auto; width:min(360px, calc(100vw - 32px)); max-height:420px; overflow:auto; padding:0; }
.nt-head{ display:flex; align-items:center; padding:8px 10px; border-bottom:1px solid var(--line3); }
.nt-row{ display:flex; gap:8px; align-items:flex-start; padding:8px 10px; border-bottom:1px solid var(--rule); color:var(--ink); text-decoration:none; }
.nt-row:hover{ background:var(--line); }
.nt-dot{ width:7px; height:7px; border-radius:50%; margin-top:6px; flex:none; background:transparent; }
.nt-row.unread .nt-dot{ background:var(--blue-ink); }
.nt-row.unread strong{ color:var(--ink-strong); }
.nt-main{ flex:1; min-width:0; }
.nt-when{ white-space:nowrap; }
.nt-all{ display:block; text-align:center; padding:8px; font-size:.82rem; }
.nt-state{ padding:10px; }
.nt-state.bad{ color:#e5534b; }
.np-row{ display:flex; align-items:center; gap:10px; padding:6px 0; border-bottom:1px solid var(--rule); flex-wrap:wrap; }
.np-what{ flex:1; min-width:200px; display:flex; flex-direction:column; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.co-versions summary{ cursor:pointer; }
.co-one{ padding:4px 0; border-bottom:1px solid var(--rule); }
.co-one ul{ margin:4px 0 0 18px; padding:0; }
/* THE TOP BAR AS WORK'S (EMM #690, 2026-10-15, the owner's note): Find a request first (Work's
   130 x 29 box), + New request (Work's btn-sm, semibold), then the round 38px pills of
   _user_menu.html's .tb-pill (the bell with its red count, the profile avatar and its caret) */
.topbar-right{ gap:8px; }
.topbar .nav-find .nav-find-in{ width:130px; height:29.2px; padding:3px 8px; border-radius:4px; font-size:.8rem; }
.nav-find-btn{ padding:.3rem .55rem; }
.nav-new{ height:31px; display:inline-flex; align-items:center; border-radius:7px; font-size:14px; font-weight:600; margin-right:8px; }
.tb-circle{ width:38px; height:38px; border-radius:50%; border:1.5px solid #4a5871; background:#1a2231; color:#e4eaf2;
  display:inline-flex; align-items:center; justify-content:center; padding:0; cursor:pointer; position:relative; line-height:1; }
.tb-circle:hover{ border-color:#79b8ff; color:#79b8ff; }
.nt-bell-btn .ico, .nt-bell-btn svg{ width:18px; height:18px; }
.nt-count{ top:-4px; right:-6px; min-width:0; height:auto; padding:1px 4px; border-radius:9px; background:#c0392b; font-size:.58rem; line-height:1.3; }
.tb-prof{ display:inline-flex; align-items:center; gap:4px; background:none; border:0; padding:0; color:#aab6c4; cursor:pointer; font:inherit; }
.tb-prof .avx{ width:38px; height:38px; font-size:.74rem; background:#2563eb; color:#fff; }
.tb-prof:hover .avx{ border-color:#79b8ff; }
.tb-caret{ font-size:.7rem; }
/* Board settings lines up with the view buttons (EMM #690, 2026-10-15): the same 34px height and
   centre line as the .seg beside it */
.page-head .pop:has(> .bs-gear){ align-self:center; display:inline-flex; }
.bs-gear{ height:34px; min-width:34px; display:inline-flex; align-items:center; justify-content:center; padding:0 9px; border-radius:8px; }
.page-head > .seg{ align-self:center; }
@media (max-width:900px){ .topbar .nav-find.open .nav-find-in{ width:min(300px, 80vw); height:34px; } }
/* the phone bar like Work's (EMM #690, 2026-10-15): the brand and the cluster (magnifier,
   + New request, bell, profile) on ONE row, the page links on their own row under it */
@media (max-width:900px){
  .topbar{ flex-wrap:wrap; row-gap:6px; }
  .topbar > .brand{ order:0; }
  .topbar > .topbar-right{ order:1; margin-left:auto; gap:6px; }
  .topbar > .topnav{ order:2; flex-basis:100%; overflow-x:auto; }
  .topbar .nav-find-btn{ height:31px; min-width:38px; display:inline-flex; align-items:center; justify-content:center; }
  .nav-new{ margin-right:2px; padding:0 10px; }
}
@media (max-width:420px){ .topbar .brand-x, .topbar .brand-client{ display:none; } }
/* the OnQ view pill sits in the right cluster beside the profile (EMM #1349, 2026-10-30); on a phone
   it stays, a little tighter */
@media (max-width:420px){ .topbar .onq-view-mark{ padding:2px 7px; font-size:.7rem; } }
@media (max-width:900px){ .topbar .nav-find-btn svg, .topbar .nav-find-btn .ico{ width:19px; height:19px; } }
/* Priority, toned down (EMM #690, 2026-10-15): the label's colour see-through, its ink readable
   on both themes; Standard (nothing picked) is a quiet white in dark mode, grey in light */
.prio-tone{ background:color-mix(in srgb, var(--pc) 22%, transparent) !important; border:1px solid color-mix(in srgb, var(--pc) 55%, transparent) !important;
  color:color-mix(in srgb, var(--pc) 65%, #ffffff) !important; }
:root[data-bs-theme=light] .prio-tone, html[data-theme=light] .prio-tone{ color:color-mix(in srgb, var(--pc) 70%, #000000) !important; }
.prio-std{ background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.28); color:#e6edf3; }
:root[data-bs-theme=light] .prio-std, html[data-theme=light] .prio-std{ background:#eef1f4; border-color:#c9d1d9; color:#57626e; }
/* Build kit (EMM #690, 2026-10-15) */
.kb .kv-h{ margin:8px 0 4px; font-weight:600; }
.kb-add{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:8px; }
.kb-add input{ flex:1 1 220px; }
.kb-hits{ flex-basis:100%; display:flex; flex-direction:column; gap:2px; }
.kb-hit{ text-align:left; background:transparent; border:1px solid var(--line3); border-radius:6px; color:var(--ink); padding:4px 8px; cursor:pointer; font:inherit; font-size:.82rem; }
.kb-hit:hover{ background:var(--line); }

/* Settings (EMM #974, 2026-10-16): the webhook, the API tokens and the guide for IT */
.secret-once .secret-val{ display:block; margin:8px 0; padding:8px 10px; border-radius:6px; background:var(--panel); color:var(--ink); border:1px solid var(--line3); font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.85rem; word-break:break-all; user-select:all; }
dl.kv{ display:grid; grid-template-columns:max-content minmax(0,1fr); gap:4px 12px; margin:0 0 14px; font-size:.85rem; }
dl.kv dt{ color:var(--dim); } dl.kv dd{ margin:0; min-width:0; overflow-wrap:anywhere; }
.switches fieldset{ border:1px solid var(--line3); border-radius:8px; padding:8px 12px 4px; margin:14px 0 10px; }
.switches legend{ font-size:.85rem; font-weight:600; color:var(--head); padding:0 4px; }
label.check{ display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; margin-bottom:8px; }
.guide h2, .guide h3{ font-size:.92rem; color:var(--head); margin:14px 0 6px; } .guide h2:first-child, .guide h3:first-child{ margin-top:0; }
.guide pre{ background:var(--entry-well, var(--panel)); border:1px solid var(--line3); border-radius:8px; padding:10px 12px; overflow-x:auto; font-size:.78rem; line-height:1.45; color:var(--ink); max-width:100%; }
.guide code, dl.kv code{ font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.85em; }
/* address suggestions under the Address box (EMM #1148, 2026-10-23, portal_places.js) */
.places-host{ position:relative; }
.places-list{ position:absolute; left:0; right:0; top:calc(100% - 2px); background:var(--panel); border:1px solid var(--line3); border-radius:10px; padding:.3rem; z-index:30; box-shadow:0 10px 28px rgba(0,0,0,.45); max-height:280px; overflow:auto; }
.places-list[hidden]{ display:none; }
.places-it{ display:block; width:100%; text-align:left; background:transparent; border:0; color:var(--ink); font:inherit; font-size:.85rem; padding:.42rem .6rem; border-radius:7px; cursor:pointer; }
.places-it:hover, .places-it[aria-selected=true]{ background:var(--line); color:var(--ink-strong); }
.places-main{ display:block; }
.places-sec{ display:block; font-size:.76rem; color:var(--dim); }
/* the thread's two controls, Work's (EMM #1148, 2026-10-23; work_shell.html #tk-thread-card) */
.thr-h{ gap:4px; }
.thr-btn{ display:inline-flex; align-items:center; gap:4px; padding:1px 8px; font-size:.78rem; }
.thr-btn .is-off{ display:none; }
.row.thr-full > .col:not(:first-child){ display:none; }
.row.thr-full > .col:first-child{ flex:1 1 100% !important; }
.row.thr-full .thread{ max-height:calc(100vh - 300px); min-height:300px; }
/* a checklist in What you need, read on the request (EMM #1148, 2026-10-23): Work's tick boxes,
   stored as <ul class="irt-check"><li data-done="0|1"> (src/workflow/rich_text.py), shown, not ticked here */
.rich-v ul.irt-check{ list-style:none; padding-left:1.5rem; }
.rich-v ul.irt-check > li{ position:relative; }
.rich-v ul.irt-check > li::before{ content:""; position:absolute; left:-1.25rem; top:.2em; width:.85em; height:.85em; border:1.5px solid var(--line4,#8a94a3); border-radius:3px; }
.rich-v ul.irt-check > li[data-done="1"]::before{ background:var(--accent,#4c9aff); border-color:var(--accent,#4c9aff); }
.rich-v ul.irt-check > li[data-done="1"]{ color:var(--dim); text-decoration:line-through; }
/* several shipments on a request (EMM #1148, 2026-10-23) */
.ship-tbl td{ vertical-align:top; }
.ship-add [data-ship-note]{ flex:2 1 220px; }
.ship-add [data-ship-date]{ flex:0 0 150px; }
.drive-link-row{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:10px; }
.drive-link-row[hidden]{ display:none; }
.drive-link-row [data-drive-url]{ flex:2 1 260px; }
.drive-link-row [data-drive-name]{ flex:1 1 140px; }
.drive-link-row .hint{ flex-basis:100%; margin:0; }
/* Timeline: a read-only Gantt of the requests (EMM #1148, 2026-10-23) */
.gt-wrap{ overflow-x:auto; padding:0; }
.gt{ position:relative; }
.gt-row{ display:flex; align-items:stretch; min-height:30px; border-bottom:1px solid var(--rule); }
.gt-name{ flex:0 0 260px; width:260px; position:sticky; left:0; z-index:2; background:var(--panel); padding:6px 10px; font-size:.82rem;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; border-right:1px solid var(--line3); color:var(--ink); text-decoration:none; }
a.gt-name:hover{ text-decoration:underline; }
.gt-track{ position:relative; flex:none; }
.gt-head{ background:var(--panel3); min-height:28px; }
.gt-head .gt-name{ background:var(--panel3); font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--head); }
.gt-month{ position:absolute; top:7px; padding-left:4px; font-size:.72rem; color:var(--dim); white-space:nowrap; border-left:1px solid var(--line3); }
.gt-tlabel{ color:var(--due-late); border-left-color:var(--due-late); top:auto; bottom:2px; }
.gt-prog .gt-name{ font-weight:700; background:var(--panel3); }
.gt-prog{ background:var(--panel3); }
.gt-mline{ position:absolute; top:0; bottom:0; border-left:1px solid var(--line3); opacity:.6; }
.gt-today{ position:absolute; top:0; bottom:0; border-left:2px solid var(--due-late); opacity:.8; z-index:1; }
.gt-span{ position:absolute; top:11px; height:8px; border-radius:4px; background:var(--line4); opacity:.8; }
.gt-bar{ position:absolute; top:6px; height:18px; border-radius:5px; font-size:.68rem; font-weight:700; line-height:18px; padding:0 5px;
  overflow:hidden; white-space:nowrap; text-decoration:none; box-shadow:0 1px 2px rgba(0,0,0,.3); z-index:1; }
.gt-bar.done{ opacity:.55; }
.gt-bar.late{ outline:2px solid var(--due-late); outline-offset:1px; }
.gt-bar:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.gt-first{ border-left:0; }
/* Parts from inventory: Find a kit or Pick from inventory (EMM #1148, 2026-10-23) */
.pick-choice{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; margin:2px 0 12px; }
.pick-opt{ display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1.5px solid var(--line3); border-radius:10px; cursor:pointer; }
.pick-opt:has(input:checked){ border-color:var(--accent); background:var(--bluebox); }
.pick-opt input{ margin-top:3px; }
.pick-opt b{ display:block; }
.pick-opt .hint{ display:block; margin:2px 0 0; }
.pick-sec[hidden]{ display:none; }
/* What was asked, above the thread (EMM #1148, 2026-10-25): a tall ask shows its first lines,
   faded at the foot, until Show all; portal.js reveals the button only when the ask is taller */
.ask-clamp{ max-height:11.5em; overflow:hidden; position:relative; }
.ask-clamp::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2.6em; pointer-events:none;
  background:linear-gradient(to bottom, transparent, var(--panel)); }
.ask-body.open{ max-height:none; }
.ask-body.open::after, .ask-body.short::after{ display:none; }
.ask-more{ background:transparent; border:0; color:var(--link); padding:4px 0 0; }
.ask-more:hover{ text-decoration:underline; }
/* See all notifications' filters (EMM #1148, 2026-10-25): Work's bar and kind chips
   (_work_notifications_view.html), restated in the portal's own tokens */
.nf-bar{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:10px; }
.nf-bar .nf-in{ width:auto; min-width:0; font-size:.85rem; padding:5px 10px; border-radius:7px; }
.nf-bar .nf-q{ flex:1 1 220px; }
.nf-unread{ display:inline-flex; align-items:center; gap:5px; margin:0; }
.nf-bar .btn-link, .nf-chips + .btn-link{ background:transparent; border:0; color:var(--link); }
.nf-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.nf-chip{ border:1px solid var(--line4); background:var(--panel); color:var(--dim); border-radius:20px; font-size:.78rem; padding:3px 11px; text-decoration:none; }
.nf-chip:hover{ color:var(--ink); border-color:var(--accent); }
.nf-chip.on{ background:var(--bluebox); border-color:var(--accent); color:var(--ink); }
.nf-chip .n{ font-weight:700; margin-left:5px; color:var(--link); }
@media (max-width:600px){ .nf-bar .nf-in{ flex:1 1 140px; } }
/* New request's Scope ticks beside the team (EMM #1148, 2026-10-25) */
.scope-pick{ border:0; padding:0; margin:0 0 12px; min-width:0; }
.scope-pick legend{ padding:0; margin-bottom:4px; }
.scope-opts{ display:flex; flex-wrap:wrap; gap:2px 6px; }
.ask-details{ white-space:pre-wrap; margin:0 0 12px; padding-bottom:10px; border-bottom:1px solid var(--rule); color:var(--ink); }
/* Bulk or DTS on its own row, just above Priority and Needed by (EMM #1138, 2026-10-25) */
.grid2 > .ship-mode-f{ grid-column:1 / -1; }
/* the parts as a cart (EMM #1138, 2026-10-25): X kits at the top, Y per kit, Z = X × Y beside the
   stock A; a part left out of a kit is struck through, a line short of stock is marked */
.kits-x{ max-width:220px; }
.kit-find-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.kit-find-row input[type=search]{ flex:1 1 240px; width:auto; }
.cart .pick-line.left-out td:nth-child(-n+2), .cart .pick-line.left-out .cart-z{ text-decoration:line-through; color:var(--dim); }
.cart .pick-line.is-short{ background:color-mix(in srgb, var(--late) 9%, transparent); }
.cart .cart-z{ font-weight:600; }
.cart-add{ margin-top:12px; }
.cart-add input[type=search]{ max-width:520px; }
.ask-kit{ margin-top:12px; } .ask-kit ul{ margin:4px 0 0; padding-left:18px; }
.cart td:nth-child(6), .cart td:last-child .btn{ white-space:nowrap; }
/* ── New request's shop and checkout (EMM #1138, 2026-10-25) ─────────────────────────────────── */
/* one stepper over both pages (her #1138 pick, 2026-10-26): a bar per step, blue open, green done */
.nr-steps{ display:flex; gap:12px; list-style:none; padding:0; margin:4px 0 18px; font-size:var(--fs-sm); }
.nr-steps li{ flex:1 1 0; min-width:0; display:flex; align-items:center; gap:8px; border-top:3px solid var(--line4); padding-top:8px; color:var(--dim); }
.nr-steps li.on{ border-top-color:var(--accent); color:var(--ink); }
.nr-steps li.dn{ border-top-color:var(--step-done); color:var(--ink); }
.ns-b{ display:inline-flex; align-items:center; gap:8px; border:0; background:none; color:inherit; font:inherit; font-weight:600; padding:0; min-height:32px; flex:none; }
.ns-b:not(:disabled){ cursor:pointer; } .ns-b:not(:disabled):hover .ns-t{ text-decoration:underline; text-underline-offset:3px; }
.ns-b:disabled{ cursor:default; }
.ns-n{ width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:var(--fs-xs); font-weight:700; border:1.5px solid var(--line4); }
.nr-steps li.on .ns-n{ background:var(--accent); border-color:var(--accent); color:var(--on-solid); }
.nr-steps li.dn .ns-n{ background:var(--step-done); border-color:var(--step-done); color:var(--on-solid); font-size:0; }
.nr-steps li.dn .ns-n::before{ content:"✓"; font-size:var(--fs-xs); }
.ns-sub{ margin-left:auto; min-width:0; color:var(--dim); font-size:var(--fs-xs); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* Order as one segmented control (her #1138 pick): the radios stay, drawn as two joined pills */
.order-switch{ display:inline-flex; align-items:stretch; margin-bottom:12px; border:1.5px solid var(--line3); border-radius:10px; overflow:hidden; background:var(--panel); }
.order-switch > .flab{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.order-opt{ position:relative; display:inline-flex; align-items:center; justify-content:center; padding:8px 18px; min-height:40px; cursor:pointer; font-weight:600; font-size:var(--fs-sm); color:var(--dim); }
.order-opt + .order-opt{ border-left:1.5px solid var(--line3); }
.order-opt input{ position:absolute; opacity:0; width:1px; height:1px; }
.order-opt:has(input:checked){ background:var(--bluebox); color:var(--ink); }
.order-opt:has(input:focus-visible){ outline:2px solid var(--accent); outline-offset:-3px; }
.shop-state{ margin:0 0 10px; } .shop-state.bad{ color:var(--late); }
.std-find input, .mto-main > input[type=search]{ max-width:520px; margin-bottom:10px; }
.std-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:12px; }
/* her 10-27 test (EMM #1138): the kit's head sits raised on a thin grey line, its contents on the
   light grey "inside" below; an added kit folds to its entry */
.kit-card{ border:1.5px solid var(--line3); border-radius:12px; background:var(--panel); display:flex; flex-direction:column; overflow:hidden; align-self:start; }
.kit-card.added{ border-color:var(--accent); align-self:start; }
.kc-h{ display:flex; gap:8px; justify-content:space-between; align-items:flex-start; padding:12px; border-bottom:1px solid var(--line3); background:var(--panel); }
.kc-id{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.kc-id .tile-av.kc-av{ position:static; align-self:flex-start; margin-bottom:4px; }
.kc-body{ background:var(--panel3); padding:12px; display:flex; flex-direction:column; gap:10px; flex:1; }
.kc-added{ display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--panel3); flex-wrap:wrap; }
.kc-qty{ border:1.5px solid var(--accent); background:var(--bluebox); color:var(--ink); border-radius:999px; padding:6px 14px; font:inherit; font-weight:600; cursor:pointer; min-height:36px; }
.kc-qty:hover{ background:var(--panel); }
.kc-qty:focus-visible, .kc-bin:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.kc-bin{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--line4); border-radius:8px; background:var(--panel); color:var(--dim); cursor:pointer; padding:0; }
.kc-bin:hover{ color:var(--late); border-color:var(--late); }
.kc-note-t{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:60%; }
.kc-added .grow, .cart-item-h .grow{ flex:1; }
.cart .cart-item td{ background:var(--panel3); }
.cart-item-h{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
/* See details (her 10-27 16:22 note): a kit's inside folded until asked */
.kc-tog{ padding:4px 12px 10px; background:var(--panel); }
.kc-more{ border:0; background:none; padding:6px 0; color:var(--link); font:inherit; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; min-height:32px; }
.kc-more:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }
.kc-body[hidden], .cart tr.pick-line[hidden]{ display:none; }
.kit-card .kc-added + .kc-body{ border-top:1px solid var(--line3); }
@media (max-width:760px){ .kc-more{ min-height:44px; } }
/* her 10-27 16:33-16:42 notes: no step bar; the open step names itself; the request badge */
.co .co-step.open > .co-step-h{ position:static; width:auto; height:auto; overflow:visible; clip:auto; padding:0 0 12px; }
.co .co-step.open > .co-step-h .co-n, .co .co-step.open > .co-step-h .co-sum, .co .co-step.open > .co-step-h [data-co-edit]{ display:none; }
.co .co-step.open > .co-step-h strong{ font-size:var(--fs-lg); color:var(--ink-strong); }
.nr-badge{ display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--line4); background:var(--panel); color:var(--dim); border-radius:999px;
  padding:4px 12px; min-height:32px; font:inherit; font-size:var(--fs-sm); font-weight:600; cursor:pointer; }
.nr-badge svg, .nr-badge .ico{ width:18px; height:18px; }
.nr-badge.has{ border-color:var(--accent); background:var(--bluebox); color:var(--ink); }
.nr-badge:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
#your-request:focus{ outline:2px solid var(--accent); outline-offset:2px; }
.qty-parts{ list-style:none; margin:0 0 12px; padding:8px 10px; max-height:200px; overflow:auto; background:var(--panel3); border-radius:8px; display:flex; flex-direction:column; gap:4px; }
.qty-parts:empty{ display:none; }
.qty-parts li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 8px; font-size:var(--fs-sm); }
.qty-parts .jobnum{ grid-column:1; } .qty-parts .qp-n{ grid-column:2; grid-row:1 / span 2; align-self:center; font-weight:600; }
@media (max-width:760px){ .nr-badge{ min-height:44px; } }
/* Your request under the badge (her 10-27 17:25 note): a panel anchored to it, never on the page */
.req-anchor{ position:relative; display:inline-flex; }
.req-panel{ position:absolute; right:0; top:calc(100% + 8px); z-index:60; width:min(960px, calc(100vw - 32px)); max-height:min(72vh, 680px); overflow:auto;
  background:var(--panel); color:var(--ink); border:1px solid var(--line3); border-radius:12px; box-shadow:var(--shop-sheet-shadow); padding:14px 16px; text-align:left; }
.req-panel[hidden]{ display:none; }
.req-panel-h{ display:flex; align-items:flex-start; gap:8px; margin-bottom:4px; }
.req-panel-h h2{ flex:1; margin:0; font-size:var(--fs-lg); color:var(--ink-strong); }
.req-panel-h h2:focus{ outline:none; }
.req-panel .shop-go{ margin-top:12px; }
.nr-badge[aria-expanded="true"]{ border-color:var(--accent); }
@media (max-width:760px){ .req-panel{ right:-4px; padding:12px; } .req-panel .cart thead{ display:none; } .req-panel .cart-item-h{ gap:6px; } }
.panel-act{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:0 12px 12px; }
.panel-act:empty{ display:none; }
.co-lines li.co-item{ border-bottom:0; padding-top:8px; color:var(--ink); }
.co-lines li.co-total:not(:last-child){ position:static; box-shadow:none; }
/* How many kits: the browser's own modal dialog (her 10-27 test) */
.qty-dlg{ border:1px solid var(--line3); border-radius:12px; background:var(--panel); color:var(--ink); padding:16px 18px; width:min(420px, calc(100vw - 32px));
  box-shadow:var(--shop-sheet-shadow); }
.qty-dlg::backdrop{ background:var(--onq-veil, rgba(0,0,0,.45)); }
.qty-h{ display:flex; align-items:flex-start; gap:8px; } .qty-h h2{ flex:1; margin:0; font-size:var(--fs-md); }
.qty-x{ border:0; background:none; color:var(--dim); font-size:var(--fs-lg); line-height:1; width:36px; height:36px; margin:-8px -10px 0 0; cursor:pointer; border-radius:6px; }
.qty-x:hover{ background:var(--panel3); color:var(--ink); }
.qty-dlg .field{ margin-bottom:12px; } .qty-dlg input[type=number]{ max-width:160px; } .qty-dlg textarea{ width:100%; min-height:60px; }
.qty-go{ display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap; }
@media (max-width:760px){ .qty-go .btn{ min-height:44px; flex:1 1 auto; justify-content:center; } .kc-qty, .kc-bin{ min-height:44px; } .kc-bin{ width:44px; } }
/* a box's resize corner in Work's diagonal grip, not the square (her 10-27 test) */
textarea::-webkit-resizer{ background:linear-gradient(135deg, transparent 46%, var(--line4) 46%, var(--line4) 54%, transparent 54%, transparent 70%, var(--line4) 70%, var(--line4) 78%, transparent 78%); }
.kc-parts{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; max-height:280px; overflow:auto; }
.kc-part{ display:grid; grid-template-columns:48px 1fr auto; gap:8px; align-items:center; }
.kc-ph{ width:48px; height:48px; border-radius:8px; object-fit:cover; background:var(--panel3); }
.kc-q{ text-align:right; }
.kc-note textarea{ width:100%; }
.kc-act{ display:flex; gap:8px; flex-wrap:wrap; }
.ph-none{ display:flex; align-items:center; justify-content:center; text-align:center; background:var(--panel3); color:var(--dim);
  border:1px dashed var(--line4); font-size:var(--fs-xs); line-height:1.1; padding:4px; }
.mto{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:14px; align-items:start; }
.chips{ display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
/* the shop's filters in labelled rows, Part type first (EMM #1324, 2026-10-29) */
.chip-row{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.chip-lab{ min-width:5.5rem; }
.tile-tags{ display:flex; flex-wrap:wrap; gap:4px; margin:2px 0; }
.tile-type{ font-size:var(--fs-xs); }
.chip-f{ position:relative; border:1px solid var(--line4); background:var(--panel); color:var(--dim); border-radius:999px; font-size:var(--fs-xs); padding:5px 12px; min-height:30px; cursor:pointer; }
.chip-f.on{ background:var(--bluebox); border-color:var(--accent); color:var(--ink); }
.grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:10px; }
.tile{ border:1px solid var(--line3); border-radius:12px; background:var(--panel); padding:8px; display:flex; flex-direction:column; gap:4px; }
.tile.in-kit{ border-color:var(--accent); }
.tile-ph{ position:relative; aspect-ratio:1 / 1; border-radius:9px; overflow:hidden; background:var(--panel3); }
.tile-ph .ph{ width:100%; height:100%; object-fit:cover; display:block; }
.tile-ph .ph-none{ width:100%; height:100%; border-radius:9px; font-size:var(--fs-xs); }
.tile.out .tile-ph .ph{ opacity:.55; }
/* round 2 (22:39): a small + at the photo's bottom right, the availability as a badge at its top
   left, so both sit in the same place on every tile */
.tile-add{ position:absolute; bottom:6px; right:6px; width:30px; height:30px; border-radius:50%; border:0; background:var(--accent); color:var(--on-solid);
  font-size:1rem; font-weight:700; line-height:1; cursor:pointer; box-shadow:var(--shop-lift); padding:0; }
/* the availability chip in Work's toned look (her #1138 ask, 2026-10-26): a tinted ground with its
   own ink and line, never a solid fill; the chip scale's pairs hold 4.5:1 in both themes */
.tile-av{ position:absolute; top:6px; left:6px; font-size:var(--fs-xs); font-weight:700; padding:2px 8px; border-radius:999px;
  border:1px solid var(--chip-good-line); background:var(--chip-good-bg); color:var(--chip-good-ink); }
.tile-av.none{ border-color:var(--chip-alert-line); background:var(--chip-alert-bg); color:var(--chip-alert-ink); }
.tile-add:focus-visible{ outline:2px solid var(--ink); outline-offset:2px; }
.tile-t{ font-size:var(--fs-sm); color:var(--ink); line-height:1.3; flex:1; min-width:0; }
.tile-tr{ display:flex; align-items:flex-start; gap:6px; }
/* the i beside the name: which kits use the part */
.tile-info{ position:relative; flex:none; width:22px; height:22px; border-radius:50%; border:1.5px solid var(--line4); background:var(--panel); color:var(--dim);
  font:700 var(--fs-xs)/1 Georgia, serif; font-style:italic; cursor:pointer; padding:0; margin-top:1px; }
.tile-info:hover, .tile-info[aria-expanded="true"]{ border-color:var(--accent); color:var(--accent); }
.tile-info::after{ content:""; position:absolute; inset:-11px; }
.tile-pns{ display:flex; flex-direction:column; gap:1px; }
.pn-row{ display:flex; gap:6px; min-width:0; font-size:var(--fs-xs); }
.pn-row > .pn-k{ color:var(--dim); flex:none; min-width:66px; }
.pn-row > :last-child{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.kit-pop{ position:absolute; z-index:60; width:300px; max-width:calc(100vw - 16px); background:var(--panel); color:var(--ink); border:1px solid var(--line3);
  border-radius:12px; box-shadow:var(--shop-sheet-shadow); padding:12px 14px; display:flex; flex-direction:column; gap:6px; font-size:var(--fs-sm); }
.kit-pop[hidden]{ display:none; }
.kit-pop-h{ display:flex; align-items:flex-start; gap:8px; } .kit-pop-h strong{ flex:1; min-width:0; }
.kit-pop-x{ border:0; background:none; color:var(--dim); font-size:var(--fs-lg); line-height:1; width:32px; height:32px; margin:-6px -8px 0 0; cursor:pointer; border-radius:6px; }
.kit-pop-x:hover{ background:var(--panel3); color:var(--ink); }
.kit-pop-k{ font-weight:600; margin-top:4px; border-top:1px solid var(--rule); padding-top:8px; }
.kit-pop-l{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; max-height:240px; overflow:auto; }
.kit-pop-l li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 8px; }
.kit-pop-l .kp-d{ grid-column:1 / -1; font-size:var(--fs-xs); }
.kit-pop-l .kp-per{ font-size:var(--fs-xs); font-weight:600; }
.tile-st{ display:flex; align-items:center; gap:6px; margin-top:2px; }
.stepper{ display:inline-flex; align-items:center; border:1px solid var(--line4); border-radius:999px; overflow:hidden; }
.st-b{ border:0; background:var(--panel3); color:var(--ink); width:32px; height:32px; font-size:var(--fs-md); cursor:pointer; }
.st-b:hover{ background:var(--line); }
.st-n{ min-width:28px; text-align:center; font-weight:700; }
.mto-panel{ position:sticky; top:12px; border:1.5px solid var(--line3); border-radius:12px; background:var(--panel); }
.panel-h{ width:100%; display:flex; justify-content:space-between; align-items:center; background:var(--panel3); border:0; border-bottom:1px solid var(--line3);
  color:var(--head); font-weight:700; padding:10px 12px; border-radius:12px 12px 0 0; cursor:pointer; }
.panel-b{ padding:10px 12px; max-height:60vh; overflow:auto; display:flex; flex-direction:column; gap:8px; }
.pl{ display:grid; grid-template-columns:40px minmax(0,1fr) auto; grid-template-areas:"ph t t" "st st act"; gap:6px 8px; align-items:center; border-bottom:1px solid var(--rule); padding-bottom:8px; }
.pl-ph{ grid-area:ph; width:40px; height:40px; border-radius:7px; object-fit:cover; }
.pl-t{ grid-area:t; font-size:var(--fs-sm); }
.pl.left-out .pl-t{ text-decoration:line-through; color:var(--dim); }
.shop-foot{ margin-top:16px; }
.shop-go{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:12px; }
.checkout-sum .cs-row{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
@media (max-width:760px){
  .mto{ grid-template-columns:minmax(0,1fr); }
  /* the kit being built: a bottom sheet on a phone */
  .mto-panel{ position:fixed; left:0; right:0; bottom:0; top:auto; z-index:40; border-radius:14px 14px 0 0; box-shadow:var(--shop-sheet-shadow); }
  .panel-b{ max-height:45vh; }
  .mto-main{ padding-bottom:90px; }
  .grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .std-list{ grid-template-columns:minmax(0,1fr); }
}
.pl > :nth-child(3){ grid-area:st; justify-self:start; } .pl > :nth-child(4){ grid-area:act; justify-self:end; }
.kc-n{ white-space:nowrap; }
.panel-b[hidden]{ display:none; }
.panel-f{ padding:8px 12px 10px; border-top:1px solid var(--line3); color:var(--ink); font-weight:600; }
@media (min-width:761px){ .panel-n{ display:none; } }
.tile-ph .ph.ph-none{ display:flex; }
/* PAGE 2, SHIPPING INFORMATION (round 2): fields left, the kit and Send in a summary kept in view */
.co-grid{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:16px; align-items:start; }
.co-side{ position:sticky; top:12px; }
.co-side .card-b{ display:flex; flex-direction:column; gap:8px; }
.co-lines{ list-style:none; margin:0; padding:0; max-height:38vh; overflow:auto; display:flex; flex-direction:column; gap:3px; }
.co-lines li{ display:flex; justify-content:space-between; gap:8px; border-bottom:1px solid var(--rule); padding:2px 0; }
.co-lines li.is-short .num{ color:var(--late); font-weight:600; }
.co .co-main .row > .col > button.btn-go.wide{ display:none; }
.co .co-main .row{ gap:14px; }
@media (max-width:900px){
  .co-grid{ grid-template-columns:minmax(0,1fr); }
  .co-side{ position:static; }
}
/* + New as a menu (EMM #1219, 2026-10-25): Request and Project */
.nav-new-pop{ position:relative; }
.new-menu{ left:auto; right:0; min-width:260px; }
.new-menu a{ display:flex; gap:10px; align-items:flex-start; }
.new-menu a > span{ display:flex; flex-direction:column; }
/* her 10-26 notes (EMM #1138): the stepper on the photo where the + was; Low in orange */
.tile-ph .tile-st{ position:absolute; bottom:6px; right:6px; }
.tile-ph .tile-st .stepper{ background:var(--panel); box-shadow:var(--shop-lift); }
.tile-ph .tile-st .st-b{ width:30px; height:30px; }
.tile-av.low{ border-color:var(--chip-warn-line); background:var(--chip-warn-bg); color:var(--chip-warn-ink); }
.co-lines li.co-total{ border-top:1.5px solid var(--line4); border-bottom:0; padding-top:4px; }
/* the numbered checkout (her 10-26 note, EMM #1138): one step open, finished ones folded to a line */
.co-steps{ display:flex; flex-direction:column; gap:10px; }
.co-step{ border:1.5px solid var(--line3); border-radius:12px; background:var(--panel); }
.co-step.open{ border-color:var(--accent); }
.co-step-h{ display:flex; align-items:center; gap:10px; padding:10px 14px; flex-wrap:wrap; }
.co-n{ width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:var(--fs-xs);
  background:var(--panel3); border:1.5px solid var(--line4); color:var(--ink); }
.co-step.open .co-n{ background:var(--accent); border-color:var(--accent); color:var(--on-solid); }
.co-step.done .co-n{ background:var(--step-done); border-color:var(--step-done); color:var(--on-solid); }
.co-step.later{ opacity:.75; }
.co-sum{ flex:1 1 200px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.co-step-b{ padding:0 14px 14px; display:flex; flex-direction:column; gap:12px; }
.co-step-b > .card{ margin:0; }
.co-go{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.co-go .btn:disabled{ background:var(--panel3); border-color:var(--line4); color:var(--dim); cursor:not-allowed; }
.co-miss{ color:var(--late); }
.co-step-b[hidden], .co-step [hidden]{ display:none !important; }
/* the kit total stays in view at the foot of the summary list; the review lists every part */
.co-lines li.co-total{ position:sticky; bottom:0; background:var(--panel); box-shadow:0 -12px 10px -4px var(--panel); }
[data-review-lines]{ max-height:none; overflow:visible; }
/* her 10-26 notes (EMM #1138): Program, Team and Reference on one row; the document under the box */
.grid3{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 16px; }
@media (max-width:760px){ .grid3{ grid-template-columns:minmax(0,1fr); } }
.ask-attach{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:6px; }
.nr-title-row{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.nr-cancel{ background:var(--danger-solid); border-color:var(--danger-solid); color:var(--on-solid); font-weight:600; }
.nr-cancel:hover{ background:var(--danger-solid-hover); border-color:var(--danger-solid-hover); color:var(--on-solid); }
.nr-title-row .grow{ flex:1; }
/* the kit beside the checkout as part cards (her later 10-26 note, EMM #1138) */
.co-lines li.co-card{ display:grid; grid-template-columns:44px minmax(0,1fr); gap:8px; align-items:center; padding:6px 0; }
.co-ph{ width:44px; height:44px; border-radius:8px; object-fit:cover; }
.co-ph.ph-none{ font-size:var(--fs-xs); line-height:1; letter-spacing:-.02em; }
.co-ct{ display:flex; flex-direction:column; min-width:0; }
.co-cd{ color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.co-q{ font-weight:600; }
.co-lines li.co-card.is-short .co-q{ color:var(--late); }
.co-side .co-lines{ max-height:60vh; }
/* ── her #1138 picks (2026-10-26): the checkout flattened, required fields at the press, one grid,
   one rhythm, one type scale; on a phone, 44px targets and the kit and Continue at the foot ── */
.co .co-step{ border:0; background:none; border-radius:0; }
.co .co-step:not(.open){ display:none; }
.co .co-step-h{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
.co .co-step-b{ padding:0; gap:0; }
.co .co-step-b > .nr-box{ border:0; background:none; border-radius:0; margin:0; padding:18px 0 4px; border-top:1px solid var(--rule); }
.co .co-step-b > .nr-box:first-child{ border-top:0; padding-top:0; }
.co .co-step-b > .nr-box > .card-h, .co .co-step-b > .nr-box.is-na > .card-h{ background:none; border:0; border-radius:0; padding:0 0 10px; color:var(--dim);
  font-size:var(--fs-xs); font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.co .co-step-b > .nr-box > .card-b{ padding:0; display:flex; flex-direction:column; gap:16px; }
.co .co-step-b .card-b > .field, .co .co-step-b .card-b label.field, .co .co-step-b .card-b div.field{ margin-bottom:0; }
.co .co-step-b .grid3, .co .co-step-b .grid2{ gap:16px; margin:0; }
.co .co-step-b .grid3 > .field, .co .co-step-b .grid2 > .field, .co .co-step-b .grid2 > fieldset{ margin-bottom:0; }
.co .co-step-b [data-block="ask"] .grid2{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.co .co-step-b [data-one-address]:not([hidden]), .co .co-step-b [data-store-list]:not([hidden]), .co .co-step-b [data-prov-fields]:not([hidden]){ display:flex; flex-direction:column; gap:16px; }
.co .co-step-b .grid2 > .scope-pick{ grid-column:1 / -1; margin:0; }
.co .co-step-b label.field > span, .co .co-step-b .flab{ font-size:var(--fs-sm); }
.co .co-step-b .when-pair input[data-needed-face]{ flex:1 1 auto; width:auto; max-width:none; min-width:0; }
.co .co-go{ border-top:1px solid var(--rule); padding-top:16px; margin-top:16px; }
.co .co-miss{ font-size:var(--fs-sm); }
.link-btn{ border:0; background:none; padding:0; font:inherit; color:inherit; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.need-missing input:not([type=hidden]):not([type=radio]):not([type=checkbox]), .need-missing select, .need-missing textarea, .need-missing .yn,
.need-missing .team-pick-btn{ outline:2px solid var(--late); outline-offset:1px; }
.need-msg, label.field > span.need-msg{ display:block; color:var(--late); font-size:var(--fs-xs); font-weight:400; margin:4px 0 0; }
.shop .small, .co .small, .shop .hint, .co .hint{ font-size:var(--fs-xs); }
.shop .btn-sm, .co .btn-sm{ font-size:var(--fs-sm); }
.shop-bar{ display:none; }
@media (max-width:760px){
  .co .co-step-b [data-block="ask"] .grid2{ grid-template-columns:minmax(0,1fr); }
  .nr-steps{ gap:8px; }
  .nr-steps li{ flex-wrap:wrap; gap:2px 6px; }
  .nr-steps .ns-sub{ margin-left:0; flex-basis:100%; }
  .order-switch{ display:flex; }
  .order-opt{ flex:1 1 0; min-height:44px; padding:8px 10px; }
  .chip-f{ min-height:36px; padding:6px 14px; font-size:var(--fs-sm); }
  .chip-f::after{ content:""; position:absolute; inset:-4px 0; }
  .st-b, .tile-ph .tile-st .st-b{ width:44px; height:44px; font-size:var(--fs-lg); }
  .tile-add{ width:44px; height:44px; font-size:var(--fs-lg); }
  .panel-h{ min-height:44px; }
  .shop .btn, .co .btn, .ns-b{ min-height:44px; }
  /* the kit so far and Continue, at the foot; the kit sheet sits on it */
  .shop-bar{ display:flex; align-items:center; gap:12px; position:fixed; left:0; right:0; bottom:0; z-index:41; padding:10px 16px calc(10px + env(safe-area-inset-bottom));
    background:var(--panel); border-top:1px solid var(--line3); box-shadow:var(--shop-sheet-shadow); }
  .shop-bar[hidden]{ display:none; }
  .shop-bar .sb-t{ flex:1; min-width:0; font-size:var(--fs-sm); line-height:1.3; color:var(--dim); }
  .shop-bar .sb-t b{ display:block; font-size:var(--fs-md); color:var(--ink); }
  .shop-bar .btn{ padding:0 20px; }
  .mto-panel{ bottom:68px; box-shadow:none; border-bottom:0; border-radius:14px 14px 0 0; }
  .panel-f{ display:none; }
  .shop{ padding-bottom:84px; }
}

/* Chat: a channel OnQ shares with the account (EMM #1218, 2026-10-27) */
.chat-shared-line{ display:flex; align-items:center; gap:6px; margin:0 0 12px; font-size:13px; color:var(--ink); }
.chat-eye{ display:inline-flex; color:var(--accent); }
.chat-eye svg{ width:16px; height:16px; }
.chat-chans{ display:flex; gap:6px; flex-wrap:wrap; }
.chat-msgs{ display:flex; flex-direction:column; gap:10px; max-height:60vh; overflow-y:auto; }
.chat-msg.reply{ margin-left:24px; }
.chat-msg-h{ display:flex; gap:6px; align-items:baseline; font-size:13px; }
.chat-msg-b, .chat-doc-body{ white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink); }
.chat-compose{ border-top:1px solid var(--line3); }
.chat-list{ margin:0 0 10px; padding-left:18px; }
.chat-newdoc summary{ cursor:pointer; color:var(--accent); font-weight:600; }
.chat-doc-text{ min-height:320px; }
/* a client request's own flow (EMM #1138, 2026-10-28): its note under the title, what is shipping */
.flow-note{ margin:0 0 12px; padding:8px 12px; border-radius:8px; border:1px solid var(--chip-info-line); background:var(--chip-info-bg); color:var(--chip-info-ink); font-size:var(--fs-sm); }
.flow-note.flow-warn{ border-color:var(--chip-warn-line); background:var(--chip-warn-bg); color:var(--chip-warn-ink); }
.ship-kit{ padding:6px 0; border-bottom:1px solid var(--rule); } .ship-kit:last-child{ border-bottom:0; }
.ship-kit ul{ margin:4px 0 0 18px; padding:0; }
.tile-lead{ color:var(--chip-warn-ink); font-size:var(--fs-xs); font-weight:600; }
.cal .ev.ev-start{ background:var(--panel); color:var(--ink); border:1.5px dashed var(--line4); }

/* Programs (EMM #1324, 2026-10-29): the search first, the head stays in view, the heads sort */
.pg-scroll{ max-height:calc(100vh - 220px); overflow:auto; }
.pg-table thead th{ position:sticky; top:0; z-index:2; background:var(--panel); }
.pg-table th[data-pg-sort]{ cursor:pointer; user-select:none; }
.pg-table th[aria-sort="ascending"]::after{ content:" \25B2"; font-size:.7em; }
.pg-table th[aria-sort="descending"]::after{ content:" \25BC"; font-size:.7em; }

/* NEW REQUEST AS ONE PAGE OF SECTIONS (EMM #1324, 2026-10-29): Kits, Shipping, Details, each
   opening below the last; a finished one folds to its line; no step numbers */
.sec-h{ display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:var(--panel); margin-bottom:8px; }
.sec-h strong{ font-size:var(--fs-md, 1rem); }
.sec-h .sec-sum, .sec-h .co-sum{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.shop.folded > :not([data-kits-h]){ display:none !important; }
.co-step.later .sec-h{ opacity:.6; }
.co-step .co-n{ display:none; }
/* Back and Continue stay at the foot of the window while the section scrolls (item 10) */
.co-go, .shop > .shop-go{ position:sticky; bottom:0; z-index:5; background:var(--page); padding:10px 0; border-top:1px solid var(--line); }
/* on a phone the fixed kit bar already carries Continue: no second one (EMM #1324, 2026-10-30) */
@media (max-width:760px){ .shop:has(> .shop-bar:not([hidden])) > .shop-go{ display:none; } }

/* the form's file rows (EMM #1324): a drop target, each file a chip with its remove */
.file-pick-row{ border:1px dashed transparent; border-radius:8px; padding:4px; }
.file-pick-row.fp-drag{ border-color:var(--accent); background:var(--bluebox); }
.fp-chip{ display:inline-flex; align-items:center; gap:4px; border:1px solid var(--line4); border-radius:999px; padding:1px 4px 1px 10px; margin:2px 4px 2px 0; font-size:var(--fs-xs); }
.fp-x{ border:0; background:transparent; color:var(--dim); cursor:pointer; font-size:1rem; line-height:1; padding:0 4px; }

/* PROGRAMS AND PROJECTS, THE GANTT AND THE CALENDAR (EMM #1350, 2026-10-30). The bar colours are
   the Work schedule's (_rowStCol in work_shell.html), the same in both themes as there; a pale
   fill takes the dark ink. */
:root{ --sched-done:#22c55e; --sched-late:#dc2626; --sched-today:#e0b000; --sched-prog:#1e50b3;
  --sched-wait:#b45309; --sched-plan:#7fb2e5; --sched-span:#4a5871; --sched-instore:#7b6dcc;
  --sched-ink-dark:#0d1117; }
.pg-toprow{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.pg-toprow .grow{ flex:1; }
.pg-toprow .seg{ flex-wrap:wrap; max-width:100%; }
.pg-kn{ font-family:ui-monospace,monospace; font-weight:800; font-size:.8em; color:var(--blue-ink); margin-left:2px; }
.pg-filters{ margin-top:-4px; }
.pg-flt{ display:inline-flex; align-items:center; gap:6px; }
.pg-flt select, .pg-flt input{ background:var(--find-bg); color:var(--ink); border:1px solid var(--line4); border-radius:6px; padding:4px 6px; font:inherit; font-size:.85rem; }
.linkbtn{ background:none; border:0; padding:0; color:var(--link); text-decoration:underline; cursor:pointer; font:inherit; }
.pg-sched{ margin-bottom:16px; }
.pg-sched-note:not(:empty){ margin-top:8px; }
.pgs-sw{ width:12px; height:12px; border-radius:3px; display:inline-block; }
.pgst-done{ --sb:var(--sched-done); } .pgst-late{ --sb:var(--sched-late); } .pgst-today{ --sb:var(--sched-today); }
.pgst-in_progress{ --sb:var(--sched-prog); } .pgst-waiting{ --sb:var(--sched-wait); } .pgst-planned{ --sb:var(--sched-plan); }
.pgs-sw.pgst-done, .pgs-sw.pgst-late, .pgs-sw.pgst-today, .pgs-sw.pgst-in_progress, .pgs-sw.pgst-waiting, .pgs-sw.pgst-planned{ background:var(--sb); }
.pgg-instore-sw{ background:var(--sched-instore); transform:rotate(45deg) scale(.8); }
/* the Gantt and the Calendar wear the Requests Timeline's rows (.gt-*) and the Requests calendar's
   month (.cal); only the step colours, the diamonds and the weekend grey are their own */
.gt-bar.pgst-done, .gt-bar.pgst-late, .gt-bar.pgst-today, .gt-bar.pgst-in_progress, .gt-bar.pgst-waiting, .gt-bar.pgst-planned{ background:var(--sb); top:8px; height:14px; padding:0; }
.pgg-sub{ padding-left:22px; color:var(--faded); }
.pgg-dia{ position:absolute; top:9px; width:12px; height:12px; margin-left:-6px; transform:rotate(45deg); background:var(--sb, var(--sched-plan)); border-radius:2px; z-index:1; }
.pgg-instore{ background:var(--sched-instore); }
.pgg-nodate{ position:absolute; left:8px; top:6px; }
.pgc-wrap{ overflow:auto; }
.cal.pgc{ min-width:700px; }
.cal .day.pgc-off{ background:var(--panel3); }
.cal .ev.pgs-ev{ background:var(--sb, var(--sched-plan)); color:var(--on-solid); }
.cal .ev.pgst-today, .cal .ev.pgst-planned, .cal .ev.pgst-done{ color:var(--sched-ink-dark); }
.cal .ev.pgg-instore-ev{ background:var(--sched-instore); color:var(--on-solid); }
.pgc-none{ margin-top:8px; }
@media (max-width:640px){ .pg-flt{ flex:1 1 140px; } .pg-flt select, .pg-flt input{ flex:1; min-width:0; } }