/* ============================================================================
   THE CUT FLOOR — Cabinet Studio job + room views (PR-CUTFLOOR 2026-06-14)
   The BENCH design language re-scoped onto the studio as a MANUFACTURING
   command surface: a GATE → YIELD → FIX → ROUTE → PACKET spine where the
   release gate is the page and yield/cost/parts hang off it. Cool-graphite
   palette, light + dark, SCOPED to the studio roots so the rest of the app is
   untouched. bench-studio.js sets data-bench=light|dark from theme luminance.
   ============================================================================ */

/* ---- graphite tokens: DARK (default) — scoped to studio roots --------------
   Job view recolors the whole hub (#cab-job). The Design Dashboard recolors the
   whole studio landing (#cab-dash) the same way. Room view scopes ONLY to the
   CUT FLOOR header (#cutfloor-room) so the inspector + 3D editor chrome stay on
   the app theme — the header reads as an intentional graphite accent panel.
   The dashboard/job markup is fully token-based, so overriding the tokens here
   recolors the whole surface with no per-element rewrite. */
/* THEME (2026-07-18 v2): the studios now INHERIT the global theme tokens
   (--bg/--pn/--txt/--acc/… from :root[data-theme] in tokens.css/app.css) —
   NO separate palette. This killed the light-page/dark-content MIX: the old
   override defaulted these containers to DARK and only flipped via a
   `data-bench` flag that nothing ever set on them, so in light theme the
   studio content stayed dark on a light page. Inheriting means the studios
   are ALWAYS consistent with the rest of the app in BOTH themes. --teal is
   the one accent the studio markup uses that the global palette doesn't
   define (dark default here + light override below). */
#cab-job, #cab-dash, #cutfloor-room, #d-orders {
  --teal:#2DD4BF; --teal-ink:#06231F;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
:root[data-theme="light"] #cab-job,
:root[data-theme="light"] #cab-dash,
:root[data-theme="light"] #cutfloor-room,
:root[data-theme="light"] #d-orders {
  --teal:#0E9C8C; --teal-ink:#FFFFFF;
}

/* ---- shared CUT FLOOR atoms ---------------------------------------------- */
.cf { font-family: var(--ff-ui, 'Inter', system-ui, sans-serif); display:flex; flex-direction:column; gap:16px; }
.cf-mono { font-family: var(--ff-mono, 'JetBrains Mono', ui-monospace, monospace); font-variant-numeric: tabular-nums; }
.cf-block { background:var(--pn); border:1px solid var(--bdr); border-radius:12px; padding:16px 18px; }
.cf-label { font:590 12px var(--ff-ui); letter-spacing:.085em; text-transform:uppercase; color:var(--dim); margin:0 0 12px; display:flex; align-items:center; gap:10px; }
.cf-label .cf-label-meta { margin-left:auto; font:600 11px var(--ff-mono); color:var(--muted); letter-spacing:.02em; text-transform:none; }
.cf-dim { color:var(--muted); }
.cf-link { color:var(--acc); cursor:pointer; font:600 12px var(--ff-ui); }
.cf-link:hover { text-decoration:underline; }

/* ============================ RELEASE GATE (the spine) =================== */
.cf-gate { border:1px solid var(--bdr); border-radius:14px; background:var(--pn); overflow:hidden; }
.cf-gate[data-state="bad"]  { border-color:color-mix(in srgb, var(--no) 55%, var(--bdr)); }
.cf-gate[data-state="warn"] { border-color:color-mix(in srgb, var(--warn) 45%, var(--bdr)); }
.cf-gate-verdict { display:flex; align-items:center; gap:14px; padding:16px 20px; }
.cf-gate-dot { flex:0 0 auto; width:13px; height:13px; border-radius:50%; background:var(--ok); box-shadow:0 0 0 4px color-mix(in srgb, var(--ok) 22%, transparent); }
.cf-gate[data-state="bad"]  .cf-gate-dot { background:var(--no);   box-shadow:0 0 0 4px color-mix(in srgb, var(--no) 22%, transparent); }
.cf-gate[data-state="warn"] .cf-gate-dot { background:var(--warn); box-shadow:0 0 0 4px color-mix(in srgb, var(--warn) 22%, transparent); }
.cf-gate-headline { font-size:clamp(17px,2vw,22px); font-weight:600; letter-spacing:-0.01em; color:var(--white); }
.cf-gate[data-state="bad"] .cf-gate-headline { color:var(--no); }
.cf-gate-sub { font:600 11px var(--ff-mono); color:var(--dim); margin-left:auto; white-space:nowrap; letter-spacing:.02em; }

/* the fix-path rows (decision-support, not just a count) */
.cf-rows { display:flex; flex-direction:column; border-top:1px solid var(--bdr); }
.cf-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:11px 20px; border-top:1px solid color-mix(in srgb, var(--bdr) 55%, transparent); cursor:pointer; transition:background .12s ease; }
.cf-row:first-child { border-top:none; }
.cf-row:hover, .cf-row:focus-visible { background:var(--pn-h); outline:none; }
.cf-row:focus-visible { box-shadow:inset 0 0 0 2px color-mix(in srgb, var(--acc) 55%, transparent); }
.cf-tag { flex:0 0 auto; font:700 10.5px var(--ff-mono); letter-spacing:.06em; padding:3px 7px; border-radius:5px; white-space:nowrap; }
.cf-tag.is-block { background:color-mix(in srgb, var(--no) 16%, transparent); color:var(--no); }
.cf-tag.is-verify{ background:color-mix(in srgb, var(--warn) 16%, transparent); color:var(--warn); }
.cf-row-name { flex:0 0 auto; font-size:13.5px; font-weight:600; color:var(--white); }
.cf-row-why { flex:1 1 240px; min-width:0; font-size:13px; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cf-row-fix { flex:0 0 auto; font:600 12px var(--ff-ui); color:var(--acc); white-space:nowrap; }
.cf-row-clear { padding:12px 20px; border-top:1px solid var(--bdr); font-size:13px; color:var(--ok); }
.cf-rows-more { padding:9px 20px; border-top:1px solid color-mix(in srgb, var(--bdr) 55%, transparent); font:600 12px var(--ff-ui); color:var(--acc); cursor:pointer; }

/* ============================ READ TILES (hang off the gate) ============= */
.cf-reads { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:14px; }
.cf-tile { background:var(--pn); border:1px solid var(--bdr); border-radius:12px; padding:14px 16px; display:flex; flex-direction:column; gap:8px; }
.cf-tile-row { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.cf-tile-k { font-size:12.5px; color:var(--dim); }
.cf-tile-v { font:700 16px var(--ff-mono); font-variant-numeric:tabular-nums; color:var(--white); }
.cf-tile-v.is-big { font-size:24px; line-height:1; }
.cf-tile-v.is-ok { color:var(--ok); } .cf-tile-v.is-warn { color:var(--warn); } .cf-tile-v.is-bad { color:var(--no); }
.cf-tile-v.is-nodata { color:var(--muted); }
.cf-tile-sub { font-size:11px; color:var(--muted); }

/* parts count chips */
.cf-parts { display:flex; gap:8px; flex-wrap:wrap; }
.cf-part { display:flex; flex-direction:column; align-items:center; min-width:62px; padding:8px 10px; background:var(--bg); border:1px solid var(--bdr); border-radius:8px; }
.cf-part-n { font:700 17px var(--ff-mono); color:var(--white); font-variant-numeric:tabular-nums; }
.cf-part-k { font:590 9.5px var(--ff-ui); letter-spacing:.06em; text-transform:uppercase; color:var(--dim); margin-top:2px; }

/* material-to-buy / list rows */
.cf-list { display:flex; flex-direction:column; gap:1px; }
.cf-list-row { display:flex; align-items:center; gap:10px; padding:7px 0; border-bottom:1px solid color-mix(in srgb, var(--bdr) 45%, transparent); }
.cf-list-row:last-child { border-bottom:none; }
.cf-list-name { flex:1 1 auto; min-width:0; font-size:13px; color:var(--txt); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cf-list-qty { flex:0 0 auto; font:600 12.5px var(--ff-mono); color:var(--dim); font-variant-numeric:tabular-nums; }
.cf-list-amt { flex:0 0 auto; font:600 12.5px var(--ff-mono); color:var(--txt); font-variant-numeric:tabular-nums; min-width:64px; text-align:right; }

/* yield hero slot (server-add pending) */
.cf-yield-pending { display:flex; align-items:center; gap:10px; font-size:13px; color:var(--muted); }
.cf-yield-pending .cf-yield-note { font-size:11.5px; }

/* rooms rollup */
.cf-rooms { display:flex; flex-direction:column; gap:8px; }
.cf-room-card { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:12px 14px; background:var(--pn); border:1px solid var(--bdr); border-left:3px solid var(--bdr-h); border-radius:10px; cursor:pointer; transition:border-color .12s ease, background .12s ease; }
.cf-room-card[data-state="bad"]  { border-left-color:var(--no); }
.cf-room-card[data-state="warn"] { border-left-color:var(--warn); }
.cf-room-card[data-state="ok"]   { border-left-color:var(--ok); }
.cf-room-card:hover, .cf-room-card:focus-visible { background:var(--pn-h); border-color:var(--bdr-h); outline:none; }
.cf-room-name { flex:0 0 auto; font-size:14px; font-weight:600; color:var(--white); }
.cf-room-meta { flex:1 1 auto; min-width:0; font:12px var(--ff-mono); color:var(--dim); font-variant-numeric:tabular-nums; }
.cf-room-state { flex:0 0 auto; font:700 11px var(--ff-mono); }
.cf-room-state.is-bad { color:var(--no); } .cf-room-state.is-warn { color:var(--warn); } .cf-room-state.is-ok { color:var(--ok); }
.cf-room-open { flex:0 0 auto; color:var(--acc); font:600 12px var(--ff-ui); }
/* room management actions merged into the rollup card (Trim / Open 3D / delete) */
.cf-room-acts { flex:0 0 auto; display:flex; gap:6px; align-items:center; }
.cf-room-btn { font:600 11.5px var(--ff-ui); padding:5px 9px; border-radius:7px; background:var(--inp); color:var(--dim); border:1px solid var(--bdr); cursor:pointer; white-space:nowrap; transition:background .12s ease, color .12s ease, border-color .12s ease; }
.cf-room-btn:hover { background:var(--pn-h); color:var(--txt); border-color:var(--bdr-h); }
.cf-room-btn.is-pri { background:var(--acc); color:var(--acc-ink); border-color:var(--acc); }
.cf-room-btn.is-pri:hover { filter:brightness(1.06); }
.cf-room-btn.is-del { color:var(--no); border-color:color-mix(in srgb, var(--no) 35%, var(--bdr)); padding:5px 8px; }
.cf-room-btn.is-del:hover { background:color-mix(in srgb, var(--no) 14%, transparent); color:var(--no); }

/* fingerprint / stale stamp */
.cf-stamp { font:11px var(--ff-mono); color:var(--muted); display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.cf-stamp .cf-stale { color:var(--warn); font-weight:600; }
.cf-stamp .cf-restamp { color:var(--acc); cursor:pointer; }

/* shop packet launcher (greyed until gate clears) */
.cf-packet { display:inline-flex; align-items:center; gap:8px; padding:0 16px; min-height:42px; border-radius:10px; background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc); font:600 13.5px var(--ff-ui); cursor:pointer; }
.cf-packet[disabled], .cf-packet.is-locked { background:var(--inp); color:var(--muted); border-color:var(--bdr); cursor:not-allowed; }

/* ============================ PROVENANCE (room, preview==cut) ============ */
.cf-prov { display:flex; flex-direction:column; gap:6px; }
.cf-prov-row { display:flex; align-items:baseline; gap:10px; padding:5px 0; border-bottom:1px solid color-mix(in srgb, var(--bdr) 40%, transparent); }
.cf-prov-row:last-child { border-bottom:none; }
.cf-prov-k { flex:0 0 96px; font-size:12px; color:var(--dim); }
.cf-prov-v { flex:1 1 auto; font-size:13px; font-weight:600; color:var(--white); }
.cf-prov-v.is-unresolved { color:var(--no); }
.cf-prov-src { flex:0 0 auto; font:11px var(--ff-mono); color:var(--muted); }

/* ============================================================================
   DESIGN DASHBOARD skin — match THE BENCH home (PR-CUTFLOOR-DASH 2026-06-14)
   Graphite tokens are already re-scoped onto #cab-dash above; this layers the
   BENCH *treatment* (capped/centered shell, type scale, KPI stat cards, chip
   status, airy rows, primary azure CTA) so the studio landing reads as the same
   product as the home page — not just a recoloured old table. All scoped to
   #cab-dash so no other page's .tab / .jobs-table / .pn is affected.
   ============================================================================ */
#cab-dash { padding:26px clamp(18px,4vw,40px) 72px; }
#cab-dash > * { max-width:1600px; margin-left:auto; margin-right:auto; }

/* hide the legacy breadcrumb (page title lives once in the studio header) */
#cab-dash #cab-crumbs { display:none; }

/* single tab bar — tabs (left) + primary actions (right), GitHub/Linear style */
#cab-dash .cab-dash-bar { display:flex; align-items:flex-end; gap:16px; flex-wrap:wrap; border-bottom:1px solid var(--bdr); margin:2px 0 20px; }
#cab-dash .cab-dash-bar .tabs { flex:1 1 auto; display:flex; gap:2px; border-bottom:none; margin:0; }
#cab-dash .cab-dash-bar .tab { background:transparent; border:none; color:var(--dim); font:600 13px var(--ff-ui); padding:10px 14px; border-bottom:2px solid transparent; border-radius:0; cursor:pointer; margin-bottom:-1px; transition:color .12s ease; }
#cab-dash .cab-dash-bar .tab:hover { color:var(--txt); }
#cab-dash .cab-dash-bar .tab.on { color:var(--white); border-bottom-color:var(--acc); }
#cab-dash .cab-hub-actions { flex:0 0 auto; display:flex; align-items:center; gap:10px; padding-bottom:6px; }
#cab-dash .cab-new-job-btn { background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc); border-radius:9px; font:600 13.5px var(--ff-ui); min-height:38px; padding:0 16px; cursor:pointer; transition:filter .12s ease; }
#cab-dash .cab-new-job-btn:hover { filter:brightness(1.07); }
/* UX (2026-07-18): "+ New Room" in the JOB view mirrors "+ New Job" in the
   dashboard — same compact accent pill, same place (top-right action row). */
#cab-job .cab-new-job-btn { background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc); border-radius:9px; font:600 13.5px var(--ff-ui); min-height:38px; padding:0 16px; cursor:pointer; transition:filter .12s ease; }
#cab-job .cab-new-job-btn:hover { filter:brightness(1.07); }
#cab-dash .cab-more-btn { background:var(--pn); border:1px solid var(--bdr); color:var(--dim); border-radius:9px; min-height:38px; min-width:38px; cursor:pointer; transition:border-color .12s ease, background .12s ease, color .12s ease; }
#cab-dash .cab-more-btn:hover { border-color:var(--bdr-h); background:var(--pn-h); color:var(--txt); }
#cab-dash .cab-more-menu { background:var(--pn); border:1px solid var(--bdr); border-radius:10px; box-shadow:var(--b-shadow); }
#cab-dash .cab-more-item { color:var(--txt); }
#cab-dash .cab-more-item:hover { background:var(--pn-h); }

/* KPI focal-metric → bench stat cards */
#cab-dash .cab-metric-focus { display:flex; align-items:stretch; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
#cab-dash .cmf-primary { display:flex; flex-direction:column; gap:3px; justify-content:center; background:var(--pn); border:1px solid var(--bdr); border-radius:12px; padding:14px 22px; min-width:158px; box-shadow:var(--b-shadow); cursor:pointer; text-align:left; }
#cab-dash .cmf-primary:hover { border-color:var(--bdr-h); }
#cab-dash .cmf-label { font:590 11px var(--ff-ui); letter-spacing:.085em; text-transform:uppercase; color:var(--dim); }
#cab-dash .cmf-value { font:700 30px var(--ff-mono); font-variant-numeric:tabular-nums; color:var(--white); line-height:1.05; }
#cab-dash .cmf-status { font:12px var(--ff-mono); color:var(--muted); }
#cab-dash .cmf-meta { display:flex; gap:12px; flex-wrap:wrap; align-items:stretch; }
#cab-dash .cmf-chip { display:flex; flex-direction:column; justify-content:center; gap:3px; background:var(--pn); border:1px solid var(--bdr); border-radius:11px; padding:10px 16px; min-width:104px; cursor:pointer; text-align:left; transition:border-color .12s ease, background .12s ease; }
#cab-dash .cmf-chip:hover { border-color:var(--bdr-h); background:var(--pn-h); }
#cab-dash .cmf-chip-v { font:700 18px var(--ff-mono); font-variant-numeric:tabular-nums; color:var(--white); }
#cab-dash .cmf-chip-l { font:590 10.5px var(--ff-ui); letter-spacing:.06em; text-transform:uppercase; color:var(--dim); }
#cab-dash .cmf-chip-link { position:relative; }
#cab-dash .cmf-chip-icon { position:absolute; top:9px; right:10px; width:12px; height:12px; color:var(--muted); }
#cab-dash .cmf-cell.active { border-color:var(--acc); box-shadow:0 0 0 1px var(--acc) inset; }

/* filter bar — bench inputs */
#cab-dash .filter-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
#cab-dash .fb-search { flex:1 1 280px; display:flex; align-items:center; gap:9px; background:var(--inp); border:1px solid var(--bdr); border-radius:10px; padding:0 13px; min-height:40px; }
#cab-dash .fb-search svg { width:16px; height:16px; color:var(--muted); flex:0 0 auto; }
#cab-dash .fb-search input { flex:1; background:transparent; border:none; color:var(--txt); font:14px var(--ff-ui); outline:none; }
#cab-dash .fb-label { font:590 11px var(--ff-ui); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
#cab-dash .filter-bar select { background:var(--inp); border:1px solid var(--bdr); color:var(--txt); border-radius:9px; min-height:40px; padding:0 12px; font:13px var(--ff-ui); cursor:pointer; }
#cab-dash .filter-bar select:hover { border-color:var(--bdr-h); }

/* panels */
#cab-dash .pn { background:var(--pn); border:1px solid var(--bdr); border-radius:12px; box-shadow:var(--b-shadow); margin-bottom:16px; }
#cab-dash .pn h3 { font-size:13px; font-weight:600; color:var(--white); letter-spacing:.01em; margin:0 0 10px; }

/* jobs table → airy bench rows */
#cab-dash .jobs-table { width:100%; border-collapse:collapse; }
#cab-dash .jobs-table thead th { font:590 11px var(--ff-ui); letter-spacing:.085em; text-transform:uppercase; color:var(--dim); text-align:left; padding:14px 16px; border-bottom:1px solid var(--bdr); cursor:pointer; white-space:nowrap; }
#cab-dash .jobs-table tbody tr { border-bottom:1px solid color-mix(in srgb, var(--bdr) 55%, transparent); cursor:pointer; transition:background .12s ease; }
#cab-dash .jobs-table tbody tr:last-child { border-bottom:none; }
#cab-dash .jobs-table tbody tr:hover { background:var(--pn-h); }
#cab-dash .jobs-table td { padding:13px 16px; vertical-align:middle; }
#cab-dash .col-name { display:flex; align-items:center; gap:10px; min-width:0; }
#cab-dash .col-name svg { width:17px; height:17px; color:var(--acc); flex:0 0 auto; }
#cab-dash .col-name .nm { font:600 14.5px var(--ff-ui); color:var(--white); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#cab-dash .col-client { font-size:13px; color:var(--dim); }
#cab-dash .col-progress { font:12.5px var(--ff-mono); font-variant-numeric:tabular-nums; color:var(--dim); }
#cab-dash .col-progress .pg-item { display:inline-flex; align-items:center; gap:5px; margin-right:12px; }
#cab-dash .col-progress .pg-item svg { width:13px; height:13px; opacity:.7; }
#cab-dash .col-when { font:12.5px var(--ff-mono); color:var(--dim); white-space:nowrap; }
#cab-dash .col-value { font:600 13px var(--ff-mono); font-variant-numeric:tabular-nums; color:var(--txt); text-align:right; }
#cab-dash .col-actions { text-align:right; white-space:nowrap; }
#cab-dash .ic-btn { background:transparent; border:1px solid transparent; color:var(--muted); border-radius:7px; width:30px; height:30px; cursor:pointer; transition:background .12s ease, color .12s ease, border-color .12s ease; }
#cab-dash .ic-btn:hover { background:var(--inp); color:var(--txt); border-color:var(--bdr); }

/* status pills → bench chips */
#cab-dash .status-pill { font:700 10px var(--ff-mono); letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:5px; white-space:nowrap; }
#cab-dash .pill-st-draft      { background:color-mix(in srgb, var(--muted) 20%, transparent); color:var(--dim); }
#cab-dash .pill-st-design     { background:color-mix(in srgb, var(--acc) 16%, transparent);   color:var(--acc); }
#cab-dash .pill-st-production { background:color-mix(in srgb, var(--warn) 16%, transparent);  color:var(--warn); }
#cab-dash .pill-st-delivered  { background:color-mix(in srgb, var(--ok) 16%, transparent);    color:var(--ok); }
#cab-dash .pill-st-archived   { background:color-mix(in srgb, var(--muted) 16%, transparent); color:var(--muted); }

/* quick links */
#cab-dash .brow { display:flex; gap:10px; flex-wrap:wrap; }
#cab-dash .brow .bg { background:var(--inp); border:1px solid var(--bdr); color:var(--txt); border-radius:9px; padding:9px 14px; font:600 13px var(--ff-ui); cursor:pointer; }
#cab-dash .brow .bg:hover { background:var(--pn-h); border-color:var(--bdr-h); }

/* empty state inside the table */
#cab-dash .empty-state { text-align:center; padding:48px 20px; color:var(--dim); }
#cab-dash .empty-state .ei { font-size:34px; margin-bottom:10px; opacity:.7; }
#cab-dash .empty-state .et { font-size:16px; font-weight:600; color:var(--white); margin-bottom:6px; }
#cab-dash .empty-state .es { font-size:13px; color:var(--dim); max-width:42ch; margin:0 auto 16px; line-height:1.55; }

/* ============================================================================
   APPLE BAR (PR-CUTFLOOR-DASH-APPLE 2026-06-14) — lift the dashboard cards to
   the same quality as the frosted islands: softer 14px radii, layered soft
   shadows, more whitespace, restrained motion (smooth 160ms transitions + a
   subtle active-press for tactility — NO hover-lift / bounce). Placed last so
   it refines the values above.
   ============================================================================ */
#cab-dash .cmf-primary, #cab-dash .cmf-chip, #cab-dash .pn {
  border-radius:14px;
  box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 60%, transparent),
             0 16px 40px -22px color-mix(in srgb, var(--bg) 82%, transparent);
  transition:border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
#cab-dash .cmf-primary { padding:18px 24px; }
#cab-dash .cmf-chip { padding:13px 18px; }
#cab-dash .cmf-primary:active, #cab-dash .cmf-chip:active { transform:scale(.99); }
#cab-dash .cab-metric-focus { gap:16px; margin-bottom:26px; }
#cab-dash .cab-dash-bar { margin-bottom:24px; }
#cab-dash .filter-bar { margin-bottom:20px; gap:12px; }
#cab-dash .fb-search, #cab-dash .filter-bar select { border-radius:11px; }

/* airier table + smoother row hover */
#cab-dash .jobs-table thead th { padding:13px 18px; }
#cab-dash .jobs-table td { padding:15px 18px; }
#cab-dash .jobs-table tbody tr { transition:background .16s ease; }

/* primary CTA + icon buttons: restrained press feedback */
#cab-dash .cab-new-job-btn { transition:filter .16s ease, transform .16s ease; }
#cab-dash .cab-new-job-btn:active { transform:scale(.98); }
#cab-dash .ic-btn { transition:background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease; }
#cab-dash .ic-btn:active { transform:scale(.92); }

/* tab stubs (Templates / Archive) → professional empty state, not "coming soon" */
#cab-dash .jobs-tab-stub { padding:64px 24px !important; text-align:center; }
#cab-dash .jobs-tab-stub h2 { font-size:17px; font-weight:600; color:var(--white); margin:0 0 8px; }
#cab-dash .jobs-tab-stub p { font-size:13px; color:var(--dim); max-width:48ch; margin:0 auto; line-height:1.6; }
#cab-dash .jobs-tab-stub .stub-cta { display:inline-flex; align-items:center; gap:8px; margin-top:18px; padding:0 16px; min-height:38px; border-radius:10px; background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc); font:600 13px var(--ff-ui); cursor:pointer; transition:filter .16s ease, transform .16s ease; }
#cab-dash .jobs-tab-stub .stub-cta:hover { filter:brightness(1.07); }
#cab-dash .jobs-tab-stub .stub-cta:active { transform:scale(.98); }

/* Standards tab chrome → bench language (header + azure save; body inherits tokens) */
#cab-dash .std-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--bdr); }
#cab-dash .std-header h2 { font-size:18px; font-weight:600; color:var(--white); margin:0; letter-spacing:-0.01em; }
#cab-dash .std-subtitle { font-size:12.5px; color:var(--dim); margin:6px 0 0; max-width:72ch; line-height:1.55; }
#cab-dash .std-save-btn { background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc); border-radius:9px; min-height:38px; padding:0 16px; font:600 13px var(--ff-ui); cursor:pointer; transition:filter .16s ease, transform .16s ease; }
#cab-dash .std-save-btn:hover { filter:brightness(1.07); }
#cab-dash .std-save-btn:active { transform:scale(.98); }
#cab-dash .std-status-msg { font:12px var(--ff-mono); color:var(--dim); }

/* ============================================================================
   STAT ROW + SEGMENTED TABS (PR-CUTFLOOR-DASH-REWORK 2026-06-14) — smaller,
   denser stat cards that FILL the width (Jobs + Rooms/Cabinets/Library + the
   Drawings/Production/Done stage cards), and macOS-style segmented tabs in the
   header for a real pro-tool feel.
   ============================================================================ */
#cab-dash .cab-metric-focus { display:flex; gap:12px; align-items:stretch; flex-wrap:wrap; margin-bottom:22px; }
#cab-dash .cmf-primary { flex:0 0 auto; min-width:172px; min-height:76px; padding:14px 18px; gap:2px; }
#cab-dash .cmf-meta { flex:1 1 auto; display:flex; gap:12px; flex-wrap:wrap; }
#cab-dash .cmf-chip { flex:1 1 108px; min-height:76px; justify-content:center; padding:11px 14px; gap:2px; }
#cab-dash .cmf-value { font-size:30px; line-height:1; }
#cab-dash .cmf-chip-v { font-size:21px; }
#cab-dash .cmf-label, #cab-dash .cmf-chip-l { font-size:10.5px; letter-spacing:.09em; }
#cab-dash .cmf-chip-icon { width:13px; height:13px; }
/* primary "Jobs" card carries a subtle accent ring */
#cab-dash .cmf-primary {
  border-color:color-mix(in srgb, var(--acc) 42%, var(--bdr));
  box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 55%, transparent),
             0 14px 34px -22px color-mix(in srgb, var(--acc) 32%, transparent);
}
#cab-dash .cmf-cell.active { border-color:var(--acc); box-shadow:0 0 0 1.5px var(--acc) inset; }
/* stage cards (Drawings / Production / Done) read as their own group */
#cab-dash .cmf-stage .cmf-chip-v { color:var(--acc2, var(--acc)); }
#cab-dash .cmf-stage.active .cmf-chip-v { color:var(--acc-ink); }
#cab-dash .cmf-stage.active { background:var(--acc); border-color:var(--acc); }
#cab-dash .cmf-stage.active .cmf-chip-l { color:var(--acc-ink); }
/* primary card's status line (JS swaps the class to mctx/.muted/.good) */
#cab-dash .cmf-status, #cab-dash .mctx { font:600 12px var(--ff-mono); color:var(--warn); }
#cab-dash .mctx.muted { color:var(--muted); font-weight:400; }
#cab-dash .mctx.good { color:var(--ok); }

/* macOS-style SEGMENTED tabs (Active / Templates / Library / Standards / Archive) */
/* PR-STUDIO-COHERENCE (2026-07-19): premium segmented control — a lifted
   inset track with an elevated white active pill whose label picks up the
   blueprint-blue accent, matching the accent vocabulary of the Door Studio
   feature cards. Same tabs, nicer chrome (operator: "polish the tabs"). */
#cab-dash .cab-dash-bar { border-bottom:none; align-items:center; }
#cab-dash .cab-dash-bar .tabs { display:inline-flex; gap:3px; background:var(--inp); border:1px solid var(--bdr); border-radius:10px; padding:3px; margin:0; flex:0 0 auto; box-shadow: inset 0 1px 2px color-mix(in srgb, var(--bg) 35%, transparent); }
#cab-dash .cab-dash-bar .tab { border:none; border-radius:7px; padding:7px 16px; margin-bottom:0; color:var(--dim); font:600 13px var(--ff-ui); letter-spacing:.01em; cursor:pointer; transition:background .14s var(--ease-out), color .14s var(--ease-out), box-shadow .14s var(--ease-out); }
#cab-dash .cab-dash-bar .tab:hover:not(.on) { color:var(--txt); background:color-mix(in srgb, var(--pn) 50%, transparent); }
#cab-dash .cab-dash-bar .tab.on { background:var(--pn); color:var(--acc); border-bottom:none; box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 40%, transparent), 0 2px 8px color-mix(in srgb, var(--acc) 14%, transparent); }

/* ============================================================================
   JOBS CARD REWORK (PR-CUTFLOOR-DASH-REWORK 2026-06-14) — the search + filters
   now live inside the jobs card header (so it's obvious you're searching the
   jobs list), workflow status is a pill row, and + New Job is unmistakable.
   ============================================================================ */
#cab-dash .jobs-card { padding:0; overflow:hidden; }
#cab-dash .jobs-card-head { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:16px 18px; border-bottom:1px solid var(--bdr); }
#cab-dash .jobs-card-title { font-size:16px; font-weight:600; color:var(--white); margin:0; letter-spacing:-0.01em; }
#cab-dash .jobs-card-count { font:600 13px var(--ff-mono); color:var(--muted); margin-left:6px; }
#cab-dash .jobs-card-tools { display:flex; align-items:center; gap:10px; flex-wrap:wrap; flex:1 1 360px; justify-content:flex-end; }
#cab-dash .jobs-card-tools .fb-search { flex:1 1 220px; min-width:180px; max-width:420px; }
#cab-dash .jobs-card-tools select { background:var(--inp); border:1px solid var(--bdr); color:var(--txt); border-radius:10px; min-height:40px; padding:0 12px; font:13px var(--ff-ui); cursor:pointer; }
#cab-dash .jobs-card-tools select:hover { border-color:var(--bdr-h); }

/* workflow status pills (the Drawings / Production / Done "tabs") */
#cab-dash .jobs-status-pills { display:flex; gap:8px; flex-wrap:wrap; padding:13px 18px; border-bottom:1px solid var(--bdr); }
#cab-dash .jsp { font:600 12.5px var(--ff-ui); padding:7px 15px; border-radius:999px; border:1px solid var(--bdr); background:var(--inp); color:var(--dim); cursor:pointer; transition:background .14s ease, color .14s ease, border-color .14s ease, transform .14s ease; }
#cab-dash .jsp:hover { border-color:var(--bdr-h); color:var(--txt); }
#cab-dash .jsp:active { transform:scale(.96); }
#cab-dash .jsp.on { background:var(--acc); border-color:var(--acc); color:var(--acc-ink); }
#cab-dash .jobs-table-wrap { overflow-x:auto; }

/* + NEW JOB — the core action, unmissable: larger, heavier, soft accent glow */
/* + New Job = the page's hero CTA — large, iconic, glowing, clearly dominant */
#cab-dash .cab-new-job-btn { display:inline-flex; align-items:center; gap:8px; min-height:46px; padding:0 26px; font-size:15px; font-weight:700; border-radius:12px; letter-spacing:.01em; box-shadow:0 12px 30px -10px color-mix(in srgb, var(--acc) 80%, transparent); }
#cab-dash .cab-new-job-btn svg { width:18px; height:18px; }
#cab-dash .cab-new-job-btn:hover { filter:brightness(1.08); box-shadow:0 16px 38px -10px color-mix(in srgb, var(--acc) 90%, transparent); }
#cab-dash .cab-new-job-btn:active { transform:scale(.98); }
/* keep ⋯ visually secondary so New Job dominates */
#cab-dash .cab-hub-actions { gap:12px; }
#cab-dash .cab-more-btn { min-height:40px; opacity:.85; }
#cab-dash .cab-more-btn:hover { opacity:1; }

/* per-row "mark stage" menu items in the ⋯ row menu */
.row-menu .rm-stage-head { font:600 10px var(--ff-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); padding:8px 12px 4px; }

/* ============================================================================
   TWO-ZONE + DATA RAIL (PR-CUTFLOOR-DASH-2ZONE 2026-06-14) — jobs list (main) +
   a sticky data rail on the right, matching the HOME's two-zone. Reuses the
   home's global .bench-grid/.bench-rail/.bench-ar; styles the dash-* modules.
   ============================================================================ */
#cab-dash .dash-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:20px; align-items:start; margin-top:4px; }
#cab-dash .bench-main { min-width:0; }
#cab-dash .dash-rail { display:flex; flex-direction:column; gap:16px; position:sticky; top:14px; }
#cab-dash .dash-rail .bench-block { margin:0; background:var(--pn); border:1px solid var(--bdr); border-radius:14px; padding:14px 16px; box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 60%, transparent), 0 14px 34px -24px color-mix(in srgb, var(--bg) 80%, transparent); }
#cab-dash .dash-rail .bench-block-head { display:flex; align-items:baseline; gap:8px; margin-bottom:11px; }
#cab-dash .dash-rail .bench-label { font:590 11px var(--ff-ui); letter-spacing:.09em; text-transform:uppercase; color:var(--dim); }
#cab-dash .dash-rail .bench-block-meta { margin-left:auto; font:11px var(--ff-mono); color:var(--muted); }
#cab-dash .dash-card { display:flex; flex-direction:column; gap:5px; }

/* pipeline rows (click → filter the list) */
#cab-dash .dash-stage { display:flex; align-items:center; gap:10px; background:none; border:none; padding:4px 2px; cursor:pointer; width:100%; text-align:left; transition:opacity .12s ease; }
#cab-dash .dash-stage:hover { opacity:.82; }
#cab-dash .dash-stage-n { flex:0 0 74px; font:12.5px var(--ff-ui); color:var(--dim); }
#cab-dash .dash-stage-bar { flex:1 1 auto; height:6px; background:var(--inp); border-radius:3px; overflow:hidden; }
#cab-dash .dash-stage-bar > i { display:block; height:100%; background:var(--acc); border-radius:3px; }
#cab-dash .dash-stage-v { flex:0 0 auto; font:600 13px var(--ff-mono); color:var(--white); min-width:18px; text-align:right; font-variant-numeric:tabular-nums; }

/* job rows (on the floor + recent) */
#cab-dash .dash-job { display:flex; align-items:center; justify-content:space-between; gap:10px; background:none; border:none; padding:8px 2px; cursor:pointer; width:100%; text-align:left; border-bottom:1px solid color-mix(in srgb, var(--bdr) 45%, transparent); transition:color .12s ease; }
#cab-dash .dash-job:last-child { border-bottom:none; }
#cab-dash .dash-job:hover .dash-job-name { color:var(--acc); }
#cab-dash .dash-job-name { min-width:0; font:600 13px var(--ff-ui); color:var(--txt); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#cab-dash .dash-job-when { flex:0 0 auto; font:11px var(--ff-mono); color:var(--muted); }
#cab-dash .dash-empty { font-size:12px; color:var(--muted); line-height:1.55; padding:2px 0; }

/* receivables (reuse global .bench-ar-* from bench.css; just spacing) */
#cab-dash .dash-rail .bench-ar { gap:9px; }

/* quick links */
#cab-dash .dash-links { gap:8px; }
#cab-dash .dash-links .bg { background:var(--inp); border:1px solid var(--bdr); color:var(--txt); border-radius:9px; padding:9px 12px; font:600 12.5px var(--ff-ui); cursor:pointer; text-align:left; transition:background .12s ease, border-color .12s ease; }
#cab-dash .dash-links .bg:hover { background:var(--pn-h); border-color:var(--bdr-h); }

/* stack the rail under the list on narrow screens */
@media (max-width:1080px){ #cab-dash .dash-grid { grid-template-columns:1fr; } #cab-dash .dash-rail { position:static; flex-direction:row; flex-wrap:wrap; } #cab-dash .dash-rail .bench-block { flex:1 1 240px; } }

/* ============================================================================
   DOOR STUDIO dashboard (#d-orders) — same treatment as the cabinet dashboard
   (PR-CUTFLOOR-DOOR 2026-06-14): graphite (tokens scoped above), capped shell,
   one header + hero "Start New Order", segmented view pills, bench inputs, airy
   table. Scoped to #d-orders so the door builder (#d-new) + the rest are untouched.
   ============================================================================ */
#d-orders { padding:24px clamp(18px,4vw,40px) 72px; }
#d-orders > * { max-width:1600px; margin-left:auto; margin-right:auto; }
#d-orders .crumbs { display:none; }

/* header: the title lives once in .shdr ("Door Design Studio"); here it's just
   the hero action, right-aligned (the h2/subtitle are removed in markup). */
#d-orders .cab-hub-head { display:flex; align-items:center; justify-content:flex-end; gap:16px; margin:0 0 18px; border:none; padding:0; }
#d-orders .cab-new-job-btn { display:inline-flex; align-items:center; gap:8px; background:var(--acc); color:var(--acc-ink); border:1px solid var(--acc); min-height:46px; padding:0 26px; font:700 15px var(--ff-ui); border-radius:12px; cursor:pointer; box-shadow:0 12px 30px -10px color-mix(in srgb, var(--acc) 80%, transparent); transition:filter .16s ease, transform .16s ease, box-shadow .16s ease; }
#d-orders .cab-new-job-btn svg { width:18px; height:18px; }
#d-orders .cab-new-job-btn:hover { filter:brightness(1.08); box-shadow:0 16px 38px -10px color-mix(in srgb, var(--acc) 90%, transparent); }
#d-orders .cab-new-job-btn:active { transform:scale(.98); }

/* feature tiles → quiet graphite cards */
#d-orders .ft-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; margin-bottom:18px; }
#d-orders .ft-tile { display:flex; gap:12px; align-items:flex-start; background:var(--pn); border:1px solid var(--bdr); border-radius:12px; padding:14px 16px; cursor:pointer; box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 60%, transparent); transition:border-color .14s ease, background .14s ease; }
#d-orders .ft-tile:hover { border-color:var(--bdr-h); background:var(--pn-h); }
#d-orders .ft-icn { color:var(--acc); flex:0 0 auto; }
#d-orders .ft-icn svg { width:20px; height:20px; }
#d-orders .ft-tile h4 { color:var(--white); font-size:13.5px; font-weight:600; margin:0 0 3px; }
#d-orders .ft-tile p { color:var(--dim); font-size:12px; margin:0; line-height:1.4; }

/* view pills (Recent / Cutlist / Lookup) → macOS segmented control (override inline) */
#d-orders .dview-pills { display:inline-flex !important; gap:2px !important; background:var(--inp) !important; border:1px solid var(--bdr) !important; border-radius:11px !important; padding:3px !important; max-width:none !important; margin:0 0 16px !important; }
#d-orders .dview-pill { flex:0 0 auto !important; min-height:36px !important; padding:7px 16px !important; border-radius:8px !important; color:var(--dim) !important; font:600 13px var(--ff-ui) !important; background:transparent !important; border:none !important; cursor:pointer; transition:background .14s ease, color .14s ease; }
#d-orders .dview-pill:hover { color:var(--txt) !important; }
#d-orders .dview-pill.on { background:var(--pn) !important; color:var(--white) !important; box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 45%, transparent), 0 1px 3px rgba(0,0,0,.07); }
#d-orders .dview-pill .pill-count { color:var(--muted) !important; }

/* filter bar → bench inputs */
#d-orders .filter-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
#d-orders .fb-search { flex:1 1 280px; display:flex; align-items:center; gap:9px; background:var(--inp); border:1px solid var(--bdr); border-radius:11px; padding:0 13px; min-height:40px; }
#d-orders .fb-search svg { width:16px; height:16px; color:var(--muted); flex:0 0 auto; }
#d-orders .fb-search input { flex:1; background:transparent; border:none; color:var(--txt); font:14px var(--ff-ui); outline:none; }
#d-orders .fb-label { font:590 11px var(--ff-ui); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
#d-orders .filter-bar select { background:var(--inp); border:1px solid var(--bdr); color:var(--txt); border-radius:10px; min-height:40px; padding:0 12px; font:13px var(--ff-ui); cursor:pointer; }
#d-orders .filter-bar select:hover { border-color:var(--bdr-h); }
#d-orders .fb-bulk-toggle { display:inline-flex; align-items:center; gap:6px; font:600 12.5px var(--ff-ui); color:var(--dim); cursor:pointer; }

/* table → airy bench rows */
#d-orders .pn { background:var(--pn); border:1px solid var(--bdr); border-radius:14px; box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 60%, transparent), 0 16px 40px -22px color-mix(in srgb, var(--bg) 82%, transparent); margin-bottom:16px; }
#d-orders .jobs-table { width:100%; border-collapse:collapse; }
#d-orders .jobs-table thead th { font:590 11px var(--ff-ui); letter-spacing:.085em; text-transform:uppercase; color:var(--dim); text-align:left; padding:13px 16px; border-bottom:1px solid var(--bdr); white-space:nowrap; }
#d-orders .jobs-table tbody tr { border-bottom:1px solid color-mix(in srgb, var(--bdr) 55%, transparent); cursor:pointer; transition:background .16s ease; }
#d-orders .jobs-table tbody tr:hover { background:var(--pn-h); }
#d-orders .jobs-table td { padding:13px 16px; vertical-align:middle; color:var(--txt); }
#d-orders .status-pill { font:700 10px var(--ff-mono); letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:5px; white-space:nowrap; }
#d-orders .pill-st-draft { background:color-mix(in srgb, var(--muted) 20%, transparent); color:var(--dim); }
#d-orders .pill-st-cutting { background:color-mix(in srgb, var(--warn) 16%, transparent); color:var(--warn); }
#d-orders .pill-st-completed { background:color-mix(in srgb, var(--ok) 16%, transparent); color:var(--ok); }
#d-orders .pill-st-archived { background:color-mix(in srgb, var(--muted) 16%, transparent); color:var(--muted); }
#d-orders .bulk-bar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; padding:10px 14px; background:var(--pn); border:1px solid var(--bdr); border-radius:11px; }

/* door two-zone + data rail (mirrors the cabinet rail) */
#d-orders .dash-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:20px; align-items:start; }
#d-orders .bench-main { min-width:0; }
#d-orders .dash-rail { display:flex; flex-direction:column; gap:16px; position:sticky; top:14px; }
#d-orders .dash-rail .bench-block { margin:0; background:var(--pn); border:1px solid var(--bdr); border-radius:14px; padding:14px 16px; box-shadow:0 1px 2px color-mix(in srgb, var(--bg) 60%, transparent), 0 14px 34px -24px color-mix(in srgb, var(--bg) 80%, transparent); }
#d-orders .dash-rail .bench-block-head { display:flex; align-items:baseline; gap:8px; margin-bottom:11px; }
#d-orders .dash-rail .bench-label { font:590 11px var(--ff-ui); letter-spacing:.09em; text-transform:uppercase; color:var(--dim); }
#d-orders .dash-card { display:flex; flex-direction:column; gap:5px; }
#d-orders .dash-stage { display:flex; align-items:center; gap:10px; background:none; border:none; padding:4px 2px; cursor:pointer; width:100%; text-align:left; transition:opacity .12s ease; }
#d-orders .dash-stage:hover { opacity:.82; }
#d-orders .dash-stage-n { flex:0 0 74px; font:12.5px var(--ff-ui); color:var(--dim); }
#d-orders .dash-stage-bar { flex:1 1 auto; height:6px; background:var(--inp); border-radius:3px; overflow:hidden; }
#d-orders .dash-stage-bar > i { display:block; height:100%; background:var(--acc); border-radius:3px; }
#d-orders .dash-stage-v { flex:0 0 auto; font:600 13px var(--ff-mono); color:var(--white); min-width:18px; text-align:right; font-variant-numeric:tabular-nums; }
#d-orders .dash-job { display:flex; align-items:center; justify-content:space-between; gap:10px; background:none; border:none; padding:8px 2px; cursor:pointer; width:100%; text-align:left; border-bottom:1px solid color-mix(in srgb, var(--bdr) 45%, transparent); transition:color .12s ease; }
#d-orders .dash-job:last-child { border-bottom:none; }
#d-orders .dash-job:hover .dash-job-name { color:var(--acc); }
#d-orders .dash-job-name { min-width:0; font:600 13px var(--ff-ui); color:var(--txt); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#d-orders .dash-job-when { flex:0 0 auto; font:11px var(--ff-mono); color:var(--muted); }
#d-orders .dash-empty { font-size:12px; color:var(--muted); line-height:1.55; padding:2px 0; }
#d-orders .dash-rail .bench-ar { gap:9px; }
@media (max-width:1080px){ #d-orders .dash-grid { grid-template-columns:1fr; } #d-orders .dash-rail { position:static; flex-direction:row; flex-wrap:wrap; } #d-orders .dash-rail .bench-block { flex:1 1 240px; } }

@media (prefers-reduced-motion: reduce){ #cab-job *, #cab-dash *, #cutfloor-room *, #d-orders * { transition:none !important; } }
