/* MerchIQ — styled on the Art Simplify / Merch Studio design system.
   Dark + neutral base with a cyan brand accent. Tokens are the source of truth. */

:root{
  /* surfaces */
  --bg:#111315; --surface-1:#181b1e; --surface-2:#1f2327; --surface-3:#292e34;
  --stage:#0d0f11; --overlay:rgba(8,10,12,.70);
  /* borders */
  --border:#30353b; --border-strong:#454b54; --border-faint:#252a2f;
  /* text */
  --text:#f1f3f5; --text-2:#b8bec7; --text-3:#878e99; --text-on-accent:#0f1113;
  /* accent — the Merch Unlimited brand teal-cyan, on the neutral dark base.
     The values come from tokens.css so the brand is defined in ONE file. */
  --accent:var(--brand); --accent-strong:var(--brand-strong); --accent-press:var(--brand-press);
  --accent-rgb:var(--brand-rgb); --selected-bg:rgba(var(--brand-rgb),.14);
  --selected-border:#2b8f9e; --focus-ring:rgba(var(--brand-rgb),.42);
  /* semantic (neutral-tinted, used as a left rule) */
  --ok:#cfd4db; --ok-bg:rgba(207,212,219,.10); --ok-border:#3a4538;
  --warn:#c2c0b4; --warn-bg:rgba(194,192,180,.10); --warn-border:#46402c;
  --danger:#cfbcbc; --danger-bg:rgba(207,188,188,.10); --danger-border:#4a3635;
  /* Saturated status colours. The neutral --ok/--warn above are left-rule tints;
     these are the ones that actually read as green/amber on a control.
     NOTE: --status-dot-ok and --status-dot-live are two different greens for the
     same "good" meaning, inherited as-is. Unify them when the palette is next
     revisited — it is a visual decision, not a mechanical one. */
  --success:#3f7a46; --success-hover:#478a4f; --success-ink:#eafaef;
  --stock-short:#8a5818; --stock-short-ink:#fff4dc;
  --stock-out:#8a2e32; --stock-out-ink:#ffe8e8;
  --status-dot-ok:#7fae7f; --status-dot-live:#3f9a52;
  --amber:#d89b2c;
  /* Development log */
  --devlog-branch:#4da7ff; --devlog-danger-halo:rgba(238,116,111,.08);
  --devlog-brand-halo:rgba(var(--brand-rgb),.09); --devlog-brand-wash:rgba(var(--brand-rgb),.06);
  --devlog-brand-tint:rgba(var(--brand-rgb),.08); --devlog-context-tint:rgba(229,168,71,.08);
  --devlog-brief-bg:#172326; --devlog-brief-border:#2a3e40; --devlog-clear:transparent;
  /* Pure white, for surfaces that must stay white regardless of theme
     (image thumbnails, the email-preview iframe, on-accent text). */
  --white:#fff;
  /* Scrim behind modals and the nav drawer. */
  --scrim:rgba(0,0,0,.5);
  /* spacing */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px;
  /* type */
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,Menlo,"SF Mono",monospace;
  --fs-cap:11px; --fs-sm:13px; --fs-base:14px; --fs-md:15px; --fs-lg:18px; --fs-xl:21px; --fs-h1:24px; --fs-h2:28px;
  --lh-base:1.5; --fw-reg:400; --fw-med:500; --fw-semi:600; --fw-bold:700; --tracking-cap:.07em;
  /* radii / elevation / motion */
  --r-sm:6px; --r-md:10px; --r-lg:14px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(0,0,0,.34),0 10px 30px rgba(0,0,0,.08); --sh-2:0 18px 48px rgba(0,0,0,.48);
  --sh-focus:0 0 0 3px var(--focus-ring);
  --hit:40px; --hit-sm:32px; --header-h:60px; --container:1320px;
  --t-fast:120ms ease; --t:160ms ease;
}

*{box-sizing:border-box}
body{margin:0;background:
  radial-gradient(circle at 42% -20%,rgba(var(--brand-rgb),.055),transparent 34rem),
  var(--bg);color:var(--text);
  font:var(--fw-reg) var(--fs-base)/var(--lh-base) var(--font);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit}
a{color:var(--accent)}
::selection{background:rgba(var(--brand-rgb),.24);color:var(--text)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.skip-link{position:fixed;top:8px;left:12px;z-index:500;transform:translateY(-160%);
  padding:9px 13px;border-radius:var(--r-md);background:var(--accent);color:var(--text-on-accent);
  font-weight:var(--fw-semi);text-decoration:none;box-shadow:var(--sh-2);transition:transform var(--t-fast)}
.skip-link:focus{transform:translateY(0)}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Themed scrollbars — the default light OS bars read as foreign on the dark UI. Firefox uses
   scrollbar-color; WebKit gets an inset thumb. More specific rules (e.g. .tabs, which hides its
   bar) still win, so this is a safe base. */
*{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--r-pill);
  border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:var(--text-3);background-clip:content-box}
::-webkit-scrollbar-corner{background:transparent}

/* ---- top nav (pipeline tabs) ---- */
.topnav{position:sticky;top:0;z-index:130;display:flex;align-items:center;gap:var(--s-3);
  height:var(--header-h);padding:0 var(--s-6);background:rgba(24,27,30,.94);border-bottom:1px solid var(--border);
  box-shadow:0 8px 24px rgba(0,0,0,.14);backdrop-filter:blur(16px)}
.topnav .brand{display:inline-flex;align-items:center;gap:0;min-height:40px;font-size:var(--fs-lg);font-weight:var(--fw-semi);letter-spacing:-.01em;color:var(--text);text-decoration:none}
.topnav .brand span{color:var(--accent)}
.brand-mark{height:32px;width:auto;display:block;margin-right:9px}
.nav-center{display:flex;align-items:center;gap:var(--s-1);min-width:0;margin:0 auto;height:100%}
.tabs{display:flex;gap:var(--s-1);height:100%;min-width:0;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tab{position:relative;display:flex;align-items:center;gap:7px;padding:0 14px;white-space:nowrap;
  color:var(--text-2);text-decoration:none;font-size:var(--fs-base);transition:color var(--t-fast),background var(--t-fast)}
.tab-label-short{display:none}
.tab:hover{color:var(--text);background:var(--surface-2)}
.tabs .tab:focus-visible{outline-offset:-2px;border-radius:var(--r-sm);z-index:1}
.tab.is-active{color:var(--text)}
.tab.is-active::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;background:var(--accent);border-radius:3px 3px 0 0;
  box-shadow:0 0 14px rgba(var(--brand-rgb),.32)}
.badge{min-width:18px;height:18px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--surface-3);border:1px solid var(--border);border-radius:var(--r-pill);
  font:var(--fw-semi) var(--fs-cap)/1 var(--mono);color:var(--text-2)}
.tab.is-active .badge{background:var(--selected-bg);border-color:var(--selected-border);color:var(--text)}
.tab-ext{margin-left:auto;color:var(--accent);border-radius:var(--r-sm)}
.tab-ext::after{display:none}
.tab-ext:hover{background:var(--surface-2);color:var(--accent-strong)}
/* + new-quote button (icon only) + ☰ menu toggle */
.tab-new{min-width:40px;height:40px;font-size:22px;font-weight:400;line-height:1;color:var(--accent);
  padding:0 10px;border-radius:var(--r-sm);margin-right:0;
  background:none;border:none;font-family:inherit;cursor:pointer}
.tab-new::after{display:none}
.newmenu-wrap{position:relative;display:inline-flex;height:40px}
.newmenu{position:absolute;top:calc(100% + 6px);left:0;min-width:180px;z-index:210;
  background:var(--surface-1);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--sh-2);padding:4px}
.newmenu[hidden]{display:none}
.newmenu-item{display:block;text-decoration:none;color:var(--text);padding:9px 12px;
  border-radius:var(--r-sm);font-size:var(--fs-sm);font-weight:var(--fw-med)}
.newmenu-item:hover{background:var(--surface-2);color:var(--accent-strong)}
.tab-new:hover{background:var(--selected-bg);color:var(--accent-strong)}
.tab-new.is-active{background:var(--selected-bg);color:var(--accent-strong)}
.ecom-menu-wrap{position:relative;display:inline-flex;align-items:center;height:100%;margin-left:var(--s-2);padding-left:var(--s-3)}
.ecom-menu-wrap::before{content:"";position:absolute;left:0;top:17px;bottom:17px;width:2px;border-radius:var(--r-pill);
  background:linear-gradient(to bottom,var(--border-faint),var(--border-strong),var(--border-faint))}
.ecom-trigger{height:40px;margin:auto 0;padding:0 10px;border:1px solid var(--border);border-radius:var(--r-md);
  background:linear-gradient(180deg,rgba(var(--brand-rgb),.06),rgba(var(--brand-rgb),.015));cursor:pointer;font:inherit}
.ecom-trigger:hover,.ecom-trigger[aria-expanded="true"]{border-color:var(--selected-border);background:var(--selected-bg)}
.ecom-trigger.is-active{border-color:var(--selected-border);background:var(--selected-bg);color:var(--text)}
.ecom-trigger.is-active::after{display:none}
.ecom-mark{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;border:1px solid var(--selected-border);
  border-radius:5px;color:var(--accent);font:var(--fw-bold) 10px/1 var(--mono);box-shadow:inset 0 0 0 2px rgba(var(--brand-rgb),.07)}
.ecom-label{white-space:nowrap}
.ecom-caret{color:var(--text-3);font-size:15px;line-height:1;transition:transform var(--t-fast)}
.nav-drawer-btn{display:none;min-width:40px;height:40px;padding:0;align-items:center;justify-content:center;
  background:none;border:none;color:var(--text-2);cursor:pointer}
.nav-drawer-btn .icon{width:20px;height:20px}
.nav-drawer-btn[aria-expanded="true"]{color:var(--text);background:var(--selected-bg)}
.nav-scrim{display:none}
.ecom-trigger[aria-expanded="true"] .ecom-caret{transform:rotate(180deg)}
.ecom-menu{position:absolute;top:calc(100% + 7px);right:0;width:292px;z-index:210;padding:5px;
  background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.ecom-menu[hidden]{display:none}
.ecom-menu-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3);padding:8px 9px 9px;
  border-bottom:1px solid var(--border-faint);color:var(--text-2);font:var(--fw-semi) var(--fs-cap)/1.2 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.ecom-menu-head small{color:var(--text-3);font:var(--fw-reg) 10px/1.2 var(--font);letter-spacing:0;text-transform:none}
.ecom-menu-item{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:var(--s-3);padding:10px 9px;
  color:var(--text);text-decoration:none;border-radius:var(--r-md)}
.ecom-menu-item:hover,.ecom-menu-item:focus-visible{background:var(--surface-2)}
.ecom-menu-item.is-active{background:var(--selected-bg)}
.ecom-item-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;color:var(--text-2);
  border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2)}
.ecom-menu-item.is-active .ecom-item-icon{color:var(--accent);border-color:var(--selected-border)}
.ecom-item-icon .icon{width:16px;height:16px}
.ecom-menu-item strong,.ecom-menu-item small{display:block}
.ecom-menu-item strong{font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.ecom-menu-item small{margin-top:2px;color:var(--text-3);font-size:var(--fs-cap)}
.so-menu-wrap{position:relative;display:inline-flex;align-items:stretch;height:100%}
.so-trigger{min-width:28px;padding:0 6px;border:0;background:none;cursor:pointer;color:var(--text-2)}
.so-trigger:hover,.so-trigger[aria-expanded="true"]{color:var(--text);background:var(--surface-2)}
.so-caret{font-size:14px;line-height:1}
.so-menu{position:fixed;top:0;left:0;min-width:260px;z-index:230;padding:6px;
  background:var(--surface-1);border:1px solid var(--border-strong);border-radius:var(--r-md);box-shadow:var(--sh-2)}
.so-menu[hidden]{display:none}
.so-menu-item{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:10px 11px;
  color:var(--text);text-decoration:none;border-radius:var(--r-sm)}
.so-menu-item:hover,.so-menu-item:focus-visible{background:var(--surface-2)}
.so-menu-item.is-active{background:var(--selected-bg)}
.so-menu-item strong,.so-menu-item small{display:block}
.so-menu-item small{margin-top:2px;color:var(--text-3);font-size:var(--fs-cap)}
.pipeline-filters{display:flex;flex-wrap:wrap;gap:8px;padding:12px 0 4px}
.pipeline-filter{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border:1px solid var(--border);
  border-radius:var(--r-pill);color:var(--text-2);text-decoration:none;font-size:var(--fs-sm)}
.pipeline-filter:hover{border-color:var(--border-strong);color:var(--text)}
.pipeline-filter.is-active{border-color:var(--selected-border);background:var(--selected-bg);color:var(--text)}
.needs-proof-form label{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm)}
.production-job-list{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px}
.menu-toggle{font-size:17px;background:none;border:none;cursor:pointer;line-height:1}
.menu-toggle::after{display:none}
/* narrow screens: keep all 5 pipeline tabs visible by shedding the wordmark + padding */
@media (max-width:900px){
  .topnav{gap:var(--s-2);padding:0 var(--s-3)}
  .topnav .brand{min-height:44px;font-size:0;gap:0}           /* keep the logo mark, drop "MerchIQ" text */
  .tab{padding:0 9px}
  .newmenu-wrap{height:44px}
  .tab-new{min-width:44px;height:44px;padding:0;margin-right:0}
  .newmenu-item{display:flex;align-items:center;min-height:44px;box-sizing:border-box}
  .ecom-menu-wrap{height:44px;margin-left:var(--s-1);padding-left:var(--s-2)}
  .ecom-trigger{height:44px;padding:0 8px}
  .topnav .tab.bell-toggle{min-width:44px;height:44px;padding:0}
}
/* Tablet and compact-laptop widths give the pipeline its own row. This keeps every stage
   visible even when several queues have three-digit counts. */
@media (max-width:1119px){
  :root{--header-h:104px}
  body.no-pipeline-nav{--header-h:54px}
  .topnav{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto auto;grid-template-rows:54px 49px;
    align-items:center;gap:0 var(--s-2);height:var(--header-h);padding:0 var(--s-3)}
  .topnav .brand{grid-column:1;grid-row:1}
  .brand-mark{height:29px;margin-right:0}
  .nav-center{display:contents}
  .newmenu-wrap{grid-column:2;grid-row:1}
  .tabs{grid-column:1 / -1;grid-row:2;width:calc(100% + 24px);height:49px;margin-left:-12px;padding:0 12px;
    gap:0;border-top:1px solid var(--border-faint);scroll-snap-type:x proximity;scroll-padding:12px}
  .tabs .tab{min-height:48px;padding:0 10px;scroll-snap-align:start}
  .ecom-menu-wrap{grid-column:4;grid-row:1;margin:0;padding:0}
  .ecom-menu-wrap::before{display:none}
  .navright{grid-column:5;grid-row:1}
  body.no-pipeline-nav .topnav{grid-template-rows:54px}
}
/* Team chat docks at 360px on wider screens. Between 1120px and 1479px that leaves the
   application header in the same compact width range as a tablet, so preserve the dedicated
   pipeline row instead of letting the viewport-based desktop layout hide later stages. */
@media (min-width:1120px) and (max-width:1479px){
  body.chat-open{--header-h:104px}
  body.chat-open.no-pipeline-nav{--header-h:60px}
  body.chat-open .topnav{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto auto;grid-template-rows:54px 49px;
    align-items:center;gap:0 var(--s-2);height:var(--header-h);padding:0 var(--s-3)}
  body.chat-open .topnav .brand{grid-column:1;grid-row:1}
  body.chat-open .brand-mark{height:29px;margin-right:9px}
  body.chat-open .nav-center{display:contents}
  body.chat-open .newmenu-wrap{grid-column:2;grid-row:1}
  body.chat-open .tabs{grid-column:1 / -1;grid-row:2;width:calc(100% + 24px);height:49px;margin-left:-12px;padding:0 12px;
    gap:0;border-top:1px solid var(--border-faint);scroll-snap-type:x proximity;scroll-padding:12px}
  body.chat-open .tabs .tab{min-height:48px;padding:0 10px;scroll-snap-align:start}
  body.chat-open .ecom-menu-wrap{grid-column:4;grid-row:1;margin:0;padding:0}
  body.chat-open .ecom-menu-wrap::before{display:none}
  body.chat-open .navright{grid-column:5;grid-row:1}
  body.chat-open.no-pipeline-nav .topnav{grid-template-rows:60px}
}
@media (max-width:800px){
  .nav-drawer-btn{display:inline-flex;min-width:44px;height:44px}
  .ecom-trigger{gap:6px}
  .ecom-mark,.ecom-caret{display:none}
  .ecom-label{font-size:var(--fs-sm);font-weight:var(--fw-med)}
  .tabs{scrollbar-width:thin;padding-right:24px}
  .tabs::-webkit-scrollbar{display:block;height:3px}
  .tabs .tab{flex:0 0 auto}
}
@media (max-width:460px){
  .tabs .tab-label-full{display:none}
  .tabs .tab-label-short{display:inline;font-size:var(--fs-sm)}
  .ecom-trigger .badge{display:none}
  .ecom-menu{position:fixed;top:58px;left:12px;right:12px;width:auto}
}
@media (max-width:340px){
  .tabs .tab{min-width:44px;padding:0 4px}
}

/* ---- quote control bar ---- */
.topbar{padding:var(--s-3) var(--s-5);background:var(--surface-1);border-bottom:1px solid var(--border)}
/* centre the header fields to line up with the max-width content grid below (.layout) */
.topbar-inner{display:flex;gap:var(--s-5);align-items:flex-end;flex-wrap:wrap;
  max-width:var(--container);margin:0 auto}
.brand{font-size:var(--fs-lg);font-weight:var(--fw-semi);letter-spacing:-.01em;color:var(--text);align-self:center}
.brand span{color:var(--accent)}
.topbar .field{display:flex;flex-direction:column;gap:var(--s-1)}
.topbar label,.line label,.size-cell label{font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);
  text-transform:uppercase;color:var(--text-3)}
.spacer{flex:1}

/* ---- inputs / selects (design-system look) ---- */
.topbar input,.topbar select,.line input,.line select{min-height:var(--hit);padding:0 10px;
  background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);
  font-size:var(--fs-base);transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.topbar input:hover,.line input:hover,.topbar select:hover,.line select:hover{border-color:var(--border-strong)}
.topbar input:focus,.topbar select:focus,.line input:focus,.line select:focus{outline:none;
  border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.topbar input[type=text]{min-width:220px}
select{appearance:none;-webkit-appearance:none;padding-right:26px;
  background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23a8adb6' stroke-width='1.4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;cursor:pointer}
/* Shared control baseline. Several older pages only styled their form controls locally,
   allowing the browser's white defaults to leak into the dark interface. Component rules
   later in this file can still refine width and layout without re-declaring the theme. */
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
select,textarea{min-height:var(--hit);padding:9px 11px;background-color:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);font-size:var(--fs-base);
  transition:border-color var(--t-fast),background-color var(--t-fast),box-shadow var(--t-fast)}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):hover,
select:hover,textarea:hover{border-color:var(--border-strong)}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):focus,
select:focus,textarea:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
input::placeholder,textarea::placeholder{color:var(--text-3);opacity:.82}
input[type="file"]{color:var(--text-2);font-size:var(--fs-sm)}
input[type="file"]::file-selector-button{min-height:var(--hit-sm);margin-right:10px;padding:0 11px;
  border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text);
  font:var(--fw-med) var(--fs-sm)/1 var(--font);cursor:pointer}
input[type="file"]::file-selector-button:hover{background:var(--surface-3);border-color:var(--border-strong)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--accent)}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):disabled,
select:disabled,textarea:disabled{
  background-color:var(--surface-1);border-color:var(--border-faint);color:var(--text-3);
  cursor:not-allowed;opacity:.72}
/* number inputs read as plain text boxes — drop the up/down spinner arrows */
input[type=number]{-moz-appearance:textfield;appearance:textfield}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* ---- layout ---- */
.layout{display:grid;grid-template-columns:1fr 340px;gap:var(--s-5);
  max-width:var(--container);margin:0 auto;padding:var(--s-5);align-items:start}
@media (max-width:880px){.layout{grid-template-columns:1fr}}
.lines{display:flex;flex-direction:column;gap:var(--s-3)}

/* ---- line card ---- */
.line{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--s-4);display:flex;flex-direction:column;gap:var(--s-3)}
.line-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);
  padding-bottom:var(--s-3);border-bottom:1px solid var(--border-faint)}
.line-card-title{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;
  column-gap:var(--s-2);min-width:0}
.line-card-title>span{grid-row:1 / span 2;color:var(--accent);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.line-card-title>strong{overflow-wrap:anywhere;color:var(--text);font-size:var(--fs-md)}
.line-card-title>small{color:var(--text-3);font-size:var(--fs-cap)}
.line-card-actions{display:flex;flex:0 0 auto;gap:var(--s-2)}
.line--rail{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0;padding:0;
  overflow:hidden;align-items:stretch}
.line-rail{display:flex;align-items:flex-start;justify-content:center;padding:15px 0 0;
  border-right:1px solid var(--border-faint);box-shadow:inset 3px 0 0 var(--accent);
  background:color-mix(in srgb,var(--surface-2) 88%,var(--accent))}
.line-rail-num{color:var(--text-3);font:600 22px/1 var(--font);font-variant-numeric:tabular-nums;
  letter-spacing:-.03em}
.line--rail>.line-body{padding:var(--s-4);display:flex;flex-direction:column;gap:var(--s-3);min-width:0}
.line--rail .line-card-title{display:flex;flex-direction:column;gap:2px}
.line--rail .line-card-title>small{line-height:1.2}
.line--saved{gap:var(--s-3);background:color-mix(in srgb,var(--surface-1) 96%,var(--accent))}
.line--rail.line--saved{gap:0}
.saved-line-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-2)}
.saved-line-metric{display:grid;gap:5px;padding:var(--s-3);border:1px solid var(--border-faint);
  border-radius:var(--r-sm);background:var(--surface-2)}
.saved-line-metric>span{color:var(--text-3);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.saved-line-summary--apparel{display:flex;flex-direction:column;gap:var(--s-2)}
.saved-run-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  padding:var(--s-3);border:1px solid color-mix(in srgb,var(--accent) 32%,var(--border));
  border-radius:var(--r-md);background:color-mix(in srgb,var(--accent) 6%,var(--surface-2))}
.saved-run-head>div{display:grid;gap:3px}
.saved-run-head>div:last-child{text-align:right}
.saved-run-head span{color:var(--text-3);font-size:var(--fs-sm)}
.saved-run-head>div:last-child strong{color:var(--accent);font-size:var(--fs-xl)}
.saved-garment-list{display:flex;flex-direction:column;gap:var(--s-2)}
.saved-garment-row{display:grid;grid-template-columns:minmax(240px,.9fr) minmax(250px,1fr) minmax(250px,.8fr);gap:var(--s-3);
  align-items:start;padding:var(--s-3);border:1px solid var(--border-faint);border-radius:var(--r-md);background:var(--surface-1)}
.saved-garment-identity{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:var(--s-3);min-width:0}
.saved-color-swatch{position:relative;width:64px;height:64px;overflow:hidden;border:1px solid color-mix(in srgb,var(--saved-swatch) 62%,var(--border-strong));
  border-radius:var(--r-md);background:linear-gradient(135deg,rgba(255,255,255,.17),transparent 38%),var(--saved-swatch);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.1),inset 0 -10px 18px rgba(0,0,0,.14)}
.saved-color-swatch::after{content:"";position:absolute;inset:0;opacity:.22;
  background:repeating-linear-gradient(115deg,transparent 0 5px,rgba(255,255,255,.11) 6px,transparent 7px 11px)}
.saved-color-swatch.empty{border-color:var(--border-strong);background:var(--surface-2)}
.saved-color-swatch.empty::after{opacity:.35;background:linear-gradient(135deg,transparent 46%,var(--border-strong) 48%,var(--border-strong) 52%,transparent 54%)}
.saved-garment-identity>div{display:grid;gap:4px;min-width:0}
.saved-garment-identity span,.saved-garment-identity small{color:var(--text-3)}
.saved-garment-identity small{overflow-wrap:anywhere;font:var(--fs-cap)/1.4 var(--mono)}
.saved-garment-name{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-2)}
.saved-garment-name>strong{min-width:0;overflow-wrap:anywhere}
.saved-garment-name>.saved-garment-quantity{flex-shrink:0}
.saved-garment-quantity{display:inline-flex;align-items:baseline;gap:4px;min-height:29px;padding:4px 9px;
  border:1px solid color-mix(in srgb,var(--accent) 34%,var(--border));border-radius:var(--r-pill);
  background:color-mix(in srgb,var(--accent) 7%,var(--surface-2));white-space:nowrap}
.saved-garment-quantity strong{color:var(--accent-strong);font-size:var(--fs-sm)}
.saved-garment-quantity span{color:var(--text-2);font-size:var(--fs-cap)}
.saved-decoration-instructions{display:grid;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid var(--border-faint)}
.saved-decoration-instruction{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:9px;
  padding:9px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2)}
.saved-decoration-instruction .deco-summary{gap:2px}
.saved-decoration-instruction .deco-summary strong{color:var(--text-2);font-size:var(--fs-sm)}
.saved-decoration-instruction .deco-summary span{font-size:var(--fs-cap)}
.saved-decoration-instruction .deco-method-icon{width:30px;height:30px;border-radius:var(--r-sm);font-size:10px;color:var(--accent-strong)}
.saved-size-matrix{display:grid;gap:8px;min-width:0}
.saved-size-matrix-label{color:var(--text-3);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.saved-size-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(54px,1fr));gap:5px}
.saved-size-cell{display:grid;overflow:hidden;border:1px solid var(--border-faint);border-radius:var(--r-sm);text-align:center;background:var(--surface-2)}
.saved-size-cell span{padding:5px 4px;border-bottom:1px solid var(--border-faint);color:var(--text-3);font:var(--fw-bold) var(--fs-cap)/1 var(--mono)}
.saved-size-cell strong{padding:8px 4px;color:var(--text);font-size:var(--fs-md)}
.saved-size-empty{color:var(--text-3);font-size:var(--fs-sm)}
.line-head{display:flex;gap:var(--s-3);align-items:flex-end;flex-wrap:wrap}
.line .field{display:flex;flex-direction:column;gap:var(--s-1)}
.line input.desc{min-width:150px}
.grow{flex:1;min-width:140px}

.product-select{min-width:180px}
.product-fields{display:flex;gap:var(--s-3);align-items:flex-end;flex-wrap:wrap;margin-top:var(--s-2)}
.product-fields .field input{width:110px}
.garment-run-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  padding:var(--s-3);border:1px solid color-mix(in srgb,var(--accent) 34%,var(--border));
  border-radius:var(--r-md);background:color-mix(in srgb,var(--accent) 7%,var(--surface-2))}
.garment-run-head strong{display:block;color:var(--text);font-size:var(--fs-md)}
.garment-run-head p{margin:3px 0 0;color:var(--text-3);font-size:var(--fs-sm)}
.run-quantity{display:flex;align-items:baseline;gap:var(--s-2);white-space:nowrap;color:var(--text-3);font-size:var(--fs-sm)}
.run-quantity strong{color:var(--accent);font-size:var(--fs-xl)}
.garment-run-list{display:flex;flex-direction:column;gap:var(--s-2);position:relative;padding-left:16px}
.garment-run-list::before{content:"";position:absolute;left:5px;top:20px;bottom:20px;width:2px;
  border-radius:2px;background:color-mix(in srgb,var(--accent) 44%,var(--border))}
.garment-run-item{position:relative;display:flex;flex-direction:column;gap:var(--s-2);
  padding:var(--s-3);border:1px solid var(--border-faint);border-radius:var(--r-md);background:var(--surface-1)}
.garment-run-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:var(--s-4);align-items:start}
.garment-run-editor{display:flex;min-width:0;flex-direction:column;gap:var(--s-2)}
.garment-product-name{width:100%;min-width:0}
.garment-product-name-help{color:var(--text-3);font-size:var(--fs-cap);line-height:1.4}
.garment-price-ledger{overflow:hidden;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--border));
  border-radius:var(--r-md);background:color-mix(in srgb,var(--surface-2) 92%,var(--accent));box-shadow:inset 3px 0 0 color-mix(in srgb,var(--accent) 68%,transparent)}
.garment-price-ledger-kicker{display:block;padding:10px 14px;border-bottom:1px solid var(--border-faint);
  color:var(--accent);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.garment-price-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto;
  column-gap:var(--s-4);row-gap:3px;padding:13px 14px}
.garment-price-hero .garment-price-ledger-kicker{padding:0;border:0}
.garment-price-unit{color:var(--accent-strong);font-size:var(--fs-xl);line-height:1.1}
.garment-price-line-total-label{align-self:end;color:var(--text-3);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);
  letter-spacing:var(--tracking-cap);text-align:right;text-transform:uppercase}
.garment-price-line-total-amount{align-self:baseline;color:var(--text);font-size:var(--fs-md);line-height:1.1;text-align:right;white-space:nowrap}
.garment-price-unit-note{grid-column:1;color:var(--text-3);font-size:var(--fs-cap)}
.garment-price-details{border-top:1px solid var(--border-faint)}
.garment-price-details>summary{cursor:pointer;padding:10px 14px;color:var(--text-2);font-size:var(--fs-sm);list-style:none}
.garment-price-details>summary::-webkit-details-marker{display:none}
.garment-price-details>summary::after{content:"+";float:right;color:var(--accent);font:var(--fw-bold) var(--fs-md)/1 var(--mono)}
.garment-price-details[open]>summary::after{content:"−"}
.garment-price-details>summary:hover{background:color-mix(in srgb,var(--accent) 6%,transparent)}
.garment-price-details>summary:focus-visible{outline:2px solid var(--selected-border);outline-offset:-3px}
.garment-price-details-body{border-top:1px solid var(--border-faint)}
.garment-price-ledger-empty{margin:0;padding:14px;color:var(--text-3);font-size:var(--fs-sm)}
.garment-price-section{display:grid;gap:7px;padding:11px 14px;border-bottom:1px solid var(--border-faint)}
.garment-price-section:last-child{border-bottom:0}
.garment-price-section-title{color:var(--text-2);font-size:var(--fs-sm)}
.garment-price-section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.garment-price-section-heading>span{color:var(--text-3);font:var(--fs-cap)/1 var(--mono);white-space:nowrap}
.garment-price-row{display:flex;align-items:baseline;justify-content:space-between;gap:14px;color:var(--text-3);font-size:var(--fs-sm)}
.garment-price-row>.num{color:var(--text-2);text-align:right;white-space:nowrap}
.garment-price-size-label{display:flex;align-items:baseline;gap:7px;color:var(--text-2)}
.garment-price-size-label small{color:var(--text-3);font:var(--fs-cap)/1 var(--mono);white-space:nowrap}
.garment-price-row--stacked>span:first-child{display:grid;gap:2px;color:var(--text-2)}
.garment-price-row--stacked small{color:var(--text-3);font-size:var(--fs-cap)}
.garment-price-total{background:color-mix(in srgb,var(--accent) 5%,transparent)}
.garment-price-total .garment-price-row strong{color:var(--accent-strong);font-size:var(--fs-md)}
.garment-price-extended{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-top:3px;padding-top:9px;
  border-top:1px solid var(--border);color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.06em}
.garment-price-extended strong{color:var(--text);font-size:var(--fs-md);letter-spacing:0}
.garment-run-item::before{content:"";position:absolute;left:-16px;top:22px;width:10px;height:10px;
  border-radius:50%;background:var(--accent);border:2px solid var(--surface-2);box-shadow:0 0 0 2px var(--border)}
.garment-run-label{display:flex;align-items:center;justify-content:space-between;color:var(--text-3);
  font:var(--fw-semi) var(--fs-cap)/1 var(--font);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.garment-run-label strong{color:var(--text-2);font-size:var(--fs-sm);letter-spacing:0;text-transform:none}
.garment-run-actions{display:flex;align-items:center;gap:var(--s-2)}
.add-garment{align-self:flex-start;margin-left:16px}
.shared-deco-section{container:embellishments / inline-size;display:grid;gap:var(--s-3);min-width:0;
  padding-top:var(--s-4);border-top:1px solid var(--border-faint)}
.shared-deco-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap}
.shared-deco-title{display:flex;align-items:center;gap:var(--s-2)}
.shared-deco-title strong{font-size:var(--fs-md);color:var(--text)}
.shared-deco-count{display:inline-grid;place-items:center;min-width:24px;min-height:24px;padding:2px 7px;
  border-radius:var(--r-sm);background:var(--surface-3);color:var(--text-2);font:var(--fs-cap)/1 var(--mono)}
.shared-deco-quantity{padding:5px 9px;border:1px solid color-mix(in srgb,var(--accent) 25%,var(--border));
  border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 6%,var(--surface-2));
  color:var(--accent-strong);font-size:var(--fs-cap);overflow-wrap:anywhere}
@media (max-width:680px){
  .garment-run-head{align-items:flex-start;flex-direction:column}
  .run-quantity{width:100%;justify-content:space-between}
  .garment-run-list{padding-left:12px}
  .garment-run-item{padding:10px}
  .garment-price-section-heading{align-items:flex-start;flex-direction:column;gap:4px}
}
@media (max-width:980px){
  .garment-run-body{grid-template-columns:minmax(0,1fr)}
}
.sizes{display:flex;gap:6px;flex-wrap:wrap}
.size-cell{display:flex;flex-direction:column;align-items:center;gap:var(--s-1)}
.size-cell label{font-size:10px}
.size-cell input{width:52px;text-align:center;font-family:var(--mono);font-variant-numeric:tabular-nums}
.stock-tile{display:flex;align-items:center;justify-content:center;width:52px;min-height:28px;
  border-radius:var(--r-sm);font:var(--fw-semi) 12px/1 var(--mono);font-variant-numeric:tabular-nums}
.stock-tile[hidden]{display:none}
.stock-tile.ok{background:var(--success);color:var(--success-ink)}
.stock-tile.short{background:var(--stock-short);color:var(--stock-short-ink)}
.stock-tile.out{background:var(--stock-out);color:var(--stock-out-ink)}

.decos{display:grid;gap:var(--s-2);min-width:0}
.deco{min-width:0;background:var(--surface-1);border-radius:var(--r-md);border:1px solid var(--border)}
.deco-toggle{display:flex;align-items:center;gap:var(--s-3);width:100%;min-width:0;min-height:76px;
  padding:var(--s-4);border:0;border-radius:var(--r-md);background:transparent;color:var(--text);
  text-align:left;font:inherit;cursor:pointer}
.deco-toggle:hover{background:var(--surface-2)}
.deco-toggle:focus-visible{outline-offset:-3px}
.deco-toggle[aria-expanded="true"]{background:color-mix(in srgb,var(--accent) 5%,var(--surface-2));
  border-radius:var(--r-md) var(--r-md) 0 0;border-bottom:1px solid var(--border)}
.deco-method-icon{display:inline-grid;place-items:center;flex:0 0 auto;width:42px;height:42px;
  border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border));border-radius:var(--r-md);
  background:color-mix(in srgb,var(--accent) 8%,var(--surface-2));color:var(--accent-strong);
  font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.deco-summary{display:grid;flex:1;min-width:0;gap:3px;overflow-wrap:anywhere}
.deco-summary strong{font-size:var(--fs-md);font-weight:var(--fw-semi);color:var(--text)}
.deco-summary span{color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-reg)}
.deco-edit-label{flex:0 0 auto;color:var(--text-2);font-size:var(--fs-sm)}
.deco-chevron{flex:0 0 auto;width:8px;height:8px;margin:0 3px 4px 2px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);color:var(--text-2)}
.deco-toggle[aria-expanded="true"] .deco-chevron{transform:rotate(225deg);margin-top:6px}
.deco-editor{padding:var(--s-4)}
.deco-editor[hidden]{display:none}
.deco-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3)}
.deco .field{min-width:0}
.deco .field label{color:var(--text-2);font-size:var(--fs-sm)}
.deco .field select{width:100%;min-width:0;min-height:44px;font-size:var(--fs-sm)}
.deco-editor-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  flex-wrap:wrap;margin-top:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--border-faint)}
.deco-shared-note{margin:0;color:var(--text-3);font-size:var(--fs-cap)}
.deco-actions{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;margin-left:auto}
.deco-actions .btn.mini{min-height:44px}
.deco-add.btn.ghost{width:100%;min-height:44px;justify-content:center;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border));
  background:color-mix(in srgb,var(--accent) 6%,var(--surface-2));color:var(--accent-strong);font-size:var(--fs-sm)}
.deco-add.btn.ghost:hover{background:color-mix(in srgb,var(--accent) 11%,var(--surface-2));border-color:var(--accent)}
.shared-deco-section+.line-foot--save{justify-content:flex-end}
.deco-error,.line-save-error{margin:0;color:var(--danger);font-size:var(--fs-sm)}
.deco-error{margin-top:var(--s-3)}
@container embellishments (max-width:620px){
  .shared-deco-head{align-items:flex-start}
  .deco-toggle{padding:var(--s-3);gap:10px}
  .deco-method-icon{width:36px;height:36px}
  .deco-editor{padding:var(--s-3)}
  .deco-fields{grid-template-columns:minmax(0,1fr)}
  .deco-editor-foot{align-items:stretch;flex-direction:column;gap:var(--s-2)}
  .deco-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;margin:0}
  .deco-actions .btn{width:100%;padding-inline:8px;white-space:normal}
  .deco-actions .danger{grid-column:1/-1;order:2;justify-self:start;width:auto}
}

.line-foot{display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--border-faint);padding-top:var(--s-3)}
.line-foot--end{justify-content:flex-end}
.line-foot--save{gap:var(--s-3)}
.line-foot--save .line-save-error{margin-left:auto}
.foot-actions{display:flex;gap:var(--s-2)}

@media (max-width:560px){
  .line-card-head{align-items:stretch;flex-direction:column}
  .line-card-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .line-card-actions .btn.mini{width:100%;min-height:44px}
  .saved-run-head{align-items:flex-start;flex-direction:column}
  .saved-run-head>div:last-child{text-align:left}
  .saved-garment-name{align-items:flex-start;flex-direction:column;gap:3px}
  .saved-color-swatch{width:52px;height:52px}
  .saved-garment-identity>div{display:contents}
  .saved-garment-identity>.saved-color-swatch{grid-row:1 / span 2}
  .saved-garment-identity .saved-garment-name,.saved-garment-identity>div>span,.saved-garment-identity .saved-garment-style{grid-column:2}
  .saved-garment-identity .saved-decoration-instructions{grid-column:1/-1;margin-top:0}
  .garment-price-hero{column-gap:var(--s-2)}
  .garment-price-unit{font-size:var(--fs-lg)}
  .garment-price-line-total-amount{font-size:var(--fs-base)}
  .line-foot--save{align-items:stretch;flex-direction:column}
  .line-foot--save .line-save-error{margin-left:0}
  .line-foot--save>.btn{width:100%}
}

@media (max-width:820px){
  .saved-line-summary{grid-template-columns:1fr}
  .saved-garment-row{grid-template-columns:minmax(0,1fr)}
}

@media (min-width:821px) and (max-width:1180px){
  .saved-garment-row{grid-template-columns:minmax(220px,.8fr) minmax(280px,1.2fr)}
  .saved-garment-row>.garment-price-ledger{grid-column:1 / -1}
}

/* garment typeahead (design-system .dd popover) */
.dd{position:relative}
.dd .garment-input{width:100%}
.dd-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;min-width:240px;max-height:280px;overflow:auto;
  background:var(--surface-3);border:1px solid var(--border-strong);border-radius:var(--r-md);
  box-shadow:var(--sh-2);padding:4px;z-index:60}
.dd-opt{display:flex;align-items:center;gap:var(--s-2);padding:7px 9px;border-radius:var(--r-sm);cursor:pointer;font-size:var(--fs-sm)}
.dd-opt:hover{background:var(--surface-2)}
.dd-opt:focus-visible{outline:2px solid var(--selected-border);outline-offset:-2px;background:var(--surface-2)}
.dd-opt .opt-note{margin-left:auto;color:var(--text-3);font-size:var(--fs-cap);white-space:nowrap}

/* stock + substitutes */
.stock-area:empty{display:none}
.stock-area{display:flex;flex-direction:column;gap:var(--s-2);margin-top:var(--s-1)}
.stock-note{font-size:var(--fs-sm);color:var(--text-3)}
.stock-note.err{border:1px solid var(--border);border-left:3px solid var(--danger-border);
  background:var(--danger-bg);color:var(--danger);padding:var(--s-2) var(--s-3);border-radius:var(--r-sm)}
.stock-grid{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-sm)}
.stock-row{display:flex;gap:var(--s-3);align-items:baseline;padding:3px 8px;border-radius:var(--r-sm)}
.stock-row .sz{font-family:var(--mono);width:36px;color:var(--text-2)}
.stock-row.ok{color:var(--ok)}
.stock-row.short{color:var(--warn);background:var(--warn-bg)}
.subs{margin-top:var(--s-1);border-top:1px solid var(--border-faint);padding-top:var(--s-2);
  display:flex;flex-direction:column;gap:4px}
.subs-head{font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3)}
.sub-item{display:flex;align-items:center;gap:var(--s-2);font-size:var(--fs-sm);color:var(--text-2)}
.sub-swatch{width:14px;height:14px;border-radius:3px;border:1px solid rgba(0,0,0,.5);flex:0 0 auto}
.sub-item .opt-note{color:var(--text-3);font-size:var(--fs-cap)}

/* ---- buttons ---- */
.btn{display:inline-flex;align-items:center;gap:var(--s-2);min-height:var(--hit);padding:0 14px;
  border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface-2);color:var(--text);
  font:var(--fw-med) var(--fs-base)/1 var(--font);text-decoration:none;cursor:pointer;
  transition:background var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}
.btn:hover{background:var(--surface-3);border-color:var(--border-strong)}
.btn:focus-visible{outline:none;box-shadow:var(--sh-focus)}
.btn--primary{background:var(--accent);color:var(--text-on-accent);border-color:transparent;font-weight:var(--fw-semi)}
.btn--primary:hover{background:var(--accent-strong);border-color:transparent}
.btn--primary:active{background:var(--accent-press)}
.btn--secondary{background:var(--surface-2);border-color:var(--border)}
.btn.ghost{background:transparent;border-color:transparent;color:var(--text-2)}
.btn.ghost:hover{background:var(--surface-2);color:var(--text)}
.btn.mini{min-height:var(--hit-sm);padding:0 10px;font-size:var(--fs-sm)}
.btn.danger{background:transparent;border-color:transparent;color:var(--text-3)}
.btn.danger:hover{background:var(--danger-bg);color:var(--danger)}
.btn:disabled,.btn[aria-disabled="true"],
.btn:disabled:hover,.btn[aria-disabled="true"]:hover{
  background:var(--surface-2);border-color:var(--border);color:var(--text-3);
  box-shadow:none;cursor:not-allowed;filter:saturate(.35);opacity:.68}
.toolbar{display:flex;gap:var(--s-2);margin-top:var(--s-3)}

/* ---- summary panel ---- */
.summary{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:var(--s-4);position:sticky;top:calc(var(--header-h) + var(--s-5));display:flex;flex-direction:column;gap:var(--s-3)}
.summary h2{margin:0;font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase;
  color:var(--text-3);font-weight:var(--fw-semi)}
.sum-lines{display:flex;flex-direction:column;gap:var(--s-2);border-bottom:1px solid var(--border-faint);
  padding-bottom:var(--s-3);font-size:var(--fs-sm);color:var(--text-2)}
.sum-row{display:flex;justify-content:space-between;gap:var(--s-3)}
.sum-row .num{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--text)}
.sum-row.total{border-top:2px solid var(--border-strong);margin-top:var(--s-1);padding-top:var(--s-3);
  font-weight:var(--fw-semi);font-size:var(--fs-h1)}
.sum-row.total .num{color:var(--accent-strong)}
.quote-total-with-indicator{display:inline-flex;align-items:center;justify-content:flex-end;gap:9px;min-width:0;flex-wrap:wrap}
.quote-price-indicator-host:empty{display:none}
.quote-price-indicator{display:inline-flex;align-items:center;gap:7px;color:var(--text-2);font-size:var(--fs-cap);font-weight:500}
.quote-price-indicator-label{max-width:160px;line-height:1.3}
.quote-price-dot{display:inline-block;width:10px;height:10px;flex:0 0 10px;border-radius:50%;box-shadow:0 0 0 2px var(--bg)}
.quote-price-dot.is-green{background:#58ce8b}
.quote-price-dot.is-orange{background:#ffa847}
.quote-price-dot.is-red{background:#ff727a}
.quote-price-dot.is-gray{background:var(--text-3)}
@media print{.quote-price-indicator-host{display:none!important}}

/* ---- callouts / status ---- */
.warns{display:flex;flex-direction:column;gap:var(--s-2)}
.warn{border:1px solid var(--border);border-left:3px solid var(--warn-border);background:var(--warn-bg);
  color:var(--warn);border-radius:var(--r-sm);padding:var(--s-2) var(--s-3);font-size:var(--fs-sm)}
.err{border:1px solid var(--border);border-left:3px solid var(--danger-border);background:var(--danger-bg);
  color:var(--danger);border-radius:var(--r-sm);padding:var(--s-2) var(--s-3);font-size:var(--fs-sm)}
.empty{color:var(--text-3);font-style:normal;padding:var(--s-6);text-align:center;font-size:var(--fs-sm)}

.actions{border-top:1px solid var(--border-faint);padding-top:var(--s-3);display:flex;flex-direction:column;gap:var(--s-2)}
.actions .btn{width:100%;justify-content:center}
.save-status{font-size:var(--fs-sm);color:var(--text-2);min-height:16px}
.save-status b{font-family:var(--mono);color:var(--accent-strong)}
.save-status.ok{color:var(--ok)}
.save-status.deposit{border:1px solid var(--border);border-left:3px solid var(--ok-border);background:var(--ok-bg);
  color:var(--ok);padding:var(--s-2) var(--s-3);border-radius:var(--r-sm)}

/* ---- pipeline list ---- */
.pipeline{max-width:var(--container);margin:0 auto;padding:var(--s-5)}
.scroller{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.table{width:100%;border-collapse:collapse;font-size:var(--fs-base);min-width:640px}
.table thead th{text-align:left;padding:10px 14px;font-size:var(--fs-cap);font-weight:var(--fw-semi);
  letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3);
  border-bottom:1px solid var(--border);background:var(--surface-2)}
.table td{padding:11px 14px;border-bottom:1px solid var(--border-faint);color:var(--text);vertical-align:middle}
.table tbody tr:last-child td{border-bottom:none}
.table tbody tr:hover{background:var(--surface-2)}
.table td.num{font-family:var(--mono);text-align:right;font-variant-numeric:tabular-nums;color:var(--text)}
.table td.mono{font-family:var(--mono)}
.table td.mono a{color:var(--accent);text-decoration:none}
.table td.mono a:hover{text-decoration:underline}

.pill{display:inline-block;padding:2px 9px;border-radius:var(--r-pill);border:1px solid var(--border);
  background:var(--surface-2);color:var(--text-2);font-size:var(--fs-sm);text-transform:capitalize}
.pipeline-stage-row>td:first-child{border-left:3px solid var(--stage-color);padding-left:13px}
.stage-pill{background:color-mix(in srgb,var(--stage-color) 15%,var(--surface-3));
  border-color:color-mix(in srgb,var(--stage-color) 48%,var(--border));color:var(--text);
  white-space:nowrap;line-height:1.45}

/* Personal pipeline views. Tables keep exact column widths and scroll when the available
   workspace is narrower; lifecycle statuses never squeeze onto two lines. */
.pipeline-personal{display:flex;flex-direction:column;gap:var(--s-3)}
/* fulfillment tab: add-a-job action + per-row edit link */
.ff-actions{display:flex;justify-content:flex-end}
.ff-edit{margin-left:8px;font-size:var(--fs-cap);color:var(--text-3);text-decoration:none;white-space:nowrap}
.ff-edit:hover{color:var(--accent-strong);text-decoration:underline}
.pipeline-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-5);
  padding-bottom:var(--s-5);border-bottom:1px solid var(--border-faint)}
.pipeline-toolbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.pipeline-toolbar h1{margin:6px 0 5px;font-size:clamp(1.7rem,3vw,2.35rem);line-height:1.08;
  letter-spacing:-.035em;font-weight:var(--fw-semi)}
.pipeline-subtitle{max-width:76ch;margin:0;color:var(--text-3);font-size:var(--fs-base);line-height:1.55}
.pipeline-view-note{margin:7px 0 0;color:var(--text-3);font-size:var(--fs-cap)}
.pipeline-kicker{margin:0;color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.view-editor{position:relative;z-index:20}
.view-editor>summary{display:flex;align-items:center;gap:10px;min-width:170px;justify-content:space-between;
  list-style:none;cursor:pointer;user-select:none;white-space:nowrap}
.view-editor>summary::-webkit-details-marker{display:none}
.view-save-state{font-size:10px;color:var(--text-3);font-weight:var(--fw-reg)}
.view-save-state.is-saving{color:var(--warn)}
.view-save-state.is-saved{color:var(--ok)}
.view-save-state.is-error{color:var(--danger)}
.view-editor-panel{position:absolute;top:calc(100% + 8px);right:0;width:min(370px,calc(100vw - 32px));
  padding:16px;border:1px solid var(--border-strong);border-radius:var(--r-lg);background:var(--surface-1);
  box-shadow:var(--sh-2)}
.view-editor-head{padding-bottom:12px;border-bottom:1px solid var(--border-faint)}
.view-editor-head div{display:flex;flex-direction:column;gap:3px}
.view-editor-head strong{font-size:var(--fs-base)}
.view-editor-head span{color:var(--text-3);font-size:var(--fs-sm)}
.view-column-list{display:grid;grid-template-columns:1fr 1fr;gap:5px 8px;padding:12px 0}
.view-column-option{display:flex;align-items:center;min-height:34px;gap:8px;padding:5px 7px;
  border:1px solid transparent;border-radius:var(--r-sm);color:var(--text-2);font-size:var(--fs-sm);
  cursor:pointer}
.view-column-option:hover{border-color:var(--border);background:var(--surface-2);color:var(--text)}
.view-column-option input{width:15px;height:15px;margin:0;accent-color:var(--accent)}
.view-column-option small{margin-left:auto;color:var(--text-3);font-size:9px}
.view-column-option.is-locked{cursor:default;opacity:.72}
.view-column-option.is-locked:hover{border-color:transparent;background:transparent;color:var(--text-2)}
.view-editor-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:12px;
  border-top:1px solid var(--border-faint)}
.view-editor-foot>span{max-width:205px;color:var(--text-3);font-size:10px;line-height:1.35}
/* Pipeline views: full-size saved-view controls */
.pipeline-personal .view-editor>summary,
.pipeline-personal .view-editor-foot .btn,
.pipeline-personal .pipeline-guided-empty .btn{min-height:44px}
.pipeline-personal .view-column-list{row-gap:0}
.pipeline-personal .view-column-option{min-height:44px}
.personal-view-scroller{overscroll-behavior-x:contain}
.personal-view-table{table-layout:fixed}
.personal-view-table col.is-hidden{visibility:collapse;width:0!important}
.personal-view-table th,.personal-view-table td{overflow:hidden;text-overflow:ellipsis}
.personal-view-table th{position:relative;white-space:nowrap}
.personal-view-table th>span{display:block;overflow:hidden;padding-right:8px;text-overflow:ellipsis}
.personal-view-table .is-hidden{display:none}
.personal-view-table .stage-pill{display:inline-flex;max-width:none;font-size:clamp(11px,var(--fs-sm),13px)}
.fulfillment-view-intro{margin:calc(var(--s-3) * -1 + 2px) 0 0}
.pipeline-guided-empty{min-height:300px}
.job-run-summary{margin-top:3px;font-size:var(--fs-sm);line-height:1.4}
.column-resizer{position:absolute;z-index:2;top:-4px;right:-16px;bottom:-4px;width:32px;height:auto;padding:0;border:0;
  background:transparent;cursor:col-resize;touch-action:none}
.column-resizer::after{content:"";position:absolute;top:23%;bottom:23%;left:15px;width:1px;
  background:var(--border-strong);opacity:0;transition:opacity var(--t-fast),background var(--t-fast)}
.personal-view-table th:hover .column-resizer::after,.column-resizer:focus-visible::after{
  background:var(--accent);opacity:1}
.column-resizer:focus-visible{outline:1px solid var(--accent);outline-offset:-2px}
body.is-column-resizing,body.is-column-resizing *{cursor:col-resize!important;user-select:none!important}

@media(max-width:800px){
  .personal-view-scroller{overflow:visible;border:0;background:transparent}
  .personal-view-table,
  .personal-view-table[style]{width:100%!important;min-width:0!important;table-layout:auto;border-collapse:separate;border-spacing:0 10px}
  .personal-view-table colgroup,
  .personal-view-table thead{display:none}
  .personal-view-table tbody{display:flex;flex-direction:column;gap:10px}
  .personal-view-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 14px;
    padding:12px 14px;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md)}
  .personal-view-table th,.personal-view-table td{overflow:visible;text-overflow:unset;white-space:normal}
  .personal-view-table td{display:flex;flex-direction:column;gap:3px;min-width:0}
  .personal-view-table td::before{content:attr(data-label);color:var(--text-3);font:var(--fw-semi) var(--fs-cap)/1.2 var(--font);
    letter-spacing:var(--tracking-cap);text-transform:uppercase}
  .personal-view-table td[data-column=number],
  .personal-view-table td[data-column=customer]{grid-column:1 / -1}
  .personal-view-table td[data-column=number]{font-size:var(--fs-lg)}
  .personal-view-table .column-resizer{display:none}
}
@media(max-width:700px){
  .pipeline-personal{padding:var(--s-4) 12px}
  .pipeline-toolbar{align-items:stretch;flex-direction:column;gap:12px}
  .pipeline-toolbar-actions{align-items:stretch;justify-content:flex-start}
  .pipeline-toolbar-actions>.badge-mode{align-self:flex-start}
  .pipeline-toolbar-actions>.view-editor{width:100%}
  .view-editor>summary{width:100%}
  .view-editor-panel{left:0;right:auto;width:100%}
  .view-column-list{grid-template-columns:1fr}
  .personal-view-table td[data-column=number] a{display:inline-flex;align-items:center;min-height:44px}
  .column-resizer{right:-22px;width:44px}
  .column-resizer::after{left:21px}
}

/* email read-receipt badge (pipeline "Email" column) */
.seen{display:inline-block;padding:2px 9px;border-radius:var(--r-pill);border:1px solid var(--border);
  font-size:var(--fs-cap);white-space:nowrap;cursor:default}
.seen-opened{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok);font-weight:var(--fw-med)}
.seen-clicked{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok);font-weight:var(--fw-semi)}
.seen-sent{background:transparent;border-color:var(--border-faint);color:var(--text-3)}

.tags-cell{display:flex;flex-wrap:wrap;gap:5px;align-items:center;position:relative}
.tag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:var(--r-pill);
  font-size:var(--fs-cap);border:1px solid var(--border);white-space:nowrap}
.tag.auto{background:var(--selected-bg);border-color:var(--selected-border);color:var(--text)}
.tag.manual{background:transparent;color:var(--text-3);cursor:pointer}
.tag.manual:hover{border-color:var(--border-strong);color:var(--text-2)}
.tag.manual.on{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok)}
.tag-menu{display:flex;flex-wrap:wrap;gap:4px}

/* ---- nav: right side (user + sign out) ---- */
.navright{margin-left:0;display:flex;align-items:center;gap:var(--s-3);height:100%}
.navright .tab-ext{margin-left:0}
.whoami{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-sm);color:var(--text-2);white-space:nowrap}
.whoami-role{font:var(--fw-semi) var(--fs-cap)/1 var(--mono);text-transform:uppercase;letter-spacing:var(--tracking-cap);
  color:var(--text);background:var(--selected-bg);border:1px solid var(--selected-border);
  padding:2px 6px;border-radius:var(--r-pill)}
.logout-form{margin:0;display:flex}
.logout{background:transparent;border:1px solid var(--border);color:var(--text-2);
  min-height:var(--hit-sm);padding:0 10px;border-radius:var(--r-sm);cursor:pointer;font-size:var(--fs-sm);
  transition:color var(--t-fast),border-color var(--t-fast),background var(--t-fast)}
.logout:hover{color:var(--text);border-color:var(--border-strong);background:var(--surface-2)}

.muted{color:var(--text-3)}

/* ---- login ---- */
.login-body{min-height:100vh;display:grid;place-items:center;background:var(--stage);padding:var(--s-5)}
.login-body>.app-body{display:grid;place-items:center;width:100%}
.login-card{width:100%;max-width:400px;background:linear-gradient(145deg,rgba(var(--brand-rgb),.035),transparent 44%),var(--surface-1);border:1px solid var(--border);
  border-radius:var(--r-lg);box-shadow:var(--sh-2);padding:var(--s-8) var(--s-6)}
.login-brand{display:block;width:max-content;margin:0 auto;text-decoration:none}
.login-logo{display:block;height:64px;width:auto}
.login-intro{display:flex;flex-direction:column;align-items:center;margin:var(--s-4) 0 var(--s-6);text-align:center}
.login-kicker{color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.login-intro h1{margin:8px 0 5px;font-size:var(--fs-xl);letter-spacing:-.025em}
.login-sub{max-width:32ch;margin:0;color:var(--text-3);font-size:var(--fs-sm);line-height:1.5}
.login-error{margin-bottom:var(--s-4);padding:var(--s-2) var(--s-3);border-radius:var(--r-sm);
  background:var(--danger-bg);border:1px solid var(--danger-border);color:var(--danger);font-size:var(--fs-sm)}
.login-form{display:flex;flex-direction:column;gap:var(--s-4)}
.login-field{display:flex;flex-direction:column;gap:var(--s-1)}
.login-field span{font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3)}
.login-field input{min-height:var(--hit);padding:0 10px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);font-size:var(--fs-base)}
.login-field input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.login-card input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),.login-card .btn{min-height:44px}
.login-btn{justify-content:center;margin-top:var(--s-2)}
.login-assist{margin:var(--s-5) 0 0;padding-top:var(--s-4);border-top:1px solid var(--border-faint);text-align:center;color:var(--text-3);font-size:var(--fs-cap)}
.login-assist a{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);text-decoration:none}
.login-assist a:hover{text-decoration:underline}

/* ---- users / team page ---- */
.users-page{max-width:var(--container);margin:0 auto;padding:var(--s-6) var(--s-5);
  display:flex;flex-direction:column;gap:var(--s-5)}
.users-head h1{margin:0 0 var(--s-1);font-size:var(--fs-h1);font-weight:var(--fw-semi)}
.users-head p{margin:0;font-size:var(--fs-sm);max-width:60ch}
.card{background:linear-gradient(180deg,rgba(255,255,255,.012),transparent 72px),var(--surface-1);
  border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--sh-1)}
.card h2{margin:0 0 var(--s-4);font-size:var(--fs-md);font-weight:var(--fw-semi)}
.user-form{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:flex-end}
.user-form .field{display:flex;flex-direction:column;gap:var(--s-1);min-width:180px}
.user-form .field span{font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3)}
.user-form input,.user-form select{min-height:var(--hit);padding:0 10px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);font-size:var(--fs-base)}
.user-form input:focus,.user-form select:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.flash{padding:var(--s-2) var(--s-3);border-radius:var(--r-sm);font-size:var(--fs-sm)}
.flash.ok{background:var(--ok-bg);border:1px solid var(--ok-border);color:var(--ok)}
.flash.err{background:var(--danger-bg);border:1px solid var(--danger-border);color:var(--danger)}
.row-off{opacity:.55}
.you{font-size:var(--fs-cap);color:var(--text-3);border:1px solid var(--border);border-radius:var(--r-pill);padding:1px 6px;margin-left:4px}
.dot-ok,.dot-off{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;vertical-align:middle}
.dot-ok{background:var(--status-dot-ok)}
.dot-off{background:var(--text-3)}
.inline{display:inline;margin:0}
.role-blueprints{display:grid;gap:var(--s-4);padding:var(--s-5);border:1px solid var(--border);
  border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(var(--brand-rgb),.055),transparent 42%),var(--surface-1);
  box-shadow:var(--sh-1)}
.team-snapshot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--surface-1);overflow:hidden}
.team-snapshot article{display:flex;flex-direction:column;gap:4px;min-height:88px;padding:15px 18px;border-right:1px solid var(--border)}
.team-snapshot article:last-child{border-right:0}
.team-snapshot span,.team-snapshot small{color:var(--text-3);font-size:var(--fs-cap)}
.team-snapshot strong{color:var(--text);font:var(--fw-bold) var(--fs-lg)/1.2 var(--mono)}
.team-system-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
.team-system-grid .storage-status{height:100%;box-sizing:border-box;margin:0}
.role-blueprints-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-5)}
.role-blueprints-head h2{margin:4px 0 5px;font-size:var(--fs-xl)}
.role-blueprints-head p{max-width:72ch;margin:0;color:var(--text-3)}
.role-blueprints-note{max-width:270px;padding:9px 11px;border-left:2px solid var(--accent);
  background:var(--selected-bg);color:var(--text-2);font-size:var(--fs-sm);line-height:1.4}
.role-blueprint-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-2)}
.role-blueprint{position:relative;min-height:150px;padding:14px;border:1px solid var(--border-faint);
  border-radius:var(--r-md);background:var(--surface-2);overflow:hidden}
.role-blueprint::before{content:"";position:absolute;inset:0 auto 0 0;width:2px;background:var(--border-strong)}
.role-blueprint--admin::before{background:var(--accent)}
.role-blueprint--sales_rep::before{background:var(--devlog-branch)}
.role-blueprint--production::before{background:var(--amber)}
.role-blueprint--accounting::before{background:var(--status-dot-ok)}
.role-blueprint-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.role-glyph{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--border-strong);
  border-radius:var(--r-sm);color:var(--accent);font:var(--fw-bold) 10px/1 var(--mono);letter-spacing:.05em}
.role-scope{color:var(--text-3);font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.role-blueprint h3{margin:14px 0 5px;font-size:var(--fs-base)}
.role-blueprint p{margin:0;color:var(--text-3);font-size:var(--fs-sm);line-height:1.45}
.team-section-head{margin-bottom:var(--s-4)}
.team-section-head h2{margin:0 0 3px}
.team-section-head p{margin:0}
.team-directory-tools{display:flex;align-items:center;justify-content:flex-end;gap:var(--s-2);flex-wrap:wrap}
.team-search input{width:180px;min-height:34px;padding:0 10px;border:1px solid var(--border);border-radius:var(--r-sm);
  background:var(--surface-2);color:var(--text);font:inherit}
.team-search input:focus{outline:0;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.team-count{flex:0 0 auto;padding:5px 9px;border:1px solid var(--border);border-radius:var(--r-pill);
  color:var(--text-3);font-size:var(--fs-cap)}
.team-table td{vertical-align:top}
.team-member-cell strong{font-weight:var(--fw-semi)}
.team-avatar{display:inline-grid;place-items:center;width:30px;height:30px;margin-right:8px;border:1px solid var(--selected-border);
  border-radius:var(--r-sm);background:var(--selected-bg);color:var(--accent);font:var(--fw-bold) 9px/1 var(--mono);vertical-align:middle}
.team-member-copy{vertical-align:middle}
.team-email-cell{overflow-wrap:anywhere}
.team-status-cell{white-space:nowrap}
.team-signin-cell{white-space:nowrap}
.team-table .role-form select{min-width:150px}
.role-access-state{display:block;margin-top:5px;color:var(--text-3);font-size:10px}
.role-access-state.is-custom{color:var(--amber)}
.permission-trigger span{margin-left:3px;color:var(--accent);font-family:var(--mono);font-size:10px}
.team-disclosure>summary{list-style:none;cursor:pointer}
.team-disclosure>summary::-webkit-details-marker{display:none}
.team-disclosure-action{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;color:var(--accent);font-size:var(--fs-sm)}
.team-disclosure-action::after{content:"+";display:grid;place-items:center;width:22px;height:22px;border:1px solid var(--border);
  border-radius:var(--r-pill);color:var(--text-2);font:var(--fw-med) 15px/1 var(--font)}
.team-disclosure[open] .team-disclosure-action::after{content:"−"}
.team-disclosure>summary:focus-visible{outline:0;border-radius:var(--r-sm);box-shadow:var(--sh-focus)}
.team-diagnostics{padding:0}
.team-diagnostics>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding:var(--s-4) var(--s-5)}
.team-diagnostics>summary>span:first-child{display:grid;gap:3px}
.team-diagnostics>summary small{color:var(--text-3);font-weight:var(--fw-reg)}
.team-diagnostics .team-system-grid{padding:0 var(--s-5) var(--s-5)}
.role-blueprints>.role-blueprint-grid{margin-top:var(--s-1)}
.role-blueprints:not([open]){padding-block:var(--s-4)}
.role-blueprints:not([open]) .role-blueprints-head{align-items:center}
.role-blueprints:not([open]) .role-blueprints-head p{display:none}
.role-blueprints:not([open]) .role-blueprints-note{max-width:none;background:transparent}
.add-user>summary{margin:0}
.add-user[open]>summary{padding-bottom:var(--s-4);border-bottom:1px solid var(--border-faint)}
.add-user .user-form{margin-top:var(--s-4)}
.team-more{min-width:0}
.team-more>summary{list-style:none;cursor:pointer}
.team-more>summary::-webkit-details-marker{display:none}
.team-more[open]{flex-basis:100%;padding-top:var(--s-2);border-top:1px solid var(--border-faint)}
.team-more-menu{display:grid;gap:0;width:min(100%,520px);margin-left:auto;border:1px solid var(--border);
  border-radius:var(--r-sm);background:var(--surface-1);overflow:hidden;text-align:left;box-shadow:var(--sh-1)}
.team-more-action{display:flex;width:100%;align-items:center;justify-content:space-between;box-sizing:border-box;padding:10px 12px;
  border:0;border-bottom:1px solid var(--border-faint);background:transparent;color:var(--text-2);font:inherit;font-size:var(--fs-sm);
  text-align:left;cursor:pointer;list-style:none}
.team-more-action::-webkit-details-marker{display:none}
.team-more-action:hover,.team-more-action:focus-visible{background:var(--surface-2);color:var(--text)}
.team-more .pw-reset[open]{padding-bottom:var(--s-3);background:var(--surface-2)}
.team-more .pw-reset[open]>.team-more-action{color:var(--text);font-weight:var(--fw-semi)}
.team-more .pw-form{padding:0 var(--s-3)}
.team-more-status-form{margin:0}
.team-more-status-form .team-more-action{border-bottom:0;color:var(--danger)}
.users-page .btn,.users-page select,.users-page input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),.users-page .team-more-action{min-height:44px}
.team-actions-cell .pw-form .btn{min-width:44px}
.users-page input[type="file"]::file-selector-button{min-height:44px}
.users-page .dialog-close{width:44px;height:44px}
.team-empty{display:grid;place-items:center;gap:4px;min-height:150px;border:1px dashed var(--border);
  border-radius:var(--r-md);color:var(--text-3);text-align:center}
.team-empty[hidden]{display:none}
.team-empty strong{color:var(--text)}
.team-empty span{font-size:var(--fs-sm)}

/* ---- job detail page ---- */
.detail{max-width:var(--container);margin:0 auto;
  /* Generous bottom padding on purpose: with the last card flush against the
     viewport edge the page reads as cut off even though it has scrolled fully. */
  padding:var(--s-6) var(--s-5) var(--s-8);
  display:flex;flex-direction:column;gap:var(--s-5)}
.detail-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s-5);flex-wrap:wrap}
.detail-num{font-size:var(--fs-sm);color:var(--text-3)}
.detail-head h1{margin:2px 0 5px;font-size:var(--fs-h1);line-height:1.15;letter-spacing:-.025em;font-weight:var(--fw-semi)}
.detail-sub a{color:var(--accent);text-decoration:none}
.detail-status{text-align:right;display:flex;flex-direction:column;gap:var(--s-1);align-items:flex-end}
.detail-total{font-size:var(--fs-lg);font-weight:var(--fw-semi)}
.detail-tags{display:flex;gap:var(--s-1);flex-wrap:wrap}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5)}
.detail-grid .card:nth-child(1),.detail-grid .card:nth-child(2){grid-column:span 1}
@media (max-width:860px){.detail-grid{grid-template-columns:1fr}}
.workspace-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-5);
  margin-bottom:var(--s-2);padding-bottom:var(--s-5);border-bottom:1px solid var(--border-faint)}
.workspace-head-main{display:flex;flex-direction:column;gap:5px;min-width:0}
.workspace-kicker{color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono);
  letter-spacing:.1em;text-transform:uppercase}
.workspace-head h1{margin:0;font-size:clamp(1.7rem,3vw,2.35rem);line-height:1.08;
  letter-spacing:-.035em;font-weight:var(--fw-semi)}
.workspace-subtitle{max-width:74ch;margin:0;color:var(--text-3);font-size:var(--fs-base);line-height:1.55}
.workspace-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--s-2);flex-wrap:wrap}
.users-page .workspace-actions .btn{white-space:nowrap}
.guided-empty{display:grid;grid-template-columns:72px minmax(0,520px);justify-content:center;align-items:center;
  gap:var(--s-5);min-height:360px;padding:clamp(28px,7vw,72px);border:1px dashed var(--border-strong);
  border-radius:var(--r-lg);background:linear-gradient(135deg,rgba(var(--brand-rgb),.045),transparent 55%),var(--surface-1)}
.guided-empty-icon{display:grid;place-items:center;width:72px;height:72px;border:1px solid rgba(var(--brand-rgb),.34);
  border-radius:20px;background:rgba(var(--brand-rgb),.08);color:var(--accent);box-shadow:inset 0 0 24px rgba(var(--brand-rgb),.035)}
.guided-empty-icon svg{width:32px;height:32px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.guided-empty-copy{display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.guided-empty-copy h2{margin:0;font-size:1.35rem;letter-spacing:-.02em}
.guided-empty-copy p{max-width:54ch;margin:0;color:var(--text-3);line-height:1.6}
.guided-empty-copy .btn{margin-top:7px}
.section-empty{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:104px;
  padding:var(--s-4);border:1px dashed var(--border-strong);border-radius:var(--r-md);
  background:rgba(255,255,255,.012);color:var(--text-3)}
.section-empty-copy{display:flex;flex-direction:column;gap:4px}
.section-empty-copy strong{color:var(--text);font-size:var(--fs-md)}
.section-empty-copy span{max-width:64ch;line-height:1.55}
.approval-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4)}
.approval-card{min-width:0}
.approval-card h2{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}
.approval-card .table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
.approval-count{display:inline-flex;min-width:24px;height:24px;align-items:center;justify-content:center;
  border:1px solid var(--selected-border);border-radius:var(--r-pill);background:var(--selected-bg);
  color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.settings-page{max-width:1000px}
.settings-page>.card,.settings-page>.notice-block{width:100%;max-width:none!important}
.settings-page code{overflow-wrap:anywhere}
@media(max-width:640px){
  .workspace-head{align-items:stretch;flex-direction:column}
  .workspace-actions{justify-content:flex-start}
  .guided-empty{grid-template-columns:1fr;min-height:320px;text-align:center}
  .guided-empty-icon{margin:auto}
  .guided-empty-copy{align-items:center}
  .cust-filter{align-items:stretch;flex-direction:column}
  .cust-filter input{width:100%;max-width:none}
  .cust-filter .btn{justify-content:center}
  .section-empty{align-items:flex-start;flex-direction:column}
  .approval-grid{grid-template-columns:1fr}
  .approval-card .row-actions{position:sticky;right:0;z-index:1;white-space:nowrap;
    background:var(--surface-1);box-shadow:-12px 0 18px -16px rgba(0,0,0,.9)}
}
.card h2{margin:0 0 var(--s-4);font-size:var(--fs-md);font-weight:var(--fw-semi)}
.pill.sm{font-size:var(--fs-cap);padding:1px 7px}
.totals{display:flex;gap:var(--s-5);justify-content:flex-end;margin-top:var(--s-3);
  padding-top:var(--s-3);border-top:1px solid var(--border-faint);color:var(--text-2);font-size:var(--fs-sm)}
.totals .grand{color:var(--text);font-weight:var(--fw-semi)}
/* assets */
.asset-upload{display:flex;gap:var(--s-2);align-items:center;flex-wrap:wrap}
.asset-upload input[type=file]{color:var(--text-2);font-size:var(--fs-sm)}
.asset-upload select{min-height:var(--hit);padding:0 10px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm)}
.upload-hint{font-size:var(--fs-cap);margin:var(--s-2) 0 var(--s-4)}
.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--s-3)}
.asset{margin:0;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}
.asset img{width:100%;height:120px;object-fit:cover;display:block;background:var(--stage)}
.asset-file{height:120px;display:grid;place-items:center;background:var(--stage);color:var(--text-3);font-size:var(--fs-lg)}
.asset figcaption{padding:var(--s-2);display:flex;flex-direction:column;gap:4px}
.asset-name{font-size:var(--fs-cap);color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.asset-actions{display:flex;gap:var(--s-1);flex-wrap:wrap}
.btn.mini.danger{color:var(--text-3)}
.btn.mini.danger:hover{background:var(--danger-bg);color:var(--danger)}

/* proofs (staff list) */
.proof-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s-3)}
.proof{display:flex;gap:var(--s-3);padding:var(--s-3);background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-md)}
.proof-thumb{flex:0 0 auto}
.proof-thumb img,.proof-thumb .asset-file{width:76px;height:76px;border-radius:var(--r-sm);object-fit:cover}
.proof-info{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.proof-head{display:flex;align-items:center;gap:var(--s-2)}
.proof-link{font-size:var(--fs-cap);color:var(--text-3);word-break:break-all}
.proof-note{margin:4px 0;padding:6px 10px;border-left:2px solid var(--warn-border);
  background:var(--warn-bg);color:var(--text-2);font-size:var(--fs-sm)}
.ok-text{color:var(--ok)}.warn-text{color:var(--warn)}
.proof-badge-approved{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok)}
.proof-badge-changes_requested{background:var(--warn-bg);border-color:var(--warn-border);color:var(--warn)}
.proof-badge-sent{background:var(--selected-bg);border-color:var(--selected-border);color:var(--text)}

/* activity */
.activity{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:var(--fs-sm)}
.activity li{display:flex;gap:var(--s-2);align-items:baseline;flex-wrap:wrap}
.act-when{color:var(--text-3);font-size:var(--fs-cap);min-width:112px}
.act-actor{color:var(--text)}
.act-action{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi)}

/* ---- customer proof review page ---- */
.proof-body{min-height:100vh;background:var(--stage);padding:var(--s-5);color:var(--text)}
.proof-card{max-width:640px;margin:0 auto;background:var(--surface-1);border:1px solid var(--border);
  border-radius:var(--r-lg);box-shadow:var(--sh-2);padding:var(--s-6)}
.proof-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--s-5)}
.proof-top .brand{font-size:var(--fs-lg);font-weight:var(--fw-semi)}
.proof-top .brand span{color:var(--accent)}
.brand-logo{height:34px;width:auto;display:block}
.proof-card h1{margin:0 0 var(--s-2);font-size:var(--fs-h1);font-weight:var(--fw-semi);text-wrap:balance}
.proof-intro{margin:0 0 var(--s-4);font-size:var(--fs-sm)}
.proof-image{background:var(--stage);border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--s-3);text-align:center}
.proof-image img{max-width:100%;max-height:60vh;border-radius:var(--r-sm)}
.proof-actions{display:flex;flex-direction:column;gap:var(--s-3);margin-top:var(--s-5)}
/* staff proof controls on the job page (A19) — compact horizontal row */
.proof-staff-actions{display:flex;flex-wrap:wrap;align-items:center;gap:6px;
  margin-top:8px;padding-top:8px;border-top:1px solid var(--border-faint)}
.proof-staff-actions .inline{margin:0}
.btn-approve{width:100%;min-height:46px;border:none;border-radius:var(--r-md);cursor:pointer;
  background:var(--success);color:var(--success-ink);font:var(--fw-semi) var(--fs-md)/1 var(--font)}
.btn-approve:hover{background:var(--success-hover)}
.quote-decline-option{margin-top:var(--s-2);padding-top:var(--s-3);border-top:1px solid var(--border)}
.quote-decline-option summary{cursor:pointer;color:var(--text-2);font-weight:var(--fw-semi)}
.quote-decline-option p{margin:var(--s-2) 0 var(--s-3)}
.proof-changes summary{cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);padding:var(--s-2) 0}
.proof-changes textarea{width:100%;padding:10px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);font:inherit;resize:vertical}
.btn-changes{margin-top:var(--s-2);min-height:40px;padding:0 16px;border:1px solid var(--danger-border);
  border-radius:var(--r-md);cursor:pointer;background:var(--danger-bg);color:var(--danger);font-weight:var(--fw-med)}
.proof-help{text-align:center;margin-top:var(--s-4);font-size:var(--fs-sm)}
.proof-result{margin-top:var(--s-5);padding:var(--s-4);border-radius:var(--r-md);text-align:center}
.proof-result.ok{background:var(--ok-bg);border:1px solid var(--ok-border)}
.proof-result.warn{background:var(--warn-bg);border:1px solid var(--warn-border)}
.proof-result h2{margin:0 0 var(--s-2);font-size:var(--fs-lg)}

/* proof status chip (pipeline) — reuses proof-badge-* colours */
.proof-pill{display:inline-block;padding:2px 8px;border-radius:var(--r-pill);
  border:1px solid var(--border);font-size:var(--fs-cap);white-space:nowrap}
.proof-badge-draft{background:var(--surface-3);color:var(--text-2)}

/* ---- customer quote review — Option A, workspace mirror ---- */
.quote-review-body{min-height:100vh;background:
  radial-gradient(circle at 50% -18%,rgba(var(--brand-rgb),.11),transparent 38rem),var(--stage);color:var(--text)}
.quote-review-body .app-body{min-height:100vh}
.quote-review-skip{display:block}
.quote-review-shell{width:min(1380px,calc(100% - 44px));margin:0 auto;padding:26px 0 72px}
.quote-review-brandbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);margin-bottom:22px}
.quote-review-brand{display:flex;align-items:center;gap:14px}
.quote-review-brand img{display:block;width:114px;height:auto}
.quote-review-brand>span{width:1px;height:34px;background:var(--border)}
.quote-review-brand small{color:var(--text-2);font-size:var(--fs-sm)}
.quote-review-meta{display:grid;gap:2px;text-align:right;color:var(--text-2);font-size:var(--fs-sm)}
.quote-review-meta strong{color:var(--text);font-size:var(--fs-base)}
.quote-review-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--s-6);
  padding:24px 26px;border:1px solid #315067;border-radius:18px;
  background:linear-gradient(110deg,#16232e,var(--surface-1) 44%);box-shadow:var(--sh-2)}
.quote-review-eyebrow{color:var(--accent);font:var(--fw-bold) var(--fs-cap)/1.2 var(--mono);
  letter-spacing:.13em;text-transform:uppercase}
.quote-review-hero h1{margin:6px 0 4px;font-size:clamp(25px,3vw,40px);line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
.quote-review-hero p{margin:0;color:var(--text-2)}
.quote-review-hero-total{min-width:220px;text-align:right}
.quote-review-hero-total span{display:block;color:var(--text-3);font-size:var(--fs-cap);letter-spacing:.1em;text-transform:uppercase}
.quote-review-hero-total strong{display:block;margin-top:3px;color:var(--accent);font-size:clamp(30px,4vw,46px);line-height:1}
.quote-review-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:22px;margin-top:22px}
.quote-review-lines,.quote-review-summary{border:1px solid var(--border);border-radius:18px;background:var(--surface-1)}
.quote-review-section-head{display:flex;align-items:end;justify-content:space-between;gap:var(--s-5);
  padding:22px 24px 18px;border-bottom:1px solid var(--border-faint)}
.quote-review-section-head h2,.quote-review-summary h2{margin:0;font-size:20px}
.quote-review-section-head p{margin:3px 0 0;color:var(--text-3);font-size:var(--fs-sm)}
.quote-review-line{padding:20px 22px 22px}
.quote-review-line+.quote-review-line{border-top:1px solid var(--border-faint)}
.quote-review-line-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding-bottom:16px}
.quote-review-line-head div{display:grid;gap:2px}
.quote-review-line-head div>span,.quote-review-line-head>span{color:var(--text-3);font-size:var(--fs-sm)}
.quote-review-line-head div>span{font:var(--fw-reg) var(--fs-cap)/1.2 var(--mono);letter-spacing:.05em;text-transform:uppercase}
.quote-review-line-head strong{font-size:17px}
.quote-review-run{overflow:hidden;border:1px solid var(--selected-border);border-radius:14px;background:#151a1d}
.quote-review-run>header{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  padding:15px 18px;border-bottom:1px solid #225157;background:#183337}
.quote-review-run>header strong{font-size:var(--fs-md)}
.quote-review-run>header span{color:var(--accent);font-size:var(--fs-lg);font-weight:var(--fw-bold)}
.quote-review-product{display:grid;grid-template-columns:minmax(250px,.9fr) minmax(340px,1.1fr) minmax(240px,.75fr);
  align-items:stretch;gap:18px;padding:18px}
.quote-review-product+.quote-review-product{border-top:1px solid var(--border-faint)}
.quote-review-product-copy{display:grid;grid-template-columns:64px minmax(0,1fr);align-content:start;gap:0 14px;min-width:0}
.quote-review-swatch{position:relative;grid-row:1 / span 2;width:64px;height:64px;overflow:hidden;
  border:2px solid color-mix(in srgb,var(--quote-swatch,var(--selected-border)) 62%,var(--border-strong));border-radius:14px;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 42%),var(--quote-swatch,var(--surface-3));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.quote-review-swatch::after{content:"";position:absolute;inset:0;opacity:.22;
  background:repeating-linear-gradient(125deg,transparent 0 13px,rgba(255,255,255,.08) 13px 15px)}
.quote-review-swatch.is-empty{border-color:var(--border-strong);background:var(--surface-2)}
.quote-review-swatch.is-empty::after{background:linear-gradient(135deg,transparent 46%,var(--border-strong) 48%,var(--border-strong) 52%,transparent 54%)}
.quote-review-product-copy h3{margin:1px 0 2px;font-size:var(--fs-lg);line-height:1.25;overflow-wrap:anywhere}
.quote-review-product-copy p{margin:0;color:var(--text-2)}
.quote-review-qty{display:inline-flex;width:max-content;margin-top:9px;padding:3px 9px;border:1px solid var(--selected-border);
  border-radius:var(--r-pill);color:var(--accent);font-size:var(--fs-sm);font-weight:var(--fw-bold)}
.quote-review-decorations{grid-column:2;display:grid;gap:8px;margin-top:10px;padding-left:14px;border-left:3px solid var(--selected-border)}
.quote-review-decorations div{display:grid;gap:2px}
.quote-review-decorations strong{font-size:var(--fs-base)}
.quote-review-decorations span{color:var(--text-2);font-size:var(--fs-sm)}
.quote-review-sizes>span{display:block;margin-bottom:8px;color:var(--text-3);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);
  letter-spacing:.1em;text-transform:uppercase}
.quote-review-sizes>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:6px}
.quote-review-sizes>div>span{min-height:66px;overflow:hidden;border:1px solid var(--border-faint);border-radius:8px;background:var(--surface-2);text-align:center}
.quote-review-sizes small,.quote-review-sizes strong{display:block}
.quote-review-sizes small{padding:7px 3px 4px;border-bottom:1px solid var(--border-faint);color:var(--text-3);
  font:var(--fw-bold) 10px/1.2 var(--mono)}
.quote-review-sizes strong{padding-top:9px;font-size:var(--fs-md)}
.quote-review-sizes em{color:var(--text-3);font-size:var(--fs-sm);font-style:normal}
.quote-review-price{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;align-content:start;gap:var(--s-3);
  min-height:128px;overflow:hidden;border:1px solid #258b94;border-radius:12px;background:#173338}
.quote-review-price>div{display:grid;align-content:start;padding:15px 0 0 16px}
.quote-review-price>div:nth-child(2){padding:15px 16px 0 0;text-align:right}
.quote-review-price span{color:#8db9bd;font:var(--fw-bold) 10px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.quote-review-price strong{margin-top:3px;color:var(--accent);font-size:25px;line-height:1}
.quote-review-price>div:nth-child(2) strong{color:var(--text);font-size:var(--fs-lg)}
.quote-review-price p{grid-column:1 / -1;align-self:end;margin:0;padding:11px 16px;border-top:1px solid #25535a;
  color:#bdd2d4;font-size:var(--fs-cap)}
.quote-review-general-product{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(110px,.55fr));gap:var(--s-3);
  padding:18px;border:1px solid var(--border);border-radius:14px;background:#151a1d}
.quote-review-general-product>div{display:grid;align-content:start;gap:5px;padding:var(--s-3);border-left:1px solid var(--border-faint)}
.quote-review-general-product>div:first-child{border-left:0;padding-left:0}
.quote-review-general-product span{color:var(--text-3);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.quote-review-general-product strong{font-size:var(--fs-base)}
.quote-review-general-product small{color:var(--text-2)}
.quote-review-empty{margin:0;padding:var(--s-6);color:var(--text-2)}
.quote-review-summary{position:sticky;top:22px;padding:22px}
.quote-review-summary dl{display:grid;grid-template-columns:1fr auto;gap:10px 18px;margin:18px 0 0;color:var(--text-2)}
.quote-review-summary dt,.quote-review-summary dd{margin:0}
.quote-review-summary dd{text-align:right;color:var(--text)}
.quote-review-summary .quote-review-grand{margin-top:8px;padding-top:15px;border-top:1px solid var(--border);color:var(--text);font-size:19px;font-weight:var(--fw-bold)}
.quote-review-summary dd.quote-review-grand{color:var(--accent);font-size:25px}
.quote-review-approve{width:100%;min-height:50px;margin-top:22px;border:1px solid #63aa6a;border-radius:12px;
  background:var(--success);color:var(--success-ink);cursor:pointer;font-weight:var(--fw-bold)}
.quote-review-approve:hover{background:var(--success-hover)}
.quote-review-approve:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}
.quote-review-action-note,.quote-review-next-step{color:var(--text-3);font-size:var(--fs-cap);text-align:center}
.quote-review-action-note{margin:12px 0 0}
.quote-review-next-step{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--border-faint);line-height:1.55}
.quote-review-change{margin-top:8px;text-align:center}
.quote-review-change summary{min-height:40px;padding:10px;color:var(--text-2);cursor:pointer;list-style:none;text-decoration:underline}
.quote-review-change summary::-webkit-details-marker{display:none}
.quote-review-change p{margin:8px 0;color:var(--text-3);font-size:var(--fs-cap);text-align:left}
.quote-review-change form{margin-top:var(--s-3);text-align:left}
.quote-review-result{margin-top:22px;padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.quote-review-result--approved{border-color:var(--ok-border);background:var(--ok-bg)}
.quote-review-result h3{margin:0 0 var(--s-2);font-size:var(--fs-md)}
.quote-review-result p{margin:0;color:var(--text-2);font-size:var(--fs-sm)}
@media (max-width:1400px){
  .quote-review-product{grid-template-columns:minmax(230px,.8fr) minmax(280px,1.2fr)}
  .quote-review-price{grid-column:1 / -1;min-height:104px}
}
@media (max-width:980px){
  .quote-review-layout{grid-template-columns:1fr}
  .quote-review-summary{position:static}
}
@media (max-width:760px){
  .quote-review-shell{width:calc(100% - 24px);padding:14px 0 48px}
  .quote-review-brandbar{align-items:flex-start;margin-bottom:14px}
  .quote-review-brand img{width:92px}
  .quote-review-brand>span,.quote-review-brand small{display:none}
  .quote-review-hero{grid-template-columns:1fr;padding:20px}
  .quote-review-hero-total{min-width:0;text-align:left}
  .quote-review-layout{gap:12px;margin-top:12px}
  .quote-review-section-head{align-items:flex-start;padding:17px}
  .quote-review-line{padding:14px}
  .quote-review-line-head{align-items:flex-start}
  .quote-review-product{grid-template-columns:1fr;padding:14px}
  .quote-review-price{grid-column:1}
  .quote-review-general-product{grid-template-columns:1fr 1fr}
  .quote-review-general-product>div,.quote-review-general-product>div:first-child{padding:var(--s-2);border-left:0;border-top:1px solid var(--border-faint)}
  .quote-review-general-product>div:first-child{grid-column:1 / -1;border-top:0}
}
@media (max-width:520px){
  .proof-body{padding:12px}
  .proof-card{padding:18px}
  .quote-review-meta span{display:none}
  .quote-review-hero h1{font-size:25px}
  .quote-review-section-head{display:grid;gap:var(--s-3)}
  .quote-review-line-head{display:grid}
  .quote-review-line-head>span{justify-self:start}
  .quote-review-run>header{align-items:flex-start}
  .quote-review-product-copy{grid-template-columns:52px minmax(0,1fr);gap:0 12px}
  .quote-review-swatch{width:52px;height:52px;border-radius:11px}
  .quote-review-decorations{grid-column:1 / -1;margin-top:14px}
  .quote-review-sizes>div{grid-template-columns:repeat(4,minmax(45px,1fr))}
  .quote-review-price{grid-template-columns:1fr auto}
  .quote-review-price strong{font-size:21px}
  .quote-review-general-product{grid-template-columns:1fr}
  .quote-review-general-product>div:first-child{grid-column:1}
}

/* ---- job discussion (internal, team-only) ---- */
.section-tag{font:var(--fw-semi) var(--fs-cap)/1 var(--mono);text-transform:uppercase;
  letter-spacing:var(--tracking-cap);color:var(--text-3);border:1px solid var(--border);
  border-radius:var(--r-pill);padding:2px 7px;margin-left:6px;vertical-align:middle}
.comments{list-style:none;margin:0 0 var(--s-4);padding:0;display:flex;flex-direction:column;gap:var(--s-3)}
.comment{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s-3)}
.comment-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-2);margin-bottom:4px}
.comment-author{font-weight:var(--fw-semi);font-size:var(--fs-sm)}
.comment-when{font-size:var(--fs-cap)}
.comment-body{font-size:var(--fs-sm);color:var(--text-2);white-space:pre-wrap;word-break:break-word}
.comment-form{display:flex;gap:var(--s-2);align-items:flex-end}
.comment-form textarea{flex:1;padding:8px 10px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);font:inherit;resize:vertical;min-height:38px}
.comment-form textarea:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}

/* print-doc buttons on the job detail header */
.doc-actions{display:flex;gap:var(--s-1);flex-wrap:wrap;justify-content:flex-end;margin-top:var(--s-1)}

/* order notes editor (job detail) */
.notes-edit{margin-top:var(--s-1)}
.notes-edit>label{display:block;font-size:var(--fs-cap);text-transform:uppercase;
  letter-spacing:var(--tracking-cap);color:var(--text-3);margin-bottom:5px}
.notes-row{display:flex;gap:var(--s-2);align-items:flex-end}
.notes-row textarea{flex:1;padding:8px 10px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);font:inherit;resize:vertical;min-height:38px}
.notes-row textarea:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}

/* quote summary: per-line cost -> markup -> total breakdown */
.sum-line-head{font-weight:var(--fw-med)}
.sum-line-detail{margin:2px 0 9px;padding:6px 10px;background:var(--surface-2);
  border-radius:var(--r-sm);border-left:2px solid var(--accent);
  display:flex;flex-direction:column;gap:2px}
.bd-row{display:flex;justify-content:space-between;font-size:var(--fs-sm);color:var(--text-2)}
.bd-row .num{font-variant-numeric:tabular-nums;color:var(--text)}
.bd-note{font-size:var(--fs-cap);color:var(--text-3)}

/* garment thumbnails (picker dropdown + line) */
.opt-thumb{width:30px;height:30px;flex:0 0 auto;object-fit:contain;background:var(--white);border-radius:3px}
.opt-thumb.ph{background:var(--surface-2)}
.line-thumb{align-self:flex-end}
.line-thumb .opt-thumb{width:46px;height:46px}

/* ── Development log ───────────────────────────────────────────────────── */
.devdash{max-width:1240px;margin:0 auto;padding:28px var(--s-5) 52px}
.devdash-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-6);margin-bottom:var(--s-5)}
.devdash-kicker{font:var(--fw-semi) 10px/1 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:var(--accent)}
.devdash-head h1{margin:5px 0 0;font-size:30px;line-height:1.05;letter-spacing:-.04em}
.devdash-head p{margin:8px 0 0;color:var(--text-2)}
.devdash-connection{display:flex;align-items:center;gap:11px;min-width:260px;padding:11px 13px;
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.devdash-connection>span{width:9px;height:9px;flex:0 0 auto;border-radius:50%;background:var(--danger);
  box-shadow:0 0 0 5px var(--devlog-danger-halo)}
.devdash-connection.live>span{background:var(--accent);box-shadow:0 0 0 5px var(--devlog-brand-halo)}
.devdash-connection div{display:flex;flex-direction:column}
.devdash-connection b{font-size:var(--fs-sm)}
.devdash-connection small{margin-top:2px;color:var(--text-3);font-size:10px}
.devdash-status{display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;margin-bottom:var(--s-5);
  border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.devdash-status>div{display:flex;flex-direction:column;min-width:0;padding:17px 18px;border-right:1px solid var(--border-faint)}
.devdash-status>div:last-child{border-right:0}
.devdash-status span{color:var(--text-3);font-size:var(--fs-cap)}
.devdash-status strong{margin-top:6px;font:var(--fw-semi) 24px/1 var(--mono);letter-spacing:-.03em}
.devdash-status small{margin-top:6px;color:var(--text-3);font-size:10px}
.devdash-status .build-cell{background:linear-gradient(120deg,var(--devlog-brand-wash),var(--devlog-clear))}
.devdash-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;align-items:start;gap:var(--s-5)}
.devdash-toolbar{display:flex;flex-direction:column;gap:11px;margin-bottom:var(--s-4);padding:13px;
  border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.devdash-search{display:flex;align-items:center;gap:8px}
.devdash-search label{flex:1}.devdash-search input{width:100%}
.devdash-search>a{color:var(--text-3);font-size:var(--fs-sm);text-decoration:none}
.branch-filter{display:flex;align-items:center;gap:6px;overflow-x:auto;padding-bottom:1px}
.branch-filter a{flex:0 0 auto;padding:5px 9px;border:1px solid var(--devlog-clear);border-radius:var(--r-pill);
  color:var(--text-3);font:var(--fw-reg) 10px/1 var(--mono);text-decoration:none}
.branch-filter a:hover,.branch-filter a.on{border-color:var(--border-strong);background:var(--surface-2);color:var(--text)}
.branch-filter b{margin-left:4px;color:var(--accent)}
.change-stream{display:flex;flex-direction:column;gap:10px}
.change-card{display:grid;grid-template-columns:4px minmax(0,1fr);overflow:hidden;
  border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.change-rail{background:var(--surface-2)}.change-rail span{display:block;width:100%;height:42px;background:var(--devlog-branch)}
.change-card.release .change-rail span{background:var(--accent)}
.change-card.context_note .change-rail span{background:var(--amber)}
.change-card-body{min-width:0;padding:17px 18px}
.change-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.change-meta>span,.change-meta>a{font:var(--fw-semi) 9px/1 var(--mono);text-decoration:none}
.change-source{padding:4px 6px;border-radius:4px;background:var(--surface-3);color:var(--text-2);
  text-transform:uppercase;letter-spacing:.06em}
.change-branch{max-width:280px;overflow:hidden;text-overflow:ellipsis;color:var(--devlog-branch);white-space:nowrap}
.change-sha{color:var(--accent)}
.change-meta time{margin-left:auto;color:var(--text-3);font-size:10px}
.change-card h2{margin:12px 0 0;font-size:18px;line-height:1.25;letter-spacing:-.015em}
.change-details{max-width:760px;margin:7px 0 0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.55;white-space:pre-line}
.change-byline{display:flex;align-items:center;gap:7px;margin-top:13px;color:var(--text-3);font-size:10px}
.change-byline b{color:var(--text-2);font-weight:var(--fw-med)}
.change-avatar{width:20px;height:20px;display:grid;place-items:center;border:1px solid var(--border-strong);
  border-radius:50%;background:var(--surface-2);color:var(--accent);font:var(--fw-semi) 9px/1 var(--mono)}
.change-warning{display:inline-flex;align-items:center;gap:4px;margin-left:auto;color:var(--amber)}
.change-warning .icon{width:12px;height:12px}
.change-files{margin-top:13px;padding-top:11px;border-top:1px solid var(--border-faint)}
.change-files summary{display:flex;align-items:center;gap:6px;width:max-content;color:var(--text-3);
  font-size:10px;cursor:pointer;list-style:none}
.change-files summary::-webkit-details-marker{display:none}
.change-files summary::before{content:"+";width:15px;height:15px;display:grid;place-items:center;
  border:1px solid var(--border);border-radius:3px;font-family:var(--mono)}
.change-files[open] summary::before{content:"−"}.change-files summary span{color:var(--text-2)}
.change-files ul{display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;margin:10px 0 0;padding:0;list-style:none}
.change-files li{display:flex;align-items:center;min-width:0;gap:7px}
.change-files code{overflow:hidden;color:var(--text-2);font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.file-state{width:17px;height:17px;display:grid;place-items:center;flex:0 0 auto;border-radius:4px;
  background:var(--surface-3);font:var(--fw-semi) 9px/1 var(--mono);color:var(--text-3)}
.file-state.added{color:var(--success-ink);background:var(--devlog-brand-tint)}
.file-state.removed{color:var(--danger);background:var(--devlog-danger-halo)}
.file-state.context{color:var(--amber);background:var(--devlog-context-tint)}
.devdash-side{position:sticky;top:16px;display:flex;flex-direction:column;gap:var(--s-4)}
.agent-brief,.context-note,.capture-contract{border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface-1);padding:18px}
.agent-brief{background:linear-gradient(145deg,var(--devlog-brief-bg),var(--surface-1) 64%);border-color:var(--devlog-brief-border)}
.agent-brief h2,.capture-contract h2{margin:6px 0 0;font-size:18px}
.agent-brief ol{display:flex;flex-direction:column;gap:11px;margin:17px 0;padding:0;list-style:none}
.agent-brief li{display:grid;grid-template-columns:22px 1fr;gap:9px;align-items:start}
.agent-brief li>span{width:22px;height:22px;display:grid;place-items:center;border:1px solid var(--border-strong);
  border-radius:50%;color:var(--accent);font:var(--fw-semi) 9px/1 var(--mono)}
.agent-brief li p{margin:2px 0 0;color:var(--text-2);font-size:11px;line-height:1.45}
.agent-feed-link{display:flex;align-items:center;gap:9px;margin-top:15px;padding:11px;border:1px solid var(--selected-border);
  border-radius:var(--r-md);background:var(--selected-bg);color:var(--text);text-decoration:none}
.agent-feed-link>span{width:27px;height:27px;display:grid;place-items:center;border-radius:6px;
  background:var(--devlog-brand-halo);color:var(--accent)}
.agent-feed-link .icon{width:15px;height:15px}.agent-feed-link>div{display:flex;flex:1;flex-direction:column}
.agent-feed-link b{font-size:var(--fs-sm)}.agent-feed-link small{margin-top:2px;color:var(--text-3);font:9px/1 var(--mono)}
.agent-feed-link>.icon{transform:rotate(180deg);color:var(--text-3)}
.context-note{padding:0;overflow:hidden}.context-note>summary{display:flex;align-items:center;gap:9px;padding:15px 17px;cursor:pointer;list-style:none}
.context-note>summary::-webkit-details-marker{display:none}.context-note>summary>span{color:var(--amber)}
.context-note>summary .icon{width:16px;height:16px}.context-note>summary>div{display:flex;flex-direction:column}
.context-note>summary b{font-size:var(--fs-sm)}.context-note>summary small{margin-top:3px;color:var(--text-3);font-size:10px}
.context-note form{display:flex;flex-direction:column;gap:10px;padding:0 17px 17px;border-top:1px solid var(--border-faint)}
.context-note label{display:flex;flex-direction:column;gap:5px;padding-top:10px;color:var(--text-3);font-size:10px}
.context-note input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
.context-note textarea,.context-note .btn{min-height:44px;box-sizing:border-box}
.context-note textarea{resize:vertical}.capture-contract dl{margin:13px 0 0}
.capture-contract dl>div{padding:9px 0;border-bottom:1px solid var(--border-faint)}
.capture-contract dl>div:last-child{border-bottom:0}
.capture-contract dt{color:var(--text-2);font-size:11px;font-weight:var(--fw-med)}
.capture-contract dd{margin:3px 0 0;color:var(--text-3);font-size:10px;line-height:1.4}
.devdash-empty{display:flex;min-height:280px;align-items:center;justify-content:center;flex-direction:column;
  border:1px dashed var(--border);border-radius:var(--r-lg);color:var(--text-3);text-align:center}
.devdash-empty>.icon{width:28px;height:28px;color:var(--accent)}
.devdash-empty h2{margin:12px 0 0;color:var(--text);font-size:18px}.devdash-empty p{margin:6px 0 0;font-size:var(--fs-sm)}
@media(max-width:980px){
  .devdash-grid{grid-template-columns:1fr}.devdash-side{position:static;display:grid;grid-template-columns:1fr 1fr}
  .agent-brief{grid-row:span 2}
}
@media(max-width:700px){
  .devdash{padding:18px 12px 38px}.devdash-head{align-items:flex-start;flex-direction:column}
  .devdash-connection{width:100%;min-width:0}.devdash-status{grid-template-columns:1fr 1fr}
  .devdash-status>div:nth-child(2){border-right:0}.devdash-status>div:nth-child(-n+2){border-bottom:1px solid var(--border-faint)}
  .devdash-search{align-items:stretch;flex-wrap:wrap}.devdash-search label{flex:1 0 100%}
  .devdash-search input{height:44px}
  .devdash-search .btn,.devdash-search>a,.branch-filter a{min-height:44px}
  .devdash-search>a,.branch-filter a{display:inline-flex;align-items:center}
  .branch-filter a{min-width:44px;box-sizing:border-box;justify-content:center}
  .change-meta time{width:100%;margin:2px 0 0}.change-files ul{grid-template-columns:1fr}.devdash-side{display:flex}
}

/* ── Dashboard ─────────────────────────────────────────────────────────── */
.dash{max-width:1200px;margin:0 auto;padding:28px var(--s-5) 48px;
  display:flex;flex-direction:column;gap:var(--s-5)}
.dash-v2{--dash-accent:var(--brand);--dash-blue:#4da7ff;--dash-red:#ee746f;--dash-amber:#e5a847}
.dash-head{display:flex;align-items:baseline;gap:var(--s-3)}
.dash-head-v2{align-items:flex-end;justify-content:space-between;gap:var(--s-6);padding:2px 2px 6px}
.dash-head h1{margin:1px 0 0;font-size:28px;line-height:1.08;font-weight:var(--fw-semi);
  letter-spacing:-.035em}
.dash-head p{margin:7px 0 0;color:var(--text-2);font-size:var(--fs-base)}
.dash-kicker,.section-kicker{font:var(--fw-semi) 10px/1 var(--mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent)}
.dash-periods{display:flex;gap:3px;padding:3px;background:var(--surface-1);
  border:1px solid var(--border);border-radius:var(--r-md)}
.dash-period{display:flex;align-items:center;justify-content:center;min-height:30px;padding:0 11px;
  border-radius:5px;color:var(--text-3);text-decoration:none;font-size:var(--fs-sm);
  transition:background var(--t-fast),color var(--t-fast)}
.dash-period:hover{color:var(--text);background:var(--surface-2)}
.dash-period.active{color:var(--text);background:var(--surface-3);box-shadow:var(--sh-1)}

.panel,.insight-card,.truth-section{background:var(--surface-1);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:var(--s-5)}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-4);
  margin-bottom:var(--s-4)}
.section-heading.compact{align-items:center}
.section-heading h2,.panel h2{margin:5px 0 0;font-size:var(--fs-lg);line-height:1.2;
  font-weight:var(--fw-semi);letter-spacing:-.015em}
.section-link{display:inline-flex;align-items:center;gap:3px;color:var(--text-3);
  text-decoration:none;font-size:var(--fs-sm);white-space:nowrap}
.section-link .icon{width:13px;height:13px;transform:rotate(180deg)}
.section-link:hover{color:var(--accent)}
.data-fresh{font:var(--fw-reg) var(--fs-cap)/1 var(--mono);color:var(--text-3)}

.attention-panel{overflow:hidden;background:linear-gradient(115deg,#182125 0%,var(--surface-1) 42%);
  border:1px solid #2c3b3e;border-radius:var(--r-lg);padding:var(--s-5);box-shadow:var(--sh-1)}
.attention-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  overflow:hidden;border:1px solid var(--border);border-radius:var(--r-md);background:var(--border)}
.attention-item{min-width:0;display:flex;align-items:center;gap:11px;padding:14px;
  background:var(--surface-2);color:var(--text);text-decoration:none;
  transition:background var(--t-fast)}
.attention-item:hover{background:var(--surface-3)}
.attention-icon{width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto;
  color:var(--text-3);background:var(--surface-1);border-radius:7px}
.attention-icon .icon{width:16px;height:16px}
.attention-copy{min-width:0;display:flex;flex-direction:column}
.attention-copy strong{font-size:var(--fs-base);font-weight:var(--fw-semi);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.attention-copy small{margin-top:2px;color:var(--text-3);font-size:var(--fs-cap);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.attention-go{margin-left:auto;color:var(--text-3);font-size:var(--fs-cap)}
.attention-item.priority .attention-icon{color:var(--amber);background:rgba(229,168,71,.10)}
.attention-item.critical .attention-icon{color:var(--dash-red);background:rgba(238,116,111,.11)}
.attention-item.critical .attention-copy strong{color:#f0d2d0}
.attention-foot{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:var(--s-3)}
.attention-foot a{padding:4px 9px;border-radius:var(--r-pill);background:rgba(255,255,255,.035);
  color:var(--text-3);text-decoration:none;font-size:var(--fs-cap)}
.attention-foot a:hover{color:var(--text);background:var(--surface-3)}
.attention-foot b{color:var(--text-2);font-variant-numeric:tabular-nums}

.truth-section{position:relative;overflow:hidden}
.truth-section::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:linear-gradient(90deg,var(--dash-accent),rgba(var(--brand-rgb),0))}
.truth-rail{display:grid;grid-template-columns:repeat(4,1fr);position:relative}
.truth-rail::before{content:"";position:absolute;left:6%;right:6%;top:31px;height:1px;
  background:linear-gradient(90deg,var(--accent),var(--border-strong) 62%,var(--success))}
.truth-step{position:relative;min-width:0;display:flex;flex-direction:column;padding:4px 22px 5px 0;
  color:var(--text);text-decoration:none}
.truth-step+.truth-step{padding-left:22px;border-left:1px solid var(--border-faint)}
.truth-index{position:relative;z-index:1;width:26px;height:18px;display:grid;place-items:center;
  margin-bottom:16px;border:1px solid var(--border-strong);border-radius:var(--r-pill);
  background:var(--surface-1);color:var(--text-3);font:var(--fw-semi) 9px/1 var(--mono)}
.truth-step.booked .truth-index{border-color:var(--accent-press);color:var(--accent)}
.truth-step.collected .truth-index{border-color:var(--success);color:var(--success-ink)}
.truth-label{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap);
  color:var(--text-3)}
.truth-step>strong{margin-top:5px;font:var(--fw-semi) 27px/1.1 var(--mono);
  letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.truth-step>small{margin-top:5px;color:var(--text-3);font-size:var(--fs-cap)}
.delta{font-weight:var(--fw-semi)}
.delta.up{color:var(--accent)}
.delta.down{color:var(--danger)}
.metric-note{margin:14px 0 0;padding-top:11px;border-top:1px solid var(--border-faint);
  color:var(--text-3);font-size:var(--fs-cap)}
.metric-note b{color:var(--text-2);font-weight:var(--fw-med)}

.insight-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:var(--s-5)}
.insight-card{min-width:0}
.lead-metric{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-4);
  padding:15px 16px;background:var(--surface-2);border-radius:var(--r-md)}
.lead-metric>div{display:flex;flex-direction:column}
.lead-metric span{color:var(--text-3);font-size:var(--fs-cap)}
.lead-metric strong{margin-top:3px;font:var(--fw-semi) 25px/1.1 var(--mono);letter-spacing:-.04em}
.metric-count{padding:4px 9px;border:1px solid var(--selected-border);border-radius:var(--r-pill);
  background:var(--selected-bg);color:var(--accent)!important}
.metric-list{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:16px 0 0}
.metric-list.two{grid-template-columns:repeat(3,1fr)}
.metric-list>div{min-width:0;padding:0 11px;border-left:1px solid var(--border-faint)}
.metric-list>div:first-child{padding-left:0;border-left:0}
.metric-list dt{color:var(--text-3);font-size:var(--fs-cap)}
.metric-list dd{margin:4px 0 0;font:var(--fw-semi) 20px/1.1 var(--mono);
  font-variant-numeric:tabular-nums}
.metric-list small{display:block;margin-top:4px;color:var(--text-3);font-size:10px;line-height:1.35}
.coverage-line{display:grid;grid-template-columns:auto auto;justify-content:space-between;gap:5px;
  align-items:center;margin-top:17px;color:var(--text-3);font-size:var(--fs-cap)}
.coverage-line b{color:var(--text-2);font-family:var(--mono)}
.coverage-track{grid-column:1/-1;height:4px;overflow:hidden;background:var(--surface-3);
  border-radius:var(--r-pill)}
.coverage-track i{display:block;height:100%;background:var(--accent);border-radius:inherit}
.age-bands{display:flex;flex-direction:column;gap:7px;margin-top:17px;padding-top:14px;
  border-top:1px solid var(--border-faint)}
.age-bands-head,.age-band{display:grid;grid-template-columns:86px 1fr 24px 58px;
  align-items:center;gap:8px;font-size:var(--fs-cap)}
.age-bands-head{grid-template-columns:1fr auto;color:var(--text-2)}
.age-bands-head small{color:var(--text-3)}
.age-band>span:first-child{color:var(--text-3)}
.age-band>b{text-align:right;font-family:var(--mono);font-weight:var(--fw-semi)}
.age-band>small{text-align:right;color:var(--text-3);font-variant-numeric:tabular-nums}
.age-track{height:4px;overflow:hidden;background:var(--surface-3);border-radius:var(--r-pill)}
.age-track i{display:block;height:100%;min-width:2px;background:var(--dash-blue);border-radius:inherit}

.proof-pulse{display:grid;grid-template-columns:112px 1fr;align-items:center;gap:var(--s-5);
  min-height:112px;padding:8px 4px}
.proof-ring{width:104px;height:104px;display:grid;place-content:center;text-align:center;
  border-radius:50%;border:1px solid var(--selected-border);
  box-shadow:inset 0 0 0 8px rgba(var(--brand-rgb),.035)}
.proof-ring strong{font:var(--fw-semi) 22px/1 var(--mono);color:var(--accent)}
.proof-ring span{margin-top:6px;color:var(--text-3);font-size:10px;line-height:1.25}
.proof-stat{display:flex;flex-direction:column}
.proof-stat span{color:var(--text-3);font-size:var(--fs-cap)}
.proof-stat strong{margin-top:3px;font:var(--fw-semi) 31px/1 var(--mono)}
.proof-stat small{margin-top:6px;color:var(--text-3);font-size:var(--fs-cap)}

.pipeline-panel{padding-bottom:16px}
.pipe{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s-3)}
.pipe-v2{gap:1px;overflow:hidden;border:1px solid var(--border);border-radius:var(--r-md);
  background:var(--border)}
.pipe-cell{display:block;text-align:left;padding:13px 14px;border:0;
  background:var(--surface-2);text-decoration:none}
.pipe-cell:hover{background:var(--surface-3)}
.pipe-label{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap);
  color:var(--text-3)}
.pipe-count{margin-top:9px;font:var(--fw-semi) 20px/1 var(--mono);color:var(--text);
  font-variant-numeric:tabular-nums}
.pipe-amt{margin-top:4px;font-size:var(--fs-cap);color:var(--text-3);font-variant-numeric:tabular-nums}
.pipeline-intelligence{display:grid;grid-template-columns:1.08fr .92fr;gap:var(--s-5);
  margin-top:var(--s-5);padding-top:var(--s-4);border-top:1px solid var(--border-faint)}
.subsection-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  margin-bottom:10px;font-size:var(--fs-cap)}
.subsection-head>b{font-weight:var(--fw-med);color:var(--text-2)}
.subsection-head>small{color:var(--text-3)}
.movement-grid{display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden;
  border:1px solid var(--border-faint);border-radius:var(--r-md)}
.movement-grid>div{display:grid;grid-template-columns:1fr auto;gap:4px 8px;padding:10px 11px;
  border-right:1px solid var(--border-faint);border-bottom:1px solid var(--border-faint)}
.movement-grid>div:nth-child(3n){border-right:0}
.movement-grid>div:nth-last-child(-n+3){border-bottom:0}
.movement-grid span{grid-column:1/-1;color:var(--text-3);font-size:10px}
.movement-grid b{font:var(--fw-semi) var(--fs-md)/1 var(--mono)}
.movement-grid small{align-self:end;color:var(--text-3);font-size:10px}
.stage-age-list{display:flex;flex-direction:column}
.stage-age-list>div{display:grid;grid-template-columns:1fr 42px 82px;align-items:center;
  gap:8px;padding:7px 0;border-bottom:1px solid var(--border-faint);font-size:var(--fs-cap)}
.stage-age-list>div:last-child{border-bottom:0}
.stage-age-list span{color:var(--text-2)}
.stage-age-list span small{margin-left:4px;color:var(--text-3)}
.stage-age-list b{text-align:right;font-family:var(--mono);font-weight:var(--fw-semi)}
.stage-age-list>div>small{text-align:right;color:var(--text-3)}

.dash-lower{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,.92fr) minmax(0,1.16fr);gap:var(--s-5)}
.trust-list{display:flex;flex-direction:column;gap:10px}
.trust-row{display:grid;grid-template-columns:112px 1fr 34px;align-items:center;gap:9px;
  color:var(--text-2);font-size:var(--fs-cap)}
.trust-row b{text-align:right;color:var(--text-2);font-family:var(--mono)}
.trust-track{height:4px;overflow:hidden;background:var(--surface-3);border-radius:var(--r-pill)}
.trust-track i{display:block;height:100%;border-radius:inherit}
.trust-track i.good{background:var(--accent)}
.trust-track i.warn{background:var(--dash-amber)}
.history-readiness{display:flex;flex-direction:column;gap:8px;margin-top:16px;padding-top:14px;
  border-top:1px solid var(--border-faint)}
.history-readiness>div{display:flex;align-items:flex-start;gap:8px}
.history-dot{width:7px;height:7px;flex:0 0 auto;margin-top:5px;border-radius:50%}
.history-dot.ready{background:var(--accent)}
.history-dot.partial{background:var(--dash-amber)}
.history-readiness p{display:flex;flex-direction:column;margin:0;font-size:var(--fs-cap)}
.history-readiness p b{font-weight:var(--fw-med);color:var(--text-2)}
.history-readiness p small{color:var(--text-3)}

.mini-table{width:100%;border-collapse:collapse}
.mini-table td{padding:var(--s-3) var(--s-2);border-bottom:1px solid var(--border-faint);font-size:var(--fs-base)}
.mini-table tr:last-child td{border-bottom:none}
.mini-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mini-table .strong{font-weight:var(--fw-semi);color:var(--text)}
.customer-rank .rank{width:25px;color:var(--text-3);font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.customer-rank td:nth-child(2){font-weight:var(--fw-med)}
.customer-rank td small{display:block;margin-top:2px;color:var(--text-3);font-weight:var(--fw-reg);
  font-size:10px}
.customer-pulse{display:grid;grid-template-columns:1fr 1fr;overflow:hidden;
  border:1px solid var(--border-faint);border-radius:var(--r-md)}
.customer-pulse>div{display:flex;flex-direction:column;padding:10px 11px;
  border-right:1px solid var(--border-faint);border-bottom:1px solid var(--border-faint)}
.customer-pulse>div:nth-child(2n){border-right:0}
.customer-pulse>div:nth-last-child(-n+2){border-bottom:0}
.customer-pulse span,.customer-pulse small{color:var(--text-3);font-size:10px}
.customer-pulse b{margin:4px 0 2px;font:var(--fw-semi) var(--fs-md)/1 var(--mono)}
.customer-risk-head{margin:15px 0 4px}
.customer-risk td:first-child{font-weight:var(--fw-med)}
.customer-risk td small{display:block;margin-top:2px;color:var(--text-3);font-weight:var(--fw-reg);
  font-size:10px}
.customer-risk td.num b{display:block;margin-top:2px}

.feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s-3)}
.feed li{display:flex;justify-content:space-between;gap:var(--s-3);font-size:var(--fs-sm);
  padding-bottom:var(--s-3);border-bottom:1px solid var(--border-faint)}
.feed li:last-child{border-bottom:none;padding-bottom:0}
.feed-who{font-weight:var(--fw-med);color:var(--text)}
.feed-act{color:var(--text-2)}
.feed-detail{color:var(--text-3)}
.feed-time{color:var(--text-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.feed-v2{gap:0}
.feed-v2 li{position:relative;justify-content:flex-start;gap:9px;padding:0 0 13px;border:0}
.feed-v2 li:not(:last-child)::before{content:"";position:absolute;left:3px;top:10px;bottom:0;
  width:1px;background:var(--border)}
.feed-dot{position:relative;z-index:1;width:7px;height:7px;flex:0 0 auto;margin-top:5px;
  border-radius:50%;background:var(--text-3);box-shadow:0 0 0 3px var(--surface-1)}
.feed-v2 .feed-line{min-width:0;display:flex;flex:1;flex-wrap:wrap;gap:2px 7px}
.feed-v2 .feed-line>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.feed-v2 .feed-time{margin-left:auto;font-size:10px}
.feed-v2 .mono{color:var(--accent);font-size:var(--fs-cap)}

.metric-contracts{background:var(--surface-1);border:1px solid var(--border);
  border-radius:var(--r-lg)}
.metric-contracts summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  padding:16px var(--s-5);cursor:pointer;list-style:none}
.metric-contracts summary::-webkit-details-marker{display:none}
.metric-contracts summary>span:first-child{display:flex;flex-direction:column}
.metric-contracts summary b{font-size:var(--fs-base);font-weight:var(--fw-semi)}
.metric-contracts summary small,.contract-toggle{margin-top:2px;color:var(--text-3);
  font-size:var(--fs-cap)}
.contract-toggle{margin:0;padding:4px 9px;border:1px solid var(--border);
  border-radius:var(--r-pill)}
.metric-contracts[open] .contract-toggle{color:var(--accent);border-color:var(--selected-border)}
.contract-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;padding:1px;
  border-top:1px solid var(--border);background:var(--border)}
.contract-grid article{padding:16px;background:var(--surface-1)}
.contract-grid h3{margin:0;font-size:var(--fs-base);font-weight:var(--fw-semi)}
.contract-grid p{margin:6px 0 12px;color:var(--text-2);font-size:var(--fs-sm);line-height:1.45}
.contract-grid dl{display:flex;flex-direction:column;gap:5px;margin:0}
.contract-grid dl>div{display:grid;grid-template-columns:72px 1fr;gap:8px;font-size:var(--fs-cap)}
.contract-grid dt{color:var(--text-3)}
.contract-grid dd{margin:0;color:var(--text-2)}

/* Dashboard drill-down queues keep every attention number auditable. */
.action-queue{max-width:1160px;margin:0 auto;padding:28px var(--s-5) 48px}
.queue-back{display:inline-flex;align-items:center;gap:3px;margin-bottom:18px;color:var(--text-3);
  text-decoration:none;font-size:var(--fs-sm)}
.queue-back .icon{width:14px;height:14px}
.queue-back:hover{color:var(--accent)}
.queue-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-6);
  margin-bottom:var(--s-5)}
.queue-head h1{margin:5px 0 0;font-size:28px;letter-spacing:-.035em}
.queue-head p{margin:7px 0 0;color:var(--text-2)}
.queue-summary{display:flex;gap:1px;overflow:hidden;border:1px solid var(--border);
  border-radius:var(--r-md);background:var(--border)}
.queue-summary span{display:flex;flex-direction:column;min-width:120px;padding:10px 12px;
  background:var(--surface-1);color:var(--text-3);font-size:10px}
.queue-summary b{margin-bottom:2px;color:var(--text);font:var(--fw-semi) var(--fs-md)/1 var(--mono)}
.queue-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface-1)}
.queue-table{width:100%;border-collapse:collapse;white-space:nowrap}
.queue-table th{padding:10px 12px;background:var(--surface-2);border-bottom:1px solid var(--border);
  color:var(--text-3);text-align:left;font:var(--fw-med) 10px/1 var(--sans);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.queue-table td{padding:12px;border-bottom:1px solid var(--border-faint);
  color:var(--text-2);font-size:var(--fs-sm)}
.queue-table tbody tr:last-child td{border-bottom:0}
.queue-table tbody tr:hover{background:rgba(var(--brand-rgb),.025)}
.queue-table .num{text-align:right;font-variant-numeric:tabular-nums}
.queue-number{color:var(--accent);font-weight:var(--fw-semi);text-decoration:none}
.queue-table td:first-child small{display:block;margin-top:3px;color:var(--text-3);
  font-size:10px;text-transform:capitalize}
.queue-action{display:inline-flex;padding:5px 9px;border:1px solid var(--selected-border);
  border-radius:var(--r-pill);background:var(--selected-bg);color:var(--accent);
  text-decoration:none;font-size:var(--fs-cap)}
.queue-action:hover{background:var(--surface-3)}
.queue-clear{display:flex;align-items:center;justify-content:center;gap:14px;min-height:240px;
  border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.queue-clear>span{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;
  background:var(--selected-bg);color:var(--accent)}
.queue-clear h2{margin:0;font-size:var(--fs-lg)}
.queue-clear p{margin:4px 0 0;color:var(--text-3);font-size:var(--fs-sm)}

@media (max-width:980px){
  .attention-grid{grid-template-columns:repeat(2,1fr)}
  .truth-step{padding-right:14px}
  .truth-step+.truth-step{padding-left:14px}
  .insight-grid{grid-template-columns:1fr}
  .pipeline-intelligence{grid-template-columns:1fr}
  .pipe{grid-template-columns:repeat(3,1fr)}
  .dash-lower{grid-template-columns:repeat(2,minmax(0,1fr))}
  .activity-panel{grid-column:1/-1}
  .queue-head{align-items:flex-start;flex-direction:column}
}
@media (max-width:640px){
  .dash{padding:18px 12px 36px;gap:14px}
  .dash-head-v2{align-items:flex-start;flex-direction:column;gap:14px}
  .dash-head h1{font-size:25px}
  .dash-periods{width:100%}
  .dash-period{flex:1}
  .dash-period,.dash .section-link,.dash .attention-foot a,.dash .cust-link{display:inline-flex;min-height:44px;align-items:center}
  .panel,.insight-card,.truth-section,.attention-panel{padding:16px}
  .attention-grid{grid-template-columns:1fr}
  .attention-item{padding:12px}
  .attention-foot{gap:4px}
  .truth-rail{grid-template-columns:1fr 1fr;gap:18px 0}
  .truth-rail::before{display:none}
  .truth-step:nth-child(3){border-left:0;padding-left:0}
  .truth-step>strong{font-size:23px}
  .metric-list{grid-template-columns:1fr 1fr;gap:16px 0}
  .metric-list>div:nth-child(3){padding-left:0;border-left:0}
  .proof-pulse{grid-template-columns:96px 1fr;gap:14px}
  .proof-ring{width:90px;height:90px}
  .pipe{grid-template-columns:repeat(2,1fr)}
  .movement-grid{grid-template-columns:repeat(2,1fr)}
  .movement-grid>div:nth-child(3n){border-right:1px solid var(--border-faint)}
  .movement-grid>div:nth-child(2n){border-right:0}
  .movement-grid>div:nth-last-child(-n+3){border-bottom:1px solid var(--border-faint)}
  .movement-grid>div:nth-last-child(-n+2){border-bottom:0}
  .dash-lower{grid-template-columns:minmax(0,1fr)}
  .activity-panel{grid-column:auto}
  .section-heading{align-items:flex-start}
  .data-fresh{display:none}
  .contract-grid{grid-template-columns:1fr}
  .action-queue{padding:18px 12px 36px}
  .queue-summary{width:100%}
  .queue-summary span{flex:1;min-width:0}
  .queue-back,.queue-number,.queue-action{display:inline-flex;min-height:44px;align-items:center}
}
/* The right rail can reduce the workspace below the viewport breakpoint. Let the dashboard
   respond to the width it actually receives so an expanded rail never leaves tablet columns
   squeezed into a phone-sized content area. The viewport rule above remains the fallback. */
@container workspace (max-width:640px){
  .pipeline-personal{padding:var(--s-4) 12px}
  .pipeline-toolbar{align-items:stretch;flex-direction:column;gap:12px}
  .pipeline-toolbar-actions>.view-editor{width:100%}
  .view-editor>summary{width:100%}
  .view-editor-panel{left:0;right:auto;width:100%}
  .view-column-list{grid-template-columns:1fr}
  .dash{padding:18px 12px 36px;gap:14px}
  .dash-head-v2{align-items:flex-start;flex-direction:column;gap:14px}
  .dash-head h1{font-size:25px}
  .dash-periods{width:100%}
  .dash-period{flex:1}
  .dash-period,.dash .section-link,.dash .attention-foot a,.dash .cust-link{display:inline-flex;min-height:44px;align-items:center}
  .panel,.insight-card,.truth-section,.attention-panel{padding:16px}
  .attention-grid{grid-template-columns:1fr}
  .attention-item{padding:12px}
  .attention-foot{gap:4px}
  .truth-rail{grid-template-columns:1fr 1fr;gap:18px 0}
  .truth-rail::before{display:none}
  .truth-step:nth-child(3){border-left:0;padding-left:0}
  .truth-step>strong{font-size:23px}
  .metric-list{grid-template-columns:1fr 1fr;gap:16px 0}
  .metric-list>div:nth-child(3){padding-left:0;border-left:0}
  .proof-pulse{grid-template-columns:96px 1fr;gap:14px}
  .proof-ring{width:90px;height:90px}
  .pipe{grid-template-columns:repeat(2,1fr)}
  .movement-grid{grid-template-columns:repeat(2,1fr)}
  .movement-grid>div:nth-child(3n){border-right:1px solid var(--border-faint)}
  .movement-grid>div:nth-child(2n){border-right:0}
  .movement-grid>div:nth-last-child(-n+3){border-bottom:1px solid var(--border-faint)}
  .movement-grid>div:nth-last-child(-n+2){border-bottom:0}
  .dash-lower{grid-template-columns:minmax(0,1fr)}
  .activity-panel{grid-column:auto}
  .section-heading{align-items:flex-start}
  .data-fresh{display:none}
  .contract-grid{grid-template-columns:1fr}
  .queue-back,.queue-number,.queue-action{display:inline-flex;min-height:44px;align-items:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;
    animation-iteration-count:1!important;transition-duration:.01ms!important}
  .auto-disclosure-chevron{transition:none}
}

/* ── Production schedule ────────────────────────────────────────────────── */
.sched{max-width:1120px;margin:0 auto;padding:var(--s-6) var(--s-5);
  display:flex;flex-direction:column;gap:var(--s-5)}
/* Schedule: full-size empty-state action */
.schedule-page>.guided-empty .btn{min-height:44px}
.sched-head h1{margin:0 0 var(--s-1);font-size:var(--fs-h1);font-weight:var(--fw-semi);letter-spacing:-.01em}
.sched-groups{display:flex;flex-direction:column;gap:var(--s-5)}
.sched-summary{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-2)}
.sched-summary-item{position:relative;display:flex;align-items:baseline;gap:var(--s-2);min-width:0;
  padding:var(--s-3);background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md);
  overflow:hidden;color:inherit;text-decoration:none;
  transition:border-color var(--t-fast),background var(--t-fast),transform var(--t-fast)}
.sched-summary-item:not(.is-empty):hover{border-color:var(--border-strong);background:var(--surface-2);transform:translateY(-1px)}
.sched-summary-item:not(.is-empty):focus-visible{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.sched-summary-item::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--border-strong)}
.sched-summary-item.is-overdue::before{background:var(--danger)}
.sched-summary-item.is-today::before{background:var(--accent)}
.sched-summary-item strong{font-size:var(--fs-lg);font-variant-numeric:tabular-nums;color:var(--text)}
.sched-summary-item span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--text-2);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap)}
.sched-summary-item.is-empty{opacity:.54;cursor:default}
.sched-group h2{display:flex;align-items:center;gap:var(--s-2);margin:0 0 var(--s-3);
  font-size:var(--fs-md);font-weight:var(--fw-semi)}
.sched-group .grp-n{font-size:var(--fs-cap);font-weight:var(--fw-semi);color:var(--text-3);
  background:var(--surface-2);border-radius:var(--r-pill);padding:1px 8px}
.grp-overdue h2{color:var(--danger)}
.grp-today h2{color:var(--accent)}
.sched-list{display:flex;flex-direction:column;gap:var(--s-2)}

.job-card{display:flex;align-items:center;gap:var(--s-4);justify-content:space-between;
  background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--s-3) var(--s-4)}
.grp-overdue .job-card{border-left:3px solid var(--danger)}
.grp-today .job-card{border-left:3px solid var(--accent)}
.grp-unscheduled .job-card{border-left:3px solid var(--border-strong)}
.job-main{display:flex;align-items:center;gap:var(--s-3);min-width:0}
.job-no{text-decoration:none;color:var(--accent);font-size:var(--fs-sm)}
.job-cust{font-weight:var(--fw-med);color:var(--text);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;max-width:220px}
.job-meta{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;flex:1;justify-content:flex-end}
.job-pcs{font-size:var(--fs-sm);color:var(--text-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.pill.sm,.tag.sm{font-size:10px;padding:1px 7px}
.job-due{display:inline-flex;align-items:center;gap:var(--s-2);white-space:nowrap;
  font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap);color:var(--text-3)}
.job-due-control{display:grid;grid-template-columns:auto auto;align-items:center;justify-items:end;gap:3px var(--s-2);
  min-width:230px}
.job-due-status{grid-column:1/-1;min-height:1em;font-size:var(--fs-cap);line-height:1.2;color:var(--text-3);
  text-transform:none;letter-spacing:0}
.job-due-control.is-saving .job-due-status{color:var(--text-2)}
.job-due-control.is-saved .job-due-status{color:var(--accent)}
.job-due-control.is-error .job-due-status{color:var(--danger)}
.job-due-clear{border:0;background:transparent;color:var(--text-3);font:inherit;font-size:var(--fs-cap);
  padding:4px;border-radius:var(--r-sm);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.job-due-clear:hover{color:var(--text);background:var(--surface-2)}
.job-due-clear:focus-visible{outline:2px solid var(--focus);outline-offset:1px;color:var(--text)}
.job-due-clear:disabled{opacity:.5;cursor:wait}
.job-card:focus-within{border-color:var(--selected-border);box-shadow:var(--sh-focus)}

/* native date inputs, themed dark */
.schedule-page .job-card .job-due input[type=date],.rec-timeline .detail-due input[type=date]{background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);padding:5px 8px;
  min-height:44px;font:var(--fw-reg) var(--fs-sm)/1 var(--font);color-scheme:dark}
.job-due input:focus,.detail-due input:focus{outline:none;border-color:var(--selected-border);
  box-shadow:var(--sh-focus)}
input[type=date].saved{border-color:var(--accent)}
input[type=date].err{border-color:var(--danger)}
.detail-due{display:inline-flex;align-items:center;gap:var(--s-2);margin-top:var(--s-1);
  font-size:var(--fs-sm);color:var(--text-3)}
@media(max-width:640px){
  .sched{padding:var(--s-5) var(--s-5) var(--s-8);gap:var(--s-5)}
  .sched-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sched-summary-item:last-child{grid-column:1/-1}
  .job-card{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3);padding:var(--s-3)}
  .job-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;align-items:center}
  .job-no{display:inline-flex;grid-column:1;grid-row:1;align-items:center;min-height:44px}
  .job-main>.pill{grid-column:2;grid-row:1}
  .job-cust{grid-column:1/-1;grid-row:2;max-width:none;white-space:normal;font-size:var(--fs-md)}
  .job-meta{justify-content:flex-start}
  .job-due-control{width:100%;min-width:0;grid-template-columns:minmax(0,1fr) auto}
  .job-due{width:100%;justify-content:space-between;padding-top:var(--s-3);border-top:1px solid var(--border-faint)}
  .job-due input[type=date]{flex:1;max-width:190px}
}
@container workspace (max-width:640px){
  .sched{padding:var(--s-5) var(--s-5) var(--s-8);gap:var(--s-5)}
  .sched-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sched-summary-item:last-child{grid-column:1/-1}
  .job-card{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3);padding:var(--s-3)}
  .job-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;align-items:center}
  .job-no{display:inline-flex;grid-column:1;grid-row:1;align-items:center;min-height:44px}
  .job-main>.pill{grid-column:2;grid-row:1}
  .job-cust{grid-column:1/-1;grid-row:2;max-width:none;white-space:normal;font-size:var(--fs-md)}
  .job-meta{justify-content:flex-start}
  .job-due-control{width:100%;min-width:0;grid-template-columns:minmax(0,1fr) auto}
  .job-due{width:100%;justify-content:space-between;padding-top:var(--s-3);border-top:1px solid var(--border-faint)}
  .job-due input[type=date]{flex:1;max-width:190px}
}

/* Schedule: action-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .schedule-page{gap:8px;padding-top:12px}
  .schedule-page>.workspace-head{margin:0;padding:0;border-bottom:0}
  .schedule-page>.workspace-head .workspace-kicker,
  .schedule-page>.workspace-head .workspace-subtitle{display:none}
  .schedule-page>.workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .schedule-page>.guided-empty{grid-template-columns:44px minmax(0,1fr);gap:10px;min-height:0;padding:10px;text-align:left}
  .schedule-page .guided-empty-icon{width:44px;height:44px;margin:0;border-radius:13px}
  .schedule-page .guided-empty-icon svg{width:22px;height:22px}
  .schedule-page .guided-empty-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
  .schedule-page .guided-empty-copy .workspace-kicker,
  .schedule-page .guided-empty-copy>p{display:none}
  .schedule-page .guided-empty-copy h2{margin:0;font-size:1rem}
  .schedule-page .guided-empty-copy .btn{min-height:44px;margin:0;padding:9px 12px;white-space:nowrap}
  .schedule-page .sched-summary{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
  .schedule-page .sched-summary-item{min-height:54px;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:6px 8px}
  .schedule-page .sched-summary-item strong{font-size:1rem}
  .schedule-page .sched-summary-item span{width:100%;font-size:9px}
  .schedule-page .sched-groups{gap:8px}
  .schedule-page .sched-group h2{margin-bottom:6px;font-size:var(--fs-sm)}

  .pipeline-personal{gap:8px;padding:12px 12px 28px}
  .pipeline-personal>.pipeline-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding-bottom:0;border-bottom:0}
  .pipeline-personal .pipeline-kicker,
  .pipeline-personal .pipeline-subtitle,
  .pipeline-personal .pipeline-view-note{display:none}
  .pipeline-personal .pipeline-toolbar h1{margin:0;font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .pipeline-personal .pipeline-toolbar-actions{align-items:center;justify-content:flex-end}
  .pipeline-personal .view-editor>summary{min-height:44px;width:auto;min-width:0;padding:9px 12px}
  .pipeline-personal .view-editor-panel{left:auto;right:0;width:min(370px,calc(100vw - 32px))}
  .pipeline-personal>.pipeline-guided-empty{grid-template-columns:44px minmax(0,1fr);gap:10px;min-height:0;padding:10px;text-align:left}
  .pipeline-personal .guided-empty-icon{width:44px;height:44px;margin:0;border-radius:13px}
  .pipeline-personal .guided-empty-icon svg{width:22px;height:22px}
  .pipeline-personal .guided-empty-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
  .pipeline-personal .guided-empty-copy .workspace-kicker,
  .pipeline-personal .guided-empty-copy>p{display:none}
  .pipeline-personal .guided-empty-copy h2{margin:0;font-size:1rem}
  .pipeline-personal .guided-empty-copy .btn{min-height:44px;margin:0;padding:9px 12px;white-space:nowrap}
}

/* dashboard: overdue chip */
.chip.alert{border-color:var(--danger);color:var(--text)}
.chip.alert .chip-n{color:var(--danger)}

/* ── Purchasing (POs) ──────────────────────────────────────────────────── */
.pill.po-draft{border-color:var(--border-strong);color:var(--text-2)}
.pill.po-ordered{border-color:var(--accent-press);color:var(--accent);background:var(--selected-bg)}
.pill.po-received{border-color:var(--ok-border);color:var(--ok);background:var(--ok-bg)}
.pill.po-cancelled{border-color:var(--danger-border);color:var(--danger);background:var(--danger-bg)}

.po-lifecycle-rail{grid-template-columns:repeat(3,minmax(0,1fr))}
.po-next-step{grid-template-columns:minmax(140px,.45fr) minmax(280px,1.2fr) minmax(170px,.65fr) auto}
/* Purchase orders: full-size operational controls */
.po-detail-page .doc-actions .btn,
.po-detail-page .next-step-actions .btn,
.po-detail-page .po-lines-actions .btn,
.po-detail-page .po-form-actions .btn,
.po-detail-page .row-del{min-height:44px}
.po-detail-page .row-del{min-width:44px}
.po-detail-page .table.po-lines input:not([type="hidden"]),
.po-detail-page .detail-grid .po-form input:not([type="hidden"]),
.po-detail-page .detail-grid .po-form select,
.po-detail-page .detail-grid .po-form textarea{min-height:44px}
.po-detail-grid{grid-template-columns:minmax(0,1.45fr) minmax(300px,.85fr)}
.purchasing-table td.po-list-number,.purchasing-table td.po-list-order{white-space:nowrap}
.purchasing-page{max-width:1440px}
.purchasing-page .workspace-head{align-items:flex-end}
.purchasing-page .workspace-head>.btn,.purchasing-page .guided-empty-copy .btn{min-height:44px}
.purchasing-snapshot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:var(--s-4);overflow:hidden;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.purchasing-snapshot article{position:relative;display:flex;min-width:0;flex-direction:column;padding:15px 17px;border-left:1px solid var(--border)}
.purchasing-snapshot article:first-child{border-left:0}.purchasing-snapshot article.needs-attention{box-shadow:inset 0 2px 0 var(--warn)}.purchasing-snapshot article.in-transit{box-shadow:inset 0 2px 0 var(--accent)}
.purchasing-snapshot span{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.06em;text-transform:uppercase}
.purchasing-snapshot strong{margin:7px 0 3px;font:var(--fw-semi) var(--fs-xl)/1 var(--mono);color:var(--text)}
.purchasing-snapshot small{overflow:hidden;color:var(--text-3);font-size:var(--fs-cap);text-overflow:ellipsis;white-space:nowrap}
.purchasing-toolbar{display:flex;align-items:center;gap:var(--s-3);margin-bottom:var(--s-3);padding:10px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.purchasing-search{flex:1 1 260px;min-width:180px}.purchasing-search input{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.purchasing-search input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.purchasing-status-tabs{display:flex;flex:none;border:1px solid var(--border);border-radius:var(--r-pill);overflow:hidden}
.purchasing-status-tabs button{display:flex;align-items:center;gap:5px;min-height:34px;padding:0 11px;border:0;border-left:1px solid var(--border);background:transparent;color:var(--text-2);font:inherit;font-size:var(--fs-cap);cursor:pointer}
.purchasing-status-tabs button:first-child{border-left:0}.purchasing-status-tabs button:hover{color:var(--text)}.purchasing-status-tabs button.on{background:var(--accent);color:var(--white)}
.purchasing-status-tabs button span{font-family:var(--mono)}.purchasing-result-count{flex:none}
.purchasing-table tbody tr[hidden]{display:none}
.purchasing-filter-empty{display:flex;flex-direction:column;align-items:center;gap:5px;padding:38px 16px;border:1px dashed var(--border);border-radius:var(--r-md);text-align:center}
.purchasing-filter-empty[hidden]{display:none}
@container workspace (max-width:900px){.purchasing-snapshot{grid-template-columns:repeat(2,minmax(0,1fr))}.purchasing-snapshot article:nth-child(3){border-left:0;border-top:1px solid var(--border)}.purchasing-snapshot article:nth-child(4){border-top:1px solid var(--border)}.purchasing-toolbar{align-items:stretch;flex-wrap:wrap}.purchasing-search{flex-basis:100%}.purchasing-result-count{margin-left:auto}}
@container workspace (max-width:560px){.purchasing-page .workspace-head{align-items:flex-start}.purchasing-snapshot{grid-template-columns:1fr}.purchasing-snapshot article{border-top:1px solid var(--border);border-left:0}.purchasing-snapshot article:first-child{border-top:0}.purchasing-status-tabs{width:100%;overflow-x:auto;border-radius:var(--r-sm)}.purchasing-status-tabs button{flex:1 0 auto;justify-content:center}.purchasing-result-count{margin-left:0}}

/* Purchasing: actionable empty state on short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .purchasing-page{padding-top:12px}
  .purchasing-page .workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0 0 8px;padding:0;border-bottom:0}
  .purchasing-page .workspace-kicker,
  .purchasing-page .workspace-subtitle{display:none}
  .purchasing-page .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .purchasing-page .workspace-head>.btn{width:auto;min-height:44px;padding:9px 14px;white-space:nowrap}
  .purchasing-page>.guided-empty{grid-template-columns:44px minmax(0,1fr);gap:10px;min-height:0;padding:10px;text-align:left}
  .purchasing-page .guided-empty-icon{width:44px;height:44px;margin:0;border-radius:13px}
  .purchasing-page .guided-empty-icon svg{width:22px;height:22px}
  .purchasing-page .guided-empty-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}
  .purchasing-page .guided-empty-copy .workspace-kicker,
  .purchasing-page .guided-empty-copy>p{display:none}
  .purchasing-page .guided-empty-copy h2{margin:0;font-size:1rem}
  .purchasing-page .guided-empty-copy .btn{min-height:44px;margin:0;padding:9px 12px;white-space:nowrap}
}

/* Purchasing sits beside two independently expandable rails. Reflow from the
   actual workspace width so identifiers and operational totals remain scannable
   instead of wrapping each cell into a narrow table column. */
@container workspace (max-width:1100px){
  .purchasing-list{overflow:visible;border:0;background:transparent}
  .purchasing-table{display:block;min-width:0}
  .purchasing-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .purchasing-table tbody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
  .purchasing-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;
    gap:9px var(--s-3);padding:var(--s-4);border:1px solid var(--border);
    border-radius:var(--r-md);background:var(--surface-1);box-shadow:var(--sh-1)}
  .purchasing-table tbody tr:hover{background:var(--surface-2)}
  .purchasing-table tbody td{min-width:0;display:flex;align-items:baseline;justify-content:space-between;
    gap:var(--s-3);padding:0;border:0;text-align:left}
  .purchasing-table tbody td::before{content:attr(data-label);color:var(--text-3);
    font:var(--fw-semi) 10px/1.2 var(--font);letter-spacing:var(--tracking-cap);text-transform:uppercase}
  .purchasing-table tbody td.po-list-number{grid-column:1;grid-row:1;justify-content:flex-start;
    font-size:var(--fs-md);font-weight:var(--fw-semi)}
  .purchasing-table tbody td.po-list-number::before,.purchasing-table tbody td.po-list-status::before{display:none}
  .purchasing-table tbody td.po-list-status{grid-column:2;grid-row:1;justify-content:flex-end}
  .purchasing-table tbody td.po-list-supplier,.purchasing-table tbody td.po-list-customer,
  .purchasing-table tbody td.po-list-order{grid-column:1/-1}
  .purchasing-table tbody td.po-list-supplier{padding-top:9px;border-top:1px solid var(--border-faint);
    color:var(--text);font-weight:var(--fw-semi)}
  .purchasing-table tbody td.po-list-lines,.purchasing-table tbody td.po-list-cost,
  .purchasing-table tbody td.po-list-created{grid-column:1}
  .purchasing-table tbody td.po-list-units,.purchasing-table tbody td.po-list-owner{grid-column:2}
  .purchasing-table tbody td.po-list-cost{color:var(--text);font-weight:var(--fw-semi)}
  .purchasing-table tbody td.po-list-created,.purchasing-table tbody td.po-list-owner{padding-top:9px;
    border-top:1px solid var(--border-faint);color:var(--text-3);font-size:var(--fs-cap)}

  .po-detail-grid{grid-template-columns:1fr}
  .po-detail-grid .card{min-width:0}
  .po-detail-grid .po-form{max-width:none}
}
@container workspace (max-width:640px){
  .purchasing-table tbody{grid-template-columns:1fr}
  .purchasing-table tbody td.po-list-lines,.purchasing-table tbody td.po-list-units,
  .purchasing-table tbody td.po-list-cost,.purchasing-table tbody td.po-list-created,
  .purchasing-table tbody td.po-list-owner{grid-column:1/-1}
}

.po-form{display:flex;flex-direction:column;gap:var(--s-3);max-width:420px}
.po-form label{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--fs-cap);
  letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3)}
.po-form input,.po-form textarea{background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;
  font:var(--fw-reg) var(--fs-base)/1.4 var(--font)}
.po-form input:focus,.po-form textarea:focus{outline:none;border-color:var(--selected-border);
  box-shadow:var(--sh-focus)}
.po-form button{align-self:flex-start}

.table.compact{min-width:0}
.table.compact td,.table.compact th{padding:7px 10px}
.table tfoot td{padding:9px 10px;border-top:1px solid var(--border);font-variant-numeric:tabular-nums}
.table td.strong,.mini-table td.strong{font-weight:var(--fw-semi);color:var(--text)}

.po-strip{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;margin:var(--s-3) 0}
.po-strip-label{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap);
  color:var(--text-3)}
.po-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:var(--r-pill);
  border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);
  font-size:var(--fs-sm);text-decoration:none}
.po-chip:hover{border-color:var(--border-strong);color:var(--text)}
.po-chip.po-ordered{border-color:var(--accent-press)}
.po-chip.po-received{border-color:var(--ok-border)}
.po-chip.po-cancelled{border-color:var(--danger-border)}

/* editable PO lines + $0-cost flag (A9) */
.flash.warn{background:var(--warn-bg);border:1px solid var(--warn-border);color:var(--warn)}
.po-lines input{width:100%;min-width:56px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:5px 7px;
  font:var(--fw-reg) var(--fs-sm)/1.3 var(--font)}
.po-lines input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.po-lines td:nth-child(1) input{min-width:116px}
.po-lines td:nth-child(2) input{min-width:90px}
.po-lines td:nth-child(5) input{min-width:68px}
.po-lines input.sz{min-width:44px}.po-lines input.qty,.po-lines input.cost{text-align:right}
.po-lines td{padding:4px 6px}
.po-line.needs-cost input.cost{border-color:var(--warn-border);background:var(--warn-bg);color:var(--warn)}
.row-del{padding:2px 8px;line-height:1}
.po-lines-actions{display:flex;align-items:center;gap:var(--s-3);margin-top:var(--s-3);flex-wrap:wrap}
.po-form-actions{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap}
.po-save-state{display:inline-flex;align-items:center;gap:6px;color:var(--text-3);font-size:11px;white-space:nowrap}
.po-save-state>span{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 12%,transparent)}
.po-save-state b{font-weight:700}.po-save-state.dirty{color:var(--warning)}
.po-save-state.dirty>span{background:var(--warning);box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 13%,transparent)}
.create-po{display:inline-flex;gap:6px;align-items:center;margin:0}
.po-supplier-in{width:150px;background:var(--surface-2);color:var(--text);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:6px 8px;font:var(--fw-reg) var(--fs-sm)/1.3 var(--font)}
.po-supplier-in:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}

/* ── Quote builder: add-new-customer + margin ──────────────────────────── */
.dd-add{color:var(--accent);border-top:1px solid var(--border-faint);margin-top:2px;font-weight:var(--fw-med)}
.dd-add:hover{background:var(--selected-bg)}
.sum-row.margin{font-size:var(--fs-cap);color:var(--text-3);padding-top:0;margin-top:-2px}
.sum-row.margin .num{color:var(--text-2)}

/* Order-detail lifecycle action row (mark paid / invoice / cancel) */
.order-lifecycle{display:flex;gap:var(--s-2);flex-wrap:wrap;justify-content:flex-end;margin-top:var(--s-1)}
.order-lifecycle .inline{margin:0}
.detail-tags .tag.manual.toggle{font-size:var(--fs-sm)}

/* ── Team collaboration panel (right-side chat) ─────────────────────────── */
.tab.chat-toggle{background:none;border:none;font:inherit;cursor:pointer}
.chat-badge[hidden]{display:none}
.chat-badge{margin-left:5px;background:var(--accent);color:var(--text-on-accent);border-radius:999px;
  font-size:10px;font-weight:var(--fw-semi);padding:0 5px;min-width:15px;display:inline-block;text-align:center}

.chat-panel[hidden]{display:none}
.chat-panel{position:fixed;top:0;right:0;bottom:0;width:360px;max-width:92vw;z-index:200;
  background:var(--surface-1);border-left:1px solid var(--border);box-shadow:var(--sh-2);
  display:flex;flex-direction:column}
.chat-head{display:flex;justify-content:space-between;align-items:center;padding:var(--s-4);
  border-bottom:1px solid var(--border);position:relative}
.chat-switch{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--text);
  font-size:var(--fs-lg);font-weight:var(--fw-semi);cursor:pointer;padding:2px 6px;border-radius:var(--r-sm)}
.chat-switch:hover{background:var(--surface-2)}
.chat-switch-caret{font-size:11px;color:var(--text-3);transition:transform .12s}
.chat-switch[aria-expanded="true"] .chat-switch-caret{transform:rotate(180deg)}
.chat-switcher{position:absolute;top:100%;left:0;right:0;z-index:30;background:var(--surface-2);
  border:1px solid var(--border);border-top:none;border-radius:0 0 var(--r-sm) var(--r-sm);
  box-shadow:var(--sh-2);max-height:64vh;overflow:auto}
.chat-switcher[hidden]{display:none}
.chat-head-btns{display:flex;align-items:center;gap:2px}
.chat-close{background:none;border:none;color:var(--text-3);font-size:24px;line-height:1;cursor:pointer;padding:0 4px}
.chat-close:hover{color:var(--text)}
.chat-menu{background:none;border:none;color:var(--text-3);cursor:pointer;padding:2px 4px;display:inline-flex;align-items:center}
.chat-menu:hover{color:var(--text)}
.chat-menu svg{width:18px;height:18px}
/* Docked team chat: on wide screens the open panel shifts the whole page left (the nav is
   sticky/in-flow and content is centred, so both reflow) instead of covering it — a permanent
   side rail. box-sizing:border-box keeps the padding inside the viewport (no h-scroll). Narrow
   screens keep the lightweight overlay, since 360px off a small screen leaves too little. */
@media (min-width: 1000px) {
  body.chat-open { padding-right: 360px; }
}
.chat-room-actions{display:inline-flex;gap:6px;margin-left:auto;margin-right:8px}
.chat-room-actions[hidden]{display:none}
.chat-room-act{background:none;border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text-2);cursor:pointer;font-size:var(--fs-cap);padding:2px 8px}
.chat-room-act:hover{color:var(--text);border-color:var(--accent)}
.chat-chip-new{border-style:dashed;color:var(--text-2);align-self:flex-start;margin:6px 8px 0}

.chat-channels{display:flex;flex-direction:column;gap:1px;padding:0 6px 8px;overflow-y:auto;
  max-height:46vh;border-bottom:1px solid var(--border-faint);align-items:stretch}
.chat-filter{padding:8px 10px 2px}
.chat-filter input{width:100%;min-height:30px;padding:0 10px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit;font-size:var(--fs-sm)}
.chat-grp-bar{display:flex;align-items:flex-end;width:100%}
.chat-grp-head{display:flex;align-items:center;gap:6px;flex:1;min-width:0;text-align:left;background:none;
  border:none;color:var(--text-3);cursor:pointer;padding:8px 8px 3px;font:inherit}
.chat-grp-body{display:flex;flex-direction:column;gap:1px}
.chat-grp-body[hidden]{display:none}
.chat-grp-label{font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.04em}
.chat-caret{font-size:9px;display:inline-block;transition:transform .12s}
.chat-grp-head.is-collapsed .chat-caret{transform:rotate(-90deg)}
.chat-sort{margin-left:auto;font-size:var(--fs-cap);padding:1px 8px;background:none;
  border:1px solid var(--border);border-radius:var(--r-pill);color:var(--text-2);cursor:pointer}
.chat-sort:hover{border-color:var(--border-strong);color:var(--text)}
.chat-row{display:flex;align-items:center;border-radius:var(--r-sm)}
.chat-row:hover{background:var(--surface-2)}
.chat-row.active{background:var(--selected-bg)}
.chat-row-main{flex:1;min-width:0;text-align:left;background:none;border:none;color:var(--text-2);
  cursor:pointer;padding:6px 8px;font:inherit;font-size:var(--fs-sm);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;display:flex;align-items:center;gap:6px}
.chat-row:hover .chat-row-main,.chat-row.active .chat-row-main{color:var(--text)}
.chat-star{background:none;border:none;color:var(--text-3);cursor:pointer;font-size:13px;
  padding:2px 8px 2px 2px;opacity:0}
.chat-row:hover .chat-star,.chat-star.on,.chat-star:focus-visible{opacity:1}
.chat-star.on{color:var(--accent)}
@media (hover:none){.chat-star{opacity:1}}
.chat-chip{white-space:nowrap;padding:4px 11px;border-radius:var(--r-pill);border:1px solid var(--border);
  background:var(--surface-2);color:var(--text-2);font-size:var(--fs-sm);cursor:pointer;
  display:inline-flex;gap:6px;align-items:center}
.chat-chip:hover{border-color:var(--border-strong);color:var(--text)}
.chat-chip.active{border-color:var(--accent-press);color:var(--text);background:var(--selected-bg)}
.chat-dot{background:var(--accent);color:var(--text-on-accent);border-radius:999px;min-width:16px;
  height:16px;font-size:10px;font-weight:var(--fw-semi);display:inline-flex;align-items:center;
  justify-content:center;padding:0 4px}
/* @mention badge: red, like Slack — the "you, specifically" signal, distinct from ambient unread */
.chat-at{background:var(--danger);color:var(--white);border-radius:999px;height:16px;font-size:10px;
  font-weight:var(--fw-semi);display:inline-flex;align-items:center;justify-content:center;
  padding:0 5px;margin-left:4px}
.chat-badge.has-mention{background:var(--danger);color:var(--white)}

.chat-messages{flex:1;overflow-y:auto;padding:var(--s-4);display:flex;flex-direction:column;gap:var(--s-3)}
.chat-msg{max-width:86%;align-self:flex-start;display:flex;flex-direction:column}
.chat-msg.mine{align-self:flex-end;align-items:flex-end}
.chat-meta{font-size:var(--fs-cap);color:var(--text-3);margin-bottom:2px}
.chat-text{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);
  padding:8px 11px;font-size:var(--fs-sm);color:var(--text);white-space:pre-wrap;word-break:break-word}
.chat-msg.mine .chat-text{background:var(--selected-bg);border-color:var(--accent-press)}
.chat-text .mention{color:var(--accent);font-weight:var(--fw-semi)}

/* --- per-customer chat (customer detail page) --- */
.cc-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-3)}
.cc-assignees{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}
.cc-assignee-list{display:inline-flex;gap:6px;flex-wrap:wrap}
.cc-chip{display:inline-flex;align-items:center;gap:5px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-pill);padding:2px 4px 2px 10px;font-size:var(--fs-sm)}
.cc-x{background:none;border:none;color:var(--text-3);cursor:pointer;font-size:1.1em;line-height:1;padding:0 4px;border-radius:var(--r-sm)}
.cc-x:hover{color:var(--danger);background:var(--danger-bg)}
.cc-x:focus-visible{outline:2px solid var(--focus);outline-offset:1px;color:var(--danger);background:var(--danger-bg)}
.cc-add{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:4px 8px;font-size:var(--fs-sm);color:var(--text)}
.cc-assignee-status{color:var(--accent);font-size:var(--fs-cap)}
.cc-assignee-status:empty{display:none}
.cc-messages{max-height:360px;min-height:160px;overflow-y:auto;display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-3);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.cc-messages:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.cc-messages[aria-busy="true"]{opacity:.72}
.cc-compose{display:flex;gap:var(--s-2);margin-top:var(--s-3)}
.cc-input{flex:1;resize:none;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s-2) var(--s-3);color:var(--text);font:inherit;max-height:120px}
.cc-input:focus{outline:none;border-color:var(--accent);box-shadow:var(--sh-focus)}

/* --- chat replies + attachments (both surfaces) --- */
.chat-meta{display:flex;align-items:center;gap:6px}
.chat-reply-btn{margin-left:auto;background:none;border:none;color:var(--text-3);cursor:pointer;font-size:.95em;line-height:1;padding:2px 4px;border-radius:var(--r-sm);opacity:0;transition:opacity var(--t-fast)}
.chat-msg:hover .chat-reply-btn{opacity:1}
.chat-reply-btn:hover{color:var(--accent);background:var(--surface-2)}
.chat-del-btn{background:none;border:none;color:var(--text-3);cursor:pointer;font-size:.9em;line-height:1;padding:2px 4px;border-radius:var(--r-sm);opacity:0;transition:opacity var(--t-fast)}
.chat-msg:hover .chat-del-btn{opacity:1}
.chat-del-btn:hover{color:var(--danger);background:var(--surface-2)}
.chat-meta{flex-wrap:wrap;max-width:100%}
.chat-edit-btn{background:none;border:0;color:var(--text-3);cursor:pointer;padding:3px 5px;border-radius:var(--r-sm);font:inherit}
.chat-edit-btn:hover{color:var(--accent);background:var(--surface-2)}
.chat-msg:focus-within .chat-reply-btn,.chat-msg:focus-within .chat-del-btn{opacity:1}
.chat-edited{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-reg)}
.chat-tombstone{padding:6px 9px;color:var(--text-3);font-size:var(--fs-sm);font-style:italic}
/* Shared text-only editor. Native dialog keeps focus inside the active edit. */
.chat-edit-dialog{width:min(560px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--border-strong);border-radius:var(--r-lg);background:var(--surface-1);color:var(--text);box-shadow:var(--sh-2)}
.chat-edit-dialog::backdrop{background:var(--overlay)}
.chat-edit-dialog [hidden]{display:none}
.chat-edit-dialog form{display:flex;flex-direction:column;gap:12px;max-height:calc(100dvh - 32px);padding:20px;margin:0}
.chat-edit-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0}
.chat-edit-head h2{margin:0;font-size:var(--fs-lg);font-weight:var(--fw-semi)}
.chat-edit-dialog button{min-height:44px;padding:8px 14px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text);font:inherit;cursor:pointer}
.chat-edit-dialog button:hover{background:var(--surface-3)}
.chat-edit-dialog button:disabled{opacity:.55;cursor:default}
.chat-edit-dialog .chat-edit-close{min-width:44px;padding:4px;border:0;background:none;font-size:22px;color:var(--text-2)}
.chat-edit-dialog .chat-edit-save{background:var(--accent);color:var(--brand-ink);border-color:var(--accent);font-weight:var(--fw-semi)}
.chat-edit-dialog .chat-edit-save:hover{background:var(--accent-strong)}
.chat-edit-hint{margin:0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.5;flex-shrink:0}
.chat-edit-fields{display:flex;flex-direction:column;gap:12px;min-height:0;overflow:auto;padding:3px}
.chat-edit-section{display:grid;grid-template-columns:minmax(0,1fr);gap:12px}
.chat-edit-section.is-comparing{grid-template-columns:repeat(2,minmax(0,1fr))}
.chat-edit-latest{min-width:0;color:var(--text-2);font-size:var(--fs-sm)}
.chat-edit-latest>span{display:block;margin-bottom:6px;font-weight:var(--fw-med)}
.chat-edit-latest-text{margin:0;padding:10px 12px;min-height:76px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);white-space:pre-wrap;overflow-wrap:anywhere;font:var(--fs-base)/1.5 var(--font)}
.chat-edit-field{display:flex;flex-direction:column;gap:6px;color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-med)}
.chat-edit-field textarea{width:100%;min-height:76px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:var(--r-sm);resize:vertical;background:var(--bg);color:var(--text);font:var(--fs-base)/1.5 var(--font)}
.chat-edit-reference{display:flex;flex-direction:column;gap:3px;align-self:flex-start;max-width:100%;padding:8px 11px;border-left:3px solid var(--accent);border-radius:var(--r-sm);background:var(--surface-2);overflow-wrap:anywhere}
.chat-edit-reference>span{color:var(--text-3);font-size:var(--fs-cap)}
.chat-edit-reference>strong{color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-med)}
.chat-edit-count{margin:0;text-align:right;color:var(--text-3);font-size:var(--fs-cap)}
.chat-edit-count.is-over-limit{color:var(--danger)}
.chat-edit-status{margin:0;color:var(--text-2);font-size:var(--fs-sm);overflow-wrap:anywhere}
.chat-edit-status:empty{display:none}
.chat-edit-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;padding-top:12px;border-top:1px solid var(--border);flex-shrink:0}
@media(max-width:760px){
  .chat-meta{gap:4px}
  .chat-reply-btn,.chat-edit-btn,.chat-del-btn{min-width:44px;min-height:44px;opacity:1}
  .chat-edit-dialog form{padding:16px}
  .chat-edit-section.is-comparing{grid-template-columns:minmax(0,1fr)}
  .chat-edit-field textarea{font-size:16px}
}
.chat-panel.chat-dragging{outline:2px dashed var(--accent);outline-offset:-8px}
.chat-panel.chat-dragging::after{content:"Drop to attach";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(var(--brand-rgb),.10);color:var(--accent);font-weight:var(--fw-med);font-size:var(--fs-lg);pointer-events:none;z-index:5}
.chat-quote{border-left:3px solid var(--border-strong);padding:2px 8px;margin-bottom:4px;font-size:var(--fs-sm);color:var(--text-2);background:var(--surface-2);border-radius:var(--r-sm)}
.chat-quote b{color:var(--text)}
.chat-att-img img{max-width:220px;max-height:240px;border-radius:var(--r-md);border:1px solid var(--border);display:block;margin-top:4px}
.chat-att-file{display:inline-block;margin-top:4px;color:var(--accent);text-decoration:none;font-size:var(--fs-sm)}
.chat-att-file:hover{text-decoration:underline}
.chat-compose-row{display:flex;gap:var(--s-2);align-items:flex-end}
.cc-compose{align-items:flex-end}
.chat-replybar{display:flex;align-items:center;gap:8px;padding:4px 8px;margin-bottom:6px;background:var(--surface-2);border-left:3px solid var(--accent);border-radius:var(--r-sm);font-size:var(--fs-sm)}
.chat-replybar[hidden]{display:none}   /* class display: would otherwise beat the hidden attr */
.chat-replybar-txt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-2)}
.chat-replybar-x{background:none;border:none;color:var(--text-3);cursor:pointer;font-size:1.1em;line-height:1;padding:0 4px}
.chat-replybar-x:hover{color:var(--text)}
.chat-attach{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;font-size:1.05em;line-height:1;padding:6px 9px;color:var(--text-2);flex:none}
.chat-attach:hover{color:var(--accent);border-color:var(--accent)}
.chat-reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;align-items:center}
.chat-react{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-pill);padding:1px 7px;font-size:var(--fs-sm);cursor:pointer;line-height:1.5}
.chat-react.mine{background:var(--selected-bg);border-color:var(--accent)}
.chat-react:hover{border-color:var(--accent)}
.chat-react-add{background:none;border:1px solid transparent;border-radius:var(--r-pill);color:var(--text-3);cursor:pointer;font-size:var(--fs-sm);padding:1px 6px;opacity:0;transition:opacity var(--t-fast)}
.chat-msg:hover .chat-react-add,.chat-react-add:focus-visible{opacity:1}
.chat-react-add:hover,.chat-react-add:focus-visible{color:var(--accent);border-color:var(--border)}
.chat-react-picker{display:inline-flex;gap:2px;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-pill);padding:2px 4px}
.chat-react-picker[hidden]{display:none}   /* same hidden-attr gotcha as the reply bar */
.chat-react-opt{background:none;border:none;cursor:pointer;font-size:1.05em;padding:0 3px;line-height:1.4;border-radius:var(--r-sm)}
.chat-react-opt:hover,.chat-react-opt:focus-visible{background:var(--surface-2);outline:none;box-shadow:var(--sh-focus)}
@media (hover:none){.chat-react-add{opacity:1}}

/* --- payments (order detail) --- */
.pay-mini{display:flex;gap:12px;flex-wrap:wrap;font-size:var(--fs-sm);margin-top:2px}
.pay-mini .due,.pay-totals .due{color:var(--danger)}
.pay-mini .ok,.pay-totals .ok{color:var(--ok)}
.pay-card{margin-top:var(--s-4)}
.pay-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap;margin-bottom:var(--s-3)}
.pay-totals{display:flex;gap:16px;flex-wrap:wrap;font-size:var(--fs-sm)}
.pay-form{display:flex;gap:var(--s-2);align-items:center;flex-wrap:wrap;margin-bottom:var(--s-3)}
.pay-amt{display:inline-flex;align-items:center;gap:3px}
.pay-amt input{width:110px}
.pay-form select,.pay-form input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:6px 8px;color:var(--text);font:inherit}
/* Overrides .pay-form's single centred row above: the modal stacks its labelled
   fields instead. Both classes are on the same form, and this one is defined
   later, so it wins on order at equal specificity. */
.pay-modal-form{display:flex;flex-direction:column;align-items:stretch;
  gap:var(--s-3);margin-bottom:0}
.pay-modal-form .pay-amt{align-self:flex-start}
.pay-card-link{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border);display:flex;flex-direction:column;gap:var(--s-2)}
.pay-card-row{display:flex;gap:var(--s-2);align-items:center;flex-wrap:wrap}
.pay-card-row input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:6px 8px;color:var(--text);font:inherit}
.pay-link-out{font-size:var(--fs-sm);word-break:break-all}
.pay-link-out.ok{color:var(--text-2)} .pay-link-out.err{color:var(--danger)}
.pay-ref{min-width:150px}
.pay-table tr.pay-processing{opacity:.7}
.pay-table tr.pay-failed{opacity:.5;text-decoration:line-through}

/* --- stripe connector (settings) --- */
.payment-settings{max-width:1180px;--hit:44px;--hit-sm:44px}
.payment-settings .workspace-head{align-items:flex-end}
.payment-readiness-score{display:flex;min-width:112px;flex-direction:column;align-items:flex-end;padding:10px 14px;
  border:1px solid var(--selected-border);border-radius:var(--r-md);background:var(--selected-bg)}
.payment-readiness-score strong{color:var(--accent);font:700 1.45rem/1 var(--mono)}
.payment-readiness-score span{margin-top:5px;color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.payment-readiness{margin-bottom:var(--s-4);padding:20px}
.payment-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-4)}
.payment-section-head h2{margin:4px 0 0;font-size:1.05rem}
.payment-overall-state,.payment-method-count{flex:0 0 auto;padding:4px 9px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:var(--surface-2);color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);white-space:nowrap}
.payment-overall-state.is-ready{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}
.payment-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none}
.payment-step{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:6px 18px 6px 0;color:var(--text-3)}
.payment-step:not(:last-child)::after{content:"";position:absolute;top:19px;right:8px;width:18px;border-top:1px solid var(--border-strong)}
.payment-step-index{display:grid;width:28px;height:28px;place-items:center;border:1px solid var(--border-strong);border-radius:50%;
  background:var(--surface-2);font:700 var(--fs-cap)/1 var(--mono)}
.payment-step>div{display:flex;min-width:0;flex-direction:column;gap:3px}
.payment-step small{font-size:10px;text-transform:uppercase;letter-spacing:.07em}
.payment-step strong{overflow:hidden;color:var(--text-2);font-size:var(--fs-sm);text-overflow:ellipsis;white-space:nowrap}
.payment-step>div>span{font-size:var(--fs-cap);line-height:1.35}
.payment-step.is-ready .payment-step-index{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}
.payment-step.is-current .payment-step-index{border-color:var(--selected-border);background:var(--selected-bg);color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}
.payment-step.is-current strong{color:var(--text)}
.payment-layout{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(310px,.68fr);gap:var(--s-4);align-items:start}
.payment-connection,.payment-methods{min-width:0}
.badge-mode{display:inline-block;padding:3px 12px;border-radius:var(--r-pill);font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.06em}
.badge-test{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-border)}
.badge-live{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-border)}
.badge-none,.badge-unknown{background:var(--surface-2);color:var(--text-3);border:1px solid var(--border)}
.stripe-status{display:flex;align-items:center;gap:12px;margin-bottom:var(--s-4);flex-wrap:wrap}
.stripe-conn-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 var(--s-3)}
.stripe-live-warn{display:flex;align-items:center;gap:6px;color:var(--danger);font-size:var(--fs-sm);margin:0 0 var(--s-4)}
.stripe-key-form{display:flex;flex-direction:column;gap:var(--s-2);max-width:520px}
.stripe-key-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm)}
.stripe-key-form input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.payment-safe-detail{display:grid;grid-template-columns:1fr auto;gap:4px 16px;margin:-2px 0 var(--s-4);padding:12px 14px;
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.payment-safe-detail>span{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.payment-safe-detail strong{font:700 var(--fs-sm)/1 var(--mono)}
.payment-safe-detail small{grid-column:1/-1;color:var(--text-3);font-size:var(--fs-cap)}
.payment-next-action{margin-bottom:var(--s-4);padding:18px;border:1px solid var(--selected-border);border-radius:var(--r-lg);
  background:linear-gradient(135deg,var(--selected-bg),color-mix(in srgb,var(--surface-1) 92%,var(--accent)))}
.payment-next-action.is-ready{border-color:var(--ok-border);background:linear-gradient(135deg,var(--ok-bg),var(--surface-1))}
.payment-next-action h3{margin:5px 0 7px;font-size:1rem}
.payment-next-action>p{margin:0 0 var(--s-3);color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.payment-action-label{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.08em}
.payment-next-action.is-ready .payment-action-label{color:var(--ok)}
.payment-advanced{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}
.payment-advanced>summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.payment-advanced[open]>summary{margin-bottom:var(--s-3)}
.payment-advanced p{font-size:var(--fs-sm);line-height:1.5}
.payment-command{display:block;max-width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--r-sm);
  background:var(--surface-0);font-size:.75rem;overflow-wrap:anywhere;white-space:normal}
.payment-connection-actions{display:flex;align-items:center;gap:10px;margin-top:var(--s-3);flex-wrap:wrap}
.detail-jobname{font-weight:var(--fw-semi);color:var(--text-2);margin-top:2px}
.stripe-webhook{margin-top:var(--s-3);font-size:var(--fs-sm);color:var(--text-2)}
.stripe-webhook code{font-size:.85em}
.stripe-nofernet code{font-size:.85em}
.stripe-ach{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border);display:flex;flex-direction:column;gap:var(--s-2)}
.stripe-ach>div>strong{font-size:var(--fs-sm)}
.stripe-ach>div>p{margin:4px 0 0;line-height:1.45}
.payment-ach-form{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.payment-ach-note{margin:0;line-height:1.45}
.ach-toggle{display:flex;min-height:44px;align-items:center;gap:8px;font-size:var(--fs-sm);cursor:pointer}
.ach-toggle input{accent-color:var(--accent);width:16px;height:16px}
.payment-methods>.muted{margin:-4px 0 var(--s-3);line-height:1.5}
@media(max-width:900px){.payment-layout{grid-template-columns:1fr}.payment-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 0}}
@container workspace (max-width:900px){.payment-layout{grid-template-columns:1fr}.payment-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 0}}
@media(max-width:560px){
  .payment-settings .workspace-head{align-items:stretch}.payment-readiness-score{align-items:flex-start;width:max-content}
  .payment-steps{grid-template-columns:1fr}.payment-step:not(:last-child)::after{left:13px;top:34px;right:auto;width:auto;height:20px;border-top:0;border-left:1px solid var(--border-strong)}
  .payment-section-head{align-items:flex-start;flex-direction:column}.payment-safe-detail{grid-template-columns:1fr}.payment-safe-detail small{grid-column:auto}
}
@container workspace (max-width:560px){
  .payment-settings .workspace-head{align-items:stretch}.payment-readiness-score{align-items:flex-start;width:max-content}
  .payment-steps{grid-template-columns:1fr}.payment-step:not(:last-child)::after{left:13px;top:34px;right:auto;width:auto;height:20px;border-top:0;border-left:1px solid var(--border-strong)}
  .payment-section-head{align-items:flex-start;flex-direction:column}.payment-safe-detail{grid-template-columns:1fr}.payment-safe-detail small{grid-column:auto}
}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .payment-settings.settings-page{gap:10px;padding-top:12px}
  .payment-settings.settings-page .workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:0;padding-bottom:10px}
  .payment-settings .workspace-head-main .workspace-kicker,
  .payment-settings .workspace-head-main .workspace-subtitle{display:none}
  .payment-settings .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .payment-readiness-score{min-width:0;flex-direction:row;align-items:center;width:auto;gap:6px;padding:7px 10px}
  .payment-readiness-score strong{font-size:1.1rem}
  .payment-readiness-score span{margin-top:0}
  .payment-layout{display:contents}
  .payment-connection{order:1;padding:10px 12px}
  .payment-readiness{order:2}
  .payment-methods{order:3}
  .payment-section-head{align-items:center;flex-direction:row;gap:8px;margin-bottom:8px}
  .payment-section-head .workspace-kicker{display:none}
  .payment-section-head h2{margin:0;font-size:1rem}
  .payment-next-action{margin-bottom:0;padding:10px 12px}
  .payment-action-label{display:none}
  .payment-next-action h3{margin:0}
  .payment-next-action>p{display:none}
  .payment-advanced{margin-top:6px;padding-top:6px}
  .payment-advanced>summary{display:flex;align-items:center;min-height:44px}
  .payment-connection-actions{margin-top:6px}
}

/* --- connector control center --- */
.connector-center{max-width:1180px}
.connector-actions .btn{min-height:44px}
.connector-head{align-items:flex-end}
.connector-score{display:flex;flex-direction:column;align-items:flex-end;min-width:110px;padding:10px 14px;
  border:1px solid var(--selected-border);border-radius:var(--r-md);background:var(--selected-bg)}
.connector-score strong{color:var(--accent);font:700 1.55rem/1 var(--mono)}
.connector-score span{margin-top:5px;color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.connector-summary{display:grid;grid-template-columns:minmax(190px,.8fr) minmax(240px,1.2fr);gap:12px 28px;
  align-items:center;margin-bottom:var(--s-5);padding:18px 20px;border:1px solid var(--border);
  border-radius:var(--r-lg);background:linear-gradient(135deg,var(--surface-2),var(--surface-1))}
.connector-summary>div:first-child{display:flex;flex-direction:column;gap:4px}
.connector-summary-label,.connector-card-title>span,.connector-detail>span{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.08em}
.connector-summary strong{font-size:var(--fs-lg)}
.connector-summary>p{grid-column:1/-1;margin:0;color:var(--text-3);font-size:var(--fs-sm)}
.connector-progress{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.connector-progress span{height:7px;border-radius:var(--r-pill);background:var(--surface-3);border:1px solid var(--border)}
.connector-progress span.ready{border-color:color-mix(in srgb,var(--accent) 58%,transparent);background:var(--accent)}
.connector-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4)}
.connector-card{position:relative;display:flex;min-height:285px;flex-direction:column;padding:20px;border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--surface-1);overflow:hidden}
.connector-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--warn)}
.connector-card--ready::before{background:var(--accent)}
.connector-card-top{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center}
.connector-mark{display:grid;width:48px;height:48px;place-items:center;border:1px solid var(--border-strong);border-radius:14px;
  background:var(--surface-2);color:var(--text);font:700 .85rem/1 var(--mono)}
.connector-mark--stripe{color:#b9a8ff}.connector-mark--quickbooks{color:#6bdc93}.connector-mark--time{color:#72c8ff}
.connector-mark--drive{color:#ffd36b}.connector-mark--gmail{color:#ff8f8f}
.connector-card-title h2{margin:3px 0 0;font-size:1.04rem}
.connector-state{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:var(--warn);font-size:var(--fs-cap);font-weight:var(--fw-semi)}
.connector-state i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 14%,transparent)}
.connector-state--ready{color:var(--accent)}
.connector-description{min-height:44px;margin:18px 0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.connector-detail{margin-bottom:18px;padding:12px;border:1px solid var(--border-faint);border-radius:var(--r-md);background:var(--surface-2)}
.connector-detail strong{display:block;margin-top:4px;font-size:var(--fs-sm)}
.connector-detail p{margin:5px 0 0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.45;overflow-wrap:anywhere}
.connector-action{justify-content:space-between;width:100%;min-height:44px;margin-top:auto}
.connector-security{display:flex;align-items:flex-start;gap:12px;margin-top:var(--s-4);padding:16px 18px;border:1px solid var(--border);
  border-radius:var(--r-md);background:var(--surface-1);color:var(--text-2)}
.connector-security>div{color:var(--accent)}
.connector-security p{margin:0;font-size:var(--fs-sm);line-height:1.55}
.connector-advanced{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}
.connector-advanced>summary{cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.connector-advanced[open]>summary{margin-bottom:var(--s-3)}
@media(max-width:760px){
  .connector-grid{grid-template-columns:1fr}.connector-summary{grid-template-columns:1fr}.connector-summary>p{grid-column:auto}
  .connector-card-top{grid-template-columns:48px minmax(0,1fr)}.connector-state{grid-column:1/-1}.connector-head{align-items:stretch}
  .connector-score{align-items:flex-start;width:max-content}
}
@container workspace (max-width:640px){
  .connector-grid{grid-template-columns:1fr}.connector-summary{grid-template-columns:1fr}.connector-summary>p{grid-column:auto}
  .connector-card-top{grid-template-columns:48px minmax(0,1fr)}.connector-state{grid-column:1/-1}.connector-head{align-items:stretch}
  .connector-score{align-items:flex-start;width:max-content}
}

/* Connector center: action-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .connector-center{gap:8px;padding-top:12px}
  .connector-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0;padding-bottom:0;border-bottom:0}
  .connector-head .workspace-kicker,
  .connector-head .workspace-subtitle{display:none}
  .connector-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .connector-score{min-width:0;min-height:44px;flex-direction:row;align-items:center;width:auto;gap:6px;padding:7px 10px}
  .connector-score strong{font-size:1.1rem}
  .connector-score span{margin-top:0}
  .connector-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;overflow:visible}
  .connector-actions .btn{min-width:0;min-height:44px;padding:9px 4px;font-size:.72rem;text-align:center;white-space:nowrap}
  .connector-summary{display:none}
  .connector-grid{grid-template-columns:1fr;gap:8px}
  .connector-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;min-height:60px;padding:8px 10px}
  .connector-card-top{grid-template-columns:36px minmax(0,1fr);gap:2px 8px}
  .connector-mark{grid-row:1/3;width:36px;height:36px;border-radius:10px}
  .connector-state{grid-column:2;font-size:10px}
  .connector-description,
  .connector-detail{display:none}
  .connector-action{width:auto;min-height:44px;margin:0;padding:9px 12px;white-space:nowrap}
}

/* --- pricing (markup) settings --- */
.qbo-settings{max-width:1180px;--hit:44px;--hit-sm:44px}
.qbo-settings .workspace-head{align-items:flex-end}
.qbo-readiness-score{display:flex;min-width:112px;flex-direction:column;align-items:flex-end;padding:10px 14px;
  border:1px solid var(--selected-border);border-radius:var(--r-md);background:var(--selected-bg)}
.qbo-readiness-score strong{color:var(--accent);font:700 1.45rem/1 var(--mono)}
.qbo-readiness-score span{margin-top:5px;color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.qbo-readiness{margin-bottom:var(--s-4);padding:20px}
.qbo-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-4)}
.qbo-section-head h2{margin:4px 0 0;font-size:1.05rem}
.qbo-overall-state,.qbo-connection-state,.qbo-policy-state{flex:0 0 auto;padding:4px 9px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:var(--surface-2);color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.qbo-overall-state.is-ready,.qbo-connection-state.is-ready{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}
.qbo-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;padding:0;list-style:none}
.qbo-step{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:6px 24px 6px 0;color:var(--text-3)}
.qbo-step:not(:last-child)::after{content:"";position:absolute;top:19px;right:10px;width:20px;border-top:1px solid var(--border-strong)}
.qbo-step-index{display:grid;width:28px;height:28px;place-items:center;border:1px solid var(--border-strong);border-radius:50%;background:var(--surface-2);font:700 var(--fs-cap)/1 var(--mono)}
.qbo-step>div{display:flex;min-width:0;flex-direction:column;gap:3px}.qbo-step small{font-size:10px;text-transform:uppercase;letter-spacing:.07em}
.qbo-step strong{overflow:hidden;color:var(--text-2);font-size:var(--fs-sm);text-overflow:ellipsis;white-space:nowrap}.qbo-step>div>span{font-size:var(--fs-cap);line-height:1.35}
.qbo-step.is-ready .qbo-step-index{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}
.qbo-step.is-current .qbo-step-index{border-color:var(--selected-border);background:var(--selected-bg);color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}
.qbo-step.is-current strong{color:var(--text)}
.qbo-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:var(--s-4);align-items:start}
.qbo-connection,.qbo-policy{min-width:0}
.qbo-company-detail{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:var(--s-4);padding:14px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.qbo-company-detail>div{display:flex;min-width:0;flex-direction:column;gap:4px}.qbo-company-detail span{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.qbo-company-detail strong{overflow-wrap:anywhere;font-size:var(--fs-sm)}.qbo-company-detail p{grid-column:1/-1;margin:2px 0 0;color:var(--text-3);font-size:var(--fs-cap)}
.qbo-next-action{padding:18px;border:1px solid var(--selected-border);border-radius:var(--r-lg);background:linear-gradient(135deg,var(--selected-bg),color-mix(in srgb,var(--surface-1) 92%,var(--accent)))}
.qbo-next-action.is-ready{border-color:var(--ok-border);background:linear-gradient(135deg,var(--ok-bg),var(--surface-1))}
.qbo-next-action>span{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.08em}.qbo-next-action.is-ready>span{color:var(--ok)}
.qbo-next-action h3{margin:5px 0 7px;font-size:1rem}.qbo-next-action>p{margin:0 0 var(--s-3);color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.qbo-advanced{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}
.qbo-advanced>summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}.qbo-advanced[open]>summary{margin-bottom:var(--s-3)}
.qbo-advanced p{font-size:var(--fs-sm);line-height:1.5}.qbo-command,.qbo-redirect-uri{display:block;max-width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-0);font-size:.75rem;overflow-wrap:anywhere;white-space:normal}
.qbo-provider-link{display:inline-flex;min-height:44px;align-items:center}
.qbo-creds-form{margin-top:var(--s-3)}.qbo-management-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.qbo-policy{position:relative;overflow:hidden}.qbo-policy::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--ok)}.qbo-policy.is-live::before{background:var(--amber)}
.qbo-policy.is-safe .qbo-policy-state{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}.qbo-policy.is-live .qbo-policy-state{border-color:var(--amber);color:var(--amber)}
.qbo-policy>h3{margin:0 0 8px;font-size:1rem}.qbo-policy>p{margin:0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.qbo-policy-facts{margin:var(--s-4) 0 0}.qbo-policy-facts>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--border-faint);font-size:var(--fs-sm)}
.qbo-policy-facts dt{color:var(--text-3)}.qbo-policy-facts dd{margin:0;text-align:right}.qbo-policy-facts code{font-size:.82em}
.qbo-policy-note{margin-top:var(--s-4)!important;padding:12px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2);font-size:var(--fs-cap)!important}
.qbt-sync-metrics{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:var(--s-4)}
.qbt-sync-metrics>div{display:flex;min-width:0;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.qbt-sync-metrics span{color:var(--text-3);font-size:var(--fs-cap)}
.qbt-sync-metrics strong{font:700 1.1rem/1 var(--mono);color:var(--text-2)}
.qbt-sync-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:var(--s-4)}
@media(max-width:900px){.qbo-layout{grid-template-columns:1fr}.qbo-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container workspace (max-width:900px){.qbo-layout{grid-template-columns:1fr}.qbo-steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.qbo-settings .workspace-head{align-items:stretch}.qbo-readiness-score{align-items:flex-start;width:max-content}.qbo-section-head{align-items:flex-start;flex-direction:column}.qbo-steps{grid-template-columns:1fr}.qbo-step:not(:last-child)::after{left:13px;top:34px;right:auto;width:auto;height:20px;border-top:0;border-left:1px solid var(--border-strong)}.qbo-company-detail{grid-template-columns:1fr}.qbo-company-detail p{grid-column:auto}}
@container workspace (max-width:560px){.qbo-settings .workspace-head{align-items:stretch}.qbo-readiness-score{align-items:flex-start;width:max-content}.qbo-section-head{align-items:flex-start;flex-direction:column}.qbo-steps{grid-template-columns:1fr}.qbo-step:not(:last-child)::after{left:13px;top:34px;right:auto;width:auto;height:20px;border-top:0;border-left:1px solid var(--border-strong)}.qbo-company-detail{grid-template-columns:1fr}.qbo-company-detail p{grid-column:auto}}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .qbo-settings.settings-page{gap:10px;padding-top:12px}
  .qbo-settings.settings-page .workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:0;padding-bottom:10px}
  .qbo-settings .workspace-head-main .workspace-kicker,
  .qbo-settings .workspace-head-main .workspace-subtitle{display:none}
  .qbo-settings .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .qbo-readiness-score{min-width:0;flex-direction:row;align-items:center;width:auto;gap:6px;padding:7px 10px}
  .qbo-readiness-score strong{font-size:1.1rem}
  .qbo-readiness-score span{margin-top:0}
  .qbo-layout{display:contents}
  .qbo-connection{order:1;padding:10px 12px}
  .qbo-readiness{order:2}
  .qbo-policy{order:3}
  .qbo-section-head{align-items:center;flex-direction:row;gap:8px;margin-bottom:8px}
  .qbo-section-head .workspace-kicker{display:none}
  .qbo-section-head h2{margin:0;font-size:1rem}
  .qbo-next-action{padding:10px 12px}
  .qbo-next-action>span{display:none}
  .qbo-next-action h3{margin:0}
  .qbo-next-action>p{display:none}
  .qbo-advanced{margin-top:6px;padding-top:6px}
  .qbo-advanced>summary{display:flex;align-items:center;min-height:44px}
}

.pricing-form{margin-top:var(--s-2)}
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--s-3);margin-bottom:var(--s-3)}
.pricing-grid label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.pricing-grid input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit;font-variant-numeric:tabular-nums}
.pricing-grid .tiny{font-weight:var(--fw-reg)}
.pricing-ladder-locked{opacity:.6;cursor:not-allowed;font-style:italic}
.pricing-advanced{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}
.pricing-advanced summary{cursor:pointer;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.pricing-form-actions .btn,.pricing-advanced>summary{min-height:44px}
.pricing-advanced code{font-size:.85em}
.pricing-json{width:100%;box-sizing:border-box;margin:var(--s-2) 0;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:10px;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;line-height:1.5;resize:vertical}
.pricing-reset{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}

/* --- rate-grid editor --- */
/* Rate grids: full-size editor controls */
.pricing-grids-page input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.pricing-grids-page select,
.pricing-grids-page .btn{height:44px;min-height:44px;box-sizing:border-box}
.pricing-grids-page .grid-x{width:44px;height:44px}
.grid-card{padding:0;overflow:hidden}
.grid-toggle{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:18px 20px;background:none;border:0;color:var(--text);font:inherit;text-align:left;cursor:pointer}
.grid-toggle:hover{background:color-mix(in srgb,var(--surface-2) 62%,transparent)}
.grid-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}
.grid-summary{min-width:0}
.grid-summary h2{margin:0 0 3px;font-size:1rem}
.grid-summary .badge-mode{margin-left:8px}
.grid-dirty-badge{display:inline-flex;margin-left:6px;padding:2px 6px;border:1px solid color-mix(in srgb,var(--warning) 38%,var(--border));border-radius:var(--r-pill);background:color-mix(in srgb,var(--warning) 10%,transparent);color:var(--warning);font-size:10px;font-weight:800;letter-spacing:.05em}.grid-dirty-badge[hidden]{display:none}
.grid-summary-count{color:var(--text-2);font-size:var(--fs-cap);font-variant-numeric:tabular-nums;white-space:nowrap}
.grid-chevron{width:9px;height:9px;border-right:2px solid var(--text-2);border-bottom:2px solid var(--text-2);transform:rotate(-45deg);transition:transform .16s ease}
.grid-toggle[aria-expanded=true] .grid-chevron{transform:rotate(45deg) translate(-2px,-2px);border-color:var(--accent)}
.grid-panel{padding:0 20px 20px;border-top:1px solid var(--border)}
.grid-formula{display:grid;grid-template-columns:minmax(220px,1.5fr) repeat(3,minmax(145px,1fr));gap:12px;align-items:end;padding:16px 0;border-bottom:1px solid var(--border);margin-bottom:14px}
.grid-formula-copy{display:flex;flex-direction:column;gap:3px}
.grid-formula label{display:flex;flex-direction:column;gap:5px;color:var(--text-2);font-size:var(--fs-cap);font-weight:var(--fw-semi)}
.grid-formula select,.grid-formula input{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 9px;color:var(--text);font:inherit}
.grid-money-input{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:5px}
.grid-head-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-bottom:12px}
.grid-upload{display:flex;gap:6px;align-items:center;margin:0}
.grid-upload input[type=file]{font-size:var(--fs-cap);max-width:150px;color:var(--text-2)}
.grid-table-wrap{overflow-x:auto}
.grid-table{border-collapse:collapse}
.grid-table th,.grid-table td{border:1px solid var(--border);padding:6px;text-align:left;vertical-align:top}
.grid-table th{background:var(--surface-2);font-weight:var(--fw-semi);font-size:var(--fs-cap);white-space:nowrap}
.grid-qty-head{display:flex;align-items:center;gap:3px}
.grid-in{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);padding:5px 7px;color:var(--text);font:inherit;font-variant-numeric:tabular-nums;box-sizing:border-box;min-width:0}
.grid-qty{width:46px}
.grid-price,.grid-cost{display:block;width:82px}
.grid-cost{margin-top:4px;opacity:.7;font-size:.85em}
.grid-rowhead{white-space:nowrap}
.grid-variant{width:140px;margin-right:4px}
.grid-x{background:none;border:none;color:var(--danger);cursor:pointer;font-size:15px;line-height:1;padding:0 2px;vertical-align:middle}
.grid-x:hover{opacity:.6}
.grid-new summary.btn{display:inline-flex;width:auto;min-height:44px;cursor:pointer;list-style:none}
.grid-new summary::-webkit-details-marker{display:none}
.grid-new-form{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-top:12px}
.grid-new-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.grid-new-form input,.grid-new-form select{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.grid-foot{display:flex;gap:8px;align-items:center;margin-top:12px;flex-wrap:wrap}
.grid-status.ok{color:var(--ok)}
.grid-status.err{color:var(--danger)}
.grid-status.dirty{color:var(--warning);font-weight:var(--fw-semi)}
@media (max-width:860px){.grid-formula{grid-template-columns:1fr 1fr}.grid-formula-copy{grid-column:1/-1}}
@media (max-width:560px){.grid-toggle{grid-template-columns:18px minmax(0,1fr)}.grid-summary-count{display:none}.grid-formula{grid-template-columns:1fr}.grid-formula-copy{grid-column:auto}.grid-head-actions{justify-content:flex-start}}

/* A short shop-floor screen should reach the pricing controls before it runs
   out of height. Keep the page identity and section rail, but collapse copy and
   navigation that are already available on the pricing overview. */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .pricing-grids-page{gap:10px;padding-top:12px}
  .pricing-grids-page .detail-head{display:block}
  .pricing-grids-page .pricing-kicker{font-size:10px}
  .pricing-grids-page .detail-head h1{margin:2px 0 0;font-size:clamp(1.2rem,3.4vw,1.55rem);line-height:1.05}
  .pricing-grids-page .detail-sub,
  .pricing-grids-page .detail-head>.btn{display:none}
  .pricing-grids-page .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:max-content;gap:3px;overflow-x:auto;margin:0;padding:4px;border-radius:var(--r-md)}
  .pricing-grids-page .pricing-subnav a{padding:7px 10px;white-space:nowrap}
  .pricing-grids-page>.card{margin:0;padding:10px 12px}
  .pricing-grids-page .grid-card{padding:0}
  .pricing-grids-page .grid-toggle{min-height:44px;padding:10px 12px}
}

/* --- customer pricing/billing settings --- */
.cust-settings summary{cursor:pointer;font-weight:var(--fw-semi)}
.cust-edit-bar{margin-bottom:var(--s-4)}
.contact-list{list-style:none;margin:var(--s-2) 0;padding:0;display:flex;flex-direction:column;gap:2px}
.contact{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--border)}
.contact:last-child{border-bottom:none}
.contact-add{display:flex;gap:8px;flex-wrap:wrap;margin-top:var(--s-3)}
.contact-add input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 9px;color:var(--text);font:inherit;min-width:130px}
/* Doubled up on purpose: plain .cust-modal-card ties with .modal-card on
   specificity and loses on order (.modal-card is defined ~400 lines later), so the
   wider width silently never applied. Keep both classes in the selector. */
.modal-card.cust-modal-card{max-width:820px;max-height:88vh;overflow-y:auto}
.terms-workspace{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr);
  gap:var(--s-5);align-items:start}
.terms-editor-card,.terms-guidance{padding:var(--s-5)}
.terms-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-4);
  margin-bottom:var(--s-5)}
.terms-card-head h2,.terms-guidance h2{margin:6px 0 0;font-size:var(--fs-lg)}
.terms-card-head p{max-width:64ch;margin:6px 0 0;color:var(--text-3);font-size:var(--fs-sm);line-height:1.5}
.terms-count{flex:0 0 auto;padding:4px 9px;border:1px solid var(--selected-border);
  border-radius:var(--r-pill);background:var(--selected-bg);color:var(--accent);font-size:var(--fs-cap)}
.terms-form{display:flex;flex-direction:column;gap:var(--s-2)}
.terms-form>label{color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.terms-form textarea.terms-list{width:100%;box-sizing:border-box;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:12px;color:var(--text);
  font:var(--fw-reg) var(--fs-base)/1.7 var(--mono);resize:vertical}
.terms-field-hint{margin:0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.terms-settings .workspace-actions .btn,.terms-actions .btn{min-height:44px}
.terms-actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--s-3);margin-top:var(--s-3);padding-top:var(--s-4);
  border-top:1px solid var(--border-faint)}
.terms-save-state{display:inline-flex;align-items:center;gap:6px;color:var(--text-3);font-size:11px;white-space:nowrap}
.terms-save-state>span{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 12%,transparent)}
.terms-save-state b{font-weight:700}.terms-save-state.dirty{color:var(--warning)}
.terms-save-state.dirty>span{background:var(--warning);box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 13%,transparent)}
.terms-guidance ol{display:flex;flex-direction:column;gap:var(--s-4);margin:var(--s-5) 0 0;padding:0;list-style:none}
.terms-guidance li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:var(--s-3);align-items:start}
.terms-guidance li>span{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  border:1px solid var(--selected-border);border-radius:50%;background:var(--selected-bg);
  color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.terms-guidance strong{display:block;font-size:var(--fs-sm)}
.terms-guidance p{margin:4px 0 0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.5}
@container workspace (max-width:820px){.terms-workspace{grid-template-columns:1fr}}
@container workspace (max-width:520px){
  .terms-editor-card,.terms-guidance{padding:var(--s-4)}
  .terms-card-head{flex-direction:column}
  .terms-actions{align-items:stretch;flex-direction:column-reverse}
  .terms-actions .btn{width:100%;justify-content:center}
}
/* The edit-customer form. Was one flex-wrap run of 21 labels, which packed them
   three-up at whatever width they landed on; and because it aligned on flex-end,
   any label whose title wrapped to a second line ("Legal name (if different)",
   "Tax ID (EIN)") dropped its input below its row-mates. Now: labelled sections,
   two even columns, and subgrid so every title / input / hint shares a row line
   across the pair — so a long title can no longer knock its neighbour out of
   alignment. Follows the .cpm-grid convention already used by the payment modal. */
.cust-settings-form{margin-top:14px}
.cust-settings-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.cust-fieldset{border:0;padding:0;margin:0 0 var(--s-4);min-width:0}
.cust-fieldset legend{padding:0;margin-bottom:8px;font-size:var(--fs-cap);text-transform:uppercase;
  letter-spacing:.05em;color:var(--text-3);font-weight:var(--fw-semi)}
.cust-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;align-items:start}
.cust-grid > label{min-width:0}
.cust-grid > label:not(.cust-check) > input,
.cust-grid > label:not(.cust-check) > select{width:100%;box-sizing:border-box}
.cust-grid .lbl{font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.cust-grid .cust-wide{grid-column:1 / -1}
/* Three rows per field — title, control, hint — shared across the row so the
   controls line up even when one title runs longer than the other. Checkbox and
   address fields opt out: they don't have that three-part shape. */
@supports (grid-template-rows:subgrid){
  .cust-grid > label:not(.cust-check):not(.cust-addr-field){
    display:grid;grid-row:span 3;grid-template-rows:subgrid;gap:4px}
}
.cust-form-actions{position:sticky;bottom:-24px;display:flex;gap:10px;align-items:center;
  margin-top:var(--s-3);padding:14px 0 10px;background:var(--surface-1);
  border-top:1px solid var(--border)}
/* Was input[type=number] only, so text/email inputs fell through to the browser
   default and rendered white on the dark modal. Cover every text-like input —
   type=date was still falling through for exactly that reason, and the native
   picker needs color-scheme too or its calendar icon stays black-on-dark. */
.cust-settings-form input[type=text],.cust-settings-form input[type=email],
.cust-settings-form input[type=number],.cust-settings-form input[type=date],
.cust-settings-form select{
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:7px 9px;color:var(--text);font:inherit;min-width:120px}
.cust-settings-form input[type=date]{color-scheme:dark}
.cust-settings-form input[type=text]:focus,.cust-settings-form input[type=email]:focus,
.cust-settings-form input[type=number]:focus,.cust-settings-form input[type=date]:focus,
.cust-settings-form select:focus{
  outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
/* Hint links ("manage terms", "connect Drive") were falling through to the UA
   blue-and-underlined default, which reads as a broken link on this palette. */
.cust-settings-form .muted a{color:var(--accent);text-decoration:none}
.cust-settings-form .muted a:hover{text-decoration:underline}
.cust-settings-form .cust-addr-field{flex:1 1 320px}
.cust-settings-form .cust-addr-field input{width:100%}
.cust-settings-form .cust-check{flex-direction:row;align-items:center;gap:7px;font-weight:var(--fw-reg)}
.cust-settings-form .cust-check input{width:16px;height:16px;accent-color:var(--accent)}
.cust-danger{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
@media (max-width:760px){
  .modal-card.cust-modal-card .modal-x{display:grid;width:44px;height:44px;place-items:center;top:8px;right:8px}
  .cust-modal-card .cust-grid{grid-template-columns:1fr}
  .cust-modal-card .cust-grid .cust-wide{grid-column:auto}
  .cust-modal-card .cust-settings-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
  .cust-modal-card .cust-settings-form select{height:44px;min-height:44px}
  .cust-modal-card .cust-settings-form .cust-check{min-height:44px}
  .cust-modal-card .cust-form-actions .btn{flex:1;min-height:44px;justify-content:center}
}
.sum-row.discount{color:var(--ok)}

/* --- automations --- */
.auto-table-wrap{overflow-x:auto}
.auto-table{border-collapse:collapse;width:100%}
.auto-table th,.auto-table td{border-bottom:1px solid var(--border);padding:8px 10px;text-align:left;font-size:var(--fs-sm)}
.auto-table th{font-size:var(--fs-cap);color:var(--text-2);font-weight:var(--fw-semi)}
.auto-table tr.auto-off{opacity:.5}
.auto-group-head{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);font-weight:var(--fw-semi);margin:16px 0 2px}
.auto-name{font-weight:var(--fw-semi);white-space:nowrap}
.auto-status-cell{white-space:nowrap;text-align:right}
.auto-status-cell .inline{display:inline-block;margin-left:8px}
.auto-form{display:flex;flex-direction:column;gap:12px;margin-top:10px}
.auto-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.auto-form input,.auto-form select{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.auto-when-then{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auto-config{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.auto-config .cfg[hidden]{display:none}
.auto-config .cfg-full{grid-column:1 / -1}
.auto-config textarea{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit;resize:vertical}
.auto-form>button{align-self:flex-start}
@media (max-width:560px){.auto-when-then,.auto-config{grid-template-columns:1fr}}

/* view toggle + visual (flow) view */
.auto-viewtoggle{display:inline-flex;border:1px solid var(--border);border-radius:var(--r-pill);overflow:hidden;align-self:flex-start}
.auto-viewtoggle button{background:none;border:none;padding:6px 14px;font:inherit;font-size:var(--fs-sm);color:var(--text-2);cursor:pointer}
.auto-viewtoggle button.on{background:var(--accent);color:var(--white)}
.flow-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;margin:6px 0 10px}
.flow-card{border:1px solid var(--border);border-radius:var(--r-md,10px);background:var(--surface-2);padding:12px;display:flex;flex-direction:column;gap:8px}
.flow-card.auto-off{opacity:.55}
.flow-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.flow-title{font-weight:var(--fw-semi);font-size:var(--fs-sm)}
.flow-chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.flow-node{border:1px solid var(--border);border-radius:var(--r-sm);padding:4px 8px;font-size:var(--fs-cap);background:var(--surface-1)}
.flow-when{border-left:3px solid var(--accent)}
.flow-then{border-left:3px solid var(--ok)}
.flow-arrow{color:var(--text-3)}
.flow-detail{margin-top:-2px}

/* email templates / wrapper editor */
/* Email templates: full-size editor controls */
.email-template-settings .et-actions .btn,
.email-template-settings .et-test .btn,
.email-template-settings .et-revert .btn,
.email-template-settings #templateSearch{min-height:44px}
.email-template-settings .et-tpl-form input,
.email-template-settings .et-test input[type=email]{height:44px;min-height:44px}
.email-template-settings .et-fields>summary,
.email-template-settings .et-tpl>summary{min-height:44px;box-sizing:border-box}
.email-template-settings{max-width:1380px}
.email-template-settings .workspace-head{align-items:flex-end}
.et-library-score{display:flex;min-width:112px;flex-direction:column;align-items:flex-end;padding:10px 13px;
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.et-library-score strong{font:var(--fw-semi) var(--fs-xl)/1 var(--mono);color:var(--accent)}
.et-library-score span{margin-top:4px;color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.06em}
.et-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.54fr);gap:var(--s-4);align-items:start}
.et-workspace-main{display:flex;min-width:0;flex-direction:column;gap:var(--s-4)}
.et-wrapper-card,.et-fields-card,.et-template-library{min-width:0;margin:0}
.et-wrapper-card{padding:0;overflow:hidden}
.et-wrapper-summary{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:var(--s-4);cursor:pointer;list-style:none}
.et-wrapper-summary::-webkit-details-marker{display:none}
.et-wrapper-summary h2{margin:2px 0 0}
.et-wrapper-summary-meta{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.et-wrapper-edit{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.06em}
.et-wrapper-summary::after{content:"+";color:var(--accent);font:var(--fw-semi) var(--fs-lg)/1 var(--mono)}
.et-wrapper-card[open] .et-wrapper-summary::after{content:"−"}
.et-wrapper-editor{padding:0 var(--s-4) var(--s-4);border-top:1px solid var(--border-faint)}
.et-wrapper-editor>p{margin:var(--s-4) 0 var(--s-3);line-height:1.55}
.et-section-heading,.et-library-head,.et-library-meta,.et-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3)}
.et-section-heading h2,.et-library-head h2,.et-preview-head h2{margin:2px 0 0}
.et-eyebrow{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.08em;text-transform:uppercase}
.et-form{display:flex;flex-direction:column;gap:10px}
.et-form textarea{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:10px;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.82rem;line-height:1.5;resize:vertical}
.et-actions{display:flex;gap:8px;flex-wrap:wrap}
.et-save-state{display:inline-flex;align-items:center;gap:6px;margin-left:auto;color:var(--text-3);font-size:11px;white-space:nowrap}
.et-save-state>span{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 12%,transparent)}
.et-save-state b{font-weight:700}.et-save-state.dirty{color:var(--warning)}
.et-save-state.dirty>span{background:var(--warning);box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 13%,transparent)}
.et-dirty-badge{padding:2px 6px;border:1px solid color-mix(in srgb,var(--warning) 38%,var(--border));border-radius:var(--r-pill);background:color-mix(in srgb,var(--warning) 10%,transparent);color:var(--warning);font-size:10px;font-weight:800;letter-spacing:.05em}
.et-dirty-badge[hidden]{display:none}
.et-preview{display:flex;flex-direction:column;gap:8px}
.et-preview-panel{position:sticky;top:calc(var(--header-h) + var(--s-4));margin:0;min-width:0}
.et-preview-head .pill{text-transform:capitalize}
.et-preview iframe{width:100%;min-height:560px;background:var(--white);border:1px solid var(--border);border-radius:var(--r-sm)}
.et-library-head{align-items:flex-end}
.et-search-label{width:min(240px,42%)}
.et-search-label input{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.et-search-label input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.et-library-meta{align-items:baseline;margin:6px 0 12px;border-bottom:1px solid var(--border);padding-bottom:12px}
.et-library-meta p{max-width:680px;margin:0}.et-library-meta>span{flex:none}
.et-tpl{border:1px solid var(--border);border-radius:var(--r-sm);padding:10px 12px;margin-top:8px}
.et-tpl[hidden]{display:none}
.et-tpl summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;list-style-position:outside}
.et-tpl summary::marker{color:var(--accent)}
.et-tpl-summary-main{display:flex;min-width:0;flex-direction:column;gap:2px}
.et-tpl-summary-main strong{font-size:var(--fs-sm)}
.et-tpl-summary-main .tiny{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.et-tpl-summary-meta{display:flex;align-items:center;gap:7px;flex:none}
.et-key-code{color:var(--text-3);font-size:var(--fs-cap)}
.et-tpl-form{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.et-tpl-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.et-tpl-form input,.et-tpl-form textarea{width:100%;box-sizing:border-box;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.et-tpl-form textarea{font-family:ui-monospace,Menlo,monospace;font-size:.82rem;line-height:1.5;resize:vertical}
.et-revert{margin-top:6px}
.et-search-empty{display:flex;flex-direction:column;align-items:center;gap:5px;padding:32px 16px;text-align:center}
.et-search-empty[hidden]{display:none}
@media (max-width:900px){
  .et-workspace{grid-template-columns:1fr}
  .et-template-library{order:-1}
  .et-preview-panel{position:static;order:1}
  .et-preview iframe{min-height:360px;box-sizing:border-box}
}
@container workspace (max-width:900px){
  .et-workspace{grid-template-columns:1fr}
  .et-template-library{order:-1}
  .et-preview-panel{position:static;order:1}
  .et-preview iframe{min-height:360px;box-sizing:border-box}
}
@media (max-width:600px){
  .email-template-settings .workspace-head{align-items:flex-start}
  .et-library-score{align-items:flex-start}
  .et-library-head,.et-library-meta{align-items:stretch;flex-direction:column}
  .et-wrapper-summary{align-items:flex-start}.et-wrapper-summary-meta{justify-content:flex-start}
  .et-search-label{width:100%}
  .email-template-settings #templateSearch{min-height:44px}
  .et-tpl summary{align-items:flex-start;flex-direction:column}
  .et-tpl-summary-main{width:100%;max-width:100%}
  .et-tpl-summary-meta{width:100%;justify-content:space-between}
}
@container workspace (max-width:600px){
  .email-template-settings .workspace-head{align-items:flex-start}
  .et-library-score{align-items:flex-start}
  .et-library-head,.et-library-meta{align-items:stretch;flex-direction:column}
  .et-wrapper-summary{align-items:flex-start}.et-wrapper-summary-meta{justify-content:flex-start}
  .et-search-label{width:100%}
  .email-template-settings #templateSearch{min-height:44px}
  .et-tpl summary{align-items:flex-start;flex-direction:column}
  .et-tpl-summary-main{width:100%;max-width:100%}
  .et-tpl-summary-meta{width:100%;justify-content:space-between}
}

/* --- inline SVG icons --- */
.icon{width:1.1em;height:1.1em;display:inline-block;vertical-align:-0.15em;flex:none}
.mark .icon{width:1em;height:1em;vertical-align:middle}

/* --- scrollbars: soft-black (dark-mode bg) track + cyan (accent) thumb, app-wide --- */
*{scrollbar-width:thin;scrollbar-color:var(--accent) var(--bg)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:var(--accent);border-radius:6px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--accent-strong)}
::-webkit-scrollbar-corner{background:var(--bg)}
.chat-empty{color:var(--text-3);font-size:var(--fs-sm);text-align:center;margin:auto;padding:var(--s-6)}
.chat-empty-state{display:flex;max-width:270px;flex-direction:column;align-items:center;gap:8px}
.chat-empty-state::before{content:"#";display:grid;place-items:center;width:52px;height:52px;margin-bottom:4px;
  border:1px solid rgba(var(--brand-rgb),.28);border-radius:16px;background:rgba(var(--brand-rgb),.07);
  color:var(--accent);font:var(--fw-semi) 22px/1 var(--mono)}
.chat-empty-state h3{margin:0;color:var(--text);font-size:var(--fs-md)}
.chat-empty-state p{margin:0;line-height:1.55}
.chat-empty.tiny{font-size:var(--fs-cap);margin:0;padding:0}

.chat-compose{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:var(--s-2);
  padding:var(--s-3) var(--s-4);border-top:1px solid var(--border)}
.chat-compose textarea{flex:1;resize:none;max-height:120px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;
  font:var(--fw-reg) var(--fs-sm)/1.4 var(--font)}
.chat-compose textarea:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.chat-mention{position:absolute;bottom:calc(100% + 4px);left:var(--s-4);right:var(--s-4);
  background:var(--surface-3);border:1px solid var(--border-strong);border-radius:var(--r-md);
  box-shadow:var(--sh-2);max-height:180px;overflow:auto;z-index:5;padding:4px}
.chat-mention-opt{display:block;width:100%;text-align:left;background:none;border:none;color:var(--text);
  padding:7px 10px;cursor:pointer;font-size:var(--fs-sm);border-radius:var(--r-sm)}
.chat-mention-opt:hover,.chat-mention-opt.is-active{background:var(--surface-2)}

@media (max-width:520px){ .chat-panel{width:100vw;max-width:100vw} }

/* ── Notification bell ─────────────────────────────────────────────────── */
.bell-wrap{position:relative;display:inline-flex}
.tab.bell-toggle{min-width:40px;height:40px;padding:0;background:none;border:none;font:inherit;cursor:pointer;font-size:15px;line-height:1}
.bell-menu{position:absolute;top:calc(100% + 8px);right:0;width:330px;max-width:90vw;max-height:70vh;
  overflow-y:auto;z-index:210;background:var(--surface-1);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--sh-2);padding:4px}
.bell-menu[hidden]{display:none}
.alert-item{display:block;text-decoration:none;color:var(--text);padding:9px 11px;border-radius:var(--r-sm);
  border-left:2px solid transparent}
.alert-item:hover{background:var(--surface-2)}
.alert-item.unread{border-left-color:var(--accent);background:var(--selected-bg)}
.alert-top{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-2);min-width:0;flex-wrap:wrap}
.alert-label{min-width:0;font-size:var(--fs-sm);font-weight:var(--fw-med);overflow-wrap:anywhere}
.alert-target{min-width:0;font-family:var(--mono);font-size:var(--fs-cap);color:var(--accent);overflow-wrap:anywhere}
.alert-detail{min-width:0;font-size:var(--fs-cap);color:var(--text-2);margin-top:2px;overflow-wrap:anywhere}
.alert-when{font-size:10px;color:var(--text-3);margin-top:3px;font-variant-numeric:tabular-nums}
.bell-empty{padding:16px;text-align:center;color:var(--text-3);font-size:var(--fs-sm)}

/* ── Account page + password controls (A12) ────────────────────────────── */
a.whoami{text-decoration:none;cursor:pointer}
a.whoami:hover{color:var(--text)}

.account{max-width:980px;margin:0 auto;padding:var(--s-6) var(--s-5);display:flex;flex-direction:column;gap:var(--s-4)}
.account-profile{display:flex;align-items:center;gap:var(--s-4);padding:var(--s-5);border:1px solid var(--border);
  border-radius:var(--r-lg);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 8%,var(--surface-2)),var(--surface-1))}
.account-profile-mark{display:grid;place-items:center;flex:0 0 auto;width:58px;height:58px;border:1px solid var(--selected-border);
  border-radius:var(--r-lg);background:var(--selected-bg);color:var(--accent);font-size:var(--fs-h2);font-weight:var(--fw-bold)}
.account-profile-copy{min-width:0}.account-profile-copy h1{margin:3px 0 5px;font-size:var(--fs-h1);line-height:1}
.account-profile-copy p{margin:0;color:var(--text-3);overflow-wrap:anywhere}
.account-profile-status{display:flex;align-items:flex-end;flex-direction:column;gap:6px;margin-left:auto}
.account-profile-status small{color:var(--text-3);font-size:var(--fs-cap)}
.account-settings-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:var(--s-4);align-items:start}
.account-head h1{margin:0 0 var(--s-1);font-size:var(--fs-h1);font-weight:var(--fw-semi);letter-spacing:-.01em}
.account-card h2{margin:4px 0 var(--s-4);font-size:var(--fs-md);font-weight:var(--fw-semi)}
.account-form{display:flex;flex-direction:column;gap:var(--s-3)}
.account-form label{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--fs-cap);
  letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3)}
.account-form input{background:var(--surface-2);color:var(--text);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:9px 10px;font:var(--fw-reg) var(--fs-base)/1.3 var(--font)}
.account-form input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.account-form button{align-self:flex-start;margin-top:var(--s-1)}
/* Account: full-size personal settings controls */
.account-page{--hit:44px}
.account-hint{font-size:var(--fs-sm);margin:0}
.account-inbox-card{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:var(--s-5)}
.account-inbox-card>div:first-child{max-width:650px}.account-inbox-card p{margin:0;color:var(--text-3);line-height:1.5}
.account-inbox-action{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:0 0 auto;flex-wrap:wrap}
@media (max-width:760px){
  .account-settings-grid{grid-template-columns:1fr}
  .account-inbox-card{grid-column:auto;align-items:flex-start;flex-direction:column}
  .account-inbox-action{justify-content:flex-start}
  .account-profile{align-items:flex-start;flex-wrap:wrap}
  .account-profile-status{align-items:flex-start;width:100%;margin-left:74px}
}
@container workspace (max-width:640px){
  .account-settings-grid{grid-template-columns:1fr}
  .account-inbox-card{grid-column:auto;align-items:flex-start;flex-direction:column}
  .account-inbox-action{justify-content:flex-start}
  .account-profile{align-items:flex-start;flex-wrap:wrap}
  .account-profile-status{align-items:flex-start;width:100%;margin-left:74px}
}

/* Account: profile-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .account-page{gap:8px;padding:12px 12px 28px}
  .account-page>.account-profile{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px;flex-wrap:nowrap}
  .account-page .account-profile-mark{width:44px;height:44px;border-radius:13px;font-size:1.2rem}
  .account-page .account-profile-copy .workspace-kicker{display:none}
  .account-page .account-profile-copy h1{margin:0 0 3px;font-size:1.2rem}
  .account-page .account-profile-copy p{overflow:hidden;font-size:var(--fs-cap);text-overflow:ellipsis;white-space:nowrap}
  .account-page .account-profile-status{width:auto;align-items:flex-end;gap:0;margin-left:0}
  .account-page .account-profile-status small{display:none}
  .account-page .account-settings-grid{gap:8px}
  .account-page .account-card:first-child{padding:10px}
  .account-page .account-card:first-child>.workspace-kicker,
  .account-page .account-card:first-child .account-hint{display:none}
  .account-page .account-card:first-child h2{margin:0 0 6px;font-size:1rem}
  .account-page .account-card:first-child .account-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px}
  .account-page .account-card:first-child .account-form label{gap:3px}
  .account-page .account-card:first-child .btn{min-height:44px;margin:0;padding:9px 12px;white-space:nowrap}
}

.row-actions{display:flex;gap:6px;justify-content:flex-end;align-items:flex-start;flex-wrap:wrap}
.pw-reset{display:inline-block}
.pw-reset summary{list-style:none;cursor:pointer}
.pw-reset summary::-webkit-details-marker{display:none}
.pw-form{display:flex;gap:6px;margin-top:6px;justify-content:flex-end}
.pw-form input{background:var(--surface-2);color:var(--text);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:5px 8px;font:var(--fw-reg) var(--fs-sm)/1.2 var(--font);width:150px}
.pw-form input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}

/* customer tax-exempt / no-email note in the quote builder */
.cust-note{font-size:var(--fs-cap);color:var(--accent);font-weight:var(--fw-med);
  text-transform:none;letter-spacing:0;margin-left:4px}

/* ── Global search + Customers page (A22) ──────────────────────────────── */
.gsearch{position:relative;display:inline-flex}
.gsearch-in{width:180px;height:32px;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-pill);padding:0 12px;
  font:var(--fw-reg) var(--fs-sm)/1 var(--font)}
.gsearch-in:focus{outline:none;width:230px;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.gsearch-in::placeholder{color:var(--text-3)}
.gsearch-menu{position:absolute;top:calc(100% + 8px);right:0;width:320px;max-width:90vw;max-height:70vh;
  overflow-y:auto;z-index:210;background:var(--surface-1);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--sh-2);padding:4px}
.gsearch-menu[hidden]{display:none}
.gs-group{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap);
  color:var(--text-3);padding:8px 11px 3px}
.gs-item{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-2);
  text-decoration:none;color:var(--text);padding:7px 11px;border-radius:var(--r-sm)}
.gs-item:hover{background:var(--surface-2)}
.gs-label{font-size:var(--fs-sm);font-weight:var(--fw-med)}
.gs-sub{font-size:var(--fs-cap);color:var(--text-3)}
.gs-empty{padding:14px;text-align:center;color:var(--text-3);font-size:var(--fs-sm)}

.cust-actions{display:flex;justify-content:flex-end;margin-bottom:var(--s-2)}
.cust-add-msg{font-size:var(--fs-sm)}
.cust-add-msg.err{color:var(--danger)}
.customer-create-modal{align-items:center;padding:3vh 20px}
.modal-card.customer-create-card{display:flex;flex-direction:column;max-width:1040px;max-height:94vh;
  padding:0;overflow:hidden}
.customer-create-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:22px 28px;border-bottom:1px solid var(--border);background:var(--surface-2)}
.customer-create-heading h2{margin:3px 0 5px;font-size:var(--fs-h2)}
.customer-create-heading p{margin:0;color:var(--text-3);font-size:var(--fs-sm)}
.customer-step-meter{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.customer-step-meter>span{display:flex;align-items:center;gap:6px;color:var(--text-3);
  font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.customer-step-meter>span::first-letter{font-size:var(--fs-base)}
.customer-step-meter small{font:var(--fw-med) var(--fs-cap)/1 var(--font)}
.customer-step-meter i{display:block;width:42px;height:1px;background:var(--border-strong)}
.customer-step-meter .is-current,.customer-step-meter .is-complete{color:var(--accent)}
.customer-create-form{display:grid;grid-template-columns:minmax(0,1fr) 260px;
  grid-template-rows:minmax(0,1fr) auto;min-height:0;flex:1;overflow:hidden}
.customer-create-main{min-height:0;padding:28px;overflow-y:auto}
.customer-create-step[hidden]{display:none}
.customer-step-copy{margin-bottom:22px}
.customer-step-copy>span{color:var(--accent);font:var(--fw-bold) var(--fs-cap)/1 var(--mono);
  letter-spacing:.08em;text-transform:uppercase}
.customer-step-copy h3{margin:7px 0 5px;font-size:var(--fs-xl)}
.customer-step-copy p{margin:0;color:var(--text-3);font-size:var(--fs-sm)}
.customer-create-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.customer-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.customer-field[hidden]{display:none}
.customer-field>span{color:var(--text-2);font-size:var(--fs-cap);font-weight:var(--fw-semi)}
.customer-field>small{color:var(--text-3);font-size:var(--fs-cap)}
.customer-field>span b{color:var(--accent)}
.customer-field--wide{grid-column:1/-1}
.customer-field input,.customer-field select{width:100%;box-sizing:border-box;min-height:42px;
  padding:9px 11px;background:var(--surface-2);color:var(--text);border:1px solid var(--border-strong);
  border-radius:var(--r-sm);font:var(--fw-reg) var(--fs-sm)/1.2 var(--font)}
.customer-field input:focus,.customer-field select:focus{outline:none;border-color:var(--selected-border);
  box-shadow:var(--sh-focus)}
.customer-toggle-stack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:3px}
.customer-toggle{display:flex;gap:9px;align-items:flex-start;padding:12px;border:1px solid var(--border);
  border-radius:var(--r-md);background:var(--surface-2);cursor:pointer}
.customer-toggle:has(input:checked){border-color:var(--selected-border);background:var(--selected-bg)}
.customer-toggle input{margin-top:2px;accent-color:var(--accent)}
.customer-toggle>span{display:flex;flex-direction:column;gap:3px}
.customer-toggle strong{font-size:var(--fs-sm)}
.customer-toggle small{color:var(--text-3);font-size:var(--fs-cap);line-height:1.35}
.account-readiness{padding:28px 22px;background:linear-gradient(180deg,var(--selected-bg),var(--surface-2));
  border-left:1px solid var(--selected-border);display:flex;flex-direction:column;align-items:flex-start;
  overflow-y:auto}
.readiness-customer-mark{display:flex;align-items:center;justify-content:center;width:58px;height:58px;
  margin:22px 0 14px;border:1px solid var(--selected-border);border-radius:var(--r-lg);
  background:var(--surface-1);color:var(--accent);font:var(--fw-bold) var(--fs-sm)/1 var(--mono)}
.account-readiness>strong{font-size:var(--fs-lg)}
.account-readiness>small{margin-top:4px;color:var(--text-3)}
.account-readiness ul{width:100%;list-style:none;margin:24px 0 0;padding:0;border-top:1px solid var(--border)}
.account-readiness li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;
  border-bottom:1px solid var(--border-faint);font-size:var(--fs-cap)}
.account-readiness li span{color:var(--text-3)}
.account-readiness li b{font-weight:var(--fw-semi);text-align:right}
.account-readiness li b.is-on{color:var(--success-ink)}
.account-readiness li b.is-off{color:var(--warn)}
.account-readiness>p{margin:auto 0 0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.customer-create-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:9px;
  min-height:68px;padding:12px 28px;border-top:1px solid var(--border);background:var(--surface-2)}
.customer-create-actions [hidden]{display:none}
.customer-create-actions .cust-add-msg{margin-right:auto}
@media (max-width:820px){
  .customer-create-modal{align-items:flex-start;padding:12px}
  .customer-create-card .modal-x{display:grid;width:44px;height:44px;place-items:center;top:8px;right:8px}
  .customer-create-heading{align-items:flex-start;padding:20px}
  .customer-step-meter small{display:none}
  .customer-create-form{display:block;overflow-y:auto}
  .customer-create-main{min-height:0;padding:22px 20px;overflow:visible}
  .customer-create-card .customer-field input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]),
  .customer-create-card .customer-field select{min-height:44px}
  .account-readiness{border-left:0;border-top:1px solid var(--selected-border);padding:18px 20px}
  .account-readiness .readiness-customer-mark,.account-readiness>strong,.account-readiness>small,
  .account-readiness>p{display:none}
  .account-readiness ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;margin:0;border-top:0}
  .customer-toggle-stack{grid-template-columns:1fr}
  .customer-create-actions{padding:12px 20px;flex-wrap:wrap}
  .customer-create-actions .btn{min-height:44px}
}
@media (max-width:560px){
  .customer-create-heading{display:block;padding-right:48px}
  .customer-step-meter{margin-top:15px}
  .customer-create-grid{grid-template-columns:1fr}
  .customer-field--wide{grid-column:auto}
  .account-readiness ul{grid-template-columns:1fr}
  .customer-create-actions .cust-add-msg{width:100%;order:-1}
  .customer-create-actions{justify-content:stretch}
  .customer-create-actions .btn{flex:1}
}
.cust-filter{display:flex;gap:8px;align-items:center;margin:0 0 var(--s-4);padding:var(--s-3)}
.cust-filter .btn{flex:0 0 auto;justify-content:center;white-space:nowrap}
.cust-filter input{width:min(430px,100%);max-width:60vw;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 10px;
  font:var(--fw-reg) var(--fs-base)/1.3 var(--font)}
.cust-filter input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
/* Customers: full-size directory controls */
#custAddBtn,
.cust-filter .btn{min-height:44px}
.cust-filter input{height:44px}
.customer-directory-page{max-width:1440px}
.customer-directory-snapshot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:var(--s-4);overflow:hidden;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.customer-directory-snapshot article{display:flex;min-width:0;flex-direction:column;padding:15px 17px;border-left:1px solid var(--border)}
.customer-directory-snapshot article:first-child{border-left:0}.customer-directory-snapshot article.needs-attention{box-shadow:inset 0 2px 0 var(--accent)}.customer-directory-snapshot article.email-paused{box-shadow:inset 0 2px 0 var(--warn)}
.customer-directory-snapshot span{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.06em;text-transform:uppercase}
.customer-directory-snapshot strong{margin:7px 0 3px;font:var(--fw-semi) var(--fs-xl)/1 var(--mono);color:var(--text)}
.customer-directory-snapshot small{overflow:hidden;color:var(--text-3);font-size:var(--fs-cap);text-overflow:ellipsis;white-space:nowrap}
.customer-directory-table td.customer-list-name{white-space:nowrap}
@container workspace (max-width:1000px){
  .customer-directory-snapshot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .customer-directory-snapshot article:nth-child(3){border-left:0;border-top:1px solid var(--border)}
  .customer-directory-snapshot article:nth-child(4){border-top:1px solid var(--border)}
  .customer-directory-list{overflow:visible;border:0;background:transparent}
  .customer-directory-table{display:block;min-width:0}
  .customer-directory-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .customer-directory-table tbody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
  .customer-directory-table tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px var(--s-3);padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1);box-shadow:var(--sh-1)}
  .customer-directory-table tbody tr:hover{background:var(--surface-2)}
  .customer-directory-table tbody td{min-width:0;display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-3);padding:0;border:0;text-align:left}
  .customer-directory-table tbody td::before{content:attr(data-label);color:var(--text-3);font:var(--fw-semi) 10px/1.2 var(--font);letter-spacing:var(--tracking-cap);text-transform:uppercase}
  .customer-directory-table tbody td.customer-list-name{grid-column:1;grid-row:1;justify-content:flex-start;font-size:var(--fs-md)}
  .customer-directory-table tbody td.customer-list-level{grid-column:2;grid-row:1;justify-content:flex-end}
  .customer-directory-table tbody td.customer-list-name::before,.customer-directory-table tbody td.customer-list-level::before{display:none}
  .customer-directory-table tbody td.customer-list-flags{grid-column:1/-1;padding-top:9px;border-top:1px solid var(--border-faint)}
  .customer-directory-table tbody td.customer-list-orders,.customer-directory-table tbody td.customer-list-lifetime{grid-column:1}
  .customer-directory-table tbody td.customer-list-open,.customer-directory-table tbody td.customer-list-last{grid-column:2}
  .customer-directory-table tbody td.customer-list-lifetime{color:var(--text);font-weight:var(--fw-semi)}
}
@media(max-width:600px){.customer-directory-page .cust-link{display:inline-flex;align-items:center;min-height:44px}}
@container workspace (max-width:600px){.customer-directory-snapshot{grid-template-columns:1fr}.customer-directory-snapshot article{border-top:1px solid var(--border);border-left:0}.customer-directory-snapshot article:first-child{border-top:0}.customer-directory-table tbody{grid-template-columns:1fr}.customer-directory-page .cust-link{display:inline-flex;align-items:center;min-height:44px}}
/* Customers: readable phone account metrics */
@container workspace (max-width:420px){
  .customer-directory-table tbody td.customer-list-lifetime,
  .customer-directory-table tbody td.customer-list-last{grid-column:1/-1}
  .customer-directory-table tbody td.customer-list-lifetime{padding-top:9px;border-top:1px solid var(--border-faint)}
}
a.cust-link{color:var(--text);text-decoration:none;font-weight:var(--fw-med)}
a.cust-link:hover{color:var(--accent)}
.cust-flags{display:flex;gap:4px;flex-wrap:wrap}
.pill.lvl-wholesale{border-color:var(--accent-press);color:var(--accent);background:var(--selected-bg)}
.pill.lvl-retail{border-color:var(--border);color:var(--text-3)}
.tag.warn-tag{border-color:var(--warn-border);color:var(--warn);background:var(--warn-bg)}
.tag.dpi{font-size:10px}
.tag.dpi-hi{background:var(--ok-bg);border-color:var(--ok-border);color:var(--ok)}
.tag.dpi-mid{background:var(--warn-bg);border-color:var(--warn-border);color:var(--warn)}
.tag.dpi-lo{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger)}
.redraw-req{margin-top:var(--s-2)}
.redraw-req summary{list-style:none}
.redraw-req summary::-webkit-details-marker{display:none}
.redraw-form{display:flex;flex-direction:column;gap:var(--s-2);margin-top:var(--s-2)}
.redraw-form input{min-height:var(--hit-sm);padding:0 8px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-size:var(--fs-sm)}

/* ── Right-side nav drawer (☰ menu) ─────────────────────────────────────── */
.nav-scrim{position:fixed;inset:0;z-index:190;background:var(--scrim);
  opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s}
.nav-scrim.open{opacity:1;visibility:visible}
.nav-drawer{position:fixed;top:0;right:0;z-index:200;height:100vh;width:300px;max-width:88vw;
  background:var(--surface-1);border-left:1px solid var(--border);box-shadow:var(--sh-2);
  transform:translateX(100%);visibility:hidden;
  transition:transform .2s ease,visibility .2s;display:flex;flex-direction:column}
.nav-drawer.open{transform:none;visibility:visible}
.nav-drawer-head{display:flex;align-items:center;justify-content:space-between;flex:0 0 auto;
  padding:0 var(--s-4);height:var(--header-h);border-bottom:1px solid var(--border)}
.nav-drawer-head strong{font-size:var(--fs-md)}
.nav-drawer-close{background:none;border:none;color:var(--text-3);font-size:22px;line-height:1;
  cursor:pointer;padding:2px 8px}
.nav-drawer-close:hover{color:var(--text)}
.nav-drawer-body{flex:1 1 auto;overflow-y:auto;padding:var(--s-2) var(--s-3) var(--s-4)}
.nav-group{border-bottom:1px solid var(--border-faint);padding:4px 0}
.nav-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  justify-content:space-between;padding:9px 10px;font-size:var(--fs-cap);text-transform:uppercase;
  letter-spacing:var(--tracking-cap);color:var(--text-3);font-weight:var(--fw-semi)}
.nav-group>summary::-webkit-details-marker{display:none}
.nav-group>summary::after{content:"⌄";color:var(--text-3);font-size:13px;transition:transform .15s}
.nav-group[open]>summary::after{transform:rotate(180deg)}
.nav-link{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  padding:9px 12px;border-radius:var(--r-sm);color:var(--text-2);text-decoration:none;
  font-size:var(--fs-base);background:none;border:none;cursor:pointer;font:inherit}
.nav-link:hover{background:var(--surface-2);color:var(--text)}
.nav-link.on{background:var(--selected-bg);color:var(--text);font-weight:var(--fw-med)}
.nav-link .badge{margin-left:auto}
.nav-link .chat-badge{margin-left:auto}
.nav-drawer-foot{flex:0 0 auto;border-top:1px solid var(--border);padding:var(--s-3);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-2)}
.nav-drawer-foot .whoami{font-size:var(--fs-sm)}

/* search relocated into the drawer: full-width, results flow inline (no clipping) */
.drawer-search{display:block;margin:6px 6px 12px}
.drawer-search .gsearch-in{width:100%;height:36px;border-radius:var(--r-md)}
.drawer-search .gsearch-in:focus{width:100%}
.drawer-search .gsearch-menu{position:static;width:auto;max-width:none;margin-top:6px;
  box-shadow:none;max-height:340px}

/* admin: import customers upload */
.import-form{display:flex;gap:var(--s-3);align-items:center;flex-wrap:wrap;margin-top:var(--s-2)}
.import-form input[type=file]{color:var(--text-2);font-size:var(--fs-sm)}

/* colour swatch beside the colour picker (updates live; catalog has no per-colour photos) */
.color-field{display:flex;align-items:center;gap:8px}
.color-field select{flex:1;min-width:0}
.color-swatch{width:34px;height:34px;flex:0 0 auto;border-radius:var(--r-sm);
  border:1px solid var(--border-strong);box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
.color-swatch.empty{border-style:dashed;border-color:var(--border);box-shadow:none;
  background:repeating-conic-gradient(var(--surface-3) 0% 25%, var(--surface-2) 0% 50%) 50%/10px 10px}

/* Sign in with Google (login page) */
.login-or{display:flex;align-items:center;gap:10px;color:var(--text-3);font-size:var(--fs-cap);
  text-transform:uppercase;letter-spacing:var(--tracking-cap);margin:16px 0}
.login-or::before,.login-or::after{content:"";flex:1;height:1px;background:var(--border)}
/* Sign-in-with-Google button. These three colours are Google's own branding
   spec for the button, NOT ours — deliberately literal so a MerchIQ palette
   change never repaints them into something Google's guidelines disallow. */
.login-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  min-height:42px;background:#fff;color:#3c4043;border:1px solid var(--border-strong);
  border-radius:var(--r-md);font-weight:var(--fw-med);text-decoration:none}
.login-google:hover{background:#f7f8f8}

/* storage backend status (Users page) */
.storage-status{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;margin-bottom:var(--s-4);
  border-radius:var(--r-md);border:1px solid var(--border);background:var(--surface-1)}
.storage-status>div{min-width:0}
.storage-status .muted{overflow-wrap:anywhere}
.storage-status.ok{background:var(--ok-bg);border-color:var(--ok-border)}
.storage-status.warn{background:var(--warn-bg);border-color:var(--warn-border)}
.storage-dot{width:9px;height:9px;border-radius:50%;margin-top:5px;flex:0 0 auto;background:var(--warn)}
.storage-status.ok .storage-dot{background:var(--status-dot-live)}

/* Create-mockup CTA in the Files & art section */
.mockup-cta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:var(--s-3);
  padding:10px 12px;border:1px dashed var(--border-strong);border-radius:var(--r-md);background:var(--surface-2)}
.mockup-cta .muted{font-size:var(--fs-sm)}
.gen-mockup{display:inline-block}
.gen-mockup>summary{list-style:none;cursor:pointer}
.gen-mockup>summary::-webkit-details-marker{display:none}
.gen-mockup-form{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:flex-end;margin-top:var(--s-2);
  padding:var(--s-3);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm)}
.gen-mockup-form label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm)}
.gen-mockup-form select{min-height:var(--hit);padding:0 10px;background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit}
.printcalc-workspace{max-width:1120px}
.pc-card{max-width:900px}
.pc-workflow-card{padding:0;overflow:hidden}
.pc-card-head{padding:18px 20px;border-bottom:1px solid var(--border);background:linear-gradient(100deg,var(--selected-bg),transparent)}
.pc-card-head h2{margin:5px 0 3px;font-size:var(--fs-lg)}
.pc-card-head p{margin:0;color:var(--text-3);font-size:var(--fs-sm)}
.pc-inputs{display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:flex-end}
.pc-workflow-card .pc-inputs{padding:20px}
.pc-inputs label,.pc-add label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm)}
.pc-inputs select,.pc-inputs input,.pc-add input{min-height:var(--hit);padding:0 10px;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit}
.pc-result{margin-top:var(--s-4)}
.pc-workflow-card .pc-result{margin:0;padding:0 20px 20px}
.pc-setup-empty{min-height:420px}
.pc-setup-steps{display:grid;gap:8px;width:100%;margin-top:5px}
.pc-setup-steps>span{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:start;gap:9px;color:var(--text-2);font-size:var(--fs-sm)}
.pc-setup-steps>span>b{display:grid;place-items:center;width:22px;height:22px;border:1px solid var(--selected-border);border-radius:50%;background:var(--selected-bg);color:var(--accent);font:var(--fw-semi) 10px/1 var(--mono)}
.pc-setup-steps code{overflow-wrap:anywhere;color:var(--text)}
.pc-channel-preview{display:grid;gap:7px;margin-top:7px}
.pc-channel-preview small{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap)}
.pc-channel-preview>div{display:flex;flex-wrap:wrap;gap:6px}
.pc-channel-preview span{padding:5px 8px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);font-size:var(--fs-cap)}
.pc-grid td,.pc-grid th{text-align:center}
.pc-add{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:flex-end;margin-top:var(--s-3);
  padding:var(--s-3);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm)}
/* editable run grid inside the add form: the table + hint take their own full-width rows */
.pc-add>.pc-grid{flex:1 1 100%;margin:0}
.pc-add .pc-qty{width:54px;min-height:34px;padding:0 4px;text-align:center}
.pc-edit-hint{flex:1 1 100%;margin:0}
#pcGarmentMenu{max-height:180px}                    /* ~4 rows of results, then scroll */
.inv-add{display:flex;flex-wrap:wrap;gap:var(--s-2);align-items:flex-end}
.inv-add label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm)}
.inv-add input{min-height:var(--hit);padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit;max-width:130px}
.inv-add select{min-height:var(--hit);padding:0 8px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit;max-width:160px}
.inv-style-wrap{position:relative;display:inline-block}
.inv-style-wrap input{max-width:220px}
.inv-style-menu{max-width:340px}
.inv-actions{display:flex;gap:6px;align-items:center}
.inv-num{width:80px;padding:4px 6px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit;text-align:right}
.inv-table td,.inv-table th{vertical-align:middle}
.inv-low{background:color-mix(in srgb, var(--danger) 10%, transparent)}
.inv-short .inv-num{color:var(--danger);border-color:var(--danger)}
/* add-all-sizes grid */
.inv-add-grid{display:flex;flex-direction:column;gap:var(--s-3);align-items:flex-start}
.inv-add-top{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:flex-end}
.inv-add-grid label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm)}
.inv-add-grid input,.inv-add-grid select{min-height:var(--hit);padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit}
.inv-add-top .inv-style-wrap input{max-width:220px}
.inv-size-grid{display:flex;flex-wrap:wrap;gap:8px}
.inv-size-cell{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:var(--fs-cap)}
.inv-size-name{color:var(--text-2);letter-spacing:var(--tracking-cap)}
.inv-size-cell input{width:56px;padding:4px 6px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit;text-align:center}
/* collapsible style·colour groups */
.inv-group{border:1px solid var(--border);border-radius:var(--r-sm);margin-bottom:8px;background:var(--surface-1)}
.inv-group-head{display:flex;align-items:center;gap:10px;padding:10px 12px;cursor:pointer;list-style:none;user-select:none}
.inv-group-head::-webkit-details-marker{display:none}
.inv-group-caret{color:var(--text-3);transition:transform .12s;font-size:12px}
.inv-group[open] .inv-group-caret{transform:rotate(90deg)}
.inv-group-title{font-weight:var(--fw-semi)}
.inv-group-count{margin-left:auto}
.inv-group-body{padding:0 12px 12px}
.inv-alert{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap;margin:4px 0 10px}
.inv-alert-lbl{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);flex:1;min-width:220px}
.inv-alert input{min-height:var(--hit);padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit}
.inv-badge-low{background:color-mix(in srgb, var(--amber) 24%, transparent);color:var(--text)}
.inv-badge-short{background:color-mix(in srgb, var(--danger) 24%, transparent);color:var(--text)}
.flash.warn{background:color-mix(in srgb, var(--warn) 16%, transparent);border:1px solid var(--warn);display:flex;align-items:center;gap:6px}
.inv-low-flash{justify-content:space-between;gap:12px;flex-wrap:wrap}

/* Inventory control center: receiving, attention, and policy should read as one
   compact operating workflow even when team chat narrows the workspace. */
.inventory-snapshot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:hidden;
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.inventory-snapshot article{min-width:0;display:flex;flex-direction:column;padding:var(--s-4);
  border-left:1px solid var(--border-faint)}
.inventory-snapshot article:first-child{border-left:0}
.inventory-snapshot span{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;
  letter-spacing:var(--tracking-cap)}
.inventory-snapshot strong{margin:5px 0 3px;font:var(--fw-semi) 1.45rem/1 var(--mono);
  font-variant-numeric:tabular-nums}
.inventory-snapshot small{color:var(--text-3);font-size:10px;line-height:1.35}
.inventory-snapshot .needs-attention{background:var(--warn-bg)}
.inventory-snapshot .needs-attention strong{color:var(--warn)}
.inv-autopo{display:flex;align-items:center;justify-content:space-between;gap:var(--s-5);
  padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.inv-autopo-copy{min-width:0;display:flex;flex-direction:column;gap:5px}
.inv-autopo-copy strong{font-size:var(--fs-md)}
.inv-autopo-copy small{color:var(--text-3);line-height:1.45}
.inv-switch{display:flex;align-items:center;gap:8px;flex:0 0 auto;cursor:pointer;color:var(--text-2)}
.inv-switch input{position:absolute;opacity:0;pointer-events:none}
.inv-switch>span{position:relative;width:40px;height:22px;border:1px solid var(--border-strong);
  border-radius:var(--r-pill);background:var(--surface-3);transition:background var(--t-fast),border-color var(--t-fast)}
.inv-switch>span::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;
  border-radius:50%;background:var(--text-3);transition:transform var(--t-fast),background var(--t-fast)}
.inv-switch input:checked+span{border-color:var(--accent-press);background:var(--selected-bg)}
.inv-switch input:checked+span::after{transform:translateX(18px);background:var(--accent)}
.inv-switch input:focus-visible+span{box-shadow:var(--sh-focus)}
.inv-switch b{min-width:22px;font-size:var(--fs-sm)}
.inventory-receiving{display:flex;flex-direction:column;gap:var(--s-4)}
/* Inventory: full-size receiving controls */
.inventory-center .inventory-receiving .inv-add-top input:not([type=checkbox]),
.inventory-center .inventory-receiving .inv-add-top select,
.inventory-center .inventory-receiving .inv-size-cell input[type=number],
.inventory-center .inv-receiving-actions .btn,
.inventory-center .section-empty .btn{min-height:44px}
.inventory-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-5)}
.inventory-section-head h2{margin:5px 0 0}
.inventory-section-head p{max-width:48ch;margin:0;color:var(--text-3);font-size:var(--fs-sm);line-height:1.45}
.inventory-section-head.compact{align-items:center;margin-bottom:var(--s-4)}
.inv-add-grid{width:100%;gap:var(--s-4)}
.inv-add-top{width:100%;display:grid;grid-template-columns:minmax(220px,1.6fr) minmax(170px,1fr) minmax(120px,.55fr);
  gap:var(--s-3);align-items:end}
.inv-add-top label{min-width:0;color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.inv-add-top .inv-style-wrap,.inv-add-top .inv-style-wrap input,.inv-add-top select,.inv-add-top input{width:100%;max-width:none}
.inv-add-top select:disabled{color:var(--text-3);cursor:not-allowed}
.inv-size-grid{width:100%;min-height:88px;align-items:flex-end;padding:var(--s-3);
  border:1px dashed var(--border-strong);border-radius:var(--r-md);background:var(--surface-2)}
.inv-size-empty{align-self:center;color:var(--text-3);font-size:var(--fs-sm)}
.inv-size-cell{min-width:54px}
.inv-size-cell input{width:100%;min-height:38px}
.inv-receiving-actions{width:100%;display:flex;align-items:center;justify-content:space-between;
  gap:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--border-faint)}
.inv-receiving-actions p{margin:0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.inv-receiving-actions .btn{flex:0 0 auto}
@media(max-width:640px){.inventory-center .inv-switch{min-height:44px}}
@container workspace (max-width:640px){
  .inventory-snapshot{grid-template-columns:1fr}
  .inventory-snapshot article{border-left:0;border-top:1px solid var(--border-faint)}
  .inventory-snapshot article:first-child{border-top:0}
  .inv-autopo,.inventory-section-head,.inv-receiving-actions{align-items:stretch;flex-direction:column}
  .inv-add-top{grid-template-columns:1fr}
  .inventory-center .inv-size-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .inventory-center .inv-size-cell{min-width:0}
  .inv-receiving-actions .btn{justify-content:center;width:100%}
  .inventory-center .inv-switch{min-height:44px}
}

/* Inventory: stock-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .inventory-center{gap:8px;padding-top:12px}
  .inventory-center>.workspace-head{min-height:44px;align-items:flex-start;flex-direction:row;margin:0;padding:0;border-bottom:0}
  .inventory-center .workspace-kicker,
  .inventory-center>.workspace-head .workspace-subtitle{display:none}
  .inventory-center>.workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .inventory-center .inventory-snapshot{grid-template-columns:repeat(3,minmax(0,1fr))}
  .inventory-center .inventory-snapshot article{min-height:54px;padding:7px 10px;border-top:0;border-left:1px solid var(--border-faint)}
  .inventory-center .inventory-snapshot article:first-child{border-left:0}
  .inventory-center .inventory-snapshot strong{margin:3px 0 0;font-size:1.15rem}
  .inventory-center .inventory-snapshot small{display:none}
  .inventory-center .inv-autopo{min-height:44px;align-items:center;flex-direction:row;padding:0 10px}
  .inventory-center .inv-autopo-copy .workspace-kicker,
  .inventory-center .inv-autopo-copy small{display:none}
  .inventory-center .inv-autopo-copy strong{font-size:var(--fs-sm)}
  .inventory-center .inv-switch{min-height:44px}
  .inventory-center .inventory-receiving{gap:8px;padding:10px 12px}
  .inventory-center .inventory-section-head{align-items:center;flex-direction:row;gap:8px}
  .inventory-center .inventory-section-head .workspace-kicker,
  .inventory-center .inventory-section-head>p{display:none}
  .inventory-center .inventory-section-head h2{margin:0;font-size:1rem}
  .inventory-center .inv-size-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.spot-swatches{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--s-3);min-height:22px}
.spot-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 6px 4px 4px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);font-size:var(--fs-sm)}
.spot-chip i{width:18px;height:18px;border-radius:4px;border:1px solid rgba(0,0,0,.25)}
.spot-chip button{background:none;border:none;color:var(--text-2);cursor:pointer;font-size:16px;line-height:1;padding:0 2px}
.spot-add{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.spot-search-wrap{position:relative}
.spot-add input{min-height:var(--hit);padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit;min-width:220px}
.spot-menu{position:absolute;top:100%;left:0;min-width:260px;z-index:20;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);max-height:260px;overflow:auto}
.spot-menu button{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:none;color:var(--text);padding:6px 10px;cursor:pointer;font:inherit}
.spot-menu button:hover{background:var(--surface-2)}
.spot-menu i{width:16px;height:16px;border-radius:3px;border:1px solid rgba(0,0,0,.25)}
/* eyedropper: sample ink colors off the artwork */
/* Print colors: controls on top, artwork on the left, ink chips stacked on the right */
.spot-layout{display:flex;gap:var(--s-4);align-items:flex-start;margin-top:var(--s-3);flex-wrap:wrap}
.spot-art-stage{position:relative;flex:1 1 320px;max-width:520px;min-width:0}
.spot-art-stage img{display:block;max-width:100%;height:auto;border-radius:var(--r-sm)}
.spot-side{flex:1 1 190px;min-width:178px;display:flex;flex-direction:column;gap:10px}
.spot-side .spot-swatches{flex-direction:column;align-items:stretch;gap:6px;margin-bottom:0}
.spot-side .spot-chip{width:100%}
.spot-side .spot-chip button{margin-left:auto}
.spot-hint{margin:0}
#spotArtImg{display:block;max-width:100%;max-height:340px;border-radius:var(--r-sm);cursor:crosshair;user-select:none;-webkit-user-drag:none;background:var(--surface-2)}
.spot-loupe{position:absolute;transform:translate(-50%,calc(-100% - 14px));pointer-events:none;z-index:6}
.spot-loupe canvas{display:block;width:128px;height:128px;border-radius:50%;border:2px solid rgba(255,255,255,.85);box-shadow:0 3px 16px rgba(0,0,0,.55);background:#000}
.spot-loupe-lbl{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:6px;font:600 12px/1 ui-monospace,monospace;color:#f0f0f0;text-shadow:0 1px 2px #000}
.spot-loupe-lbl i{width:14px;height:14px;border-radius:3px;border:1px solid rgba(255,255,255,.5)}
/* supplier catalog page */
/* Catalog: full-size workspace controls */
.catalog-center .btn{min-height:44px}
.catalog-center .catalog-section .cat-import-form input[type=text],
.catalog-center .catalog-section .cat-import-form input[type=file],
.catalog-center .catalog-results .cat-filter input[type=text],
.catalog-center .catalog-results .cat-filter select{min-height:44px}
.catalog-center .cat-import-form input[type=file]::file-selector-button{min-height:44px}
.cat-sync-status{margin-bottom:8px}
.cat-sync-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:8px 0}
.cat-sync-name{font-weight:var(--fw-semi);min-width:64px}
.cat-filter{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.cat-filter input{flex:1;min-width:220px;min-height:var(--hit);padding:0 10px}
.cat-import-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.cat-import-form input[type=text]{flex:1;min-width:200px;min-height:var(--hit);padding:0 10px}
.cat-import-form input[type=file]{font-size:var(--fs-sm);color:var(--text-2);max-width:100%}
.cat-custom-form{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.cat-custom-form input{min-height:var(--hit);padding:0 10px;flex:1;min-width:150px}
.cat-custom-form input[name=name]{min-width:220px}
.cat-custom-form input[name=price]{max-width:110px;flex:0 0 auto}
.cat-table td.mono{font-family:var(--mono)}
.catalog-section{width:100%;max-width:none}
.catalog-snapshot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--surface-1);overflow:hidden}
.catalog-snapshot article{display:flex;flex-direction:column;gap:4px;min-height:88px;padding:15px 18px;border-right:1px solid var(--border)}
.catalog-snapshot article:last-child{border-right:0}
.catalog-snapshot span,.catalog-snapshot small{color:var(--text-3);font-size:var(--fs-cap)}
.catalog-snapshot strong{color:var(--text);font:var(--fw-bold) var(--fs-lg)/1.2 var(--mono)}
.catalog-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-3)}
.catalog-section-head h2{margin:5px 0 0;font-size:var(--fs-lg)}
.catalog-results{padding:0;overflow:hidden}
.catalog-results .cat-filter{margin:0;padding:var(--s-4);border-bottom:1px solid var(--border);background:var(--surface-2)}
.catalog-results .cat-table-wrap{margin:0}
.catalog-results>p{margin:0;padding:var(--s-3) var(--s-4)}
.catalog-empty{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;min-height:170px;padding:var(--s-5);text-align:center}
.catalog-empty strong{color:var(--text);font-size:var(--fs-md)}.catalog-empty span{max-width:580px;color:var(--text-3);font-size:var(--fs-sm)}
@media(max-width:900px){
  .catalog-snapshot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-snapshot article:nth-child(2){border-right:0}
  .catalog-snapshot article:nth-child(-n+2){border-bottom:1px solid var(--border)}
}
@media(max-width:640px){
  .cat-sync-actions{display:grid;grid-template-columns:1fr;align-items:stretch;margin:0;padding:14px 0;
    border-top:1px solid var(--border-faint)}
  .cat-sync-actions:first-of-type{border-top:0}
  .cat-sync-name{color:var(--text);font-size:var(--fs-md)}
  .cat-sync-actions .btn{width:100%;justify-content:center}
  .cat-import-form{align-items:stretch;flex-direction:column}
  .cat-import-form input[type="text"]{width:100%}
  .catalog-results .cat-filter{align-items:stretch;flex-direction:column}
  .catalog-results .cat-filter input,.catalog-results .cat-filter select,.catalog-results .cat-filter .btn{width:100%;max-width:none}
  .catalog-results .cat-filter .btn{justify-content:center}
  .catalog-snapshot{grid-template-columns:1fr}
  .catalog-snapshot article{border-top:1px solid var(--border);border-right:0}
  .catalog-snapshot article:first-child{border-top:0}
}
@media(max-width:800px){
  .cat-table-wrap,.account-panel .scroller,.inventory-center .table-wrap,.approval-card .table-wrap{overflow:visible}
  .cat-table,.customer-history-table,.inv-table,.approval-table{display:block;width:100%;min-width:0}
  .cat-table thead,.customer-history-table thead,.inv-table thead,.approval-table thead{display:none}
  .cat-table tbody,.customer-history-table tbody,.inv-table tbody,.approval-table tbody{display:flex;flex-direction:column;gap:10px}
  .cat-table tr,.customer-history-table tr,.inv-table tr,.approval-table tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 12px;padding:12px 14px;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md)}
  .cat-table td,.customer-history-table td,.inv-table td,.approval-table td{display:flex;flex-direction:column;gap:3px;min-width:0;padding:0;border:0;text-align:left}
  .cat-table td::before,.customer-history-table td::before,.inv-table td::before,.approval-table td::before{content:attr(data-label);color:var(--text-3);font:var(--fw-semi) var(--fs-cap)/1.2 var(--font);letter-spacing:var(--tracking-cap);text-transform:uppercase}
  .cat-table td:nth-child(4),.cat-table .cat-actions{grid-column:1 / -1}
  .customer-history-table td:first-child,.customer-history-table td:nth-child(2){grid-column:1 / -1}
  .customer-history-table td:first-child a{display:inline-flex;align-items:center;min-height:44px}
  .inv-table td:first-child{font-weight:var(--fw-semi)}
  .inv-table .inv-actions,.approval-table .row-actions{grid-column:1 / -1;flex-direction:row;flex-wrap:wrap}
  .inv-table .inv-num{width:100%;min-height:44px}
  .approval-grid{grid-template-columns:1fr}
  .approval-table .row-actions .btn{min-height:44px}
}
.cat-actions{white-space:nowrap;text-align:right}
.cat-actions .inline{display:inline}
.cat-linkbtn{background:none;border:none;padding:0 2px;margin:0 2px;font:inherit;font-size:var(--fs-cap);color:var(--accent);cursor:pointer}
.cat-linkbtn:hover{text-decoration:underline}
.cat-linkbtn.danger{color:var(--danger)}
.cat-custom-card{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.cat-custom-card h2{margin-bottom:4px}

/* Catalog: supplier-sync-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .catalog-center{gap:8px;padding-top:12px}
  .catalog-center>.workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0;padding:0;border-bottom:0}
  .catalog-center>.workspace-head .workspace-kicker,
  .catalog-center>.workspace-head .workspace-subtitle{display:none}
  .catalog-center>.workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .catalog-center>.workspace-head .workspace-actions{justify-content:flex-end}
  .catalog-center>.workspace-head .btn{min-height:44px;padding:9px 14px;white-space:nowrap}
  .catalog-center .catalog-snapshot{grid-template-columns:repeat(4,minmax(0,1fr))}
  .catalog-center .catalog-snapshot article{min-height:54px;padding:7px 9px;border-right:1px solid var(--border);border-bottom:0}
  .catalog-center .catalog-snapshot article:last-child{border-right:0}
  .catalog-center .catalog-snapshot strong{font-size:1.15rem}
  .catalog-center .catalog-snapshot small{display:none}
  .catalog-center .catalog-snapshot+.catalog-section{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 10px;padding:8px 10px}
  .catalog-center .catalog-section-head{margin:0;align-items:center}
  .catalog-center .catalog-section-head .workspace-kicker{display:none}
  .catalog-center .catalog-section-head h2{margin:0;font-size:1rem}
  .catalog-center .cat-sync-status{min-width:0;margin:0;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .catalog-center .cat-sync-actions{position:relative;grid-column:1/-1;display:grid;grid-template-columns:minmax(64px,1fr) auto auto;align-items:center;gap:6px;margin:0;padding:0;border-top:0}
  .catalog-center .cat-sync-actions .btn{width:auto;min-height:44px;padding:9px 11px;white-space:nowrap}
  .catalog-center .cat-sync-actions:has(>.muted) .cat-sync-name{align-self:start;padding-top:3px}
  .catalog-center .cat-sync-actions>.muted{position:absolute;left:0;bottom:3px;max-width:160px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:9px}
  .catalog-center .catalog-snapshot+.catalog-section>p{display:none}
}

/* --- custom-product modal --- */
.modal-overlay{position:fixed;inset:0;background:var(--scrim);display:flex;align-items:flex-start;justify-content:center;padding:5vh 16px;z-index:1000;overflow-y:auto}
.modal-overlay[hidden]{display:none}
body.modal-open{overflow:hidden}
.modal-card{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-lg,12px);max-width:560px;width:100%;padding:24px;position:relative;box-shadow:0 20px 60px rgba(0,0,0,.35)}
.modal-card.custom-product-card{max-height:90vh;overflow-y:auto;overscroll-behavior:contain}
.modal-x{position:absolute;top:12px;right:14px;background:none;border:none;font-size:22px;line-height:1;color:var(--text-3);cursor:pointer}
.modal-x:hover{color:var(--text)}
.cpm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}
.cpm-grid label{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.cpm-grid .cpm-full{grid-column:1 / -1}
.cpm-grid input,.cpm-grid select,.cpm-grid textarea{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit;min-width:0}
.cpm-grid textarea{resize:vertical}
.cpm-grid input[inputmode=decimal]{font-variant-numeric:tabular-nums}
.cpm-price{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.cpm-check{flex-direction:row!important;align-items:center;gap:8px!important;font-weight:var(--fw-reg)!important}
.cpm-check input{width:16px;height:16px;accent-color:var(--accent)}
.req{color:var(--danger)}
.cpm-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
@media (max-width:520px){.cpm-grid{grid-template-columns:1fr}.cpm-price{grid-template-columns:1fr}}
/* Custom product: full-size dialog controls */
.modal-overlay .custom-product-card .modal-x{display:grid;width:44px;height:44px;place-items:center;top:8px;right:8px;padding:0}
.modal-overlay .custom-product-card .cpm-grid input:not([type=checkbox]),
.modal-overlay .custom-product-card .cpm-grid select,
.modal-overlay .custom-product-card .cpm-actions .btn{min-height:44px}

/* Essentials-first customer editor shared by quote, order, job, and invoice pages. */
.customer-field-heading{display:flex;min-height:var(--hit-sm);align-items:center;justify-content:space-between;gap:10px}
.customer-edit-trigger{flex:none;min-height:var(--hit-sm);padding:4px 10px;font-size:var(--fs-cap)}
.customer-edit-trigger[hidden]{display:none}
.customer-editor-overlay{align-items:center;padding-block:24px}
.modal-card.customer-editor-card{display:flex;max-width:780px;max-height:min(900px,calc(100vh - 48px));
  padding:0;overflow:hidden;flex-direction:column;border-color:var(--border-strong)}
.customer-editor-card .modal-x{display:grid;width:44px;height:44px;place-items:center;top:10px;right:10px;z-index:2}
.customer-editor-head{padding:26px 64px 18px 28px;border-bottom:1px solid var(--border)}
.customer-editor-head h2{margin:3px 0 5px;font-size:clamp(1.35rem,2.5vw,1.75rem)}
.customer-editor-head p{margin:0;max-width:62ch;color:var(--text-3);font-size:var(--fs-sm);line-height:1.5}
.customer-editor-eyebrow{color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono);
  letter-spacing:.1em;text-transform:uppercase}
.customer-editor-form{display:flex;min-height:0;flex:1;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
.customer-editor-alert{margin:18px 28px 0;padding:10px 12px;border:1px solid var(--border);
  border-radius:var(--r-sm);background:var(--surface-2);color:var(--text-2);font-size:var(--fs-sm)}
.customer-editor-alert.is-warning{border-color:var(--warn-border);background:var(--warn-bg);color:var(--warn)}
.customer-editor-alert.is-ready{border-color:color-mix(in srgb,var(--success) 35%,var(--border))}
.customer-editor-section{min-width:0;margin:0;padding:20px 28px;border:0}
.customer-editor-section legend{margin:0 0 12px;padding:0;color:var(--text-2);
  font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.08em;text-transform:uppercase}
.customer-editor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px}
.customer-editor-grid label{display:flex;min-width:0;flex-direction:column;gap:6px;
  color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.customer-editor-grid .customer-editor-wide{grid-column:1/-1}
.customer-editor-grid input,.customer-editor-grid select{box-sizing:border-box;width:100%;min-height:44px;
  padding:8px 10px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);
  color:var(--text);font:inherit}
.customer-editor-grid input:focus,.customer-editor-grid select:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.customer-editor-grid input[type=date]{color-scheme:dark}
.customer-editor-grid .customer-editor-check{flex-direction:row;align-items:center;min-height:44px;font-weight:var(--fw-reg)}
.customer-editor-grid .customer-editor-check input{width:18px;min-height:18px;accent-color:var(--accent)}
.customer-editor-suffix{display:flex;align-items:center;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2)}
.customer-editor-suffix input{border:0;background:transparent;box-shadow:none!important}
.customer-editor-suffix>span{padding:0 12px;color:var(--text-3)}
.customer-editor-more{border-block:1px solid var(--border);background:color-mix(in srgb,var(--surface-2) 45%,transparent)}
.customer-editor-more>summary{display:flex;min-height:60px;align-items:center;justify-content:space-between;gap:18px;
  padding:10px 28px;cursor:pointer;list-style:none}
.customer-editor-more>summary::-webkit-details-marker{display:none}
.customer-editor-more>summary span:first-child{display:flex;flex-direction:column;gap:2px}
.customer-editor-more>summary small{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-reg)}
.customer-editor-more>summary span:last-child{color:var(--accent);font:var(--fw-semi) var(--fs-xl)/1 var(--mono)}
.customer-editor-more[open]>summary span:last-child{transform:rotate(45deg)}
.customer-editor-more-body{border-top:1px solid var(--border)}
.customer-editor-more-body .customer-editor-section+.customer-editor-section{border-top:1px solid var(--border-faint)}
.customer-editor-status{min-height:20px;margin:12px 28px 0;color:var(--text-3);font-size:var(--fs-sm)}
.customer-editor-status.is-error{color:var(--danger)}
.customer-editor-actions{position:sticky;bottom:0;display:flex;align-items:center;justify-content:flex-end;gap:10px;
  margin-top:auto;padding:14px 28px;border-top:1px solid var(--border);background:var(--surface-1);z-index:1}
.customer-editor-actions>a{margin-right:auto}
.customer-editor-actions>a[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
@media (max-width:620px){
  .customer-editor-overlay{align-items:flex-end;padding:0}
  .modal-card.customer-editor-card{max-height:94vh;border-radius:var(--r-lg) var(--r-lg) 0 0}
  .customer-editor-head{padding:20px 56px 14px 18px}
  .customer-editor-alert{margin:14px 18px 0}
  .customer-editor-section{padding:18px}
  .customer-editor-grid{grid-template-columns:1fr;gap:12px}
  .customer-editor-grid .customer-editor-wide{grid-column:auto}
  .customer-editor-more>summary{padding-inline:18px}
  .customer-editor-status{margin-inline:18px}
  .customer-editor-actions{display:grid;grid-template-columns:1fr 1fr;padding:12px 18px}
  .customer-editor-actions>a{grid-column:1/-1;margin:0;text-align:center}
  .customer-editor-actions .btn{justify-content:center;min-height:44px}
}
.cat-map-name{display:flex;flex-direction:column;gap:4px;font-size:var(--fs-cap);color:var(--text-2);font-weight:var(--fw-med);max-width:340px;margin-bottom:var(--s-3)}
.cat-map-name input{min-height:var(--hit);padding:0 10px}
.cat-map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s-3);margin:var(--s-2) 0 var(--s-4)}
.cat-map-field{display:flex;flex-direction:column;gap:4px}
.cat-map-lbl{font-size:var(--fs-cap);color:var(--text-2);font-weight:var(--fw-med)}
.cat-map-field select{min-height:var(--hit);padding:0 8px;width:100%}
.cat-req{color:var(--accent)}
.cat-map-actions{display:flex;gap:var(--s-3);align-items:center;flex-wrap:wrap}
.cat-table-wrap{overflow-x:auto}
.cat-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.cat-table th{text-align:left;color:var(--text-2);font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase;padding:6px 10px;border-bottom:1px solid var(--border)}
.cat-table td{padding:7px 10px;border-bottom:1px solid var(--border)}
.front-card .btn--secondary{margin-bottom:var(--s-2)}
.front-set{display:flex;gap:8px;align-items:center;margin-bottom:var(--s-2)}
.front-set input{flex:1;min-height:var(--hit);padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit}

/* ---- Job timing (production board Phase 1) ---- */
.timing-head{display:flex;flex-direction:column;gap:2px;margin-bottom:var(--s-3)}
.timing-start{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-bottom:var(--s-3)}
.timing-start-btn.suggested{border-color:var(--accent);color:var(--accent-strong)}
.timing-table td{vertical-align:middle}
.timing-running{background:var(--selected-bg)}
.timing-live{font-variant-numeric:tabular-nums}
.pill.sm.running{background:var(--selected-bg);color:var(--accent-strong);border:1px solid var(--accent);margin-left:6px}
.timing-stale{background:var(--danger-bg)}
.timing-actions{display:flex;gap:6px;justify-content:flex-end;white-space:nowrap}
.timing-edit-row>td{background:var(--surface-2);padding:var(--s-3)}
.timing-edit-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s-2)}
.timing-edit-form label{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-cap);color:var(--text-2)}
.timing-edit-form label.grow{flex:1 1 180px}
.timing-edit-form input{min-width:0;min-height:var(--hit);padding:0 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font:inherit}
.timing-start-group{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;margin-bottom:var(--s-2)}
.timing-group-label{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.05em;color:var(--text-2);min-width:104px}
.timing-start-group.suggested .timing-group-label{color:var(--accent-strong)}

/* Tag "+" add menu (order detail — show only applied tags, add the rest from here) */
.tag-add{position:relative;display:inline-flex}
.tag-add-btn{width:22px;height:22px;padding:0;border-radius:var(--r-pill);border:1px dashed var(--border-strong);
  background:transparent;color:var(--text-3);cursor:pointer;font-size:15px;line-height:1;
  display:inline-flex;align-items:center;justify-content:center}
.tag-add-btn:hover{border-color:var(--accent);color:var(--accent-strong)}
.tag-add-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:30;background:var(--surface-1);
  border:1px solid var(--border-strong);border-radius:var(--r-md);padding:6px;display:flex;flex-direction:column;
  gap:3px;min-width:170px;max-width:240px;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.tag-add-menu[hidden]{display:none}   /* the class's display:flex was overriding the hidden attribute */
.tag-add-item{background:transparent;border:1px solid transparent;border-radius:var(--r-sm);text-align:left;
  color:var(--text-2);cursor:pointer;padding:5px 9px;font-size:var(--fs-sm)}
.tag-add-item:hover{background:var(--surface-2)}
.tag-add-item:hover{border-color:var(--accent);color:var(--accent-strong)}
.tag-add-empty{color:var(--text-3);font-size:var(--fs-sm);padding:2px 6px}
.detail-tags .tag.manual.on.toggle{cursor:pointer}
.detail-tags .tag.manual.on.toggle:hover{border-color:var(--danger-border);color:var(--danger)}
.tag.artwork-tag{background:var(--selected-bg);border-color:var(--accent);color:var(--accent-strong)}
.et-test{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px}
.et-test input[type=email]{min-width:200px;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:6px 10px;font:inherit}
.et-fields summary{cursor:pointer;font-size:var(--fs-base);font-weight:var(--fw-semi)}
.et-fields-table td{padding:4px 10px}

/* Inbox rules — layered engine, rule, and reply safety controls. */
.inbox-settings{max-width:1380px}
.inbox-hero{align-items:flex-end}
.inbox-head-state{display:flex;align-items:center;gap:10px;min-width:180px;padding:10px 13px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.inbox-head-state>i{width:10px;height:10px;flex:none;border-radius:50%;background:var(--text-3);box-shadow:0 0 0 4px color-mix(in srgb,var(--text-3) 14%,transparent)}
.inbox-head-state.is-live>i{background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 15%,transparent)}
.inbox-head-state>div{display:flex;min-width:0;flex-direction:column}.inbox-head-state strong{font-size:var(--fs-sm)}
.inbox-head-state span{margin-top:2px;color:var(--text-3);font-size:var(--fs-cap)}
.inbox-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,.42fr);gap:var(--s-4);align-items:start}
.inbox-workspace-main{display:flex;min-width:0;flex-direction:column;gap:var(--s-4)}
.inbox-eyebrow{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.08em;text-transform:uppercase}
.inbox-engine{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:14px;margin:0;border-left:3px solid var(--text-3)}
.inbox-engine.is-live{border-left-color:var(--ok)}
.inbox-engine-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--border);border-radius:12px;color:var(--accent);font:var(--fw-semi) var(--fs-sm)/1 var(--mono);background:var(--surface-2)}
.inbox-engine-copy h2{margin:2px 0 4px;font-size:var(--fs-lg)}.inbox-engine-copy p{margin:0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.5}
.inbox-engine-control{display:flex;align-items:flex-end;flex-direction:column;gap:7px}.inbox-engine-control code,.inbox-engine-control small{color:var(--text-3);font-size:var(--fs-cap)}
.inbox-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-3)}
.inbox-section-head h2{margin:2px 0 0;font-size:var(--fs-lg)}
.inbox-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3);margin-top:10px}
.inbox-rule-card{display:flex;min-width:0;min-height:205px;flex-direction:column;margin:0;padding:15px;border-top:2px solid var(--border-strong)}
.inbox-rule-card.is-on{border-top-color:var(--ok)}
.inbox-rule-top,.inbox-rule-state,.inbox-template-title,.inbox-template-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--s-2)}
.inbox-rule-number{color:var(--text-3);font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.inbox-rule-card h3{margin:15px 0 5px;font-size:var(--fs-base)}.inbox-rule-card>p{margin:0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.5}
.inbox-rule-state{align-items:flex-end;margin-top:auto;padding-top:14px;border-top:1px solid var(--border-faint)}
.inbox-rule-state>span{color:var(--text-3);font-size:var(--fs-cap);line-height:1.3}.inbox-rule-state .btn{white-space:nowrap}
.inbox-settings .inbox-rule-state .btn,.inbox-settings .inbox-reply-gate .btn,.inbox-settings .inbox-template-actions .btn{min-height:44px}
.inbox-replies{margin:0}.inbox-reply-gate{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);margin:14px 0;padding:13px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.inbox-reply-gate p{max-width:680px;margin:3px 0 0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.45}
.inbox-template-heading{align-items:flex-end;margin:18px 0 9px}.inbox-template-heading>div{display:flex;flex-direction:column;gap:2px}
.inbox-template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
.inbox-template-form{display:flex;min-width:0;flex-direction:column;align-items:flex-start;padding:13px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.inbox-template-title{width:100%;margin-bottom:8px}.inbox-template-title label{color:var(--text);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.inbox-template-form textarea{width:100%;box-sizing:border-box;margin:0 0 9px;padding:9px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-1);color:var(--text);font:inherit;resize:vertical}
.inbox-template-form textarea:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.inbox-template-form.is-dirty{border-color:color-mix(in srgb,var(--warn) 55%,var(--border));box-shadow:inset 0 2px 0 color-mix(in srgb,var(--warn) 65%,transparent)}
.badge-dirty{background:var(--warn-bg);color:var(--warn);border:1px solid var(--warn-border)}
.inbox-template-actions{display:flex;width:100%;align-items:center;justify-content:space-between;gap:var(--s-2)}
.inbox-template-actions .btn{white-space:nowrap}
.inbox-template-save-state{color:var(--text-3);font-size:var(--fs-cap)}
.inbox-template-form.is-dirty .inbox-template-save-state{color:var(--warn)}
.inbox-safety{position:sticky;top:calc(var(--header-h) + var(--s-4));margin:0}.inbox-safety h2{margin:2px 0 16px}
.inbox-readiness-list{display:flex;flex-direction:column}.inbox-readiness-list>div{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-top:1px solid var(--border-faint)}
.inbox-readiness-list i{width:10px;height:10px;flex:none;margin-top:4px;border:2px solid var(--surface-1);border-radius:50%;background:var(--text-3);box-shadow:0 0 0 1px var(--border-strong)}
.inbox-readiness-list i.ready{background:var(--ok);box-shadow:0 0 0 1px color-mix(in srgb,var(--ok) 60%,var(--border-strong))}
.inbox-readiness-list span{display:flex;min-width:0;flex-direction:column}.inbox-readiness-list strong{font-size:var(--fs-sm)}.inbox-readiness-list small{margin-top:2px;color:var(--text-3)}
.inbox-safety-note,.inbox-ops-note{display:flex;flex-direction:column;gap:4px;margin-top:14px;padding:12px;border-radius:var(--r-md);font-size:var(--fs-sm)}
.inbox-safety-note{border:1px solid color-mix(in srgb,var(--ok) 25%,var(--border));background:color-mix(in srgb,var(--ok) 7%,var(--surface-2))}
.inbox-ops-note{border:1px solid color-mix(in srgb,var(--warn) 30%,var(--border));background:color-mix(in srgb,var(--warn) 6%,var(--surface-2))}
.inbox-safety-note span,.inbox-ops-note span{color:var(--text-2);font-size:var(--fs-cap);line-height:1.5}
@container workspace (max-width:1000px){.inbox-rule-grid{grid-template-columns:1fr}.inbox-rule-card{min-height:0}.inbox-rule-state{margin-top:14px}}
@container workspace (max-width:820px){.inbox-workspace{grid-template-columns:1fr}.inbox-safety{position:static}.inbox-template-grid{grid-template-columns:1fr}}
@container workspace (max-width:560px){.inbox-hero{align-items:flex-start}.inbox-head-state{width:max-content}.inbox-engine{grid-template-columns:38px minmax(0,1fr)}.inbox-engine-control{grid-column:1/-1;align-items:flex-start}.inbox-reply-gate{align-items:flex-start;flex-direction:column}.inbox-section-head{align-items:flex-start}.inbox-template-heading{align-items:flex-start;flex-direction:column}.inbox-template-actions{align-items:stretch;flex-direction:column}.inbox-template-actions .btn{justify-content:center}.inbox-template-save-state{text-align:center}}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .inbox-settings.settings-page{gap:10px;padding-top:12px}
  .inbox-settings .inbox-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:0;padding-bottom:10px}
  .inbox-settings .workspace-head-main .workspace-kicker,
  .inbox-settings .workspace-head-main .workspace-subtitle{display:none}
  .inbox-settings .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .inbox-head-state{min-width:0;padding:7px 10px}
  .inbox-engine{display:none}
  .inbox-section-head{align-items:center;flex-direction:row;gap:8px}
  .inbox-section-head .inbox-eyebrow{display:none}
  .inbox-section-head h2{margin:0;font-size:1rem}
  .inbox-rule-grid{gap:8px;margin-top:8px}
  .inbox-rule-card{min-height:0;padding:10px 12px}
  .inbox-rule-top,.inbox-rule-card>p{display:none}
  .inbox-rule-card h3{margin:0}
  .inbox-rule-state{align-items:center;margin-top:8px;padding-top:8px}
  .inbox-rule-state>span{display:none}
}

/* Lifecycle automation workbench — a compact production routing board. */
.auto-page{max-width:1280px}
.auto-page input:not([type=checkbox]):not([type=color]),.auto-page select{height:44px;min-height:44px}
.auto-hero{align-items:flex-end;margin-bottom:var(--s-5)}
.auto-kicker,.auto-eyebrow{font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
.auto-health{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-2)}
.auto-health-dot{width:9px;height:9px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 15%,transparent)}
.auto-health.is-paused .auto-health-dot{background:var(--warn);box-shadow:0 0 0 4px color-mix(in srgb,var(--warn) 15%,transparent)}
.auto-health-copy{display:flex;min-width:0;flex:1;flex-direction:column;font-size:var(--fs-sm)}
.auto-health small{color:var(--text-3)}
.auto-health-action{flex:none;white-space:nowrap}
.auto-health.is-paused .auto-health-action{border-color:color-mix(in srgb,var(--warn) 42%,var(--border));background:color-mix(in srgb,var(--warn) 6%,var(--surface-2));color:var(--text-1)}
.auto-health.is-paused .auto-health-action:hover,.auto-health.is-paused .auto-health-action:focus-visible{border-color:var(--warn);color:var(--warn)}
.auto-flow-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4);margin-bottom:var(--s-4)}
.auto-route-card{display:block;color:inherit;text-decoration:none;border:1px solid var(--border);border-radius:var(--r-lg);padding:18px;background:linear-gradient(145deg,var(--surface-2),var(--surface-1));transition:border-color .16s,transform .16s,box-shadow .16s}
.auto-route-card:hover{transform:translateY(-1px);border-color:var(--border-strong)}
.auto-route-card.is-selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent),0 10px 30px color-mix(in srgb,var(--accent) 8%,transparent)}
.auto-route-top,.auto-section-head,.auto-publish-bar,.auto-template-actions,.auto-action-row{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}
.auto-route-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:color-mix(in srgb,var(--accent) 14%,var(--surface-1));color:var(--accent);font-weight:800}
.auto-route-card h2{font-size:var(--fs-xl);margin:13px 0 2px}
.auto-route-card p{margin:0;color:var(--text-2);font-size:var(--fs-sm)}
.auto-route-stats{display:flex;gap:var(--s-4);margin-top:16px;padding-top:13px;border-top:1px solid var(--border);font-size:var(--fs-cap);color:var(--text-3)}
.auto-route-stats span{display:flex;gap:4px}.auto-route-stats b{color:var(--text)}
.auto-colors{margin-bottom:var(--s-4)}
.auto-colors>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;list-style:none}
.auto-colors>summary::-webkit-details-marker{display:none}
.auto-colors>summary h2{margin:2px 0 3px;font-size:var(--fs-lg)}
.auto-colors>summary p{margin:0}
.auto-disclosure-label{display:inline-flex;align-items:center;gap:6px}
.auto-disclosure-chevron{display:inline-block;color:var(--accent);transition:transform .16s ease}
details[open]>summary .auto-disclosure-chevron{transform:rotate(180deg)}
.auto-color-form{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.auto-color-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin-bottom:14px}
.auto-color-field{display:flex;align-items:center;gap:9px;padding:8px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.auto-color-field input[type=color]{width:44px;height:44px;flex:0 0 44px;padding:2px;border:1px solid var(--border);border-radius:9px;background:transparent;cursor:pointer}
.auto-color-field>span{display:flex;min-width:0;flex-direction:column}
.auto-color-field b{font-size:var(--fs-sm)}
.auto-color-field code{color:var(--text-3);font-size:var(--fs-cap)}
.auto-workbench{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(520px,1.6fr);gap:var(--s-4);align-items:start}
.auto-route-map{position:sticky;top:74px}
.auto-section-head h2,.auto-advanced summary h2{margin:2px 0 0;font-size:var(--fs-lg)}
.auto-rail{margin:20px 0 18px}
.auto-rail-step{position:relative;display:flex;gap:12px;min-height:54px;padding-left:2px}
.auto-rail-step:not(:last-child)::after{content:"";position:absolute;left:7px;top:16px;bottom:0;border-left:1px dashed var(--border-strong)}
.auto-rail-step i{position:relative;z-index:1;width:13px;height:13px;flex:0 0 13px;margin-top:2px;border-radius:50%;border:3px solid var(--surface-1);background:var(--stage-color,var(--text-3));box-shadow:0 0 0 1px color-mix(in srgb,var(--stage-color,var(--border-strong)) 55%,var(--border-strong))}
.auto-rail-step div{display:flex;flex-direction:column;font-size:var(--fs-sm)}
.auto-rail-step small{margin-top:2px;color:var(--text-3)}
.auto-safety-note{display:flex;flex-direction:column;gap:4px;padding:12px;border-radius:var(--r-md);background:color-mix(in srgb,var(--ok) 8%,var(--surface-2));border:1px solid color-mix(in srgb,var(--ok) 25%,var(--border));font-size:var(--fs-sm)}
.auto-safety-note span{color:var(--text-2);line-height:1.45}
.auto-editor-stack{display:flex;flex-direction:column;gap:var(--s-4);min-width:0}
.auto-schedule-rows{display:flex;flex-direction:column;gap:8px;margin:15px 0 10px}
.auto-delay-row{display:grid;grid-template-columns:28px 70px minmax(80px,130px) minmax(90px,120px) 44px;align-items:center;gap:8px;padding:8px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.auto-delay-num{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--surface-3);font-size:var(--fs-cap);font-weight:var(--fw-semi)}
.auto-delay-row input,.auto-delay-row select,.auto-html-form input,.auto-test-send input{width:100%;box-sizing:border-box;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.auto-remove-delay{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:var(--r-sm);background:none;color:var(--text-3);font-size:20px;cursor:pointer}
.auto-remove-delay:hover{color:var(--danger)}.auto-remove-delay:disabled{opacity:.25;cursor:default}
.auto-final-wait{display:grid;grid-template-columns:minmax(220px,1fr) 120px 110px;align-items:center;gap:10px;margin-top:14px;padding:12px;border:1px solid color-mix(in srgb,var(--warn) 30%,var(--border));border-radius:var(--r-md);background:color-mix(in srgb,var(--warn) 6%,var(--surface-2))}
.auto-final-wait>div{display:flex;flex-direction:column;font-size:var(--fs-sm)}
.auto-final-wait small{color:var(--text-3)}
.auto-final-wait input,.auto-final-wait select{width:100%;box-sizing:border-box;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;color:var(--text);font:inherit}
.auto-publish-bar{margin-top:15px;padding-top:14px;border-top:1px solid var(--border)}
.auto-publish-bar .btn,.btn.auto-add-delay{min-height:44px}
.auto-publish-bar>div:first-child{display:flex;flex-direction:column;font-size:var(--fs-sm)}
.auto-publish-bar small{color:var(--text-3)}
.auto-html-form>label,.auto-code-pane{display:flex;flex-direction:column;gap:5px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.auto-html-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:12px;margin-top:12px}
.auto-code-pane textarea{width:100%;min-height:420px;box-sizing:border-box;padding:12px;border:1px solid var(--border);border-radius:var(--r-md);background:#0d1117;color:#d7e2e8;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;resize:vertical;tab-size:2}
.auto-preview-pane{display:flex;min-width:0;flex-direction:column;border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;background:#fff}
.auto-preview-head{display:flex;justify-content:space-between;padding:8px 10px;background:var(--surface-2);border-bottom:1px solid var(--border);color:var(--text-2);font-size:var(--fs-cap)}
.auto-preview-state{color:var(--ok)}
.auto-preview-pane iframe{width:100%;min-height:420px;flex:1;border:0;background:#fff}
.auto-template-actions{justify-content:flex-start;margin-top:12px;flex-wrap:wrap}
.auto-template-card .badge-mode{flex:0 0 auto;white-space:nowrap}
.auto-template-actions .btn,.auto-form .btn{min-height:44px}
.auto-test-send{display:flex;align-items:end;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.auto-test-send label{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm)}
.auto-test-send input{min-width:230px}
.auto-test-send-note{margin:6px 0 0}
.auto-merge-fields{margin-top:12px;font-size:var(--fs-sm)}
.auto-merge-fields summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-2)}
.auto-merge-fields>div{display:grid;grid-template-columns:max-content 1fr;gap:5px 12px;margin-top:10px}
.auto-merge-fields code{color:var(--accent)}
.auto-history,.auto-advanced{margin-top:var(--s-4)}
.auto-empty-history{display:flex;flex-direction:column;align-items:center;padding:34px;color:var(--text-3)}
.auto-empty-history[hidden]{display:none}
.auto-empty-history b{color:var(--text-2)}
.auto-advanced>summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none}
.auto-advanced>summary::-webkit-details-marker{display:none}
.auto-advanced-body{margin-top:18px;padding-top:18px;border-top:1px solid var(--border)}
.auto-advanced-body h3{margin-top:22px}
.auto-builtins{margin-top:28px;padding-top:22px;border-top:1px solid var(--border)}
.auto-builtins-head h3{margin:3px 0 4px}
.auto-builtins-head p{margin:0}
.auto-builtin-search{display:grid;max-width:520px;gap:6px;margin-top:14px}
.auto-builtin-search label{color:var(--text-2);font-size:var(--fs-sm);font-weight:700}
.auto-builtin-search input{width:100%;min-height:44px}
.auto-builtin-search p{min-height:1.2em;margin:0}
.auto-builtin-list{display:flex;flex-direction:column;margin-top:14px;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.auto-builtin-row{display:grid;grid-template-columns:minmax(190px,.65fr) minmax(420px,1.65fr) auto;align-items:center;gap:18px;padding:14px 16px;background:var(--surface-1);transition:background .15s,opacity .15s}
.auto-builtin-row[hidden]{display:none}
.auto-builtin-row+.auto-builtin-row{border-top:1px solid var(--border)}
.auto-builtin-row:hover{background:var(--surface-2)}
.auto-builtin-row.is-off{opacity:.56}
.auto-builtin-title{display:flex;align-items:center;gap:10px;min-width:0}
.auto-builtin-title .auto-route-icon{width:28px;height:28px;flex:0 0 28px;font-size:var(--fs-cap)}
.auto-builtin-title>div{display:flex;flex-direction:column;min-width:0}
.auto-builtin-title b{font-size:var(--fs-sm)}
.auto-builtin-title small{color:var(--text-3);font-size:var(--fs-cap)}
.auto-equation{display:grid;grid-template-columns:minmax(0,1fr) 18px minmax(0,1.1fr);align-items:center;gap:10px}
.auto-equation span{display:flex;align-items:center;gap:8px;min-width:0;color:var(--text-2);font-size:var(--fs-sm);line-height:1.35}
.auto-equation i{flex:0 0 auto;padding:3px 7px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--accent) 10%,var(--surface-2));color:var(--accent);font-style:normal;font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.05em}
.auto-equation strong{color:var(--text-3);font-weight:var(--fw-reg);text-align:center}
.auto-builtin-controls{display:flex;align-items:center;justify-content:flex-end;gap:9px}
.auto-builtin-controls form{margin:0}
.auto-route-map .auto-section-head .btn,
.auto-test-send .btn,
.auto-history .auto-section-head .btn,
.auto-builtin-controls .auto-switch,
.auto-builtin-controls .btn{min-height:44px}
.auto-switch{display:inline-flex;align-items:center;gap:7px;min-width:68px;padding:5px 8px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-3);font:inherit;font-size:var(--fs-cap);cursor:pointer}
.auto-switch span{position:relative;width:24px;height:14px;border-radius:var(--r-pill);background:var(--surface-3);transition:background .15s}
.auto-switch span::after{content:"";position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:var(--text-3);transition:transform .15s,background .15s}
.auto-switch.is-on{border-color:color-mix(in srgb,var(--ok) 35%,var(--border));color:var(--ok)}
.auto-switch.is-on span{background:color-mix(in srgb,var(--ok) 32%,var(--surface-3))}
.auto-switch.is-on span::after{transform:translateX(10px);background:var(--ok)}
.auto-builtin-editor{margin-top:16px;padding:18px;border:1px solid var(--accent);border-radius:var(--r-lg);background:color-mix(in srgb,var(--accent) 4%,var(--surface-2));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 10%,transparent)}
.auto-builtin-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.auto-builtin-editor-head h3{margin:3px 0 0}
.auto-enabled-check{min-height:44px;display:flex;align-items:center;gap:7px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.auto-enabled-check input{width:17px;height:17px;accent-color:var(--accent)}
.auto-builtin-editor .btn{min-height:44px}
.auto-builtin-editor .auto-action-row .btn{white-space:nowrap}
.auto-equation-editor{display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);align-items:end;gap:10px}
.auto-equation-editor label{display:flex;flex-direction:column;gap:7px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.auto-equation-editor label>span{display:flex;align-items:center;gap:7px}
.auto-equation-editor label i{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--accent);color:var(--brand-ink);font-style:normal;font-size:var(--fs-cap)}
.auto-equation-editor select{width:100%;box-sizing:border-box;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-md);padding:11px 12px;color:var(--text);font:inherit}
.auto-equation-editor select:focus{outline:none;border-color:var(--accent);box-shadow:var(--sh-focus)}
.auto-equation-arrow{display:grid;place-items:center;height:42px;color:var(--accent);font-size:22px}
.auto-compat-note{margin:9px 0 16px}
.automation-task-page .workspace-actions .btn,.automation-task-card .auto-action-row .btn{min-height:44px}
.automation-task-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4)}
.automation-task-card{display:flex;flex-direction:column;gap:10px}
.automation-task-card h2{margin:2px 0 0;font-size:var(--fs-lg)}
.automation-task-card p{margin:0;color:var(--text-2);line-height:1.5}
.automation-task-top,.automation-task-meta{display:flex;justify-content:space-between;gap:12px}
.automation-task-meta{flex-direction:column;gap:3px;padding:10px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);color:var(--text-2);font-size:var(--fs-sm)}
.automation-task-card .auto-action-row{justify-content:flex-start;flex-wrap:wrap}
.automation-task-card form{margin:0}
.automation-task-empty{margin-top:0}
@media (max-width:980px){
  .auto-page .btn{min-height:44px}
  .auto-workbench{grid-template-columns:1fr}.auto-route-map{position:static}
  .auto-html-grid{grid-template-columns:1fr}
  .auto-builtin-row{grid-template-columns:1fr auto}
  .auto-equation{grid-column:1 / -1;grid-row:2}
}
@media (max-width:680px){
  .auto-hero{align-items:stretch;flex-direction:column;gap:12px}.auto-health{display:grid;width:100%;box-sizing:border-box;grid-template-columns:10px minmax(0,1fr);align-items:start}
  .auto-health-dot{margin-top:6px}.btn.mini.auto-health-action{grid-column:2;width:100%;min-height:44px;box-sizing:border-box;margin-top:4px;text-align:center}
  .auto-flow-picker{grid-template-columns:1fr}.auto-route-stats{justify-content:space-between}
  .auto-flow-preview .auto-section-head{align-items:stretch;flex-direction:column;gap:18px}
  .auto-flow-preview .auto-action-row{display:grid;grid-template-columns:1fr;gap:8px}
  .auto-flow-preview .auto-action-row .btn{width:100%;min-height:44px;box-sizing:border-box}
  .auto-history .auto-section-head,.auto-colors>summary,.auto-advanced>summary{align-items:flex-start;flex-direction:column;gap:10px}
  .auto-delay-row{grid-template-columns:24px 1fr 1fr 44px}.auto-delay-row>.muted{display:none}
  .auto-final-wait{grid-template-columns:1fr 1fr}.auto-final-wait>div{grid-column:1/-1}
  .auto-publish-bar,.auto-template-actions,.auto-test-send{align-items:stretch;flex-direction:column}
  .auto-action-row{width:100%}.auto-action-row .btn{flex:1}
  .auto-test-send label{align-items:flex-start;flex-direction:column}.auto-test-send input{min-width:0}
  .automation-task-grid{grid-template-columns:1fr}
  .automation-task-card .auto-action-row{align-items:stretch;flex-direction:column}
  .automation-task-card .auto-action-row .btn,.automation-task-card .auto-action-row form{width:100%;box-sizing:border-box}
  .auto-builtin-row{grid-template-columns:1fr;padding:14px}
  .auto-equation{grid-column:auto;grid-row:auto;grid-template-columns:1fr}
  .auto-equation strong{transform:rotate(90deg)}
  .auto-builtin-controls{justify-content:space-between}
  .auto-builtin-editor-head,.auto-equation-editor{grid-template-columns:1fr;display:grid}
  .auto-equation-arrow{height:20px;transform:rotate(90deg)}
}
@media (max-width:360px){
  .auto-delay-row{grid-template-columns:24px minmax(38px,.55fr) minmax(68px,1fr) 44px;gap:4px;padding:6px}
  .auto-delay-row input,.auto-delay-row select{padding-inline:6px}
}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .inbox-page .inbox-wrap{gap:10px;padding-top:12px}
  .inbox-page .inbox-wrap>.workspace-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);align-items:center;gap:10px;margin:0;padding:0 12px 10px}
  .inbox-page .workspace-head-main .workspace-kicker,
  .inbox-page .workspace-head-main .workspace-subtitle{display:none}
  .inbox-page .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .inbox-page .communications-switcher{margin:0}
  .inbox-setup-empty{grid-template-columns:44px minmax(0,1fr);align-items:center;justify-content:start;gap:10px;min-height:0;padding:10px 12px;text-align:left}
  .inbox-setup-empty .guided-empty-icon{width:44px;height:44px;margin:0;border-radius:13px}
  .inbox-setup-empty .guided-empty-icon svg{width:22px;height:22px}
  .inbox-setup-empty .guided-empty-copy{align-items:flex-start;gap:5px}
  .inbox-setup-empty .guided-empty-copy .workspace-kicker,
  .inbox-setup-empty .guided-empty-copy>p{display:none}
  .inbox-setup-empty .guided-empty-copy h2{font-size:1rem}
  .inbox-setup-empty .guided-empty-copy .btn{min-height:44px;margin-top:2px}
  .email-template-settings{gap:10px;padding-top:12px}
  .email-template-settings .workspace-head{margin-bottom:0;padding-bottom:10px}
  .email-template-settings .workspace-kicker,
  .email-template-settings .workspace-subtitle{display:none}
  .email-template-settings .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .email-template-settings .et-library-score{display:none}
  .email-template-settings .et-workspace,
  .email-template-settings .et-workspace-main{gap:10px}
  .email-template-settings .et-template-library{order:-1;padding:12px 14px}
  .email-template-settings .et-library-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,.85fr);align-items:center;gap:10px}
  .email-template-settings .et-library-head .et-eyebrow,
  .email-template-settings .et-library-meta{display:none}
  .email-template-settings .et-library-head h2{margin:0;font-size:var(--fs-md)}
  .email-template-settings .et-search-label{width:100%}
  .email-template-settings #templateSearch{min-height:44px}
  .email-template-settings .et-tpl{margin-top:8px;padding:8px 10px}
  .email-template-settings .et-tpl summary{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;min-height:44px}
  .email-template-settings .et-tpl-summary-main{width:auto;max-width:100%}
  .email-template-settings .et-tpl-summary-meta{width:auto;justify-content:flex-end}
  .email-template-settings .et-key-code{display:none}
  .auto-page{gap:10px;padding-top:12px}
  .auto-page .auto-hero{margin-bottom:0}
  .auto-page .auto-hero .auto-kicker,
  .auto-page .auto-hero .detail-sub{display:none}
  .auto-page .auto-hero h1{margin:0;font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .auto-page .auto-flow-preview{padding:12px 14px}
  .auto-page .auto-flow-preview .auto-section-head{display:grid;grid-template-columns:minmax(0,.72fr) minmax(300px,1.28fr);align-items:center;gap:12px}
  .auto-page .auto-flow-preview .auto-eyebrow,
  .auto-page .auto-flow-preview p{display:none}
  .auto-page .auto-flow-preview .auto-section-head h2{margin:0;font-size:var(--fs-md);white-space:nowrap}
  .auto-page .auto-flow-preview .auto-action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%}
  .auto-page .auto-flow-preview .auto-action-row .btn{min-height:44px;width:auto;box-sizing:border-box;padding-inline:10px;font-size:var(--fs-sm);line-height:1.2;text-align:center}
  .automation-task-page{gap:10px;padding-top:12px}
  .automation-task-page .workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px;margin-bottom:0;padding-bottom:10px}
  .automation-task-page .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .automation-task-page .workspace-kicker,.automation-task-page .workspace-subtitle{display:none}
  .automation-task-page .workspace-actions{align-self:start}
  .automation-task-page .workspace-actions .btn{min-height:44px;white-space:nowrap}
  .automation-task-page>.guided-empty{grid-template-columns:44px minmax(0,1fr);gap:10px;min-height:0;padding:10px;text-align:left}
  .automation-task-page .guided-empty-icon{width:44px;height:44px;margin:0;border-radius:13px}
  .automation-task-page .guided-empty-icon svg{width:22px;height:22px}
  .automation-task-page .guided-empty-copy{align-items:flex-start;gap:4px}
  .automation-task-page .guided-empty-copy .workspace-kicker,
  .automation-task-page .guided-empty-copy>p{display:none}
  .automation-task-page .guided-empty-copy h2{font-size:1rem}
  .automation-task-page .automation-task-grid{gap:10px}
  .automation-task-page .automation-task-card{padding:14px}
  .automation-task-page .automation-task-card .auto-action-row .btn{min-height:44px}
  .approval-page{gap:10px;padding-top:12px}
  .approval-page .workspace-head{margin-bottom:0;padding-bottom:10px}
  .approval-page .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .approval-page .workspace-head .workspace-kicker,
  .approval-page .workspace-head .workspace-subtitle{display:none}
  .approval-page .guided-empty{grid-template-columns:48px minmax(0,1fr);gap:12px;min-height:0;
    padding:12px 14px;text-align:left}
  .approval-page .guided-empty-icon{width:48px;height:48px;margin:0;border-radius:14px}
  .approval-page .guided-empty-icon svg{width:24px;height:24px}
  .approval-page .guided-empty-copy{align-items:flex-start;gap:4px}
  .approval-page .guided-empty-copy .workspace-kicker{display:none}
  .approval-page .guided-empty-copy h2{font-size:1rem}
  .approval-page .guided-empty-copy p{font-size:var(--fs-sm);line-height:1.35}
  .approval-page .approval-grid{gap:10px}
  .approval-page .approval-card{padding:14px}
  .approval-page .row-actions .btn{min-height:44px}
}
/* The automation editor can become narrower than the viewport when the navigation
   rail is open. Reflow schedule, template, task, and event-rule controls together. */
@container workspace (max-width:640px){
  .auto-hero{align-items:stretch;flex-direction:column;gap:12px}.auto-health{display:grid;width:100%;box-sizing:border-box;grid-template-columns:10px minmax(0,1fr);align-items:start}
  .auto-health-dot{margin-top:6px}.btn.mini.auto-health-action{grid-column:2;width:100%;min-height:44px;box-sizing:border-box;margin-top:4px;text-align:center}
  .auto-flow-picker{grid-template-columns:1fr}.auto-route-stats{justify-content:space-between}
  .auto-flow-preview .auto-section-head{align-items:stretch;flex-direction:column;gap:18px}
  .auto-flow-preview .auto-action-row{display:grid;grid-template-columns:1fr;gap:8px}
  .auto-flow-preview .auto-action-row .btn{width:100%;min-height:44px;box-sizing:border-box}
  .auto-history .auto-section-head,.auto-colors>summary,.auto-advanced>summary{align-items:flex-start;flex-direction:column;gap:10px}
  .auto-delay-row{grid-template-columns:24px 1fr 1fr 44px}.auto-delay-row>.muted{display:none}
  .auto-final-wait{grid-template-columns:1fr 1fr}.auto-final-wait>div{grid-column:1/-1}
  .auto-publish-bar,.auto-template-actions,.auto-test-send{align-items:stretch;flex-direction:column}
  .auto-action-row{width:100%}.auto-action-row .btn{flex:1}
  .auto-test-send label{align-items:flex-start;flex-direction:column}.auto-test-send input{min-width:0}
  .automation-task-grid{grid-template-columns:1fr}
  .automation-task-card .auto-action-row{align-items:stretch;flex-direction:column}
  .automation-task-card .auto-action-row .btn,.automation-task-card .auto-action-row form{width:100%;box-sizing:border-box}
  .auto-builtin-row{grid-template-columns:1fr;padding:14px}
  .auto-equation{grid-column:auto;grid-row:auto;grid-template-columns:1fr}
  .auto-equation strong{transform:rotate(90deg)}
  .auto-builtin-controls{justify-content:space-between}
  .auto-builtin-editor-head,.auto-equation-editor{grid-template-columns:1fr;display:grid}
  .auto-equation-arrow{height:20px;transform:rotate(90deg)}
}
@container workspace (max-width:360px){
  .auto-delay-row{grid-template-columns:24px minmax(38px,.55fr) minmax(68px,1fr) 44px;gap:4px;padding:6px}
  .auto-delay-row input,.auto-delay-row select{padding-inline:6px}
}
/* Record-payment modal. Was one unlabelled row — amount, a method <select> and a
   ref box — where the method is the field that decides what the form actually does
   (write a ledger row, or create a Stripe link). It's a visible radio row now, with
   the fields labelled and stacked. */
.pay-presets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.pay-preset{display:flex;flex-direction:column;gap:1px;padding:7px 12px;cursor:pointer;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);
  color:var(--text);font:inherit;text-align:left}
.pay-preset:hover{border-color:var(--border-strong)}
.pay-preset.is-on{border-color:var(--selected-border);background:rgba(var(--brand-rgb),.10)}
.pay-preset-lbl{font-size:var(--fs-cap);color:var(--text-3);text-transform:uppercase;letter-spacing:.04em}
.pay-preset-amt{font-size:var(--fs-sm);font-weight:var(--fw-semi)}

.pay-modal-form .pay-field{display:flex;flex-direction:column;gap:5px;min-width:0}
/* Author display:flex beats the UA sheet's [hidden]{display:none} whatever the
   specificity, so hiding the reference field for card/ACH needs saying here.
   Same trap as .rec-more on the record header. */
.pay-modal-form .pay-field[hidden]{display:none}
.pay-lbl{font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.pay-methods{display:flex;flex-wrap:wrap;gap:6px}
.pay-method{position:relative}
.pay-method input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.pay-method span{display:block;padding:7px 14px;border:1px solid var(--border);border-radius:999px;
  background:var(--surface-2);font-size:var(--fs-sm);color:var(--text-2);
  transition:border-color .12s,background .12s,color .12s}
.pay-method input:hover + span{border-color:var(--border-strong);color:var(--text)}
.pay-method input:checked + span{border-color:var(--selected-border);
  background:rgba(var(--brand-rgb),.14);color:var(--text);font-weight:var(--fw-semi)}
.pay-method input:focus-visible + span{outline:none;box-shadow:var(--sh-focus)}
.pay-actions{display:flex;gap:10px;align-items:center;margin-top:2px}
/* Stripe's Payment Element iframe. Give it room and a surface to sit on; its own
   colours come from the `appearance` option in order_detail.js, not from here —
   nothing in this file can reach inside a cross-origin iframe. */
/* Hint links ("add one in Settings › Payments") were falling through to the UA
   purple-visited default, which reads as a stale link on this palette. Same fix
   as .cust-settings-form .muted a. */
.pay-hint a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--border-strong)}
.pay-hint a:hover{border-bottom-color:var(--accent)}
.pay-element{min-height:56px;padding:2px 0}
.pay-card-field{border:1px solid var(--border);border-radius:var(--r-sm);
  padding:12px;background:var(--surface-2)}
.pay-hint{margin-top:8px}
.pm-list{list-style:none;margin:14px 0;padding:0;display:flex;flex-direction:column;gap:6px}
.pm-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm)}
.pm-name{text-transform:capitalize}
.pm-add{display:flex;gap:8px}
.pm-add input{flex:1;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;font:inherit}

/* ---- record overview header (job / quote / order / invoice / PO) ----
   The wide summary band at the top of a record page. Collapsed it answers
   "who, what state, when"; expanded it shows everything the record knows.
   Markup comes from templates/_record_header.html. */
.rec-head{position:relative;background:var(--surface-1);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:var(--s-5) var(--s-6) var(--s-4);margin-bottom:var(--s-4)}
/* Every group, dates included, on one row when there's room. */
.rec-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));
  gap:var(--s-5) var(--s-6);align-items:start}
.rec-col{display:flex;flex-direction:column;gap:var(--s-3);min-width:0}
.rec-col-t{margin:0;font-size:var(--fs-md);font-weight:var(--fw-semi);letter-spacing:-.01em;color:var(--text)}
.rec-f{display:flex;flex-direction:column;gap:3px;min-width:0}
.rec-l{font-size:var(--fs-sm);color:var(--text-3);line-height:1.3}
.rec-v{display:flex;align-items:center;gap:7px;font-size:var(--fs-md);color:var(--text);
  line-height:1.35;min-width:0;overflow-wrap:anywhere}
.rec-v.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.rec-v a{color:var(--text);text-decoration:none;border-bottom:1px solid var(--border-strong)}
.rec-v a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.rec-sub{font-size:var(--fs-sm);color:var(--text-3);overflow-wrap:anywhere}
.rec-empty{color:var(--text-3)}
.rec-empty a{color:var(--text-3);border-bottom-style:dashed}

/* initials chip; the hue is assigned per-name by record_header.js */
.rec-ava{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:var(--r-pill);
  font:var(--fw-semi) 10px/1 var(--font);letter-spacing:.02em;
  background:var(--surface-3);color:var(--text-2);
  border:1px solid var(--border)}

/* dates read as a sequence, so they get a timeline rather than more columns */
.rec-dates{min-width:190px}
.rec-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s-4)}
.rec-timeline li{position:relative;padding-left:var(--s-5)}
.rec-timeline li::before{content:"";position:absolute;left:0;top:5px;width:8px;height:8px;
  border-radius:var(--r-pill);background:var(--accent)}
.rec-timeline li.rec-empty::before{background:var(--surface-3);border:1px solid var(--border-strong)}
.rec-timeline li:not(:last-child)::after{content:"";position:absolute;left:3.5px;top:15px;bottom:calc(-1 * var(--s-4));
  width:1px;background:var(--border)}
.rec-timeline .detail-due{margin:0}
.rec-timeline .detail-due input{width:100%;max-width:170px}

/* expanded */
.rec-more{margin-top:var(--s-6);padding-top:var(--s-5);border-top:1px solid var(--border);
  display:flex;flex-direction:column;gap:var(--s-6)}
/* An author `display` beats the UA sheet's [hidden]{display:none} no matter the
   specificity, so the hidden state has to be restated here or the panel always
   renders expanded. */
.rec-more[hidden]{display:none}
.rec-sec{display:flex;flex-direction:column;gap:var(--s-3)}
.rec-sec-t{display:flex;align-items:center;gap:var(--s-3);margin:0;
  font-size:var(--fs-base);font-weight:var(--fw-semi);color:var(--text);white-space:nowrap}
.rec-sec-t::after{content:"";flex:1;height:1px;background:var(--border)}
.rec-sec-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--s-4) var(--s-6)}
.rec-note{margin:0;font-size:var(--fs-sm);color:var(--text-3);max-width:70ch}
.rec-audit{display:flex;flex-direction:column;gap:var(--s-2);padding-top:var(--s-4);
  border-top:1px solid var(--border-faint);font-size:var(--fs-sm);color:var(--text-3)}
.rec-audit div{display:flex;align-items:center;gap:7px}
.rec-audit b{color:var(--text-2);font-weight:var(--fw-med)}

.rec-toggle{position:absolute;right:var(--s-5);bottom:calc(-1 * var(--s-4));
  padding:6px 14px;border-radius:var(--r-pill);
  background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text-2);
  font:var(--fw-med) var(--fs-sm)/1 var(--font);cursor:pointer;
  transition:color var(--t-fast),border-color var(--t-fast),background var(--t-fast)}
.rec-toggle:hover{color:var(--text);border-color:var(--accent);background:var(--surface-3)}
.rec-toggle:focus-visible{outline:none;box-shadow:var(--sh-focus)}
.rec-head:has(.rec-toggle){margin-bottom:var(--s-6)}

@media (max-width:760px){
  .rec-head{padding:var(--s-4) var(--s-4) var(--s-3)}
  .rec-toggle{right:var(--s-4)}
}

/* ---- record workbench ----------------------------------------------------
   One hierarchy across quotes, sales orders, production jobs, and invoices:
   identity → lifecycle → next action → full-width work area. */
.quote-detail{max-width:1440px;margin:0 auto;padding:var(--s-6) var(--s-5) var(--s-8)}
.record-page-head{display:flex;align-items:flex-end;justify-content:space-between;
  gap:var(--s-6);margin-bottom:var(--s-4)}
.record-page-id{display:flex;flex-direction:column;gap:5px;min-width:0}
.record-page-kicker{color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.record-page-title-row{display:flex;align-items:center;gap:var(--s-3);flex-wrap:wrap}
.record-page-title-row h1{margin:0;font-size:27px;line-height:1.12;font-weight:var(--fw-semi)}
.record-page-subtitle{display:flex;align-items:center;gap:7px;color:var(--text-2);
  font-size:var(--fs-md);flex-wrap:wrap}
.record-stage-pill{display:inline-flex;align-items:center;gap:7px;padding:4px 10px;
  border-radius:var(--r-pill);
  border:1px solid color-mix(in srgb,var(--stage-color) 50%,var(--border));
  background:color-mix(in srgb,var(--stage-color) 14%,var(--surface-2));
  color:var(--text);font-size:var(--fs-sm)}
.record-stage-dot{width:7px;height:7px;border-radius:50%;background:var(--stage-color);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--stage-color) 14%,transparent)}
.record-page-actions{display:flex;align-items:flex-end;gap:var(--s-2);flex-wrap:wrap;justify-content:flex-end}
.record-open-field{display:flex;flex-direction:column;gap:4px;color:var(--text-3);
  font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap)}
.record-open-field select{min-height:var(--hit);min-width:230px;padding:0 30px 0 10px;
  border:1px solid var(--border);border-radius:var(--r-sm);
  background-color:var(--surface-2);color:var(--text);font:var(--fw-reg) var(--fs-base)/1 var(--font)}
.record-open-field select:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}

/* Quote workspace: wide screens use a compact command rail above one detail row.
   The journey is always visible; the four daily actions form one equal-width row. */
.quote-command-header{position:relative;display:flex;flex-direction:column;
  gap:var(--s-3);margin:0 0 var(--s-5);padding:var(--s-4);
  border:1px solid color-mix(in srgb,var(--stage-color) 38%,var(--border));
  border-radius:var(--r-lg);
  background:linear-gradient(125deg,color-mix(in srgb,var(--stage-color) 9%,var(--surface-1)),var(--surface-1) 48%)}
.quote-command-header.is-terminal{opacity:.9}
.quote-command-rail{display:grid;grid-template-columns:minmax(160px,.48fr) minmax(360px,1fr) minmax(476px,1.08fr);
  gap:var(--s-4);align-items:center;min-width:0}
.quote-command-identity{display:flex;flex-direction:column;gap:5px;min-width:0}
.quote-command-header .record-page-subtitle{min-width:0}
.quote-command-fields{min-width:0}
.quote-command-fields .quote-fields{display:grid;
  grid-template-columns:minmax(0,1fr) minmax(180px,.72fr) minmax(0,1.18fr);
  grid-template-areas:"customer ordered job";gap:var(--s-3)}
.quote-command-fields .quote-customer-field{grid-area:customer}
.quote-command-fields .quote-ordered-field{grid-area:ordered}
.quote-command-fields .quote-job-field{grid-area:job}
.quote-command-fields .field{display:flex;min-width:0;flex-direction:column;gap:5px}
.quote-command-fields>.quote-fields>.field>label,
.quote-command-fields .customer-field-heading>label{display:flex;min-height:var(--hit-sm);align-items:center;
  color:var(--text-3);font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.quote-command-fields input,.quote-command-fields select{box-sizing:border-box;width:100%;min-height:var(--hit);
  padding:0 10px;border:1px solid var(--border);border-radius:var(--r-sm);
  background-color:var(--surface-2);color:var(--text);font:var(--fw-reg) var(--fs-base)/1 var(--font)}
.quote-command-fields select{padding-right:28px}
.quote-command-fields input:hover,.quote-command-fields select:hover{border-color:var(--border-strong)}
.quote-command-fields input:focus,.quote-command-fields select:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.quote-command-fields .customer-field-heading{min-height:var(--hit-sm)}
.quote-command-fields .customer-edit-trigger{min-height:var(--hit-sm);padding:3px 9px}
.quote-field-optional{margin-left:5px;color:var(--text-3);font-family:var(--font);font-weight:var(--fw-reg);
  letter-spacing:0;text-transform:none}
.quote-command-guidance{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  min-width:0;padding-top:var(--s-3);border-top:1px solid var(--border-faint)}
.quote-command-copy{display:flex;flex:0 1 auto;min-width:0;align-items:baseline;gap:var(--s-3)}
.quote-command-copy strong{font-size:var(--fs-base);white-space:nowrap}
.quote-command-copy span{color:var(--text-2);font-size:var(--fs-sm);line-height:1.4}
.quote-command-checks{display:flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap}
.quote-command-checks span{display:inline-flex;align-items:center;min-height:26px;padding:3px 8px;
  border:1px solid var(--border);border-radius:var(--r-pill);font-size:var(--fs-cap);white-space:nowrap}
.quote-command-checks .is-ready{border-color:color-mix(in srgb,var(--status-dot-ok) 36%,var(--border));
  background:color-mix(in srgb,var(--status-dot-ok) 7%,var(--surface-1));color:var(--text-2)}
.quote-command-checks .is-blocked{border-color:var(--warn-border);background:var(--warn-bg);color:var(--warn)}
.quote-command-header.is-terminal .quote-command-checks{display:none}
.quote-email-activity{display:grid;grid-template-columns:minmax(240px,.85fr) minmax(420px,1.5fr) auto;
  gap:var(--s-4);align-items:center;padding:var(--s-3);border:1px solid var(--border-faint);
  border-radius:var(--r-md);background:color-mix(in srgb,var(--surface-2) 74%,transparent)}
.quote-email-activity[hidden]{display:none}
.quote-email-summary{display:grid;grid-template-columns:10px minmax(0,1fr);gap:10px;align-items:center;min-width:0}
.quote-email-signal{width:9px;height:9px;border-radius:50%;background:var(--text-3);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--text-3) 12%,transparent)}
.quote-email-activity[data-tone="positive"] .quote-email-signal{background:var(--status-dot-ok);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--status-dot-ok) 14%,transparent)}
.quote-email-activity[data-tone="attention"] .quote-email-signal{background:var(--warn);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--warn) 15%,transparent)}
.quote-email-summary>div{display:flex;min-width:0;flex-direction:column;gap:2px}
.quote-email-kicker{color:var(--text-3);font:var(--fw-semi) var(--fs-cap)/1.2 var(--mono);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.quote-email-summary strong{overflow:hidden;color:var(--text);font-size:var(--fs-sm);text-overflow:ellipsis;white-space:nowrap}
.quote-email-summary strong+span{overflow:hidden;color:var(--text-3);font-size:var(--fs-cap);text-overflow:ellipsis;white-space:nowrap}
.quote-email-milestones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;min-width:0;margin:0;padding:0;list-style:none}
.quote-email-milestones li{display:flex;min-width:0;align-items:center;gap:5px;padding:6px 7px;
  border:1px solid var(--border-faint);border-radius:var(--r-sm);color:var(--text-3);font-size:var(--fs-cap);white-space:nowrap}
.quote-email-milestones li>span{font:var(--fw-semi) 8px/1 var(--mono)}
.quote-email-milestones li.is-reached{border-color:color-mix(in srgb,var(--status-dot-ok) 30%,var(--border));color:var(--text-2)}
.quote-email-milestones li.is-current{background:color-mix(in srgb,var(--status-dot-ok) 9%,var(--surface-2));color:var(--text)}
.quote-email-history{position:relative;justify-self:end}
.quote-email-history>summary{min-height:var(--hit-sm);padding:6px 9px;border-radius:var(--r-sm);color:var(--text-2);
  font-size:var(--fs-cap);white-space:nowrap;cursor:pointer}
.quote-email-history>summary:hover{background:var(--surface-3);color:var(--text)}
.quote-email-history-panel{position:absolute;right:0;top:calc(100% + 7px);z-index:95;width:min(560px,calc(100vw - 110px));
  padding:var(--s-3);border:1px solid var(--border-strong);border-radius:var(--r-md);background:var(--surface-2);box-shadow:var(--sh-2)}
.quote-email-history-head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-2);
  color:var(--text);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.quote-email-history-list{display:flex;max-height:320px;flex-direction:column;gap:6px;overflow:auto}
.quote-email-history-row{display:grid;grid-template-columns:minmax(120px,.7fr) minmax(160px,1.3fr) auto;gap:8px;
  padding:9px;border:1px solid var(--border-faint);border-radius:var(--r-sm);background:var(--surface-1);font-size:var(--fs-cap)}
.quote-email-history-row strong{color:var(--text);font-size:var(--fs-sm)}
.quote-email-history-row span{overflow:hidden;color:var(--text-2);text-overflow:ellipsis;white-space:nowrap}
.quote-email-history-row time{color:var(--text-3);white-space:nowrap}
.quote-email-history-panel>p{margin:var(--s-2) 0 0;color:var(--text-3);font-size:11px;line-height:1.45}
.quote-journey-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;margin:0;
  padding:4px;overflow:hidden;list-style:none;background:var(--surface-0);border-radius:var(--r-sm)}
.quote-journey-steps li{display:flex;align-items:center;gap:8px;min-width:0;padding:9px 10px;
  border-radius:calc(var(--r-sm) - 2px);color:var(--text-3)}
.quote-journey-steps li.is-complete{color:var(--text-2)}
.quote-journey-steps li.is-active{background:color-mix(in srgb,var(--stage-color) 14%,var(--surface-3));color:var(--text)}
.quote-journey-index{display:grid;width:23px;height:23px;flex:0 0 23px;place-items:center;
  border:1px solid currentColor;border-radius:50%;font:var(--fw-semi) 9px/1 var(--mono)}
.quote-journey-copy{display:flex;min-width:0;flex-direction:column;gap:2px}
.quote-journey-copy small{color:inherit;font:var(--fw-semi) 8px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.quote-journey-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:var(--fs-sm);font-weight:var(--fw-med)}
.quote-journey-label-short{display:none}
.quote-command-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:var(--s-2)}
.quote-command-actions>.btn{width:100%;min-width:0;padding-inline:9px;justify-content:center;white-space:nowrap}
.quote-command-actions>.btn[disabled],.quote-command-actions>.btn.is-disabled{opacity:.46;cursor:not-allowed;pointer-events:none}
.quote-command-more{position:relative;min-width:0}
.quote-command-more.is-disabled{opacity:.46;pointer-events:none}
.quote-command-more>summary{width:100%;min-width:0;justify-content:center;padding-inline:9px;list-style:none;cursor:pointer;white-space:nowrap}
.quote-command-more>summary::-webkit-details-marker{display:none}
.quote-command-menu{position:absolute;right:0;top:calc(100% + 7px);z-index:90;display:flex;
  flex-direction:column;width:230px;padding:var(--s-2);background:var(--surface-2);
  border:1px solid var(--border-strong);border-radius:var(--r-md);box-shadow:var(--sh-2)}
.quote-command-menu-action{display:block;width:100%;padding:8px 10px;border:0;border-radius:var(--r-sm);
  background:none;color:var(--text-2);text-align:left;text-decoration:none;cursor:pointer;
  font:var(--fw-reg) var(--fs-base)/1.35 var(--font)}
.quote-command-menu-action[hidden]{display:none}
.quote-command-menu-action:hover{background:var(--surface-3);color:var(--text)}
.quote-command-menu-action:focus-visible{outline:none;background:var(--surface-3);box-shadow:var(--sh-focus)}
.quote-command-menu-action.danger{color:var(--danger)}
#decline-quote:not([hidden]){margin-top:4px;box-shadow:inset 0 1px var(--border)}

@container workspace (max-width:1360px){
  .quote-journey-label-full{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
    clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .quote-journey-label-short{display:inline}
  .quote-command-actions>.btn,.quote-command-more>summary{font-size:var(--fs-sm)}
}

@container workspace (max-width:1120px){
  .quote-command-rail{grid-template-columns:minmax(180px,.45fr) minmax(0,1fr)}
  .quote-command-rail .quote-command-actions{grid-column:1/-1}
  .quote-command-fields .quote-fields{grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr);
    grid-template-areas:"customer ordered" "job job"}
  .quote-email-activity{grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr)}
  .quote-email-history{grid-column:1/-1;justify-self:stretch}
  .quote-email-history>summary{width:max-content;margin-left:auto}
}

@container workspace (max-width:640px){
  .quote-command-header{gap:var(--s-3);padding:var(--s-3)}
  .quote-command-rail{grid-template-columns:minmax(0,1fr);gap:var(--s-2)}
  .quote-command-fields .quote-fields{grid-template-columns:minmax(0,1fr);
    grid-template-areas:"customer" "ordered" "job"}
  .quote-command-guidance{align-items:flex-start;flex-direction:column;gap:var(--s-2)}
  .quote-command-copy{align-items:flex-start;flex-direction:column;gap:3px}
  .quote-command-copy strong{white-space:normal}
  .quote-journey-steps li{justify-content:center;padding-inline:4px}
  .quote-journey-copy small{display:none}
  .quote-journey-copy strong{font-size:var(--fs-cap)}
  .quote-command-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quote-command-actions>.btn,.quote-command-more>summary{min-height:44px;font-size:var(--fs-sm)}
  .quote-command-menu-action,.quote-command-fields .customer-edit-trigger,.record-workspace--quote .record-section-head>.btn{min-height:44px}
  .quote-command-fields .customer-edit-trigger{min-width:44px;box-sizing:border-box}
  .quote-command-fields input,.quote-command-fields select{height:44px}
  .quote-command-menu{right:0;width:min(260px,calc(100vw - 94px))}
  .quote-email-activity{grid-template-columns:minmax(0,1fr);gap:var(--s-2)}
  .quote-email-milestones{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quote-email-history{grid-column:auto}
  .quote-email-history>summary{width:100%;margin:0;text-align:left}
  .quote-email-history-panel{position:static;width:auto;margin-top:5px;padding:var(--s-2);box-shadow:none}
  .quote-email-history-row{grid-template-columns:minmax(0,1fr) auto}
  .quote-email-history-row>span{grid-column:1/-1;grid-row:2}
}

/* Order workspace: the quote command surface continues after conversion. The
   lifecycle, daily actions, key details, and guidance stay in one bounded card
   so staff do not have to reconcile duplicate status panels. */
.order-command-header{gap:var(--s-3)}
.order-command-rail{display:grid;
  grid-template-columns:minmax(130px,.3fr) minmax(320px,.85fr) minmax(420px,1.15fr);
  gap:var(--s-4);align-items:center;min-width:0}
.order-command-identity{display:flex;min-width:0;flex-direction:column;gap:5px}
.order-command-identity h1{margin:0;color:var(--text);font-size:25px;line-height:1.1;font-weight:var(--fw-semi)}
.order-command-source{width:max-content;max-width:100%;overflow:hidden;color:var(--text-2);font-size:var(--fs-cap);
  text-decoration:none;text-overflow:ellipsis;white-space:nowrap}
.order-command-source:hover{color:var(--accent)}
.order-command-header .order-journey-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  width:100%;min-width:0;margin:0;padding:4px;overflow:hidden;border:0;border-radius:var(--r-sm);
  background:var(--surface-0);list-style:none}
.order-command-header .order-journey-steps li{display:flex;min-width:0;align-items:center;gap:6px;padding:8px 6px;
  border:0;border-radius:calc(var(--r-sm) - 2px);color:var(--text-3)}
.order-command-header .order-journey-steps li.is-complete{background:transparent;color:var(--text-2)}
.order-command-header .order-journey-steps li.is-active{background:color-mix(in srgb,var(--stage-color) 14%,var(--surface-3));color:var(--text)}
.order-command-header .order-journey-steps li::after{display:none}
.order-journey-index{display:grid;width:22px;height:22px;flex:0 0 22px;place-items:center;
  border:1px solid currentColor;border-radius:50%;font:var(--fw-semi) 8px/1 var(--mono)}
.order-journey-copy{display:flex;min-width:0;flex-direction:column;gap:2px}
.order-journey-copy small{color:inherit;font:var(--fw-semi) 7px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase}
.order-journey-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-cap);font-weight:var(--fw-med)}
.order-command-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:var(--s-2)}
.order-command-actions>.btn,.order-command-actions>.rec-mw>.btn,.order-command-primary>.btn,
.order-command-primary>form>.btn{width:100%;min-width:0;justify-content:center;padding-inline:8px;white-space:nowrap}
.order-command-primary,.order-command-primary>form,.order-command-actions>.rec-mw{display:flex;min-width:0;margin:0}
.order-command-complete{display:flex;width:100%;min-height:var(--hit);align-items:center;justify-content:center;
  padding:0 9px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);
  color:var(--text-2);font-size:var(--fs-sm);white-space:nowrap}
.order-command-fields{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(180px,.78fr) minmax(0,1fr) minmax(170px,.5fr);
  gap:var(--s-3);min-width:0}
.order-command-field{display:flex;min-width:0;flex-direction:column;gap:5px}
.order-command-field>span,.order-command-label-row>span{display:flex;min-height:var(--hit-sm);align-items:center;
  color:var(--text-3);font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.order-command-label-row{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:8px}
.order-command-label-row .customer-edit-trigger{min-height:var(--hit-sm);padding:3px 9px}
.order-command-field>a,.order-command-field>strong,.order-command-field>.detail-due{display:flex;box-sizing:border-box;
  width:100%;min-width:0;min-height:var(--hit);align-items:center;margin:0;padding:0 10px;overflow:hidden;
  border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text);
  font:var(--fw-reg) var(--fs-base)/1 var(--font);text-decoration:none;text-overflow:ellipsis;white-space:nowrap}
.order-command-field>a:hover{border-color:var(--border-strong);color:var(--accent)}
.order-command-field>.detail-due{padding:0}
.order-command-field>.detail-due input{box-sizing:border-box;width:100%;height:100%;min-height:var(--hit);margin:0;
  padding:0 10px;border:0;background:transparent;color:var(--text);font:inherit}
.order-command-field>.detail-due input:focus{outline:none;box-shadow:var(--sh-focus)}
.order-command-checks{justify-content:flex-end}

.order-line-items .li-list{margin-top:0}
.order-line-card{background:color-mix(in srgb,var(--surface-1) 96%,var(--accent))}
.order-line-actions{position:relative;align-items:flex-start}
.order-line-actions>form{margin:0}
.order-line-actions details{position:static}
.order-line-actions details>summary{list-style:none}
.order-line-actions details>summary::-webkit-details-marker{display:none}
.order-line-actions details[open]>summary{border-color:var(--selected-border);background:var(--selected-bg);color:var(--accent)}
.order-line-files>form{position:absolute;z-index:18;top:calc(100% + 8px);right:0;
  box-sizing:border-box;padding:var(--s-3);border:1px solid var(--border-strong);border-radius:var(--r-md);
  background:var(--surface-1);box-shadow:var(--sh-lg)}
.order-line-files>form{display:grid;width:min(330px,calc(100vw - 48px));gap:var(--s-2)}
.order-line-files>form input[type=file]{max-width:100%;font-size:var(--fs-sm)}
.order-line-files>form>a{color:var(--accent);font-size:var(--fs-sm)}
.order-editor-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-3) var(--s-5);
  align-items:center;margin-bottom:var(--s-4);padding:var(--s-5);border:1px solid var(--border-strong);
  border-radius:var(--r-lg);background:var(--surface-1)}
.order-editor-header h1{margin:var(--s-2) 0;font-size:var(--fs-h2)}
.order-editor-header p{margin:var(--s-1) 0;color:var(--text-3);line-height:1.5}
.order-editor-back{display:inline-flex;align-items:center;min-height:44px;margin-bottom:var(--s-2);color:var(--accent)}
.order-editor-header .record-page-kicker{display:block}
.order-editor-header .order-editor-context{color:var(--text);font-weight:600;overflow-wrap:anywhere}
.order-editor-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-2)}
.order-editor-actions .btn{min-height:44px;white-space:normal;text-align:center}
.order-editor-header .order-editor-notice{grid-column:1/-1;padding-top:var(--s-3);border-top:1px solid var(--border-faint);font-size:var(--fs-sm)}
.order-editor-header .save-status{grid-column:1/-1;overflow-wrap:anywhere}
.order-line-editor :is(button,a,input,select){scroll-margin-top:calc(var(--header-h) + var(--s-4))}
@container workspace (max-width:640px){
  .order-editor-header{grid-template-columns:minmax(0,1fr);padding:var(--s-3)}
  .order-editor-actions{width:100%}
}
.order-pricing-layout{align-items:stretch}
.order-pricing-note{margin:var(--s-3) 0 0;padding-top:var(--s-3);border-top:1px solid var(--border-faint);
  color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.order-payment-summary{display:grid;grid-template-columns:minmax(220px,.55fr) minmax(0,1.45fr);gap:var(--s-3) var(--s-5);
  align-items:center;margin-top:var(--s-2);padding:var(--s-4);border:1px solid var(--border);
  border-radius:var(--r-md);background:var(--surface-2)}
.order-payment-summary-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-3);min-width:0}
.order-payment-summary-head h3{margin:3px 0 0;font-size:var(--fs-md)}
.order-payment-balance{color:var(--accent);font-size:clamp(22px,2.5vw,32px);line-height:1;white-space:nowrap}
.order-payment-balance.is-paid{color:var(--ok)}
.order-payment-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));overflow:hidden;
  border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-1)}
.order-payment-metrics>div{display:grid;gap:3px;padding:10px var(--s-3);border-left:1px solid var(--border-faint)}
.order-payment-metrics>div:first-child{border-left:0}
.order-payment-metrics span{color:var(--text-3);font-size:var(--fs-cap)}
.order-payment-metrics strong{font-size:var(--fs-base)}
.order-payment-metrics .is-balance strong{color:var(--accent)}
.order-payment-summary>.pay-ledger-toggle,.order-payment-summary>.order-payment-empty{grid-column:1/-1;margin:0}
.order-payment-summary>.pay-ledger{grid-column:1/-1;border-top:1px solid var(--border-faint);padding-top:var(--s-3)}
.rec-menu-docs{min-width:270px}
.rec-menu-docs a{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4)}
.payment-dialog-host{display:contents}

@container workspace (max-width:1180px){
  .order-command-rail{grid-template-columns:minmax(150px,.32fr) minmax(0,1fr)}
  .order-command-actions{grid-column:1/-1}
}
@container workspace (max-width:900px){
  .order-command-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
  .order-pricing-layout{grid-template-columns:minmax(0,1fr)}
  .order-command-guidance{align-items:flex-start;flex-direction:column;gap:var(--s-2)}
  .order-command-copy{align-items:flex-start;flex-direction:column;gap:3px}
  .order-command-copy strong{white-space:normal}
  .order-command-checks{justify-content:flex-start}
  .order-payment-summary{grid-template-columns:minmax(0,1fr)}
  .order-payment-summary>.pay-ledger-toggle,.order-payment-summary>.pay-ledger,.order-payment-summary>.order-payment-empty{grid-column:1}
}
@container workspace (max-width:640px){
  .order-command-rail{grid-template-columns:minmax(0,1fr);gap:var(--s-2)}
  .order-command-header .order-journey-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .order-command-header .order-journey-steps li{justify-content:center;padding-inline:4px;border:0}
  .order-journey-copy small{display:none}
  .order-command-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .order-command-actions>.btn,.order-command-actions>.rec-mw>.btn,.order-command-primary>.btn,
  .order-command-primary>form>.btn,.order-command-complete{min-height:44px;font-size:var(--fs-sm)}
  .order-command-actions .rec-menu{right:0;left:auto;width:min(260px,calc(100vw - 94px))}
  .order-command-fields{grid-template-columns:minmax(0,1fr)}
  .order-command-label-row .customer-edit-trigger{min-width:44px;min-height:44px;box-sizing:border-box}
  .order-command-field>a,.order-command-field>strong,.order-command-field>.detail-due,
  .order-command-field>.detail-due input{min-height:44px}
  .order-command-checks{justify-content:flex-start}
  .order-payment-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .order-payment-metrics>div:nth-child(3){border-left:0;border-top:1px solid var(--border-faint)}
  .order-payment-metrics>div:nth-child(4){border-top:1px solid var(--border-faint)}
  .order-payment-summary-head{align-items:flex-start;flex-direction:column}
  .order-payment-summary>.pay-ledger{margin-inline:calc(-1 * var(--s-2));padding-inline:var(--s-2)}
  .order-line-files>form{left:0;right:0;width:100%}
}

.record-lifecycle-rail{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));
  margin:0 0 var(--s-4);padding:0;list-style:none;overflow:hidden;
  border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.record-lifecycle-rail li{position:relative;display:flex;flex-direction:column;gap:4px;
  min-width:0;padding:10px 12px;border-right:1px solid var(--border);color:var(--text-3)}
.record-lifecycle-rail li:last-child{border-right:0}
.record-lifecycle-rail small{font:var(--fw-med) 10px/1 var(--mono);color:inherit}
.record-lifecycle-rail strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-size:var(--fs-sm);font-weight:var(--fw-med)}
.record-lifecycle-rail li.is-complete{color:var(--text-2);
  background:color-mix(in srgb,var(--status-dot-ok) 5%,var(--surface-1))}
.record-lifecycle-rail li.is-active{color:var(--text);
  background:color-mix(in srgb,var(--stage-color) 12%,var(--surface-1))}
.record-lifecycle-rail.is-terminal li{opacity:.46}
.record-lifecycle-rail li.is-complete::after,.record-lifecycle-rail li.is-active::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--status-dot-ok)}
.record-lifecycle-rail li.is-active::after{background:var(--stage-color)}

.record-section-head,.record-summary-head{display:flex;align-items:flex-start;
  justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-4)}
.record-section-head>div,.record-summary-head>div{
  display:grid;grid-template-columns:auto 1fr;column-gap:9px;align-items:center}
.record-section-head h2,.record-summary-head h2{
  margin:0;font-size:var(--fs-md);font-weight:var(--fw-semi)}
.record-section-head p{
  grid-column:2;margin:3px 0 0;color:var(--text-3);font-size:var(--fs-sm)}
.record-section-number{color:var(--accent);font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
.record-workspace{display:grid;gap:var(--s-5);align-items:start;min-width:0}
.record-workspace--quote,.record-workspace--order{grid-template-columns:minmax(0,1fr)}
.order-record-content,.record-work-main{display:flex;flex-direction:column;gap:var(--s-5);min-width:0}
.record-section{
  scroll-margin-top:calc(var(--header-h) + var(--s-5))}
.record-section{
  padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-lg);
  background:var(--surface-1)}
.record-section .lines{gap:var(--s-3)}
.record-section .line{background:var(--surface-2)}
.quote-record-summary{position:static;grid-column:1;width:100%;top:auto;scroll-margin-top:calc(var(--header-h) + var(--s-5))}
.quote-record-summary h2{font-size:var(--fs-md);letter-spacing:0;text-transform:none;color:var(--text)}
.quote-pricing-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);
  gap:var(--s-5);align-items:start}
.quote-pricing-lines,.quote-pricing-totals{min-width:0;padding:var(--s-4);border:1px solid var(--border-faint);
  border-radius:var(--r-md);background:var(--surface-2)}
.quote-pricing-label{display:block;margin-bottom:var(--s-3);color:var(--text-3);
  font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.quote-pricing-lines .sum-lines{border-bottom:0;padding-bottom:0}
.quote-pricing-totals{display:flex;flex-direction:column;gap:var(--s-3)}
.quote-record-summary .warns{margin-top:var(--s-3)}
.record-summary-state{padding:2px 7px;border:1px solid var(--selected-border);
  border-radius:var(--r-pill);background:var(--selected-bg);color:var(--accent);
  font-size:var(--fs-cap)}
.record-summary-controls{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.admin-cost-view-control{display:inline-flex}
.admin-cost-view-trigger{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:5px 10px;
  border:1px solid var(--border-strong);border-radius:var(--r-pill);background:var(--surface-2);
  color:var(--text-2);font:var(--fw-semi) var(--fs-cap)/1 var(--font);cursor:pointer;
  transition:border-color var(--t-fast),background var(--t-fast),color var(--t-fast)}
.admin-cost-view-trigger:hover{border-color:var(--selected-border);color:var(--text)}
.admin-cost-view-trigger:focus-visible{outline:none;box-shadow:var(--sh-focus)}
.admin-cost-view-trigger.is-unlocked{border-color:var(--selected-border);background:var(--selected-bg);color:var(--accent)}
.admin-cost-view-dot{width:7px;height:7px;border-radius:50%;background:var(--text-3);box-shadow:0 0 0 3px color-mix(in srgb,var(--text-3) 14%,transparent)}
.admin-cost-view-trigger.is-unlocked .admin-cost-view-dot{background:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.admin-cost-view-dialog{width:min(460px,calc(100vw - 24px));max-height:calc(100vh - 32px);overflow:auto;
  padding:22px;border:1px solid var(--selected-border);border-radius:var(--r-lg);background:var(--surface-1);
  color:var(--text);box-shadow:0 24px 72px rgba(0,0,0,.48)}
.admin-cost-view-dialog::backdrop{background:rgba(5,8,9,.78);backdrop-filter:blur(3px)}
.admin-cost-view-dialog [hidden]{display:none!important}
.admin-cost-view-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.admin-cost-view-dialog-head h2{margin:4px 0 0;font-size:var(--fs-xl)}
.admin-cost-view-intro{margin:16px 0 20px;color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.admin-cost-view-form{display:grid;gap:8px}
.admin-cost-view-form label{color:var(--text-3);font-size:var(--fs-cap);letter-spacing:var(--tracking-cap);text-transform:uppercase}
.admin-cost-view-form input{width:100%;min-height:var(--hit);padding:0 12px;border:1px solid var(--border);
  border-radius:var(--r-sm);background:var(--surface-2);color:var(--text);font:var(--fw-reg) var(--fs-lg)/1 var(--mono);letter-spacing:.18em}
.admin-cost-view-form input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.admin-cost-view-form .btn{justify-self:start;margin-top:8px}
.admin-cost-view-open-state{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;
  padding:14px;border:1px solid var(--selected-border);border-radius:var(--r-md);background:var(--selected-bg)}
.admin-cost-view-open-copy{display:flex;flex-direction:column;gap:4px}
.admin-cost-view-open-copy strong{color:var(--accent)}
.admin-cost-view-open-copy span{color:var(--text-2);font-size:var(--fs-cap);line-height:1.4}
.admin-cost-view-change{grid-column:1/-1;border-top:1px solid var(--border-faint);padding-top:10px}
.admin-cost-view-change summary{color:var(--text-2);font-size:var(--fs-cap);cursor:pointer}
.admin-cost-view-change .admin-cost-view-form{margin-top:12px}
.admin-cost-view-status{min-height:20px;margin:14px 0 0;color:var(--text-2);font-size:var(--fs-cap);line-height:1.4}
.admin-cost-view-status.is-error{color:var(--danger)}
.saved-price-summary{display:grid;grid-template-columns:1fr auto;gap:7px 12px;
  padding:14px;border:1px solid var(--selected-border);border-radius:var(--r-md);
  background:var(--selected-bg)}
.saved-price-summary .saved-price-label{color:var(--text-2);font-size:var(--fs-sm)}
.saved-price-summary strong{color:var(--accent);font-size:var(--fs-lg)}
.saved-price-summary p{grid-column:1/-1;margin:0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.record-workspace--order .card,.record-workspace--order .prod-band,
.record-workspace--order .po-strip{scroll-margin-top:calc(var(--header-h) + var(--s-5))}

@media (max-width:1040px){
  .quote-pricing-layout{grid-template-columns:minmax(0,1fr)}
}
@container workspace (max-width:760px){
  .quote-pricing-layout{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:760px){
  .quote-detail{padding:var(--s-4) var(--s-3) var(--s-8)}
  .record-page-head{align-items:flex-start;flex-direction:column}
  .record-page-actions{width:100%;justify-content:flex-start}
  .record-open-field{flex:1;min-width:0}
  .record-summary-controls{width:100%;justify-content:flex-start}
  .admin-cost-view-trigger,.admin-cost-view-form .btn{min-height:44px}
  .admin-cost-view-form input{height:44px;min-height:44px}
  .admin-cost-view-dialog .dialog-close{width:44px;height:44px}
  .admin-cost-view-dialog{padding:18px}
  .admin-cost-view-open-state{grid-template-columns:minmax(0,1fr)}
  .record-open-field select{width:100%;min-width:0}
  .record-page-title-row h1{font-size:22px}
  .record-lifecycle-rail{grid-template-columns:repeat(3,1fr)}
  .record-lifecycle-rail li:nth-child(3){border-right:0}
  .record-lifecycle-rail li:nth-child(-n+3){border-bottom:1px solid var(--border)}
  .record-section{padding:var(--s-3)}
  .quote-pricing-lines,.quote-pricing-totals{padding:var(--s-3)}
  .record-section-head{align-items:stretch;flex-direction:column}
  .record-section-head>.btn{width:100%;justify-content:center}
}
@container workspace (max-width:740px){
  .record-lifecycle-rail{grid-template-columns:repeat(3,1fr)}
  .record-lifecycle-rail li:nth-child(3){border-right:0}
  .record-lifecycle-rail li:nth-child(-n+3){border-bottom:1px solid var(--border)}
}

/* ---- record action bar (title + every action for this record) ---- */
.rec-topbar{display:flex;align-items:flex-start;justify-content:space-between;
  gap:var(--s-5);flex-wrap:wrap;margin-bottom:var(--s-4)}
.rec-id{display:flex;flex-direction:column;gap:var(--s-2);min-width:0}
.rec-back{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;border-radius:var(--r-pill);
  background:var(--selected-bg);border:1px solid var(--selected-border);
  color:var(--accent);text-decoration:none;
  font:var(--fw-semi) var(--fs-sm)/1.4 var(--mono)}
.rec-back:hover{background:var(--surface-3);color:var(--accent-strong)}
.rec-title{margin:0;font-size:26px;line-height:1.1;letter-spacing:-.01em;font-weight:var(--fw-semi)}
.rec-subtitle{font-size:var(--fs-lg);color:var(--text-2);overflow-wrap:anywhere}
.rec-flags{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:2px}
.pill-warn{border-color:var(--warn-border);background:var(--warn-bg);color:var(--warn)}

.rec-actions{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap}
.rec-icon{display:inline-flex;align-items:center;justify-content:center;
  width:var(--hit);height:var(--hit);padding:0;line-height:1}
.rec-icon .icon{width:16px;height:16px}

/* A+B lifecycle control: one obvious next action with its blocker/readiness
   checks in the same strip. --stage-color comes from the admin palette. */
.next-step-bar{display:grid;grid-template-columns:minmax(130px,.45fr) minmax(260px,1.15fr) minmax(180px,.75fr) auto;align-items:center;gap:18px;margin:0 0 var(--s-4);padding:14px 16px;border:1px solid color-mix(in srgb,var(--stage-color) 42%,var(--border));border-left:4px solid var(--stage-color);border-radius:var(--r-lg);background:linear-gradient(110deg,color-mix(in srgb,var(--stage-color) 10%,var(--surface-1)),var(--surface-1) 48%)}
.next-step-state{display:flex;align-items:center;gap:10px;min-width:0}
.next-step-dot{width:12px;height:12px;flex:0 0 12px;border-radius:50%;background:var(--stage-color);box-shadow:0 0 0 5px color-mix(in srgb,var(--stage-color) 16%,transparent)}
.next-step-state>div,.next-step-copy{display:flex;min-width:0;flex-direction:column}
.next-step-state small{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);letter-spacing:.06em;text-transform:uppercase}
.next-step-state b{font-size:var(--fs-md)}
.next-step-copy{gap:3px}
.next-step-copy strong{font-size:var(--fs-md)}
.next-step-copy span{color:var(--text-2);font-size:var(--fs-sm);line-height:1.4}
.next-step-checks{display:flex;flex-direction:column;gap:4px;color:var(--text-2);font-size:var(--fs-cap)}
.next-step-checks span::first-letter{color:var(--stage-color)}
.next-step-checks .is-ready{color:var(--text-2)}
.next-step-checks .is-blocked{color:var(--warn)}
.next-step-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.next-step-actions [hidden]{display:none}
.next-step-actions form{margin:0}
.next-step-bar.is-terminal{opacity:.78}
.next-step-bar.is-terminal .next-step-checks{display:none}

@media (max-width:1040px){
  .next-step-bar{grid-template-columns:minmax(130px,.5fr) minmax(260px,1fr) auto}
  .next-step-checks{grid-column:2}
  .next-step-actions{grid-column:3;grid-row:1 / span 2}
}

/* dropdown menus (print + overflow) */
.rec-mw{position:relative}
.rec-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:80;min-width:210px;
  display:flex;flex-direction:column;padding:var(--s-2);
  background:var(--surface-2);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--sh-2)}
.rec-menu[hidden]{display:none}
.rec-menu-wide{min-width:262px}
.rec-menu a,.rec-mi{display:block;width:100%;text-align:left;
  padding:7px 10px;border:0;border-radius:var(--r-sm);background:none;
  color:var(--text-2);text-decoration:none;cursor:pointer;
  font:var(--fw-reg) var(--fs-base)/1.4 var(--font)}
.rec-menu a:hover,.rec-mi:hover{background:var(--surface-3);color:var(--text)}
.rec-mi.danger{color:var(--danger)}
.rec-mi.danger:hover{background:var(--danger-bg);color:var(--danger)}
.rec-mi:focus-visible,.rec-menu a:focus-visible{outline:none;box-shadow:var(--sh-focus)}
.rec-mg{padding:9px 10px 3px;font:var(--fw-semi) var(--fs-cap)/1 var(--font);
  letter-spacing:var(--tracking-cap);text-transform:uppercase;color:var(--text-3)}
.rec-msep{height:1px;margin:var(--s-2) 4px;background:var(--border)}
.rec-mi-form{display:flex;flex-direction:column;gap:4px;padding:0 4px 4px}
.rec-mi-form .po-supplier-in{width:100%}

/* edit-key-details modal */
.rec-edit-form{display:flex;flex-direction:column;gap:var(--s-2);margin-bottom:var(--s-4)}
.rec-edit-form label{display:flex;flex-direction:column;gap:5px;font-size:var(--fs-sm);color:var(--text-2)}
/* MerchIQ styles inputs per component rather than globally, so these have to
   be stated or they fall back to the browser's white default on the dark card. */
.rec-edit-form input,.rec-edit-form textarea{width:100%;
  background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:8px 10px;color:var(--text);font:inherit;resize:vertical}
.rec-edit-form input:focus,.rec-edit-form textarea:focus{outline:none;
  border-color:var(--selected-border);box-shadow:var(--sh-focus)}
.rec-edit-actions{display:flex;justify-content:flex-end}

@media (max-width:760px){
  .rec-topbar{flex-direction:column}
  .rec-actions{width:100%}
  .rec-actions>.btn,.rec-actions>.rec-mw>.btn{min-height:44px}
  .rec-actions .rec-icon{width:44px;height:44px}
  .rec-menu{right:auto;left:0}
  .order-command-actions .rec-menu{right:0;left:auto;width:min(260px,calc(100vw - 94px))}
  .rec-menu a,.rec-mi{display:flex;align-items:center;min-height:44px}
  .next-step-bar{grid-template-columns:1fr;gap:12px;padding:14px}
  .next-step-checks,.next-step-actions{grid-column:auto;grid-row:auto}
  .next-step-actions{justify-content:flex-start}
  .next-step-actions .btn,.next-step-actions form{width:100%;box-sizing:border-box}
  .next-step-actions form .btn{width:100%}
}
@container workspace (max-width:640px){
  .rec-head{padding:var(--s-4) var(--s-4) var(--s-3)}
  .rec-toggle{right:var(--s-4)}
  .quote-detail{padding:var(--s-4) var(--s-3) var(--s-8)}
  .record-page-head{align-items:flex-start;flex-direction:column}
  .record-page-actions{width:100%;justify-content:flex-start}
  .record-open-field{flex:1;min-width:0}
  .record-open-field select{width:100%;min-width:0}
  .record-page-title-row h1{font-size:22px}
  .record-lifecycle-rail{grid-template-columns:repeat(3,1fr)}
  .record-lifecycle-rail li:nth-child(3){border-right:0}
  .record-lifecycle-rail li:nth-child(-n+3){border-bottom:1px solid var(--border)}
  .record-section{padding:var(--s-3)}
  .record-section-head{align-items:stretch;flex-direction:column}
  .record-section-head>.btn{width:100%;justify-content:center}
  .rec-topbar{flex-direction:column}
  .rec-actions{width:100%}
  .rec-menu{right:auto;left:0}
  .next-step-bar{grid-template-columns:1fr;gap:12px;padding:14px}
  .next-step-checks,.next-step-actions{grid-column:auto;grid-row:auto}
  .next-step-actions{justify-content:flex-start}
  .next-step-actions .btn,.next-step-actions form{width:100%;box-sizing:border-box}
  .next-step-actions form .btn{width:100%}
}
@container workspace (max-width:410px){
  /* The collapsed global rail leaves roughly 326px on a 390px phone. Two
     lifecycle columns keep every production stage on one readable line. */
  .record-lifecycle-rail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .record-lifecycle-rail li{border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
  .record-lifecycle-rail li:nth-child(even){border-right:0}
  .record-lifecycle-rail li:nth-child(n+5){border-bottom:0}
}
/* The overflow button is the record's "everything else" — the reference gives
   it the accent fill so it reads as a control, not punctuation. */
.rec-icon.rec-more-btn{background:var(--accent);border-color:var(--accent);
  color:var(--text-on-accent);font-size:19px;font-weight:var(--fw-semi);
  letter-spacing:.05em;padding-bottom:6px}
.rec-icon.rec-more-btn:hover{background:var(--accent-strong);border-color:var(--accent-strong)}

/* Payments in the summary: the numbers always readable, the ledger on request. */
.pay-ledger-toggle{align-self:flex-start;padding:5px 11px;border-radius:var(--r-pill);
  background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text-2);
  font:var(--fw-med) var(--fs-sm)/1 var(--font);cursor:pointer}
.pay-ledger-toggle:hover{color:var(--text);border-color:var(--accent)}
.pay-ledger-toggle:focus-visible{outline:none;box-shadow:var(--sh-focus)}
.pay-ledger{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
.pay-ledger[hidden]{display:none}

/* ---- line item cards ---- */
.li-list{display:flex;flex-direction:column;gap:var(--s-3)}
.li-card{display:flex;gap:var(--s-4);align-items:flex-start;
  padding:var(--s-3);background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-md)}
.li-art{flex:0 0 auto;width:62px;height:62px;border-radius:var(--r-sm);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
  background:var(--surface-3);border:1px dashed var(--border-strong);
  color:var(--text-3);text-decoration:none;
  font:var(--fw-semi) var(--fs-cap)/1 var(--font);letter-spacing:var(--tracking-cap);
  text-transform:uppercase;transition:color var(--t-fast),border-color var(--t-fast)}
.li-art:hover{color:var(--accent);border-color:var(--accent)}
.li-art .icon{width:18px;height:18px}
.li-art-stack{flex:0 0 78px;display:flex;flex-direction:column;align-items:center;gap:6px}
.li-art.has-file{border-style:solid}
.li-art img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}
.li-upload{position:relative;width:100%;text-align:center}
.li-upload summary{cursor:pointer;color:var(--accent);font-size:var(--fs-cap);list-style:none}
.li-upload summary::-webkit-details-marker{display:none}
.li-upload form{position:absolute;z-index:8;top:24px;left:0;width:270px;padding:var(--s-3);
  display:flex;flex-direction:column;gap:var(--s-2);text-align:left;
  background:var(--surface-1);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--sh-lg)}
.li-upload input[type=file]{max-width:100%;font-size:var(--fs-sm)}
.line-file-tag{text-decoration:none;color:var(--accent)}
.line-file-tag.shared{color:var(--text-3)}
.li-body{display:flex;flex:1 1 auto;flex-direction:column;gap:5px;min-width:0}
.li-name{font-size:var(--fs-lg);font-weight:var(--fw-semi);letter-spacing:-.01em;color:var(--text)}
.li-desc{font-size:var(--fs-sm)}
.li-run-total{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  color:var(--text-3);font-size:var(--fs-sm)}
.li-run-total strong{color:var(--accent);font-size:var(--fs-lg)}
.li-garment-list{display:flex;flex-direction:column;border:1px solid var(--border-faint);
  border-radius:var(--r-sm);overflow:hidden}
.li-garment-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.72fr);
  gap:var(--s-3);align-items:start;padding:8px 10px;font-size:var(--fs-sm);background:var(--surface-1)}
.li-garment-row+.li-garment-row{border-top:1px solid var(--border-faint)}
.li-garment-core{display:grid;grid-template-columns:minmax(160px,1fr) minmax(180px,1fr) auto auto;gap:var(--s-3);align-items:center}
.li-size-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(40px,auto);gap:5px;overflow-x:auto;padding:1px 0 3px}
.li-size-cell{display:grid;grid-template-rows:auto auto;place-items:center;min-width:40px;overflow:hidden;
  border:1px solid var(--border-faint);border-radius:var(--r-sm);background:var(--surface-2)}
.li-size-cell>span{width:100%;padding:3px 5px;border-bottom:1px solid var(--border-faint);
  color:var(--text-3);font:var(--fw-semi) 10px/1 var(--mono);text-align:center}
.li-size-cell>strong{padding:5px;color:var(--text);font-size:var(--fs-sm)}
.li-garment-row form{margin:0}
.order-garment-price-ledger{font-size:var(--fs-sm)}
.li-add-garment{position:relative}
.li-add-garment>summary{list-style:none;cursor:pointer;white-space:nowrap}
.li-add-garment>summary::-webkit-details-marker{display:none}
.li-add-garment>form{position:absolute;z-index:12;top:calc(100% + 6px);right:0;width:min(520px,80vw);
  display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-3);background:var(--surface-1);
  border:1px solid var(--border-strong);border-radius:var(--r-md);box-shadow:var(--sh-lg)}
.li-add-garment>form>label{display:flex;flex-direction:column;gap:4px;color:var(--text-3);font-size:var(--fs-cap)}
.li-add-garment input{min-height:var(--hit-sm)}
.li-add-size-grid{display:grid;grid-template-columns:repeat(8,minmax(42px,1fr));gap:5px}
.li-add-size-grid label{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--text-3);font-size:10px}
.li-add-size-grid input{width:100%;padding:0 4px;text-align:center}
.li-add-garment small{color:var(--text-3)}
.li-sizes{display:flex;flex-wrap:wrap;gap:var(--s-3);font-size:var(--fs-md);color:var(--text-2)}
.li-sizes .li-qty{color:var(--text);font-weight:var(--fw-semi)}
.li-chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.li-card-actions{display:flex;flex:0 0 auto;align-items:flex-end;gap:var(--s-2)}
.li-card-actions form{margin:0}
.li-color-form{display:flex;flex-direction:column;gap:4px}
.li-color-form label{color:var(--text-3);font-size:var(--fs-cap);
  letter-spacing:var(--tracking-cap);text-transform:uppercase}
.li-color-form>div{display:flex;align-items:center;gap:var(--s-1)}
.li-color-form input{width:132px;min-height:var(--hit-sm);padding:0 8px;
  background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);
  color:var(--text);font:inherit}
.li-color-form input:focus{outline:none;border-color:var(--selected-border);box-shadow:var(--sh-focus)}

@media (max-width:980px){
  .li-card{flex-wrap:wrap}
  .li-card-actions{width:100%;padding-left:78px;flex-wrap:wrap}
  .li-garment-row{grid-template-columns:1fr}
}

@media (max-width:760px){
  .li-garment-row{grid-template-columns:1fr}
  .li-garment-core{grid-template-columns:1fr auto}
  .li-size-grid{grid-column:1/-1;grid-row:2}
  .li-add-size-grid{grid-template-columns:repeat(4,minmax(42px,1fr))}
}
@container workspace (max-width:640px){
  .li-card-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;padding-left:0;align-items:end}
  .li-card-actions form,.li-card-actions .btn,.li-add-garment,.li-add-garment>summary{width:100%;box-sizing:border-box}
  .li-color-form{grid-column:1/-1}
  .li-color-form>div{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .li-color-form input{width:100%;min-width:0}
}

/* ---- production band ----
   Stage · which departments touch this job · workflow flags. The line the floor
   reads, so the method chips are solid and the flags stay quiet behind them. */
.prod-band{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-3) var(--s-4);
  padding:10px var(--s-4);background:var(--surface-1);
  border:1px solid var(--border);border-left:3px solid var(--stage-color,var(--accent));
  border-radius:var(--r-md)}
.pb-grp{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-2);min-width:0}
.pb-label{font:var(--fw-semi) var(--fs-cap)/1 var(--font);letter-spacing:var(--tracking-cap);
  text-transform:uppercase;color:var(--text-3);white-space:nowrap}
.pb-sep{width:1px;align-self:stretch;background:var(--border);margin:0 var(--s-1)}

.pb-stage{padding:4px 12px;border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--stage-color,var(--accent)) 14%,var(--surface-3));
  border:1px solid color-mix(in srgb,var(--stage-color,var(--accent)) 48%,var(--border-strong));color:var(--text);
  font:var(--fw-semi) var(--fs-sm)/1.35 var(--font);text-transform:capitalize;white-space:nowrap}

/* Methods are derived and not editable — solid, so they read as instruction. */
.pb-method{padding:5px 12px;border-radius:var(--r-sm);
  background:var(--accent);color:var(--text-on-accent);
  font:var(--fw-semi) var(--fs-sm)/1.35 var(--font);text-transform:capitalize;white-space:nowrap}
.pb-none{font-size:var(--fs-sm);color:var(--text-3)}

/* Flags are editable — outlined, and each carries its own remove affordance. */
.prod-band .tag.manual.on.toggle{display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:var(--r-sm);
  background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text-2);
  font:var(--fw-med) var(--fs-sm)/1.35 var(--font);cursor:pointer}
.prod-band .tag.manual.on.toggle::after{content:"×";color:var(--text-3);font-size:14px;line-height:1}
.prod-band .tag.manual.on.toggle:hover{border-color:var(--danger);color:var(--text)}
.prod-band .tag.manual.on.toggle:hover::after{color:var(--danger)}

.prod-band .tag-add{position:relative}
.prod-band .tag-add-btn{width:auto;height:auto;padding:4px 11px;border-radius:var(--r-sm);
  background:var(--surface-2);border:1px dashed var(--border-strong);color:var(--text-2);
  font:var(--fw-med) var(--fs-sm)/1.35 var(--font);cursor:pointer;white-space:nowrap}
.prod-band .tag-add-btn:hover{border-style:solid;border-color:var(--accent);color:var(--text)}
.prod-band .tag-add-btn:focus-visible{outline:none;box-shadow:var(--sh-focus)}

@media (max-width:760px){
  .prod-band .pb-sep{display:none}
  .prod-band{gap:var(--s-2) var(--s-3)}
  .rec-back,.rec-v>a,.rec-toggle,.prod-band .tag-add-btn,.li-upload summary,.pay-ledger-toggle{min-height:44px}
  .order-command-primary .btn,.timing-start-btn{height:44px;min-height:44px}
  .detail-due input[type=date]{height:44px;min-height:44px}
  .pay-card #recordPayBtn,.pay-actions .btn{height:44px;min-height:44px}
  #payModal .modal-x{display:grid;width:44px;height:44px;place-items:center}
  .pay-method span{display:flex;align-items:center;min-height:44px}
  .pay-modal-form input:not([type=radio]){height:44px;min-height:44px}
  .mockup-cta .btn,.comment-form .btn{height:44px;min-height:44px}
  .rec-back,.rec-v>a,.li-upload summary{display:inline-flex;align-items:center}
  .li-upload summary{justify-content:center;width:100%}
  .li-upload form{top:44px}
  .li-upload input[type=file],.li-upload form .btn,.asset-upload input[type=file],.asset-upload select,.asset-upload .btn{min-height:44px}
  .asset-actions .btn,.proof-staff-actions .btn,.redraw-form .btn,.spot-add .btn{min-height:44px}
  .redraw-req>summary{display:inline-flex;align-items:center;height:44px;min-height:44px}
  .redraw-form input,.spot-add input{height:44px;min-height:44px}
}
/* --- Gmail inbox ------------------------------------------------------- */
.communications-switcher{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));align-items:stretch;gap:4px;padding:4px;border:1px solid var(--border);border-radius:10px;background:var(--bg)}
.communications-mode{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:8px;min-width:0;min-height:52px;padding:8px;
  border:1px solid transparent;border-radius:7px;color:var(--text-3);text-decoration:none}
.communications-mode:hover{border-color:var(--border);background:var(--surface-2);color:var(--text)}
.communications-side-head .communications-switcher,.cc-rail-head .communications-switcher{grid-template-columns:minmax(0,1fr)}
.communications-mode:focus-visible{outline:none;border-color:var(--accent);box-shadow:var(--sh-focus)}
.communications-mode.is-pending[aria-disabled="true"]{opacity:.62;cursor:wait}
.communications-mode.is-pending[aria-disabled="true"]:hover{border-color:transparent;background:transparent;color:var(--text-3)}
.communications-mode.is-active{border-color:var(--selected-border);background:var(--selected-bg);color:var(--text);box-shadow:inset 3px 0 0 var(--accent)}
.communications-mode-icon{display:grid;width:24px;height:24px;place-items:center;border-radius:6px;background:var(--surface-2);color:var(--text-3)}
.communications-mode.is-active .communications-mode-icon{background:rgba(var(--accent-rgb),.15);color:var(--accent)}
.communications-mode-icon .icon{width:14px;height:14px}
.communications-mode-copy{display:flex;min-width:0;flex-direction:column;gap:3px}.communications-mode-copy strong{font-size:13px;font-weight:650;line-height:1.3;overflow-wrap:anywhere}
.communications-mode-copy small{color:var(--text-3);font-size:11px;line-height:1.35;overflow-wrap:anywhere}
.communications-mode.is-active .communications-mode-copy strong{color:var(--accent)}
.communications-mode:has(.communications-mode-states > :not([hidden])){grid-template-columns:24px minmax(0,1fr) auto}
.communications-mode-states{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px;max-width:48px;pointer-events:none}
.communications-mode-states:not(:has(> :not([hidden]))){display:none}
.communications-draft{display:grid;min-width:16px;height:16px;place-items:center;padding:0 4px;border:1px solid var(--warn-border);border-radius:8px;background:var(--warn-bg);color:var(--warn);font:800 9px/1 var(--mono)}
.communications-stale{display:grid;width:16px;height:16px;place-items:center;border:1px solid var(--warn-border);border-radius:50%;background:var(--warn-bg);color:var(--warn);font:900 10px/1 var(--mono)}
.communications-unread{display:grid;min-width:16px;height:16px;place-items:center;padding:0 4px;border-radius:8px;background:var(--accent);color:var(--text-on-accent);font:800 9px/1 var(--mono)}
.communications-unread.is-mention{background:#ff6f69;color:#fff}.communications-unread.is-dot{min-width:8px;width:8px;height:8px;padding:0;color:transparent}
.communications-stale[hidden],.communications-draft[hidden],.communications-unread[hidden]{display:none}
.inbox-setup-empty .btn{min-height:44px}
.inbox-page{overflow:hidden}.inbox-page .app-body{height:calc(100vh - var(--header-h));overflow:hidden}
.inbox-wrap{max-width:none}
.inbox{position:relative;display:grid;grid-template-columns:244px var(--inbox-list-w,340px) 1fr;gap:0;
  height:100%;border:0;border-radius:0;overflow:hidden;background:var(--surface-1)}
.inbox-page .inbox-wrap{height:100%;margin:0;padding:0;gap:0}
/* a 4th column appears when a conversation is open, carrying its customer/order context */
.inbox.has-context{grid-template-columns:244px var(--inbox-list-w,340px) 1fr var(--ctx-w,300px)}
/* collapsed → a slim strip with just the expand toggle (state remembered in localStorage) */
.inbox.has-context.ctx-collapsed{grid-template-columns:244px var(--inbox-list-w,340px) 1fr 38px}
.ctx-collapsed .inbox-context .cap,
.ctx-collapsed .inbox-context .ctx-scroll{display:none}
.ctx-collapsed .inbox-context .ctx-head{padding:12px 5px;justify-content:center}
.ctx-toggle{min-width:34px;height:34px;padding:0 8px;border-radius:var(--r-sm);display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--surface-3);
  border:1px solid var(--border);color:var(--text-2);cursor:pointer;flex:0 0 auto}
.ctx-toggle:hover{background:var(--surface-3);color:var(--text)}
.ctx-toggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--t-fast)}
.ctx-toggle-label{font-size:11px;font-weight:var(--fw-semi)}
.ctx-collapsed .ctx-toggle{width:28px;min-width:28px;padding:0}
.ctx-collapsed .ctx-toggle-label{display:none}
.ctx-collapsed .ctx-toggle svg{transform:rotate(180deg)}

/* shared avatar-initial palette (list rows + message cards) — decorative, not brand */
.av-c0{background:#7fd4c1}.av-c1{background:#e0b45a}.av-c2{background:#c79be0}
.av-c3{background:#7fb0e0}.av-c4{background:#e09b9b}.av-c5{background:#9bd47f}

/* --- folder sidebar (views + shared inboxes) --- */
.inbox-side{display:flex;flex-direction:column;min-height:0;overflow-y:auto;border-right:1px solid var(--border);background:var(--surface-2)}
.side-head{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:14px 14px 8px}
.side-head h1{margin:0;font-size:var(--fs-h1);font-weight:var(--fw-semi)}
.communications-side-head{position:relative;display:flex;align-items:stretch;flex-direction:column;gap:0;padding:18px 12px 10px}
.communications-side-head>.workspace-kicker{padding:0 4px}.communications-side-head .communications-switcher{margin:10px 0 15px}
.communications-side-head h1{padding:0 4px;font-size:19px}.communications-side-head>p{margin:4px 4px 0;color:var(--text-3);font-size:11px;line-height:1.45}
.inbox-side-close,.inbox-side-scrim{display:none}
.side-scroll{flex:1 0 auto;min-height:0;padding:2px 8px 12px}
.inbox-side svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;flex:0 0 16px}
.side-cap{margin-top:10px;padding:14px 8px 7px;border-top:1px solid var(--border-faint);font-size:12px;color:var(--text-3);font-weight:var(--fw-semi)}
.side-scroll>.side-cap:first-child{margin-top:0;border-top:0}
.inbox-views{display:flex;flex-direction:column;gap:1px}
.inbox-empty-search{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px}.inbox-empty-search .btn{flex:0 0 auto}
.ivw{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:none;border:0;
  border-left:2px solid transparent;border-radius:var(--r-sm);padding:7px 9px;color:var(--text-2);cursor:pointer;font:inherit}
.ivw .ivw-nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-sm)}
.ivw:hover{background:var(--surface-3);color:var(--text)}
.ivw:focus-visible,.ibx:focus-visible,.ivw.is-focused,.ibx.is-focused{outline:2px solid var(--accent);outline-offset:-2px;background:rgba(var(--accent-rgb),.08);color:var(--text)}
.ivw.on{background:var(--selected-bg);color:var(--text);border-left-color:var(--accent);font-weight:var(--fw-med)}
.inbox-boxes{display:flex;flex-direction:column;gap:1px}
.ibx{display:flex;align-items:center;gap:9px;padding:7px 9px;color:var(--text-2);text-decoration:none;
  font-size:var(--fs-sm);border-left:2px solid transparent;border-radius:var(--r-sm)}
.ibx>svg{opacity:.85}
.ibx:hover{background:var(--surface-3);color:var(--text)}
.ibx.on{background:var(--surface-3);color:var(--text);border-left-color:var(--accent);font-weight:var(--fw-semi)}
.ibx-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ibx-unread{background:var(--surface-3);color:var(--text-2);border-radius:var(--r-pill);
  font-size:11px;font-weight:var(--fw-semi);padding:1px 7px;min-width:20px;text-align:center;flex:0 0 auto}
.ibx.on .ibx-unread{background:rgba(var(--accent-rgb),.18);color:var(--accent-strong)}

/* automations section (inbox sidebar) — surfaced here so the Front rules can be flipped on at go-live */
.side-cap-row{display:flex;align-items:center;gap:8px}
.side-cap-row>span:first-child{flex:1}
.auto-badge{font-size:10px;font-weight:var(--fw-semi);border-radius:var(--r-pill);padding:1px 7px;text-transform:none;letter-spacing:0}
.auto-badge.live{color:var(--success-ink);background:var(--success)}
.auto-badge.staged{color:var(--text-3);background:var(--surface-3)}
.auto-rules{display:flex;flex-direction:column;gap:1px}
.auto-rule{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--r-sm)}
.auto-rule:hover{background:var(--surface-2)}
.auto-nm{flex:1;min-width:0;font-size:var(--fs-sm);color:var(--text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auto-tog{position:relative;width:32px;height:18px;border-radius:var(--r-pill);border:0;background:var(--surface-3);cursor:pointer;flex:0 0 auto;transition:background var(--t-fast)}
.auto-tog .knob{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--text-3);transition:transform var(--t-fast),background var(--t-fast)}
.auto-tog.on{background:rgba(var(--accent-rgb),.30)}
.auto-tog.on .knob{transform:translateX(14px);background:var(--accent)}
.auto-tog:disabled{cursor:wait;opacity:.65}
.auto-state{font-size:11px;font-weight:var(--fw-semi);flex:0 0 auto}
.auto-state.on{color:var(--accent-strong)}
.auto-state.off{color:var(--text-3)}
.auto-more{display:block;font-size:var(--fs-sm);color:var(--text-3);padding:7px 8px 2px;text-decoration:none}
.auto-more:hover{color:var(--text)}
.auto-rules-status{padding:3px 8px;line-height:1.35}
.auto-rules-status:empty{display:none}

/* --- conversation list --- */
.inbox-list{position:relative;border-right:1px solid var(--border);display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg)}
.inbox-lhead{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:12px 14px 10px;border-bottom:1px solid var(--border)}
.inbox-lhead h2{margin:0;font-size:var(--fs-md);font-weight:var(--fw-semi);color:var(--text)}
.inbox-mobile-menu,.inbox-mobile-back{display:none;min-width:40px;min-height:40px;border:1px solid var(--border);border-radius:7px;background:var(--surface-2);color:var(--text);cursor:pointer}
.inbox-search{padding:10px 12px;border-bottom:1px solid var(--border-faint)}
.inbox-search input{width:100%;background:var(--surface-2);color:var(--text);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:8px 10px;font:inherit}
.inbox-search input:focus,.inbox-search input.is-focused{outline:none;border-color:var(--accent);box-shadow:var(--sh-focus)}
.threads{overflow-y:auto;flex:1;min-height:0}
.thread-row{position:relative;display:grid;grid-template-columns:minmax(0,1fr);width:100%;background:none;border-bottom:1px solid var(--border-faint);border-left:2px solid transparent;color:var(--text-2)}
.thread-row.has-archive{grid-template-columns:minmax(0,1fr) 40px}
.thread-open{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;min-width:0;width:100%;padding:11px 10px;background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer}
.thread-open:focus-visible,.thread-open.is-focused{outline:2px solid var(--accent);outline-offset:-2px;background:rgba(var(--accent-rgb),.08)}
.thread-row:hover{background:var(--surface-1)}
.thread-row.open{background:var(--surface-2);border-left-color:var(--accent)}
.tr-av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:12px;
  font-weight:700;color:#0f1113;align-self:start}
.tr-main{display:block;min-width:0}
.thread-row.unread .tr-from,.thread-row.unread .tr-subj{color:var(--text);font-weight:var(--fw-semi)}
.tr-top{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--text-2)}
.tr-from{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.tr-arrow{color:var(--text-3);flex:0 0 auto}
.tr-udot{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:0 0 auto}
/* per-view count badge (DB-backed views) */
.ivw-ct{flex:0 0 auto;font-size:11px;font-weight:var(--fw-semi);color:var(--text-3);background:var(--surface-3);
  border-radius:var(--r-pill);padding:1px 7px;min-width:20px;text-align:center}
.ivw.on .ivw-ct{background:rgba(var(--accent-rgb),.18);color:var(--accent-strong)}
/* Archive owns a stable slot; the activity date remains visible on hover/touch. */
.tr-archive{display:inline-flex;align-self:start;align-items:center;justify-content:center;width:40px;height:40px;margin-top:4px;padding:0;border:0;border-radius:var(--r-sm);
  background:none;color:var(--text-3);cursor:pointer}
.tr-archive svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tr-archive:hover{background:var(--surface-3);color:var(--text)}
.tr-archive:focus-visible{outline:2px solid var(--accent);outline-offset:-3px;background:var(--surface-3)}
.thread-row.archiving{opacity:.4;pointer-events:none}
/* row tag pills — the shop's own Gmail labels */
.tr-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.tr-tag{font-size:10.5px;font-weight:var(--fw-semi);padding:1px 8px;border-radius:var(--r-pill);
  background:var(--surface-3);color:var(--text-2);border:1px solid var(--border);white-space:nowrap;
  max-width:140px;overflow:hidden;text-overflow:ellipsis}
.thread-row.unread .tr-tag{border-color:var(--border-strong)}
/* mailbox needs-reauthorization triangle (from the per-mailbox unread check) */
.ibx-warn{display:inline-flex;align-items:center;flex:0 0 auto;color:var(--amber)}
.ibx-warn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tr-date{display:flex;flex-direction:column;align-items:flex-end;align-self:start;max-width:82px;color:var(--text-2);font-size:11px;line-height:1.5;text-align:right;font-variant-numeric:tabular-nums}
.email-time-day{display:block}.email-time-clock{display:block;color:var(--text-3);white-space:nowrap}
.tr-subj{display:block;font-size:var(--fs-sm);margin:3px 0 2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr-count{color:var(--text-3);font-weight:400}
.tr-snip{display:block;font-size:12px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inbox-read{overflow-y:auto;padding:18px;min-width:0}
.inbox-empty,.pad{padding:24px}
.inbox-error{padding:16px;color:var(--danger);font-size:var(--fs-sm)}
.inbox-load-error{display:flex;align-items:center;justify-content:center;gap:12px;min-height:140px;text-align:center}
.inbox-list-error{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:8px;border:1px solid color-mix(in srgb,var(--danger) 35%,var(--border));border-radius:var(--r-md)}
.thread-list-status{padding:7px 12px;border-top:1px solid var(--border);background:var(--surface)}
.thread-list-status:empty{display:none}
#loadMore{margin:8px 12px 12px;align-self:flex-start}#loadMore:disabled{cursor:wait;opacity:.65}
#loadMore[hidden]{display:none}
.msg-card{border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:14px;background:var(--surface-1)}
.msg-head{display:flex;justify-content:space-between;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border-faint)}
.msg-from{font-weight:var(--fw-semi);color:var(--text)}
.msg-date{color:var(--text-3);font-size:12px;flex:0 0 auto}
.msg-subj{padding:8px 14px 0;font-weight:var(--fw-semi)}
.msg-atts{display:flex;flex-wrap:wrap;gap:8px;padding:10px 14px}
.msg-att{font-size:12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);
  padding:4px 9px;color:var(--text-2);text-decoration:none}
.msg-att:hover{color:var(--text);border-color:var(--accent)}
.msg-body{width:100%;border:0;background:transparent;display:block;min-height:60px}

/* --- Gmail mailbox access editor -------------------------------------- */
.drive-settings{max-width:1180px}.drive-settings .workspace-head{align-items:flex-end}
.drive-storage-score{display:flex;min-width:112px;flex-direction:column;align-items:flex-end;padding:10px 14px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.drive-storage-score strong{color:var(--text-2);font:700 1.25rem/1 var(--mono)}.drive-storage-score span{margin-top:5px;color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.drive-storage-score.is-ready{border-color:var(--ok-border);background:var(--ok-bg)}.drive-storage-score.is-ready strong{color:var(--ok)}
.drive-storage-score.has-error{border-color:var(--danger-border);background:var(--danger-bg)}.drive-storage-score.has-error strong{color:var(--danger)}
.drive-status{margin-bottom:var(--s-4);padding:20px}.drive-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-4)}
.drive-section-head h2{margin:4px 0 0;font-size:1.05rem}.drive-state,.drive-routing-mode{flex:0 0 auto;padding:4px 9px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.drive-state.is-ready{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}.drive-state.has-error{border-color:var(--danger-border);background:var(--danger-bg);color:var(--danger)}
.drive-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:var(--s-4)}
.drive-facts>div{display:flex;min-width:0;flex-direction:column;gap:5px;padding:14px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.drive-facts span{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}.drive-facts strong{font-size:var(--fs-sm)}.drive-facts small{color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.drive-next-action{padding:18px;border:1px solid var(--selected-border);border-radius:var(--r-lg);background:linear-gradient(135deg,var(--selected-bg),color-mix(in srgb,var(--surface-1) 92%,var(--accent)))}
.drive-next-action.is-ready{border-color:var(--ok-border);background:linear-gradient(135deg,var(--ok-bg),var(--surface-1))}.drive-next-action.has-error{border-color:var(--danger-border);background:linear-gradient(135deg,var(--danger-bg),var(--surface-1))}
.drive-next-action>span{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.08em}.drive-next-action.is-ready>span{color:var(--ok)}.drive-next-action.has-error>span{color:var(--danger)}
.drive-next-action h3{margin:5px 0 7px;font-size:1rem}.drive-next-action>p{margin:0 0 var(--s-3);color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.drive-advanced{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}.drive-advanced>summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}.drive-advanced[open]>summary{margin-bottom:var(--s-3)}.drive-advanced code{font-size:.85em;overflow-wrap:anywhere}
.drive-path{display:grid;grid-template-columns:minmax(120px,1fr) auto minmax(120px,1fr) auto minmax(120px,1fr) auto minmax(120px,1fr);gap:10px;align-items:center}
.drive-path>div{display:flex;min-width:0;flex-direction:column;gap:4px;padding:14px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}.drive-path>div>span{color:var(--accent);font:700 var(--fs-cap)/1 var(--mono)}.drive-path strong{font-size:var(--fs-sm)}.drive-path small{color:var(--text-3);font-size:var(--fs-cap)}.drive-path>i{color:var(--text-3);font-style:normal}
.drive-routing-note{margin:var(--s-4) 0 0;padding-top:var(--s-3);border-top:1px solid var(--border-faint);color:var(--text-3);font-size:var(--fs-sm);line-height:1.5}
@media(max-width:900px){.drive-facts{grid-template-columns:1fr}.drive-path{grid-template-columns:1fr}.drive-path>i{transform:rotate(90deg);text-align:center}}
@container workspace (max-width:900px){.drive-facts{grid-template-columns:1fr}.drive-path{grid-template-columns:1fr}.drive-path>i{transform:rotate(90deg);text-align:center}}
@media(max-width:560px){.drive-settings .workspace-head{align-items:stretch}.drive-storage-score{align-items:flex-start;width:max-content}.drive-section-head{align-items:flex-start;flex-direction:column}}
@container workspace (max-width:560px){.drive-settings .workspace-head{align-items:stretch}.drive-storage-score{align-items:flex-start;width:max-content}.drive-section-head{align-items:flex-start;flex-direction:column}}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .drive-settings.settings-page{gap:10px;padding-top:12px}
  .drive-settings.settings-page .workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:0;padding-bottom:10px}
  .drive-settings .workspace-head-main .workspace-kicker,
  .drive-settings .workspace-head-main .workspace-subtitle{display:none}
  .drive-settings .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .drive-storage-score{min-width:0;flex-direction:row;align-items:center;width:auto;gap:6px;padding:7px 10px}
  .drive-storage-score strong{font-size:1.1rem}
  .drive-storage-score span{margin-top:0}
  .drive-status{margin:0;padding:10px 12px}
  .drive-section-head{align-items:center;flex-direction:row;gap:8px;margin-bottom:8px}
  .drive-section-head .workspace-kicker{display:none}
  .drive-section-head h2{margin:0;font-size:1rem}
  .drive-facts{display:none}
  .drive-next-action{padding:10px 12px}
  .drive-next-action>span{display:none}
  .drive-next-action h3{margin:0}
  .drive-next-action>p{display:none}
  .drive-advanced{margin-top:6px;padding-top:6px}
  .drive-advanced>summary{display:flex;align-items:center;min-height:44px}
}

.gmail-settings{max-width:1180px}
.gmail-settings .workspace-head{align-items:flex-end}
.gmail-readiness-score{display:flex;min-width:112px;flex-direction:column;align-items:flex-end;padding:10px 14px;
  border:1px solid var(--selected-border);border-radius:var(--r-md);background:var(--selected-bg)}
.gmail-readiness-score strong{color:var(--accent);font:700 1.45rem/1 var(--mono)}
.gmail-readiness-score span{margin-top:5px;color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.gmail-readiness{margin-bottom:var(--s-4);padding:20px}
.gmail-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-3);margin-bottom:var(--s-4)}
.gmail-section-head h2{margin:4px 0 0;font-size:1.05rem}
.gmail-overall-state,.gmail-mailbox-count{flex:0 0 auto;padding:4px 9px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:var(--surface-2);color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);white-space:nowrap}
.gmail-overall-state.is-ready{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}
.gmail-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 var(--s-4);padding:0;list-style:none}
.gmail-step{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:6px 24px 6px 0;color:var(--text-3)}
.gmail-step:not(:last-child)::after{content:"";position:absolute;top:19px;right:10px;width:20px;border-top:1px solid var(--border-strong)}
.gmail-step-index{display:grid;width:28px;height:28px;place-items:center;border:1px solid var(--border-strong);border-radius:50%;
  background:var(--surface-2);font:700 var(--fs-cap)/1 var(--mono)}
.gmail-step>div{display:flex;min-width:0;flex-direction:column;gap:3px}
.gmail-step small{font-size:10px;text-transform:uppercase;letter-spacing:.07em}
.gmail-step strong{overflow:hidden;color:var(--text-2);font-size:var(--fs-sm);text-overflow:ellipsis;white-space:nowrap}
.gmail-step>div>span{font-size:var(--fs-cap);line-height:1.35}
.gmail-step.is-ready .gmail-step-index{border-color:var(--ok-border);background:var(--ok-bg);color:var(--ok)}
.gmail-step.is-current .gmail-step-index{border-color:var(--selected-border);background:var(--selected-bg);color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}
.gmail-step.is-current strong{color:var(--text)}
.gmail-next-action{padding:18px;border:1px solid var(--selected-border);border-radius:var(--r-lg);
  background:linear-gradient(135deg,var(--selected-bg),color-mix(in srgb,var(--surface-1) 92%,var(--accent)))}
.gmail-next-action.is-ready{border-color:var(--ok-border);background:linear-gradient(135deg,var(--ok-bg),var(--surface-1))}
.gmail-next-action>span{color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-semi);text-transform:uppercase;letter-spacing:.08em}
.gmail-next-action.is-ready>span{color:var(--ok)}
.gmail-next-action h3{margin:5px 0 7px;font-size:1rem}
.gmail-next-action>p{margin:0 0 var(--s-3);color:var(--text-2);font-size:var(--fs-sm);line-height:1.55}
.gmail-advanced{margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}
.gmail-advanced>summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.gmail-advanced[open]>summary{margin-bottom:var(--s-3)}
.gmail-advanced code{font-size:.85em;overflow-wrap:anywhere}
.gmail-mailbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3)}
.gmail-mailbox-card{position:relative;min-width:0;padding:16px;border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-2)}
.gmail-mailbox-card::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;border-radius:var(--r-lg) 0 0 var(--r-lg);background:var(--amber)}
.gmail-mailbox-card.is-ready::before{background:var(--ok)}
.gmail-mailbox-card.has-error::before{background:var(--danger)}
.gmail-mailbox-card.is-paused{opacity:.7}
.gmail-mailbox-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.gmail-mailbox-label{color:var(--text-3);font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:.07em}
.gmail-mailbox-head h3{margin:4px 0 0;font-size:var(--fs-sm);overflow-wrap:anywhere}
.gmail-mailbox-state{flex:0 0 auto;color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-semi);white-space:nowrap}
.gmail-mailbox-card.is-ready .gmail-mailbox-state{color:var(--ok)}
.gmail-mailbox-card.has-error .gmail-mailbox-state{color:var(--danger)}
.gmail-mailbox-detail{min-height:36px;margin:14px 0;color:var(--text-3);font-size:var(--fs-cap);line-height:1.45}
.gmail-mailbox-actions{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s-3)}
.gmail-mailbox-actions .btn{min-height:44px}
.gmail-mailboxes>.gmail-section-head{margin-bottom:var(--s-3)}
.gmail-empty{padding:22px;border:1px dashed var(--border-strong);border-radius:var(--r-md);background:var(--surface-2);text-align:center}
.gmail-empty p{margin:6px 0 0;color:var(--text-3);font-size:var(--fs-sm)}
.gmail-mailbox-add{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(160px,.8fr) 110px auto;gap:var(--s-3);
  align-items:end;margin-top:var(--s-4);padding-top:var(--s-4);border-top:1px solid var(--border)}
.gmail-add-head{grid-column:1/-1}
.gmail-add-head h3{margin:4px 0 0;font-size:1rem}
.gmail-add-head p{margin:5px 0 0;color:var(--text-3);font-size:var(--fs-sm)}
.gmail-mailbox-add label{display:flex;min-width:0;flex-direction:column;gap:5px;color:var(--text-2);font-size:var(--fs-cap);font-weight:var(--fw-semi)}
.gmail-settings .gmail-mailbox-add input{width:100%;min-width:0;height:44px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:9px 10px;color:var(--text);font:inherit}
.gmail-add-action{display:flex;align-items:flex-end}
.gmail-add-action .btn{min-height:44px}
.mbx-access-row td{padding-top:0;border-top:0}
.mbx-access{font-size:var(--fs-sm)}
.mbx-access{padding-top:var(--s-3);border-top:1px solid var(--border-faint)}
.mbx-access summary{display:flex;align-items:center;min-height:44px;cursor:pointer;color:var(--text-2);padding:2px 0}
.mbx-access summary:hover{color:var(--text)}
.mbx-access-form{padding:8px 0 12px}
.mbx-access-form .btn{min-height:44px}
.mbx-users{display:flex;flex-wrap:wrap;gap:6px 16px;margin:8px 0}
.mbx-user{display:inline-flex;min-height:44px;align-items:center;gap:6px;color:var(--text-2)}
@media(max-width:820px){
  .gmail-mailbox-grid{grid-template-columns:1fr}.gmail-mailbox-add{grid-template-columns:1fr 1fr}.gmail-add-action{align-self:end}
}
@container workspace (max-width:820px){
  .gmail-mailbox-grid{grid-template-columns:1fr}.gmail-mailbox-add{grid-template-columns:1fr 1fr}.gmail-add-action{align-self:end}
}
@media(max-width:560px){
  .gmail-settings .workspace-head{align-items:stretch}.gmail-readiness-score{align-items:flex-start;width:max-content}
  .gmail-section-head{align-items:flex-start;flex-direction:column}.gmail-steps{grid-template-columns:1fr}
  .gmail-step:not(:last-child)::after{left:13px;top:34px;right:auto;width:auto;height:20px;border-top:0;border-left:1px solid var(--border-strong)}
  .gmail-mailbox-add{grid-template-columns:1fr}.gmail-add-action{align-self:auto}
}
@container workspace (max-width:560px){
  .gmail-settings .workspace-head{align-items:stretch}.gmail-readiness-score{align-items:flex-start;width:max-content}
  .gmail-section-head{align-items:flex-start;flex-direction:column}.gmail-steps{grid-template-columns:1fr}
  .gmail-step:not(:last-child)::after{left:13px;top:34px;right:auto;width:auto;height:20px;border-top:0;border-left:1px solid var(--border-strong)}
  .gmail-mailbox-add{grid-template-columns:1fr}.gmail-add-action{align-self:auto}
}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .gmail-settings.settings-page{gap:10px;padding-top:12px}
  .gmail-settings.settings-page .workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:0;padding-bottom:10px}
  .gmail-settings .workspace-head-main .workspace-kicker,
  .gmail-settings .workspace-head-main .workspace-subtitle{display:none}
  .gmail-settings .workspace-head h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .gmail-readiness-score{min-width:0;flex-direction:row;align-items:center;width:auto;gap:6px;padding:7px 10px}
  .gmail-readiness-score strong{font-size:1.1rem}
  .gmail-readiness-score span{margin-top:0}
  .gmail-readiness{margin:0;padding:10px 12px}
  .gmail-section-head{align-items:center;flex-direction:row;gap:8px;margin-bottom:8px}
  .gmail-section-head .workspace-kicker{display:none}
  .gmail-section-head h2{margin:0;font-size:1rem}
  .gmail-steps{display:none}
  .gmail-next-action{padding:10px 12px}
  .gmail-next-action>span{display:none}
  .gmail-next-action h3{margin:0}
  .gmail-next-action>p{display:none}
  .gmail-advanced{margin-top:6px;padding-top:6px}
  .gmail-advanced>summary{display:flex;align-items:center;min-height:44px}
}

/* --- Gmail reply / compose -------------------------------------------- */
.thread-actions{display:flex;align-items:center;gap:8px;margin-bottom:14px;
  padding-bottom:10px;border-bottom:1px solid var(--border-faint)}
.thread-status{margin-left:auto}
.compose{display:flex;flex-direction:column;gap:8px;border:1px solid var(--accent);
  border-radius:var(--r-md);padding:12px;margin-bottom:14px;background:var(--surface-2)}
.compose input,.compose textarea{background:var(--surface-1);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:8px 10px;font:inherit;width:100%}
.compose textarea{resize:vertical;min-height:120px}
.cmp-actions{display:flex;align-items:center;gap:8px}
.cmp-status{margin-left:4px}

/* --- Gmail internal notes (reuses chat renderer) ---------------------- */
.notes-panel{margin-top:18px;border-top:2px solid var(--accent);padding-top:12px}
.notes-head{font-weight:var(--fw-semi);color:var(--text);margin-bottom:8px}
.notes-msgs{max-height:340px;overflow-y:auto;margin-bottom:8px}
.notes-reply{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-3);
  background:var(--surface-2);border-radius:var(--r-sm);padding:4px 8px;margin-bottom:6px}
.notes-reply button{background:none;border:0;color:var(--text-2);cursor:pointer;font-size:15px;margin-left:auto}
.notes-compose{display:flex;gap:8px;align-items:flex-end}
.notes-compose textarea{flex:1;background:var(--surface-1);color:var(--text);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:8px 10px;font:inherit;resize:vertical;min-height:44px}

/* --- customer email threads (Phase 3) --------------------------------- */
.cust-emails-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
#emailThisCustomer[hidden],#custEmailsLoad[hidden]{display:none}
#custEmailsLoad{min-height:44px;margin-top:8px}
.cust-email-row{display:block;text-decoration:none;color:var(--text-2);border:1px solid var(--border-faint);
  border-radius:var(--r-sm);padding:8px 10px;background:var(--surface-1)}
.cust-email-row:hover{border-color:var(--accent);color:var(--text)}

/* Customer account command center */
.account-command-center{display:flex;flex-direction:column;gap:var(--s-4)}
.account-back{width:max-content;color:var(--text-3);font-size:var(--fs-sm);text-decoration:none}
.account-back:hover{color:var(--accent)}
.account-hero{display:flex;justify-content:space-between;align-items:center;gap:var(--s-5);
  padding:var(--s-5);border:1px solid var(--border);border-radius:var(--r-lg);
  background:linear-gradient(135deg,var(--surface-2),var(--surface-1))}
.account-identity{display:flex;align-items:center;gap:var(--s-4);min-width:0}
.account-mark,.contact-avatar{display:grid;place-items:center;flex:0 0 auto;border:1px solid var(--selected-border);
  background:var(--selected-bg);color:var(--accent);font-weight:var(--fw-bold);letter-spacing:.04em}
.account-mark{width:58px;height:58px;border-radius:var(--r-lg);font-size:var(--fs-h2)}
.account-hero h1{margin:2px 0 8px;font-size:clamp(1.65rem,3vw,2.35rem);line-height:1.05}
.account-eyebrow{display:block;color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-bold);
  letter-spacing:.13em;text-transform:uppercase}
.account-meta,.account-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.account-meta{color:var(--text-3);font-size:var(--fs-sm)}
.account-actions{justify-content:flex-end}
.account-statbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border:1px solid var(--border);
  border-radius:var(--r-lg);background:var(--surface-1);overflow:hidden}
.account-statbar>div{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-right:1px solid var(--border)}
.account-statbar>div:last-child{border-right:0}
.account-statbar span,.account-statbar small{color:var(--text-3);font-size:var(--fs-cap)}
.account-statbar strong{font-size:var(--fs-lg);color:var(--text)}
.account-section-nav{position:sticky;top:calc(var(--header-h) + 6px);z-index:20;display:flex;gap:4px;
  overflow-x:auto;margin:0;padding:5px;border:1px solid var(--border);border-radius:var(--r-md);
  background:color-mix(in srgb,var(--surface-1) 92%,transparent);backdrop-filter:blur(12px)}
.account-section-nav a{display:flex;align-items:center;gap:7px;flex:0 0 auto;padding:8px 12px;border-radius:var(--r-sm);
  color:var(--text-3);font-size:var(--fs-sm);font-weight:var(--fw-med);text-decoration:none;white-space:nowrap}
.account-section-nav a:hover,.account-section-nav a:focus-visible,.account-section-nav a.is-current{
  color:var(--text);background:var(--surface-3)}
.account-section-nav b{display:grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border:1px solid var(--border);
  border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);font:var(--fw-semi) var(--fs-cap)/1 var(--mono)}
#accountTop,#collections,#accountContacts,#accountWork,#accountActivity,#customerChat{scroll-margin-top:calc(var(--header-h) + 64px)}
.default-contact-banner{display:flex;align-items:center;gap:14px;padding:14px 18px;border:1px solid var(--selected-border);
  border-radius:var(--r-lg);background:var(--selected-bg)}
.default-contact-banner>div:nth-child(2){display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:baseline}
.default-contact-banner>div:nth-child(2) .account-eyebrow{grid-column:1/-1}
.default-contact-banner>div:nth-child(2)>span:last-child{color:var(--text-3);font-size:var(--fs-sm)}
.default-contact-banner>.authorization-state{margin-left:auto}
.default-contact-banner.is-empty{justify-content:space-between;border-color:var(--border);background:var(--surface-1)}
.default-contact-banner.is-empty>div{display:flex;flex-direction:column;gap:3px}
.default-contact-banner.is-empty span{color:var(--text-3);font-size:var(--fs-sm)}
.account-commission-band{display:flex;align-items:center;gap:14px;padding:14px 18px;border:1px solid color-mix(in srgb,var(--accent) 32%,var(--border));
  border-radius:var(--r-lg);background:linear-gradient(100deg,color-mix(in srgb,var(--accent) 7%,var(--surface-1)),var(--surface-1))}
.account-commission-band>div{display:grid;gap:3px;min-width:0}
.account-commission-band>div small{color:var(--text-3);line-height:1.4}
.account-commission-band>.btn{margin-left:auto;flex:0 0 auto}
.account-commission-band.is-unassigned{border-style:dashed;background:var(--surface-1)}
.contact-avatar{width:38px;height:38px;border-radius:50%;font-size:var(--fs-cap)}
.account-alerts:empty{display:none}
.collection-policy{border-color:var(--selected-border)}
.collection-policy .account-panel-head{align-items:center;background:linear-gradient(90deg,var(--selected-bg),transparent)}
.collection-policy-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.collection-policy-status .authorization-state{white-space:nowrap}
.collection-policy-body{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:0}
.collection-policy-main{padding:20px;border-right:1px solid var(--border)}
.collection-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}
.collection-flow-step{position:relative;display:flex;align-items:center;gap:9px;padding-right:16px;color:var(--text-2);
  font-size:var(--fs-sm)}
.collection-flow-step:not(:last-child)::after{content:"";position:absolute;right:4px;top:50%;width:8px;
  border-top:1px solid var(--selected-border)}
.collection-flow-step b{display:grid;place-items:center;flex:0 0 auto;width:24px;height:24px;border-radius:50%;
  background:var(--selected-bg);border:1px solid var(--selected-border);color:var(--accent);font-size:11px}
.collection-flow-copy{margin:0 0 18px;color:var(--text-3);font-size:var(--fs-cap)}
.collection-policy-form{display:grid;grid-template-columns:auto minmax(150px,.7fr) minmax(160px,1fr) auto;gap:12px;
  align-items:end}
.collection-policy-form>label{display:flex;flex-direction:column;gap:5px;color:var(--text-3);font-size:var(--fs-cap)}
.collection-policy-form input[type=number],.collection-policy-form select{width:100%;box-sizing:border-box;
  background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:9px 10px}
.collection-policy-form .collection-policy-toggle{align-self:center;flex-direction:row;align-items:center;
  color:var(--text);font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.collection-policy-toggle input{accent-color:var(--accent)}
.collection-policy-form [hidden]{display:none}
.collection-policy-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start}
.collection-policy-stats>div{display:flex;flex-direction:column;gap:4px;padding:18px;border-bottom:1px solid var(--border-faint)}
.collection-policy-stats>div:nth-child(odd){border-right:1px solid var(--border-faint)}
.collection-policy-stats span,.collection-policy-stats small{color:var(--text-3);font-size:var(--fs-cap)}
.collection-policy-stats strong{color:var(--text);font-size:var(--fs-md)}
.collection-policy-note{grid-column:1/-1;padding:14px 18px;color:var(--text-3);font-size:var(--fs-cap)}
.collection-policy-note a{color:var(--accent)}
.collection-repairs{grid-column:1/-1;padding:0 18px 18px}
.collection-repairs>p{margin:3px 0 10px;color:var(--text-3);font-size:var(--fs-cap)}
.collection-repairs form{display:grid;grid-template-columns:minmax(90px,.6fr) repeat(2,minmax(125px,1fr)) auto;
  gap:8px;align-items:end;padding:10px 0;border-top:1px solid var(--border-faint)}
.collection-repairs label{display:flex;flex-direction:column;gap:4px;color:var(--text-3);font-size:var(--fs-cap)}
.collection-repairs input[type=date]{width:100%;box-sizing:border-box;background:var(--surface-2);color:var(--text);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 8px}
.account-panel{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1);overflow:hidden}
.account-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--s-4);padding:18px 20px;
  border-bottom:1px solid var(--border)}
.account-panel-head h2{margin:2px 0 3px;font-size:var(--fs-lg)}
.account-panel-head p{margin:0;color:var(--text-3);font-size:var(--fs-sm)}
.contact-table-head,.contact-table-row{display:grid;grid-template-columns:minmax(280px,1fr) 190px 64px;
  gap:var(--s-3);align-items:center;padding:10px 20px}
.contact-table-head{color:var(--text-3);font-size:var(--fs-cap);font-weight:var(--fw-bold);
  letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--border)}
.contact-table-row{min-height:66px;border-bottom:1px solid var(--border-faint)}
.contact-person{display:flex;align-items:center;gap:12px;min-width:0}
.contact-person>span:last-child{display:flex;flex-direction:column;min-width:0}
.contact-person strong{display:flex;align-items:center;gap:7px}
.contact-person strong em{padding:2px 6px;border-radius:999px;background:var(--selected-bg);color:var(--accent);
  font-size:10px;font-style:normal;text-transform:uppercase;letter-spacing:.06em}
.contact-person small{color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.contact-person a{color:var(--accent);text-decoration:none}
.contact-person a:hover{text-decoration:underline}
.authorization-state{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:var(--fs-cap);font-weight:var(--fw-semi)}
.authorization-state.is-authorized{color:var(--success-ink);background:var(--ok-bg);border:1px solid var(--ok-border)}
.authorization-state.is-restricted{color:var(--text-3);background:var(--surface-2);border:1px solid var(--border)}
.contact-row-actions{text-align:right}
.contact-editor{display:flex;gap:12px;align-items:flex-end;padding:16px 20px 20px;background:var(--surface-2);
  border-bottom:1px solid var(--border)}
.contact-editor[hidden]{display:none}
.contact-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;flex:1}
.contact-form>label{display:flex;flex-direction:column;gap:5px;color:var(--text-3);font-size:var(--fs-cap)}
.contact-form input[type=text],.contact-form input[type=email]{width:100%;box-sizing:border-box;background:var(--surface-1);
  color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:9px 10px}
.contact-permissions label{font-size:var(--fs-sm);color:var(--text-2)}
.contact-form input[type=checkbox]{accent-color:var(--accent)}
.contact-permissions,.contact-form-actions{grid-column:1/-1;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.contact-modal-card{max-width:760px}
.contact-modal-card h3{margin:5px 0 18px}
.contact-feedback{margin:12px 20px 0}
.account-work-grid{gap:var(--s-4)}
.account-work-grid .account-panel{min-width:0}
.account-work-grid .scroller{padding:0 12px 12px}
.account-empty{display:flex;flex-direction:column;gap:4px;padding:24px;color:var(--text-3)}
.account-empty strong{color:var(--text)}
.activity-columns{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr)}
.activity-columns>div{padding:18px 20px}
.activity-columns>div+div{border-left:1px solid var(--border)}
.activity-columns h3{margin:0 0 14px;font-size:var(--fs-md)}
.activity-stream ol{list-style:none;margin:0;padding:0}
.activity-stream li{display:grid;grid-template-columns:12px 1fr;gap:10px;padding:0 0 16px;position:relative}
.activity-stream li:not(:last-child)::before{content:"";position:absolute;left:5px;top:13px;bottom:0;width:1px;background:var(--border)}
.activity-dot{width:9px;height:9px;margin-top:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--selected-bg)}
.activity-stream li>div{display:flex;flex-direction:column;gap:2px}
.activity-stream li span,.activity-stream li small{color:var(--text-3);font-size:var(--fs-cap)}
.activity-title{display:flex;align-items:center;gap:7px}.activity-stream .activity-repeat{display:inline-flex;padding:2px 6px;border:1px solid var(--selected-border);border-radius:var(--r-pill);background:var(--selected-bg);color:var(--accent);font:var(--fw-semi) 10px/1.2 var(--mono)}
.email-history{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.email-history>div{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;padding:10px;border:1px solid var(--border-faint);
  border-radius:var(--r-sm);background:var(--surface-2)}
.email-history small{grid-column:2;color:var(--text-3)}
.email-state{align-self:start;padding:2px 5px;border-radius:999px;font-size:10px;text-transform:uppercase}
.email-state.is-sent{color:var(--success-ink);background:var(--ok-bg)}
.email-state.is-dry{color:var(--text-3);background:var(--surface-3)}
@media (max-width:1050px){
  .account-statbar{grid-template-columns:repeat(3,1fr)}
  .account-statbar>div:nth-child(3){border-right:0}
  .account-statbar>div:nth-child(-n+3){border-bottom:1px solid var(--border)}
  .contact-table-head{display:none}
  .contact-table-row{grid-template-columns:minmax(240px,1fr) 180px auto}
  .collection-policy-body{grid-template-columns:1fr}
  .collection-policy-main{border-right:0;border-bottom:1px solid var(--border)}
}
@media (max-width:760px){
  .contact-modal-card .modal-x{display:grid;width:44px;height:44px;place-items:center;top:8px;right:8px}
  .contact-modal-card .contact-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]){
    height:44px;min-height:44px}
  .contact-modal-card .contact-permissions label{display:flex;align-items:center;min-height:44px}
  .contact-modal-card .contact-form-actions .btn{min-height:44px}
  .account-back,.account-section-nav a,.collection-policy-note a,.contact-person a{
    display:inline-flex;align-items:center;min-height:44px}
  .account-command-center .cc-x,.account-command-center .chat-attach{
    display:inline-grid;place-items:center;min-width:44px;min-height:44px}
  .account-actions .btn,.account-commission-band>.btn,.account-panel-head>.btn,.contact-row-actions .btn,
  .collection-policy-form input[type=number],.collection-policy-form select,.collection-policy-form .btn,
  .account-command-center .cc-add,.account-command-center .cc-input,.account-command-center .cc-compose>.btn{
    min-height:44px;box-sizing:border-box}
  .collection-policy-toggle{min-height:44px}
  .account-command-center .collection-policy-form input[type=number]{height:44px;min-height:44px}
  .account-work-grid td>a{display:inline-flex;align-items:center;min-height:44px}
  .account-hero{align-items:flex-start;flex-direction:column}
  .account-actions{justify-content:flex-start}
  .account-statbar{grid-template-columns:repeat(2,1fr)}
  .account-statbar>div{border-bottom:1px solid var(--border)}
  .account-statbar>div:nth-child(2n){border-right:0}
  .account-statbar>div:last-child{grid-column:1/-1;border-bottom:0}
  .default-contact-banner{align-items:flex-start;flex-wrap:wrap}
  .default-contact-banner>.authorization-state{margin-left:52px}
  .account-commission-band{align-items:flex-start;flex-wrap:wrap}
  .account-commission-band>.btn{width:100%;margin-left:0;justify-content:center}
  .contact-table-row{grid-template-columns:1fr auto;gap:9px}
  .contact-table-row>div:nth-child(2){grid-column:1/-1}
  .contact-row-actions{grid-column:2;grid-row:1}
  .contact-editor{flex-direction:column;align-items:stretch}
  .contact-form{grid-template-columns:1fr}
  .contact-editor .contact-form input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]){
    height:44px;min-height:44px}
  .contact-editor .contact-permissions label{display:flex;align-items:center;min-height:44px}
  .contact-editor .btn{min-height:44px}
  .activity-columns{grid-template-columns:1fr}
  .activity-columns>div+div{border-left:0;border-top:1px solid var(--border)}
  .collection-policy .account-panel-head{align-items:flex-start;flex-direction:column}
  .collection-flow{grid-template-columns:1fr 1fr;gap:12px}
  .collection-flow-step:not(:last-child)::after{display:none}
  .collection-policy-form{grid-template-columns:1fr}
  .collection-repairs form{grid-template-columns:1fr 1fr}
  .collection-repairs form>.mono,.collection-repairs form>button{grid-column:1/-1}
}
/* Account pages share the viewport with the persistent rail. Use their remaining
   workspace width so policy, contact, and activity modules compact as one system. */
@container workspace (max-width:640px){
  .account-back,.account-section-nav a,.collection-policy-note a,.contact-person a{
    display:inline-flex;align-items:center;min-height:44px}
  .account-command-center .cc-x,.account-command-center .chat-attach{
    display:inline-grid;place-items:center;min-width:44px;min-height:44px}
  .account-actions .btn,.account-commission-band>.btn,.account-panel-head>.btn,.contact-row-actions .btn,
  .collection-policy-form input[type=number],.collection-policy-form select,.collection-policy-form .btn,
  .account-command-center .cc-add,.account-command-center .cc-input,.account-command-center .cc-compose>.btn{
    min-height:44px;box-sizing:border-box}
  .collection-policy-toggle{min-height:44px}
  .account-command-center .collection-policy-form input[type=number]{height:44px;min-height:44px}
  .account-work-grid td>a{display:inline-flex;align-items:center;min-height:44px}
  .account-hero{align-items:flex-start;flex-direction:column}
  .account-actions{justify-content:flex-start}
  .account-statbar{grid-template-columns:repeat(2,1fr)}
  .account-statbar>div{border-bottom:1px solid var(--border)}
  .account-statbar>div:nth-child(2n){border-right:0}
  .account-statbar>div:last-child{grid-column:1/-1;border-bottom:0}
  .default-contact-banner{align-items:flex-start;flex-wrap:wrap}
  .default-contact-banner>.authorization-state{margin-left:52px}
  .account-commission-band{align-items:flex-start;flex-wrap:wrap}
  .account-commission-band>.btn{width:100%;margin-left:0;justify-content:center}
  .contact-table-row{grid-template-columns:1fr auto;gap:9px}
  .contact-table-row>div:nth-child(2){grid-column:1/-1}
  .contact-row-actions{grid-column:2;grid-row:1}
  .contact-editor{flex-direction:column;align-items:stretch}
  .contact-form{grid-template-columns:1fr}
  .activity-columns{grid-template-columns:1fr}
  .activity-columns>div+div{border-left:0;border-top:1px solid var(--border)}
  .collection-policy .account-panel-head{align-items:flex-start;flex-direction:column}
  .collection-flow{grid-template-columns:1fr 1fr;gap:12px}
  .collection-flow-step:not(:last-child)::after{display:none}
  .collection-policy-form{grid-template-columns:1fr}
  .collection-repairs form{grid-template-columns:1fr 1fr}
  .collection-repairs form>.mono,.collection-repairs form>button{grid-column:1/-1}
}
.cer-top{display:flex;justify-content:space-between;gap:8px}
.cer-subj{font-weight:var(--fw-semi);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cer-box{flex:0 0 auto;font-size:11px;color:var(--text-3);background:var(--surface-2);
  border-radius:var(--r-pill);padding:1px 8px}
.cer-snip{font-size:12px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}

/* --- Front-style inbox reading pane (header · scroll · sticky footer) --- */
.inbox-read{display:flex;flex-direction:column;overflow:hidden;padding:0}   /* override: was overflow-y:auto;padding:18px */
.rp-head{flex:0 0 auto;padding:12px 16px;border-bottom:1px solid var(--border)}
.rp-title-row{display:flex;align-items:center;gap:9px;min-width:0}
.rp-subject{font-size:var(--fs-md);font-weight:var(--fw-semi);color:var(--text);margin-bottom:8px}
.rp-title-row .rp-subject{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rp-assignee{background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:5px 8px;font:inherit;max-width:180px}
.rp-collision{margin-top:8px;font-size:12px;color:var(--accent);background:rgba(var(--accent-rgb),.12);border-radius:var(--r-sm);padding:4px 8px}
.rp-scroll{flex:1 1 auto;overflow-y:auto;padding:16px;min-height:0}
.rp-footer{flex:0 0 auto;border-top:1px solid var(--border);background:var(--surface-2);padding:10px 14px;position:relative}

/* collapsible messages */
.msg-card{border:1px solid var(--border);border-radius:var(--r-md);margin-bottom:10px;background:var(--surface-1);overflow:hidden}
.msg-head{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;padding:10px 14px;background:none;border:0;color:inherit;font:inherit;text-align:left;cursor:pointer}
.msg-head:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.mc-av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#0f1113;flex:0 0 auto}

/* --- inbox context rail (customer + attachments → quote/assets) --------- */
.inbox-context{display:flex;flex-direction:column;min-height:0;border-left:1px solid var(--border);background:var(--surface-2)}
.inbox-context[hidden]{display:none}
.ctx-head{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:12px 14px 8px}
.ctx-head .cap,.ccap,.ccap2{font-size:var(--fs-cap);text-transform:uppercase;letter-spacing:var(--tracking-cap);color:var(--text-3);font-weight:var(--fw-semi)}
.ctx-scroll{flex:1 1 auto;overflow-y:auto;min-height:0;padding:4px 12px 14px}
.ccard{border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg);padding:12px;margin-bottom:11px}
.ccap{display:block;margin-bottom:8px}
.ccap2{margin:12px 0 5px}
.csub2{color:var(--text-3);font-size:var(--fs-sm);margin-bottom:10px}
.ccard-tog{display:flex;align-items:center;gap:8px;width:100%;background:none;border:0;color:var(--text-3);cursor:pointer;padding:0;font:inherit}
.ccard-tog .ccap{margin:0}
.ccard-tog .chev{width:15px;height:15px;margin-left:auto;fill:none;stroke:currentColor;stroke-width:2;transition:transform var(--t-fast)}
.ccard-tog[aria-expanded="false"] .chev{transform:rotate(-90deg)}
.ccard-body{margin-top:10px}
.ccard-body[hidden]{display:none}
.cust{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.cav{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:#0f1113;flex:0 0 auto}
.cnm{font-weight:var(--fw-semi);font-size:var(--fs-md)}
.csub{font-size:var(--fs-cap);color:var(--text-3)}
.ctx-link{display:inline-block;font-size:var(--fs-sm);color:var(--accent-strong);text-decoration:none}
.ctx-link:hover{text-decoration:underline}
.worklink{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--text-2);border:1px solid var(--border-faint);
  border-radius:var(--r-sm);padding:6px 9px;margin-bottom:5px;font-size:var(--fs-sm)}
.worklink:hover{border-color:var(--accent);color:var(--text)}
.worklink .mono{flex:0 0 auto}
.worklink .wl-nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-3)}
.worklink .wl-amt{flex:0 0 auto;color:var(--text-2);font-variant-numeric:tabular-nums}
.addcust{display:flex;flex-direction:column;gap:6px}
.addcust input{background:var(--surface-1);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 9px;font:inherit}
.atts{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.attrow{display:flex;align-items:center;gap:8px;padding:5px 4px;font-size:var(--fs-sm);color:var(--text-2);cursor:pointer}
.attrow:hover{color:var(--text)}
.attname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attsz{flex:0 0 auto;color:var(--text-3);font-size:var(--fs-cap);font-variant-numeric:tabular-nums}
.inbox-context .btn{width:100%;justify-content:center;margin-top:2px}
.attachto{display:flex;gap:6px;margin-top:8px}
.attachto select{flex:1;min-width:0;background:var(--surface-1);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:6px 8px;font:inherit}
.attachto .btn{width:auto;margin:0}
.inbox-context .cmp-status{display:block;margin-top:8px}
.inbox-context .cmp-status a{color:var(--accent-strong)}
.msg-card.open>.msg-head{border-bottom:1px solid var(--border-faint)}
.msg-summary{display:block;min-width:0}
.msg-from{display:block;overflow:hidden;text-overflow:ellipsis;font-weight:var(--fw-semi);color:var(--text);white-space:nowrap}
.msg-prev{display:block;color:var(--text-3);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msg-card.open .msg-prev{visibility:hidden}
.msg-date{max-width:92px;color:var(--text-2);font-size:12px;line-height:1.5;text-align:right;font-variant-numeric:tabular-nums}
.msg-time-details{margin-top:8px;color:var(--text-2);font-size:12px}
.msg-time-details>summary{width:max-content;max-width:100%;min-height:36px;padding:8px 0;cursor:pointer;color:var(--text-3)}
.msg-time-details>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-sm)}
.msg-time-details dl{display:grid;gap:6px;margin:2px 0 10px}.msg-time-details dl>div{display:grid;grid-template-columns:78px minmax(0,1fr);gap:10px}
.msg-time-details dt{color:var(--text-3)}.msg-time-details dd{margin:0;overflow-wrap:anywhere}.msg-time-details p{margin:0 0 10px;color:var(--text-3)}
.msg-expand{display:none;padding:0 14px 12px}
.msg-card.open .msg-expand{display:block}
.msg-body{width:100%;border:0;background:transparent;display:block;min-height:60px;margin-top:8px}
.msg-atts{display:flex;flex-wrap:wrap;gap:8px;padding:10px 0 0}
.msg-acts{display:flex;gap:8px;margin-top:10px}

/* internal notes section (inside the scroll) */
.rp-notes{margin-top:16px;border-top:2px solid var(--accent);padding-top:10px}
.rp-notes-head{font-weight:var(--fw-semi);color:var(--text);margin-bottom:8px}
.notes-msgs{display:flex;flex-direction:column;max-height:none;overflow:visible;margin:0}

/* footer composer: Reply ↔ Comment */
.rp-tabs{display:flex;gap:4px;margin-bottom:8px}
.rp-tabs button{background:none;border:0;border-bottom:2px solid transparent;color:var(--text-3);padding:4px 8px;cursor:pointer;font:inherit}
.rp-tabs button.on{color:var(--text);border-bottom-color:var(--accent);font-weight:var(--fw-semi)}
.composer-boundary{display:flex;align-items:center;gap:8px;margin-bottom:8px;padding:7px 9px;border:1px solid var(--border);border-radius:var(--r-sm);font-size:11px;line-height:1.35}
.composer-boundary strong{flex:0 0 auto;font:700 10px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.composer-boundary span{color:var(--text-3)}
.rp-footer[data-composer-mode="reply"] .composer-boundary{border-color:var(--warn-border);background:var(--warn-bg)}
.rp-footer[data-composer-mode="reply"] .composer-boundary strong{color:var(--warn)}
.rp-footer[data-composer-mode="comment"] .composer-boundary{border-color:var(--selected-border);background:var(--selected-bg)}
.rp-footer[data-composer-mode="comment"] .composer-boundary strong{color:var(--accent)}
.rp-composer{display:flex;flex-direction:column;gap:6px}
/* outbound email attachments (reply/compose) */
.cmp-attach{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cmp-attach-btn{flex:0 0 auto}
.cmp-files{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 100%}
.cmp-files:empty{display:none}
.cmp-chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);border:1px solid var(--border);
  border-radius:var(--r-sm);padding:3px 6px 3px 9px;font-size:var(--fs-sm);color:var(--text-2);max-width:220px}
.cmp-chip small{color:var(--text-3);font-variant-numeric:tabular-nums}
.cmp-chip button{background:none;border:0;color:var(--text-3);cursor:pointer;font-size:15px;line-height:1;padding:0 2px}
.cmp-chip button:hover{color:var(--danger)}
.rp-composer.cmp-dragging{outline:2px dashed var(--accent);outline-offset:-4px;border-radius:var(--r-sm)}
.cmp-field{display:flex;flex-direction:column;gap:4px;color:var(--text-2);font-size:11px;font-weight:var(--fw-semi)}
.cmp-field>span{display:flex;align-items:center;gap:6px;padding:0 2px}.cmp-field b,.cmp-field small{color:var(--text-3);font:700 9px/1 var(--mono);letter-spacing:.05em;text-transform:uppercase}
.cmp-field b{color:var(--warn)}
.rp-composer input,.rp-composer textarea{background:var(--surface-1);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 10px;font:inherit;width:100%}
.rp-composer textarea{resize:vertical}
.cmp-actions{display:flex;align-items:center;gap:8px}
.cmp-status{margin-left:4px}
.nt-compose{display:flex;flex-direction:column;gap:6px}
.nt-input{min-height:52px}
.nt-tools{display:flex;align-items:center;gap:6px;position:relative}
.nt-tool{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);width:30px;height:30px;cursor:pointer;color:var(--text-2)}
.nt-tool:hover{color:var(--text);border-color:var(--accent)}
.nt-mention-retry{margin:8px auto 0;padding:6px 10px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text-2);cursor:pointer}
.nt-mention-retry:hover,.nt-mention-retry:focus-visible{border-color:var(--accent);color:var(--text);outline:none;box-shadow:var(--sh-focus)}
.nt-emoji-pop{position:absolute;bottom:36px;left:0;display:flex;gap:2px;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--r-sm);padding:4px;z-index:10}
.nt-emoji-pop button{background:none;border:0;font-size:18px;cursor:pointer}
.nt-mention-pop{position:absolute;bottom:38px;left:0;z-index:12;width:min(320px,calc(100vw - 52px));overflow:hidden;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface-1);box-shadow:0 18px 42px rgba(0,0,0,.42)}
.nt-mention-pop>label{display:block;padding:8px;border-bottom:1px solid var(--border)}
.nt-mention-pop input{min-height:36px;padding:0 9px!important;background:var(--surface-2)!important}
.nt-mention-list{max-height:240px;overflow:auto;padding:5px}.nt-mention-list button{display:grid;width:100%;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;padding:7px;border:0;border-radius:7px;background:transparent;color:var(--text);text-align:left;cursor:pointer}
.nt-mention-list button:hover,.nt-mention-list button:focus,.nt-mention-list button[aria-selected="true"]{background:var(--surface-2);outline:0}
.nt-mention-list button>span:last-child{display:flex;min-width:0;flex-direction:column;gap:2px}.nt-mention-list strong,.nt-mention-list small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nt-mention-list strong{font-size:12px}.nt-mention-list small{color:var(--accent);font:700 10px/1 var(--mono)}
.nt-person-avatar{display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--border);border-radius:8px;background:var(--surface-3);color:var(--accent);font:700 10px/1 var(--mono)}
.nt-mention-pop>p{margin:0;padding:8px 10px;border-top:1px solid var(--border);color:var(--text-3);font-size:10px;line-height:1.35}.nt-mention-empty{display:block;padding:16px;color:var(--text-3);font-size:12px;text-align:center}
#ntPost{margin-left:auto}
.nt-replybar{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--text-3);background:var(--surface-1);border-radius:var(--r-sm);padding:4px 8px}
.nt-replybar button{background:none;border:0;color:var(--text-2);cursor:pointer;margin-left:auto;font-size:15px}
.rp-footer.nt-dragging{outline:2px dashed var(--accent);outline-offset:-6px}
.rp-footer.nt-dragging::after{content:"Drop to attach";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(var(--accent-rgb),.12);color:var(--accent);font-weight:var(--fw-med);pointer-events:none;z-index:5}
.tr-badge{display:inline-block;font-size:10px;font-weight:700;background:var(--accent);color:var(--text-on-accent);border-radius:var(--r-pill);padding:0 6px;margin-left:6px;vertical-align:middle}
.tr-badge.resolved{background:var(--ok,#22c55e);color:#fff}
/* the class's display: value overrides the [hidden] attribute — restore it (same gotcha as tag menu) */
.nt-emoji-pop[hidden]{display:none}
.nt-mention-pop[hidden]{display:none}
.nt-replybar[hidden]{display:none}

@media(max-width:1120px){
  .inbox{grid-template-columns:224px var(--inbox-list-w,320px) minmax(340px,1fr)}
  .inbox.has-context{grid-template-columns:224px var(--inbox-list-w,320px) minmax(340px,1fr)}
  .inbox.has-context .inbox-context{position:absolute;top:0;right:0;bottom:0;z-index:20;width:min(320px,85vw);box-shadow:-16px 0 38px rgba(0,0,0,.35)}
  .inbox.has-context.ctx-collapsed .inbox-context{width:38px;box-shadow:none}
}
@media(max-width:820px){
  .inbox{position:relative;grid-template-columns:minmax(260px,42vw) minmax(0,1fr)}
  .inbox-side{position:absolute;inset:0 auto 0 0;z-index:30;width:min(320px,88vw);transform:translateX(-100%);box-shadow:18px 0 40px rgba(0,0,0,.4)}
  .inbox.side-open .inbox-side{transform:translateX(0)}.inbox-mobile-menu{display:grid;place-items:center}
  .inbox-side-close{position:absolute;top:12px;right:12px;display:grid;width:40px;height:40px;place-items:center;border:1px solid var(--border);border-radius:7px;background:var(--surface-2);color:var(--text);font-size:20px;cursor:pointer}
  .inbox.side-open .inbox-side-scrim{position:absolute;inset:0;z-index:20;display:block;border:0;background:var(--scrim);cursor:pointer}
  .inbox-list{grid-column:1}.inbox-read{grid-column:2}.inbox.has-context{grid-template-columns:minmax(260px,42vw) minmax(0,1fr)}
}
/* Match Company Chat's tablet breakpoint: both workspaces become list → conversation flows together. */
@media(max-width:760px){
  .inbox{display:block}.inbox-list,.inbox-read{position:absolute;inset:0}.inbox-read{display:none}.inbox.thread-selected .inbox-list{display:none}.inbox.thread-selected .inbox-read{display:flex}
  .composer-boundary{align-items:flex-start;flex-direction:column;gap:4px}.rp-footer{padding:9px}.rp-scroll{padding:10px}.rp-head{padding:10px}
  .inbox-mobile-back{display:grid;place-items:center}.rp-title-row .rp-subject{margin-bottom:0}.rp-title-row{margin-bottom:8px}
}

/* --- right-side collapsible icon rail (nav) ---------------------------- */
:root{--rail-w:64px;--rail-w-exp:252px}
.app-body{min-width:0;scroll-margin-top:var(--header-h);container:workspace / inline-size}
.nav-rail{position:fixed;top:var(--header-h);right:0;bottom:0;width:var(--rail-w);z-index:120;overflow:hidden;
  background:rgba(24,27,30,.97);border-left:1px solid var(--border);display:flex;flex-direction:column;transition:width .16s ease;
  box-shadow:-8px 0 28px rgba(0,0,0,.08);backdrop-filter:blur(14px)}
.nav-rail.expanded{width:var(--rail-w-exp);box-shadow:-10px 0 26px rgba(0,0,0,.20)}
.nav-rail ~ .app-body{padding-right:var(--rail-w);transition:padding-right .16s ease}
.nav-rail.expanded.pushes-content ~ .app-body{padding-right:var(--rail-w-exp)}
.rail-toggle{flex:0 0 auto;align-self:flex-end;background:none;border:0;color:var(--text-3);cursor:pointer;
  width:var(--rail-w);height:48px;display:flex;align-items:center;justify-content:center}
.rail-toggle:hover{color:var(--text)}
.rail-toggle .icon{transition:transform .16s}
.nav-rail.expanded .rail-toggle .icon{transform:rotate(180deg)}
.rail-search{padding:0 10px 8px;display:none}
.nav-rail.expanded .rail-search{display:block}
.rail-search .gsearch-in{width:100%;background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:var(--r-sm);padding:7px 10px;font:inherit}
.rail-search .gsearch-menu{left:10px;right:10px;width:auto;max-width:none}
.rail-body{flex:1 1 auto;overflow-y:auto;overflow-x:hidden;padding:2px 0}
.rail-group{padding:4px 0;border-bottom:1px solid var(--border-faint)}
.rail-group-head{display:none;padding:8px 14px 4px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-3)}
.nav-rail.expanded .rail-group-head{display:block}
.rail-disclosure>summary{list-style:none}
.rail-disclosure>summary::-webkit-details-marker{display:none}
.rail-group-toggle{display:flex;align-items:center;gap:14px;width:100%;min-height:46px;padding:10px 14px 10px 21px;
  color:var(--text-2);background:none;border:0;cursor:pointer;font:inherit;white-space:nowrap}
.rail-group-toggle:hover,.rail-disclosure[open]>.rail-group-toggle{background:var(--surface-2);color:var(--text)}
.rail-group-toggle>.icon{flex:0 0 20px;width:20px;height:20px}
.rail-group-toggle>span,.rail-group-toggle>.rail-caret{opacity:0;transition:opacity .12s,transform .16s}
.nav-rail.expanded .rail-group-toggle>span,.nav-rail.expanded .rail-group-toggle>.rail-caret{opacity:1}
.rail-group-toggle>.rail-caret{width:14px;height:14px;margin-left:auto;transform:rotate(180deg)}
.rail-disclosure[open]>.rail-group-toggle>.rail-caret{transform:rotate(-90deg)}
.rail-disclosure:not([open])>.rail-group-content{display:none}
.nav-rail.expanded .rail-group-content{margin-left:12px;box-shadow:inset 2px 0 color-mix(in srgb,var(--accent) 32%,transparent)}
.nav-rail.expanded .rail-group-content .rail-link{padding-left:23px}
.rail-link{display:flex;align-items:center;gap:14px;width:100%;min-height:46px;text-align:left;text-decoration:none;white-space:nowrap;
  color:var(--text-2);background:none;border:0;cursor:pointer;padding:10px 14px 10px 21px;font:inherit;position:relative}
.rail-link>.icon{flex:0 0 20px;width:20px;height:20px}
.rail-link>span{opacity:0;transition:opacity .12s}
.nav-rail.expanded .rail-link>span{opacity:1}
.rail-link:hover{background:var(--surface-2);color:var(--text)}
.rail-link.on{background:var(--selected-bg);color:var(--text);font-weight:var(--fw-med)}
.rail-link.on::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:3px;background:var(--accent);border-radius:0 2px 2px 0}
.rail-link .badge,.rail-link .chat-badge{margin-left:auto;margin-right:14px}
/* "You have mail" dot — pinned to the mail icon's corner so it shows even when the rail is
   collapsed to icons (a right-aligned badge would be clipped off-screen at 56px). */
.rail-dot{position:absolute;top:9px;left:35px;width:8px;height:8px;border-radius:50%;
  background:var(--accent);box-shadow:0 0 0 2px var(--surface-1);pointer-events:none}
.rail-dot[hidden]{display:none}
.rail-foot{flex:0 0 auto;border-top:1px solid var(--border);padding:4px 0}
.rail-logout{display:none;padding:2px 17px 6px}
.nav-rail.expanded .rail-logout{display:block}
.rail-signout{background:none;border:0;color:var(--text-3);cursor:pointer;font:inherit;padding:4px 0}
.rail-signout:hover{color:var(--danger)}
@media(max-width:800px){
  :root{--rail-w:0px}
  .nav-rail ~ .app-body{padding-right:0}
  /* Hide the persistent icon rail. The header hamburger opens a full-screen
     navigation surface, then returns to a full-width workspace when it closes. */
  .nav-rail{width:min(360px,100vw);transform:translateX(100%);visibility:hidden;pointer-events:none;z-index:220}
  .nav-rail.expanded{width:100vw;transform:none;visibility:visible;pointer-events:auto}
  .nav-rail.expanded.pushes-content ~ .app-body{padding-right:var(--rail-w)}
  .nav-rail.expanded .rail-search{display:block}
  .nav-scrim{display:none;position:fixed;top:var(--header-h);right:0;bottom:0;left:0;z-index:210;border:0;padding:0;background:var(--scrim);cursor:pointer}
  body.nav-drawer-open{overflow:hidden}
  body.nav-drawer-open .topnav{z-index:230}
  body.nav-drawer-open .nav-scrim{display:block;opacity:1;visibility:visible}
  .rail-link,.rail-group-toggle{min-height:44px;padding-left:16px}
  .nav-rail.expanded .rail-search .gsearch-in{height:44px;min-height:44px}
  .nav-rail.expanded .rail-search .gs-item{min-height:44px;box-sizing:border-box;align-items:center}
  .rail-dot{left:29px}
}

.inbox-resizer{position:absolute;top:0;right:-3px;width:6px;height:100%;cursor:col-resize;z-index:6}
.inbox-resizer:hover,.inbox-resizer:active{background:var(--accent)}
/* inbox view filters (Open / Unread / Assigned / Mentions / Done) are now styled as folder rows
   in the sidebar — see .inbox-views / .ivw above. */
/* A multi-sentence callout. Deliberately NOT .flash.warn: that is a flex row for
   short single-line messages with an icon, so a paragraph containing <b> or
   <code> gets laid out as columns. */
.notice-block{padding:var(--s-3) var(--s-4);border-radius:var(--r-md);
  background:color-mix(in srgb, var(--warn) 12%, transparent);
  border:1px solid var(--warn-border);color:var(--text-2);
  font-size:var(--fs-md);line-height:1.5}
.notice-block b{color:var(--text)}
.notice-block code{font-family:var(--mono);font-size:.92em;padding:1px 5px;
  border-radius:var(--r-sm);background:var(--surface-3);color:var(--text)}

/* ---- billing-address autocomplete (customer form) ---- */
.cust-addr-field{position:relative}
.addr-suggest{position:absolute;left:0;right:0;top:100%;z-index:90;margin-top:2px;
  display:flex;flex-direction:column;max-height:240px;overflow-y:auto;
  background:var(--surface-2);border:1px solid var(--border-strong);
  border-radius:var(--r-md);box-shadow:var(--sh-2)}
.addr-suggest[hidden]{display:none}
.addr-suggest-item{text-align:left;padding:8px 11px;border:0;background:none;cursor:pointer;
  color:var(--text-2);font:var(--fw-reg) var(--fs-base)/1.35 var(--font)}
.addr-suggest-item:hover{background:var(--surface-3);color:var(--text)}
.addr-suggest-item:focus-visible{outline:none;box-shadow:var(--sh-focus)}
/* The county note is a correctness signal, not decoration: amber when MerchIQ
   had to guess, accent when it actually resolved one. */
.addr-warn{color:var(--amber)!important}
.addr-ok{color:var(--accent)!important}

/* ---- pricing control center ------------------------------------------- */
.pricing-center{max-width:1220px}
.pricing-title{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-5);margin-bottom:var(--s-3)}
.pricing-title .btn{flex:0 0 auto;justify-content:center;min-width:160px;white-space:nowrap}
.pricing-title .btn,.rate-grid-bridge .btn{min-height:44px}
.pricing-title h1{max-width:760px;margin:3px 0 7px;font-size:clamp(1.9rem,3.5vw,3.1rem);line-height:1.04;letter-spacing:-.045em}
.pricing-title p,.pricing-section-head p,.machine-head p{max-width:760px;margin:0;color:var(--text-3);line-height:1.55}
.pricing-kicker{display:block;color:var(--accent);font-size:var(--fs-cap);font-weight:var(--fw-bold);letter-spacing:.09em;text-transform:uppercase}
.pricing-subnav{position:sticky;top:calc(var(--header-h) + 6px);z-index:20;display:flex;gap:4px;overflow-x:auto;margin:0 0 var(--s-4);padding:5px;
  background:color-mix(in srgb,var(--surface-1) 92%,transparent);border:1px solid var(--border);border-radius:var(--r-md);backdrop-filter:blur(12px)}
.pricing-subnav a{flex:0 0 auto;padding:8px 12px;border-radius:var(--r-sm);color:var(--text-3);text-decoration:none;font-size:var(--fs-sm);font-weight:var(--fw-med)}
.pricing-subnav a:hover,.pricing-subnav a.on{background:var(--surface-3);color:var(--text)}
.cost-spine{display:grid;grid-template-columns:minmax(170px,1.2fr) minmax(140px,1fr) 32px minmax(160px,1fr) 32px minmax(180px,1.15fr);
  align-items:stretch;margin:var(--s-4) 0 0;border:1px solid var(--border-strong);border-radius:var(--r-lg);overflow:hidden;background:var(--surface-1);box-shadow:var(--sh-1)}
.cost-spine-label,.cost-spine-step,.cost-spine-result{display:flex;flex-direction:column;justify-content:center;min-height:126px;padding:var(--s-4)}
.cost-spine-label{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 15%,var(--surface-2)),var(--surface-1))}
.cost-spine-label>span{font-size:var(--fs-lg);font-weight:var(--fw-bold)}
.cost-spine-label small,.cost-spine-step small,.cost-spine-result small{color:var(--text-3)}
.cost-spine-step strong,.cost-spine-result strong{font-family:var(--mono);font-size:clamp(1.45rem,2.5vw,2.1rem);line-height:1.15;font-variant-numeric:tabular-nums}
.cost-spine-step>span,.cost-spine-result>span{color:var(--text-3);font-size:var(--fs-sm)}
.cost-spine-symbol{display:grid;place-items:center;color:var(--text-3);font-size:1.35rem}
.cost-spine-result{background:color-mix(in srgb,var(--accent) 10%,var(--surface-2));border-left:1px solid color-mix(in srgb,var(--accent) 35%,var(--border))}
.cost-spine-result strong{color:var(--accent)}
.pricing-callout{margin:var(--s-3) 0;padding:var(--s-3) var(--s-4);border:1px solid var(--warn-border);border-radius:var(--r-md);
  background:color-mix(in srgb,var(--warn) 9%,var(--surface-1));color:var(--text-2);line-height:1.5}
.pricing-snapshot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-3);margin:var(--s-4) 0}
.pricing-snapshot article{display:flex;flex-direction:column;min-height:150px;padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1)}
.pricing-snapshot article>span{color:var(--text-3);font-size:var(--fs-sm)}
.pricing-snapshot article>strong{margin:4px 0;font-family:var(--mono);font-size:1.65rem;font-variant-numeric:tabular-nums}
.pricing-snapshot article>small{color:var(--text-3);line-height:1.4}
.pricing-snapshot article>a{margin-top:auto;padding-top:var(--s-3);color:var(--accent);font-size:var(--fs-sm);text-decoration:none}
.pricing-section{scroll-margin-top:calc(var(--header-h) + 72px);margin:var(--s-5) 0;padding:clamp(18px,3vw,30px);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.pricing-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-5);margin-bottom:var(--s-4)}
.pricing-section-head h2,.rate-grid-bridge h2{margin:3px 0 7px;font-size:clamp(1.35rem,2.3vw,2rem);letter-spacing:-.025em}
.pricing-section-total{text-align:right}
.pricing-section-total small{display:block;color:var(--text-3)}
.pricing-section-total b{font-family:var(--mono);font-size:1.45rem}
.cost-method-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3)}
.cost-method-grid article{position:relative;padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.cost-method-grid article.recommended{border-color:color-mix(in srgb,var(--accent) 55%,var(--border));box-shadow:inset 3px 0 0 var(--accent)}
.cost-method-grid h3{margin:8px 0;font-size:var(--fs-lg)}
.cost-method-grid p,.cost-method-grid li{color:var(--text-3);font-size:var(--fs-sm);line-height:1.5}
.cost-method-grid ul{margin:12px 0 0;padding-left:18px}
.method-badge{display:inline-flex;padding:3px 7px;border-radius:var(--r-pill);background:var(--surface-3);color:var(--text-3);font-size:11px;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em}
.recommended .method-badge{background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent)}
.pricing-recommendation{margin:var(--s-4) 0 0;padding-top:var(--s-3);border-top:1px solid var(--border);color:var(--text-2);line-height:1.55}
/* Pricing overview: full-size editor controls */
.pricing-center input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]),
.pricing-center select{height:44px;min-height:44px;box-sizing:border-box}
.pricing-cost-form input,.pricing-cost-form select,.pricing-cost-form textarea{min-width:0;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm);padding:9px 10px;color:var(--text);font:inherit}
.pricing-cost-form .btn.mini{min-height:44px}
.markup-tier-table{margin-bottom:var(--s-3)}
.markup-tier-head,.markup-tier-row{display:grid;grid-template-columns:minmax(140px,1fr) minmax(120px,1fr) 44px;gap:8px;align-items:center}
.markup-tier-head{padding:0 7px 7px;color:var(--text-3);font-size:11px;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em}
.markup-tier-row{padding:6px;border-radius:var(--r-sm)}
.markup-tier-row:hover{background:var(--surface-2)}
.markup-tier-open-label{color:var(--text-2);font-size:var(--fs-sm)}
.cost-table-head,.cost-input-row{display:grid;grid-template-columns:minmax(180px,2fr) minmax(120px,1fr) minmax(120px,.8fr) minmax(110px,.8fr) 44px;gap:8px;align-items:center}
.cost-table-head,.machine-table-head{padding:0 7px 7px;color:var(--text-3);font-size:11px;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.05em}
.cost-input-row{padding:6px;border-radius:var(--r-sm)}
.cost-input-row:hover,.machine-input-row:hover{background:var(--surface-2)}
.money-input,.suffix-input{display:flex;align-items:center;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-sm)}
.money-input>span,.suffix-input>span{padding-left:9px;color:var(--text-3);font-family:var(--mono)}
.money-input input,.suffix-input input{width:100%;border:0;background:transparent}
.cost-remove{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:var(--r-sm);background:transparent;color:var(--text-3);cursor:pointer;font-size:1.2rem}
.cost-remove:hover{background:var(--danger-bg);color:var(--danger)}
.capacity-box,.labor-burden-box{display:grid;grid-template-columns:minmax(260px,2fr) minmax(150px,.7fr) minmax(150px,.7fr);gap:var(--s-3);align-items:end;
  margin:var(--s-4) 0;padding:var(--s-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-2)}
.capacity-box h3,.labor-burden-box h3,.machine-head h3{margin:0 0 5px}
.capacity-box p,.labor-burden-box p{margin:0;color:var(--text-3);font-size:var(--fs-sm);line-height:1.5}
.capacity-box label,.labor-burden-box label{display:flex;flex-direction:column;gap:5px;font-size:var(--fs-sm);font-weight:var(--fw-semi)}
.labor-burden-box{grid-template-columns:minmax(280px,2fr) minmax(150px,.7fr) minmax(140px,.7fr)}
.labor-coverage{display:flex;flex-direction:column;padding:9px 0}
.labor-coverage b{font-family:var(--mono);font-size:1.3rem}
.labor-coverage span{color:var(--text-3);font-size:var(--fs-sm)}
.pricing-form-actions{display:flex;justify-content:space-between;align-items:center;gap:var(--s-3);margin-top:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--border)}
.pricing-save-state{display:inline-flex;align-items:center;gap:6px;margin-left:auto;color:var(--text-3);font-size:11px;white-space:nowrap}
.pricing-save-state>span{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 12%,transparent)}
.pricing-save-state b{font-weight:700}.pricing-save-state.dirty{color:var(--warning)}
.pricing-save-state.dirty>span{background:var(--warning);box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 13%,transparent)}
.actual-cost-table{margin:var(--s-4) 0;border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden}
.actual-cost-row{display:grid;grid-template-columns:minmax(180px,1.4fr) repeat(4,minmax(100px,.8fr));gap:var(--s-2);padding:11px 14px;border-top:1px solid var(--border-faint);font-variant-numeric:tabular-nums}
.actual-cost-row:first-child{border-top:0}
.actual-cost-row.head{background:var(--surface-2);color:var(--text-3);font-size:11px;font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.04em}
.actual-cost-row .warn{color:var(--amber)}
.pricing-empty{margin:var(--s-4) 0;padding:var(--s-4);border:1px dashed var(--border-strong);border-radius:var(--r-md);color:var(--text-3);text-align:center}
.machine-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s-3);margin:var(--s-5) 0 var(--s-2)}
.machine-table-head,.machine-input-row{display:grid;grid-template-columns:minmax(170px,1.5fr) minmax(130px,1fr) repeat(3,minmax(110px,.8fr)) minmax(100px,.7fr) 44px;gap:8px;align-items:center}
.machine-input-row{padding:6px;border-radius:var(--r-sm)}
.machine-rate{font-family:var(--mono);font-size:var(--fs-sm);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums}
.rate-grid-bridge{display:grid;grid-template-columns:minmax(300px,2fr) minmax(220px,1fr) auto;align-items:center;gap:var(--s-5);
  background:linear-gradient(135deg,var(--surface-1),color-mix(in srgb,var(--accent) 8%,var(--surface-2)))}
.rate-grid-bridge p{margin:0;color:var(--text-3);line-height:1.5}
.rate-grid-bridge-stats{display:flex;flex-direction:column;gap:8px;color:var(--text-3);font-size:var(--fs-sm)}
.rate-grid-bridge-stats b{color:var(--text);font-family:var(--mono)}

@media(max-width:980px){
  .cost-spine{grid-template-columns:1fr 1fr}
  .cost-spine-label,.cost-spine-result{grid-column:span 2}
  .cost-spine-symbol{display:none}
  .cost-spine-step{min-height:100px}
  .pricing-snapshot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .machine-table-head{display:none}
  .machine-input-row{grid-template-columns:repeat(2,minmax(0,1fr));padding:12px;margin-bottom:8px;border:1px solid var(--border)}
  .machine-input-row>input:first-child{grid-column:span 2}
  .rate-grid-bridge{grid-template-columns:1fr}
}
@media(max-width:720px){
  .pricing-title,.pricing-section-head,.machine-head,.pricing-form-actions{align-items:stretch;flex-direction:column}
  .pricing-title .btn,.pricing-form-actions .btn{justify-content:center;width:100%}
  .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    overflow:visible;margin-left:-8px;margin-right:-8px;border-radius:0}
  .pricing-subnav a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;box-sizing:border-box;
    padding:8px 5px;text-align:center;line-height:1.25;white-space:normal}
  .pricing-snapshot,.cost-method-grid{grid-template-columns:1fr}
  .pricing-snapshot article>a{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box}
  .cost-table-head,.markup-tier-head{display:none}
  .cost-input-row{grid-template-columns:1fr 1fr;padding:12px;margin-bottom:8px;border:1px solid var(--border)}
  .cost-input-row>input:first-child{grid-column:span 2}
  .markup-tier-row{grid-template-columns:1fr 1fr;padding:12px;margin-bottom:8px;border:1px solid var(--border)}
  .cost-remove{justify-self:end}
  .capacity-box,.labor-burden-box{grid-template-columns:1fr}
  .actual-cost-row{grid-template-columns:1fr 1fr}
  .actual-cost-row.head{display:none}
  .machine-input-row{grid-template-columns:1fr}
  .machine-input-row>input:first-child{grid-column:auto}
  .cost-spine{grid-template-columns:1fr}
  .cost-spine-label,.cost-spine-result{grid-column:auto}
  .cost-spine-label,.cost-spine-step,.cost-spine-result{min-height:auto;padding:18px}
}
@container workspace (max-width:760px){
  .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    overflow:visible;margin-left:-8px;margin-right:-8px;border-radius:0}
  .pricing-subnav a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;box-sizing:border-box;
    padding:8px 5px;text-align:center;line-height:1.25;white-space:normal}
  .pricing-snapshot article>a{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box}
}
/* Match the phone layout when the expanded rail leaves the pricing center with a
   phone-sized workspace, even if the browser viewport itself is still tablet-sized. */
@container workspace (max-width:640px){
  .pricing-title,.pricing-section-head,.machine-head,.pricing-form-actions{align-items:stretch;flex-direction:column}
  .pricing-title .btn,.pricing-form-actions .btn{justify-content:center;width:100%}
  .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    overflow:visible;margin-left:-8px;margin-right:-8px;border-radius:0}
  .pricing-subnav a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:44px;box-sizing:border-box;
    padding:8px 5px;text-align:center;line-height:1.25;white-space:normal}
  .pricing-snapshot article>a{display:inline-flex;align-items:center;min-height:44px;box-sizing:border-box}
  .pricing-snapshot,.cost-method-grid{grid-template-columns:1fr}
  .cost-table-head,.markup-tier-head{display:none}
  .cost-input-row{grid-template-columns:1fr 1fr;padding:12px;margin-bottom:8px;border:1px solid var(--border)}
  .cost-input-row>input:first-child{grid-column:span 2}
  .markup-tier-row{grid-template-columns:1fr 1fr;padding:12px;margin-bottom:8px;border:1px solid var(--border)}
  .cost-remove{justify-self:end}
  .capacity-box,.labor-burden-box{grid-template-columns:1fr}
  .actual-cost-row{grid-template-columns:1fr 1fr}
  .actual-cost-row.head{display:none}
  .machine-input-row{grid-template-columns:1fr}
  .machine-input-row>input:first-child{grid-column:auto}
  .cost-spine{grid-template-columns:1fr}
  .cost-spine-label,.cost-spine-result{grid-column:auto}
  .cost-spine-label,.cost-spine-step,.cost-spine-result{min-height:auto;padding:18px}
}

/* Pricing overview: action-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .pricing-center{gap:8px;padding-top:12px}
  .pricing-center .pricing-title{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0 0 8px}
  .pricing-center .pricing-title .pricing-kicker,
  .pricing-center .pricing-title p{display:none}
  .pricing-center .pricing-title h1{margin:0;font-size:clamp(1.2rem,3.4vw,1.55rem);line-height:1.05;letter-spacing:-.025em}
  .pricing-center .pricing-title .btn{width:auto;min-width:0;min-height:44px;padding:9px 14px}
  .pricing-center .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:max-content;gap:3px;overflow-x:auto;margin:0;padding:4px;border-radius:var(--r-md)}
  .pricing-center .pricing-subnav a{min-width:0;padding:7px 10px;white-space:nowrap}
  .pricing-center .cost-spine{grid-template-columns:repeat(3,minmax(0,1fr));margin:0}
  .pricing-center .cost-spine-label,
  .pricing-center .cost-spine-symbol{display:none}
  .pricing-center .cost-spine-result{grid-column:auto}
  .pricing-center .cost-spine-step,
  .pricing-center .cost-spine-result{min-height:82px;padding:9px 10px}
  .pricing-center .cost-spine-step strong,
  .pricing-center .cost-spine-result strong{font-size:clamp(1.1rem,3.6vw,1.35rem)}
  .pricing-center .cost-spine-step>span,
  .pricing-center .cost-spine-result>span{font-size:.7rem;line-height:1.2}
}

/* Product-first pricing control center */
/* Product pricing: full-size editor controls */
.product-control input:not([type=checkbox]):not([type=radio]):not([type=hidden]),
.product-control select,
.product-control textarea{min-height:44px;box-sizing:border-box}
.product-new{position:relative}.product-new>summary{list-style:none}.product-new>summary::-webkit-details-marker{display:none}
.product-new summary.btn,.product-new form .btn,.pricing-rule>.btn,.product-actions .btn,.pricing-checker>.btn{min-height:44px}
.product-new form{position:absolute;z-index:20;right:0;top:calc(100% + 8px);display:grid;gap:8px;width:320px;padding:14px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface-1);box-shadow:var(--shadow-lg)}
.product-new input,.product-new select,.product-editor input,.product-editor select,.product-editor textarea,.product-ledger input{min-width:0;padding:9px 10px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);color:var(--text);font:inherit}
.product-workbench{display:grid;grid-template-columns:280px minmax(0,1fr);gap:14px;align-items:start;container-type:inline-size}
.product-ledger{position:sticky;top:calc(var(--header-h) + 64px);overflow:hidden;max-height:calc(100vh - var(--header-h) - 88px);border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.product-ledger-head{display:grid;gap:9px;padding:14px;border-bottom:1px solid var(--border);background:var(--surface-2)}
.product-ledger-head b{font-size:var(--fs-sm);text-transform:uppercase;letter-spacing:.05em}
.product-list{overflow:auto;max-height:calc(100vh - var(--header-h) - 170px)}
.product-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border-bottom:1px solid var(--border-faint);color:var(--text);text-decoration:none}
.product-row[hidden]{display:none}
.product-row:hover,.product-row.selected{background:color-mix(in srgb,var(--accent) 7%,var(--surface-2))}
.product-row.selected{box-shadow:inset 3px 0 0 var(--accent)}
.product-row.archived{opacity:.48}.product-row span:nth-child(2){display:grid;gap:2px}.product-row small{overflow:hidden;color:var(--text-3);font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.product-row em{padding:3px 6px;border:1px solid var(--border);border-radius:var(--r-pill);color:var(--text-3);font-size:10px;font-style:normal;text-transform:uppercase}
.product-glyph{display:grid;place-items:center;width:32px;height:32px;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--border));border-radius:7px;background:color-mix(in srgb,var(--accent) 9%,transparent);color:var(--accent);font-family:var(--mono);font-size:11px;font-weight:800}
.product-editor{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:14px;align-items:start}
.product-editor-main,.pricing-checker{border:1px solid var(--border);border-radius:var(--r-lg);background:var(--surface-1)}
.product-editor-main{overflow:hidden}.product-record-head{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;border-bottom:1px solid var(--border);background:linear-gradient(120deg,var(--surface-2),color-mix(in srgb,var(--accent) 5%,var(--surface-1)))}
.product-record-head h2{margin:3px 0 0;font-size:1.55rem}.product-status{padding:5px 9px;border-radius:var(--r-pill);background:color-mix(in srgb,var(--success) 13%,transparent);color:var(--success);font-size:11px;font-weight:800;text-transform:uppercase}.product-status.archived{background:var(--surface-3);color:var(--text-3)}
.product-record-state{display:flex;align-items:center;gap:9px}.product-save-state{display:flex;align-items:center;gap:6px;color:var(--text-3);font-size:11px;white-space:nowrap}.product-save-state>span{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 12%,transparent)}.product-save-state b{font-weight:700}.product-save-state.dirty{color:var(--warning)}.product-save-state.dirty>span{background:var(--warning);box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 13%,transparent)}
.product-record-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:18px 22px}
.product-record-fields label,.method-panel label,.checker-inputs label{display:grid;gap:5px;color:var(--text-2);font-size:12px;font-weight:700}.product-record-fields .wide,.method-panel .wide,.checker-inputs .wide{grid-column:1/-1}
.pricing-rule{padding:20px 22px;border-top:1px solid var(--border)}
.section-label{display:flex;gap:12px;align-items:flex-start;margin-bottom:15px}.section-label>span{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--border);border-radius:50%;color:var(--accent);font-family:var(--mono);font-size:11px}.section-label h3{margin:0 0 3px}.section-label p{margin:0;color:var(--text-3);font-size:var(--fs-sm)}
.method-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-bottom:14px}.method-tabs input{position:absolute;opacity:0;pointer-events:none}.method-tabs span{display:grid;gap:2px;padding:11px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);cursor:pointer}.method-tabs small{color:var(--text-3)}.method-tabs input:checked+span{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--surface-2))}
.method-panel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end;padding:13px;border:1px solid var(--border-faint);border-radius:var(--r-md);background:var(--surface-2)}.method-panel[hidden]{display:none}.method-panel.always{margin-bottom:14px}.formula-help{margin:1px 0 0;color:var(--text-3);font-size:11px;line-height:1.5}.formula-help code{color:var(--cyan)}
.rule-table{margin:8px 0}.rule-table-head,.rule-row{display:grid;grid-template-columns:1fr 1fr 34px;gap:7px;align-items:center;padding:6px}.rule-table-head{color:var(--text-3);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.rule-row{border-top:1px solid var(--border-faint)}.rule-table.modifiers .rule-table-head,.modifier-row{grid-template-columns:minmax(120px,1.5fr) minmax(110px,1fr) 90px 90px 58px 34px}.modifier-row input[type=checkbox]{width:18px;height:18px;justify-self:center}
.product-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 22px;border-top:1px solid var(--border);background:var(--surface-2)}.product-actions>div{display:flex;align-items:center;gap:9px}.btn.danger{color:var(--danger)}
.pricing-checker{position:sticky;top:calc(var(--header-h) + 64px);padding:18px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,var(--surface-1)),var(--surface-1))}
.product-modifiers{display:flex;flex-wrap:wrap;gap:8px}.product-modifiers label{display:flex;align-items:center;gap:6px;padding:7px 9px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--surface-2);font-size:12px}.product-modifiers input{width:16px;height:16px}.pricing-managed,.pricing-source-note{color:var(--accent);font-size:12px;font-weight:700}.pricing-managed{display:flex;align-items:center;min-height:38px;padding:9px 10px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--border));border-radius:var(--r-sm);background:color-mix(in srgb,var(--accent) 6%,var(--surface-2))}.pricing-source-note{padding:8px 10px;border-left:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 5%,transparent)}
.receipt-top{display:flex;justify-content:space-between;padding-bottom:9px;border-bottom:1px dashed var(--border-strong);color:var(--text-3);font-family:var(--mono);font-size:10px;letter-spacing:.08em}.receipt-top b{color:var(--accent)}.pricing-checker h3{margin:18px 0 3px}.pricing-checker>p{margin:0 0 14px;color:var(--text-3);font-size:var(--fs-sm)}.checker-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}.checker-modifier{display:flex;gap:7px;padding:7px 0;color:var(--text-2);font-size:12px}.pricing-checker>.btn{width:100%;margin:12px 0}
.receipt-lines{min-height:74px;padding:10px 0;border-top:1px dashed var(--border-strong);border-bottom:1px dashed var(--border-strong)}.receipt-lines>div{display:flex;justify-content:space-between;gap:8px;padding:4px 0;font-family:var(--mono);font-size:11px}.receipt-total{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0 8px;font-family:var(--mono)}.receipt-total strong{font-size:1.55rem;color:var(--accent)}.receipt-margin{display:flex;justify-content:space-between;color:var(--text-3);font-size:11px}.receipt-margin b{display:block;margin-top:3px;color:var(--text);font-family:var(--mono)}
@media(max-width:1180px){.product-editor{grid-template-columns:1fr}.pricing-checker{position:static}.product-workbench{grid-template-columns:240px minmax(0,1fr)}}
@container(max-width:1050px){.product-editor{grid-template-columns:1fr}.pricing-checker{position:static}}
@media(max-width:820px){.product-workbench{grid-template-columns:1fr}.product-ledger{position:static;max-height:340px}.product-list{max-height:260px}.method-tabs{grid-template-columns:repeat(2,1fr)}.method-panel{grid-template-columns:1fr 1fr}.rule-table.modifiers .rule-table-head{display:none}.modifier-row{grid-template-columns:1fr 1fr}.modifier-row .cost-remove{justify-self:end}.product-actions{align-items:stretch;flex-direction:column}.product-actions>div{justify-content:space-between}}
@media(max-width:560px){.product-record-fields,.method-panel{grid-template-columns:1fr}.product-record-fields .wide,.method-panel .wide{grid-column:auto}.product-new form{position:fixed;left:12px;right:12px;top:100px;width:auto}.product-editor-main{border-radius:var(--r-md)}.product-record-head{align-items:flex-start}.product-record-state{align-items:flex-end;flex-direction:column}.product-actions>div:first-child{align-items:stretch;flex-direction:column}.product-actions>div:first-child .btn{width:100%;white-space:nowrap}}
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .product-control{gap:10px;padding-top:12px}
  .product-control .pricing-title{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0}
  .product-control .pricing-kicker,
  .product-control .pricing-title p{display:none}
  .product-control .pricing-title h1{margin:0;font-size:clamp(1.2rem,3.4vw,1.55rem);line-height:1.05}
  .product-control .product-new>summary{min-height:44px;width:auto;min-width:0;padding:9px 14px}
  .product-control .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:max-content;gap:3px;overflow-x:auto;margin:0;padding:4px;border-radius:var(--r-md)}
  .product-control .pricing-subnav a{padding:7px 10px;white-space:nowrap}
  .product-control .product-workbench{gap:8px}
  .product-control .product-ledger{max-height:280px}
  .product-control .product-ledger-head{grid-template-columns:auto minmax(180px,1fr);align-items:center;gap:8px;padding:8px 10px}
  .product-control .product-ledger-head b{white-space:nowrap}
  .product-control .product-ledger-head input{min-height:44px}
  .product-control .product-row{min-height:44px;padding:7px 10px}
}
/* Commission control center ------------------------------------------------ */
.commissions-page {
  width: min(1600px, calc(100% - 48px));
  margin: 0 auto;
  padding: 34px 0 80px;
}
.commission-hero { align-items: flex-end; gap: 28px; }
.commission-basis-note {
  display: grid;
  gap: 4px;
  max-width: 380px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--line));
  border-radius: 14px;
  background: color-mix(in srgb, var(--brand) 8%, var(--panel));
}
.commission-basis-note strong { color: var(--brand); font-size: .76rem; letter-spacing: .08em; text-transform: uppercase; }
.commission-basis-note span { color: var(--muted); font-size: .88rem; line-height: 1.45; }
.commission-person { margin-top: 28px; }
.commission-person + .commission-person { padding-top: 28px; border-top: 1px solid var(--line); }
.commission-person-head, .commission-plan-title, .section-head, .commission-stack-row, .payout-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.commission-person-head h2, .commission-admin-head h2 { margin: 2px 0 0; }
.commission-plan-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; }
.commission-plan-chip { padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--panel2); font-size: .76rem; }
.commission-plan-chip strong { color: var(--text); }
.commission-plan-chip.is-ended { opacity: .65; }
.commission-code-ticket{position:relative;display:inline-flex;align-items:center;min-height:22px;padding:3px 8px;
  border:1px solid color-mix(in srgb,var(--brand) 48%,var(--line));border-radius:5px;background:color-mix(in srgb,var(--brand) 8%,var(--panel2));
  color:var(--brand);font:700 .68rem/1 var(--mono);letter-spacing:.055em;white-space:nowrap}
.commission-code-ticket::before,.commission-code-ticket::after{content:"";position:absolute;top:50%;width:5px;height:5px;
  border:1px solid color-mix(in srgb,var(--brand) 48%,var(--line));border-radius:50%;background:var(--panel);transform:translateY(-50%)}
.commission-code-ticket::before{left:-4px}.commission-code-ticket::after{right:-4px}
.commission-code-ticket.is-large{min-height:30px;padding:5px 11px;font-size:.76rem}
.commission-plan-chip .commission-code-ticket{margin-right:5px}
.commission-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 16px 0;
}
.commission-kpi {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--panel) 94%, white), var(--panel));
  box-shadow: 0 12px 34px rgb(0 0 0 / .12);
}
.commission-kpi span, .commission-kpi small { display: block; color: var(--muted); }
.commission-kpi span { font-size: .76rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.commission-kpi strong { display: block; margin: 8px 0 5px; font: 700 clamp(1.45rem, 2.5vw, 2.15rem)/1.05 var(--mono); color: var(--text); }
.commission-kpi small { font-size: .78rem; }
.commission-kpi.is-earned { border-color: color-mix(in srgb, var(--brand) 46%, var(--line)); }
.commission-kpi.is-earned strong { color: var(--brand); }
.commission-kpi.is-pending { border-color: color-mix(in srgb, #d9a441 48%, var(--line)); }
.commission-kpi.is-paid { border-color: color-mix(in srgb, #57b57a 46%, var(--line)); }
.commission-ledger { padding: 0; overflow: hidden; }
.commission-ledger .section-head, .commission-plans > .section-head, .commission-lower-grid .section-head { padding: 20px 22px 14px; }
.section-head h3 { margin: 0 0 4px; }
.section-head p { margin: 0; }
.commission-table { min-width: 1240px; }
.commission-table td { vertical-align: top; }
.commission-table td small { display: block; max-width: 280px; margin-top: 3px; color: var(--muted); }
.commission-amount { color: #74d596; font-family: var(--mono); font-weight: 700; }
.commission-amount.is-negative { color: #f08a8a; }
.commission-discount-debit{color:#e4b95f;font-family:var(--mono);font-weight:700}
.commission-entry.is-reversal { background: rgb(235 104 104 / .035); }
.commission-entry.is-adjustment { background: rgb(62 212 224 / .035); }
.status-pill.is-earned, .status-pill.is-eligible, .status-pill.is-paid, .status-pill.is-active { border-color: rgb(87 181 122 / .45); color: #85d89f; }
.status-pill.is-pending, .status-pill.is-draft, .status-pill.is-approved { border-color: rgb(217 164 65 / .48); color: #e4b95f; }
.status-pill.is-ineligible, .status-pill.is-void { border-color: rgb(235 104 104 / .45); color: #ed9797; }
.commission-admin { margin-top: 46px; padding-top: 34px; border-top: 1px solid var(--line); }
.commission-admin-head { margin-bottom: 18px; }
.commission-policy-callout { display: flex; gap: 10px 18px; align-items: baseline; margin: -4px 0 16px; padding: 13px 15px; border: 1px solid rgb(217 164 65 / .32); border-radius: 12px; background: rgb(217 164 65 / .07); }
.commission-policy-callout strong { color: #e4b95f; white-space: nowrap; }
.commission-policy-callout span { color: var(--muted); line-height: 1.45; }
.commission-control-grid, .commission-lower-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.commission-form-card { position: relative; padding: 24px; overflow: hidden; }
.commission-step { display: inline-block; margin-bottom: 8px; color: var(--brand); font: 700 .76rem var(--mono); letter-spacing: .12em; }
.commission-form-card h3 { margin: 0 0 6px; }
.commission-form { display: grid; gap: 13px; margin-top: 18px; }
.commission-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.commission-form .field { margin: 0; }
.commission-form input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
.commission-form select, .commission-form .btn { min-width: 44px; min-height: 44px; box-sizing: border-box; }
.commission-form.compact { margin-top: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel2); }
.commission-adjustment { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.commission-adjustment summary, .commission-plan-card summary { display: flex; align-items: center; min-height: 44px; box-sizing: border-box; color: var(--muted); cursor: pointer; }
.commission-plans { margin-top: 16px; padding: 0 0 20px; }
.commission-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 0 20px; }
.commission-plan-card { padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--panel2); }
.commission-plan-card.is-ended { opacity: .72; }
.commission-plan-title > div, .commission-plan-meta { display: grid; gap: 4px; }
.commission-plan-title span, .commission-plan-meta { color: var(--muted); font-size: .8rem; }
.commission-plan-meta { margin: 14px 0; line-height: 1.45; }
.commission-plan-meta strong { color: var(--text); }
.commission-plan-card details + details { margin-top: 8px; }
.commission-end-form { display: flex; gap: 8px; margin-top: 10px; }
.commission-end-form input { min-width: 0; }
.commission-lower-grid { margin-top: 16px; align-items: start; }
.commission-lower-grid > .card { padding: 0 0 10px; }
.commission-stack { display: grid; }
.commission-stack-row { padding: 14px 20px; border-top: 1px solid var(--line); align-items: flex-start; }
.commission-stack-row > div:first-child { display: grid; gap: 3px; }
.commission-stack-row span, .commission-stack-row small { color: var(--muted); }
.commission-stack-row small { line-height: 1.4; }
.payout-actions { flex-wrap: wrap; justify-content: flex-end; }
.payout-actions form { margin: 0; }
.commission-empty { display: grid; gap: 5px; padding: 34px 22px; color: var(--muted); text-align: center; }
.commission-empty strong { color: var(--text); }
.commission-empty.compact { padding: 24px 20px; }
.commission-first-empty { margin-top: 24px; border: 1px dashed var(--line); border-radius: 16px; }

@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .commissions-page{width:calc(100% - 40px);padding-top:12px}
  .commission-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0;padding-bottom:10px}
  .commission-hero .workspace-kicker,
  .commission-hero .workspace-subtitle{display:none}
  .commission-hero h1{font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .commission-basis-note{max-width:none;padding:7px 10px}
  .commission-basis-note span{display:none}
  .commissions-page .pricing-subnav{top:calc(var(--header-h) + 2px);display:grid;grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:max-content;gap:3px;overflow-x:auto;margin:0;padding:4px;border-radius:var(--r-md)}
  .commissions-page .pricing-subnav a{padding:7px 10px;white-space:nowrap}
  .commission-first-empty{display:none}
  .commission-admin{margin-top:0;padding-top:10px}
  .commission-admin-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0}
  .commission-admin-head .workspace-kicker,
  .commission-admin-head p{display:none}
  .commission-admin-head h2{margin:0;font-size:1rem}
  .commission-admin-head .btn{min-height:44px}
  .commission-admin>.muted,
  .commission-policy-callout{display:none}
  .commission-control-grid{gap:8px;margin-top:8px}
  .commission-form-card{padding:12px}
  .commission-step,
  .commission-form-card>p{display:none}
  .commission-form-card h3{margin:0}
  .commission-form{gap:8px;margin-top:10px}
}

/* Per-user module access editor ------------------------------------------- */
.team-access-dialog{width:min(860px,calc(100vw - 32px));max-height:min(820px,calc(100vh - 32px));
  padding:0;border:1px solid var(--border-strong);border-radius:var(--r-lg);background:var(--surface-1);
  color:var(--text);box-shadow:var(--sh-2);overflow:hidden}
.team-access-dialog::backdrop{background:rgba(8,10,12,.78);backdrop-filter:blur(3px)}
.module-access-form {
  display: flex;
  flex-direction: column;
  max-height: min(818px, calc(100vh - 34px));
  width: 100%;
  margin: 0;
  padding: 0;
  background: var(--surface-1);
  text-align: left;
}
.module-access-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s-5);
  padding:20px 22px;border-bottom:1px solid var(--border);background:linear-gradient(135deg,var(--selected-bg),transparent 50%)}
.module-access-head h2{margin:4px 0 3px;font-size:var(--fs-xl)}
.module-access-head p{max-width:620px;margin:0;color:var(--text-3)}
.dialog-close{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;padding:0;border:1px solid var(--border);
  border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);font-size:22px;cursor:pointer}
.dialog-close:hover{border-color:var(--border-strong);color:var(--text)}
.access-admin-note{margin:18px 22px 0;padding:12px 14px;border:1px solid var(--warn-border);border-radius:var(--r-sm);
  color:var(--warn);background:var(--warn-bg);line-height:1.45}
.access-admin-note strong{color:var(--text)}
.module-access-toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  padding:14px 22px;border-bottom:1px solid var(--border-faint);background:var(--surface-2)}
.module-access-toolbar>div:first-child{display:grid;gap:2px}
.module-access-toolbar span{color:var(--text-3);font-size:var(--fs-sm)}
.module-access-tools{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.module-access-sections{flex:1;min-height:0;padding:0 22px;overflow-y:auto;overscroll-behavior:contain}
.module-access-group { margin: 0; padding: 16px 0; border: 0; border-top: 1px solid var(--border-faint); }
.module-access-group:first-child{border-top:0}
.module-access-group legend { padding: 0 10px 0 0; color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.module-access-group legend span{margin-left:7px;padding:3px 6px;border:1px solid var(--border);border-radius:var(--r-pill);color:var(--text-3);font-size:9px;letter-spacing:.04em}
.module-access-group.is-locked .module-access-grid{opacity:.58}
.module-access-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.module-access-option { display: flex; gap: 10px; align-items: flex-start; min-height:65px;padding: 10px; border: 1px solid transparent; border-radius: 10px; cursor: pointer; }
.module-access-option:hover { border-color: var(--border); background: var(--surface-2); }
.module-access-option input { margin-top: 3px; accent-color: var(--brand); }
.module-access-option span { display: grid; gap: 2px; }
.module-access-option small { color: var(--muted); line-height: 1.35; }
.module-access-option:has(input:disabled){cursor:default;opacity:.72}
.module-access-foot{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);
  padding:14px 22px;border-top:1px solid var(--border);background:var(--surface-2)}
.module-access-foot>span{max-width:430px;color:var(--text-3);font-size:var(--fs-sm)}
.module-access-foot>div{display:flex;gap:7px}

@media (max-width: 1050px) {
  .commission-kpis, .commission-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .commission-control-grid, .commission-lower-grid { grid-template-columns: 1fr; }
  .role-blueprint-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .team-snapshot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .team-snapshot article:nth-child(2){border-right:0}
  .team-snapshot article:nth-child(-n+2){border-bottom:1px solid var(--border)}
}
@media (max-width: 700px) {
  .commissions-page { width: min(100% - 24px, 1600px); padding-top: 22px; }
  .commission-hero, .commission-person-head, .commission-stack-row { align-items: stretch; flex-direction: column; }
  .commission-basis-note { max-width: none; }
  .commission-policy-callout { align-items: stretch; flex-direction: column; }
  .commission-policy-callout strong { white-space: normal; }
  .commission-kpis, .commission-plan-grid, .commission-form-row, .module-access-grid { grid-template-columns: 1fr; }
  .commission-plan-grid { padding: 0 12px; }
  .commission-form-card { padding: 18px; }
  .payout-actions { justify-content: flex-start; }
  .role-blueprints{padding:var(--s-4)}
  .role-blueprints-head,.module-access-toolbar,.module-access-foot{align-items:stretch;flex-direction:column}
  .role-blueprints-note{max-width:none}
  .role-blueprint-grid{grid-template-columns:1fr}
  .role-blueprint{min-height:0}
  .team-system-grid{grid-template-columns:1fr}
  .team-section-head{align-items:flex-start;flex-direction:column}
  .team-directory-tools{width:100%;justify-content:flex-start}
  .team-search{flex:1}.team-search input{width:100%}
  .team-access-dialog{width:calc(100vw - 16px);max-height:calc(100vh - 16px)}
  .module-access-head{padding:17px}
  .module-access-toolbar{padding:12px 17px}
  .module-access-tools{justify-content:flex-start}
  .module-access-sections{max-height:calc(100vh - 330px);padding:0 17px}
  .module-access-foot{padding:12px 17px}
  .module-access-foot>div{justify-content:flex-end}
}
/* An expanded navigation rail can make the team workspace phone-sized while the
   viewport remains tablet-sized. Keep role cards readable at the actual width. */
@container workspace (max-width:640px){
  .workspace-head{align-items:stretch;flex-direction:column}
  .workspace-actions{justify-content:flex-start}
  .role-blueprints{padding:var(--s-4)}
  .role-blueprints-head{align-items:stretch;flex-direction:column}
  .role-blueprints-note{max-width:none}
  .role-blueprint-grid{grid-template-columns:1fr}
  .role-blueprint{min-height:0}
  .team-section-head{align-items:flex-start;flex-direction:column}
}

/* The team directory becomes a deliberate card list when drawers or a compact
   window reduce the workspace. Keeping the desktop table at these widths made
   names, dates, and controls collapse into narrow word stacks. */
@container workspace (max-width:900px){
  .users-page{padding-inline:var(--s-4)}
  .user-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end}
  .user-form .field{min-width:0}
  .user-form .btn{justify-content:center}
  .role-blueprint-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .team-directory .scroller{overflow:visible;border:0;border-radius:0;background:transparent}
  .team-table{display:block;min-width:0;border:0}
  .team-table thead{display:none}
  .team-table tbody{display:grid;gap:var(--s-3)}
  .team-table .team-member-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,.55fr);
    gap:0 var(--s-4);padding:var(--s-4);border:1px solid var(--border-faint);
    border-radius:var(--r-md);background:var(--surface-2)}
  .team-table .team-member-row:hover{background:var(--surface-2);border-color:var(--border)}
  .team-table .team-member-row>td{display:block;min-width:0;padding:0;border:0;text-align:left;font-family:var(--font)}
  .team-table .team-member-row>td::before{display:block;margin-bottom:4px;color:var(--text-3);
    content:attr(data-label);font:var(--fw-semi) 9px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase}
  .team-member-cell{grid-column:1;grid-row:1}
  .team-email-cell{grid-column:1;grid-row:2;margin-top:5px}
  .team-status-cell{grid-column:2;grid-row:1}
  .team-signin-cell{grid-column:2;grid-row:2;margin-top:5px}
  .team-role-cell{grid-column:1 / -1;grid-row:3;margin-top:var(--s-4);padding-top:var(--s-3)!important;
    border-top:1px solid var(--border-faint)!important}
  .team-table .role-form{display:block}
  .team-table .role-form select{width:100%;min-width:0}
  .team-actions-cell{grid-column:1 / -1;grid-row:4;margin-top:var(--s-3);padding-top:var(--s-3)!important;
    border-top:1px solid var(--border-faint)!important}
  .team-actions-cell::before{margin-bottom:8px!important}
  .team-actions-cell.row-actions{justify-content:flex-start}
  .team-more-menu{margin-left:0}
  .team-actions-cell .pw-form{justify-content:flex-start;flex-wrap:wrap}
}

@container workspace (max-width:560px){
  .users-page{padding:var(--s-4) var(--s-3)}
  .users-page>.card,.role-blueprints{padding:var(--s-4)}
  .workspace-actions .btn{width:100%;justify-content:center}
  .team-snapshot{grid-template-columns:1fr}
  .team-snapshot article{border-right:0;border-bottom:1px solid var(--border)}
  .team-snapshot article:nth-child(3){border-bottom:1px solid var(--border)}
  .team-snapshot article:last-child{border-bottom:0}
  .role-blueprint-grid,.user-form{grid-template-columns:1fr}
  .team-table .team-member-row{grid-template-columns:1fr;padding:var(--s-3)}
  .team-member-cell,.team-email-cell,.team-status-cell,.team-signin-cell,
  .team-role-cell,.team-actions-cell{grid-column:1}
  .team-member-cell{grid-row:1}.team-email-cell{grid-row:2}
  .team-status-cell{grid-row:3;margin-top:var(--s-3)}
  .team-signin-cell{grid-row:4;margin-top:var(--s-2)}
  .team-role-cell{grid-row:5}.team-actions-cell{grid-row:6}
  .team-actions-cell.row-actions{align-items:stretch;flex-direction:column}
  .team-actions-cell>.btn,.team-actions-cell>form,.team-actions-cell>details{width:100%}
  .team-actions-cell summary,.team-actions-cell>form .btn{width:100%;justify-content:center}
  .team-actions-cell .pw-form{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .team-actions-cell .pw-form input{width:100%;min-width:0}
  .team-disclosure-action{font-size:0}
  .team-disclosure-action::after{font-size:15px}
  .role-blueprints:not([open]) .role-blueprints-note{display:none}
}

/* Team: directory-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .users-page{gap:8px;padding:12px 12px 28px}
  .users-page>.workspace-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin:0;padding:0;border-bottom:0}
  .users-page>.workspace-head .workspace-kicker,
  .users-page>.workspace-head .workspace-subtitle{display:none}
  .users-page>.workspace-head h1{margin:0;font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .users-page>.workspace-head .workspace-actions{justify-content:flex-end}
  .users-page>.workspace-head .workspace-actions .btn{width:auto;min-height:44px;padding:9px 12px;white-space:nowrap}
  .users-page>.team-snapshot{grid-template-columns:repeat(4,minmax(0,1fr))}
  .users-page>.team-snapshot article{min-height:54px;gap:2px;padding:6px 8px;border-right:1px solid var(--border);border-bottom:0}
  .users-page>.team-snapshot article:last-child{border-right:0}
  .users-page>.team-snapshot article small{display:none}
  .users-page>.team-snapshot article span{line-height:1.15}
  .users-page>.team-directory{padding:10px}
  .users-page .team-directory>.team-section-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin-bottom:8px}
  .users-page .team-directory>.team-section-head p{display:none}
  .users-page .team-directory>.team-section-head h2{font-size:1rem}
  .users-page .team-directory-tools{width:auto;justify-content:flex-end;flex-wrap:nowrap}
  .users-page .team-search input{min-height:44px}
}

/* Development log: feed-first short landscape */
@media (orientation:landscape) and (max-height:500px) and (min-width:560px) and (max-width:980px){
  .devdash{padding:12px 12px 28px}
  .devdash-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:8px}
  .devdash-head .devdash-kicker,.devdash-head p{display:none}
  .devdash-head h1{margin:0;font-size:clamp(1.25rem,3.4vw,1.65rem);line-height:1.05}
  .devdash-connection{width:auto;min-width:0;min-height:44px;padding:8px 10px}
  .devdash-connection b{white-space:nowrap}
  .devdash-connection small{display:none}
  .devdash-status{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:8px}
  .devdash-status>div{min-height:54px;padding:6px 8px;border-right:1px solid var(--border-faint);border-bottom:0!important}
  .devdash-status>div:last-child{border-right:0}
  .devdash-status strong{margin-top:2px;font-size:16px}
  .devdash-status small{display:none}
  .devdash-grid{gap:8px}
  .devdash-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin-bottom:8px;padding:8px}
  .devdash-search{flex-wrap:nowrap}
  .devdash-search label{flex:1 1 auto}
  .devdash-search input,.devdash-search .btn{min-height:44px}
  .branch-filter{max-width:150px;padding:0}
}