/* =====================================================================
   TRAXIUM INTELLIGENCE — APPLICATION LAYER  (traxium-app.css)
   Load immediately after traxium.css. Restyles the existing PrepTrax,
   ShipTrax, portal and marketing markup with the master design system.
   Uses only var(--tx-*) tokens from traxium.css; defines no colors.
   Everything sits in one cascade layer: its !important declarations
   outrank the unlayered !important rules in the legacy stylesheets.
   ===================================================================== */
@layer traxium-app {

/* ---------- 1. Token bridge ----------
   Legacy stylesheets reuse a few master token names on <body>. Capture the
   master values on <html> and pin them back for every descendant. */
:root {
  --txm-canvas: var(--tx-canvas);
  --txm-text: var(--tx-text);
  --txm-radius-card: var(--tx-radius-card);
  --txm-radius-tile: var(--tx-radius-tile);
  --txm-sidebar-w: var(--tx-sidebar-w);
  --tx-size-hero-number: clamp(35px, 3.52vw, 37px) !important;
  --tx-size-kpi-number: 24px !important;
}
body:is(*, #tx-app-layer) {
  --tx-canvas: var(--txm-canvas) !important;
  --tx-text: var(--txm-text) !important;
  --tx-radius-card: var(--txm-radius-card) !important;
  --tx-radius-tile: var(--txm-radius-tile) !important;
  --tx-sidebar-w: var(--txm-sidebar-w) !important;
}
:is(html, body):is(*, #tx-app-layer) {
  --shell-sidebar-width: var(--txm-sidebar-w) !important;
  --ptx-sidebar-width: var(--txm-sidebar-w) !important;
  --ptx-nav-left-w: var(--txm-sidebar-w) !important;
  --dash-sidebar-width: var(--txm-sidebar-w) !important;

  /* Surfaces */
  --bg: var(--tx-canvas) !important; --bg-primary: var(--tx-canvas) !important;
  --bg-2: var(--tx-card) !important; --bg-3: var(--tx-card) !important; --bg-4: var(--tx-row-alt) !important;
  --bg-panel: var(--tx-card) !important; --bg-panel-2: var(--tx-card) !important;
  --bg-surface: var(--tx-card) !important; --bg-card: var(--tx-card) !important;
  --glass: var(--tx-card) !important; --glass-hover: var(--tx-row-alt) !important; --glass-strong: var(--tx-card) !important;
  --tx-surface: var(--tx-card) !important; --tx-surface-hover: var(--tx-row-alt) !important;
  --tx-surface-active: var(--tx-row-alt) !important; --tx-surface-deep: var(--tx-card) !important;
  --tx-surface-soft: var(--tx-card) !important; --tx-surface-bottom: var(--tx-card) !important;
  --tx-surface-elevated: var(--tx-card) !important; --tx-gradient-surface: var(--tx-card) !important;
  --tx-color-navy-deep: var(--tx-canvas) !important; --tx-color-navy-canvas: var(--tx-card) !important;
  --tx-color-navy-surface: var(--tx-card) !important; --tx-color-navy-elevated: var(--tx-card) !important;
  --ptx-base: var(--tx-canvas) !important; --ptx-deep: var(--tx-canvas) !important; --ptx-canvas-grad: var(--tx-canvas) !important;
  --ptx-glass-bg: var(--tx-card) !important; --ptx-glass-bg-hi: var(--tx-row-alt) !important;
  --ptx-glass-default: var(--tx-card) !important; --ptx-glass-elevated: var(--tx-card) !important;
  --ptx-panel-bg: var(--tx-card) !important; --ptx-ui-surface: var(--tx-card) !important;
  --ptx-ui-surface-raised: var(--tx-card) !important; --trx-panel: var(--tx-card) !important; --trx-panel-2: var(--tx-card) !important;
  --sb-bg: var(--tx-canvas) !important; --sb-overlay-bg: var(--tx-canvas) !important;
  --sb-surface: var(--tx-card) !important; --sb-panel: var(--tx-card) !important;

  /* Lines */
  --border: var(--tx-line) !important; --border-mid: var(--tx-line) !important; --hairline: var(--tx-line) !important;
  --border-hover: var(--tx-input-border) !important; --border-bright: var(--tx-input-border) !important;
  --border-glow: var(--tx-line) !important; --border-blue: var(--tx-line) !important; --border-cyan: var(--tx-line) !important;
  --tx-border: var(--tx-line) !important; --tx-border-mid: var(--tx-line) !important;
  --tx-border-strong: var(--tx-input-border) !important; --tx-border-glow: var(--tx-line) !important;
  --ptx-glass-border: var(--tx-line) !important; --ptx-panel-border: var(--tx-line) !important; --ptx-ui-border: var(--tx-line) !important;
  --trx-border: var(--tx-line) !important; --trx-border-mid: var(--tx-line) !important;
  --labor-border: var(--tx-line) !important; --sb-border: var(--tx-line) !important; --sb-border-strong: var(--tx-input-border) !important;

  /* Text: pure dark on light, pure white on dark. No gray text. */
  --text: var(--tx-text) !important; --text-primary: var(--tx-text) !important; --text-2: var(--tx-text) !important;
  --text-secondary: var(--tx-text) !important; --text-3: var(--tx-text) !important; --text-4: var(--tx-text) !important;
  --text-muted: var(--tx-text) !important; --text-label: var(--tx-text) !important;
  --tx-text-secondary: var(--tx-text) !important; --tx-text-muted: var(--tx-text) !important;
  --ptx-text: var(--tx-text) !important; --ptx-text-primary: var(--tx-text) !important; --ptx-text-secondary: var(--tx-text) !important;
  --ptx-text-muted: var(--tx-text) !important; --ptx-text-dim: var(--tx-text) !important; --ptx-text-body: var(--tx-text) !important;
  --ptx-text-caption: var(--tx-text) !important; --ptx-ui-text: var(--tx-text) !important; --ptx-ui-text-muted: var(--tx-text) !important;
  --trx-text: var(--tx-text) !important; --trx-text-2: var(--tx-text) !important; --trx-muted: var(--tx-text) !important;
  --labor-text: var(--tx-text) !important; --labor-muted: var(--tx-text) !important; --settings-text-muted: var(--tx-text) !important;
  --sb-text: var(--tx-text) !important; --sb-text-2: var(--tx-text) !important; --sb-text-muted: var(--tx-text) !important;

  /* Brand + accents */
  --primary: var(--tx-numbers) !important; --primary-dim: var(--tx-sage) !important; --primary-soft: var(--tx-sage) !important;
  --secondary: var(--tx-numbers) !important; --accent: var(--tx-numbers) !important; --cyan: var(--tx-numbers) !important;
  --blue: var(--tx-numbers) !important; --blue-bright: var(--tx-numbers) !important; --purple: var(--tx-numbers) !important;
  --tx-brand-primary: var(--tx-primary) !important; --tx-brand-secondary: var(--tx-mid) !important;
  --tx-color-blue-brand: var(--tx-numbers) !important; --tx-color-cyan-brand: var(--tx-numbers) !important;
  --tx-color-accent-primary: var(--tx-primary) !important; --tx-color-accent-primary-strong: var(--tx-primary) !important;
  --tx-color-accent-secondary: var(--tx-mid) !important;
  --ptx-cyan-vivid: var(--tx-numbers) !important; --ptx-violet: var(--tx-numbers) !important; --ptx-neon-blue: var(--tx-numbers) !important;
  --ptx-purple: var(--tx-numbers) !important; --ptx-ui-accent: var(--tx-primary) !important;
  --trx-cyan: var(--tx-numbers) !important; --trx-blue: var(--tx-numbers) !important; --electric-blue: var(--tx-numbers) !important;
  --primary-green: var(--tx-primary) !important; --emerald: var(--tx-good-text) !important;
  --sb-cyan: var(--tx-numbers) !important; --sb-cyan-hover: var(--tx-numbers) !important; --sb-cyan-dim: var(--tx-sage) !important;
  --sb-cyan-border: var(--tx-line) !important; --sb-text-on-accent: var(--tx-on-primary) !important;
  --cta: var(--tx-primary) !important; --cta-strong: var(--tx-primary) !important; --cta-gradient: var(--tx-primary) !important;
  --grad-cta: var(--tx-primary) !important; --trx-grad-cta: var(--tx-primary) !important; --tx-gradient-primary: var(--tx-primary) !important;
  --grad-brand: var(--tx-primary) !important; --grad-mesh: none !important;

  /* Status */
  --success: var(--tx-good-text) !important; --green: var(--tx-good-text) !important; --tx-success: var(--tx-good-text) !important;
  --tx-green: var(--tx-good-text) !important; --sb-green: var(--tx-good-text) !important;
  --warning: var(--tx-pending-text) !important; --amber: var(--tx-pending-text) !important; --tx-warning: var(--tx-pending-text) !important;
  --sb-gold: var(--tx-pending-text) !important;
  --danger: var(--tx-problem-text) !important; --red: var(--tx-problem-text) !important; --tx-danger: var(--tx-problem-text) !important;
  --tx-info: var(--tx-numbers) !important; --tx-sky: var(--tx-numbers) !important; --tx-purple: var(--tx-numbers) !important;

  /* Effects: flat design, no glows or blur */
  --shadow-sm: none !important; --shadow-card: none !important; --shadow-card-hover: none !important;
  --shadow-lift: none !important; --shadow-glow: none !important; --shadow-blue: none !important;
  --cta-glow: none !important; --sb-cyan-glow: none !important; --ptx-glow: none !important;
  --ptx-glass-shadow: none !important; --ptx-panel-shadow: none !important; --ptx-shadow-card: none !important;
  --trx-shadow: none !important; --ptx-glass-blur: 0px !important; --ptx-blur-card: 0px !important; --backdrop-blur: none !important;
  --focus-ring-color: var(--tx-focus) !important; --shadow-focus: 0 0 0 3px var(--tx-focus) !important;

  /* Type */
  --font-display: var(--tx-font) !important; --font-body: var(--tx-font) !important;
  --tx-font-sans: var(--tx-font) !important; --font-mono: var(--tx-font-mono) !important;
  --ptx-font: var(--tx-font) !important; --ptx-font-display: var(--tx-font-display) !important;
  --ptx-font-body: var(--tx-font) !important; --ptx-font-mono: var(--tx-font-mono) !important;
  --font-ui: var(--tx-font) !important; --font-family: var(--tx-font) !important;
  --tx-font-table: var(--tx-font) !important; --tx-font-table-mono: var(--tx-font-numbers) !important;
  --tx-radius-container: var(--txm-radius-card) !important;
}
/* ShipTrax page palette */
:root body.operations-dashboard-shell {
  --vision-canvas: var(--tx-canvas) !important; --vision-surface: var(--tx-card) !important; --vision-surface-soft: var(--tx-row-alt) !important;
  --vision-ink: var(--tx-text) !important; --vision-ink-soft: var(--tx-text) !important; --vision-muted: var(--tx-text) !important;
  --vision-border: var(--tx-line) !important; --vision-border-strong: var(--tx-input-border) !important;
  --vision-sidebar: var(--tx-side-bg) !important; --vision-sidebar-raised: var(--tx-side-card-bg) !important; --vision-sidebar-border: var(--tx-side-hair) !important;
  --vision-olive: var(--tx-mid) !important; --vision-active: var(--tx-apricot) !important; --vision-focus: var(--tx-focus) !important;
  --vision-terracotta: var(--tx-primary) !important; --vision-terracotta-dark: var(--tx-primary) !important;
  --vision-blue-gray: var(--tx-line) !important; --vision-blue-gray-dark: var(--tx-mid) !important;
}
:root body.operations-dashboard-shell :is(.operations-live-strip, .operations-hero-footnote span) {
  background: var(--tx-sage) !important; border-color: transparent !important; color: var(--tx-on-sage) !important; text-shadow: none !important;
}
:root body.operations-dashboard-shell :is(.operations-kicker, .dashboard-kicker) { color: var(--tx-numbers) !important; }
:root body.order-queue-shell :is(.tx-main, .tx-container, .order-queue-panel) { min-width: 0 !important; max-width: 100% !important; }
:root body.order-queue-shell .order-queue-table-wrap { overflow: visible !important; max-width: 100% !important; }
:root body.operations-dashboard-shell :is(.order-queue-field-label, .wave-planning-field-label, .form-label) { color: var(--tx-text) !important; }


/* ---------- 2. Base ---------- */
:root, :root body {
  background: var(--tx-canvas) !important;
  background-image: none !important;
}
:root body {
  color: var(--tx-text);
  font-family: var(--tx-font) !important;
  font-size: var(--tx-size-min);
  font-weight: var(--tx-weight-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-optical-sizing: auto;
  font-kerning: normal;
}
:root :is(button, input, select, textarea) { font-family: var(--tx-font) !important; letter-spacing: normal; }
:root body::before, :root body::after,
:root :is(.dash-body, .dashboard-body)::before, :root :is(.dash-body, .dashboard-body)::after,
:root :is(.aurora, .aurora-1, .aurora-2, .aurora-3, .aurora-bg, .bg-mesh, .ptx-aurora, .overview-live-dot) {
  display: none !important;
}
:root :is(h1, h2, h3, h4, h5, h6) { font-family: var(--tx-font-display) !important; color: var(--tx-text); letter-spacing: var(--tx-tracking-heading); }
:root :is(h2, h3, .section-heading, .section-title, .activity-panel-title, .settings-panel-title) {
  font-size: var(--tx-size-section) !important;
  font-weight: var(--tx-weight-bold) !important;
}
:root :is(p, li, td, label, .section-description, .dashboard-hero-description, .activity-panel-copy, .kpi-card-meta,
  .workflow-card-description, .overview-shortcut-copy, .settings-section-copy, .section-subtitle) {
  color: var(--tx-text) !important;
  font-size: max(1em, var(--tx-size-min)) !important;
}
/* Type baseline: zero specificity, so every named rule below still wins. */
:where(:root body) :where(*:not(svg, svg *, sup, .ph, .ph-bold, .ph-fill, .ph-duotone, .ph-light, .ph-thin)) { font-family: inherit !important; }
:where(:root body) :where([class*="-value"], [class*="-number"], [class*="-count"], [class*="-num"], [class*="-pct"], .timer-value, .numeric, .kpi-pill strong) {
  font-family: var(--tx-font-numbers) !important;
  font-variant-numeric: tabular-nums;
}
:where(:root body) :where(.tx-logo-word, .tx-logo-mark, .tx-logo-sub, .sidebar-brand-text, .sidebar-brand-kicker) { font-family: var(--tx-font-brand) !important; }
:where(:root body) :where(code, kbd, samp, pre) { font-family: var(--tx-font-mono) !important; }
:where(:root body) :where(span, small, label, button, a, td, th, li, p, dd, dt, time, strong, em, b, h4, h5, h6,
  div:is([class*="label"], [class*="kicker"], [class*="meta"], [class*="indicator"], [class*="eyebrow"], [class*="empty"], [class*="copy"],
    [class*="desc"], [class*="hint"], [class*="-ref"], [class*="customer"], [class*="summary"], [class*="status"], [class*="note"])):not(:where(
    [class*="value"], [class*="number"], [class*="count"], [class*="title"], [class*="heading"], [class*="price"],
    [class*="amount"], [class*="icon"], [class*="logo"], [class*="clock"], [class*="timer"], h1 *, h2 *, h3 *)) {
  font-size: max(1em, var(--tx-size-min)) !important;
}
:where(:root body) :where(.station-bins-count, .order-queue-count, .progress-value, .std-share-pct, .wave-planning-selection-count, .sku-row-number, .changelog-date,
  .changelog-current-pill, .timer-label, .settings-feedback, .station-pick-wave-loading, .step-circle, legend,
  .price-tier-item-label, .auth-left-footer, .ob-launch-msg, .adv-tag) {
  font-size: max(1em, var(--tx-size-min)) !important;
}
:where(:root body) :where(.operations-shortcut-title, .station-bins-title, .shipment-card-title, .workflow-overview-title, .footer-heading, .diff-title) { font-size: var(--tx-size-label) !important; font-weight: var(--tx-weight-bold) !important; }
:root .tx-logo-word { font-size: var(--tx-size-sidebar) !important; }
:root :is(.tx-logo-sub, .tx-logo-mark) { font-size: var(--tx-size-min) !important; }
:root svg { display: inline-block; }
:root ::selection { background: var(--tx-sage); color: var(--tx-on-sage); }
:root :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 3px; }
:root * { scrollbar-color: var(--tx-line) transparent; }

/* ---------- 3. Shell: sidebar (flat deep teal in both modes) ---------- */
:root :is(.sidebar, .dash-sidebar, .site-sidebar, .ptx-sidebar, .ship-trax-sidebar, .admin-sidebar) {
  background: var(--tx-side-bg) !important;
  background-image: none !important;
  color: var(--tx-side-text) !important;
  border-right: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  text-shadow: none !important;
}
:root :is(.sidebar, .dash-sidebar, .site-sidebar, .ptx-sidebar, .ship-trax-sidebar, .admin-sidebar) * { text-shadow: none !important; }
:root :is(.sidebar-brand, .sidebar-brand-shell, .dash-sidebar-logo, .site-sidebar-logo, .tx-sidebar-context) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 4px 10px 22px !important;
}
:root .tx-sidebar-context { display: none !important; }
:root :is(.sidebar-section-heading, .dash-nav-label, .admin-sidebar-label, .site-sidebar-label) {
  color: var(--tx-side-text) !important;
  font-size: 19px !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 18px 12px 6px !important;
  opacity: 1 !important;
}
:root :is(.sidebar-link, .dash-nav-item, .site-sidebar a.site-nav-item, .ptx-nav-item, .ship-trax-sidebar .nav-item, .admin-nav-item) {
  min-height: var(--tx-nav-row-h) !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 0 10px !important;
  border-radius: var(--tx-radius-row) !important;
  border: 2px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--tx-side-text) !important;
  font-size: var(--tx-size-sidebar) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  opacity: 1 !important;
}
:root :is(.sidebar-link, .dash-nav-item, .site-sidebar a.site-nav-item, .ptx-nav-item, .ship-trax-sidebar .nav-item, .admin-nav-item):hover {
  background: var(--tx-side-card-bg) !important;
  color: var(--tx-side-text) !important;
}
:root :is(.sidebar-link, .dash-nav-item, .site-sidebar a.site-nav-item, .ptx-nav-item, .ship-trax-sidebar .nav-item, .admin-nav-item):is(.active, [aria-current="page"]) {
  background: var(--tx-side-active-bg) !important;
  border-color: var(--tx-side-active-border) !important;
  color: var(--tx-side-text) !important;
  font-weight: var(--tx-weight-bold) !important;
}
:root :is(.sidebar-link, .dash-nav-item, .site-sidebar a.site-nav-item, .ptx-nav-item, .ship-trax-sidebar .nav-item, .admin-nav-item) :is(.sidebar-label, .dash-nav-label, .ptx-nav-label, .nav-label) { color: var(--tx-side-text) !important; opacity: 1 !important; font-size: inherit !important; font-weight: inherit !important; flex: 1 1 auto; }
:root :is(.sidebar, .dash-sidebar, .site-sidebar, .ship-trax-sidebar, .admin-sidebar) :is(a, span, strong, small, p, div, h2, h3) { -webkit-text-fill-color: currentColor !important; }
:root :is(.sidebar-section-heading, .dash-nav-heading) {
  color: var(--tx-side-text) !important;
  font-family: var(--tx-font) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}
:root :is(.sidebar-link, .dash-nav-item)::before, :root :is(.sidebar-link, .dash-nav-item)::after { display: none !important; }
:root :is(.sidebar-icon, .dash-nav-icon, .ptx-nav-icon) {
  width: 50px !important; height: 50px !important; flex: 0 0 50px !important;
  border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-side-tile-bg) !important;
  border: 1.5px solid var(--tx-side-tile-border) !important;
  color: var(--tx-side-text) !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  filter: none !important;
}
:root :is(.sidebar-icon, .dash-nav-icon, .ptx-nav-icon) :is(svg, i, img) { width: 28px !important; height: 28px !important; font-size: 28px !important; color: inherit !important; }
:root :is(.dash-nav-item, .ptx-nav-item, .site-nav-item) > :is(svg, i) {
  width: 50px !important; height: 50px !important; flex: 0 0 50px !important; padding: 10px !important;
  border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-side-tile-bg) !important;
  border: 1.5px solid var(--tx-side-tile-border) !important;
  color: var(--tx-side-text) !important; font-size: 28px !important;
}
:root :is(.sidebar-nav-badge, .dash-nav-badge) {
  background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important;
  border: 0 !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  min-width: 0 !important; border-radius: 999px !important; flex: 0 0 auto !important; white-space: nowrap !important; padding: 2px 8px !important; margin: 0 !important;
  box-shadow: none !important;
}
:root body :is(.sidebar-link, .dash-nav-item):has(> :is(.sidebar-nav-badge, .dash-nav-badge)) {
  display: grid !important; grid-template-columns: 50px minmax(0, 1fr) auto !important; column-gap: 14px !important;
  align-items: center !important;
}
:root :is(.sidebar-link, .dash-nav-item) > :is(.sidebar-nav-badge, .dash-nav-badge) { grid-column: 3; grid-row: 1; justify-self: end; align-self: center; }
:root :is(.sidebar-footer-card, .dash-sidebar-user, .sidebar-footer) {
  background: var(--tx-side-card-bg) !important;
  border: 1.5px solid var(--tx-side-hair) !important;
  border-radius: 14px !important;
  color: var(--tx-side-text) !important;
  box-shadow: none !important;
}
:root :is(.sidebar-footer-card, .dash-sidebar-user, .sidebar-footer) * { color: var(--tx-side-text) !important; font-size: var(--tx-size-min) !important; }
@media (min-width: 1025px) { :root .site-body { grid-template-columns: var(--tx-sidebar-w) minmax(0, 1fr) !important; } }
:root .site-sidebar { padding: 22px 14px 0 !important; }
:root .site-nav { padding: 0 0 18px !important; gap: 4px !important; }
:root .site-sidebar-footer { border-top: 1.5px solid var(--tx-side-hair) !important; padding: 16px 10px 18px !important; gap: 12px !important; }
:root .site-sidebar-tagline { margin: 0 !important; color: var(--tx-side-text) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
:root .site-sidebar .theme-toggle-btn {
  width: var(--tx-touch-min) !important; height: var(--tx-touch-min) !important;
  border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-side-tile-bg) !important;
  border: 1.5px solid var(--tx-side-tile-border) !important;
  color: var(--tx-side-text) !important;
}

/* ---------- 4. Logo ---------- */
.tx-logo-img { display: block; width: 224px; max-width: 100%; height: auto; }
.tx-logo-img--sm { width: 180px; }
.tx-logo-img--hero { width: 440px; }
.home-hero-logo { margin: 0 0 28px !important; }
:root .tx-logo-img--on-dark { display: none !important; }
:root[data-theme="dark"] .tx-logo-img--on-light, :root [data-theme="dark"] .tx-logo-img--on-light { display: none !important; }
:root[data-theme="dark"] .tx-logo-img--on-dark, :root [data-theme="dark"] .tx-logo-img--on-dark { display: block !important; }
:root .tx-logo:has(.tx-logo-img) { display: inline-flex !important; background: none !important; padding: 0 !important; gap: 0 !important; }
:root .tx-logo:has(.tx-logo-img)::before, :root .tx-logo:has(.tx-logo-img)::after { display: none !important; }
:root :is(.sidebar-brand-link, .sidebar-brand) { display: block !important; }
:root :is(.sidebar-brand-kicker, .sidebar-brand-text) { color: var(--tx-side-text) !important; }
:root .sidebar-brand-wordmark { display: none !important; }
:root .sidebar-brand-link:has(> .tx-logo-img) { display: inline-flex !important; align-items: flex-start !important; max-width: 100% !important; }
:root .sidebar-brand-link:has(> .tx-logo-img) > .tx-logo-img { flex: 0 1 auto !important; min-width: 0 !important; }
:root .sidebar-brand-link.sidebar-brand-link:has(> .tx-logo-img)::after {
  content: "\2122" !important; display: block !important; flex: none !important;
  margin: 2px 0 0 2px !important; color: var(--tx-side-text) !important;
  font-family: var(--tx-font-brand) !important; font-size: 0.75rem !important; font-weight: 700 !important; line-height: 1 !important;
}

/* ---------- 4b. Public site + auth (heritage palettes -> master tokens) ---------- */
:root :is(.home-vision, .contact-vision, .pricing-vision, .products-vision, .platform-vision, .why-vision, .auth-vision) {
  --heritage-cream: var(--tx-canvas) !important;
  --heritage-panel: var(--tx-card) !important;
  --heritage-soft: var(--tx-row-alt) !important;
  --heritage-green: var(--tx-primary) !important;
  --heritage-olive: var(--tx-primary) !important;
  --heritage-burgundy: var(--tx-text) !important;
  --heritage-copy: var(--tx-text) !important;
  --heritage-muted: var(--tx-text) !important;
  --heritage-coral: var(--tx-numbers) !important;
  --heritage-border: var(--tx-line) !important;
  --heritage-line: var(--tx-numbers) !important;
  color: var(--tx-text) !important;
}
:root .site-sidebar-footer { background: transparent !important; }
:root :is(.home-vision, .contact-vision, .pricing-vision, .products-vision, .platform-vision, .why-vision) .section-eyebrow {
  background: none !important; color: var(--tx-numbers) !important; -webkit-text-fill-color: currentColor !important;
}
:root .home-vision :is(.home-overview, .footer) { background: var(--tx-canvas) !important; border-color: var(--tx-line) !important; }
:root .home-vision :is(.section-cta, .diff-card, .home-connect) { background: var(--tx-card) !important; border-color: var(--tx-line) !important; box-shadow: none !important; }
:root .home-vision .home-hero-eyebrow { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; border-color: transparent !important; }
:root .home-vision .home-hero-eyebrow .badge-dot { background: var(--tx-apricot) !important; box-shadow: none !important; }
:root .home-vision :is(.home-hero-title, .section-title, .cta-headline, .diff-title) { color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important; }
:root .home-vision .gradient-text { background: none !important; color: var(--tx-numbers) !important; -webkit-text-fill-color: currentColor !important; }
:root .home-vision :is(.home-hero-sub, .cta-sub, .diff-desc, .footer-tagline, .footer-heading, .footer-link, .footer-bottom, .footer .tx-logo-sub) { color: var(--tx-text) !important; }
:root .home-vision .footer .tx-logo-word { background: none !important; color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important; }
:root .home-connect.tx-network {
  --network-surface: var(--tx-card) !important;
  --network-ink: var(--tx-text) !important;
  --network-muted: var(--tx-text) !important;
  --network-accent: var(--tx-apricot) !important;
  --network-line: var(--tx-numbers) !important;
}
:root .home-connect.tx-network .tx-node-card { background: var(--tx-card) !important; border-color: var(--tx-line) !important; color: var(--tx-text) !important; }
:root .home-connect.tx-network .tx-node-card--center { background: var(--tx-primary) !important; border-color: var(--tx-mid) !important; }
:root .home-connect.tx-network .tx-node-card--center :is(.tx-node-eyebrow, .tx-node-title, .tx-node-sub) { color: var(--tx-on-primary) !important; }
:root .home-connect.tx-network :is(.tx-node-status, .tx-ribbon) { color: var(--tx-text) !important; }
:root .home-connect.tx-network .tx-ribbon { background: var(--tx-card) !important; border-color: var(--tx-line) !important; }
:root .home-connect.tx-network .tx-carrier-logo { background: var(--tx-row-alt) !important; border-color: var(--tx-line) !important; }
:root .home-connect.tx-network .tx-node-icon--purple { background: var(--tx-mid) !important; color: var(--tx-on-primary) !important; }

/* Home: logo-led hero stage, connected-network section, tinted overview cards */
html:root body.home-vision .site-scroll .container { max-width: 1240px !important; padding-inline: clamp(16px, 3vw, 40px) !important; }
html:root body.home-vision .home-hero--brand { display: block !important; padding: clamp(16px, 2vw, 28px) 0 0 !important; }
html:root body.home-vision .home-hero-stage {
  display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important; min-width: 0 !important;
  background: var(--tx-primary) !important; color: var(--tx-on-primary) !important;
  border-radius: var(--tx-radius-card) !important; padding: clamp(44px, 6vw, 96px) clamp(22px, 5vw, 72px) clamp(36px, 4vw, 56px) !important;
}
html:root body.home-vision .home-hero--brand .home-hero-logo { margin: 0 0 clamp(32px, 3.5vw, 48px) !important; width: min(680px, 100%) !important; }
html:root body.home-vision .home-hero--brand .tx-logo-img--hero { width: 100% !important; }
html:root body.home-vision .home-hero--brand .home-hero-eyebrow {
  background: var(--tx-side-tile-bg) !important; color: var(--tx-on-primary) !important;
  border: 1.5px solid var(--tx-side-tile-border) !important; margin: 0 0 22px !important;
  font-size: var(--tx-size-min) !important;
}
html:root body.home-vision .home-hero--brand .home-hero-eyebrow .badge-dot { background: var(--tx-brand-apricot) !important; box-shadow: none !important; }
html:root body.home-vision .home-hero--brand .home-hero-title {
  max-width: 22ch !important; margin: 0 0 18px !important; color: var(--tx-on-primary) !important; -webkit-text-fill-color: currentColor !important;
  font-size: clamp(34px, 4.2vw, 44px) !important; line-height: 1.08 !important; overflow-wrap: break-word !important;
}
html:root body.home-vision .home-hero--brand .gradient-text { color: var(--tx-brand-mint) !important; }
html:root body.home-vision .home-hero--brand .home-hero-sub {
  max-width: 640px !important; margin: 0 auto 30px !important; color: var(--tx-on-primary) !important; opacity: 0.9 !important;
  font-size: var(--tx-size-body) !important; line-height: 1.55 !important;
}
html:root body.home-vision .home-hero--brand .home-hero-buttons { justify-content: center !important; }
html:root body.home-vision .home-hero--brand .btn-cyan { background: var(--tx-brand-apricot) !important; color: var(--tx-on-apricot) !important; border-color: var(--tx-brand-apricot) !important; }
html:root body.home-vision .home-hero--brand .btn-ghost { background: transparent !important; color: var(--tx-on-primary) !important; border: 1.5px solid rgba(255, 255, 255, 0.55) !important; }
html:root body.home-vision .home-hero--brand .btn-ghost:hover { background: var(--tx-side-tile-bg) !important; }
html:root body.home-vision .home-hero-products {
  display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important;
  width: min(820px, 100%) !important; margin-top: clamp(32px, 3.5vw, 44px) !important; padding-top: 28px !important;
  border-top: 1.5px solid var(--tx-side-hair) !important;
}
html:root body.home-vision .home-hero-products a {
  display: inline-flex !important; align-items: center !important; min-height: var(--tx-touch-min) !important; padding: 0 18px !important;
  border-radius: 999px !important; background: var(--tx-side-tile-bg) !important; border: 1.5px solid var(--tx-side-tile-border) !important;
  color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-semibold) !important; text-decoration: none !important;
}
html:root body.home-vision .home-hero-products a:hover { background: var(--tx-side-active-bg) !important; }

html:root body.home-vision .home-network {
  display: grid !important; grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr) !important; gap: clamp(28px, 3vw, 48px) !important; align-items: center !important;
  padding-block: clamp(48px, 5vw, 80px) 0 !important;
}
html:root body.home-vision .home-network-intro { min-width: 0 !important; }
html:root body.home-vision .home-network-intro .section-title { text-align: left !important; margin: 0 0 14px !important; }
html:root body.home-vision .home-network-copy { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-body) !important; line-height: 1.55 !important; }
@media (max-width: 1100px) {
  html:root body.home-vision .home-network { grid-template-columns: minmax(0, 1fr) !important; }
}

html:root body.home-vision .home-overview-grid .diff-card {
  --home-tint: var(--tx-sage); --home-solid: var(--tx-brand-teal); --home-on-solid: var(--tx-on-primary);
  background: var(--home-tint) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important;
  padding: var(--tx-card-pad) !important; box-shadow: none !important;
}
html:root body.home-vision .home-overview-grid .diff-card:nth-child(2) {
  --home-tint: color-mix(in srgb, var(--tx-brand-mint) 30%, var(--tx-card)); --home-solid: var(--tx-brand-mint); --home-on-solid: var(--tx-brand-teal);
}
html:root body.home-vision .home-overview-grid .diff-card:nth-child(3) {
  --home-tint: color-mix(in srgb, var(--tx-brand-apricot) 26%, var(--tx-card)); --home-solid: var(--tx-brand-apricot); --home-on-solid: var(--tx-on-apricot);
}
html:root body.home-vision .home-overview-grid .diff-card::before, html:root body.home-vision .home-overview-grid .diff-card::after { display: none !important; }
html:root body.home-vision .home-overview-grid .diff-icon { background: var(--home-solid) !important; color: var(--home-on-solid) !important; border: 0 !important; }
html:root body.home-vision .home-overview-grid .diff-icon svg { stroke: currentColor !important; }
html:root body.home-vision .footer-logo .tx-logo-img { width: 200px !important; }


/* ---------- 4c. Marketing content pages (Platform, Products, Why, Contact, product detail) ---------- */
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) {
  --tx-mk-body: var(--tx-weight-regular); --tx-mk-strong: var(--tx-weight-semibold); --tx-mk-title: var(--tx-weight-bold);
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section, .footer, .cl-layout) {
  font-weight: var(--tx-mk-body) !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section, .footer, .cl-layout) :is(p, li, .section-intro, .hero-body, .diff-desc, .outcome-sub, .cta-sub, .product-desc, .product-sub, .pm-label, .cap-sub, .persona-desc, .cl-desc, .contact-sub, .contact-label, .footer-link, .footer-tagline, .footer-bottom) {
  font-weight: var(--tx-mk-body) !important; line-height: 1.6 !important; letter-spacing: normal !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section, .footer, .cl-layout) :is(strong, b) { font-weight: var(--tx-mk-strong) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section) :is(.section-intro, .cta-sub) { font-size: 21px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section) :is(h1, h2, .section-title, .cta-headline, .contact-title, .cl-heading) {
  font-weight: var(--tx-mk-title) !important; line-height: 1.15 !important; letter-spacing: -0.015em !important;
  color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section) .section-title { font-size: 28px !important; max-width: none !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.site-main, .section) :is(h1.section-title, .cta-headline, .contact-title, .cl-heading) { font-size: clamp(36px, 3.6vw, 37px) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.ps-title, .diff-title, .cap-title, .persona-title, .outcome-label, .product-name, .product-section-heading, .footer-heading) {
  font-size: var(--tx-size-label) !important; font-weight: var(--tx-mk-strong) !important; line-height: 1.25 !important; letter-spacing: normal !important;
  color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.section-eyebrow, .contact-eyebrow) {
  background: none !important; color: var(--tx-numbers) !important; -webkit-text-fill-color: currentColor !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-mk-title) !important; letter-spacing: 0.14em !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.gradient-text, .outcome-val, .pm-val) {
  background: none !important; color: var(--tx-numbers) !important; -webkit-text-fill-color: currentColor !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .contact-vision, .product-detail-vision) :is(.section-intro, .hero-body, .diff-desc, .outcome-sub, .cta-sub, .ps-list li, .ps-footnote, .product-desc, .product-sub, .cap-sub, .cap-list li, .persona-desc, .footer-tagline, .footer-heading, .footer-link, .footer-bottom) { color: var(--tx-text) !important; }

/* Layout: wider measure, even rhythm, grids that breathe */
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .section { padding-block: clamp(40px, 4vw, 64px) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .section .container { max-width: 1240px !important; padding-inline: clamp(24px, 4vw, 56px) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .section .container > div[style*="text-align:center"] { max-width: 880px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.section-intro, .hero-body)[style*="max-width"] { max-width: 760px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .ps-split { gap: 28px !important; margin-top: 48px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.diff-grid, .persona-grid) { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 20px !important; margin-top: 48px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.diff-grid, .persona-grid) > * { flex: 1 1 300px !important; max-width: 380px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.diff-grid, .persona-grid):has(> :nth-child(4):last-child) > * { flex-basis: 220px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .outcomes-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important; gap: 16px !important; margin-top: 48px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .cap-grid { gap: 20px !important; margin-top: 48px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-card, .diff-card, .outcome-cell, .product-card, .cap-card, .persona-card) {
  background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; box-shadow: none !important;
}
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .ps-card { padding: 36px !important; gap: 18px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.diff-card, .cap-card, .persona-card) { padding: 28px 24px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .ps-list { gap: 12px !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .ps-footnote { font-style: normal !important; border-color: var(--tx-line) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-problem, .card-prep) { border-top: 4px solid var(--tx-problem-text) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-solution, .card-ship) { border-top: 4px solid var(--tx-numbers) !important; }
:root .products-vision :is(.card-intel, .card-connect) { border-top: 4px solid var(--tx-apricot) !important; }
:root .products-vision .card-glow, :root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .cta-glow { display: none !important; }

/* Tags and icon chips -> status tokens */
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-tag, .ps-icon, .diff-icon, .cap-icon, .product-badge, .goal-check) { box-shadow: none !important; border: 0 !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-tag, .product-badge) { font-size: var(--tx-size-min) !important; font-weight: var(--tx-mk-title) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-tag-problem, .ps-icon-warn, .badge-prep) { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-tag-solution, .ps-icon-check, .ps-tag-wholesale, .badge-ship) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-tag-amz, .diff-icon-gold, .cap-icon-gold, .badge-connect, .goal-check-gold) { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.diff-icon-cyan, .cap-icon-cyan, .goal-check-cyan) { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.ps-tag-dtc, .diff-icon-purple, .cap-icon-purple, .badge-intel, .goal-check-purple) { background: var(--tx-row-alt) !important; color: var(--tx-numbers) !important; }
:root .platform-vision :is([style*="color:#00C2FF"], [style*="color:#A78BFA"]) { color: var(--tx-numbers) !important; }
:root .platform-vision [style*="color:#E8910F"] { color: var(--tx-pending-text) !important; }
:root .platform-vision [style*="color:#34D399"] { color: var(--tx-good-text) !important; }
:root .platform-vision [style*="color:#F87171"] { color: var(--tx-problem-text) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) :is(.section-cta, .section-advantage) { background: var(--tx-card) !important; border-color: var(--tx-line) !important; box-shadow: none !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .footer { background: var(--tx-canvas) !important; border-color: var(--tx-line) !important; }
:root :is(.why-vision, .platform-vision, .products-vision, .product-detail-vision) .footer .tx-logo-word { background: none !important; color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important; }

/* Contact: brand panel on deep teal, form on card */
:root .contact-vision .cl-left { background: var(--tx-sage) !important; border-color: transparent !important; }
:root .contact-vision .cl-left::before { display: none !important; }
:root .contact-vision .cl-layout .cl-left :is(p, h1, h2, strong, span, a, div) { color: var(--tx-on-sage) !important; -webkit-text-fill-color: currentColor !important; }
:root .contact-vision .cl-left-footer { border-color: var(--tx-line) !important; }
:root .contact-vision .cl-feature-icon { background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; }
:root .contact-vision .cl-feature-icon svg { stroke: var(--tx-numbers) !important; }
:root .contact-vision .cl-right { background: var(--tx-canvas) !important; }
:root .contact-vision .cl-right::before { display: none !important; }
:root .contact-vision .modal-input { background: var(--tx-card) !important; border: 2px solid var(--tx-input-border) !important; color: var(--tx-text) !important; font-weight: var(--tx-mk-body) !important; }
:root .contact-vision .modal-input::placeholder { color: var(--tx-text) !important; opacity: 0.6 !important; font-weight: var(--tx-mk-body) !important; }
:root .contact-vision .modal-input:focus { border-color: var(--tx-numbers) !important; box-shadow: none !important; }
:root .contact-vision .modal-submit { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; border: 0 !important; box-shadow: none !important; font-weight: var(--tx-mk-title) !important; }
:root .contact-vision :is(.contact-error, [style*="color:#FF6B6B"]) { color: var(--tx-problem-text) !important; }

/* Product detail pages: heritage palette -> master tokens, legacy navbar -> standard site rail */
:root .product-detail-vision {
  --pd-canvas: var(--tx-canvas) !important; --pd-surface: var(--tx-card) !important; --pd-raised: var(--tx-card) !important;
  --pd-muted-surface: var(--tx-row-alt) !important; --pd-ink: var(--tx-text) !important; --pd-copy: var(--tx-text) !important;
  --pd-muted: var(--tx-text) !important; --pd-border: var(--tx-line) !important; --pd-border-strong: var(--tx-line) !important;
  --pd-accent: var(--tx-numbers) !important; --pd-accent-2: var(--tx-apricot) !important; --pd-accent-soft: var(--tx-sage) !important;
  --pd-warning: var(--tx-pending-text) !important; --pd-success: var(--tx-good-text) !important;
  color: var(--tx-text) !important;
}
:root .product-detail-vision > .section:first-of-type { padding-top: calc(var(--tx-topbar-h) + 40px) !important; }
@media (min-width: 1025px) {
  :root .product-detail-vision > .section:first-of-type { padding-top: clamp(72px, 7vw, 112px) !important; }
  :root .product-detail-vision .navbar {
    width: var(--tx-sidebar-w) !important; background: var(--tx-side-bg) !important; background-image: none !important;
    border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  }
  :root .product-detail-vision .navbar .nav-inner { padding: 22px 14px 0 !important; }
  :root .product-detail-vision .navbar .tx-logo { padding: 0 10px 18px !important; margin: 0 0 8px !important; border: 0 !important; }
  :root .product-detail-vision .navbar :is(.tx-logo-word, .tx-logo-sub) { background: none !important; color: var(--tx-side-text) !important; -webkit-text-fill-color: currentColor !important; }
  :root .product-detail-vision .navbar .nav-links { gap: 4px !important; }
  :root .product-detail-vision .navbar .nav-link {
    min-height: var(--tx-nav-row-h) !important; gap: 14px !important; padding: 0 10px !important;
    border-radius: var(--tx-radius-row) !important; border: 2px solid transparent !important; background: transparent !important;
    color: var(--tx-side-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-sidebar) !important; font-weight: 700 !important; line-height: 1.15 !important;
  }
  :root .product-detail-vision .navbar .nav-link:hover { background: var(--tx-side-card-bg) !important; }
  :root .product-detail-vision .navbar .nav-link:is(.active, [aria-current="page"]) { background: var(--tx-side-active-bg) !important; border-color: var(--tx-side-active-border) !important; font-weight: var(--tx-weight-bold) !important; }
  :root .product-detail-vision .navbar .nav-link > svg {
    width: 50px !important; height: 50px !important; flex: 0 0 50px !important; padding: 10px !important; box-sizing: border-box !important;
    border-radius: var(--tx-radius-tile) !important; background: var(--tx-side-tile-bg) !important; border: 1.5px solid var(--tx-side-tile-border) !important; color: var(--tx-side-text) !important;
  }
  :root .product-detail-vision .navbar .nav-actions {
    flex-direction: column !important; align-items: flex-start !important; gap: 12px !important;
    margin-top: auto !important; padding: 16px 10px 18px !important; border-top: 1.5px solid var(--tx-side-hair) !important;
  }
  :root .product-detail-vision .navbar .nav-sidebar-tagline { margin: 0 !important; color: var(--tx-side-text) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
  :root .product-detail-vision .navbar .theme-toggle-btn { border-radius: var(--tx-radius-tile) !important; background: var(--tx-side-tile-bg) !important; border: 1.5px solid var(--tx-side-tile-border) !important; color: var(--tx-side-text) !important; }
  :root .product-detail-vision > :is(.section, .footer) { margin-left: var(--tx-sidebar-w) !important; }
}


/* ---------- 5. Top bar + page header ---------- */
:root:root { --shell-header-height: var(--tx-topbar-h); --ptx-topbar-height: var(--tx-topbar-h); }
:root :is(.dashboard-header, .dash-topbar, .tx-shell-topbar, .ptx-topbar, .site-topbar) {
  box-sizing: border-box !important;
  height: var(--tx-topbar-h) !important;
  min-height: var(--tx-topbar-h) !important;
  background: var(--tx-canvas) !important;
  background-image: none !important;
  border-bottom: 1.5px solid var(--tx-line) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: var(--tx-text) !important;
}
:root :is(.dashboard-header, .dash-topbar, .tx-shell-topbar, .ptx-topbar, .site-topbar) :is(button, a, span, strong, input) { color: var(--tx-text) !important; }
:root :is(.site-topbar, .dash-topbar) {
  display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
  align-items: center !important; justify-content: space-between !important; gap: 16px !important;
  position: sticky !important; top: 0 !important; z-index: 30 !important;
  width: auto !important; margin: 0 !important; padding: 0 24px !important;
  border-top: 0 !important; border-inline: 0 !important; border-radius: 0 !important;
}
:root .dashboard-header .dashboard-header-content { height: 100% !important; padding-inline: 24px !important; gap: 16px !important; }
:root .dashboard-header :is(.header-shell-panel, .header-utility-panel) { min-height: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; }
:root :is(.site-topbar-left, .site-topbar-right, .dash-topbar-left, .dash-topbar-right) {
  display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 10px !important;
  width: auto !important; min-width: 0 !important; padding: 0 !important;
  background: none !important; border: 0 !important; box-shadow: none !important;
}
:root .dash-topbar-left { flex: 1 1 auto !important; }
:root :is(.site-topbar-right, .dash-topbar-right) { flex: 0 0 auto !important; justify-content: flex-end !important; }
:root .tx-shell-topbar :is(.tx-shell-kicker, .tx-shell-summary) { display: none !important; }
:root .tx-shell-topbar-copy { display: flex !important; min-width: 0 !important; }
:root .tx-shell-topbar-headline { display: flex !important; flex-wrap: nowrap !important; align-items: center !important; gap: 12px !important; min-width: 0 !important; }
:root .dash-topbar .dash-page-title { min-width: 0 !important; font-size: var(--tx-size-section) !important; white-space: nowrap !important; overflow: hidden !important; }
:root .dash-topbar .dash-page-title::before { height: 28px; }
:root .dash-topbar :is(.dash-live-badge, .admin-new-badge) {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; flex: 0 0 auto !important;
  min-height: 32px !important; padding: 0 14px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
  border: 0 !important; border-radius: 999px !important; box-shadow: none !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important; text-transform: none !important; white-space: nowrap !important;
}
:root .dash-topbar .dash-live-dot { width: 10px !important; height: 10px !important; border-radius: 50% !important; background: var(--tx-mid) !important; box-shadow: none !important; animation: none !important; }
:root .dash-topbar :is(.dash-date-range, .admin-setup-progress) {
  box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; gap: 10px !important; flex: 0 0 auto !important;
  height: var(--tx-touch-min) !important; min-height: var(--tx-touch-min) !important; padding: 0 18px !important;
  background: var(--tx-card) !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important; white-space: nowrap !important; cursor: pointer;
}
:root .dash-date-range svg { width: 22px !important; height: 22px !important; flex: 0 0 22px !important; stroke: currentColor; fill: none; }
:root .admin-setup-progress .admin-progress-bar { display: none !important; }
:root .admin-setup-progress .admin-progress-label { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
:root .admin-setup-progress .admin-progress-label::before {
  content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 10px !important;
  border-radius: 50%; background: var(--tx-apricot); box-shadow: none;
}
:root :is(.header-search, .dash-search) {
  min-height: var(--tx-btn-h) !important;
  background: var(--tx-card) !important;
  border: 2px solid var(--tx-input-border) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
:root :is(.header-search, .dash-search) input { background: transparent !important; border: 0 !important; font-size: var(--tx-size-min) !important; }
:root :is(.theme-toggle-btn, .ptx-bell__trigger, .ptx-nav-toggle, .sidebar-collapse-toggle, .header-warehouse-name, .profile-link, .profile-menu-trigger, .header-logout-btn) {
  min-width: var(--tx-touch-min) !important;
  min-height: var(--tx-touch-min) !important;
  background: var(--tx-card) !important;
  border: 2px solid var(--tx-input-border) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}
/* Show the warehouse toggle only while its sidebar is an off-canvas drawer. */
:root .ptx-nav-toggle { display: none !important; }
@media (max-width: 768px) { :root .ptx-nav-toggle { display: inline-flex !important; } }
:root .ptx-bell { display: inline-flex !important; align-items: center !important; width: auto !important; height: auto !important; margin: 0 !important; }
:root .ptx-bell__trigger { width: var(--tx-touch-min) !important; height: var(--tx-touch-min) !important; padding: 0 !important; margin: 0 !important; }
:root :is(.ptx-nav-toggle, .sidebar-collapse-toggle, .header-logout-btn, .theme-toggle-btn) { width: var(--tx-touch-min) !important; height: var(--tx-touch-min) !important; padding: 0 !important; }
:root .theme-toggle-btn { color: var(--tx-text) !important; transform: none !important; cursor: pointer; }
:root .theme-toggle-btn svg { stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
:root :is(.site-shell-toggle, .dash-shell-toggle, .nav-toggle) {
  box-sizing: border-box !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 5px !important;
  flex: 0 0 auto !important; width: var(--tx-touch-min) !important; height: var(--tx-touch-min) !important; padding: 0 !important; margin: 0 !important;
  background: var(--tx-card) !important;
  border: 2px solid var(--tx-input-border) !important;
  border-radius: 999px !important;
  box-shadow: none !important; transform: none !important; cursor: pointer;
}
:root .dash-shell-toggle { display: inline-flex !important; }
:root :is(.site-shell-toggle, .nav-toggle) { display: none !important; }
:root :is(.site-shell-toggle, .dash-shell-toggle, .nav-toggle) span {
  display: block !important; width: 20px !important; height: 2px !important; border-radius: 2px !important;
  background: var(--tx-text) !important; transition: transform .15s, opacity .15s;
}
:root :is(.site-shell-toggle, .dash-shell-toggle, .nav-toggle).open span:nth-child(1) { transform: translateY(7px) rotate(45deg) !important; }
:root :is(.site-shell-toggle, .dash-shell-toggle, .nav-toggle).open span:nth-child(2) { opacity: 0 !important; }
:root :is(.site-shell-toggle, .dash-shell-toggle, .nav-toggle).open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; }
@media (max-width: 1024px) { :root :is(.site-shell-toggle, .nav-toggle) { display: inline-flex !important; } }
@media (max-width: 560px) { :root .site-topbar-right .site-topbar-pricing { display: none !important; } }
:root :is(.header-warehouse-name, .profile-link, .profile-menu-trigger) { height: var(--tx-touch-min) !important; padding: 0 18px 0 8px !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
:root :is(.profile-link, .profile-menu-trigger) .profile-avatar-initials {
  width: 32px !important; height: 32px !important; flex: 0 0 32px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  border-radius: 50% !important;
  background: var(--tx-brand-mint) !important;
  color: var(--tx-brand-teal) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
:root :is(.profile-link, .profile-menu-trigger) .profile-copy { display: flex !important; flex-direction: column !important; align-items: flex-start !important; line-height: 1.15 !important; }
:root :is(.profile-link, .profile-menu-trigger) :is(.user-name, .profile-role) { font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; }
:root .header-warehouse-name { width: auto !important; max-width: 280px !important; }
:root .header-zone.header-left { width: auto !important; flex: 0 0 auto !important; }
:root .header-warehouse-name .warehouse-indicator-name { width: auto !important; max-width: 200px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:root :is(.ptx-bell__trigger, .ptx-nav-toggle, .sidebar-collapse-toggle, .header-logout-btn) > svg,
:root .theme-toggle-btn > svg:not([hidden]) { width: 24px !important; height: 24px !important; flex: 0 0 24px !important; vertical-align: middle !important; }
:root .header-warehouse-name :is(.warehouse-indicator-icon, .header-chevron) { display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; }
:root .header-warehouse-name :is(.warehouse-indicator-icon svg, .header-chevron) { width: 24px !important; height: 24px !important; }
/* Top bar controls: one palette tone per control; each surface/ink pair holds contrast in both themes. */
:root .theme-toggle-btn { --tx-nav-bg: var(--tx-good-bg); --tx-nav-ink: var(--tx-good-text); }
:root .ptx-bell__trigger { --tx-nav-bg: var(--tx-card); --tx-nav-ink: var(--tx-text); }
:root .ptx-bell__trigger:has(> .ptx-bell__badge:is([style*="inline-flex"], :not([hidden]):not([style*="none"]))) { --tx-nav-bg: var(--tx-brand-mint); --tx-nav-ink: var(--tx-brand-teal); }
:root .header-logout-btn { --tx-nav-bg: var(--tx-apricot); --tx-nav-ink: var(--tx-on-apricot); }
:root .header-warehouse-name { --tx-nav-bg: var(--tx-brand-mint); --tx-nav-ink: var(--tx-brand-teal); }
:root :is(.profile-link, .profile-menu-trigger) { --tx-nav-bg: var(--tx-primary); --tx-nav-ink: var(--tx-on-primary); }
:root :is(.theme-toggle-btn, .ptx-bell__trigger, .header-logout-btn, .profile-link, .profile-menu-trigger) {
  background: var(--tx-nav-bg) !important; color: var(--tx-nav-ink) !important;
  border-color: color-mix(in srgb, var(--tx-nav-ink) 40%, var(--tx-nav-bg)) !important;
}
:root :is(.dashboard-header, .dash-topbar, .tx-shell-topbar, .ptx-topbar, .site-topbar) :is(.theme-toggle-btn, .ptx-bell__trigger, .header-logout-btn, .profile-link, .profile-menu-trigger) { color: var(--tx-nav-ink) !important; }
:root :is(.theme-toggle-btn, .ptx-bell__trigger, .header-logout-btn, .profile-link, .profile-menu-trigger):not(.site-sidebar *, .product-detail-vision .navbar *):hover,
:root .ptx-bell.is-open .ptx-bell__trigger { background: color-mix(in srgb, var(--tx-nav-ink) 14%, var(--tx-nav-bg)) !important; }
:root :is(.theme-toggle-btn, .ptx-bell__trigger, .header-logout-btn) svg { color: inherit !important; stroke: currentColor !important; }
:root :is(.profile-link, .profile-menu-trigger) :is(.profile-copy, .user-name, .profile-role, .header-chevron) { color: inherit !important; }
/* Warehouse header controls outrank page-level header overrides (e.g. station pages' inline light-theme rules). */
html:root:not(#_) header.dashboard-header :is(.theme-toggle-btn, .ptx-bell__trigger, .header-logout-btn, .header-warehouse-name) {
  background: var(--tx-nav-bg) !important; color: var(--tx-nav-ink) !important; box-shadow: none !important;
  border-color: color-mix(in srgb, var(--tx-nav-ink) 40%, var(--tx-nav-bg)) !important;
}
html:root:not(#_) header.dashboard-header :is(.theme-toggle-btn, .ptx-bell__trigger, .header-logout-btn, .header-warehouse-name):hover,
html:root:not(#_) header.dashboard-header .ptx-bell.is-open .ptx-bell__trigger { background: color-mix(in srgb, var(--tx-nav-ink) 14%, var(--tx-nav-bg)) !important; }
html:root:not(#_) header.dashboard-header .header-warehouse-name :is(.warehouse-indicator-icon, .warehouse-indicator-name, .header-context-name, .header-chevron, svg) { color: inherit !important; stroke: currentColor !important; }
:root .header-search {
  box-sizing: border-box !important;
  display: flex !important; align-items: center !important; gap: 10px !important;
  height: var(--tx-btn-h) !important; padding: 0 18px 0 8px !important;
}
:root .header-search .search-submit-btn {
  position: static !important; inset: auto !important; transform: none !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  flex: 0 0 32px !important; width: 32px !important; height: 32px !important; min-width: 0 !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; background: none !important; border: 0 !important; border-radius: 50% !important;
  box-shadow: none !important; -webkit-appearance: none !important; appearance: none !important;
  color: var(--tx-text) !important; cursor: pointer !important;
}
:root .header-search .search-submit-btn:focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 0 !important; }
:root .header-search .search-icon {
  position: static !important; inset: auto !important; transform: none !important;
  display: block !important; flex: 0 0 22px !important; width: 22px !important; height: 22px !important;
  margin: 0 !important; color: var(--tx-text) !important; pointer-events: none !important;
}
:root .header-search > .search-icon { box-sizing: content-box !important; flex: 0 0 auto !important; padding: 5px !important; }
:root .header-search .search-input {
  flex: 1 1 auto !important; min-width: 0 !important; width: auto !important; height: 100% !important;
  margin: 0 !important; line-height: normal !important;
  -webkit-appearance: none !important; appearance: none !important;
}
:root .header-search .search-input:focus { outline: 0 !important; box-shadow: none !important; }
:root .header-warehouse-name .warehouse-indicator-icon { background: none !important; border-radius: 0 !important; box-shadow: none !important; }
/* Marketing .navbar top bar. Product-detail pages keep it as the left rail above 1024px. */
:root body:not(.product-detail-vision) .navbar {
  box-sizing: border-box !important; position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; z-index: 1000 !important;
  height: var(--tx-topbar-h) !important; padding: 0 !important;
  background: var(--tx-canvas) !important; background-image: none !important;
  border: 0 !important; border-bottom: 1.5px solid var(--tx-line) !important;
  box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transition: none !important;
}
:root .navbar .nav-inner { display: flex; align-items: center; justify-content: space-between; }
:root body:not(.product-detail-vision) .navbar .nav-inner { height: 100% !important; gap: 16px !important; }
:root body:not(.product-detail-vision) .navbar .nav-links { display: flex !important; align-items: center !important; gap: 4px !important; }
:root body:not(.product-detail-vision) .navbar :is(.nav-link, .nav-dropdown-btn) {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  height: var(--tx-btn-h) !important; padding: 0 14px !important;
  background: none !important; border: 0 !important; border-radius: 999px !important;
  color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important;
  letter-spacing: normal !important; white-space: nowrap !important; cursor: pointer;
}
:root body:not(.product-detail-vision) .navbar :is(.nav-link, .nav-dropdown-btn):hover { background: var(--tx-row-alt) !important; }
:root body:not(.product-detail-vision) .navbar :is(.nav-link-active, .nav-link.active, .nav-dropdown-btn.active) { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-weight: var(--tx-weight-bold) !important; }
:root .navbar .nav-actions { display: flex !important; align-items: center !important; gap: 10px !important; }
:root .nav-dropdown-wrap { position: relative; display: inline-flex; align-items: center; }
:root .nav-dd-chevron { width: 16px !important; height: 16px !important; flex-shrink: 0; transition: transform .15s; }
:root .nav-dropdown-btn.active .nav-dd-chevron { transform: rotate(180deg); }
:root .nav-dropdown {
  display: none; position: absolute; top: calc(100% + 12px); left: 50%; transform: translateX(-50%); z-index: 1100;
  width: 380px; padding: 8px !important;
}
:root .nav-dropdown.open { display: block; }
:root .nav-dropdown::before { display: none !important; }
:root .nav-dropdown-back { display: none; }
:root .nav-dropdown-item {
  display: flex !important; align-items: center !important; gap: 14px !important; padding: 10px 12px !important;
  border-radius: var(--tx-radius-row) !important; color: var(--tx-text) !important; text-decoration: none;
}
:root .nav-dropdown-item:hover { background: var(--tx-row-alt) !important; }
:root .nav-dd-icon {
  display: flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 40px !important;
  width: 40px !important; height: 40px !important; border: 0 !important; border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
}
:root .nav-dd-text :is(strong, span) { display: block !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; line-height: 1.25 !important; }
:root .nav-dd-text strong { font-weight: var(--tx-weight-bold) !important; }
:root .nav-dd-text span { font-weight: 600 !important; margin-top: 2px !important; }
:root .nav-dd-divider { height: 1.5px !important; margin: 6px 0 !important; background: var(--tx-line) !important; }
:root .nav-dd-all {
  display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 10px 12px !important;
  border-radius: var(--tx-radius-row) !important; color: var(--tx-text) !important; text-decoration: none;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important;
}
:root .nav-dd-all svg { width: 18px !important; height: 18px !important; }
@media (min-width: 1025px) and (max-width: 1200px) {
  :root body:not(.product-detail-vision) .navbar .nav-inner { gap: 10px !important; }
  :root body:not(.product-detail-vision) .navbar .nav-links { gap: 0 !important; }
  :root body:not(.product-detail-vision) .navbar :is(.nav-link, .nav-dropdown-btn) { padding: 0 10px !important; }
}
@media (max-width: 1024px) {
  :root .navbar .tx-logo :is(.tx-logo-word, .tx-logo-sub) { color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important; }
  :root .product-detail-vision .navbar {
    box-sizing: border-box !important; position: fixed !important; inset: 0 0 auto !important; width: 100% !important; z-index: 1000 !important;
    height: var(--tx-topbar-h) !important; padding: 0 !important;
    background: var(--tx-canvas) !important; background-image: none !important;
    border: 0 !important; border-bottom: 1.5px solid var(--tx-line) !important;
    box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transition: none !important;
  }
  :root .navbar .nav-inner { height: 100% !important; flex-direction: row !important; align-items: center !important; gap: 12px !important; padding: 0 16px !important; }
  :root .navbar .nav-toggle { order: -1 !important; }
  :root .navbar .tx-logo { padding: 0 !important; margin: 0 !important; border: 0 !important; }
  :root .navbar .nav-actions { margin: 0 0 0 auto !important; padding: 0 !important; border: 0 !important; }
  :root .navbar .nav-actions .btn-ghost-sm, :root .navbar .nav-sidebar-tagline { display: none !important; }
  :root .navbar .nav-links {
    display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important; gap: 4px !important;
    position: fixed !important; inset: 0 auto 0 0 !important; width: min(300px, 84vw) !important; height: 100vh !important;
    padding: calc(var(--tx-topbar-h) + 16px) 14px 24px !important; overflow-y: auto !important; z-index: 1001 !important;
    background: var(--tx-side-bg) !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
    transform: translateX(-110%) !important; transition: transform .25s ease !important;
  }
  :root .navbar .nav-links.open { transform: translateX(0) !important; }
  :root .navbar .nav-links :is(.nav-link, .nav-dropdown-btn) {
    display: flex; align-items: center !important; gap: 12px !important; width: 100% !important;
    height: var(--tx-touch-min) !important; padding: 0 14px !important;
    background: none !important; border: 0 !important; border-radius: var(--tx-radius-tile) !important; box-shadow: none !important;
    color: var(--tx-side-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; letter-spacing: normal !important;
  }
  :root .navbar .nav-links .nav-link { justify-content: flex-start !important; }
  :root .navbar .nav-links .nav-dropdown-btn { justify-content: space-between !important; }
  :root .navbar .nav-links :is(.nav-link, .nav-dropdown-btn):hover { background: var(--tx-side-tile-bg) !important; }
  :root .navbar .nav-links :is(.nav-link-active, .nav-link.active) { background: var(--tx-side-active-bg) !important; box-shadow: inset 0 0 0 1.5px var(--tx-side-active-border) !important; color: var(--tx-side-text) !important; }
  :root .navbar .nav-dropdown-wrap { position: static; display: block; width: 100%; }
  :root .navbar .nav-dropdown-btn .nav-dd-chevron { transform: rotate(-90deg) !important; }
  :root .navbar .nav-dropdown {
    display: block !important; position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; margin: 0 !important;
    padding: calc(var(--tx-topbar-h) + 16px) 14px 24px !important; overflow-y: auto !important; z-index: 2 !important;
    background: var(--tx-side-bg) !important; border: 0 !important; border-radius: 0 !important;
    transform: translateX(100%) !important; transition: transform .25s ease !important;
  }
  :root .navbar .nav-dropdown.open { transform: translateX(0) !important; }
  :root .navbar .nav-dropdown-back {
    display: flex; align-items: center; gap: 10px; width: 100%; padding: 0 4px 20px; cursor: pointer;
    background: none; border: 0; color: var(--tx-side-text); font: 700 var(--tx-size-min) var(--tx-font);
  }
  :root .navbar .nav-dropdown-back svg { width: 18px; height: 18px; flex-shrink: 0; }
  :root .navbar .nav-dropdown :is(.nav-dropdown-item, .nav-dd-all, .nav-dd-text strong, .nav-dd-text span) { color: var(--tx-side-text) !important; }
  :root .navbar .nav-dropdown :is(.nav-dropdown-item, .nav-dd-all):hover { background: var(--tx-side-tile-bg) !important; }
  :root .navbar .nav-dropdown .nav-dd-icon { background: var(--tx-side-tile-bg) !important; color: var(--tx-side-text) !important; }
  :root .navbar .nav-dropdown .nav-dd-divider { background: var(--tx-side-hair) !important; }
  :root .nav-drawer-backdrop {
    position: fixed; inset: 0; z-index: 1000; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease;
    background: color-mix(in srgb, var(--tx-side-bg) 70%, transparent); backdrop-filter: none;
  }
  :root .nav-drawer-backdrop.open { opacity: 1; visibility: visible; }
}

:root :is(.page-header, .dashboard-hero, .overview-page-hero, .dash-page-header, .hero-copy-card, .overview-hero-copy-card, .dashboard-hero-copy) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
:root :is(.dashboard-kicker, .section-kicker, .settings-panel-kicker, .tx-shell-kicker, .warehouse-name, .auth-eyebrow) {
  color: var(--tx-text) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
:root :is(.overview-page-title, .page-title, .dash-page-title, .tx-shell-topbar-headline, .hero-greeting, .dashboard-hero h1) {
  display: flex !important;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: var(--tx-text) !important;
  font-size: var(--tx-size-page-title) !important;
  font-weight: var(--tx-weight-bold) !important;
  line-height: 1.1 !important;
  letter-spacing: var(--tx-tracking-display) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
:root :is(.overview-page-title, .page-title, .dash-page-title, .hero-greeting, .dashboard-hero h1)::before {
  content: "";
  flex: 0 0 10px;
  width: 10px;
  height: 38px;
  border-radius: 5px;
  background: var(--tx-primary);
}
:root .dashboard-hero :is(.hero-greeting ~ h1, h1 ~ .hero-greeting)::before { display: none; }
:root :is(.breadcrumb, .breadcrumb-item, .breadcrumb-separator) { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
:root .overview-live-strip { background: none !important; border: 0 !important; color: var(--tx-text) !important; padding: 0 !important; }

/* ---------- 6. Cards ---------- */
:root :is(.card, .stat-card, .kpi-card, .operations-kpi-card, .settings-panel, .scan-card, .checkbox-card, .dash-card, .dash-kpi,
  .dash-panel, .dashboard-section, .workflow-launchpad, .active-shipments-section, .inbound-hub-stats, .station-section,
  .tx-section, .operations-table-panel, .tracker-section, .workflow-strip, .content-section, .admin-card, .integration-card,
  .integration-hub-card, .quickstart-card, .table-container, .table-wrapper, .ptx-card, .panel, .tx-glass-card, .tx-glance-card,
  .activity-panel, .overview-priority-panel, .workflow-card, .overview-shortcut-card, .search-filter-section, .shipment-card,
  .detail-modal-content, .auth-card, .auth-form-card, .dashboard-action-card, .station-card, .tx-action-card) {
  background: var(--tx-card) !important;
  background-image: none !important;
  border: 1.5px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: var(--tx-text) !important;
}
:root :is(.card, .stat-card, .kpi-card, .operations-kpi-card, .dash-card, .dash-kpi, .integration-card, .quickstart-card, .workflow-card, .overview-shortcut-card, .dashboard-action-card, .station-card, .tx-action-card)::before,
:root :is(.card, .stat-card, .kpi-card, .operations-kpi-card, .dash-card, .dash-kpi, .integration-card, .quickstart-card, .workflow-card, .overview-shortcut-card, .dashboard-action-card, .station-card, .tx-action-card)::after {
  display: none !important;
}
:root :is(.card, .stat-card, .kpi-card, .dash-card, .integration-card, .workflow-card, .overview-shortcut-card, .dashboard-action-card, .station-card, .tx-action-card):hover {
  border-color: var(--tx-line) !important;
  transform: none !important;
  box-shadow: none !important;
}
:root :is(.overview-band, .dashboard-kpi-grid, .overview-metric-grid) { background: none !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; }
:root :is(.tx-icon-box, .stat-icon, .kpi-card-icon, .dash-kpi-icon, .workflow-card-icon, .dashboard-action-icon, .station-card-icon, .progress-stat-icon, .summary-icon) {
  width: 50px !important; height: 50px !important; min-width: 50px !important; flex: 0 0 50px !important;
  border-radius: 14px !important;
  background: var(--tx-sage) !important;
  border: 0 !important;
  color: var(--tx-primary) !important;
  font-size: 30px !important;
  box-shadow: none !important;
  filter: none !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
}
:root :is(.tx-icon-box, .stat-icon, .kpi-card-icon, .dash-kpi-icon, .workflow-card-icon, .dashboard-action-icon, .station-card-icon, .progress-stat-icon, .summary-icon) :is(svg, i) { width: 30px !important; height: 30px !important; font-size: 30px !important; color: inherit !important; stroke: currentColor !important; stroke-width: 2.5; }
/* Icon box tones: from the icon's own modifier or its card's modifier */
:root :is(.tx-icon-box, .stat-icon, .progress-stat-icon):is(.primary, .info, .units, .percentage, [class*="-primary"], [class*="-info"]),
:root :is([class*="stat-card-primary"], [class*="stat-card-info"]) :is(.stat-icon, .tx-icon-box) {
  background: var(--tx-primary) !important; color: var(--tx-on-primary) !important;
}
:root :is(.tx-icon-box, .stat-icon, .progress-stat-icon):is(.success, .completed, .good, [class*="-success"], [class*="-good"]),
:root :is([class*="stat-card-success"], [class*="stat-card-good"]) :is(.stat-icon, .tx-icon-box) {
  background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important;
}
:root :is(.tx-icon-box, .stat-icon, .progress-stat-icon):is(.warning, .in-progress, .pending, .secondary, [class*="-warning"], [class*="-pending"]),
:root :is([class*="stat-card-warning"], [class*="stat-card-accent"], [class*="stat-card-pending"]) :is(.stat-icon, .tx-icon-box) {
  background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important;
}
:root :is(.tx-icon-box, .stat-icon, .progress-stat-icon):is(.danger, .error, .problem, [class*="-danger"], [class*="-problem"]),
:root :is([class*="stat-card-danger"], [class*="stat-card-problem"]) :is(.stat-icon, .tx-icon-box) {
  background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important;
}

/* KPI tiles: label, big rounded number, sub line */
:root :is(.kpi-card-label, .stat-label, .dash-kpi-label, .tx-card-label, .tx-glance-label) {
  color: inherit !important;
  font-size: var(--tx-size-label) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
:root :is(.kpi-card-value, .stat-value, .dash-kpi-value, .tx-card-value, .tx-glance-value, .orders-summary-value, .ov-metric-value, .numeric) {
  font-family: var(--tx-font-numbers) !important;
  font-variant-numeric: tabular-nums;
  font-size: var(--tx-size-kpi-number) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -0.02em !important;
  color: var(--tx-numbers) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
:root :is(.kpi-card-meta, .stat-meta, .tx-glance-meta) { color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
:root .kpi-pill-row { gap: 8px !important; }


/* Overview hero tiles: Active shipments = teal, Health issues = problem,
   SKUs in stock = sage, Work prep queue = apricot. */
:root .overview-page-shell .overview-command-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
:root .overview-page-shell .overview-metric-grid, :root .overview-page-shell .overview-side-stack { display: contents !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card {
  border: 0 !important;
  padding: var(--tx-card-pad) !important;
  display: flex !important; flex-direction: column !important; align-items: stretch !important; justify-content: space-between !important;
  gap: 14px !important; text-align: center !important; min-height: 0 !important; min-width: 0 !important;
  container-type: inline-size;
}
:root .overview-page-shell .overview-metric-grid .kpi-card-header { align-self: stretch !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 12px !important; margin: 0 !important; text-align: center !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card-header .kpi-card-label { flex: 0 1 auto; min-width: 0; font-size: var(--tx-size-min) !important; line-height: 1.2 !important; overflow-wrap: anywhere; }
:root .overview-page-shell .overview-metric-grid .kpi-pill strong { color: inherit !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card-value { margin: 0 !important; font-size: clamp(44px, 26cqi, 88px) !important; line-height: 0.95 !important; color: inherit !important; text-align: center !important; white-space: nowrap !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card-meta { display: none !important; }
:root .overview-page-shell .overview-metric-grid .kpi-pill-row { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 4px 16px !important; margin: 0 !important; }
:root .overview-page-shell .overview-metric-grid .kpi-pill { background: none !important; border: 0 !important; color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; padding: 0 !important; height: auto !important; white-space: nowrap !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(1) { order: 1; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(1) .tx-icon-box { background: var(--tx-side-tile-bg) !important; color: var(--tx-on-primary) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(4) { order: 2; background: var(--tx-problem-bg) !important; color: var(--tx-text) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(4) .kpi-card-value { color: var(--tx-problem-text) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(4) .tx-icon-box { background: var(--tx-problem-text) !important; color: var(--tx-on-primary) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(2) { order: 3; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(2) .tx-icon-box { background: var(--tx-side-tile-bg) !important; color: var(--tx-on-sage) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(3) { order: 4; background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; text-shadow: none !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card:nth-child(3) .tx-icon-box { background: var(--tx-on-apricot) !important; color: var(--tx-on-primary) !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card .kpi-card-label { color: inherit !important; }
:root .overview-page-shell .overview-metric-grid .kpi-card.kpi-card-btn {
  text-decoration: none !important;
  cursor: pointer !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease !important;
}
:root .overview-page-shell .overview-metric-grid .kpi-card.kpi-card-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 14px 28px rgba(11, 26, 26, 0.18) !important;
}
:root .overview-page-shell .overview-metric-grid .kpi-card .kpi-card-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: center !important;
  gap: 6px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.20) !important;
  color: inherit !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
:root .overview-page-shell :is(.activity-panel, .overview-priority-panel) { order: 5; grid-column: span 2 !important; }
@media (max-width: 1100px) {
  :root .overview-page-shell .overview-command-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  :root .overview-page-shell .overview-command-grid { grid-template-columns: 1fr !important; }
  :root .overview-page-shell :is(.activity-panel, .overview-priority-panel) { grid-column: auto !important; }
}

/* Overview page: deep-teal hero banner, brand-coloured shortcuts and workflow lanes. */
html:root body.overview-page-shell .overview-page-hero {
  position: relative !important; overflow: hidden !important;
  background: var(--tx-primary) !important; color: var(--tx-on-primary) !important;
  border-radius: var(--tx-radius-card) !important;
  padding: clamp(18px, 2vw, 26px) clamp(20px, 2.6vw, 36px) !important;
  margin-bottom: var(--tx-gap) !important;
}
html:root body.overview-page-shell .overview-page-hero::before,
html:root body.overview-page-shell .overview-page-hero::after { display: none !important; }
/* Hero layout: compact brand block (kicker, #PL company title, greeting) beside the live indicator,
   with the actions in one row beneath. Stacks when the hero is narrower than 60rem. */
html:root body.overview-page-shell .overview-hero-grid { display: block !important; width: 100% !important; min-width: 0 !important; container: ov-hero / inline-size !important; }
html:root body.overview-page-shell .overview-hero-main {
  display: grid !important; grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: none !important; grid-template-areas: 'live' 'brand' 'actions' !important;
  align-items: flex-start !important; justify-items: stretch !important;
  gap: 14px !important; width: 100% !important; min-width: 0 !important; text-align: left !important;
}
html:root body.overview-page-shell .overview-hero-copy-card {
  grid-area: brand !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important;
  gap: 2px !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; text-align: left !important;
}
html:root body.overview-page-shell .overview-page-hero :is(.dashboard-kicker, .warehouse-name, .overview-page-title, .hero-greeting, .dashboard-hero-description, .overview-live-strip) {
  min-width: 0 !important; max-width: 100% !important; margin: 0 !important; text-align: left !important; justify-self: start !important;
  white-space: normal !important; overflow-wrap: anywhere;
}
html:root body.overview-page-shell .overview-page-hero :is(.dashboard-kicker, .warehouse-name) { color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; line-height: 1.3 !important; }
html:root body.overview-page-shell .overview-page-hero :is(.overview-page-title, .hero-greeting, .dashboard-hero-description, .overview-live-strip, .overview-hero-footnote, .overview-hero-footnote span) { color: var(--tx-on-primary) !important; }
html:root body.overview-page-shell .overview-page-hero .overview-page-title { margin-top: 2px !important; font-size: clamp(30px, 4.6cqi, var(--tx-size-page-title)) !important; line-height: 1.1 !important; }
html:root body.overview-page-shell .overview-page-hero .overview-page-title::before { background: var(--tx-brand-apricot) !important; }
html:root body.overview-page-shell .overview-page-hero .hero-greeting { display: block !important; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important; opacity: 0.9; }
html:root body.overview-page-shell .overview-page-hero .hero-greeting::before { display: none !important; }
html:root body.overview-page-shell .overview-page-hero .dashboard-hero-description { display: none !important; }
html:root body.overview-page-shell .overview-hero-footnote span { background: var(--tx-side-tile-bg) !important; border: 0 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html:root body.overview-page-shell .overview-page-hero .overview-live-strip {
  grid-area: live !important; display: inline-flex !important; align-items: center !important; gap: 10px !important;
  width: fit-content !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important;
}
html:root body.overview-page-shell .overview-live-dot { flex: 0 0 auto; background: var(--tx-brand-mint) !important; }
html:root body.overview-page-shell .overview-hero-actions {
  grid-area: actions !important; display: flex !important; flex-wrap: wrap !important; align-items: stretch !important;
  align-self: start !important; justify-content: flex-start !important; gap: 10px !important;
  width: 100% !important; min-width: 0 !important; margin: 0 !important;
}
html:root body.overview-page-shell .overview-page-hero .hero-action-btn { max-width: 100% !important; white-space: normal !important; }
@container ov-hero (min-width: 60rem) {
  html:root body.overview-page-shell .overview-hero-main {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-rows: auto auto !important; grid-template-areas: 'brand live' 'actions actions' !important;
    column-gap: clamp(24px, 4cqi, 56px) !important; row-gap: 16px !important;
  }
  html:root body.overview-page-shell .overview-page-hero .overview-live-strip { justify-self: end !important; }
}
html:root body.overview-page-shell .overview-page-hero .hero-action-btn { background: transparent !important; color: var(--tx-on-primary) !important; border: 1.5px solid rgba(255,255,255,0.55) !important; }
html:root body.overview-page-shell .overview-page-hero .hero-action-btn:first-child { background: var(--tx-brand-apricot) !important; color: var(--tx-on-apricot) !important; border-color: var(--tx-brand-apricot) !important; }
html:root body.overview-page-shell .overview-page-hero .hero-action-btn:not(:first-child):hover { background: var(--tx-side-tile-bg) !important; }

/* Overview cards: solid tinted surfaces (no edge accents), one padding and radius for every variant.
   Tones: teal = sage, mint, apricot, teal-mid. Each card's icon uses the solid version of its tone. */
html:root body.overview-page-shell :is(.activity-panel, .overview-priority-panel, .overview-shortcut-card, .workflow-card) {
  --ov-tint: var(--tx-sage); --ov-ink: var(--tx-on-sage);
  --ov-solid: var(--tx-brand-teal); --ov-on-solid: var(--tx-on-primary);
  background: var(--ov-tint) !important; background-image: none !important; color: var(--ov-ink) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important;
  padding: var(--tx-card-pad) !important; box-shadow: none !important; transform: none !important;
}
html:root body.overview-page-shell :is(.overview-shortcut-card, .workflow-card):nth-child(2) {
  --ov-tint: color-mix(in srgb, var(--tx-brand-mint) 30%, var(--tx-card)); --ov-ink: var(--tx-text);
  --ov-solid: var(--tx-brand-mint); --ov-on-solid: var(--tx-brand-teal);
}
html:root body.overview-page-shell :is(.overview-shortcut-card, .workflow-card):nth-child(3) {
  --ov-tint: color-mix(in srgb, var(--tx-brand-apricot) 26%, var(--tx-card)); --ov-ink: var(--tx-text);
  --ov-solid: var(--tx-brand-apricot); --ov-on-solid: var(--tx-on-apricot);
}
html:root body.overview-page-shell .workflow-card:nth-child(4) {
  --ov-tint: color-mix(in srgb, var(--tx-brand-teal-mid) 20%, var(--tx-card)); --ov-ink: var(--tx-text);
  --ov-solid: var(--tx-brand-teal-mid); --ov-on-solid: var(--tx-on-primary);
}
html:root body.overview-page-shell .overview-priority-panel { --ov-tint: var(--tx-card); --ov-ink: var(--tx-text); }
html:root body.overview-page-shell :is(.overview-shortcut-card, .workflow-card) :is(h3, h4, p, span, strong, .overview-shortcut-title, .overview-shortcut-copy, .workflow-card-title, .workflow-card-description) { color: inherit !important; }
html:root body.overview-page-shell :is(.overview-shortcut-card, .workflow-card):hover {
  background: color-mix(in srgb, var(--ov-solid) 14%, var(--ov-tint)) !important; color: var(--ov-ink) !important;
  border: 0 !important; box-shadow: none !important; transform: none !important;
}
html:root body.overview-page-shell :is(.activity-panel, .overview-priority-panel) :is(.activity-row, .list-row, li) {
  background: var(--tx-card) !important; color: var(--tx-text) !important; border: 0 !important; border-radius: var(--tx-radius-tile) !important;
}

html:root body.overview-page-shell .workflow-strip { background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; color: var(--tx-text) !important; padding: var(--tx-card-pad) !important; }
html:root body.overview-page-shell .workflow-strip::before,
html:root body.overview-page-shell .workflow-strip::after { display: none !important; }
html:root body.overview-page-shell .workflow-strip :is(.dashboard-kicker, .section-heading, .section-description) { color: var(--tx-text) !important; }
html:root body.overview-page-shell .workflow-card :is(.tx-icon-box, .workflow-card-icon) { background: var(--ov-solid) !important; color: var(--ov-on-solid) !important; }
html:root body.overview-page-shell .overview-shortcut-card { display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; column-gap: 14px !important; row-gap: 4px !important; align-items: start !important; }
html:root body.overview-page-shell .overview-shortcut-title { font-size: var(--tx-size-label) !important; line-height: 1.25 !important; }
html:root body.overview-page-shell .overview-shortcut-copy { font-size: var(--tx-size-min) !important; line-height: 1.4 !important; opacity: 0.85; }

/* Workflow lanes: 1 column, 2 from 40rem of strip width, 4 stacked tiles from 88rem. */
html:root body.overview-page-shell .workflow-strip { container: ov-lanes / inline-size; }
html:root body.overview-page-shell .workflow-grid { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: var(--tx-gap) !important; }
html:root body.overview-page-shell .workflow-card {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; align-items: start !important;
  column-gap: 16px !important; row-gap: 14px !important; min-height: 0 !important; min-width: 0 !important;
}
html:root body.overview-page-shell .workflow-card::after { display: none !important; }
html:root body.overview-page-shell .workflow-card-title { margin: 0 0 4px !important; font-size: var(--tx-size-label) !important; line-height: 1.25 !important; }
html:root body.overview-page-shell .workflow-card-description { display: block !important; margin: 0 !important; font-size: var(--tx-size-min) !important; line-height: 1.45 !important; opacity: 0.85; }
@container ov-lanes (min-width: 40rem) {
  html:root body.overview-page-shell .workflow-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@container ov-lanes (min-width: 88rem) {
  html:root body.overview-page-shell .workflow-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  html:root body.overview-page-shell .workflow-card { grid-template-columns: minmax(0, 1fr) !important; }
}


/* Inventory management: full-width filter panel and KPI row. KPI cards use solid brand fills:
   Visible shipments = deep teal, Units on hand = mid teal, Tracked SKUs = apricot, Active clients = mint. */
html:root body.inventory-management-page .dashboard-container { padding: var(--tx-page-pad) !important; }
html:root body.inventory-management-page .inventory-page-shell { gap: var(--tx-gap) !important; }
html:root body.inventory-management-page .search-filter-section { grid-template-columns: minmax(0, 1fr) max-content !important; column-gap: var(--tx-gap) !important; align-items: center !important; padding: var(--tx-card-pad) !important; }
html:root body.inventory-management-page .search-filter-section .filter-controls { align-items: end !important; gap: 12px !important; margin: var(--tx-gap) 0 0 !important; background: transparent !important; }
html:root body.inventory-management-page .search-filter-section .filter-group { justify-content: flex-end !important; min-width: 0 !important; }
html:root body.inventory-management-page .search-filter-section :is(.filter-input, .filter-select, .reset-filters-btn) { box-sizing: border-box !important; height: var(--tx-btn-h) !important; min-height: var(--tx-btn-h) !important; width: 100% !important; min-width: 0 !important; }
html:root body.inventory-management-page .search-filter-section .reset-filters-btn { width: auto !important; }
html:root body.inventory-management-page .search-filter-section .results-summary { white-space: nowrap !important; }
html:root body.inventory-management-page .overview-band { overflow: visible !important; margin: 0 !important; }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important; grid-auto-flow: row !important;
  min-width: 0 !important; justify-content: stretch !important; align-items: stretch !important; gap: var(--tx-gap) !important;
}
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card {
  --inv-kpi-fill: var(--tx-brand-teal); --inv-kpi-text: var(--tx-on-primary); --inv-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; justify-content: flex-start !important; gap: 8px !important;
  width: auto !important; min-width: 0 !important; min-height: 0 !important; aspect-ratio: auto !important;
  padding: var(--tx-card-pad) !important;
  background: var(--inv-kpi-fill) !important; background-image: none !important; border-color: var(--inv-kpi-fill) !important;
  color: var(--inv-kpi-text) !important; box-shadow: none !important;
}
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card { border: 0 !important; }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:hover { box-shadow: none !important; }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(1) { --inv-kpi-fill: var(--tx-brand-teal); --inv-kpi-number: var(--tx-brand-apricot); }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(2) { --inv-kpi-fill: var(--tx-brand-teal-mid); }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(3) { --inv-kpi-fill: var(--tx-brand-apricot); --inv-kpi-text: var(--tx-brand-teal); --inv-kpi-number: var(--tx-brand-teal); }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(4) { --inv-kpi-fill: var(--tx-brand-mint); --inv-kpi-text: var(--tx-brand-teal); --inv-kpi-number: var(--tx-brand-teal); }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card, html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(n) .kpi-card-header { order: 1 !important; margin: 0 !important; min-width: 0 !important; }
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(n) .kpi-card-label {
  display: block !important; max-width: none !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.2 !important;
  letter-spacing: normal !important; text-transform: none !important;
}
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(n) .kpi-card-value {
  order: 2 !important; align-self: stretch !important; margin: 0 !important; text-align: center !important; white-space: nowrap !important;
  color: var(--inv-kpi-number) !important; font-size: 32px !important; font-weight: var(--tx-weight-bold) !important;
  line-height: 1.05 !important; letter-spacing: -0.02em !important; text-shadow: none !important;
}
html:root body.inventory-management-page .overview-band .dashboard-kpi-grid > .kpi-card:nth-child(n) .kpi-card-meta {
  order: 3 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important;
  align-self: stretch !important; color: inherit !important; opacity: .9; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
@media (max-width: 1180px) {
  html:root body.inventory-management-page .overview-band .dashboard-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root body.inventory-management-page .search-filter-section { display: block !important; }
  html:root body.inventory-management-page .search-filter-section .results-summary-row { display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; gap: 12px !important; margin: var(--tx-gap) 0 0 !important; padding: 0 !important; border: 0 !important; }
  html:root body.inventory-management-page .search-filter-section .filter-controls { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root body.inventory-management-page .search-filter-section .reset-filters-btn { grid-column: 1 / -1 !important; width: 100% !important; }
}
@media (max-width: 768px) {
  html:root body.inventory-management-page.dashboard-body { margin-left: 0 !important; }
  html:root body.inventory-management-page .dashboard-header { left: 0 !important; }
}
@media (max-width: 900px) {
  html:root body.inventory-management-page .search-filter-section .results-summary { white-space: normal !important; }
}
@media (max-width: 480px) {
  html:root body.inventory-management-page .overview-band .dashboard-kpi-grid { grid-template-columns: 1fr !important; }
}

/* Inbound scan: metric cards use the same solid brand fills as inventory management (no icon badges);
   workflow steps drop the left accent bar, the current step is a solid deep-teal block. */
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics { gap: var(--tx-gap) !important; }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card {
  --inb-kpi-fill: var(--tx-brand-teal); --inb-kpi-text: var(--tx-on-primary); --inb-kpi-number: var(--tx-on-primary);
  gap: 8px !important; padding: var(--tx-card-pad) !important;
  background: var(--inb-kpi-fill) !important; background-image: none !important; border: 1px solid var(--inb-kpi-fill) !important;
  color: var(--inb-kpi-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card::before { content: none !important; display: none !important; }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card:nth-child(1) { --inb-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card:nth-child(2) { --inb-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card:nth-child(3) { --inb-kpi-fill: var(--tx-brand-apricot); --inb-kpi-text: var(--tx-brand-teal); --inb-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card:nth-child(4) { --inb-kpi-fill: var(--tx-brand-mint); --inb-kpi-text: var(--tx-brand-teal); --inb-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card .receiving-metric-label {
  margin: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.2 !important;
  letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card .receiving-metric-value {
  margin: 0 !important; white-space: nowrap !important; color: var(--inb-kpi-number) !important;
  font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.05 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-overview-metrics > .receiving-metric-card .receiving-metric-copy {
  display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important;
  margin: 0 !important; color: inherit !important; opacity: .9; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview {
  gap: var(--tx-gap) !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview .workflow-overview-step {
  border: 1px solid var(--tx-line) !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview .workflow-overview-step[data-step-state="current"] {
  border-color: var(--tx-brand-teal) !important; background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview .workflow-overview-step[data-step-state="complete"] {
  border-color: var(--tx-brand-mint) !important; background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview .workflow-overview-step * { color: inherit !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.inbound-scan-shell :is(#ancillary-charge-workbench, .ancillary-workbench, .expected-inventory-section) {
  background: var(--tx-sage) !important; background-image: none !important; color: var(--tx-on-sage) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important; box-shadow: none !important; padding: var(--tx-card-pad) !important;
}
html:root:not(#_) body.inbound-scan-shell .expected-inventory-section { background: color-mix(in srgb, var(--tx-brand-mint) 30%, var(--tx-card)) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.inbound-scan-shell :is(.receiving-workflow-overview .workflow-overview-number, .workflow-step-number) {
  border: 0 !important; background: var(--tx-sage) !important; color: var(--tx-text) !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important;
}
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview .workflow-overview-step[data-step-state="current"] .workflow-overview-number { background: var(--tx-brand-apricot) !important; color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.inbound-scan-shell .receiving-workflow-overview .workflow-overview-step[data-step-state="complete"] .workflow-overview-number { background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important; }
@media (max-width: 768px) {
  html:root:not(#_) body.inbound-scan-shell.dashboard-body { margin-left: 0 !important; }
  html:root:not(#_) body.inbound-scan-shell .dashboard-header { left: 0 !important; }
}

/* Storage locations: stat cards fill the row with the same solid brand fills (no icon badges, no top accent);
   filter panel runs search + filters on one row, results count and view toggle on the next. */
html:root:not(#_) body.storage-locations-page .storage-stats-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important; grid-auto-flow: row !important;
  justify-content: stretch !important; gap: var(--tx-gap) !important; overflow: visible !important;
}
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card {
  --sl-kpi-fill: var(--tx-brand-teal); --sl-kpi-text: var(--tx-on-primary); --sl-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important;
  width: auto !important; min-width: 0 !important; min-height: 0 !important;
  padding: var(--tx-card-pad) !important; border: 1px solid var(--sl-kpi-fill) !important;
  background: var(--sl-kpi-fill) !important; background-image: none !important;
  color: var(--sl-kpi-text) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card::before,
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card::after { content: none !important; display: none !important; }
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card:nth-child(1) { --sl-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card:nth-child(2) { --sl-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card:nth-child(3) { --sl-kpi-fill: var(--tx-brand-apricot); --sl-kpi-text: var(--tx-brand-teal); --sl-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card:nth-child(4) { --sl-kpi-fill: var(--tx-brand-mint); --sl-kpi-text: var(--tx-brand-teal); --sl-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.storage-locations-page .storage-stats-grid > .storage-stat-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.storage-locations-page .storage-stats-grid .storage-stat-icon { display: none !important; }
html:root:not(#_) body.storage-locations-page .storage-stats-grid .stat-content { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 8px !important; width: 100% !important; min-width: 0 !important; }
html:root:not(#_) body.storage-locations-page .storage-stats-grid .stat-label {
  order: 1; margin: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.2 !important;
  letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.storage-locations-page .storage-stats-grid .stat-value {
  order: 2; align-self: stretch !important; margin: 0 !important; text-align: center !important; white-space: nowrap !important; color: var(--sl-kpi-number) !important;
  font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.05 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.storage-locations-page .storage-command-surface {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important;
  gap: var(--tx-gap) !important; padding: var(--tx-card-pad) !important;
}
html:root:not(#_) body.storage-locations-page .storage-command-grid {
  grid-column: 1 / -1 !important; grid-row: 1 !important; display: grid !important;
  grid-template-columns: minmax(240px, 1fr) auto !important; align-items: end !important; gap: var(--tx-gap) !important; margin: 0 !important;
}
html:root:not(#_) body.storage-locations-page .storage-filter-controls {
  display: grid !important; grid-template-columns: 180px 180px auto !important; align-items: end !important; gap: var(--tx-gap) !important; margin: 0 !important;
  padding: 0 !important; border: 0 !important; background: transparent !important;
}
html:root:not(#_) body.storage-locations-page .storage-filter-controls .filter-group { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 4px !important; min-width: 0 !important; }
html:root:not(#_) body.storage-locations-page .storage-filter-controls .filter-label {
  display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important;
  color: var(--tx-text) !important; text-align: left !important;
  font-size: var(--tx-size-min) !important; font-weight: 700 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.storage-locations-page .storage-filter-controls #reset-filters { width: auto !important; white-space: nowrap !important; }
html:root:not(#_) body.storage-locations-page .storage-results-summary-pill {
  grid-column: 1 !important; grid-row: 2 !important; display: block !important; margin: 0 !important; padding: 0 !important;
  background: transparent !important; white-space: nowrap !important; font-size: var(--tx-size-min) !important;
}
html:root:not(#_) body.storage-locations-page .storage-command-surface .results-summary-row {
  grid-column: 2 !important; grid-row: 2 !important; display: flex !important; justify-content: flex-end !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important;
}
html:root:not(#_) body.storage-locations-page .storage-data-table td.empty-state {
  display: table-cell !important; padding: 20px 18px !important; border: 0 !important; border-radius: 0 !important;
  background: transparent !important; text-align: center !important;
}
@media (max-width: 1180px) {
  html:root:not(#_) body.storage-locations-page .storage-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.storage-locations-page .storage-command-grid { grid-template-columns: 1fr !important; }
  html:root:not(#_) body.storage-locations-page .storage-filter-controls { grid-template-columns: repeat(2, minmax(0, 1fr)) auto !important; }
}
@media (max-width: 768px) {
  html:root:not(#_) body.storage-locations-page.dashboard-body { margin-left: 0 !important; }
  html:root:not(#_) body.storage-locations-page .dashboard-header { left: 0 !important; }
}
@media (max-width: 640px) {
  html:root:not(#_) body.storage-locations-page .storage-filter-controls { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.storage-locations-page .storage-filter-controls #reset-filters { grid-column: 1 / -1 !important; width: 100% !important; }
}
@media (max-width: 480px) {
  html:root:not(#_) body.storage-locations-page .storage-stats-grid { grid-template-columns: 1fr !important; }
}

/* Inbound shipments: stat cards use the same solid brand fills; BOL Capture is the solid apricot primary launch card. */
html:root:not(#_) body.inbound-shipments-page .dashboard-container { gap: var(--tx-gap) !important; }
html:root:not(#_) body.inbound-shipments-page :is(.inbound-hub-stats, .workflow-launchpad, .active-shipments-section) { margin: 0 !important; background-image: none !important; }
html:root:not(#_) body.inbound-shipments-page :is(.inbound-hub-stats, .workflow-launchpad, .active-shipments-section, .workflow-card, .hub-stat-card)::before,
html:root:not(#_) body.inbound-shipments-page :is(.inbound-hub-stats, .workflow-launchpad, .active-shipments-section, .workflow-card, .hub-stat-card)::after { content: none !important; display: none !important; }
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats {
  display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; grid-auto-flow: row !important; justify-content: stretch !important;
  gap: var(--tx-gap) !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: transparent !important; box-shadow: none !important; overflow: visible !important;
}
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats > .hub-stat-card {
  --ish-kpi-fill: var(--tx-brand-teal); --ish-kpi-text: var(--tx-on-primary); --ish-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; align-items: center !important; gap: 8px !important;
  width: auto !important; min-width: 0 !important; min-height: 0 !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--ish-kpi-fill) !important; background: var(--ish-kpi-fill) !important; background-image: none !important;
  color: var(--ish-kpi-text) !important; text-align: center !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats > .hub-stat-card:nth-child(1) { --ish-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats > .hub-stat-card:nth-child(2) { --ish-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats > .hub-stat-card:nth-child(3) { --ish-kpi-fill: var(--tx-brand-apricot); --ish-kpi-text: var(--tx-brand-teal); --ish-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats > .hub-stat-card:nth-child(4) { --ish-kpi-fill: var(--tx-brand-mint); --ish-kpi-text: var(--tx-brand-teal); --ish-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats > .hub-stat-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats .hub-stat-label {
  max-width: 100% !important; margin: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.2 !important;
  letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats .hub-stat-value {
  align-self: stretch !important; margin: 0 !important; text-align: center !important; white-space: nowrap !important; color: var(--ish-kpi-number) !important;
  font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.05 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats .hub-stat-note {
  display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important;
  margin: 0 !important; color: inherit !important; opacity: .9; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
html:root:not(#_) body.inbound-shipments-page :is(.workflow-launchpad, .active-shipments-section) { padding: var(--tx-card-pad) !important; box-shadow: none !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-cards-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card {
  display: grid !important; grid-template-columns: 44px minmax(0, 1fr) !important; align-items: center !important; column-gap: 14px !important;
  min-height: 0 !important; padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  text-align: left !important; box-shadow: none !important; transform: none !important; cursor: pointer;
}
html:root:not(#_) body.inbound-shipments-page .workflow-card:hover { border-color: var(--tx-brand-teal-mid) !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card * { color: inherit !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card-icon {
  display: flex !important; align-items: center !important; justify-content: center !important; width: 44px !important; height: 44px !important; padding: 10px !important;
  border: 0 !important; background: var(--tx-sage) !important; color: var(--tx-text) !important;
}
html:root:not(#_) body.inbound-shipments-page .workflow-card-content {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; min-width: 0 !important; text-align: left !important;
}
html:root:not(#_) body.inbound-shipments-page .workflow-card-title { margin: 0 !important; font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; text-align: left !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card-description {
  display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important;
  margin: 4px 0 0 !important; opacity: .85; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
html:root:not(#_) body.inbound-shipments-page .workflow-card:first-child {
  border: 2px solid var(--tx-brand-apricot) !important; background: var(--tx-brand-apricot) !important; color: var(--tx-brand-teal) !important;
}
html:root:not(#_) body.inbound-shipments-page .workflow-card:first-child:hover { border-color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card:first-child .workflow-card-icon { background: var(--tx-brand-teal) !important; color: var(--tx-brand-apricot) !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card:first-child .workflow-card-title { font-size: 1.2em !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.inbound-shipments-page .workflow-card:first-child .workflow-card-description { opacity: 1; }
html:root:not(#_) body.inbound-shipments-page .active-shipments-section .section-header { align-items: flex-end !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.inbound-shipments-page .inbound-filter-grid { display: grid !important; grid-template-columns: repeat(2, 230px) auto !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.inbound-shipments-page .filter-control span {
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; letter-spacing: normal !important; text-transform: none !important;
}

/* Inbound shipments list: Rows (default) / Cards toggle; cards are tinted by status tone. */
html:root:not(#_) body.inbound-shipments-page .shipment-view-control { display: flex !important; flex-direction: column !important; gap: 6px !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-view-toggle {
  display: inline-flex !important; align-items: stretch !important; height: 48px !important; padding: 4px !important; gap: 4px !important;
  border: 1px solid var(--tx-line) !important; border-radius: 999px !important; background: var(--tx-card) !important;
}
html:root:not(#_) body.inbound-shipments-page .shipment-view-toggle button {
  min-width: 76px !important; height: auto !important; min-height: 0 !important; padding: 0 16px !important; border: 0 !important; border-radius: 999px !important;
  background: transparent !important; color: var(--tx-text) !important; box-shadow: none !important;
  font: inherit; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; cursor: pointer;
}
html:root:not(#_) body.inbound-shipments-page .shipment-view-toggle button[aria-pressed="true"] { background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-view-toggle button:focus-visible { outline: 2px solid var(--tx-brand-apricot); outline-offset: 2px; }

html:root:not(#_) body.inbound-shipments-page [data-status-tone] { --ish-tone: transparent; }
html:root:not(#_) body.inbound-shipments-page [data-status-tone="complete"] { --ish-tone: #2E9E5B; }
html:root:not(#_) body.inbound-shipments-page [data-status-tone="progress"] { --ish-tone: #E3B400; }
html:root:not(#_) body.inbound-shipments-page [data-status-tone="alert"] { --ish-tone: #D9463B; }

html:root:not(#_) body.inbound-shipments-page .progress-bar {
  height: 8px !important; border: 0 !important; border-radius: 999px !important; overflow: hidden !important;
  background: color-mix(in srgb, var(--tx-text) 12%, transparent) !important;
}
html:root:not(#_) body.inbound-shipments-page .progress-fill { height: 100% !important; border-radius: 999px !important; background: var(--tx-brand-teal-mid) !important; }

html:root:not(#_) body.inbound-shipments-page .active-shipments-grid[data-shipment-view="cards"] {
  display: grid !important; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)) !important; gap: var(--tx-gap) !important;
}
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-title-row { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-heading { min-width: 0 !important; flex: 1 1 auto !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-status-stack {
  display: flex !important; flex: 0 0 auto !important; flex-direction: column !important; align-items: flex-end !important; gap: 6px !important; max-width: 50% !important;
}
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-ref { font-size: var(--tx-size-min) !important; font-weight: 700 !important; letter-spacing: normal !important; text-transform: none !important; opacity: .75; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-title { margin: 2px 0 0 !important; font-size: 1.1rem !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.25 !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-client { margin: 2px 0 0 !important; font-size: var(--tx-size-min) !important; font-weight: 600 !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-alert {
  display: inline-flex !important; padding: 3px 10px !important; border: 0 !important; border-radius: 999px !important;
  background: color-mix(in srgb, #D9463B 18%, var(--tx-card)) !important; color: var(--tx-problem-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important;
}
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-metric-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-metric { padding: 10px 12px !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-metric-label {
  font-size: var(--tx-size-min) !important; font-weight: 700 !important; letter-spacing: normal !important; text-transform: none !important; opacity: .75;
}
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-actions { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-actions .btn-action { flex: 1 1 0 !important; width: auto !important; margin: 0 !important; white-space: nowrap !important; }
html:root:not(#_) body.inbound-shipments-page .active-shipments-grid[data-shipment-view="cards"] > .shipment-card {
  display: flex !important; flex-direction: column !important; margin: 0 !important;
  border: 1px solid color-mix(in srgb, var(--ish-tone) 55%, var(--tx-line)) !important;
  background: color-mix(in srgb, var(--ish-tone) 16%, var(--tx-card)) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.inbound-shipments-page .active-shipments-grid[data-shipment-view="cards"] > .shipment-card::before,
html:root:not(#_) body.inbound-shipments-page .active-shipments-grid[data-shipment-view="cards"] > .shipment-card::after { content: none !important; display: none !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card :is(.shipment-card-body, .shipment-card-header, .shipment-card-progress) { background: transparent !important; box-shadow: none !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-metric {
  border-color: color-mix(in srgb, var(--ish-tone) 30%, var(--tx-line)) !important; background: color-mix(in srgb, var(--tx-card) 60%, transparent) !important;
}
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-body { display: flex !important; flex-direction: column !important; flex: 1 !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-card-actions { margin-top: auto !important; }
html:root:not(#_) body.inbound-shipments-page :is(.shipment-card-alert.is-delayed, .shipment-row-flag) {
  display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px;
  background: color-mix(in srgb, #D9463B 18%, var(--tx-card)); color: var(--tx-problem-text) !important;
  font-size: var(--tx-size-min); font-weight: var(--tx-weight-bold); white-space: nowrap;
}

html:root:not(#_) body.inbound-shipments-page .active-shipments-grid[data-shipment-view="rows"] { display: block !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-table-wrap { overflow-x: auto; border: 1px solid var(--tx-line); border-radius: 16px; }
html:root:not(#_) body.inbound-shipments-page .shipment-table { width: 100%; min-width: 900px; margin: 0; }
html:root:not(#_) body.inbound-shipments-page .shipment-table :is(th, td) { padding: 12px 10px !important; text-align: left !important; vertical-align: middle !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-table td:first-child { min-width: 200px; }
html:root:not(#_) body.inbound-shipments-page .shipment-table :is(td, th):is(:nth-child(4), :nth-child(5)) { white-space: nowrap; }
html:root:not(#_) body.inbound-shipments-page .shipment-table :is(td, th):last-child { text-align: right !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-table td { color: var(--tx-text) !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-table tr.shipment-row > td {
  background: color-mix(in srgb, var(--ish-tone) 16%, var(--tx-card)) !important; background-image: none !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ish-tone) 35%, var(--tx-line)) !important;
}
html:root:not(#_) body.inbound-shipments-page .shipment-table tr.shipment-row > td:first-child { box-shadow: inset 4px 0 0 var(--ish-tone) !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-table td:nth-child(3) { white-space: nowrap; }
html:root:not(#_) body.inbound-shipments-page .shipment-table td:nth-child(3) > * { display: flex !important; width: fit-content !important; padding: 3px 10px !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-table td:nth-child(3) > * + * { margin-top: 4px; }
html:root:not(#_) body.inbound-shipments-page .shipment-row-ref { font-size: var(--tx-size-min); font-weight: 700; opacity: .75; }
html:root:not(#_) body.inbound-shipments-page .shipment-row-name { font-weight: var(--tx-weight-bold); }
html:root:not(#_) body.inbound-shipments-page .shipment-row .shipment-card-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
html:root:not(#_) body.inbound-shipments-page .shipment-row-progress { display: flex; align-items: center; gap: 8px; min-width: 110px; }
html:root:not(#_) body.inbound-shipments-page .shipment-row-progress .progress-bar { flex: 1; margin: 0 !important; }
html:root:not(#_) body.inbound-shipments-page .shipment-row-progress span { font-weight: var(--tx-weight-bold); font-size: var(--tx-size-min); }
html:root:not(#_) body.inbound-shipments-page .shipment-row-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
html:root:not(#_) body.inbound-shipments-page .shipment-row-actions .btn-action {
  width: auto !important; min-height: 36px !important; height: 36px !important; margin: 0 !important; padding: 0 14px !important;
  font-size: var(--tx-size-min) !important; white-space: nowrap !important;
}
@media (max-width: 1180px) {
  html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 980px) {
  html:root:not(#_) body.inbound-shipments-page .workflow-cards-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 768px) {
  html:root:not(#_) body.inbound-shipments-page.dashboard-body { margin-left: 0 !important; }
  html:root:not(#_) body.inbound-shipments-page .dashboard-header { left: 0 !important; }
}
@media (max-width: 760px) {
  html:root:not(#_) body.inbound-shipments-page .active-shipments-section .section-header { flex-direction: column !important; align-items: stretch !important; }
  html:root:not(#_) body.inbound-shipments-page .inbound-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.inbound-shipments-page .shipment-view-control { grid-column: 1 / -1; }
  html:root:not(#_) body.inbound-shipments-page .active-shipments-grid[data-shipment-view="cards"] { grid-template-columns: 1fr !important; }
}
@media (max-width: 480px) {
  html:root:not(#_) body.inbound-shipments-page .inbound-hub-stats,
  html:root:not(#_) body.inbound-shipments-page .inbound-filter-grid { grid-template-columns: 1fr !important; }
  html:root:not(#_) body.inbound-shipments-page .shipment-card .shipment-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* Outbound shipping: page aliases resolve to master tokens; KPI cards use the same solid brand fills as inventory management
   (Ready to ship = deep teal, In transit = mid teal, Delivered = apricot, LTL pallets = mint); the shipment list is a table band. */
html:root:not(#_) body.outbound-shipping-page {
  --sb-surface: var(--tx-card) !important; --sb-surface-raised: var(--tx-row-alt) !important;
  --sb-text: var(--tx-text) !important; --sb-text-muted: var(--tx-text) !important; --sb-text-dim: var(--tx-text) !important;
  --sb-border: var(--tx-line) !important; --sb-accent: var(--tx-numbers) !important; --sb-accent-soft: var(--tx-sage) !important;
  --sb-success: var(--tx-good-text) !important; --sb-warning: var(--tx-pending-text) !important; --sb-danger: var(--tx-problem-text) !important;
  --ptx-ui-canvas: var(--tx-canvas) !important; --ptx-ui-accent-text: var(--tx-on-primary) !important; --ptx-ui-border-strong: var(--tx-input-border) !important;
  --outbound-detail-backdrop: color-mix(in srgb, var(--tx-canvas) 70%, transparent) !important;
  --outbound-detail-surface: var(--tx-card) !important; --outbound-detail-header-surface: var(--tx-card) !important;
  --outbound-detail-card: var(--tx-card) !important; --outbound-detail-card-alt: var(--tx-row-alt) !important;
  --outbound-detail-border: var(--tx-line) !important; --outbound-detail-border-strong: var(--tx-input-border) !important;
  --outbound-detail-chip-bg: var(--tx-sage) !important; --outbound-detail-chip-text: var(--tx-on-sage) !important;
  --outbound-detail-warning-bg: var(--tx-pending-bg) !important; --outbound-detail-warning-border: var(--tx-line) !important; --outbound-detail-warning-text: var(--tx-pending-text) !important;
  --outbound-detail-error-bg: var(--tx-problem-bg) !important; --outbound-detail-error-border: var(--tx-line) !important; --outbound-detail-error-text: var(--tx-problem-text) !important;
  background: var(--tx-canvas) !important; color: var(--tx-text) !important;
}
html:root:not(#_) body.outbound-shipping-page .dashboard-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; padding: var(--tx-page-pad) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.modern-overview-band, .outbound-command-panel, #shipments-container, .outbound-shipment-pagination) { margin: 0 !important; }
html:root:not(#_) body.outbound-shipping-page .modern-overview-band { overflow: visible !important; }
html:root:not(#_) body.outbound-shipping-page .modern-overview-band .modern-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important; grid-auto-flow: row !important;
  justify-content: stretch !important; align-items: stretch !important; gap: var(--tx-gap) !important; overflow: visible !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card {
  --ob-kpi-fill: var(--tx-brand-teal); --ob-kpi-text: var(--tx-on-primary); --ob-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; justify-content: flex-start !important; gap: 8px !important;
  width: auto !important; min-width: 0 !important; min-height: 0 !important; padding: var(--tx-card-pad) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important; background: var(--ob-kpi-fill) !important; background-image: none !important;
  color: var(--ob-kpi-text) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card:nth-child(1) { --ob-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card:nth-child(2) { --ob-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card:nth-child(3) { --ob-kpi-fill: var(--tx-brand-apricot); --ob-kpi-text: var(--tx-brand-teal); --ob-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card:nth-child(4) { --ob-kpi-fill: var(--tx-brand-mint); --ob-kpi-text: var(--tx-brand-teal); --ob-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card .kpi-icon-wrapper { display: none !important; }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card .kpi-content { display: contents !important; }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card .kpi-card-header { order: 1 !important; margin: 0 !important; min-width: 0 !important; }
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card .kpi-card-label {
  display: block !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.2 !important;
  letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card .kpi-card-value {
  order: 2 !important; align-self: stretch !important; margin: 0 !important; text-align: center !important; white-space: nowrap !important;
  color: var(--ob-kpi-number) !important; font-size: 32px !important; font-weight: var(--tx-weight-bold) !important;
  line-height: 1.05 !important; letter-spacing: -0.02em !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-kpi-grid > .kpi-card .kpi-card-meta {
  order: 3 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important;
  align-self: stretch !important; color: inherit !important; opacity: .9; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
html:root:not(#_) body.outbound-shipping-page .outbound-command-panel {
  padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important;
}
html:root:not(#_) body.outbound-shipping-page .outbound-command-panel .activity-panel-title {
  margin: 0 !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-action-bar { flex-wrap: wrap !important; gap: 12px !important; }
html:root:not(#_) body.outbound-shipping-page .modern-action-bar .filter-group {
  display: inline-flex !important; align-items: stretch !important; height: var(--tx-btn-h) !important; padding: 4px !important; gap: 4px !important;
  border: 1px solid var(--tx-line) !important; border-radius: 999px !important; background: var(--tx-card) !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-filter-btn {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; min-height: 0 !important; padding: 0 16px !important;
  border: 0 !important; border-radius: 999px !important; background: transparent !important; color: var(--tx-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-filter-btn:hover:not(.active) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.outbound-shipping-page .modern-filter-btn.active { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.outbound-shipping-page .status-dot { width: 10px !important; height: 10px !important; border-radius: 50% !important; box-shadow: none !important; }
html:root:not(#_) body.outbound-shipping-page .status-dot.dot-ready { background: var(--tx-apricot) !important; }
html:root:not(#_) body.outbound-shipping-page .status-dot.dot-transit { background: var(--tx-pending-text) !important; }
html:root:not(#_) body.outbound-shipping-page .status-dot.dot-delivered { background: var(--tx-good-text) !important; }
html:root:not(#_) body.outbound-shipping-page .modern-filter-btn.active .status-dot { outline: 2px solid var(--tx-on-primary) !important; }
html:root:not(#_) body.outbound-shipping-page .modern-action-buttons { flex-wrap: wrap !important; gap: 12px !important; }
html:root:not(#_) body.outbound-shipping-page .modern-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important;
  min-height: var(--tx-btn-h) !important; padding: 0 22px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.outbound-shipping-page .modern-btn.btn-glow { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.outbound-shipping-page .modern-btn:hover:not(:disabled) { filter: brightness(1.08); }
html:root:not(#_) body.outbound-shipping-page #shipments-container.shipments-grid {
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; overflow: hidden !important;
}
html:root:not(#_) body.outbound-shipping-page .shipment-row-columns {
  min-height: var(--tx-table-head-h) !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.outbound-shipping-page .shipment-row-columns span + span { border-left-color: color-mix(in srgb, var(--tx-table-head-text) 25%, transparent) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-card { border-top: 1px solid var(--tx-line) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-card:nth-child(odd) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-card:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-card :is(.shipment-card-header, .shipment-card-footer) { border-color: var(--tx-line) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-card :is(h3, .shipment-id, .shipment-destination, .info-label, .info-value, .shipment-tracking-label, .shipment-tracking-number) { color: var(--tx-text) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-card :is(.info-item, .shipment-tracking, .amazon-status-panel, .shipment-ltl-summary) {
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important;
}
html:root:not(#_) body.outbound-shipping-page .shipment-destination i,
html:root:not(#_) body.outbound-shipping-page .shipment-tracking i { color: var(--tx-numbers) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.shipment-status-pill, .amazon-status-badge) { border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.shipment-status-pill, .amazon-status-badge).is-ready { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.shipment-status-pill, .amazon-status-badge).is-transit { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.shipment-status-pill, .amazon-status-badge).is-delivered { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.shipment-status-pill, .amazon-status-badge).is-error { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-stage { color: var(--tx-text) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-stage.is-complete { color: var(--tx-good-text) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-stage.is-current { color: var(--tx-numbers) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-stage-connector { background: var(--tx-line) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-stage-connector.is-complete { background: var(--tx-good-text) !important; }
html:root:not(#_) body.outbound-shipping-page .modern-btn-sync { border: 1.5px solid var(--tx-input-border) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.outbound-shipping-page .modern-btn-sync:hover:not(:disabled) { border-color: var(--tx-primary) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.outbound-shipping-page .shipment-transportation-badge { border-color: var(--tx-line) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.outbound-shipping-page :is(.modern-empty-state, .modern-loading-state) {
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.outbound-shipping-page .outbound-shipment-pagination { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 600 !important; }
@media (max-width: 1180px) {
  html:root:not(#_) body.outbound-shipping-page .modern-overview-band .modern-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 480px) {
  html:root:not(#_) body.outbound-shipping-page .modern-overview-band .modern-kpi-grid { grid-template-columns: 1fr !important; }
  html:root:not(#_) body.outbound-shipping-page .modern-action-bar .filter-group { width: 100% !important; overflow-x: auto !important; }
}

/* Station pick wave: inline glass styles resolve to master tokens; stat cards use the same solid brand fills as outbound
   (Active waves = deep teal, Orders in focus = mid teal, Picking now = apricot, Packed / done = mint). */
html:root:not(#_) body.station-pick-wave-shell { background: var(--tx-canvas) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .tx-main { padding: var(--tx-page-pad) !important; background: transparent !important; }
html:root:not(#_) body.station-pick-wave-shell .tx-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.station-pick-wave-shell :is(.station-pick-wave-breadcrumb, .station-pick-wave-stats-grid, .station-pick-wave-panel, .station-worker-session-mount, .spw-status-msg) { margin: 0 !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-hero { padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-hero::before,
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-hero::after { display: none !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-hero-grid { gap: var(--tx-gap) !important; }
html:root:not(#_) body.station-pick-wave-shell :is(.station-pick-wave-panel, .station-pick-wave-snapshot-panel, .station-pick-wave-guide-shell) {
  padding: var(--tx-card-pad) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.station-pick-wave-shell :is(.station-pick-wave-live-strip, .station-pick-wave-footnote span) {
  padding: 0 !important; border: 0 !important; background: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-footnote { flex-direction: column !important; gap: 6px !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-footnote span { font-weight: 600 !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-live-dot { background: var(--tx-good-text) !important; box-shadow: none !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-title {
  display: flex !important; align-items: center; gap: 12px; color: var(--tx-text) !important; font-size: var(--tx-size-page-title) !important;
  font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-title::before { content: ""; flex: 0 0 10px; width: 10px; height: 38px; border-radius: 5px; background: var(--tx-primary); }
html:root:not(#_) body.station-pick-wave-shell :is(.station-pick-wave-shell-label, .station-pick-wave-subtitle, .station-pick-wave-description, .station-pick-wave-panel-copy,
  .station-pick-wave-toolbar-copy, .station-pick-wave-snapshot-copy, .spw-empty, .spw-loading, .spw-wave-meta, .spw-guide-subtitle, .spw-guide-copy, .spw-guide-step-note,
  .spw-guide-queue-item small, .spw-supply-editor-copy, .spw-supply-line-meta, .spw-supply-summary, .spw-supply-editor-empty, .spw-guide-stat-label, .spw-pack-form label, .spw-supply-entry-mode span) { color: var(--tx-text) !important; }
html:root:not(#_) body.station-pick-wave-shell :is(.station-pick-wave-panel-title, .station-pick-wave-snapshot-label, .spw-wave-meta strong, .spw-supply-line-title, .spw-guide-title,
  .spw-guide-step-title, .spw-guide-queue-item strong, .spw-guide-stat-value) { color: var(--tx-text) !important; letter-spacing: normal !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-panel-title { font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.3 !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-snapshot-item {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-snapshot-item:hover { border-color: var(--tx-primary) !important; background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-action-btn {
  min-height: var(--tx-btn-h) !important; padding: 0 22px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-action-btn:first-child { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-action-btn:hover { filter: brightness(1.08); }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stats-grid { gap: var(--tx-gap) !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-card {
  --spw-kpi-fill: var(--tx-brand-teal); --spw-kpi-text: var(--tx-on-primary); --spw-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; gap: 8px !important; min-width: 0 !important; padding: var(--tx-card-pad) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important; background: var(--spw-kpi-fill) !important; background-image: none !important;
  color: var(--spw-kpi-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-card:nth-child(1) { --spw-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-card:nth-child(2) { --spw-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-card:nth-child(3) { --spw-kpi-fill: var(--tx-brand-apricot); --spw-kpi-text: var(--tx-brand-teal); --spw-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-card:nth-child(4) { --spw-kpi-fill: var(--tx-brand-mint); --spw-kpi-text: var(--tx-brand-teal); --spw-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-label {
  margin: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; color: inherit !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.2 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-value {
  margin: 0 !important; text-align: center !important; white-space: nowrap !important; color: var(--spw-kpi-number) !important; font-family: var(--tx-font) !important;
  font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.05 !important; letter-spacing: -0.02em !important;
}
html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stat-copy {
  margin: 0 !important; display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; overflow: hidden !important;
  color: inherit !important; opacity: .9; font-size: var(--tx-size-min) !important; font-weight: 600 !important; line-height: 1.3 !important;
}
html:root:not(#_) body.station-pick-wave-shell .spw-btn-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-btn-success { border-color: transparent !important; background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-btn-danger { border-color: transparent !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-btn:hover:not(:disabled) { filter: brightness(1.08); }
html:root:not(#_) body.station-pick-wave-shell .spw-actions-cell .spw-btn { min-height: 36px !important; padding: 0 14px !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-status-msg { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-status-msg.success { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-status-msg.error { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-status-msg.info { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-table-wrap { border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-table th {
  height: var(--tx-table-head-h); background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.station-pick-wave-shell .spw-table td { border-bottom: 1px solid var(--tx-line) !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-table tbody tr:hover,
html:root:not(#_) body.station-pick-wave-shell .spw-table tbody tr.spw-row-active { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.station-pick-wave-shell :is(.spw-id, .spw-guide-inline) { color: var(--tx-numbers) !important; }
html:root:not(#_) body.station-pick-wave-shell :is(.spw-pill, .spw-guide-badge) {
  gap: 6px; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.station-pick-wave-shell .spw-pill:is(.planned, .allocated) { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-pill:is(.in_progress, .picking) { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-pill:is(.packed, .shipped, .delivered, .completed, .returned) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-pill:is(.cancelled, .exception, .on_hold) { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.station-pick-wave-shell :is(.spw-wave-meta > div, .spw-pack-form, .spw-supply-line, .spw-guide-card, .spw-guide-step, .spw-guide-queue-item, .spw-guide-empty, .spw-guide-stat) {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; box-shadow: none !important;
}
html:root:not(#_) body.station-pick-wave-shell .spw-pack-form { border-style: dashed !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-supply-editor { border-top-color: var(--tx-line) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-guide-step.done { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-guide-progress { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-guide-progress-bar { background: var(--tx-primary) !important; background-image: none !important; }
html:root:not(#_) body.station-pick-wave-shell .spw-guide-badge.location { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
@media (max-width: 1180px) {
  html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 480px) {
  html:root:not(#_) body.station-pick-wave-shell .station-pick-wave-stats-grid { grid-template-columns: 1fr !important; }
}

/* Station hub: inline --sh-* / hex styles resolve to master tokens; station stat tiles use solid brand fills
   (Bins Now = deep teal, Today = mid teal, Avg Time = apricot; counts = mint). */
html:root:not(#_) body.station-hub-page { background: var(--tx-canvas) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page .dashboard-main { padding: var(--tx-page-pad) !important; background: transparent !important; }
html:root:not(#_) body.station-hub-page .dashboard-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.station-hub-page :is(.breadcrumb, .page-header, .search-filter-section, .content-section-header, .stations-grid, .bins-table-container) { margin: 0 !important; }
html:root:not(#_) body.station-hub-page .content-section-header[style*="margin-top"] { margin-top: var(--tx-gap) !important; }
html:root:not(#_) body.station-hub-page :is(.breadcrumb-item, .breadcrumb-item a, .breadcrumb-separator) { color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page .breadcrumb-item a:hover { color: var(--tx-primary) !important; }
html:root:not(#_) body.station-hub-page .breadcrumb-item.active { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.station-hub-page .page-header { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; padding: 0 !important; background: transparent !important; border: 0 !important; }
html:root:not(#_) body.station-hub-page .warehouse-branding { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html:root:not(#_) body.station-hub-page .warehouse-name {
  display: flex !important; align-items: center; gap: 12px; margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-page-title) !important;
  font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
  background: none !important; -webkit-text-fill-color: currentColor !important;
}
html:root:not(#_) body.station-hub-page .warehouse-name::before { content: ""; flex: 0 0 10px; width: 10px; height: 38px; border-radius: 5px; background: var(--tx-primary); }
html:root:not(#_) body.station-hub-page :is(.welcome-message, .results-summary, .filter-label, .form-label, .station-description, .station-bins-title, .station-no-bins,
  .bin-info-label, .bin-contents-summary, .station-history-time, .station-history-duration, .station-history-notes, .action-log-timestamp, .loading-state p) { color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page :is(.results-summary strong, .bin-info-value, .station-history-name, .action-log-details, .station-name, .modal-content h2) { color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page .results-summary strong { color: var(--tx-numbers) !important; }
html:root:not(#_) body.station-hub-page .content-section-title { color: var(--tx-text) !important; font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; }
html:root:not(#_) body.station-hub-page .content-section-title svg { color: var(--tx-primary) !important; fill: currentColor !important; }
html:root:not(#_) body.station-hub-page :is(.search-filter-section, .bins-table-container, .modal-content, .loading-state, .stations-grid > .empty-state) {
  padding: var(--tx-card-pad) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.station-hub-page .bins-table-container { padding: 0 !important; overflow-x: auto !important; }
html:root:not(#_) body.station-hub-page .modal-content { padding: 0 !important; overflow: hidden !important; }
html:root:not(#_) body.station-hub-page :is(.primary-search-input, .filter-select, .form-input) {
  border: 2px solid var(--tx-input-border) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.station-hub-page :is(.primary-search-input, .filter-select, .form-input)::placeholder { color: color-mix(in srgb, var(--tx-text) 60%, transparent) !important; }
html:root:not(#_) body.station-hub-page .primary-search-icon { color: var(--tx-text) !important; fill: currentColor !important; }
html:root:not(#_) body.station-hub-page :focus-visible { outline: 2px solid var(--tx-focus) !important; outline-offset: 2px; box-shadow: none !important; }
html:root:not(#_) body.station-hub-page :is(.btn, .btn-back-to-dashboard, .action-btn, .tab-btn) {
  min-height: var(--tx-btn-h) !important; padding: 0 22px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.station-hub-page :is(.btn-primary, .action-btn-primary) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.station-hub-page :is(.btn, .btn-back-to-dashboard, .action-btn, .tab-btn):hover { filter: brightness(1.08); }
html:root:not(#_) body.station-hub-page .station-hub-filters #create-bin-btn { height: var(--tx-btn-h) !important; }
html:root:not(#_) body.station-hub-page .action-btn { min-height: 36px !important; padding: 0 14px !important; }
html:root:not(#_) body.station-hub-page .bin-details-tabs { border-color: var(--tx-line) !important; }
html:root:not(#_) body.station-hub-page .tab-btn.active { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.station-hub-page .stations-grid { gap: var(--tx-gap) !important; }
html:root:not(#_) body.station-hub-page .station-card { overflow: hidden !important; }
html:root:not(#_) body.station-hub-page .station-card:hover { border-color: var(--tx-primary) !important; box-shadow: none !important; transform: none !important; }
html:root:not(#_) body.station-hub-page .station-card.active { background: var(--tx-card) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.station-hub-page .station-card.active:hover { border-color: var(--tx-primary) !important; }
html:root:not(#_) body.station-hub-page .station-card.disabled { background: var(--tx-row-alt) !important; border-color: var(--tx-line) !important; opacity: .64; }
html:root:not(#_) body.station-hub-page .station-card.disabled:hover { border-color: var(--tx-line) !important; }
html:root:not(#_) body.station-hub-page .station-icon { border: 0 !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; box-shadow: none !important; }
html:root:not(#_) body.station-hub-page .station-icon svg { fill: currentColor !important; }
html:root:not(#_) body.station-hub-page .station-number { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.station-hub-page :is(.station-status, .station-bins-count, .section-badge, .station-bin-tag, .bin-status, .action-log-badge) {
  padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important; text-transform: none !important; box-shadow: none !important;
}
html:root:not(#_) body.station-hub-page .station-status.active { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-hub-page .station-status.inactive { background: var(--tx-row-alt) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page :is(.station-bins-count, .section-badge) { border-color: transparent !important; background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.station-hub-page :is(.station-bin-tag, .bin-status):is(.status-empty) { background: var(--tx-row-alt) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page :is(.station-bin-tag, .bin-status).status-in-use { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.station-hub-page :is(.station-bin-tag, .bin-status).status-full { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.station-hub-page :is(.station-bin-tag, .bin-status).status-completed { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-hub-page .action-log-badge.item_added { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.station-hub-page .action-log-badge.quantity_updated { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.station-hub-page .action-log-badge.bin_checked_in { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-hub-page .action-log-badge.bin_checked_out { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.station-hub-page .action-log-badge.bin_completed { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.station-hub-page :is(.station-bins-section, .modal-header, .modal-footer) { border-color: var(--tx-line) !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.station-hub-page .modal-close { color: var(--tx-text) !important; }
html:root:not(#_) body.station-hub-page .modal-close:hover { color: var(--tx-primary) !important; }
html:root:not(#_) body.station-hub-page :is(.bin-details-summary, .station-history-item, .action-log-item) {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.station-hub-page .station-history-icon { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.station-hub-page .station-history-icon svg { fill: currentColor !important; }
html:root:not(#_) body.station-hub-page .station-card-footer { gap: 8px !important; padding: 12px !important; border-top: 1.5px solid var(--tx-line) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.station-hub-page .station-stat {
  --sh-stat-fill: var(--tx-brand-teal); --sh-stat-text: var(--tx-on-primary);
  min-width: 0 !important; padding: 10px 8px !important; border-radius: var(--tx-radius-tile) !important; background: var(--sh-stat-fill) !important; color: var(--sh-stat-text) !important;
}
html:root:not(#_) body.station-hub-page .station-stat:nth-child(2) { --sh-stat-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.station-hub-page .station-stat:nth-child(3) { --sh-stat-fill: var(--tx-brand-apricot); --sh-stat-text: var(--tx-brand-teal); }
html:root:not(#_) body.station-hub-page .station-stat :is(.station-stat-value, .station-stat-label) { color: inherit !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.station-hub-page .station-stat-value { font-family: var(--tx-font) !important; font-size: 24px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; white-space: nowrap !important; }
html:root:not(#_) body.station-hub-page .station-stat-label { font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.station-hub-page .station-card.disabled .station-stat { filter: saturate(.4); }
html:root:not(#_) body.station-hub-page .data-table { border-collapse: collapse !important; background: var(--tx-card) !important; }
html:root:not(#_) body.station-hub-page .data-table thead { background: var(--tx-table-head-bg) !important; }
html:root:not(#_) body.station-hub-page .data-table th {
  height: var(--tx-table-head-h); border-color: var(--tx-line) !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.station-hub-page .data-table td { border-color: var(--tx-line) !important; border-bottom: 1px solid var(--tx-line) !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.station-hub-page .data-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.station-hub-page .data-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.station-hub-page .data-table tbody tr:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.station-hub-page .data-table td.empty-state { padding: var(--tx-card-pad) !important; border: 0 !important; background: transparent !important; text-align: center !important; }
@media (max-width: 480px) {
  html:root:not(#_) body.station-hub-page .stations-grid { grid-template-columns: 1fr !important; }
}

/* FBA prep requests: inline gradient / hex styles resolve to master tokens; stat cards use the same solid brand fills as outbound
   (Pending = deep teal, In Progress = mid teal, Completed = apricot, Total Units = mint). */
html:root:not(#_) body.fba-prep-requests-page { background: var(--tx-canvas) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .dashboard-main { padding: var(--tx-page-pad) !important; background: transparent !important; }
html:root:not(#_) body.fba-prep-requests-page .dashboard-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.fba-prep-requests-page .dashboard-container > * { margin: 0 !important; }
html:root:not(#_) body.fba-prep-requests-page .page-header { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: var(--tx-gap) !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
html:root:not(#_) body.fba-prep-requests-page .warehouse-branding { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html:root:not(#_) body.fba-prep-requests-page .warehouse-name {
  display: flex !important; align-items: center; gap: 12px; margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-page-title) !important;
  font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
  background: none !important; -webkit-text-fill-color: currentColor !important;
}
html:root:not(#_) body.fba-prep-requests-page .warehouse-name::before { content: ""; flex: 0 0 10px; width: 10px; height: 38px; border-radius: 5px; background: var(--tx-primary); }
html:root:not(#_) body.fba-prep-requests-page :is(.welcome-message, .filter-group label, .client-email, .empty-state p, .error-state p, .item-sku, .qty-label, .history-meta, .history-date,
  .history-user, .history-note, .no-items, .no-history, .info-item label) { color: var(--tx-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .filter-group label { font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.fba-prep-requests-page .stats-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card {
  --fpr-kpi-fill: var(--tx-brand-teal); --fpr-kpi-text: var(--tx-on-primary); --fpr-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; gap: 8px !important; min-width: 0 !important; padding: var(--tx-card-pad) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important; background: var(--fpr-kpi-fill) !important; background-image: none !important;
  color: var(--fpr-kpi-text) !important; box-shadow: none !important; transform: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card:nth-child(1) { --fpr-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card:nth-child(2) { --fpr-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card:nth-child(3) { --fpr-kpi-fill: var(--tx-brand-apricot); --fpr-kpi-text: var(--tx-brand-teal); --fpr-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card:nth-child(4) { --fpr-kpi-fill: var(--tx-brand-mint); --fpr-kpi-text: var(--tx-brand-teal); --fpr-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card .stat-icon { display: none !important; }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card .stat-content { display: flex !important; flex: 1 1 auto !important; gap: 8px !important; }
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card .stat-label {
  order: -1; align-self: stretch !important; margin: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: var(--fpr-kpi-text) !important; text-align: left !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  line-height: 1.2 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .stats-grid .stat-card .stat-value {
  margin: auto 0 !important; align-self: stretch !important; text-align: center !important; white-space: nowrap !important; color: var(--fpr-kpi-number) !important; font-family: var(--tx-font) !important;
  font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.05 !important; letter-spacing: -0.02em !important;
}
html:root:not(#_) body.fba-prep-requests-page :is(.filters-bar, .table-container, .empty-state, .error-state, .fba-prep-modal-content) {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .filters-bar { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px 20px !important; padding: var(--tx-card-pad) !important; }
html:root:not(#_) body.fba-prep-requests-page .filter-group { display: flex !important; align-items: center !important; gap: 10px !important; }
html:root:not(#_) body.fba-prep-requests-page .search-group { flex: 1 1 240px !important; }
html:root:not(#_) body.fba-prep-requests-page .search-group .search-input { width: 100% !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.filter-select, .search-group .search-input, .notes-textarea) {
  min-height: var(--tx-btn-h) !important; border: 2px solid var(--tx-input-border) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .filter-select, html:root:not(#_) body.fba-prep-requests-page .search-group .search-input { border-radius: 999px !important; padding: 0 18px !important; }
html:root:not(#_) body.fba-prep-requests-page .notes-textarea { border-radius: var(--tx-radius-tile) !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.search-input, .notes-textarea)::placeholder { color: color-mix(in srgb, var(--tx-text) 60%, transparent) !important; }
html:root:not(#_) body.fba-prep-requests-page :focus-visible { outline: 2px solid var(--tx-focus) !important; outline-offset: 2px; box-shadow: none !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.btn-primary, .btn-secondary, .btn-status) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  min-height: var(--tx-btn-h) !important; padding: 0 22px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .btn-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.btn-primary, .btn-secondary, .btn-status, .btn-icon, .btn-create-wo):hover:not(:disabled) { filter: brightness(1.08); }
html:root:not(#_) body.fba-prep-requests-page :is(.btn-primary, .btn-secondary, .btn-status):disabled { opacity: .5; cursor: not-allowed; }
html:root:not(#_) body.fba-prep-requests-page .btn-status.btn-pending { border-color: transparent !important; background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.fba-prep-requests-page .btn-status.btn-in-progress { border-color: transparent !important; background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .btn-status.btn-completed { border-color: transparent !important; background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .btn-status.btn-cancelled { border-color: transparent !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .btn-status.active { border-color: currentColor !important; box-shadow: inset 0 0 0 1px currentColor !important; }
html:root:not(#_) body.fba-prep-requests-page .actions-cell { display: flex !important; align-items: center !important; gap: 8px !important; }
html:root:not(#_) body.fba-prep-requests-page .btn-icon {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 36px !important; height: 36px !important; padding: 0 !important;
  border: 0 !important; border-radius: 50% !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; box-shadow: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .btn-create-wo {
  display: inline-flex !important; align-items: center !important; gap: 6px !important; min-height: 36px !important; padding: 0 14px !important; border: 0 !important;
  border-radius: 999px !important; background: var(--tx-primary) !important; background-image: none !important; color: var(--tx-on-primary) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; box-shadow: none !important;
}
html:root:not(#_) body.fba-prep-requests-page :is(.btn-icon, .btn-create-wo) svg { fill: currentColor !important; }
html:root:not(#_) body.fba-prep-requests-page .table-container { padding: 0 !important; overflow-x: auto !important; }
html:root:not(#_) body.fba-prep-requests-page .data-table { border-collapse: collapse !important; background: var(--tx-card) !important; }
html:root:not(#_) body.fba-prep-requests-page .data-table th {
  height: var(--tx-table-head-h); border-color: var(--tx-line) !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.fba-prep-requests-page .data-table td { border-color: var(--tx-line) !important; border-bottom: 1px solid var(--tx-line) !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.fba-prep-requests-page .data-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.fba-prep-requests-page .data-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.fba-prep-requests-page .data-table tbody tr:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.fba-prep-requests-page .request-id { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.request-name, .client-name, .item-name, .history-status-change, .fba-prep-modal-content :is(h2, h3, .info-item span)) { color: var(--tx-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .client-name { font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.fba-prep-requests-page .qty-value { color: var(--tx-numbers) !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.status-badge, .wo-created-badge) {
  display: inline-flex !important; align-items: center !important; gap: 6px; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; white-space: nowrap !important; box-shadow: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .status-badge.status-pending { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.fba-prep-requests-page .status-badge.status-in-progress { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.status-badge.status-completed, .wo-created-badge) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .status-badge.status-cancelled { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .wo-created-badge svg { fill: currentColor !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.empty-state, .error-state) { padding: var(--tx-card-pad) !important; text-align: center !important; }
html:root:not(#_) body.fba-prep-requests-page :is(.empty-state, .error-state) h3 { color: var(--tx-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content { overflow: hidden !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content :is(.modal-header, .modal-footer) { border-color: var(--tx-line) !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .modal-close-btn { border: 0 !important; background: transparent !important; color: var(--tx-text) !important; box-shadow: none !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .modal-close-btn:hover { color: var(--tx-primary) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content :is(.info-item, .fba-prep-item, .history-entry) {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .fba-prep-item:hover { border-color: var(--tx-primary) !important; background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-entry { --fpr-hist-bg: var(--tx-primary); --fpr-hist-text: var(--tx-on-primary); border-left: 4px solid var(--fpr-hist-bg) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-entry:has(.history-status-change > .status-badge:last-child.status-pending) { --fpr-hist-bg: var(--tx-apricot); --fpr-hist-text: var(--tx-on-apricot); }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-entry:has(.history-status-change > .status-badge:last-child.status-in-progress) { --fpr-hist-bg: var(--tx-pending-bg); --fpr-hist-text: var(--tx-pending-text); }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-entry:has(.history-status-change > .status-badge:last-child.status-completed) { --fpr-hist-bg: var(--tx-good-bg); --fpr-hist-text: var(--tx-good-text); }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-entry:has(.history-status-change > .status-badge:last-child.status-cancelled) { --fpr-hist-bg: var(--tx-problem-bg); --fpr-hist-text: var(--tx-problem-text); }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-icon { background: var(--fpr-hist-bg) !important; background-image: none !important; color: var(--fpr-hist-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-arrow { color: var(--tx-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .fba-prep-modal-content .history-icon svg { fill: currentColor !important; }
html:root:not(#_) body.fba-prep-requests-page .toast { border: 0 !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important; }
html:root:not(#_) body.fba-prep-requests-page .toast.toast-success { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.fba-prep-requests-page .toast.toast-info { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.fba-prep-requests-page .toast.toast-error { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
@media (max-width: 1180px) {
  html:root:not(#_) body.fba-prep-requests-page .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 480px) {
  html:root:not(#_) body.fba-prep-requests-page .stats-grid { grid-template-columns: 1fr !important; }
  html:root:not(#_) body.fba-prep-requests-page .filter-group { flex: 1 1 100% !important; }
  html:root:not(#_) body.fba-prep-requests-page .filter-select { flex: 1 1 auto !important; }
}

/* Client command center: legacy green / teal gradients resolve to master tokens; metrics use the same solid brand fills as outbound
   (Inbound = deep teal, Fulfillment = mid teal, Prep = apricot, Inventory = mint). Display rules skip [hidden] state sections. */
html:root:not(#_) body.client-command-center-shell { background: var(--tx-canvas) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-main { padding: var(--tx-page-pad) !important; background: transparent !important; }
html:root:not(#_) body.client-command-center-shell .ccc-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; max-width: none !important; margin: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-shell:not([hidden]) { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-shell > * { margin: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-shell * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-state, .ccc-panel, .ccc-processing-overlay) {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-state { padding: var(--tx-card-pad) !important; text-align: center !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-state h1, .ccc-panel h2) { margin: 0 !important; color: var(--tx-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-state a {
  display: inline-flex !important; align-items: center !important; min-height: var(--tx-btn-h) !important; margin-top: 12px !important; padding: 0 22px !important; border: 0 !important;
  border-radius: 999px !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; font-weight: var(--tx-weight-bold) !important; text-decoration: none !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-state p, .ccc-hero p, .ccc-panel-header p, .ccc-contact-row span, .ccc-copy-status, .ccc-empty-copy, .ccc-alert small, .ccc-alert p,
  .ccc-chart-day, .ccc-legend, .ccc-processing p, #ccc-generated-at) { color: var(--tx-text) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-hero {
  display: flex !important; flex-wrap: wrap !important; align-items: flex-end !important; justify-content: space-between !important; gap: var(--tx-gap) !important;
  padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-hero > div:first-child { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-kicker, .ccc-label) {
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; opacity: 1 !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-hero h1 {
  display: flex !important; align-items: center; gap: 12px; margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-page-title) !important;
  font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-hero h1::before { content: ""; flex: 0 0 10px; width: 10px; height: 38px; border-radius: 5px; background: var(--tx-primary); }
html:root:not(#_) body.client-command-center-shell .ccc-hero p { margin: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-client-meta { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
html:root:not(#_) body.client-command-center-shell .ccc-chip {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-live-note, .ccc-note:not([hidden])) {
  padding: 10px 14px !important; border: 1.5px solid var(--tx-line) !important; border-left: 4px solid var(--tx-apricot) !important; border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-row-alt) !important; color: var(--tx-text) !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-toolbar { display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 10px !important; min-width: 0 !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-quick-controls, .ccc-date-controls) { display: flex !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 8px !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-button, .ccc-date-controls input, .ccc-contact-summary) {
  min-height: var(--tx-btn-h) !important; border: 2px solid var(--tx-input-border) !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-button, .ccc-date-controls input) { border-radius: 999px !important; padding: 0 18px !important; }
html:root:not(#_) body.client-command-center-shell .ccc-button { display: inline-flex !important; align-items: center !important; justify-content: center !important; font-weight: var(--tx-weight-bold) !important; cursor: pointer; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-button.is-active, .ccc-button--dark) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-button:hover:not(:disabled) { filter: brightness(1.08); }
html:root:not(#_) body.client-command-center-shell .ccc-button:disabled { opacity: .5; cursor: not-allowed; }
html:root:not(#_) body.client-command-center-shell .ccc-date-controls input { color-scheme: light dark; }
html:root:not(#_) body.client-command-center-shell :focus-visible { outline: 2px solid var(--tx-focus) !important; outline-offset: 2px; box-shadow: none !important; }
html:root:not(#_) body.client-command-center-shell .ccc-metrics { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric {
  --ccc-kpi-fill: var(--tx-brand-teal); --ccc-kpi-text: var(--tx-on-primary); --ccc-kpi-number: var(--tx-on-primary);
  display: flex !important; flex-direction: column !important; gap: 8px !important; min-width: 0 !important; min-height: 150px !important; padding: var(--tx-card-pad) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important; background: var(--ccc-kpi-fill) !important; background-image: none !important;
  color: var(--ccc-kpi-text) !important; box-shadow: none !important; transform: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric:nth-child(1) { --ccc-kpi-number: var(--tx-brand-apricot); }
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric:nth-child(2) { --ccc-kpi-fill: var(--tx-brand-teal-mid); }
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric:nth-child(3) { --ccc-kpi-fill: var(--tx-brand-apricot); --ccc-kpi-text: var(--tx-brand-teal); --ccc-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric:nth-child(4) { --ccc-kpi-fill: var(--tx-brand-mint); --ccc-kpi-text: var(--tx-brand-teal); --ccc-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric .ccc-label {
  order: -1 !important; align-self: stretch !important; margin: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important;
  color: var(--ccc-kpi-text) !important; text-align: left !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric .ccc-metric-value {
  display: block !important; margin: auto 0 !important; align-self: stretch !important; text-align: center !important; white-space: nowrap !important; color: var(--ccc-kpi-number) !important;
  font-family: var(--tx-font) !important; font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.05 !important; letter-spacing: -0.02em !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-metrics .ccc-metric small { align-self: stretch !important; color: var(--ccc-kpi-text) !important; text-align: center !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-content-grid { display: grid !important; grid-template-columns: minmax(0, 1.45fr) minmax(320px, .8fr) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-panel { display: flex !important; flex-direction: column !important; gap: 14px !important; min-width: 0 !important; padding: var(--tx-card-pad) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-panel--full { grid-column: 1 / -1 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-panel-header { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px !important; margin: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-panel-header > div { display: flex; flex-direction: column; gap: 4px; }
html:root:not(#_) body.client-command-center-shell .ccc-panel-header p { margin: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-chart { border-bottom: 1.5px solid var(--tx-line) !important; background: transparent !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-bar-shipments, .ccc-legend .shipments) { background: var(--tx-primary) !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-bar-orders, .ccc-legend .orders) { background: var(--tx-apricot) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-legend { display: flex !important; gap: 16px !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-alert-list { display: flex !important; flex-direction: column !important; gap: 10px !important; }
html:root:not(#_) body.client-command-center-shell .ccc-alert {
  --ccc-alert-accent: var(--tx-problem-text); border: 1.5px solid var(--tx-line) !important; border-left: 4px solid var(--ccc-alert-accent) !important;
  border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-alert-inventory { --ccc-alert-accent: var(--tx-apricot); }
html:root:not(#_) body.client-command-center-shell .ccc-alert summary { color: var(--tx-text) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-alert summary strong { color: var(--tx-text) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-alert[open] { background: color-mix(in srgb, var(--ccc-alert-accent) 12%, var(--tx-card)) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact { display: flex !important; flex-direction: column !important; gap: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact-row { border-color: var(--tx-line) !important; border-bottom: 1px solid var(--tx-line) !important; background: transparent !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact-row:last-child { border-bottom: 0 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact-row strong { color: var(--tx-text) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact-summary-label { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact-summary { width: 100% !important; padding: 12px 14px !important; border-radius: var(--tx-radius-tile) !important; line-height: 1.45 !important; }
html:root:not(#_) body.client-command-center-shell .ccc-contact-summary:focus { border-color: var(--tx-primary) !important; box-shadow: none !important; }
html:root:not(#_) body.client-command-center-shell #ccc-copy-contact-summary { align-self: flex-start !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table-wrap { overflow-x: auto !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table { width: 100% !important; border-collapse: collapse !important; background: var(--tx-card) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table th {
  height: var(--tx-table-head-h); border-color: var(--tx-line) !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-table td { border-color: var(--tx-line) !important; border-bottom: 1px solid var(--tx-line) !important; background: transparent !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table tbody tr:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table td:first-child { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-table td.ccc-empty-row { padding: var(--tx-card-pad) !important; color: var(--tx-text) !important; font-weight: normal !important; text-align: center !important; }
html:root:not(#_) body.client-command-center-shell .ccc-status {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; box-shadow: none !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-status-completed, .ccc-status-complete, .ccc-status-shipped, .ccc-status-delivered, .ccc-status-received, .ccc-status-fulfilled, .ccc-status-closed, .ccc-status-done, .ccc-status-available, .ccc-status-active) {
  background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-status-pending, .ccc-status-new, .ccc-status-open, .ccc-status-awaiting, .ccc-status-scheduled, .ccc-status-draft) {
  background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-status-in-progress, .ccc-status-processing, .ccc-status-picking, .ccc-status-packed, .ccc-status-packing, .ccc-status-allocated, .ccc-status-receiving, .ccc-status-in-transit, .ccc-status-partially-received, .ccc-status-ready) {
  background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important;
}
html:root:not(#_) body.client-command-center-shell :is(.ccc-status-exception, .ccc-status-cancelled, .ccc-status-canceled, .ccc-status-delayed, .ccc-status-late, .ccc-status-overdue, .ccc-status-on-hold, .ccc-status-hold, .ccc-status-failed, .ccc-status-error, .ccc-status-rejected, .ccc-status-damaged) {
  background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important;
}
html:root:not(#_) body.client-command-center-shell .ccc-processing-ring { background: conic-gradient(var(--tx-primary) var(--ccc-progress), var(--tx-line) 0) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-processing-ring::before { background: var(--tx-card) !important; }
html:root:not(#_) body.client-command-center-shell :is(.ccc-processing-ring strong, .ccc-processing > strong, .ccc-processing--compact strong) { color: var(--tx-text) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-processing-track { background: var(--tx-line) !important; }
html:root:not(#_) body.client-command-center-shell .ccc-processing-track i { background: var(--tx-primary) !important; background-image: none !important; }
html:root:not(#_) body.client-command-center-shell .ccc-processing-overlay { border: 2px solid var(--tx-primary) !important; }
@media (max-width: 1180px) {
  html:root:not(#_) body.client-command-center-shell .ccc-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.client-command-center-shell .ccc-content-grid { grid-template-columns: 1fr !important; }
  html:root:not(#_) body.client-command-center-shell .ccc-toolbar { align-items: flex-start !important; }
  html:root:not(#_) body.client-command-center-shell :is(.ccc-quick-controls, .ccc-date-controls) { justify-content: flex-start !important; }
}
@media (max-width: 480px) {
  html:root:not(#_) body.client-command-center-shell .ccc-metrics { grid-template-columns: 1fr !important; }
}

/* Order queue: deep-teal hero like Settings and Labor; filter panel card with pill controls; the order list is a table band
   with zebra rows. Status pills use semantic tones; billing pills rendered with inline styles are matched by their inline token. */
html:root:not(#_) body.order-queue-shell { background: var(--tx-canvas) !important; background-image: none !important; color: var(--tx-text) !important; }
html:root:not(#_) body.order-queue-shell .tx-main * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.order-queue-shell .tx-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.order-queue-shell .tx-container > * { margin: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-page-head {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important;
  padding: clamp(20px, 3vw, 32px) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-brand-teal) !important; background-image: none !important; color: var(--tx-on-primary) !important; box-shadow: none !important;
}
html:root:not(#_) body.order-queue-shell .order-queue-copy { flex: 1 1 420px !important; min-width: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-title {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 0 12px !important; color: var(--tx-on-primary) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-page-title) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.order-queue-shell .order-queue-title::before {
  content: "" !important; flex: 0 0 auto !important; width: 6px !important; height: .9em !important; border-radius: 3px !important; background: var(--tx-brand-apricot) !important;
}
html:root:not(#_) body.order-queue-shell .order-queue-subtitle { max-width: 76ch !important; margin: 0 0 8px !important; color: var(--tx-brand-mint) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.5 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-description { max-width: 76ch !important; margin: 0 !important; color: var(--tx-on-primary) !important; line-height: 1.6 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-description strong { color: var(--tx-brand-apricot) !important; }
html:root:not(#_) body.order-queue-shell .order-queue-panel {
  display: flex !important; flex-direction: column !important; gap: 16px !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important;
}
html:root:not(#_) body.order-queue-shell .oq-controls-head { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 12px 16px !important; margin: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-panel-title {
  flex: 1 1 320px !important; margin: 0 !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important;
  font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.4 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.order-queue-shell .order-queue-filter-grid { gap: 16px !important; margin: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-field { gap: 6px !important; }
html:root:not(#_) body.order-queue-shell .order-queue-field-label {
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.order-queue-shell .order-queue-panel :is(#oq-search, #oq-status-filter, #oq-supply-billing-filter) {
  min-height: var(--tx-btn-h) !important; padding: 0 18px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background-color: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; box-shadow: none !important;
}
html:root:not(#_) body.order-queue-shell .order-queue-panel :is(#oq-search, #oq-status-filter, #oq-supply-billing-filter):focus { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.order-queue-shell .order-queue-supply-billing-row { gap: 10px !important; }
html:root:not(#_) body.order-queue-shell .oq-refresh-btn {
  flex: 0 0 auto !important; width: var(--tx-btn-h) !important; height: var(--tx-btn-h) !important; min-height: 0 !important; padding: 0 !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 50% !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.order-queue-shell .oq-refresh-btn:hover:not(:disabled) { border-color: var(--tx-primary) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-create-manual-btn, .oq-action-link, .oq-pick-btn) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; padding: 0 20px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  text-decoration: none !important; white-space: nowrap !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.order-queue-shell .oq-create-manual-btn { min-height: var(--tx-btn-h) !important; padding: 0 22px !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-action-link, .oq-pick-btn) { min-height: 36px !important; padding: 0 16px !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-create-manual-btn, .oq-action-link.primary) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-create-manual-btn, .oq-action-link, .oq-pick-btn):hover { filter: brightness(1.08); }
html:root:not(#_) body.order-queue-shell .order-queue-toolbar-meta { margin: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-count { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.order-queue-shell .oq-status-msg.success { color: var(--tx-good-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-status-msg.error { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.order-queue-shell .order-queue-table-wrap {
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: none !important;
}
html:root:not(#_) body.order-queue-shell .oq-table { border-collapse: collapse !important; background: transparent !important; }
html:root:not(#_) body.order-queue-shell .oq-table thead th {
  height: var(--tx-table-head-h) !important; border: 0 !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.order-queue-shell .oq-table thead .oq-sort-button { background: transparent !important; color: inherit !important; font: inherit !important; letter-spacing: inherit !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.order-queue-shell .oq-table td { border-color: var(--tx-line) !important; background: transparent !important; color: var(--tx-text) !important; font-weight: 500 !important; }
html:root:not(#_) body.order-queue-shell .oq-table .oq-id { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.order-queue-shell .oq-sla-late { color: var(--tx-problem-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.order-queue-shell .oq-sla-warn { color: var(--tx-pending-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.order-queue-shell .oq-sla-ok { color: var(--tx-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-pill {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: capitalize !important; white-space: nowrap !important;
}
html:root:not(#_) body.order-queue-shell :is(.oq-pill-picking, .oq-pill-packed) { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-pill-shipped, .oq-pill-delivered, .oq-pill[style*="success"]) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-pill-on_hold { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-pill-exception, .oq-pill-cancelled, .oq-pill[style*="error"]) { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-pill-returned, .oq-pill[style*="rgba(255,255,255"]) { background: var(--tx-row-alt) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.order-queue-shell :is(.order-queue-loading, .oq-empty) {
  padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.order-queue-shell :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; box-shadow: none !important; }
@media (max-width: 700px) {
  html:root:not(#_) body.order-queue-shell .oq-create-manual-btn { width: 100% !important; }
}

/* Order queue layout: compact hero with the worker sign-in beside the title, an at-a-glance strip of quick filters, and
   order rows that fit the content width. Each row is a six-column grid (order | customer | items | ship-by | status | action)
   that folds into two lines, then a stacked card, as the queue narrows, so the page never scrolls sideways. */
html:root:not(#_) body.order-queue-shell .order-queue-description { display: none !important; }
html:root:not(#_) body.order-queue-shell .order-queue-subtitle { margin: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-title { margin: 0 0 8px !important; }
html:root:not(#_) body.order-queue-shell .order-queue-page-head { align-items: center !important; padding: 22px 26px !important; }
html:root:not(#_) body.order-queue-shell .order-queue-copy { flex: 1 1 360px !important; }
html:root:not(#_) body.order-queue-shell .station-worker-session-mount { flex: 1 1 420px !important; max-width: 560px !important; min-width: 0 !important; margin: 0 !important; }

html:root:not(#_) body.order-queue-shell .oq-summary { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 12px !important; }
@media (max-width: 1240px) { html:root:not(#_) body.order-queue-shell .oq-summary { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 560px) { html:root:not(#_) body.order-queue-shell .oq-summary { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
html:root:not(#_) body.order-queue-shell .oq-summary:empty { display: none !important; }
html:root:not(#_) body.order-queue-shell .oq-sum {
  --oq-sum-accent: var(--tx-apricot);
  position: relative !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 2px !important; min-width: 0 !important;
  padding: 14px 16px 14px 20px !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-row) !important; overflow: hidden !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; text-align: left !important; cursor: pointer !important;
  box-shadow: none !important; transition: border-color .15s ease, background-color .15s ease !important;
}
html:root:not(#_) body.order-queue-shell .oq-sum::before { content: "" !important; position: absolute !important; inset: 0 auto 0 0 !important; width: 5px !important; background: var(--oq-sum-accent) !important; }
html:root:not(#_) body.order-queue-shell .oq-sum--overdue { --oq-sum-accent: var(--tx-problem-text); }
html:root:not(#_) body.order-queue-shell .oq-sum--exception { --oq-sum-accent: var(--tx-problem-text); }
html:root:not(#_) body.order-queue-shell :is(.oq-sum--pick, .oq-sum--pack) { --oq-sum-accent: var(--tx-mid); }
html:root:not(#_) body.order-queue-shell .oq-sum--ship { --oq-sum-accent: var(--tx-good-text); }
html:root:not(#_) body.order-queue-shell .oq-sum-value { font-size: 34px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; color: var(--tx-numbers) !important; font-variant-numeric: tabular-nums !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-sum--overdue, .oq-sum--exception):not(.is-zero) .oq-sum-value { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-sum-label { font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.3 !important; }
html:root:not(#_) body.order-queue-shell .oq-sum.is-zero .oq-sum-value { opacity: .45 !important; }
html:root:not(#_) body.order-queue-shell .oq-sum:hover { border-color: var(--oq-sum-accent) !important; }
html:root:not(#_) body.order-queue-shell .oq-sum.is-active { border-color: var(--tx-primary) !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.order-queue-shell .oq-sum.is-active .oq-sum-value { color: var(--tx-on-primary) !important; opacity: 1 !important; }

html:root:not(#_) body.order-queue-shell .order-queue-filter-grid { display: grid !important; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1.2fr) !important; }
html:root:not(#_) body.order-queue-shell .order-queue-supply-billing-row { display: flex !important; min-width: 0 !important; }
html:root:not(#_) body.order-queue-shell .order-queue-supply-billing-row select { flex: 1 1 auto !important; min-width: 0 !important; width: auto !important; }
@media (max-width: 1100px) {
  html:root:not(#_) body.order-queue-shell .order-queue-filter-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
  html:root:not(#_) body.order-queue-shell .order-queue-filter-grid > :first-child { grid-column: 1 / -1 !important; }
}
@media (max-width: 640px) {
  html:root:not(#_) body.order-queue-shell .order-queue-filter-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

html:root:not(#_) body.order-queue-shell .order-queue-table-wrap { container: oq-list / inline-size !important; overflow: visible !important; border: 0 !important; background: transparent !important; }
html:root:not(#_) body.order-queue-shell :is(.oq-table, .oq-table thead, .oq-table tbody) { display: block !important; width: 100% !important; min-width: 0 !important; }
html:root:not(#_) body.order-queue-shell .oq-table tr {
  --oq-cols: minmax(0, 1.35fr) minmax(0, 1.2fr) minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1.05fr) 180px;
  display: grid !important; grid-template-columns: var(--oq-cols) !important; grid-auto-rows: auto !important; align-items: center !important;
  column-gap: 16px !important; min-width: 0 !important; height: auto !important;
}
html:root:not(#_) body.order-queue-shell .oq-table th { height: auto !important; }
html:root:not(#_) body.order-queue-shell .oq-table thead tr {
  min-height: var(--tx-table-head-h) !important; padding: 8px 20px 8px 24px !important; border-radius: var(--tx-radius-row) !important;
  background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
}
html:root:not(#_) body.order-queue-shell .oq-table thead th {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 4px 14px !important; height: auto !important; min-width: 0 !important;
  padding: 6px 0 !important; border: 0 !important; background: transparent !important; color: inherit !important; text-transform: none !important; letter-spacing: normal !important;
}
html:root:not(#_) body.order-queue-shell .oq-table thead .oq-sort-button {
  display: inline-flex !important; align-items: center !important; gap: 4px !important; padding: 0 !important; border: 0 !important;
  color: inherit !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; text-transform: none !important; letter-spacing: normal !important; white-space: nowrap !important;
}
html:root:not(#_) body.order-queue-shell .oq-table thead .oq-sort-button::after { content: "↕" !important; color: inherit !important; opacity: .55 !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.order-queue-shell .oq-sort[aria-sort="ascending"] .oq-sort-button::after { content: "↑" !important; opacity: 1 !important; color: var(--tx-brand-apricot) !important; }
html:root:not(#_) body.order-queue-shell .oq-sort[aria-sort="descending"] .oq-sort-button::after { content: "↓" !important; opacity: 1 !important; color: var(--tx-brand-apricot) !important; }
html:root:not(#_) body.order-queue-shell .oq-sort:is([aria-sort="ascending"], [aria-sort="descending"]) .oq-sort-button { color: var(--tx-brand-apricot) !important; }
html:root:not(#_) body.order-queue-shell .oq-th-text { font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.order-queue-shell .oq-table thead .oq-cell-action { justify-content: flex-end !important; }

html:root:not(#_) body.order-queue-shell .oq-table tbody { display: flex !important; flex-direction: column !important; gap: 10px !important; margin-top: 10px !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr {
  position: relative !important; row-gap: 12px !important; padding: 16px 20px 16px 24px !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-row) !important;
  background: var(--tx-card) !important; cursor: pointer !important; overflow: hidden !important; transition: border-color .15s ease, background-color .15s ease !important;
}
html:root:not(#_) body.order-queue-shell .oq-table tbody tr:nth-child(even) { background: var(--tx-card) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr::before { content: "" !important; position: absolute !important; inset: 0 auto 0 0 !important; width: 5px !important; background: var(--tx-sage) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr.oq-row--late::before { background: var(--tx-problem-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr.oq-row--soon::before { background: var(--tx-apricot) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody tr:hover { border-color: var(--tx-apricot) !important; background: color-mix(in srgb, var(--tx-apricot) 10%, var(--tx-card)) !important; }
html:root:not(#_) body.order-queue-shell .oq-table tbody td {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: center !important; gap: 4px !important;
  min-width: 0 !important; height: auto !important; min-height: 0 !important; padding: 0 !important; border: 0 !important;
  font-size: var(--tx-size-min) !important; line-height: 1.35 !important; white-space: normal !important; text-align: left !important;
}
html:root:not(#_) body.order-queue-shell .oq-table .oq-id {
  max-width: 100% !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  color: var(--tx-numbers) !important; overflow-wrap: anywhere !important; line-height: 1.3 !important;
}
html:root:not(#_) body.order-queue-shell .oq-table .oq-main { max-width: 100% !important; font-weight: var(--tx-weight-bold) !important; overflow-wrap: anywhere !important; }
html:root:not(#_) body.order-queue-shell .oq-table .oq-sub {
  display: inline-flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 6px !important; max-width: 100% !important;
  color: var(--tx-text) !important; opacity: .78 !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-body) !important; overflow-wrap: anywhere !important;
}
html:root:not(#_) body.order-queue-shell .oq-table .oq-channel {
  padding: 0 10px !important; border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
  font-weight: var(--tx-weight-bold) !important; text-transform: capitalize !important;
}
html:root:not(#_) body.order-queue-shell .oq-table .oq-due { padding: 2px 10px !important; border-radius: 999px !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; }
html:root:not(#_) body.order-queue-shell .oq-table .oq-due--late { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-table .oq-due--soon { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.order-queue-shell .oq-table .oq-billing { display: inline-flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 6px !important; }
html:root:not(#_) body.order-queue-shell .oq-table .oq-cell-action { align-items: stretch !important; }
html:root:not(#_) body.order-queue-shell .oq-action-cell { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px !important; width: 100% !important; }
html:root:not(#_) body.order-queue-shell .oq-action-cell .oq-sub { align-self: flex-end !important; }
html:root:not(#_) body.order-queue-shell .oq-action-cell :is(.oq-action-link, .oq-pick-btn) { width: 100% !important; min-width: 0 !important; max-width: none !important; min-height: var(--tx-btn-h) !important; overflow: visible !important; }
html:root:not(#_) body.order-queue-shell .oq-pick-btn:not(.oq-pick-btn-view) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }

@container oq-list (max-width: 1000px) {
  html:root:not(#_) body.order-queue-shell .oq-table tbody tr {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-areas: "order customer status" "items ship action" !important;
  }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-order { grid-area: order !important; }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-customer { grid-area: customer !important; }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-items { grid-area: items !important; }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-ship { grid-area: ship !important; }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-status { grid-area: status !important; }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-action { grid-area: action !important; }
  html:root:not(#_) body.order-queue-shell .oq-table thead tr { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 4px 18px !important; }
  html:root:not(#_) body.order-queue-shell .oq-table thead th { display: contents !important; }
  html:root:not(#_) body.order-queue-shell .oq-table thead tr::before { content: "Sort by" !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; opacity: .8 !important; }
  html:root:not(#_) body.order-queue-shell .oq-table thead .oq-th-text { display: none !important; }
}
@container oq-list (max-width: 560px) {
  html:root:not(#_) body.order-queue-shell .oq-table tbody tr {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    grid-template-areas: "order order" "customer status" "items ship" "action action" !important;
    padding: 14px 16px 14px 20px !important;
  }
  html:root:not(#_) body.order-queue-shell .oq-table tbody .oq-cell-status { align-items: flex-end !important; }
  html:root:not(#_) body.order-queue-shell .oq-action-cell { flex-direction: row !important; flex-wrap: wrap !important; }
  html:root:not(#_) body.order-queue-shell .oq-action-cell :is(.oq-action-link, .oq-pick-btn) { flex: 1 1 140px !important; width: auto !important; }
}

/* Prep work orders: restores the breadcrumb and deep-teal hero hidden by the dense page stylesheet; KPI row, filter card and
   one work-order card per row (header | body | footer) using master tokens. Empty/loading states keep their inline display. */
html:root:not(#_) body.prep-work-orders-page { background: var(--tx-canvas) !important; background-image: none !important; color: var(--tx-text) !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-main * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; max-width: none !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-container > * { margin: 0 !important; }
html:root:not(#_) body.prep-work-orders-page .breadcrumb { display: flex !important; }
html:root:not(#_) body.prep-work-orders-page :is(.breadcrumb-item, .breadcrumb-item a, .breadcrumb-item.active, .breadcrumb-separator) { color: var(--tx-text) !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-hero {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important;
  padding: clamp(20px, 3vw, 32px) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-brand-teal) !important; background-image: none !important; color: var(--tx-on-primary) !important; box-shadow: none !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-hero-copy { flex: 1 1 420px !important; min-width: 0 !important; padding: 0 !important; background: transparent !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .dashboard-kicker {
  display: inline-flex !important; color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; letter-spacing: .04em !important; text-transform: uppercase !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .warehouse-name {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 8px 0 12px !important; color: var(--tx-on-primary) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-page-title) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .warehouse-name::before {
  content: "" !important; flex: 0 0 auto !important; width: 6px !important; height: .9em !important; border-radius: 3px !important; background: var(--tx-brand-apricot) !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .hero-greeting {
  display: block !important; max-width: 76ch !important; margin: 0 0 8px !important; color: var(--tx-brand-mint) !important;
  font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.5 !important; letter-spacing: normal !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .hero-greeting::before { display: none !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .dashboard-hero-description { max-width: 76ch !important; margin: 0 !important; color: var(--tx-on-primary) !important; line-height: 1.6 !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-hero-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .activity-panel-link {
  display: inline-flex !important; align-items: center !important; min-height: var(--tx-btn-h) !important; padding: 0 20px !important;
  border: 2px solid var(--tx-brand-mint) !important; border-radius: 999px !important; background: transparent !important; color: var(--tx-on-primary) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; text-decoration: none !important; box-shadow: none !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-hero .activity-panel-link:hover { background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.prep-work-orders-page .overview-band { padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; grid-auto-flow: row !important; gap: var(--tx-gap) !important; overflow: visible !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid .kpi-card {
  width: auto !important; min-height: 0 !important; align-items: flex-start !important; gap: 8px !important; text-align: left !important; padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important;
}
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid .kpi-card-highlight { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.prep-work-orders-page .kpi-card-header { order: 0 !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid .kpi-card-label { color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid .kpi-card-value { order: 0 !important; align-self: flex-start !important; margin: 0 !important; color: var(--tx-numbers) !important; font-family: var(--tx-font) !important; font-size: 32px !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid .kpi-card-highlight .kpi-card-value { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid .kpi-card-meta { display: block !important; color: inherit !important; text-align: left !important; font-weight: 500 !important; line-height: 1.45 !important; }
html:root:not(#_) body.prep-work-orders-page .filters-bar {
  grid-template-columns: repeat(3, minmax(150px, 200px)) minmax(240px, 1fr) auto !important; gap: 16px !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: none !important;
}
html:root:not(#_) body.prep-work-orders-page .filters-bar { align-items: end !important; }
html:root:not(#_) body.prep-work-orders-page :is(.filter-group, .search-group) { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 6px !important; text-align: left !important; }
html:root:not(#_) body.prep-work-orders-page .filter-group label {
  position: static !important; width: auto !important; height: auto !important; margin: 0 !important; overflow: visible !important; clip: auto !important;
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.prep-work-orders-page :is(.filter-select, .search-input) {
  width: 100% !important; min-height: var(--tx-btn-h) !important; padding: 0 18px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background-color: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; box-shadow: none !important;
}
html:root:not(#_) body.prep-work-orders-page :is(.filter-select, .search-input):focus { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.prep-work-orders-page .search-input::placeholder { color: var(--tx-text) !important; opacity: .7 !important; }
html:root:not(#_) body.prep-work-orders-page :is(.btn-secondary, .btn-view-details, .btn-action) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; min-height: var(--tx-btn-h) !important; padding: 0 20px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.prep-work-orders-page :is(.btn-secondary, .btn-view-details) :is(svg) { width: 18px !important; height: 18px !important; }
html:root:not(#_) body.prep-work-orders-page :is(.btn-secondary, .btn-view-details):hover { border-color: var(--tx-primary) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.prep-work-orders-page :is(.btn-action.btn-picking, .btn-action.btn-start) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.prep-work-orders-page .btn-action.btn-complete { border-color: transparent !important; background: var(--tx-good-text) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.prep-work-orders-page .btn-action:hover { filter: brightness(1.08); }
html:root:not(#_) body.prep-work-orders-page .work-orders-container { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-card {
  grid-template-columns: minmax(220px, .8fr) minmax(300px, 1.4fr) minmax(220px, .8fr) !important; border: 1px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.prep-work-orders-page .work-order-card:hover { border-color: var(--tx-numbers) !important; box-shadow: none !important; }
html:root:not(#_) body.prep-work-orders-page :is(.work-order-header, .work-order-body, .work-order-footer) { padding: var(--tx-card-pad) !important; background: transparent !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-header { display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 4px !important; text-align: left !important; border: 0 !important; border-right: 1px solid var(--tx-line) !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-title-section { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-created { align-self: flex-start !important; text-align: left !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-footer { display: flex !important; flex-direction: column !important; justify-content: space-between !important; gap: 16px !important; border: 0 !important; border-left: 1px solid var(--tx-line) !important; text-align: left !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-number { margin: 0 !important; color: var(--tx-numbers) !important; font-family: var(--tx-font) !important; font-size: 22px !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-client { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-badges { display: flex !important; flex-wrap: wrap !important; justify-content: flex-start !important; gap: 6px !important; margin-top: 10px !important; }
html:root:not(#_) body.prep-work-orders-page .badge {
  display: inline-flex !important; align-items: center !important; min-height: 0 !important; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; white-space: nowrap !important;
}
html:root:not(#_) body.prep-work-orders-page :is(.badge-pending, .badge-picking, .badge-priority-high) { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.prep-work-orders-page :is(.badge-completed) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.prep-work-orders-page :is(.badge-cancelled, .badge-priority-urgent) { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.prep-work-orders-page :is(.badge-priority-normal, .badge-priority-low) { background: var(--tx-row-alt) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-info-grid { gap: 12px !important; }
html:root:not(#_) body.prep-work-orders-page :is(.info-label, .progress-label, .tasks-preview-title) { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; opacity: .75; }
html:root:not(#_) body.prep-work-orders-page .info-value { color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-progress { margin: 16px 0 0 !important; }
html:root:not(#_) body.prep-work-orders-page .progress-percentage { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.prep-work-orders-page .progress-bar { height: 10px !important; border-radius: 999px !important; background: var(--tx-row-alt) !important; overflow: hidden !important; }
html:root:not(#_) body.prep-work-orders-page .progress-fill { border-radius: 999px !important; background: var(--tx-primary) !important; background-image: none !important; box-shadow: none !important; }
html:root:not(#_) body.prep-work-orders-page :is(.progress-details, .work-order-created, .task-sku, .task-preview-more) { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; }
html:root:not(#_) body.prep-work-orders-page .work-order-tasks-preview { margin-top: 16px !important; padding: 0 !important; border: 0 !important; }
html:root:not(#_) body.prep-work-orders-page .tasks-preview-title { margin: 0 0 8px !important; }
html:root:not(#_) body.prep-work-orders-page .tasks-preview-list { display: flex !important; flex-direction: column !important; gap: 6px !important; }
html:root:not(#_) body.prep-work-orders-page .task-preview-item {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto auto !important; align-items: center !important; gap: 10px !important; min-height: 0 !important; padding: 8px 12px !important;
  border: 0 !important; border-radius: var(--tx-radius-row) !important; background: var(--tx-row-alt) !important;
}
html:root:not(#_) body.prep-work-orders-page .task-prep-type { color: var(--tx-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.prep-work-orders-page .task-quantity { color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.prep-work-orders-page .work-order-actions { flex-wrap: wrap !important; justify-content: flex-start !important; gap: 10px !important; }
html:root:not(#_) body.prep-work-orders-page :is(.empty-state, .loading-state) {
  padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.prep-work-orders-page :is(.empty-state p, .loading-state p) { color: var(--tx-text) !important; }
html:root:not(#_) body.prep-work-orders-page :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; box-shadow: none !important; }
@media (max-width: 1200px) {
  html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.prep-work-orders-page .filters-bar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.prep-work-orders-page .search-group { grid-column: span 2 !important; }
  html:root:not(#_) body.prep-work-orders-page .work-order-card { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) !important; }
  html:root:not(#_) body.prep-work-orders-page .work-order-footer { grid-column: 1 / -1 !important; border-left: 0 !important; border-top: 1px solid var(--tx-line) !important; }
}
@media (max-width: 700px) {
  html:root:not(#_) body.prep-work-orders-page .dashboard-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.prep-work-orders-page .filters-bar { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.prep-work-orders-page .search-group { grid-column: auto !important; }
  html:root:not(#_) body.prep-work-orders-page .work-order-card { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.prep-work-orders-page .work-order-header { border-right: 0 !important; border-bottom: 1px solid var(--tx-line) !important; }
  html:root:not(#_) body.prep-work-orders-page .work-order-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.prep-work-orders-page :is(.dashboard-hero .activity-panel-link, .btn-secondary, .work-order-actions > *) { flex: 1 1 auto !important; }
}

/* Wave planning: deep-teal hero (copy | snapshot links) like Order Queue; stat row, controls card with pill fields and a
   table band with zebra rows. Decorative glow layers are removed; the draft selection and generate flow keep their markup. */
html:root:not(#_) body.wave-planning-shell { background: var(--tx-canvas) !important; background-image: none !important; color: var(--tx-text) !important; }
html:root:not(#_) body.wave-planning-shell .tx-main * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.wave-planning-shell .tx-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.wave-planning-shell .tx-container > * { margin: 0 !important; }
html:root:not(#_) body.wave-planning-shell :is(.breadcrumb-item, .breadcrumb-item a, .breadcrumb-separator) { color: var(--tx-text) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-hero {
  padding: clamp(20px, 3vw, 32px) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important; overflow: hidden !important;
  background: var(--tx-brand-teal) !important; background-image: none !important; color: var(--tx-on-primary) !important; box-shadow: none !important;
}
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-hero, .wave-planning-hero *, .wave-planning-panel, .wave-planning-stat-card, .wave-planning-table-shell)::before,
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-hero, .wave-planning-hero *, .wave-planning-panel, .wave-planning-stat-card, .wave-planning-table-shell)::after { display: none !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-hero .wave-planning-title::before { display: block !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-hero-grid { display: grid !important; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr) !important; align-items: start !important; gap: 24px !important; }
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-hero-main, .wave-planning-copy) {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; min-width: 0 !important;
  padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; text-align: left !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-copy { gap: 8px !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-live-strip {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 4px 12px !important; border: 1.5px solid var(--tx-brand-mint) !important;
  border-radius: 999px !important; background: transparent !important; color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-live-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: var(--tx-brand-apricot) !important; box-shadow: none !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-hero .dashboard-kicker { color: var(--tx-brand-mint) !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-shell-label { margin: 0 !important; color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; opacity: .85; }
html:root:not(#_) body.wave-planning-shell .wave-planning-title {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important; color: var(--tx-on-primary) !important; background: none !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-page-title) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-title::before {
  content: "" !important; flex: 0 0 auto !important; width: 6px !important; height: .9em !important; border-radius: 3px !important; background: var(--tx-brand-apricot) !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-subtitle { max-width: 76ch !important; margin: 0 !important; color: var(--tx-brand-mint) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.5 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-description { max-width: 76ch !important; margin: 0 !important; color: var(--tx-on-primary) !important; line-height: 1.6 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; margin: 4px 0 0 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-action-btn {
  display: inline-flex !important; align-items: center !important; min-height: var(--tx-btn-h) !important; padding: 0 20px !important;
  border: 2px solid var(--tx-brand-mint) !important; border-radius: 999px !important; background: transparent !important; background-image: none !important; color: var(--tx-on-primary) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; text-decoration: none !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-action-btn:hover { background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-footnote { display: flex !important; flex-direction: column !important; gap: 6px !important; margin: 0 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-footnote span {
  display: block !important; padding: 8px 14px !important; border: 0 !important; border-radius: var(--tx-radius-row) !important; background: var(--tx-side-tile-bg) !important;
  color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; letter-spacing: normal !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-panel {
  display: flex !important; flex-direction: column !important; gap: 10px !important; padding: 20px !important; border: 0 !important;
  border-radius: var(--tx-radius-card) !important; background: var(--tx-side-tile-bg) !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-panel :is(.wave-planning-panel-title, .wave-planning-panel-copy) { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-list { display: flex !important; flex-direction: column !important; gap: 8px !important; margin: 4px 0 0 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-item {
  display: flex !important; flex-direction: column !important; gap: 4px !important; padding: 12px 14px !important; border: 1.5px solid transparent !important;
  border-radius: var(--tx-radius-row) !important; background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important; text-decoration: none !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-item:hover { border-color: var(--tx-brand-mint) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-label { color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-snapshot-copy { color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.45 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-panel-title {
  margin: 0 !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-body) !important;
  font-weight: var(--tx-weight-bold) !important; line-height: 1.4 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-panel-copy { margin: 0 !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.5 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stats-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-card {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; min-height: 0 !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important; text-align: left !important; transform: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-card-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-label { color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-value { margin: 0 !important; color: var(--tx-numbers) !important; font-family: var(--tx-font) !important; font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-card-primary .wave-planning-stat-value { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-card-warning .wave-planning-stat-value { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-stat-copy { margin: 0 !important; color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.45 !important; text-align: left !important; }
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-panel, .wave-planning-table-shell) {
  display: flex !important; flex-direction: column !important; gap: 16px !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-table-shell:is([style*="display:none"], [style*="display: none"]) { display: none !important; }
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-controls-header, .wave-planning-table-header) { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px 24px !important; margin: 0 !important; }
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-controls-header, .wave-planning-table-header) > div { display: flex !important; flex-direction: column !important; gap: 4px !important; flex: 1 1 360px !important; min-width: 0 !important; }
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-panel, .wave-planning-table-shell) .dashboard-kicker { color: var(--tx-numbers) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-toolbar-copy { flex: 0 1 380px !important; margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.5 !important; opacity: .8; }
html:root:not(#_) body.wave-planning-shell .wave-planning-filter-grid { display: grid !important; grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(160px, 1fr)) !important; gap: 16px !important; margin: 0 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-field { display: flex !important; flex-direction: column !important; gap: 6px !important; margin: 0 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-field-label { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-field :is(input, select) {
  width: 100% !important; min-height: var(--tx-btn-h) !important; padding: 0 18px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background-color: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; box-shadow: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-field :is(input, select):focus { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-field input::placeholder { color: var(--tx-text) !important; opacity: .7 !important; }
html:root:not(#_) body.wave-planning-shell .wave-planning-toolbar-meta {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  margin: 0 !important; padding: 16px 0 0 !important; border: 0 !important; border-top: 1px solid var(--tx-line) !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-selection-note {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-toolbar-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
html:root:not(#_) body.wave-planning-shell .wp-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; min-height: var(--tx-btn-h) !important; padding: 0 22px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.wave-planning-shell .wp-btn-secondary:hover:not(:disabled) { border-color: var(--tx-primary) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.wave-planning-shell .wp-btn-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.wave-planning-shell .wp-btn-primary:hover:not(:disabled) { filter: brightness(1.08); }
html:root:not(#_) body.wave-planning-shell .wp-btn:disabled { opacity: .5 !important; cursor: not-allowed !important; filter: none !important; }
html:root:not(#_) body.wave-planning-shell .wp-status-msg.success { color: var(--tx-good-text) !important; }
html:root:not(#_) body.wave-planning-shell .wp-status-msg.error { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.wave-planning-shell .wp-summary.active {
  padding: 14px 20px !important; border: 1.5px solid color-mix(in srgb, var(--tx-good-text) 40%, transparent) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-good-bg) !important; background-image: none !important; color: var(--tx-good-text) !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important;
}
html:root:not(#_) body.wave-planning-shell .wave-planning-table-wrap { border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: none !important; overflow-x: auto !important; }
html:root:not(#_) body.wave-planning-shell .wp-table { width: 100% !important; border-collapse: collapse !important; background: transparent !important; }
html:root:not(#_) body.wave-planning-shell .wp-table thead th {
  height: var(--tx-table-head-h) !important; border: 0 !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.wave-planning-shell .wp-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.wave-planning-shell .wp-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.wave-planning-shell .wp-table tbody tr:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.wave-planning-shell .wp-table td { border-color: var(--tx-line) !important; background: transparent !important; color: var(--tx-text) !important; font-weight: 500 !important; }
html:root:not(#_) body.wave-planning-shell .wp-table td span[style*="94a3b8"] { color: var(--tx-text) !important; opacity: .7; }
html:root:not(#_) body.wave-planning-shell .wp-checkbox { width: 18px !important; height: 18px !important; accent-color: var(--tx-primary) !important; }
html:root:not(#_) body.wave-planning-shell .wp-id { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.wave-planning-shell .wp-sla-late { color: var(--tx-problem-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.wave-planning-shell .wp-sla-warn { color: var(--tx-pending-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.wave-planning-shell .wp-sla-ok { color: var(--tx-text) !important; }
html:root:not(#_) body.wave-planning-shell .wp-status-pill {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: capitalize !important; white-space: nowrap !important;
}
html:root:not(#_) body.wave-planning-shell :is(.wave-planning-loading, .wp-empty) {
  padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.wave-planning-shell :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; box-shadow: none !important; }
@media (max-width: 1100px) {
  html:root:not(#_) body.wave-planning-shell .wave-planning-hero-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.wave-planning-shell .wave-planning-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.wave-planning-shell .wave-planning-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 700px) {
  html:root:not(#_) body.wave-planning-shell .wave-planning-filter-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.wave-planning-shell :is(.wave-planning-action-btn, .wave-planning-toolbar-actions, .wp-btn) { flex: 1 1 auto !important; }
}

/* Carrier accounts: same pattern as Wave planning. Deep-teal hero (copy | snapshot links), stat row, list and registration
   cards with pill fields, table band with zebra rows. The list/form view toggle and credential flow keep their markup. */
html:root:not(#_) body.car-shell { background: var(--tx-canvas) !important; background-image: none !important; color: var(--tx-text) !important; }
html:root:not(#_) body.car-shell .tx-main * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.car-shell .tx-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.car-shell .tx-container > * { margin: 0 !important; }
html:root:not(#_) body.car-shell :is(.breadcrumb-item, .breadcrumb-item a, .breadcrumb-separator) { color: var(--tx-text) !important; }
html:root:not(#_) body.car-shell .car-hero {
  padding: clamp(20px, 3vw, 32px) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important; overflow: hidden !important;
  background: var(--tx-brand-teal) !important; background-image: none !important; color: var(--tx-on-primary) !important; box-shadow: none !important;
}
html:root:not(#_) body.car-shell :is(.car-hero, .car-hero *, .car-panel, .car-stat-card, .car-form-shell)::before,
html:root:not(#_) body.car-shell :is(.car-hero, .car-hero *, .car-panel, .car-stat-card, .car-form-shell)::after { display: none !important; }
html:root:not(#_) body.car-shell .car-hero .car-title::before { display: block !important; }
html:root:not(#_) body.car-shell .car-hero-grid { display: grid !important; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr) !important; align-items: start !important; gap: 24px !important; }
html:root:not(#_) body.car-shell :is(.car-hero-main, .car-copy) {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; min-width: 0 !important;
  padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; text-align: left !important;
}
html:root:not(#_) body.car-shell .car-copy { gap: 8px !important; }
html:root:not(#_) body.car-shell .car-live-strip {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 4px 12px !important; border: 1.5px solid var(--tx-brand-mint) !important;
  border-radius: 999px !important; background: transparent !important; color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.car-shell .car-live-dot { width: 8px !important; height: 8px !important; border-radius: 50% !important; background: var(--tx-brand-apricot) !important; box-shadow: none !important; }
html:root:not(#_) body.car-shell .car-hero .dashboard-kicker { color: var(--tx-brand-mint) !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.car-shell .car-shell-label { margin: 0 !important; color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; opacity: .85; }
html:root:not(#_) body.car-shell .car-title {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important; color: var(--tx-on-primary) !important; background: none !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-page-title) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
}
html:root:not(#_) body.car-shell .car-title::before {
  content: "" !important; flex: 0 0 auto !important; width: 6px !important; height: .9em !important; border-radius: 3px !important; background: var(--tx-brand-apricot) !important;
}
html:root:not(#_) body.car-shell .car-subtitle { max-width: 76ch !important; margin: 0 !important; color: var(--tx-brand-mint) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.5 !important; }
html:root:not(#_) body.car-shell .car-description { max-width: 76ch !important; margin: 0 !important; color: var(--tx-on-primary) !important; line-height: 1.6 !important; }
html:root:not(#_) body.car-shell .car-actions { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 10px !important; margin: 4px 0 0 !important; }
html:root:not(#_) body.car-shell .car-action-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: var(--tx-btn-h) !important; padding: 0 20px !important;
  border: 2px solid var(--tx-brand-mint) !important; border-radius: 999px !important; background: transparent !important; background-image: none !important; color: var(--tx-on-primary) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; text-decoration: none !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.car-shell .car-action-btn:hover { background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.car-shell .car-footnote { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 6px !important; margin: 0 !important; }
html:root:not(#_) body.car-shell .car-footnote span {
  display: block !important; padding: 8px 14px !important; border: 0 !important; border-radius: var(--tx-radius-row) !important; background: var(--tx-side-tile-bg) !important;
  color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; letter-spacing: normal !important;
}
html:root:not(#_) body.car-shell .car-snapshot-panel {
  display: flex !important; flex-direction: column !important; gap: 10px !important; padding: 20px !important; border: 0 !important;
  border-radius: var(--tx-radius-card) !important; background: var(--tx-side-tile-bg) !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root:not(#_) body.car-shell .car-snapshot-panel :is(.car-panel-title, .car-panel-copy) { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.car-shell .car-snapshot-list { display: flex !important; flex-direction: column !important; gap: 8px !important; margin: 4px 0 0 !important; }
html:root:not(#_) body.car-shell .car-snapshot-item {
  display: flex !important; flex-direction: column !important; gap: 4px !important; padding: 12px 14px !important; border: 1.5px solid transparent !important;
  border-radius: var(--tx-radius-row) !important; background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important; text-decoration: none !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.car-shell .car-snapshot-item:hover { border-color: var(--tx-brand-mint) !important; }
html:root:not(#_) body.car-shell .car-snapshot-label { color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.car-shell .car-snapshot-copy { color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.45 !important; }
html:root:not(#_) body.car-shell .car-panel-title {
  margin: 0 !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-body) !important;
  font-weight: var(--tx-weight-bold) !important; line-height: 1.4 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.car-shell .car-panel-copy { margin: 0 !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.5 !important; }
html:root:not(#_) body.car-shell .car-stats-grid { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.car-shell .car-stat-card {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; min-height: 0 !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important; text-align: left !important; transform: none !important;
}
html:root:not(#_) body.car-shell .car-stat-card-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.car-shell .car-stat-label { color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.car-shell .car-stat-value { margin: 0 !important; color: var(--tx-numbers) !important; font-family: var(--tx-font) !important; font-size: 32px !important; font-weight: var(--tx-weight-bold) !important; line-height: 1 !important; }
html:root:not(#_) body.car-shell .car-stat-card-primary .car-stat-value { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.car-shell .car-stat-card-success .car-stat-value { color: var(--tx-good-text) !important; }
html:root:not(#_) body.car-shell .car-stat-copy { margin: 0 !important; color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.45 !important; text-align: left !important; }
html:root:not(#_) body.car-shell .car-status-msg { margin: 0 !important; padding: 14px 20px !important; border-radius: var(--tx-radius-card) !important; background-image: none !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important; }
html:root:not(#_) body.car-shell .car-status-msg.success { border: 1.5px solid color-mix(in srgb, var(--tx-good-text) 40%, transparent) !important; background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.car-shell .car-status-msg.error { border: 1.5px solid color-mix(in srgb, var(--tx-problem-text) 40%, transparent) !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.car-shell .car-status-msg.info { border: 1.5px solid var(--tx-line) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.car-shell .car-panel {
  display: flex !important; flex-direction: column !important; gap: 16px !important; padding: var(--tx-card-pad) !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root:not(#_) body.car-shell :is(.car-panel, .car-table):is([style*="display:none"], [style*="display: none"]) { display: none !important; }
html:root:not(#_) body.car-shell .car-panel-header { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px 24px !important; margin: 0 !important; }
html:root:not(#_) body.car-shell .car-panel-header > div:first-child { display: flex !important; flex-direction: column !important; gap: 4px !important; flex: 1 1 360px !important; min-width: 0 !important; }
html:root:not(#_) body.car-shell .car-panel .dashboard-kicker { color: var(--tx-numbers) !important; }
html:root:not(#_) body.car-shell .car-toolbar-copy { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.5 !important; opacity: .8; }
html:root:not(#_) body.car-shell .car-btn-row { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px !important; }
html:root:not(#_) body.car-shell .car-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; min-height: var(--tx-btn-h) !important; padding: 0 22px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.car-shell .car-btn-secondary:hover:not(:disabled) { border-color: var(--tx-primary) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.car-shell .car-btn-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.car-shell .car-btn-primary:hover:not(:disabled) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; filter: brightness(1.08); }
html:root:not(#_) body.car-shell .car-btn:disabled { opacity: .5 !important; cursor: not-allowed !important; filter: none !important; }
html:root:not(#_) body.car-shell .car-table-wrap { margin: 0 !important; padding: 0 !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: none !important; overflow-x: auto !important; }
html:root:not(#_) body.car-shell .car-table { width: 100% !important; border-collapse: collapse !important; background: transparent !important; }
html:root:not(#_) body.car-shell .car-table thead th {
  height: var(--tx-table-head-h) !important; border: 0 !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0.04em !important;
}
html:root:not(#_) body.car-shell .car-table tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.car-shell .car-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.car-shell .car-table tbody tr:hover { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.car-shell .car-table td { border-color: var(--tx-line) !important; background: transparent !important; color: var(--tx-text) !important; font-weight: 500 !important; }
html:root:not(#_) body.car-shell .car-id { color: var(--tx-numbers) !important; font-family: var(--tx-font) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.car-shell .car-pill {
  display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: capitalize !important; white-space: nowrap !important;
}
html:root:not(#_) body.car-shell .car-pill.active { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.car-shell .car-pill.disabled { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.car-shell .car-pill.default { margin-left: 6px !important; background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.car-shell :is(.car-loading, .car-empty) {
  margin: 0 !important; padding: var(--tx-card-pad) !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; font-style: normal !important; text-align: left !important; box-shadow: none !important;
}
html:root:not(#_) body.car-shell .car-form-shell { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
html:root:not(#_) body.car-shell .car-form { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; }
html:root:not(#_) body.car-shell .car-form > div { display: flex !important; flex-direction: column !important; gap: 6px !important; min-width: 0 !important; }
html:root:not(#_) body.car-shell .car-form > .car-btn-row { flex-direction: row !important; }
html:root:not(#_) body.car-shell .car-form label { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.car-shell .car-form :is(input:not([type="checkbox"]), select) {
  width: 100% !important; min-height: var(--tx-btn-h) !important; padding: 0 18px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background-color: var(--tx-card) !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; box-shadow: none !important;
}
html:root:not(#_) body.car-shell .car-form :is(input, select):focus { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.car-shell .car-form input::placeholder { color: var(--tx-text) !important; opacity: .7 !important; }
html:root:not(#_) body.car-shell .car-form input[type="checkbox"] { width: 18px !important; height: 18px !important; accent-color: var(--tx-primary) !important; }
html:root:not(#_) body.car-shell .car-form > .checkbox-row {
  flex-direction: row !important; align-items: center !important; gap: 10px !important; padding: 12px 16px !important;
  border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-row) !important; background: var(--tx-row-alt) !important;
}
html:root:not(#_) body.car-shell .checkbox-row label { font-weight: 500 !important; }
html:root:not(#_) body.car-shell .car-form > .car-credentials-block { padding: 16px !important; border: 1.5px dashed var(--tx-input-border) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.car-shell .car-help { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; opacity: .8; }
html:root:not(#_) body.car-shell .car-coming-soon { color: var(--tx-pending-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.car-shell :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; box-shadow: none !important; }
@media (max-width: 1100px) {
  html:root:not(#_) body.car-shell .car-hero-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.car-shell .car-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 700px) {
  html:root:not(#_) body.car-shell .car-form { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.car-shell :is(.car-action-btn, .car-btn-row, .car-btn) { flex: 1 1 auto !important; }
}

/* Client console (dashboard/admin.html), per the Traxium Design CSS guide: page headers sit on the canvas
   (dark title + short teal bar, no fill), cards are off-white with a 1.5px line, teal fill is reserved for table headers. */
html:root:not(#_) body.admin-body .tx-page-hero {
  gap: 20px !important; padding: 4px 0 8px !important; border: 0 !important; border-radius: 0 !important; overflow: visible !important;
  background: transparent !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root:not(#_) body.admin-body .tx-page-hero :is(*, *::before, *::after) { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.admin-body .tx-page-hero-copy { gap: 10px !important; }
html:root:not(#_) body.admin-body .tx-page-kicker { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: normal !important; text-transform: none !important; opacity: .75; }
html:root:not(#_) body.admin-body .tx-page-title-wrap h2 {
  display: flex !important; align-items: flex-start !important; gap: 12px !important; margin: 0 !important; color: var(--tx-text) !important; background: none !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-section) !important; font-weight: 800 !important; line-height: 1.2 !important; letter-spacing: var(--tx-tracking-heading) !important;
}
html:root:not(#_) body.admin-body .tx-page-title-wrap h2::before {
  content: "" !important; flex: 0 0 10px !important; width: 10px !important; height: 1.1em !important; margin-top: .05em !important; border-radius: 5px !important; background: var(--tx-primary) !important;
}
html:root:not(#_) body.admin-body .tx-page-summary { max-width: 76ch !important; margin: 4px 0 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-body) !important; font-weight: 500 !important; line-height: 1.55 !important; }
html:root:not(#_) body.admin-body .tx-page-pill-row { gap: 8px !important; }
html:root:not(#_) body.admin-body .tx-page-pill {
  display: inline-flex !important; align-items: center !important; min-height: 40px !important; padding: 0 14px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important;
}
html:root:not(#_) body.admin-body .tx-page-actions { gap: 12px !important; }
html:root:not(#_) body.admin-body .tx-page-action {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: var(--tx-btn-h) !important; padding: 0 22px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  font-size: var(--tx-size-min) !important; font-weight: 800 !important; text-decoration: none !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.admin-body .tx-page-action.is-primary { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.admin-body .tx-page-action:hover { filter: brightness(1.08) !important; }
html:root:not(#_) body.admin-body .tx-page-glance-grid { gap: var(--tx-gap) !important; }
html:root:not(#_) body.admin-body .tx-page-hero .tx-glance-card {
  display: flex !important; flex-direction: column !important; gap: 6px !important; padding: var(--tx-card-pad) !important; border: 1.5px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.admin-body .tx-page-hero .tx-glance-label { color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.admin-body .tx-page-hero .tx-glance-value { color: var(--tx-numbers) !important; font-family: var(--tx-font-numbers) !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.1 !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.admin-body .tx-page-hero .tx-glance-meta { color: inherit !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.45 !important; }
html:root:not(#_) body.admin-body { --admin-numeric-ink: var(--tx-numbers) !important; --admin-numeric-brand: var(--tx-numbers) !important; }
html:root:not(#_) body.admin-body .tx-page-hero .admin-numeric-value { color: inherit !important; }
html:root:not(#_) body.admin-body :is(.admin-numeric-value, .dash-kpi-value, .orders-summary-value, .dash-pricing-amount, .ov-count, .ov-units) { font-variant-numeric: normal !important; }
/* Client console shell mirrors the warehouse shell: full-height sidebar with a scrolling nav and a pinned workspace card,
   a canvas top bar of pill controls (client context, bell, theme, sign out, profile), and the page title in the content area. */
html:root:not(#_) body.admin-body .dash-sidebar {
  box-sizing: border-box !important; display: flex !important; flex-direction: column !important;
  height: 100vh !important; height: 100dvh !important; padding: 16.5px 13.5px 15px !important; overflow: hidden !important;
}
html:root:not(#_) body.admin-body .dash-sidebar-logo { flex: 0 0 auto !important; }
html:root:not(#_) body.admin-body .admin-sidebar-label:empty { display: none !important; }
html:root:not(#_) body.admin-body .dash-nav { flex: 1 1 auto !important; min-height: 0 !important; overflow-y: auto !important; display: flex !important; flex-direction: column !important; gap: 6px !important; padding: 0 !important; }
html:root:not(#_) body.admin-body .dash-nav-section { display: flex !important; flex-direction: column !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; }
html:root:not(#_) body.admin-body .dash-nav-label { margin: 0 !important; font-size: var(--tx-size-min) !important; cursor: default !important; }
html:root:not(#_) body.admin-body .dash-nav-label::after { display: none !important; }
html:root:not(#_) body.admin-body .dash-nav-item { margin: 0 !important; }
html:root:not(#_) body.admin-body .dash-nav-item:not(.active):not(:hover) { background: transparent !important; border-color: transparent !important; }
html:root:not(#_) body.admin-body .admin-sidebar-footer { flex: 0 0 auto !important; display: flex !important; flex-direction: column !important; margin: 15px 0 0 !important; padding: 14px 15px !important; }
html:root:not(#_) body.admin-body .admin-sidebar-footer .sidebar-footer-label { margin: 0 0 5px !important; font-weight: 600 !important; letter-spacing: 0.09em !important; text-transform: uppercase !important; line-height: 1.4 !important; }
html:root:not(#_) body.admin-body .admin-sidebar-footer .sidebar-footer-value { font-weight: 500 !important; line-height: 1.35 !important; overflow-wrap: anywhere; }
html:root:not(#_) body.admin-body.dash-sidebar-collapsed .admin-sidebar-footer { display: none !important; }
html:root:not(#_) body.admin-body .admin-shell-header .dash-topbar-left { gap: 10px !important; }
html:root:not(#_) body.admin-body .admin-shell-header :is(*, *::before, *::after) { text-shadow: none !important; }
html:root:not(#_) body.admin-body .admin-shell-header .header-warehouse-name {
  background: var(--tx-nav-bg) !important; color: var(--tx-nav-ink) !important; cursor: default;
  border-color: color-mix(in srgb, var(--tx-nav-ink) 40%, var(--tx-nav-bg)) !important;
}
html:root:not(#_) body.admin-body .admin-shell-header .header-warehouse-name :is(span, svg) { color: inherit !important; stroke: currentColor; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell { position: relative !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__trigger { position: relative !important; cursor: pointer; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__badge {
  position: absolute !important; top: -6px !important; right: -6px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  min-width: 22px !important; height: 22px !important; padding: 0 6px !important; border-radius: 999px !important;
  background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; font-size: 13px !important; font-weight: 800 !important; line-height: 1 !important;
}
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__badge[hidden] { display: none !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__panel {
  display: none; position: absolute !important; top: calc(100% + 10px) !important; right: 0 !important; z-index: 60 !important;
  width: min(380px, calc(100vw - 24px)) !important; max-height: min(480px, calc(100dvh - 96px)) !important; overflow: auto !important; padding: 12px !important;
}
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__panel.is-open { display: block !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__header {
  display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important;
  padding: 4px 8px 12px !important; margin: 0 0 8px !important; border-bottom: 1.5px solid var(--tx-line) !important;
}
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__title { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__clear {
  padding: 0 !important; background: none !important; border: 0 !important; cursor: pointer;
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 700 !important; text-decoration: underline; text-underline-offset: 3px;
}
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice {
  display: grid !important; grid-template-columns: 10px minmax(0, 1fr) auto !important; gap: 12px !important; align-items: start !important;
  width: 100% !important; padding: 10px 8px !important; border: 0 !important; border-radius: 12px !important;
  background: transparent !important; text-align: left !important; font: inherit !important; cursor: pointer;
}
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice:hover { background: var(--tx-row-alt, color-mix(in srgb, var(--tx-text) 6%, transparent)) !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice__dot { width: 10px !important; height: 10px !important; margin-top: 7px !important; border-radius: 50% !important; background: transparent !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice.is-unread .ptx-notice__dot { background: var(--tx-apricot) !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice__copy { display: flex !important; flex-direction: column !important; gap: 2px !important; min-width: 0 !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice__title { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; line-height: 1.3 !important; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice__body { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.4 !important; opacity: .8; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice__time { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 600 !important; white-space: nowrap !important; opacity: .7; }
html:root:not(#_) body.admin-body .admin-shell-header .ptx-notice__empty { margin: 0 !important; padding: 8px !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.admin-body .admin-page-heading {
  display: flex !important; flex-wrap: wrap !important; align-items: flex-end !important; justify-content: space-between !important; gap: 12px 16px !important;
}
html:root:not(#_) body.admin-body .admin-page-heading .tx-shell-topbar-copy { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; min-width: 0 !important; }
html:root:not(#_) body.admin-body .admin-page-heading .tx-shell-kicker { display: block !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: normal !important; }
html:root:not(#_) body.admin-body .admin-page-heading .tx-shell-kicker:empty { display: none !important; }
html:root:not(#_) body.admin-body .admin-page-heading .tx-shell-topbar-headline { flex-wrap: wrap !important; }
html:root:not(#_) body.admin-body .admin-page-heading .dash-page-title { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-page-title) !important; font-weight: 800 !important; letter-spacing: var(--tx-tracking-display) !important; }
html:root:not(#_) body.admin-body .admin-page-heading .dash-page-title::before { height: 38px !important; }
html:root:not(#_) body.admin-body .admin-page-heading .admin-new-badge {
  display: inline-flex !important; align-items: center !important; min-height: 32px !important; padding: 0 14px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important;
}
html:root:not(#_) body.admin-body .admin-page-heading .admin-setup-progress {
  box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important;
  height: var(--tx-touch-min) !important; padding: 0 18px !important; border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; white-space: nowrap !important;
}
@media (max-width: 760px) {
  html:root:not(#_) body.admin-body .admin-shell-header { padding: 0 12px !important; gap: 8px !important; }
  html:root:not(#_) body.admin-body .admin-shell-header :is(.dash-topbar-left, .dash-topbar-right) { gap: 6px !important; }
  html:root:not(#_) body.admin-body .admin-shell-header :is(.admin-client-context, .profile-copy) { display: none !important; }
  html:root:not(#_) body.admin-body .admin-shell-header .profile-link { width: var(--tx-touch-min) !important; padding: 0 !important; }
  html:root:not(#_) body.admin-body .admin-shell-header .ptx-bell__panel { position: fixed !important; top: calc(var(--tx-topbar-h) + 8px) !important; left: 12px !important; right: 12px !important; width: auto !important; }
}

/* Headers without a tx-page-hero (Integrations, Billing) follow the same canvas header; Overview setup and Getting Started
   banners become standard off-white cards. Hero tiles: teal, sage, apricot, card. 18px type floor and 48px pill buttons. */
html:root:not(#_) body.admin-body #sidebarLogoContainer .tx-logo-img { width: 200px !important; max-width: 100% !important; }
html:root:not(#_) body.admin-body :is(.ov-setup, .gs-banner, .integrations-section-header, .billing-header) {
  gap: 16px 24px !important; margin: 0 0 var(--tx-gap) !important; border-radius: var(--tx-radius-card) !important;
  background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important;
}
html:root:not(#_) body.admin-body :is(.ov-setup, .gs-banner) { padding: var(--tx-card-pad) !important; border: 1.5px solid var(--tx-line) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.admin-body :is(.integrations-section-header, .billing-header) { padding: 4px 0 8px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; }
html:root:not(#_) body.admin-body .ov-setup { margin: 0 !important; }
html:root:not(#_) body.admin-body :is(.ov-setup, .gs-banner, .integrations-section-header, .billing-header) :is(*, *::before, *::after) { color: var(--tx-text) !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.admin-body :is(.ov-eyebrow, .gs-progress-count, .integrations-section-sub, .billing-section-sub) {
  font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: normal !important; text-transform: none !important;
}
html:root:not(#_) body.admin-body :is(.ov-setup, .gs-banner) :is(.ov-eyebrow, .gs-progress-count) { color: var(--tx-numbers) !important; }
html:root:not(#_) body.admin-body :is(.integrations-section-sub, .billing-section-sub) { margin-top: 6px !important; font-weight: 500 !important; }
html:root:not(#_) body.admin-body :is(.ov-setup-title, .gs-banner-copy h2, .integrations-section-title, .billing-section-title) {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important; background: none !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-section) !important; font-weight: 800 !important; line-height: 1.15 !important; letter-spacing: var(--tx-tracking-heading) !important;
}
html:root:not(#_) body.admin-body :is(.integrations-section-title, .billing-section-title) { font-size: clamp(28px, 2.8vw, 29px) !important; letter-spacing: var(--tx-tracking-display) !important; }
html:root:not(#_) body.admin-body :is(.ov-setup-title, .gs-banner-copy h2, .integrations-section-title, .billing-section-title)::before {
  content: "" !important; flex: 0 0 10px !important; width: 10px !important; height: 1em !important; border-radius: 5px !important; background: var(--tx-primary) !important;
}
html:root:not(#_) body.admin-body :is(.ov-setup-desc, .gs-banner-copy p) { margin: 8px 0 0 !important; font-size: var(--tx-size-body) !important; font-weight: 500 !important; line-height: 1.55 !important; }
html:root:not(#_) body.admin-body .gs-progress-pct { color: var(--tx-numbers) !important; font-family: var(--tx-font-numbers) !important; font-size: 28px !important; font-weight: 700 !important; }
html:root:not(#_) body.admin-body :is(.gs-progress-track, .ov-segments span) { background: var(--tx-line) !important; }
html:root:not(#_) body.admin-body :is(.gs-progress-fill, .ov-segments .is-done) { background: var(--tx-primary) !important; }
html:root:not(#_) body.admin-body .ov-segments .is-current { background: var(--tx-apricot) !important; }
html:root:not(#_) body.admin-body .integrations-section-header .dash-nav-badge {
  display: inline-flex !important; align-items: center !important; min-height: 40px !important; padding: 0 14px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important;
}
html:root:not(#_) body.admin-body .integrations-section-header .dash-nav-badge :is(*, *::before, *::after) { color: var(--tx-on-sage) !important; }
html:root:not(#_) body.admin-body .ov-metrics { gap: var(--tx-gap) !important; border: 0 !important; background: transparent !important; overflow: visible !important; }
html:root:not(#_) body.admin-body .ov-metric {
  --inv-kpi-fill: var(--tx-primary); --inv-kpi-text: var(--tx-on-primary); --inv-kpi-number: var(--tx-on-primary); --inv-kpi-border: transparent;
  align-items: center !important; justify-content: space-between !important; gap: 6px !important; padding: var(--tx-card-pad) !important; text-align: center !important;
  border: 1.5px solid var(--inv-kpi-border) !important; border-radius: var(--tx-radius-card) !important; background: var(--inv-kpi-fill) !important; color: var(--inv-kpi-text) !important; box-shadow: none !important;
}
html:root:not(#_) body.admin-body .ov-metric:nth-child(2) { --inv-kpi-fill: var(--tx-sage); --inv-kpi-text: var(--tx-on-sage); --inv-kpi-number: var(--tx-numbers); }
html:root:not(#_) body.admin-body .ov-metric:nth-child(3) { --inv-kpi-fill: var(--tx-apricot); --inv-kpi-text: var(--tx-on-apricot); --inv-kpi-number: var(--tx-on-apricot); }
html:root:not(#_) body.admin-body .ov-metric:nth-child(4) { --inv-kpi-fill: var(--tx-card); --inv-kpi-text: var(--tx-text); --inv-kpi-number: var(--tx-numbers); --inv-kpi-border: var(--tx-line); }
html:root:not(#_) body.admin-body .ov-metric:hover { filter: brightness(1.04); }
html:root:not(#_) body.admin-body .ov-metric :is(*, *::before, *::after) { color: inherit !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.admin-body :is(.ov-metric-label, .ov-metric-meta) { color: inherit !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.admin-body .ov-metric { min-height: 210px !important; }
html:root:not(#_) body.admin-body .ov-metric-head { display: flex !important; align-items: center !important; align-self: stretch !important; gap: 10px !important; min-width: 0 !important; }
html:root:not(#_) body.admin-body .ov-metric-icon {
  display: inline-flex !important; flex: 0 0 34px !important; align-items: center !important; justify-content: center !important; width: 34px !important; height: 34px !important;
  border-radius: 10px !important; background: color-mix(in srgb, currentColor 14%, transparent) !important;
}
html:root:not(#_) body.admin-body .ov-metric-icon svg { width: 20px !important; height: 20px !important; }
html:root:not(#_) body.admin-body .ov-metric-label { align-self: flex-start !important; text-align: left !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body .ov-metric-head .ov-metric-label { align-self: center !important; }
html:root:not(#_) body.admin-body .ov-metric-meta { font-weight: 700 !important; }
html:root:not(#_) body.admin-body .ov-metric-value { font-family: var(--tx-font-numbers) !important; font-size: clamp(56px, 6.4vw, 66px) !important; font-weight: 700 !important; line-height: 1 !important; letter-spacing: -0.02em !important; font-variant-numeric: proportional-nums !important; }
html:root:not(#_) body.admin-body .ov-metric .ov-metric-value { color: var(--inv-kpi-number) !important; -webkit-text-fill-color: var(--inv-kpi-number) !important; }
html:root:not(#_) body.admin-body .ov-metric:nth-child(4) .ov-metric-value { font-size: 28px !important; letter-spacing: var(--tx-tracking-heading) !important; }
html:root:not(#_) body.admin-body :is(.ov-btn, .integration-connect-btn, .gs-help-btn, .btn-disconnect, .btn-danger-outline, .pm-remove-btn) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; height: auto !important; min-height: var(--tx-btn-h) !important; padding: 0 22px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.admin-body :is(.ov-btn.is-primary, .integration-connect-btn) { border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.admin-body :is(.btn-disconnect, .btn-danger-outline, .pm-remove-btn) { border-color: color-mix(in srgb, var(--tx-problem-text) 50%, transparent) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.admin-body .ov-status { padding: 4px 14px !important; border: 1.5px solid var(--tx-line) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.admin-body .ov-status.is-ok { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.admin-body .ov-status.is-next { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.admin-body .ov-link { color: var(--tx-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.admin-body :is(.integration-name, .billing-empty-title, .settings-notif-title, .inventory-upload-template-title, .inventory-upload-dropzone-title, .modal-platform-name, .ov-row-name, .ov-ship-title) {
  color: var(--tx-text) !important; font-size: var(--tx-size-label) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important;
}
html:root:not(#_) body.admin-body :is(.pm-sub, .sync-status-sub, .settings-notif-sub, .dash-panel-sub, .dash-kpi-sub, .admin-welcome-sub, .integration-last-sync, .integration-token-preview, .sync-next-poll, .sync-interval-badge, .ov-count, .ov-ship-ref, .ov-row-btn, .ov-table) {
  font-size: var(--tx-size-min) !important;
}
html:root:not(#_) body.admin-body :is(.integration-last-sync, .integration-token-preview, .ov-ship-ref) { color: var(--tx-text) !important; font-family: var(--tx-font) !important; overflow-wrap: anywhere !important; }
html:root:not(#_) body.admin-body .integration-last-sync code { font-family: var(--tx-font-mono) !important; font-size: var(--tx-size-min) !important; color: inherit !important; }
html:root:not(#_) body.admin-body .integration-footer { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; }
html:root:not(#_) body.admin-body .dash-main :is([style*="font-size:."], [style*="font-size: ."], [style*="font-size:0."], [style*="font-size:10px"], [style*="font-size:11px"], [style*="font-size:12px"],
  [style*="font-size:13px"], [style*="font-size:14px"], [style*="font-size:15px"], [style*="font-size:16px"], [style*="font-size:17px"]) { font-size: var(--tx-size-min) !important; }
@media (max-width: 900px) {
  html:root:not(#_) body.admin-body .ov-setup { grid-template-columns: minmax(0, 1fr) !important; }
}

/* Client console list views: warehouse inventory row treatment + four-colour KPI cards */
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) table tbody tr > td { background-image: none !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) table tbody tr:nth-child(odd):not(:hover) > td,
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row):nth-child(odd):not(:hover) { background-color: var(--tx-card) !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) table tbody tr:nth-child(even) > td,
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row):not(.tx-tone-card):nth-child(even) { background-color: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) table tbody tr:hover > td,
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row):hover { background-color: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row)[data-status-tone="good"] { --tx-row-tone: var(--tx-good-text); }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row)[data-status-tone="pending"] { --tx-row-tone: var(--tx-apricot); }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row)[data-status-tone="warning"] { --tx-row-tone: var(--tx-pending-text); }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row)[data-status-tone="problem"] { --tx-row-tone: var(--tx-problem-text); }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-orders, #view-shipments, #view-outbound-shipments) :is(.inv-seed-row, .tx-tone-row) { box-shadow: inset 5px 0 0 var(--tx-row-tone, transparent) !important; }
html:root:not(#_) body.admin-body :is(#view-orders, #view-shipments, #view-outbound-shipments) .tx-tone-card {
  background-color: var(--tx-card) !important; border: 1px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; box-shadow: inset 8px 0 0 var(--tx-row-tone, var(--tx-line)) !important; padding: 20px 22px 20px 30px !important;
}
html:root:not(#_) body.admin-body :is(#view-orders, #view-shipments, #view-outbound-shipments) .tx-tone-card:hover { border-color: var(--tx-primary) !important; transform: none !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid,
html:root:not(#_) body.admin-body #view-orders .orders-summary-strip { gap: var(--tx-gap) !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card,
html:root:not(#_) body.admin-body #view-orders .orders-summary-strip > .orders-summary-card {
  --inv-kpi-fill: var(--tx-primary); --inv-kpi-text: var(--tx-on-primary); --inv-kpi-number: var(--tx-on-primary); --inv-kpi-border: transparent;
  display: flex !important; flex-direction: column !important; gap: 8px !important;
  background: var(--inv-kpi-fill) !important; background-image: none !important; border: 1.5px solid var(--inv-kpi-border) !important; border-radius: var(--tx-radius-card) !important; box-shadow: none !important;
  color: var(--inv-kpi-text) !important;
}
html:root:not(#_) body.admin-body #view-orders .orders-summary-strip > .orders-summary-card { flex-direction: column-reverse !important; align-items: stretch !important; padding: var(--tx-card-pad) !important; border-radius: var(--tx-radius-card) !important; }
html:root:not(#_) body.admin-body :is(:is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card, #view-orders .orders-summary-strip > .orders-summary-card):nth-child(2) { --inv-kpi-fill: var(--tx-sage); --inv-kpi-text: var(--tx-on-sage); --inv-kpi-number: var(--tx-numbers); }
html:root:not(#_) body.admin-body :is(:is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card, #view-orders .orders-summary-strip > .orders-summary-card):nth-child(3) { --inv-kpi-fill: var(--tx-apricot); --inv-kpi-text: var(--tx-on-apricot); --inv-kpi-number: var(--tx-on-apricot); }
html:root:not(#_) body.admin-body :is(:is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card, #view-orders .orders-summary-strip > .orders-summary-card):nth-child(4) { --inv-kpi-fill: var(--tx-card); --inv-kpi-text: var(--tx-text); --inv-kpi-number: var(--tx-numbers); --inv-kpi-border: var(--tx-line); }
html:root:not(#_) body.admin-body :is(:is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card, #view-orders .orders-summary-strip > .orders-summary-card) :is(*, *::before, *::after) { color: inherit !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card .dash-kpi-label,
html:root:not(#_) body.admin-body #view-orders .orders-summary-label { margin: 0 !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.admin-body :is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card .dash-kpi-value,
html:root:not(#_) body.admin-body #view-orders .orders-summary-value {
  align-self: stretch !important; text-align: center !important; color: var(--inv-kpi-number) !important; -webkit-text-fill-color: var(--inv-kpi-number) !important;
  font-family: var(--tx-font-numbers) !important; font-size: 40px !important; font-weight: 700 !important; line-height: 1 !important; letter-spacing: -0.02em !important; font-variant-numeric: tabular-nums;
}
html:root:not(#_) body.admin-body :is(#view-inventory, #view-shipments, #view-outbound-shipments) .dash-kpi-grid > .dash-kpi-card .dash-kpi-sub { opacity: .9; font-weight: 600 !important; }

/* Client console Overview: off-white cards with dark titles, teal table header band + zebra rows */
html:root:not(#_) body.admin-body #view-overview .ov-card { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; overflow: hidden !important; }
html:root:not(#_) body.admin-body #view-overview .ov-card-head { background: var(--tx-card) !important; border-bottom: 1.5px solid var(--tx-line) !important; padding: 18px 22px !important; }
html:root:not(#_) body.admin-body #view-overview .ov-card-head h2 { color: var(--tx-text) !important; font-size: var(--tx-size-label) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-overview .ov-card-head .ov-count { color: var(--tx-text) !important; opacity: .75; }
html:root:not(#_) body.admin-body #view-overview .ov-card-head .ov-link { color: var(--tx-numbers) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-overview .ov-table thead th { background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important; border-bottom: 0 !important; }
html:root:not(#_) body.admin-body #view-overview :is(.ov-table tbody tr, .ov-row-btn):nth-child(odd) { background-color: var(--tx-card) !important; }
html:root:not(#_) body.admin-body #view-overview :is(.ov-table tbody tr, .ov-row-btn):nth-child(even) { background-color: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #view-overview :is(.ov-table tbody tr, .ov-row-btn):is(:hover, :focus-visible) { background-color: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.admin-body #view-overview :is(.ov-table tbody tr, .ov-row-btn)[data-status-tone="good"] { --tx-row-tone: var(--tx-good-text); }
html:root:not(#_) body.admin-body #view-overview :is(.ov-table tbody tr, .ov-row-btn)[data-status-tone="pending"] { --tx-row-tone: var(--tx-apricot); }
html:root:not(#_) body.admin-body #view-overview :is(.ov-table tbody tr, .ov-row-btn)[data-status-tone="warning"] { --tx-row-tone: var(--tx-pending-text); }
html:root:not(#_) body.admin-body #view-overview .ov-row-btn { box-shadow: inset 5px 0 0 var(--tx-row-tone, transparent) !important; }
html:root:not(#_) body.admin-body #view-overview .ov-table tbody tr > td { background: transparent !important; }
html:root:not(#_) body.admin-body #view-overview .ov-table tbody tr > td:first-child { box-shadow: inset 5px 0 0 var(--tx-row-tone, transparent) !important; }
html:root:not(#_) body.admin-body #view-overview .ov-bar { background: var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-overview .ov-bar span { background: var(--tx-primary) !important; }
html:root:not(#_) body.admin-body #view-overview .ov-row-btn.is-done .ov-check { background: var(--tx-good-text) !important; border-color: transparent !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.admin-body #view-overview .ov-row-btn[data-status-tone="pending"] .ov-check { background: var(--tx-apricot) !important; border-color: transparent !important; color: var(--tx-on-apricot) !important; }

/* Client console Getting Started: status-strip step cards + apricot help panel */
html:root:not(#_) body.admin-body #view-getting-started .gs-step-body { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: inset 8px 0 0 var(--tx-row-tone, var(--tx-line)) !important; padding-left: 30px !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step.is-done { --tx-row-tone: var(--tx-good-text); }
html:root:not(#_) body.admin-body #view-getting-started .gs-step.is-current { --tx-row-tone: var(--tx-apricot); }
html:root:not(#_) body.admin-body #view-getting-started .gs-step.is-current .gs-step-body { border-color: var(--tx-apricot) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step.is-done:not(.is-open) .gs-step-body { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step-number { background: var(--tx-card) !important; border: 2px solid var(--tx-input-border) !important; color: var(--tx-numbers) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step.is-current .gs-step-number { background: var(--tx-apricot) !important; border-color: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step.is-done .gs-step-number { background: var(--tx-good-text) !important; border-color: var(--tx-good-text) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step::before { background: var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-step-eyebrow { color: var(--tx-numbers) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-cta { min-height: var(--tx-btn-h) !important; padding: 0 22px !important; border-radius: 999px !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-cta.is-primary { border: 0 !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-status { padding: 4px 14px !important; border-radius: 999px !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; border: 0 !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-status-done { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-status-current { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-aside { border: 0 !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-apricot) !important; box-shadow: none !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-aside :is(h3, p) { color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-aside-link { border: 0 !important; border-radius: 999px !important; background: var(--tx-on-apricot) !important; color: #FFFFFF !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-getting-started .gs-aside-link:hover { filter: brightness(1.08) !important; }

/* Client console Integrations: brand-tinted cards (--int-brand per platform), pill badges, status pills, grid/list layouts */
html:root:not(#_) body.admin-body #view-integrations .integrations-section-header { flex-wrap: wrap !important; gap: 12px !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-header-actions { display: flex !important; align-items: center !important; gap: 12px !important; flex-wrap: wrap !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-view-toggle { display: inline-flex !important; padding: 4px !important; gap: 4px !important; border: 1.5px solid var(--tx-line) !important; border-radius: 999px !important; background: var(--tx-card) !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-view-btn {
  min-height: 36px !important; padding: 0 18px !important; border: 0 !important; border-radius: 999px !important; background: transparent !important;
  color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; cursor: pointer !important;
}
html:root:not(#_) body.admin-body #view-integrations .integrations-view-btn.is-active { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid { grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)) !important; gap: 16px !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-card {
  --int-brand: var(--tx-primary);
  border: 1.5px solid color-mix(in srgb, var(--int-brand) 32%, var(--tx-line)) !important; border-top: 8px solid var(--int-brand) !important;
  border-radius: var(--tx-radius-card) !important; background: color-mix(in srgb, var(--int-brand) 12%, var(--tx-card)) !important; background-image: none !important;
  box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.admin-body #view-integrations .integration-card:hover { border-color: var(--int-brand) !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-logo {
  width: 54px !important; height: 54px !important; border: 0 !important; border-radius: 14px !important; background: var(--int-brand) !important; font-size: 26px !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--int-brand) 35%, transparent) !important;
}
html:root:not(#_) body.admin-body #view-integrations .integrations-grid:not(.is-list) .integration-card:not(.connected) .integration-last-sync { display: none !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid:not(.is-list) .integration-desc {
  display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; overflow: hidden !important;
}
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list { grid-template-columns: minmax(0, 1fr) !important; gap: 12px !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-card {
  display: grid !important; grid-template-columns: 54px minmax(0, 1fr) auto auto !important;
  grid-template-areas: "logo name badges footer" "logo desc badges footer" "logo preview badges footer" !important;
  align-items: center !important; column-gap: 20px !important; row-gap: 4px !important;
  border-top-width: 1.5px !important; border-left: 8px solid var(--int-brand) !important;
}
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-card-top { display: contents !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-logo { grid-area: logo !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-badges { grid-area: badges !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-name { grid-area: name !important; margin: 0 !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-desc { grid-area: desc !important; margin: 0 !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-token-preview { grid-area: preview !important; margin: 0 !important; }
html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-footer { grid-area: footer !important; flex-direction: column !important; align-items: flex-end !important; gap: 8px !important; margin: 0 !important; }
@media (max-width: 760px) {
  html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-card {
    grid-template-columns: 54px minmax(0, 1fr) !important; grid-template-areas: "logo name" "logo badges" "desc desc" "preview preview" "footer footer" !important;
  }
  html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-badges { align-items: flex-start !important; flex-direction: row !important; }
  html:root:not(#_) body.admin-body #view-integrations .integrations-grid.is-list .integration-footer { align-items: flex-start !important; }
}
html:root:not(#_) body.admin-body #view-integrations .integration-badges { display: flex !important; flex-direction: column !important; align-items: flex-end !important; gap: 6px !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-badge { padding: 4px 14px !important; border: 0 !important; border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: normal !important; text-transform: none !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-badge:is(.badge-most-popular, .badge-popular) { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-badge:is(.badge-new, .badge-growing) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.admin-body #view-integrations .int-status { padding: 4px 12px !important; border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.admin-body #view-integrations .int-status .int-status-dot { background: currentColor !important; box-shadow: none !important; }
html:root:not(#_) body.admin-body #view-integrations .int-status.connected { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.admin-body #view-integrations .int-status.syncing { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-desc { color: var(--tx-text) !important; }
html:root:not(#_) body.admin-body #view-integrations .integration-connect-btn.btn-manage {
  border: 0 !important; background: #16A34A !important; color: #FFFFFF !important;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.28), 0 0 18px 2px rgba(34, 197, 94, 0.55) !important;
  animation: tx-int-connected-glow 2.4s ease-in-out infinite;
}
html:root:not(#_) body.admin-body #view-integrations .integration-connect-btn.btn-manage:hover { background: #15803D !important; }
@keyframes tx-int-connected-glow {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(34, 197, 94, 0.35)); }
  50% { filter: drop-shadow(0 0 12px rgba(34, 197, 94, 0.85)); }
}
@media (prefers-reduced-motion: reduce) {
  html:root:not(#_) body.admin-body #view-integrations .integration-connect-btn.btn-manage { animation: none !important; }
}
html:root:not(#_) body.admin-body #view-integrations .sync-status-bar { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-sage) !important; background-image: none !important; box-shadow: none !important; }
html:root:not(#_) body.admin-body #view-integrations .sync-status-bar :is(*, *::before, *::after) { color: var(--tx-on-sage) !important; }
html:root:not(#_) body.admin-body #view-integrations .sync-engine-dot { background: var(--tx-primary) !important; }

/* Client console Billing: off-white cards, teal invoice table header band + zebra rows */
html:root:not(#_) body.admin-body #view-billing .billing-empty { border: 2px dashed var(--tx-input-border) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.admin-body #view-billing .billing-empty-icon { background: var(--tx-sage) !important; border: 0 !important; color: var(--tx-numbers) !important; }
html:root:not(#_) body.admin-body #view-billing .payment-method-card { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: none !important; }
html:root:not(#_) body.admin-body #view-billing .payment-method-card.is-primary { box-shadow: inset 8px 0 0 var(--tx-good-text) !important; padding-left: 30px !important; }
html:root:not(#_) body.admin-body #view-billing .pm-icon { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; border: 0 !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-billing .pm-primary-badge { padding: 4px 14px !important; border: 0 !important; border-radius: 999px !important; background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; overflow: hidden !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices-head { background: var(--tx-card) !important; border-bottom: 1.5px solid var(--tx-line) !important; padding: 18px 22px !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices-head :is(*, *::before, *::after) { color: var(--tx-text) !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices-head > div > div:first-child { font-size: var(--tx-size-section) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices thead tr > th { background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr:nth-child(odd) > td { background-color: var(--tx-card) !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr:nth-child(even) > td { background-color: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr:not(.billing-invoice-empty):hover > td { background-color: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr[data-status-tone="good"] { --tx-row-tone: var(--tx-good-text); }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr[data-status-tone="pending"] { --tx-row-tone: var(--tx-apricot); }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr[data-status-tone="problem"] { --tx-row-tone: var(--tx-problem-text); }
html:root:not(#_) body.admin-body #view-billing .billing-invoices tbody tr > td:first-child { box-shadow: inset 5px 0 0 var(--tx-row-tone, transparent) !important; }
html:root:not(#_) body.admin-body #view-billing .billing-invoice-link { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }

/* Client console Settings: hero tiles (teal, sage, apricot, card) + off-white panels with dark titles */
html:root:not(#_) body.admin-body #view-settings .tx-page-hero .tx-glance-card { --inv-kpi-fill: var(--tx-primary); --inv-kpi-text: var(--tx-on-primary); --inv-kpi-number: var(--tx-on-primary); background: var(--inv-kpi-fill) !important; color: var(--inv-kpi-text) !important; border-color: transparent !important; }
html:root:not(#_) body.admin-body #view-settings .tx-page-hero .tx-glance-card:nth-child(2) { --inv-kpi-fill: var(--tx-sage); --inv-kpi-text: var(--tx-on-sage); --inv-kpi-number: var(--tx-numbers); }
html:root:not(#_) body.admin-body #view-settings .tx-page-hero .tx-glance-card:nth-child(3) { --inv-kpi-fill: var(--tx-apricot); --inv-kpi-text: var(--tx-on-apricot); --inv-kpi-number: var(--tx-on-apricot); }
html:root:not(#_) body.admin-body #view-settings .tx-page-hero .tx-glance-card:nth-child(4) { --inv-kpi-fill: var(--tx-card); --inv-kpi-text: var(--tx-text); --inv-kpi-number: var(--tx-numbers); border-color: var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-settings .tx-page-hero .tx-glance-card :is(.tx-glance-label, .tx-glance-meta) { color: var(--inv-kpi-text) !important; }
html:root:not(#_) body.admin-body #view-settings .tx-page-hero .tx-glance-value { color: var(--inv-kpi-number) !important; font-size: 26px !important; }
html:root:not(#_) body.admin-body #view-settings .dash-panel { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; overflow: hidden !important; }
html:root:not(#_) body.admin-body #view-settings .dash-panel-header { background: var(--tx-card) !important; border-bottom: 1.5px solid var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-settings .dash-panel-header .dash-panel-title { color: var(--tx-text) !important; font-size: var(--tx-size-section) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-settings .dash-panel-header .dash-panel-sub { color: var(--tx-text) !important; opacity: .75; }
html:root:not(#_) body.admin-body #view-settings .settings-notif-row:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-toggle-input:checked + .settings-toggle-track { background: var(--tx-primary) !important; border-color: var(--tx-primary) !important; }

/* Client console Settings layout: full-width hero row, grouped sections, equal-height off-white cards */
html:root:not(#_) body.admin-body #view-settings .tx-page-hero { grid-template-columns: minmax(0, 1fr) !important; }
html:root:not(#_) body.admin-body #view-settings .tx-page-glance-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-layout { display: flex !important; flex-direction: column !important; gap: 32px !important; margin-top: 8px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-group { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; padding-top: 24px !important; border-top: 1.5px solid var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-group-head { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 8px 24px !important; flex-wrap: wrap !important; }
html:root:not(#_) body.admin-body #view-settings .settings-group-title {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important; color: var(--tx-text) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-section) !important; font-weight: 800 !important; line-height: 1.2 !important; letter-spacing: var(--tx-tracking-heading) !important;
}
html:root:not(#_) body.admin-body #view-settings .settings-group-title::before { content: "" !important; flex: 0 0 10px !important; width: 10px !important; height: 1em !important; border-radius: 5px !important; background: var(--tx-primary) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-group-copy { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; opacity: .8; }
html:root:not(#_) body.admin-body #view-settings .settings-group-grid { display: grid !important; gap: var(--tx-gap) !important; align-items: stretch !important; }
html:root:not(#_) body.admin-body #view-settings .settings-group-grid.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-group-grid.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card { display: flex !important; flex-direction: column !important; min-width: 0 !important; margin: 0 !important; box-shadow: 0 1px 2px rgba(16,32,31,.05) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card .dash-panel-header { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px !important; padding: 20px 24px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card .dash-panel-header .dash-panel-title { font-size: 20px !important; margin: 0 0 4px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card .dash-panel-header .pm-primary-badge { flex: 0 0 auto !important; white-space: nowrap !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-body { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; gap: 16px !important; padding: 24px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-body .form-group { margin: 0 !important; min-width: 0 !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-body .payment-method-card { margin: 0 !important; border: 1.5px solid var(--tx-line) !important; border-radius: 16px !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-actions { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; margin-top: auto !important; padding-top: 16px !important; border-top: 1.5px solid var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-actions.is-split { flex-direction: row !important; align-items: center !important; justify-content: space-between !important; flex-wrap: wrap !important; gap: 12px 24px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-actions .btn { min-height: 44px !important; padding: 0 22px !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-settings .settings-card-note { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.5 !important; opacity: .8; }
html:root:not(#_) body.admin-body #view-settings .settings-card-note code { font-family: var(--tx-font-mono, monospace) !important; font-size: .95em !important; }
html:root:not(#_) body.admin-body #view-settings .settings-msg { font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
html:root:not(#_) body.admin-body #view-settings .settings-msg.is-ok { color: var(--tx-good-text) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-msg.is-err { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-input-readonly { opacity: .65 !important; cursor: not-allowed !important; }
html:root:not(#_) body.admin-body #view-settings .settings-pw-strength-label { min-height: 1.2em !important; margin-top: 6px !important; color: var(--tx-text) !important; font-size: 13px !important; font-weight: 600 !important; opacity: .8; }
html:root:not(#_) body.admin-body #view-settings .settings-fieldset { display: flex !important; flex-direction: column !important; gap: 12px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-fieldset + .settings-fieldset { padding-top: 20px !important; border-top: 1.5px dashed var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-fieldset-title { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.admin-body #view-settings .settings-form-grid { display: grid !important; gap: 16px !important; }
html:root:not(#_) body.admin-body #view-settings .settings-form-grid.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-form-grid.is-4 { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-form-grid .is-span-2 { grid-column: span 2 !important; }
html:root:not(#_) body.admin-body #view-settings .settings-notif-grid { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-notif-grid .settings-notif-row { align-items: flex-start !important; margin: 0 !important; padding: 18px 20px !important; border: 1.5px solid var(--tx-line) !important; border-radius: 16px !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #view-settings .settings-notif-grid .settings-notif-title { margin-bottom: 4px !important; }
@media (max-width: 1600px) {
  html:root:not(#_) body.admin-body #view-settings .settings-group-grid.is-3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.admin-body #view-settings .settings-group-grid.is-3 > :first-child { grid-column: 1 / -1 !important; }
}
@media (max-width: 1024px) {
  html:root:not(#_) body.admin-body #view-settings .tx-page-glance-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.admin-body #view-settings :is(.settings-group-grid.is-2, .settings-group-grid.is-3, .settings-notif-grid) { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.admin-body #view-settings .settings-form-grid.is-4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 640px) {
  html:root:not(#_) body.admin-body #view-settings .tx-page-glance-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.admin-body #view-settings :is(.settings-form-grid.is-2, .settings-form-grid.is-4) { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.admin-body #view-settings .settings-form-grid .is-span-2 { grid-column: auto !important; }
  html:root:not(#_) body.admin-body #view-settings :is(.settings-card-body, .settings-card .dash-panel-header) { padding: 18px !important; }
}

/* Client console My 3PL: hero tiles, off-white invite panel + apricot how-it-works aside */
html:root:not(#_) body.admin-body #view-partner .tx-page-hero .tx-glance-card { --inv-kpi-fill: var(--tx-primary); --inv-kpi-text: var(--tx-on-primary); --inv-kpi-number: var(--tx-on-primary); background: var(--inv-kpi-fill) !important; color: var(--inv-kpi-text) !important; border-color: transparent !important; }
html:root:not(#_) body.admin-body #view-partner .tx-page-hero .tx-glance-card:nth-child(2) { --inv-kpi-fill: var(--tx-sage); --inv-kpi-text: var(--tx-on-sage); --inv-kpi-number: var(--tx-numbers); }
html:root:not(#_) body.admin-body #view-partner .tx-page-hero .tx-glance-card :is(.tx-glance-label, .tx-glance-meta) { color: var(--inv-kpi-text) !important; }
html:root:not(#_) body.admin-body #view-partner .tx-page-hero .tx-glance-value { color: var(--inv-kpi-number) !important; font-size: 22px !important; }
html:root:not(#_) body.admin-body #view-partner .partner-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(260px, 1fr); gap: 20px; margin-top: 20px; align-items: start; }
@media (max-width: 900px) { html:root:not(#_) body.admin-body #view-partner .partner-grid { grid-template-columns: 1fr; } }
html:root:not(#_) body.admin-body #view-partner .partner-panel { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; overflow: hidden !important; max-width: none !important; }
html:root:not(#_) body.admin-body #view-partner .partner-panel .dash-panel-header { background: var(--tx-card) !important; border-bottom: 1.5px solid var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-panel .dash-panel-title { color: var(--tx-text) !important; font-size: var(--tx-size-section) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-partner .partner-panel .dash-panel-sub { color: var(--tx-text) !important; opacity: .75; }
html:root:not(#_) body.admin-body #view-partner .partner-panel-body { display: flex !important; flex-direction: column !important; gap: 16px !important; padding: 22px 24px !important; }
html:root:not(#_) body.admin-body #view-partner .partner-code-input { height: var(--tx-btn-h-lg) !important; font-family: var(--tx-font-mono, monospace) !important; font-size: 1.25rem !important; font-weight: 700 !important; letter-spacing: .16em !important; text-transform: uppercase; border: 2px solid var(--tx-input-border) !important; border-radius: 14px !important; background: var(--tx-card) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-code-input:focus { border-color: var(--tx-primary) !important; outline: none !important; box-shadow: 0 0 0 3px var(--tx-focus, color-mix(in srgb, var(--tx-primary) 30%, transparent)) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-code-error { padding: 10px 14px; border-radius: var(--tx-radius-row); background: var(--tx-problem-bg); color: var(--tx-problem-text); font-size: var(--tx-size-min); font-weight: var(--tx-weight-bold); }
html:root:not(#_) body.admin-body #view-partner .partner-connect-btn { align-self: flex-start; min-height: var(--tx-btn-h) !important; padding: 0 28px !important; border: 0 !important; border-radius: 999px !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-partner .partner-connect-btn:hover:not(:disabled) { filter: brightness(1.08) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-logo { width: 44px !important; height: 44px !important; flex: 0 0 44px; object-fit: contain; border-radius: 10px !important; padding: 4px; background: var(--tx-card); border: 1px solid var(--tx-line); }
html:root:not(#_) body.admin-body #view-partner .pm-icon.partner-logo { padding: 0; border: 0 !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; font-size: .75rem !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-partner .payment-method-card.is-primary { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; box-shadow: inset 8px 0 0 var(--tx-good-text) !important; padding-left: 30px !important; }
html:root:not(#_) body.admin-body #view-partner .pm-primary-badge { padding: 4px 14px !important; border: 0 !important; border-radius: 999px !important; background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-partner .partner-panel-foot { padding-top: 16px !important; border-top: 1px solid var(--tx-line) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-disconnect-btn { padding: 8px 18px !important; border-radius: 999px !important; border: 1px solid var(--tx-problem-text) !important; background: var(--tx-card) !important; color: var(--tx-problem-text) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-disconnect-btn:hover { background: var(--tx-problem-bg) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-aside { padding: 22px 24px !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-aside h3 { margin: 0 0 16px !important; color: var(--tx-on-apricot) !important; font-size: var(--tx-size-label) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #view-partner .partner-steps { counter-reset: partner-step; list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
html:root:not(#_) body.admin-body #view-partner .partner-steps li { counter-increment: partner-step; display: grid; grid-template-columns: 30px 1fr; column-gap: 12px; row-gap: 2px; }
html:root:not(#_) body.admin-body #view-partner .partner-steps li::before { content: counter(partner-step); grid-row: span 2; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 999px; background: var(--tx-on-apricot); color: #FFFFFF; font-weight: 800; }
html:root:not(#_) body.admin-body #view-partner .partner-steps :is(strong, span) { color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.admin-body #view-partner .partner-steps span { font-size: var(--tx-size-min); line-height: 1.45; }
/* Admin: shared table header band (inline-styled tables in Inventory, Shipments, Orders, upload preview) */
html:root:not(#_) body.admin-body :is(.dash-main, #inventoryUploadModal) table thead th {
  background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important; -webkit-text-fill-color: currentColor !important;
  font-size: var(--tx-size-min) !important; font-weight: 800 !important; letter-spacing: .04em !important; text-transform: uppercase !important;
  white-space: nowrap !important; text-shadow: none !important; border-bottom: 0 !important;
}
html:root:not(#_) body.admin-body :is(.dash-main, #inventoryUploadModal) table thead th[style*="padding:.5rem 0"] { padding: .5rem .75rem !important; }
html:root:not(#_) body.admin-body :is(.dash-main, #inventoryUploadModal) table thead tr { border-bottom: 0 !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-table-wrap { border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-table tbody tr:nth-child(even) td { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-table td { color: var(--tx-text) !important; font-weight: 700 !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-table-wrap { overflow-x: auto !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal table thead th { font-size: 14px !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-table td:first-child { white-space: nowrap !important; }
html:root:not(#_) body.admin-body :is(#inventoryUploadStatus, #shipmentImportStatus) { font-weight: 800 !important; font-size: var(--tx-size-min) !important; text-shadow: none !important; -webkit-text-fill-color: currentColor !important; }

/* Admin: inventory upload workflow (focal panel + step guide) */
html:root:not(#_) body.admin-body .inv-flow {
  display: grid !important; gap: var(--tx-gap) !important; margin: 0 0 24px !important; padding: 24px !important;
  background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  box-shadow: 0 1px 2px rgba(16,32,31,.05), 0 8px 20px rgba(16,32,31,.06) !important;
}
html:root:not(#_) body.admin-body .inv-flow :is(*, *::before, *::after) { text-shadow: none !important; -webkit-text-fill-color: currentColor !important; }
html:root:not(#_) body.admin-body .inv-flow-head { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 16px !important; flex-wrap: wrap !important; }
html:root:not(#_) body.admin-body .inv-flow-title {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 0 !important;
  color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: clamp(26px, 2.6vw, 27px) !important; font-weight: 800 !important; line-height: 1.15 !important; letter-spacing: var(--tx-tracking-heading) !important;
}
html:root:not(#_) body.admin-body .inv-flow-title::before { content: "" !important; flex: 0 0 10px !important; width: 10px !important; height: 1em !important; border-radius: 5px !important; background: var(--tx-primary) !important; }
html:root:not(#_) body.admin-body .inv-flow-copy { margin: 8px 0 0 22px !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; line-height: 1.5 !important; opacity: .8 !important; }
html:root:not(#_) body.admin-body .inv-flow-count { display: inline-flex !important; align-items: center !important; gap: 6px !important; min-height: 40px !important; padding: 0 16px !important; border-radius: 999px !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body .inv-flow-count strong { font-family: var(--tx-font-numbers) !important; font-variant-numeric: normal !important; }
html:root:not(#_) body.admin-body .inv-flow-drop {
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 8px !important; width: 100% !important; min-height: 220px !important; padding: 28px 20px !important; cursor: pointer !important;
  background: color-mix(in srgb, var(--tx-apricot) 14%, var(--tx-card)) !important; border: 3px dashed var(--tx-apricot) !important; border-radius: var(--tx-radius-card) !important;
  color: var(--tx-text) !important; font: inherit !important; text-align: center !important; transition: background .15s ease, border-color .15s ease, transform .15s ease !important;
}
html:root:not(#_) body.admin-body .inv-flow-drop:is(:hover, :focus-visible, .is-dragover) { background: color-mix(in srgb, var(--tx-apricot) 28%, var(--tx-card)) !important; border-style: solid !important; transform: translateY(-1px) !important; }
html:root:not(#_) body.admin-body .inv-flow-drop:focus-visible { outline: 3px solid var(--tx-primary) !important; outline-offset: 3px !important; }
html:root:not(#_) body.admin-body .inv-flow-drop-icon { display: grid !important; place-items: center !important; width: 64px !important; height: 64px !important; border-radius: 18px !important; background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.admin-body .inv-flow-drop-title { font-size: clamp(22px, 2.2vw, 23px) !important; font-weight: 800 !important; letter-spacing: var(--tx-tracking-heading) !important; }
html:root:not(#_) body.admin-body .inv-flow-drop-copy { font-size: var(--tx-size-min) !important; font-weight: 600 !important; opacity: .8 !important; }
html:root:not(#_) body.admin-body .inv-flow-drop-cta { display: inline-flex !important; align-items: center !important; min-height: 48px !important; margin-top: 6px !important; padding: 0 24px !important; border-radius: 999px !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body .inv-flow-steps { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 28px !important; margin: 0 !important; padding: 0 !important; list-style: none !important; counter-reset: none !important; }
html:root:not(#_) body.admin-body .inv-flow-step {
  --inv-step-fill: var(--tx-sage); --inv-step-text: var(--tx-on-sage);
  position: relative !important; display: flex !important; align-items: flex-start !important; gap: 12px !important; min-height: 96px !important; padding: 16px !important;
  background: var(--inv-step-fill) !important; color: var(--inv-step-text) !important; border: 2px solid var(--inv-step-fill) !important; border-radius: 18px !important;
}
html:root:not(#_) body.admin-body .inv-flow-step.is-apricot { --inv-step-fill: var(--tx-apricot); --inv-step-text: var(--tx-on-apricot); }
html:root:not(#_) body.admin-body .inv-flow-step.is-primary { --inv-step-fill: var(--tx-primary); --inv-step-text: var(--tx-on-primary); }
html:root:not(#_) body.admin-body .inv-flow-step :is(*, *::before, *::after) { color: inherit !important; }
html:root:not(#_) body.admin-body .inv-flow-step:not(:last-child)::after {
  content: "" !important; position: absolute !important; top: 50% !important; right: -21px !important; width: 12px !important; height: 12px !important; margin-top: -6px !important;
  border-top: 3px solid var(--tx-text) !important; border-right: 3px solid var(--tx-text) !important; transform: rotate(45deg) !important;
}
html:root:not(#_) body.admin-body .inv-flow-step-num {
  flex: 0 0 34px !important; display: grid !important; place-items: center !important; width: 34px !important; height: 34px !important; border-radius: 50% !important;
  background: var(--tx-text) !important; color: var(--tx-canvas) !important; font-family: var(--tx-font-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: 800 !important; font-variant-numeric: normal !important;
}
html:root:not(#_) body.admin-body .inv-flow-step-text { display: grid !important; gap: 4px !important; min-width: 0 !important; }
html:root:not(#_) body.admin-body .inv-flow-step-title { font-size: var(--tx-size-min) !important; font-weight: 800 !important; line-height: 1.2 !important; }
html:root:not(#_) body.admin-body .inv-flow-step-copy { font-size: 15px !important; font-weight: 600 !important; line-height: 1.4 !important; }
html:root:not(#_) body.admin-body .inv-flow-steps.is-tracked .inv-flow-step.is-upcoming { background: var(--tx-card) !important; color: var(--tx-text) !important; border-style: dashed !important; }
html:root:not(#_) body.admin-body .inv-flow-steps.is-tracked .inv-flow-step.is-active { box-shadow: 0 0 0 4px color-mix(in srgb, var(--inv-step-fill) 35%, transparent) !important; }
html:root:not(#_) body.admin-body .inv-flow-steps.is-tracked .inv-flow-step.is-done .inv-flow-step-num { font-size: 0 !important; }
html:root:not(#_) body.admin-body .inv-flow-steps.is-tracked .inv-flow-step.is-done .inv-flow-step-num::before { content: "✓" !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-steps { gap: 20px !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-step { flex-direction: column !important; min-height: 0 !important; padding: 12px !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-step:not(:last-child)::after { right: -16px !important; width: 9px !important; height: 9px !important; margin-top: -4px !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-step-copy { display: none !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-dropzone {
  min-height: 160px !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; padding: 24px 16px !important;
  background: color-mix(in srgb, var(--tx-apricot) 14%, var(--tx-card)) !important; border: 3px dashed var(--tx-apricot) !important; border-radius: var(--tx-radius-card) !important;
}
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-dropzone:is(:hover, .is-dragover) { background: color-mix(in srgb, var(--tx-apricot) 28%, var(--tx-card)) !important; border-style: solid !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-dropzone-title { color: var(--tx-text) !important; font-size: clamp(20px, 2vw, 21px) !important; font-weight: 800 !important; }
html:root:not(#_) body.admin-body #inventoryUploadModal .inventory-upload-dropzone-copy { color: var(--tx-text) !important; opacity: .8 !important; }
@media (max-width: 900px) {
  html:root:not(#_) body.admin-body .inv-flow-steps { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.admin-body .inv-flow-step:nth-child(2n)::after { display: none !important; }
  html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-steps { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-step:not(:last-child)::after { display: block !important; }
}
@media (max-width: 560px) {
  html:root:not(#_) body.admin-body .inv-flow { padding: 18px !important; }
  html:root:not(#_) body.admin-body .inv-flow-steps { grid-template-columns: 1fr !important; gap: 12px !important; }
  html:root:not(#_) body.admin-body .inv-flow-step::after { display: none !important; }
  html:root:not(#_) body.admin-body .inv-flow-copy { margin-left: 0 !important; }
  html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-steps { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 8px !important; }
  html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-step { padding: 8px !important; }
  html:root:not(#_) body.admin-body #inventoryUploadModal .inv-flow-step-title { font-size: 14px !important; }
}












/* Warehouse Settings: scoped administration workspace. Keep operational markup,
   hidden states and the separately generated barcode print documents intact. */
html:root:not(#_) body.warehouse-settings-page {
  --settings-panel-bg: var(--tx-card) !important; --settings-card-bg: var(--tx-row-alt) !important;
  --settings-card-bg-strong: var(--tx-card) !important; --settings-card-border: var(--tx-line) !important;
  --settings-card-shadow: none !important; --settings-text: var(--tx-text) !important; --settings-text-muted: var(--tx-text) !important;
  --settings-blue: var(--tx-numbers) !important; --settings-cyan: var(--tx-good-text) !important; --settings-purple: var(--tx-numbers) !important;
}
html:root:not(#_) body.warehouse-settings-page .dashboard-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.warehouse-settings-page .dashboard-container > * { margin: 0 !important; }
html:root:not(#_) body.warehouse-settings-page .dashboard-main * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important;
  background: var(--tx-brand-teal) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important;
  padding: clamp(20px, 3vw, 32px) !important; box-shadow: none !important;
}
html:root:not(#_) body.warehouse-settings-page .settings-hero .dashboard-hero-copy { flex: 1 1 500px !important; min-width: 0 !important; padding: 0 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero :is(.warehouse-name, .welcome-message, .dashboard-hero-description) { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero .warehouse-name { font-size: var(--tx-size-page-title) !important; margin: 8px 0 12px !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero .warehouse-name::before { background: var(--tx-brand-apricot) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero .settings-page-kicker { color: var(--tx-brand-mint) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero-description { max-width: 76ch !important; line-height: 1.6 !important; margin: 8px 0 16px !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero-actions { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 10px !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero .hero-action-btn { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; border-color: transparent !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero .activity-panel-link { background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important; border: 2px solid var(--tx-brand-mint) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-hero-pill { background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; border: 0 !important; box-shadow: none !important; letter-spacing: normal !important; }
html:root:not(#_) body.warehouse-settings-page #settings-content:not([hidden]) { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-panel, .settings-summary-panel, .settings-list-panel, .settings-detail-panel,
  .settings-form-section, .ship-from-address-card, .warehouse-worker-card, .console-worker-form, .console-worker-row,
  .bins-generate-panel, .bins-label-config-panel, .invite-card, .client-info-card, .settings-loading, .settings-feedback) {
  min-width: 0 !important; background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important; color: var(--tx-text) !important; box-shadow: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.warehouse-settings-page :is(.settings-hero, .settings-panel, .settings-summary-panel, .settings-list-panel,
  .settings-detail-panel, .settings-form-section, .ship-from-address-card, .warehouse-worker-card, .invite-card, .client-info-card, .settings-feedback, .barcode-preview-card)::before { content: none !important; }
html:root:not(#_) body.warehouse-settings-page .settings-summary-panel { background: transparent !important; border: 0 !important; padding: 0 !important; overflow: visible !important; }
html:root:not(#_) body.warehouse-settings-page .settings-summary-header { margin: 0 0 16px !important; }
html:root:not(#_) body.warehouse-settings-page .settings-summary-header .activity-panel-title { max-width: 70ch !important; font-size: var(--tx-size-body) !important; line-height: 1.45 !important; margin: 4px 0 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 14px !important; margin: 0 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card {
  --settings-kpi-fill: var(--tx-brand-teal); --settings-kpi-ink: var(--tx-on-primary); --settings-kpi-number: var(--tx-brand-apricot);
  display: flex !important; flex-direction: column !important; align-items: stretch !important; min-width: 0 !important; min-height: 150px !important;
  padding: 20px !important; background: var(--settings-kpi-fill) !important; color: var(--settings-kpi-ink) !important;
  border: 0 !important; border-radius: var(--tx-radius-card) !important; box-shadow: none !important; transform: none !important;
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card:nth-child(2) { --settings-kpi-fill: var(--tx-mid); --settings-kpi-number: var(--tx-on-primary); }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card:nth-child(3) { --settings-kpi-fill: var(--tx-apricot); --settings-kpi-ink: var(--tx-on-apricot); --settings-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card:nth-child(4) { --settings-kpi-fill: var(--tx-brand-mint); --settings-kpi-ink: var(--tx-brand-teal); --settings-kpi-number: var(--tx-brand-teal); }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card:nth-child(5) { --settings-kpi-fill: var(--tx-sage); --settings-kpi-ink: var(--tx-on-sage); --settings-kpi-number: var(--tx-on-sage); }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card::before { content: none !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card .stat-icon { display: none !important; }
/* Outrank the shared :has(icon) grid/contents layout without raising palette alias specificity. */
html:root:not(#_) body.warehouse-settings-page #settings-content .settings-stats-grid .stat-card { display: flex !important; }
html:root:not(#_) body.warehouse-settings-page #settings-content .settings-stats-grid .stat-content { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; gap: 14px !important; width: 100% !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-label { order: -1 !important; color: var(--settings-kpi-ink) !important; font-size: var(--tx-size-min) !important; line-height: 1.3 !important; text-align: center !important; white-space: normal !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-value {
  margin: auto 0 !important; background: none !important; color: var(--settings-kpi-number) !important; text-align: center !important;
  font-size: 30px !important; line-height: 1.1 !important; overflow-wrap: anywhere;
}
html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-value-small { font-size: 20px !important; white-space: normal !important; }
/* Settings sub-navigation: horizontal tab bar across the top of the content area. */
html:root:not(#_) body.warehouse-settings-page .settings-workspace { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; align-items: stretch !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stage { width: 100% !important; min-width: 0 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-tab-nav {
  display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important;
  width: 100% !important; box-sizing: border-box !important; padding: 10px !important; margin: 0 !important;
  background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
}
html:root:not(#_) body.warehouse-settings-page .settings-tab-btn {
  flex: 0 0 auto !important; min-height: 44px !important; height: auto !important; padding: 8px 18px !important; justify-content: center !important;
  border: 2px solid transparent !important; border-radius: 999px !important; background: transparent !important;
  color: var(--tx-text) !important; box-shadow: none !important; transform: none !important; white-space: nowrap !important;
}
html:root:not(#_) body.warehouse-settings-page .settings-tab-btn:hover { background: var(--tx-row-alt) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-tab-btn.active { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; border-color: var(--tx-primary) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-tab-btn :is(.settings-tab-btn-label, .settings-tab-btn-meta) { color: inherit !important; }
html:root:not(#_) body.warehouse-settings-page .settings-tab-panel { animation: none !important; }
html:root:not(#_) body.warehouse-settings-page .settings-tab-overview { background: var(--tx-row-alt) !important; border-left: 5px solid var(--tx-apricot) !important; padding: var(--tx-card-pad) !important; margin-bottom: var(--tx-gap) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-stage-title { font-size: var(--tx-size-section) !important; line-height: 1.25 !important; margin: 6px 0 10px !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-stage-copy, .settings-panel-copy, .settings-section-copy) { line-height: 1.6 !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-panel-kicker, .settings-page-kicker) { font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: .04em !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-panel-kicker, .settings-stage-title, .content-section-title, .settings-panel-title,
  .settings-stage-copy, .settings-panel-copy, .settings-toolbar-copy, .settings-section-copy, .settings-field-hint, .form-hint, .form-label,
  .settings-summary-row-title, .settings-summary-row-meta, .client-option-name, .client-option-meta, .worker-card-title, .worker-card-label,
  .worker-status-copy, .worker-activity-meta, .worker-card-signin, .worker-list-employee-number, .ship-from-address-title, .ship-from-default-toggle,
  .invite-card-note, .invite-card-note-empty, .invite-card-meta, .client-info-name, .client-info-meta, .console-worker-name,
  .console-worker-email, .console-worker-stations, .worker-detail-barcode, :where(.checkbox-card) strong, :where(.checkbox-card) small) { color: var(--tx-text) !important; opacity: 1 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-tab-panel > .dashboard-section:not(.settings-panel) { background: transparent !important; border: 0 !important; padding: 0 !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-panel, .settings-list-panel, .settings-detail-panel) { padding: var(--tx-card-pad) !important; overflow: visible !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-grid, .settings-form-grid, .ship-from-address-grid, .worker-card-grid) { gap: 16px !important; min-width: 0 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-form-grid, .ship-from-address-grid, .worker-card-grid) { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-split-layout { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.content-section-header, .settings-detail-header, .settings-detail-footer) { flex-wrap: wrap !important; gap: 12px !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.warehouse-settings-page .form-group { min-width: 0 !important; }
html:root:not(#_) body.warehouse-settings-page :is(.form-input, .worker-print-select) {
  min-width: 0 !important; max-width: 100% !important; min-height: var(--tx-btn-h) !important; padding: 10px 14px !important;
  border: 2px solid var(--tx-input-border) !important; border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important; font-size: var(--tx-size-min) !important;
}
html:root:not(#_) body.warehouse-settings-page .form-input::placeholder { color: var(--tx-text) !important; opacity: 1 !important; }
html:root:not(#_) body.warehouse-settings-page .form-input:focus { border-color: var(--tx-numbers) !important; box-shadow: none !important; }
html:root:not(#_) body.warehouse-settings-page :is(.checkbox-card, .checkbox-card-compact, .worker-status-toggle, .worker-print-select,
  .settings-summary-row-button, .client-option-card, .time-policy-preview, .settings-empty-state) {
  background: var(--tx-row-alt) !important; color: var(--tx-text) !important; border: 1.5px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-tile) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.warehouse-settings-page :is(.settings-summary-row-button:hover, .settings-summary-row.selected .settings-summary-row-button,
  .client-option-card:hover, .client-option-card.selected, .checkbox-card:has(input:checked)) { background: var(--tx-sage) !important; border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-summary-row.selected .settings-summary-row-button { border-left: 4px solid var(--tx-numbers) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.worker-summary-row.inactive, .warehouse-worker-card.inactive, .settings-summary-row.inactive .settings-summary-row-button) { opacity: 1 !important; }
html:root:not(#_) body.warehouse-settings-page .settings-summary-row.worker-summary-row { grid-template-columns: minmax(0, 1fr) !important; }
html:root:not(#_) body.warehouse-settings-page .worker-summary-button { display: flex !important; gap: 12px !important; align-items: flex-start !important; }
html:root:not(#_) body.warehouse-settings-page .settings-summary-row-header { flex-wrap: wrap !important; }
html:root:not(#_) body.warehouse-settings-page :is(.worker-card-signin, .settings-summary-row-title, .console-worker-email) { white-space: normal !important; overflow-wrap: anywhere; }
html:root:not(#_) body.warehouse-settings-page .worker-summary-avatar { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; box-shadow: none !important; }
html:root:not(#_) body.warehouse-settings-page .worker-summary-row.inactive .worker-summary-avatar { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.worker-barcode, .worker-list-barcode, .worker-card-role, .invite-card-code) { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.warehouse-settings-page .worker-summary-list { scrollbar-color: var(--tx-input-border) var(--tx-card); }
html:root:not(#_) body.warehouse-settings-page .worker-summary-list::-webkit-scrollbar-thumb { background: var(--tx-input-border) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-button, .hero-action-btn, .activity-panel-link, .address-remove-btn,
  .worker-print-button, .btn-copy-invite, .btn-revoke-invite, .btn-disconnect-client) {
  min-height: var(--tx-btn-h) !important; height: auto !important; padding: 10px 20px !important; border: 2px solid var(--tx-input-border) !important;
  border-radius: 999px !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important;
  transform: none !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; white-space: normal !important;
}
html:root:not(#_) body.warehouse-settings-page :is(.btn-primary, .worker-print-button) { background: var(--tx-primary) !important; border-color: transparent !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.address-remove-btn, .btn-revoke-invite, .btn-disconnect-client) { background: var(--tx-problem-bg) !important; border-color: var(--tx-problem-text) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-button, .worker-print-button, .btn-copy-invite, .btn-revoke-invite, .btn-disconnect-client):hover:not(:disabled) { text-decoration: underline !important; filter: none !important; }
html:root:not(#_) body.warehouse-settings-page .tab-actions-row { padding: 16px !important; margin-top: var(--tx-gap) !important; background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important; gap: 10px !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-row-badge, .worker-status-badge, .client-option-status, .section-badge, .bin-status-badge) {
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; border: 1px solid currentColor !important;
  border-radius: 999px !important; padding: 4px 10px !important; font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important; letter-spacing: normal !important; box-shadow: none !important;
}
html:root:not(#_) body.warehouse-settings-page :is(.settings-row-badge.success, .worker-status-badge.active, .worker-status-badge.badge-active, .settings-feedback.success) { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-row-badge.warning, .bin-status-in-use) { background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-row-badge.muted, .worker-status-badge.inactive, .worker-status-badge.badge-inactive, .bin-status-empty) { background: var(--tx-row-alt) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.warehouse-settings-page :is(.settings-feedback.error, .bin-status-full) { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-feedback.info { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.warehouse-settings-page .settings-feedback { border-left: 4px solid currentColor !important; }
html:root:not(#_) body.warehouse-settings-page .worker-status-badge.active::before { background: currentColor !important; box-shadow: none !important; animation: none !important; }
html:root:not(#_) body.warehouse-settings-page .form-hint--error { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.warehouse-settings-page .form-hint--ok { color: var(--tx-good-text) !important; }
html:root:not(#_) body.warehouse-settings-page #bins-list { overflow-x: auto !important; max-width: 100% !important; padding: 4px !important; }
html:root:not(#_) body.warehouse-settings-page .bins-table th { background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.warehouse-settings-page .bins-table td { background: transparent !important; color: var(--tx-text) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.warehouse-settings-page .bins-table tbody tr { background: var(--tx-card) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.warehouse-settings-page .bins-table tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.warehouse-settings-page .bins-table tbody tr:hover { background: var(--tx-sage) !important; }
/* Barcode SVGs already contain black bars on a white rect. Never recolor their fills. */
html:root:not(#_) body.warehouse-settings-page .barcode-preview-card { background: var(--tx-card) !important; border: 1.5px solid var(--tx-line) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
html:root:not(#_) body.warehouse-settings-page .settings-loading .loading-spinner { border-color: var(--tx-line) !important; border-top-color: var(--tx-primary) !important; }
html:root:not(#_) body.warehouse-settings-page :is(button, input, select, textarea):disabled { background: var(--tx-row-alt) !important; border-color: var(--tx-line) !important; color: var(--tx-text) !important; opacity: .65 !important; cursor: not-allowed !important; }
html:root:not(#_) body.warehouse-settings-page :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; box-shadow: none !important; }
@media (max-width: 1180px) {
  html:root:not(#_) body.warehouse-settings-page .settings-stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.warehouse-settings-page .settings-split-layout { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 700px) {
  html:root:not(#_) body.warehouse-settings-page .settings-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.warehouse-settings-page .settings-stats-grid .stat-card:last-child { grid-column: 1 / -1 !important; }
  html:root:not(#_) body.warehouse-settings-page .settings-hero-actions { width: 100% !important; }
  html:root:not(#_) body.warehouse-settings-page .settings-tab-nav { flex-wrap: nowrap !important; overflow-x: auto !important; scroll-snap-type: x proximity; scrollbar-width: thin; }
  html:root:not(#_) body.warehouse-settings-page .settings-tab-btn { scroll-snap-align: start; padding: 8px 14px !important; }
  html:root:not(#_) body.warehouse-settings-page :is(.invite-generate-row, .invite-card-actions, .workers-toolbar-actions, .console-worker-actions) { flex-wrap: wrap !important; }
  html:root:not(#_) body.warehouse-settings-page :is(.settings-grid, .settings-form-grid, .ship-from-address-grid, .worker-card-grid) { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 420px) {
  html:root:not(#_) body.warehouse-settings-page .settings-stats-grid { grid-template-columns: minmax(0, 1fr) !important; }
}
/* Guard hidden loading, tab, feedback and cadence containers from legacy display rules. */
html:root:not(#_) body.warehouse-settings-page [hidden] { display: none !important; }
/* End Warehouse Settings */

/* Labor Trax: dashboard, administration and timeclock kiosk. Legacy --labor-* roles resolve to master tokens on the page body
   (the chart palette is read from body). Kiosk steps, feedback, history trigger and action grid are shown/hidden by inline
   display from labor-auth.js, so no display declarations are set on those elements here. */
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page, .labor-trax-kiosk) {
  --labor-cyan: var(--tx-numbers) !important; --labor-violet: var(--tx-pending-text) !important; --labor-emerald: var(--tx-good-text) !important;
  --labor-surface: var(--tx-card) !important; --labor-surface-strong: var(--tx-card) !important; --labor-border: var(--tx-line) !important;
  --labor-text: var(--tx-text) !important; --labor-muted: var(--tx-text) !important; --labor-dim: var(--tx-text) !important;
  --labor-hero-background: var(--tx-brand-teal) !important; --labor-hero-shadow: none !important; --labor-title-gradient: none !important;
  --labor-kicker: var(--tx-numbers) !important; --labor-mark-border: var(--tx-line) !important; --labor-mark-background: var(--tx-sage) !important; --labor-mark-shadow: none !important;
  --labor-panel-background: var(--tx-card) !important; --labor-panel-shadow: none !important;
  --labor-control-surface: var(--tx-card) !important; --labor-control-hover: var(--tx-row-alt) !important; --labor-control-shadow: none !important;
  --labor-on-accent: var(--tx-on-primary) !important; --labor-primary-shadow: none !important; --labor-primary-hover-shadow: none !important;
  --labor-secondary-text: var(--tx-text) !important; --labor-secondary-hover-border: var(--tx-numbers) !important; --labor-placeholder: var(--tx-text) !important;
  --labor-focus-border: var(--tx-numbers) !important; --labor-focus-ring: 0 0 0 3px var(--tx-focus) !important;
  --labor-table-surface: var(--tx-card) !important; --labor-table-head: var(--tx-table-head-bg) !important; --labor-table-head-text: var(--tx-table-head-text) !important;
  --labor-row-hover: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important;
  --labor-avatar-background: var(--tx-sage) !important; --labor-avatar-border: var(--tx-line) !important;
  --labor-status-out-surface: var(--tx-row-alt) !important; --labor-status-out-border: var(--tx-line) !important; --labor-status-out-text: var(--tx-text) !important;
  --labor-status-in-surface: var(--tx-good-bg) !important; --labor-status-in-border: var(--tx-good-text) !important;
  --labor-card-shadow: none !important; --labor-card-hover-border: var(--tx-numbers) !important; --labor-card-hover-shadow: none !important;
  --labor-danger: var(--tx-problem-text) !important; --labor-danger-border: var(--tx-problem-text) !important;
  --labor-danger-hover: var(--tx-problem-bg) !important; --labor-danger-hover-border: var(--tx-problem-text) !important;
  --labor-chart-surface: var(--tx-card) !important; --labor-chart-bar: var(--tx-mid) !important; --labor-chart-border: var(--tx-primary) !important;
  --labor-chart-text: var(--tx-text) !important; --labor-chart-grid: var(--tx-line) !important;
  --labor-modal-overlay: color-mix(in srgb, var(--tx-brand-teal) 72%, transparent) !important; --labor-modal-shadow: none !important;
  --labor-modal-detail-surface: var(--tx-row-alt) !important; --labor-modal-detail-border: var(--tx-line) !important;
  --labor-kiosk-canvas: var(--tx-canvas) !important; --labor-kiosk-surface: var(--tx-card) !important; --labor-kiosk-surface-soft: var(--tx-row-alt) !important;
  --labor-kiosk-text: var(--tx-text) !important; --labor-kiosk-muted: var(--tx-text) !important; --labor-kiosk-border: var(--tx-line) !important;
  --labor-kiosk-border-strong: var(--tx-input-border) !important; --labor-kiosk-accent: var(--tx-numbers) !important; --labor-kiosk-accent-soft: var(--tx-sage) !important;
  --labor-kiosk-accent-secondary: var(--tx-pending-text) !important; --labor-kiosk-accent-secondary-soft: var(--tx-pending-bg) !important;
  --labor-kiosk-success: var(--tx-good-text) !important; --labor-kiosk-success-surface: var(--tx-good-bg) !important;
  --labor-kiosk-danger: var(--tx-problem-text) !important; --labor-kiosk-danger-surface: var(--tx-problem-bg) !important;
  --labor-kiosk-focus: 0 0 0 3px var(--tx-focus) !important; --labor-kiosk-history-surface: var(--tx-card) !important;
  --labor-kiosk-history-card: var(--tx-row-alt) !important; --labor-kiosk-shadow: none !important;
  background: var(--tx-canvas) !important; background-image: none !important; color: var(--tx-text) !important;
}
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page, .labor-trax-kiosk) main * { -webkit-text-fill-color: currentColor !important; text-shadow: none !important; }
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page, .labor-trax-kiosk) :focus-visible { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; box-shadow: none !important; }

/* Shared deep-teal hero: mint kicker, white title with apricot bar, apricot/mint accent badges. */
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-container { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; max-width: none !important; }
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-container > * { margin: 0 !important; }
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .page-header.dashboard-hero {
  position: relative !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important;
  min-height: 0 !important; padding: clamp(20px, 3vw, 32px) !important; border: 0 !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-brand-teal) !important; background-image: none !important; color: var(--tx-on-primary) !important; box-shadow: none !important; overflow: hidden !important;
}
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-hero > .warehouse-branding.dashboard-hero-copy {
  flex: 1 1 420px !important; min-width: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  background: transparent !important; background-image: none !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-hero .dashboard-kicker {
  display: inline-flex !important; color: var(--tx-brand-mint) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  letter-spacing: .04em !important; text-transform: uppercase !important;
}
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-hero .warehouse-name {
  display: flex !important; align-items: center !important; gap: 12px !important; margin: 8px 0 12px !important; color: var(--tx-on-primary) !important;
  font-family: var(--tx-font) !important; font-size: var(--tx-size-page-title) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important;
  background: none !important;
}
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-hero .warehouse-name::before { background: var(--tx-brand-apricot) !important; }
html:root:not(#_) body:is(.labor-dashboard-page, .labor-admin-page) .dashboard-hero .dashboard-hero-description { max-width: 76ch !important; margin: 0 !important; color: var(--tx-on-primary) !important; line-height: 1.6 !important; }
html:root:not(#_) body.labor-dashboard-page #live-digital-clock {
  display: inline-flex !important; margin: 4px 0 !important; padding: 6px 18px !important; border-radius: 999px !important;
  background: var(--tx-brand-apricot) !important; color: var(--tx-brand-teal) !important; font-family: var(--tx-font) !important;
  font-size: clamp(30px, 3.4vw, 35px) !important; font-variant-numeric: tabular-nums; line-height: 1.15 !important; text-shadow: none !important;
}
html:root:not(#_) body.labor-dashboard-page #current-date-display { margin: 8px 0 16px !important; color: var(--tx-brand-mint) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; text-shadow: none !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-hero-mark {
  width: 64px !important; height: 64px !important; border: 0 !important; border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; box-shadow: none !important; font-size: 30px !important;
}

/* Labor dashboard launch cards: 2 columns, 1 from 760px. */
html:root:not(#_) body.labor-dashboard-page .labor-dash-grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; margin: 0 !important; }
html:root:not(#_) body.labor-dashboard-page .labor-action-card {
  display: flex !important; flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 12px !important;
  min-width: 0 !important; padding: var(--tx-card-pad) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; text-align: left !important; text-decoration: none !important;
  box-shadow: none !important; transform: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-card:hover { border-color: var(--tx-numbers) !important; background: var(--tx-row-alt) !important; box-shadow: none !important; transform: none !important; }
html:root:not(#_) body.labor-dashboard-page .labor-action-icon {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 64px !important; height: 64px !important; margin: 0 !important;
  border-radius: var(--tx-radius-tile) !important; font-size: 34px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-card.clock .labor-action-icon { background: var(--tx-brand-apricot) !important; color: var(--tx-on-apricot) !important; }
html:root:not(#_) body.labor-dashboard-page .labor-action-card.admin .labor-action-icon { background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; }
html:root:not(#_) body.labor-dashboard-page .labor-action-title { margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-section) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.25 !important; }
html:root:not(#_) body.labor-dashboard-page .labor-action-desc { max-width: 60ch !important; margin: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-body) !important; line-height: 1.55 !important; }

/* Labor administration: settings-panel cards, content-section headers, pill buttons, 2px form fields, teal-band tables. */
html:root:not(#_) body.labor-admin-page .labor-admin-panel {
  margin: 0 !important; padding: var(--tx-card-pad) !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.labor-admin-page :is(.labor-admin-panel, .search-filter-section)::before,
html:root:not(#_) body.labor-admin-page :is(.labor-admin-panel, .search-filter-section)::after { content: none !important; }
html:root:not(#_) body.labor-admin-page .content-section-header { display: flex !important; flex-wrap: wrap !important; align-items: flex-start !important; gap: 12px !important; padding-bottom: 14px !important; border-bottom: 1.5px solid var(--tx-line) !important; }
html:root:not(#_) body.labor-admin-page :is(.content-section-title, .labor-admin-modal-card h3, .labor-exception-inbox-heading h4) {
  margin: 0 !important; color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-size: var(--tx-size-section) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.25 !important;
}
html:root:not(#_) body.labor-admin-page .labor-admin-main .labor-admin-modal-kicker { color: var(--tx-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-report-range-label, .labor-report-feedback, .labor-admin-empty-state, .labor-admin-form-note, .labor-admin-modal-detail, label, legend, dt, dd, p, small, time) { color: var(--tx-text) !important; opacity: 1 !important; }
html:root:not(#_) body.labor-admin-page :is(.search-filter-section, .labor-report-summary-range, .labor-exception-inbox, .labor-report-worker, .labor-report-summary-card, .labor-weekly-workbench,
  .labor-exception-card, .labor-exception-adjustment-worksheet, .labor-attendance-deletion-confirmation, .labor-admin-chart-shell, .employee-card, .labor-admin-activity-card) {
  border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; background-image: none !important;
  color: var(--tx-text) !important; box-shadow: none !important; transform: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.labor-admin-page .search-filter-section { padding: 16px !important; margin: 16px 0 0 !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-report-worker, .employee-card, .labor-admin-activity-card, .labor-exception-card):hover { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker.has-warning { border-left: 4px solid var(--tx-apricot) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-report-summary-card strong, .labor-weekly-metrics strong, .labor-timecard-totals dd) { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page :is(.settings-input, .form-input, .details-input) {
  min-height: var(--tx-btn-h) !important; padding: 10px 14px !important; border: 2px solid var(--tx-input-border) !important; border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important; font-size: var(--tx-size-min) !important;
}
html:root:not(#_) body.labor-admin-page :is(.settings-input, .form-input, .details-input):focus { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.labor-admin-page :is(.settings-input, .form-input, .details-input)::placeholder { color: var(--tx-text) !important; opacity: 1 !important; }
html:root:not(#_) body.labor-admin-page :is(.btn-primary, .btn-secondary, .labor-admin-row-action, .labor-attendance-tab, .labor-report-toggle-options label, .view-toggle-btn) {
  min-height: var(--tx-btn-h) !important; padding: 0 20px !important; border-radius: 999px !important; font-family: var(--tx-font) !important;
  font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; box-shadow: none !important; transform: none !important; filter: none !important;
}
html:root:not(#_) body.labor-admin-page .btn-primary { border: 0 !important; background: var(--tx-primary) !important; background-image: none !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.labor-admin-page :is(.btn-secondary, .labor-admin-row-action, .labor-attendance-tab, .labor-report-toggle-options label, .view-toggle-btn:not(.active)) {
  border: 2px solid var(--tx-input-border) !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important;
}
html:root:not(#_) body.labor-admin-page :is(.btn-primary, .btn-secondary, .labor-admin-row-action):hover:not(:disabled) { text-decoration: underline !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-attendance-tab[aria-selected="true"], .labor-report-toggle-options input:checked + label, .view-toggle-btn.active) {
  border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important;
}
html:root:not(#_) body.labor-admin-page .labor-report-toggle-options input:focus-visible + label { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-row-action.is-danger, .labor-attendance-deletion-action.is-danger) { border-color: var(--tx-problem-text) !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.labor-admin-page :is(button, input, select, textarea):disabled { opacity: .6 !important; cursor: not-allowed !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-status-pill { border-radius: 999px !important; border: 1.5px solid currentColor !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-status-pill.is-clocked-in { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-status-pill.is-on-lunch { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-status-pill.is-clocked-out, .labor-admin-status-pill.is-disabled) { background: var(--tx-row-alt) !important; color: var(--tx-text) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table-shell, .labor-report-details-shell) { overflow-x: auto !important; max-width: 100% !important; border: 1.5px solid var(--tx-line) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table, .labor-report-details-table) thead :is(th, td) { background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table, .labor-report-details-table) tbody tr { background: var(--tx-card) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table, .labor-report-details-table) tbody tr:nth-child(even) { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table, .labor-report-details-table) tbody tr:hover :is(td, th) { background: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table, .labor-report-details-table) td { color: var(--tx-text) !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-modal-card {
  border: 1.5px solid var(--tx-line) !important; border-top: 6px solid var(--tx-brand-teal) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.labor-admin-page .labor-admin-modal-close { border: 2px solid var(--tx-input-border) !important; border-radius: 999px !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-manager-feedback.is-error { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; border-color: var(--tx-problem-text) !important; }
html:root:not(#_) body.labor-admin-page .labor-weekly-day-tile[aria-pressed="true"] { border-color: var(--tx-primary) !important; background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-weekly-day-tile.is-threshold-crossing, .labor-weekly-day-tile.is-after-threshold) { border-color: var(--tx-apricot) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-roster { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }

/* Labor admin parity with Wave Planning / Carrier Accounts: mint hero subtitle, teal-first centred summary cards,
   white worker cards with sentence-case metric labels, single-line status pills. */
html:root:not(#_) body.labor-admin-page .dashboard-hero .dashboard-hero-description { color: var(--tx-brand-mint) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-metrics { gap: var(--tx-gap) !important; margin-top: var(--tx-gap) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-card {
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  min-width: 0 !important; padding: 18px 12px !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; text-align: center !important;
}
html:root:not(#_) body.labor-admin-page .labor-report-summary-card span { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0 !important; text-transform: none !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-card strong { color: var(--tx-numbers) !important; font-family: var(--tx-font) !important; font-size: 1.6rem !important; line-height: 1.1 !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-card:first-child { border-color: var(--tx-brand-teal) !important; background: var(--tx-brand-teal) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-card:first-child :is(span, strong) { color: var(--tx-on-primary) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-card:last-child strong { color: var(--tx-problem-text) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-summary-range { padding: 16px 18px !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-report-summary-kicker, .labor-report-range-dates dt) { color: var(--tx-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker { display: flex !important; flex-direction: column !important; padding: var(--tx-card-pad) !important; border-radius: var(--tx-radius-card) !important; background: var(--tx-card) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-heading h4 { margin: 0 0 4px !important; color: var(--tx-text) !important; font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-heading > div > span { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; margin: 14px 0 !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-metrics > div { padding: 8px 10px !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-metrics dt { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: 0 !important; text-transform: none !important; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-metrics dd { margin: 2px 0 0 !important; color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.labor-admin-page .labor-report-worker-actions { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: auto !important; }
html:root:not(#_) body.labor-admin-page .labor-report-warning { border-radius: var(--tx-radius-tile) !important; border: 1.5px solid var(--tx-problem-text) !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-status-pill, .labor-exception-status) { display: inline-flex !important; align-items: center !important; padding: 4px 12px !important; white-space: nowrap !important; line-height: 1.3 !important; letter-spacing: 0 !important; text-transform: none !important; }
html:root:not(#_) body.labor-admin-page .labor-exception-status { border: 1.5px solid currentColor !important; border-radius: 999px !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page :is(.labor-admin-table, .labor-report-details-table) :is(.employee-name-cell, .employee-badge-cell) { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page input.labor-admin-search { width: 100% !important; max-width: 560px !important; }
html:root:not(#_) body.labor-admin-page .labor-report-toggle-options label { white-space: nowrap !important; }
html:root:not(#_) body.labor-admin-page .labor-admin-activity-card { background: var(--tx-card) !important; }
html:root:not(#_) body.labor-admin-page [hidden] { display: none !important; }

/* Labor administration layout: layered cards with soft depth, one control card for the report filters,
   segmented range/view controls, left-aligned KPI tiles, equal-height worker cards, and a timesheet
   whose employee list and grid always fit their boxes. The #ptx-page-content scope outranks the flat
   rules above; panels are size containers so the layout follows the panel, framed or not. */
html:root:not(#_) body.labor-admin-page {
  --la-line: color-mix(in srgb, var(--tx-line) 80%, transparent);
  --la-muted: color-mix(in srgb, var(--tx-text) 70%, var(--tx-card));
  --la-shadow-sm: 0 1px 2px rgba(16, 32, 31, 0.06), 0 4px 14px -6px rgba(16, 32, 31, 0.14);
  --la-shadow-md: 0 1px 3px rgba(16, 32, 31, 0.06), 0 16px 36px -18px rgba(16, 32, 31, 0.30);
  --la-shadow-lift: 0 2px 4px rgba(16, 32, 31, 0.06), 0 20px 40px -18px rgba(16, 32, 31, 0.34);
}
html[data-theme="dark"]:root:not(#_) body.labor-admin-page {
  --la-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 6px 16px -8px rgba(0, 0, 0, 0.55);
  --la-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.35), 0 18px 40px -18px rgba(0, 0, 0, 0.7);
  --la-shadow-lift: 0 2px 4px rgba(0, 0, 0, 0.4), 0 22px 44px -18px rgba(0, 0, 0, 0.75);
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-container { gap: 22px !important; }

/* Hero: deep teal with a soft mint glow and a glass icon tile. */
html:root:not(#_) body.labor-admin-page #ptx-page-content .page-header.dashboard-hero {
  padding: 28px 32px !important; box-shadow: var(--la-shadow-md) !important;
  background: radial-gradient(120% 160% at 100% 0%, rgba(124, 196, 181, 0.30) 0%, transparent 55%),
    linear-gradient(135deg, var(--tx-brand-teal) 0%, color-mix(in srgb, var(--tx-brand-teal) 78%, #000) 100%) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-hero-mark {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto !important;
  width: 76px !important; height: 76px !important; border: 1px solid rgba(255, 255, 255, 0.28) !important; border-radius: 22px !important;
  background: rgba(255, 255, 255, 0.12) !important; color: var(--tx-brand-mint) !important; font-size: 38px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
}

/* Panels and section headings (apricot bar, as in the hero title). */
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-panel {
  container-type: inline-size; padding: 26px 28px !important; border: 1px solid var(--la-line) !important; box-shadow: var(--la-shadow-md) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-panel > .content-section-header { margin: 0 0 18px !important; padding: 0 !important; border: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-panel .content-section-title { display: flex !important; align-items: center !important; gap: 12px !important; margin: 4px 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-panel .content-section-title::before {
  content: '' !important; flex: 0 0 auto; width: 6px; height: 26px; border-radius: 3px; background: var(--tx-apricot);
}
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-range-label, .labor-report-feedback) { margin: 0 !important; color: var(--la-muted) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-feedback:not(:empty) { margin-top: 14px !important; }

/* Buttons and fields. */
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.btn-secondary, .labor-admin-row-action) {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  min-height: 44px !important; padding: 0 18px !important; border: 1.5px solid color-mix(in srgb, var(--tx-input-border) 45%, var(--tx-card)) !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; white-space: nowrap !important; text-decoration: none !important;
  box-shadow: 0 1px 2px rgba(16, 32, 31, 0.06) !important; transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.btn-secondary, .labor-admin-row-action):hover:not(:disabled) {
  border-color: var(--tx-numbers) !important; background: var(--tx-row-alt) !important; text-decoration: none !important; box-shadow: var(--la-shadow-sm) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .settings-input {
  min-height: 44px !important; max-width: 100% !important; padding: 8px 14px !important; border: 1.5px solid color-mix(in srgb, var(--tx-input-border) 45%, var(--tx-card)) !important;
  border-radius: 12px !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: 0 1px 2px rgba(16, 32, 31, 0.05) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .settings-input:focus { border-color: var(--tx-numbers) !important; }

/* Report controls: the filter and display bars read as one card. */
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-controls, .labor-report-toolbar) {
  margin: 0 !important; padding: 18px 20px !important; border: 1px solid var(--la-line) !important; background: var(--tx-row-alt) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-controls { border-bottom: 0 !important; border-radius: 18px 18px 0 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-toolbar { border-radius: 0 0 18px 18px !important; border-top: 1px dashed var(--la-line) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-filter-controls, .labor-report-view-controls) {
  display: flex !important; flex-wrap: wrap !important; align-items: flex-end !important; gap: 16px 28px !important; width: 100% !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: transparent !important; box-shadow: none !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-export-select { margin-left: auto !important; min-width: 210px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-toggle-group legend, .labor-report-date-control) {
  margin: 0 0 8px !important; padding: 0 !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-date-control { display: grid !important; gap: 8px !important; margin: 0 !important; }

/* Segmented controls: report range and Cards/Details. */
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-toggle-options, .labor-report-view-toggle) {
  display: inline-flex !important; flex-wrap: nowrap !important; gap: 4px !important; margin: 0 !important; padding: 4px !important;
  border: 1px solid var(--la-line) !important; border-radius: 999px !important; background: var(--tx-card) !important; box-shadow: inset 0 1px 2px rgba(16, 32, 31, 0.07) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-toggle-options label, .labor-report-view-toggle .view-toggle-btn) {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; min-height: 40px !important; padding: 0 18px !important;
  border: 0 !important; border-radius: 999px !important; background: transparent !important; color: var(--tx-text) !important; cursor: pointer;
  white-space: nowrap !important; text-decoration: none !important; box-shadow: none !important; transition: background-color .15s ease, color .15s ease !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-toggle-options input:not(:checked) + label, .labor-report-view-toggle .view-toggle-btn:not(.active)):hover { background: var(--tx-row-alt) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.labor-report-toggle-options input:checked + label, .labor-report-view-toggle .view-toggle-btn.active) {
  background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; box-shadow: 0 2px 8px -2px color-mix(in srgb, var(--tx-primary) 70%, transparent) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-view-toggle .view-toggle-btn svg { width: 18px !important; height: 18px !important; }

/* Selected range strip and KPI tiles. */
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary { display: grid !important; gap: 16px !important; margin-top: 22px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-range {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 14px 36px !important; padding: 16px 20px !important;
  border: 1px solid var(--la-line) !important; border-radius: 18px !important;
  background: linear-gradient(90deg, color-mix(in srgb, var(--tx-sage) 60%, var(--tx-card)) 0%, var(--tx-card) 100%) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-range > div:first-child { display: grid !important; gap: 2px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-range strong { font-size: 22px !important; color: var(--tx-text) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-range-dates { display: flex !important; gap: 28px !important; margin: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-range-dates dd { margin: 2px 0 0 !important; font-weight: var(--tx-weight-bold) !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-navigation { display: flex !important; gap: 8px !important; margin-left: auto !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-metrics { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important; gap: 14px !important; margin: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card {
  position: relative !important; overflow: hidden !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important;
  justify-content: space-between !important; gap: 10px !important; min-height: 116px !important; padding: 20px 20px 18px !important; text-align: left !important;
  border: 1px solid var(--la-line) !important; border-radius: 18px !important; background: var(--tx-card) !important; box-shadow: var(--la-shadow-sm) !important;
  --la-accent: var(--tx-mid);
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--la-accent); }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card:nth-child(3) { --la-accent: var(--tx-apricot); }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card:nth-child(4) { --la-accent: var(--tx-good-text); }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card:last-child { --la-accent: var(--tx-problem-text); }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card span { color: var(--la-muted) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card strong { font-size: 34px !important; letter-spacing: -0.02em !important; line-height: 1 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card:first-child {
  border-color: transparent !important; box-shadow: 0 14px 30px -16px color-mix(in srgb, var(--tx-brand-teal) 80%, transparent) !important;
  background: linear-gradient(135deg, var(--tx-brand-teal) 0%, color-mix(in srgb, var(--tx-brand-teal) 70%, var(--tx-brand-teal-mid)) 100%) !important; --la-accent: var(--tx-brand-mint);
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-card:first-child span { color: color-mix(in srgb, var(--tx-on-primary) 82%, transparent) !important; }

/* Worker cards: equal heights, badge on its own line, actions pinned to the bottom. */
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-roster {
  display: grid !important; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)) !important; gap: 16px !important; margin: 0 !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker {
  display: flex !important; flex-direction: column !important; gap: 14px !important; min-width: 0 !important; padding: 18px !important;
  border: 1px solid var(--la-line) !important; border-radius: 18px !important; background: var(--tx-card) !important; box-shadow: var(--la-shadow-sm) !important;
  transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker:hover {
  border-color: color-mix(in srgb, var(--tx-numbers) 45%, var(--tx-line)) !important; box-shadow: var(--la-shadow-lift) !important; transform: translateY(-2px) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker.has-warning {
  border: 1px solid color-mix(in srgb, var(--tx-apricot) 60%, var(--tx-line)) !important;
  background: linear-gradient(180deg, color-mix(in srgb, var(--tx-apricot) 12%, var(--tx-card)) 0%, var(--tx-card) 42%) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-heading { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 4px 12px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-heading > div { display: contents !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-heading h4 {
  grid-row: 1; grid-column: 1; min-width: 0; margin: 0 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 22px !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-heading .labor-admin-status-pill { grid-row: 1; grid-column: 2; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-heading > div > span {
  grid-row: 2; grid-column: 1 / -1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--la-muted) !important; font-variant-numeric: tabular-nums; letter-spacing: 0.02em !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-metrics { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; margin: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-metrics > div { padding: 10px 12px !important; border-radius: 12px !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-metrics dt { color: var(--la-muted) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-metrics dd { margin: 2px 0 0 !important; font-size: 22px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-warning {
  display: flex !important; align-items: center !important; gap: 8px !important; margin: 0 !important; padding: 8px 12px !important;
  border: 0 !important; border-radius: 12px !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker-actions { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 8px !important; margin-top: auto !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker .labor-admin-row-action { width: 100% !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker .labor-admin-row-action:first-child {
  border-color: transparent !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-worker .labor-admin-row-action:first-child:hover:not(:disabled) { background: color-mix(in srgb, var(--tx-primary) 86%, #000) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-admin-status-pill { padding: 3px 12px !important; border-width: 1px !important; }

/* Details view: the table fits the panel; badge under the name, actions stacked. */
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-shell {
  overflow-x: auto !important; border: 1px solid var(--la-line) !important; border-radius: 18px !important; background: var(--tx-card) !important; box-shadow: var(--la-shadow-sm) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table { width: 100% !important; min-width: 760px !important; border-collapse: separate !important; border-spacing: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table caption { padding: 14px 18px !important; color: var(--la-muted) !important; font-size: var(--tx-size-min) !important; text-align: left !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table thead th {
  padding: 12px 9px !important; font-size: var(--tx-size-min) !important; letter-spacing: 0.02em !important; text-transform: none !important; white-space: nowrap !important; text-align: left !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table :is(thead th, td):first-child { padding-left: 16px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table :is(thead th, td):last-child { padding-right: 16px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table td { padding: 12px 9px !important; border-bottom: 1px solid var(--la-line) !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table tbody tr:last-child td { border-bottom: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table td:first-child { min-width: 170px; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table .employee-meta-cell { color: var(--la-muted) !important; font-size: var(--tx-size-min) !important; white-space: nowrap !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table .labor-report-warning { display: inline-flex !important; margin-top: 6px !important; padding: 4px 10px !important; white-space: nowrap !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table .labor-report-worker-actions { display: grid !important; gap: 6px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-details-table .labor-admin-row-action { width: 100% !important; min-height: 38px !important; padding: 0 12px !important; }

/* Timesheet editor dialog. */
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-modal { background: color-mix(in srgb, var(--tx-brand-teal) 55%, transparent) !important; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-modal-card {
  gap: 16px !important; width: min(100%, 560px) !important; padding: 0 0 22px !important; border: 0 !important; border-radius: 22px !important;
  background: var(--tx-card) !important; box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.45) !important; overflow: hidden auto !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-modal-card > * { margin-left: 24px !important; margin-right: 24px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-modal-card > .lts-drawer-head {
  align-items: center !important; margin: 0 !important; padding: 18px 24px !important; background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-drawer-head h4 { color: var(--tx-on-primary) !important; font-size: 22px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-x {
  display: inline-grid !important; place-items: center !important; width: 38px !important; height: 38px !important; border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.14) !important; color: var(--tx-on-primary) !important; font-size: 24px !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-kv { padding: 14px 16px !important; border-radius: 14px !important; background: var(--tx-row-alt) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.lts-kv dt, .lts-hint) { color: var(--la-muted) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-field { gap: 8px !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-chips { gap: 8px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-chip {
  min-height: 38px !important; padding: 0 14px !important; border: 1.5px solid var(--la-line) !important; border-radius: 999px !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-semibold) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-chip:hover { border-color: var(--tx-numbers) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-chip[aria-pressed="true"] { border-color: var(--tx-primary) !important; background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.lts-impact, .lts-banner) { border-radius: 12px !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-actions { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; padding-top: 6px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-actions .btn-primary { min-height: 44px !important; padding: 0 26px !important; }

/* Timesheets: employee list and week grid side by side; both always fit their boxes. */
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-layout { display: grid !important; grid-template-columns: 236px minmax(0, 1fr) !important; gap: 20px !important; align-items: start !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-rail {
  display: grid !important; gap: 10px !important; min-width: 0 !important; padding: 12px !important;
  border: 1px solid var(--la-line) !important; border-radius: 18px !important; background: var(--tx-row-alt) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-rail #lts-search { width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-rail-list { display: grid !important; align-content: start !important; gap: 4px !important; max-height: 680px !important; overflow-y: auto !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-emp {
  display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 2px 10px !important;
  height: auto !important; min-height: 64px !important; padding: 10px 12px !important; border: 0 !important; border-radius: 12px !important;
  background: transparent !important; color: var(--tx-text) !important; line-height: 1.3 !important; text-align: left !important; cursor: pointer;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-emp:hover { background: color-mix(in srgb, var(--tx-card) 70%, transparent) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-emp[aria-current="true"] { background: var(--tx-card) !important; box-shadow: inset 4px 0 0 var(--tx-primary), var(--la-shadow-sm) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-emp b { grid-column: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-emp-status { grid-column: 1; min-width: 0; color: var(--la-muted) !important; font-size: var(--tx-size-min) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-count {
  grid-row: 1 / span 2; grid-column: 2; display: inline-grid !important; place-items: center !important; min-width: 30px !important; height: 30px !important; padding: 0 8px !important;
  border-radius: 999px !important; background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.lts-sheet, .lts-attention) {
  min-width: 0 !important; overflow: hidden !important; border: 1px solid var(--la-line) !important; border-radius: 18px !important;
  background: var(--tx-card) !important; box-shadow: var(--la-shadow-sm) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-sheet-head {
  display: grid !important; gap: 14px !important; padding: 18px 20px !important; border-bottom: 1px solid var(--la-line) !important;
  background: linear-gradient(180deg, var(--tx-row-alt) 0%, var(--tx-card) 100%) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-who { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px 12px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-who h4 { margin: 0 !important; font-size: 24px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-badge { color: var(--la-muted) !important; font-size: var(--tx-size-min) !important; font-variant-numeric: tabular-nums; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-nav { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 10px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-nav :is(.btn-secondary, .settings-input) { min-height: 42px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-week-label { padding: 0 6px !important; font-weight: var(--tx-weight-bold) !important; white-space: nowrap !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-jump { display: inline-flex !important; align-items: center !important; gap: 8px !important; color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-now summary { color: var(--tx-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table { width: 100% !important; min-width: 0 !important; table-layout: fixed !important; border-collapse: separate !important; border-spacing: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table thead th {
  padding: 12px 10px !important; background: var(--tx-table-head-bg) !important; color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important; line-height: 1.2 !important; letter-spacing: 0.02em !important; text-transform: none !important; vertical-align: bottom !important; white-space: normal !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table thead th:first-child { width: 112px; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table thead th.lts-pay { width: 108px; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table thead th:last-child { width: 140px; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table :is(td, tbody th) { padding: 6px 4px !important; border-bottom: 1px solid var(--la-line) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table tbody th { padding-left: 12px !important; text-align: left !important; text-transform: none !important; letter-spacing: 0 !important; white-space: normal !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table .lts-pay { padding-right: 12px !important; white-space: nowrap !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table :is(.lts-time, .lts-meta) { white-space: nowrap !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table .lts-day :is(b, span) { display: block !important; line-height: 1.25 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table .lts-day span { color: var(--la-muted) !important; font-size: var(--tx-size-min) !important; font-weight: 500 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table tr.is-today :is(td, th) { background: color-mix(in srgb, var(--tx-apricot) 14%, var(--tx-card)) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table tr.is-today .lts-day { box-shadow: inset 4px 0 0 var(--tx-apricot); }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-cell { min-width: 0 !important; min-height: 42px !important; padding: 6px !important; align-content: center !important; border-radius: 10px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-cell:hover { border: 1px dashed color-mix(in srgb, var(--tx-numbers) 60%, transparent) !important; background: var(--tx-row-alt) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-flag {
  display: inline-flex !important; padding: 3px 10px !important; border: 0 !important; border-radius: 999px !important;
  background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; font-size: var(--tx-size-min) !important; line-height: 1.25 !important; white-space: normal !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-flag:is(.is-settled, .is-info) { background: var(--tx-row-alt) !important; color: var(--la-muted) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-week-total :is(th, td) {
  padding-top: 14px !important; padding-bottom: 14px !important; border-bottom: 0 !important; background: color-mix(in srgb, var(--tx-sage) 55%, var(--tx-card)) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-week-total td[colspan] { padding-left: 12px !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-attention-head {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important;
  padding: 14px 18px !important; border-bottom: 1px solid var(--la-line) !important; background: var(--tx-row-alt) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-attention-head h4 { margin: 0 !important; font-size: var(--tx-size-body) !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-attention-list { display: grid !important; gap: 10px !important; padding: 14px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-item {
  display: grid !important; gap: 8px !important; padding: 14px 16px !important; border: 1px solid var(--la-line) !important; border-radius: 14px !important;
  background: var(--tx-card) !important; box-shadow: inset 4px 0 0 var(--tx-problem-text) !important;
}
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-item p { margin: 0 !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content :is(.lts-item-row, .lts-item-actions) { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; }
html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-item-actions { justify-content: flex-start !important; }

/* The panel decides the layout, so it reflows the same in the content frame and full page. */
@container (max-width: 1040px) {
  html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-layout { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-rail-list { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; max-height: 300px !important; }
}
@container (max-width: 640px) {
  html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-export-select { margin-left: 0 !important; width: 100% !important; }
  html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-navigation { width: 100% !important; margin-left: 0 !important; }
  html:root:not(#_) body.labor-admin-page #ptx-page-content .labor-report-navigation > * { flex: 1 1 0 !important; }
  html:root:not(#_) body.labor-admin-page #ptx-page-content .lts-table { min-width: 640px !important; }
}
/* Elements hidden by the page script stay hidden despite the layout rules above. */
html:root:not(#_) body.labor-admin-page #ptx-page-content [hidden][hidden][hidden][hidden][hidden] { display: none !important; }

/* Timeclock kiosk: centred card on the canvas, deep-teal brand band, 2x2 attendance actions (1 column from 540px).
   The kiosk loads no shell, so the shared .dashboard-body sidebar/header offsets do not apply. */
html:root:not(#_) body.labor-trax-kiosk { margin-left: 0 !important; padding-top: 0 !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-container { justify-content: center !important; justify-content: safe center !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-brand {
  gap: 12px !important; margin-bottom: var(--tx-gap) !important; padding: 12px 22px 12px 12px !important; border-radius: 999px !important;
  background: var(--tx-brand-teal) !important; color: var(--tx-on-primary) !important; font-family: var(--tx-font) !important;
}
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-brand .landing-brand-mark {
  border: 0 !important; border-radius: 999px !important; background: var(--tx-brand-apricot) !important; background-image: none !important;
  color: var(--tx-on-apricot) !important; box-shadow: none !important; font-family: var(--tx-font) !important; font-weight: var(--tx-weight-bold) !important;
}
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-brand .landing-wordmark { color: var(--tx-on-primary) !important; background: none !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-card {
  border: 1.5px solid var(--tx-line) !important; border-top: 6px solid var(--tx-brand-teal) !important; border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-title, .labor-history-heading h3) { color: var(--tx-text) !important; font-family: var(--tx-font) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: var(--tx-tracking-display) !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-copy, .labor-kiosk-label, .labor-kiosk-scan-label, .labor-kiosk-profile-id, .labor-history-status, .labor-history-times dt, .labor-history-times dd, .labor-history-lunches li) { color: var(--tx-text) !important; opacity: 1 !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-scan-well, .labor-history-panel, .labor-history-shift) { border: 1.5px dashed var(--tx-input-border) !important; border-radius: var(--tx-radius-tile) !important; background: var(--tx-row-alt) !important; box-shadow: none !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-history-panel, .labor-history-shift) { border-style: solid !important; border-color: var(--tx-line) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-history-panel { background: var(--tx-card) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-history-kicker { color: var(--tx-numbers) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: .04em !important; text-transform: uppercase !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-scan-icon { color: var(--tx-numbers) !important; }
html:root:not(#_) body.labor-trax-kiosk input.labor-kiosk-input {
  min-height: var(--tx-btn-h) !important; border: 2px solid var(--tx-input-border) !important; border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important; font-family: var(--tx-font) !important;
}
html:root:not(#_) body.labor-trax-kiosk input.labor-kiosk-input:focus { border-color: var(--tx-numbers) !important; outline: 3px solid var(--tx-focus) !important; outline-offset: 1px !important; }
html:root:not(#_) body.labor-trax-kiosk input.labor-kiosk-input::placeholder { color: var(--tx-text) !important; opacity: 1 !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-primary-action, .labor-kiosk-secondary-action, .labor-history-trigger) {
  min-height: var(--tx-btn-h) !important; border-radius: 999px !important; font-family: var(--tx-font) !important; font-weight: var(--tx-weight-bold) !important;
  box-shadow: none !important; transform: none !important; filter: none !important;
}
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-primary-action { border: 0 !important; background: var(--tx-primary) !important; background-image: none !important; color: var(--tx-on-primary) !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-secondary-action, .labor-history-trigger) {
  border: 2px solid var(--tx-input-border) !important; background: var(--tx-card) !important; background-image: none !important; color: var(--tx-text) !important; text-decoration: none !important;
}
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-primary-action, .labor-kiosk-secondary-action, .labor-history-trigger):hover:not(:disabled) { text-decoration: underline !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-card { box-sizing: border-box !important; width: min(100%, 560px) !important; padding: clamp(24px, 5vw, 40px) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-title { margin: 0 0 8px !important; font-size: clamp(1.6rem, 4vw, 2rem) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-copy { margin: 0 0 24px !important; font-size: clamp(1rem, 3vw, 1.2rem) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-scan-well { max-width: 400px !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-form { max-width: 400px !important; margin: 28px auto 0 !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-label { margin-bottom: 8px !important; font-weight: var(--tx-weight-bold) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-form .labor-kiosk-primary-action { width: 100% !important; margin-top: 20px !important; }
html:root:not(#_) body.labor-trax-kiosk :is(#step-1-scan, #step-3-actions) > .labor-kiosk-secondary-action { width: 100% !important; max-width: 400px !important; margin-top: 16px !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-button-row { max-width: 320px !important; margin: 24px auto 0 !important; gap: 16px !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-button-row > button { flex: 1 1 0 !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-actions { margin-top: 8px !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-history-trigger { margin-top: 24px !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-close, .labor-history-close) { border: 2px solid var(--tx-input-border) !important; background: var(--tx-card) !important; color: var(--tx-text) !important; box-shadow: none !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-profile-avatar { border: 0 !important; background: var(--tx-brand-mint) !important; color: var(--tx-brand-teal) !important; box-shadow: none !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: var(--tx-gap) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-action {
  border: 2px solid currentColor !important; border-radius: var(--tx-radius-card) !important; background-image: none !important;
  font-family: var(--tx-font) !important; box-shadow: none !important; transform: none !important;
}
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-action--in { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-action--out { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-action--lunch-out { background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-action--lunch-in { background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-action:hover:not(:disabled) { filter: brightness(1.04) !important; text-decoration: underline !important; }
html:root:not(#_) body.labor-trax-kiosk :is(.labor-kiosk-action, .labor-kiosk-primary-action, .labor-history-trigger):disabled { opacity: .45 !important; cursor: not-allowed !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-feedback { border-radius: var(--tx-radius-tile) !important; border-left: 4px solid currentColor !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-feedback.is-error { background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important; }
html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-feedback.is-success { background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important; }

@media (max-width: 1180px) {
  html:root:not(#_) body.labor-admin-page .labor-report-summary-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.labor-admin-page .labor-report-roster { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.labor-admin-page .labor-report-filter-controls { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  html:root:not(#_) body.labor-dashboard-page .labor-dash-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.labor-admin-page .labor-report-summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  html:root:not(#_) body.labor-admin-page .labor-report-roster { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 540px) {
  html:root:not(#_) body.labor-admin-page .labor-report-filter-controls { grid-template-columns: minmax(0, 1fr) !important; }
  html:root:not(#_) body.labor-trax-kiosk .labor-kiosk-actions { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (max-width: 420px) {
  html:root:not(#_) body.labor-admin-page .labor-report-summary-metrics { grid-template-columns: minmax(0, 1fr) !important; }
}
/* End Labor Trax */

/* ---------- 7. Buttons (flat, pill-shaped, 48px) ---------- */
:root :is(.btn, .dash-btn, .operations-action-btn, .settings-button, .co-btn, .rma-btn, .spw-btn, .tx-page-action, .btn-cyan,
  .btn-cyan-sm, .btn-ghost, .btn-ghost-sm, .hero-action-btn, .recv-btn-primary, .recv-btn-secondary, .reset-filters-btn, .view-toggle-btn, .auth-submit, .activity-panel-link) {
  min-height: var(--tx-btn-h) !important;
  min-width: var(--tx-touch-min);
  padding: 0 22px !important;
  border-radius: 999px !important;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--tx-font) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transform: none !important;
  background: var(--tx-card) !important;
  background-image: none !important;
  border: 2px solid var(--tx-input-border) !important;
  color: var(--tx-text) !important;
}
:root :is(.btn-primary, .tx-btn-primary, .dash-btn-primary, .btn-action, .ov-btn-primary, .tx-page-action.is-primary, .btn-cyan,
  .btn-cyan-sm, .recv-btn-primary, .auth-submit, .hero-action-btn:first-child, .view-toggle-btn.active) {
  background: var(--tx-primary) !important;
  border-color: transparent !important;
  color: var(--tx-on-primary) !important;
}
:root :is(.btn-accent, .btn-warning) { background: var(--tx-apricot) !important; border-color: transparent !important; color: var(--tx-on-apricot) !important; }
:root :is(.btn-success, .tx-btn-success, .rma-btn-success:not(.is-muted), .spw-btn-success:not(.is-muted), .btn-send-to-inventory) { background: var(--tx-good-bg) !important; border-color: var(--tx-good-text) !important; color: var(--tx-good-text) !important; box-shadow: none !important; }
:root .btn-send-to-bin { background: var(--tx-sage) !important; border-color: var(--tx-primary) !important; color: var(--tx-on-sage) !important; box-shadow: none !important; }
:root :is(.btn-danger, .tx-btn-danger) { background: var(--tx-problem-bg) !important; border-color: transparent !important; color: var(--tx-problem-text) !important; }
:root :is(.btn, .dash-btn, .hero-action-btn, .tx-page-action):hover:not(:disabled) { filter: brightness(1.08); transform: none !important; }
:root :is(.btn, .hero-action-btn)::before, :root :is(.btn, .hero-action-btn)::after { display: none !important; }
:root :is(button, .btn):disabled { opacity: 0.55; }

/* ---------- 8. Forms (2px high-contrast border, 56px) ---------- */
:root :is(.form-input, .co-input, .settings-input, .filter-select, .filter-input, .modal-input, .dash-input, .tpl-input,
  .primary-search-input, .prodimport-input, input[type="text"], input[type="email"], input[type="password"], input[type="search"],
  input[type="number"], input[type="tel"], input[type="date"], input[type="url"], select, textarea):not(.tx-input):not(.tx-select) {
  min-height: var(--tx-btn-h) !important;
  background-color: var(--tx-card) !important;
  border: 2px solid var(--tx-input-border) !important;
  border-radius: 14px !important;
  color: var(--tx-text) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
:root :is(.header-search, .dash-search) input:not(.tx-input):not(.tx-select):not(.tx-search) {
  min-height: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; outline: 0 !important; padding: 0 !important;
}
:root :is(.header-search, .dash-search):focus-within { outline: 3px solid var(--tx-focus) !important; outline-offset: 2px; }
:root :is(input, textarea)::placeholder { color: var(--tx-text) !important; opacity: 1; }
:root :is(input, select, textarea):focus { border-color: var(--tx-primary) !important; outline: 3px solid var(--tx-focus) !important; outline-offset: 1px; box-shadow: none !important; }
:root input:is([type="checkbox"], [type="radio"]) { accent-color: var(--tx-primary); min-height: 0 !important; width: 22px; height: 22px; }

/* ---------- 8b. Search fields (48px pill, 22px outline glyph, same geometry as the top-bar search) ---------- */
:root { --tx-search-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E"); }
:root :is(.primary-search-input, .search-group .search-input, .wm-search input, #supply-catalog-search-input, #oq-search, #wp-search, .wp-search, .expected-search-input, .labor-admin-search):not(.tx-input):not(.tx-select) {
  box-sizing: border-box !important;
  height: var(--tx-btn-h) !important; min-height: var(--tx-btn-h) !important;
  padding: 0 20px !important;
  border-radius: 999px !important;
  line-height: normal !important;
  text-overflow: ellipsis !important;
  -webkit-appearance: none !important; appearance: none !important;
}
:root :is(.primary-search-input, #supply-catalog-search-input):not(.tx-input):not(.tx-select) { padding-left: 50px !important; }
:root :is(.primary-search, div:has(> #supply-catalog-search-input)) { position: relative !important; }
:root :is(.primary-search .primary-search-icon, div:has(> #supply-catalog-search-input) > span) {
  position: absolute !important; left: 15px !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 1 !important;
  width: 22px !important; height: 22px !important; margin: 0 !important; padding: 0 !important;
  font-size: 0 !important; color: transparent !important; fill: none !important; pointer-events: none !important;
  background: var(--tx-text) !important;
  -webkit-mask: var(--tx-search-glyph) center / 22px 22px no-repeat; mask: var(--tx-search-glyph) center / 22px 22px no-repeat;
}
:root .primary-search .primary-search-icon > * { display: none !important; }
:root .ratecard-search-wrap {
  box-sizing: border-box !important;
  height: var(--tx-btn-h) !important; gap: 15px !important; padding: 0 20px 0 13px !important;
  background: var(--tx-card) !important;
  border: 2px solid var(--tx-input-border) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}
:root .ratecard-search-wrap:focus-within { border-color: var(--tx-input-border) !important; outline: 3px solid var(--tx-focus) !important; outline-offset: 2px; box-shadow: none !important; }
:root .ratecard-search-wrap > svg { flex: 0 0 22px !important; width: 22px !important; height: 22px !important; color: var(--tx-text) !important; }
:root .ratecard-search-wrap .ratecard-search:not(.tx-input):not(.tx-select) {
  flex: 1 1 auto !important; min-width: 0 !important; height: 100% !important; min-height: 0 !important;
  padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important;
  outline: 0 !important; box-shadow: none !important; -webkit-appearance: none !important; appearance: none !important; text-overflow: ellipsis !important;
}
:root :is(.header-search .search-input, .ratecard-search-wrap .ratecard-search)::-webkit-search-decoration,
:root :is(.header-search .search-input, .ratecard-search-wrap .ratecard-search)::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
:root .wm-search { display: flex !important; align-items: center !important; gap: 8px !important; }
:root .wm-search input:not(.tx-input):not(.tx-select) { width: 260px !important; max-width: 100% !important; }
:root .wm-search .wm-search-btn {
  flex: 0 0 var(--tx-touch-min) !important; width: var(--tx-touch-min) !important; height: var(--tx-touch-min) !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  padding: 0 !important; border: 0 !important; border-radius: 50% !important; box-shadow: none !important;
  background: var(--tx-primary) !important; color: var(--tx-on-primary) !important;
}
:root .wm-search .wm-search-btn svg { width: 22px !important; height: 22px !important; }
:root :is(.form-label, .filter-label, .tpl-label, .prodimport-label, .info-label, .session-field-label, .auth-label) {
  color: var(--tx-text) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}
:root :is(.primary-search, .search-filter-section .primary-search) { background: none !important; border: 0 !important; box-shadow: none !important; }


/* ---------- 9. Data tables (teal header band + zebra rows) ---------- */
:root table:not(.tx-table) { border-collapse: collapse; border-color: var(--tx-line) !important; font-size: var(--tx-size-min); }
:root table:not(.tx-table) thead :is(th, td) {
  height: var(--tx-table-head-h);
  padding: 0 18px !important;
  background: var(--tx-table-head-bg) !important;
  color: var(--tx-table-head-text) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  white-space: nowrap;
  border: 0 !important;
  text-shadow: none !important;
}
:root table:not(.tx-table) tbody td {
  height: 64px;
  padding: 10px 18px !important;
  background: transparent !important;
  color: var(--tx-text) !important;
  font-weight: 700 !important;
  border-color: var(--tx-line) !important;
}
:root table:not(.tx-table) tbody tr:nth-child(even) td { background: var(--tx-row-alt) !important; }
:root table:not(.tx-table) tbody tr:hover > td { background: var(--tx-row-alt) !important; }

/* Status-toned rows: explicit data-status-tone wins over the status pill detected in the row */
:root:root table tbody tr:where(:has(> td :is(.status-badge, .status-pill, .status-indicator, .badge, .tx-badge, .tx-pill, .pill, .chip, .tag):is([class*="success"], [class*="complete"], [class*="received"], [class*="delivered"], [class*="shipped"], [class*="good"], [class*="done"], .status-indicator.active))) > td {
  --tx-row-tone: var(--tx-good-text);
}
:root:root table tbody tr:where(:has(> td :is(.status-badge, .status-pill, .status-indicator, .badge, .tx-badge, .tx-pill, .pill, .chip, .tag):is([class*="pending"], [class*="progress"], [class*="transit"], [class*="receiving"], [class*="scheduled"], [class*="draft"], [class*="queued"]))) > td {
  --tx-row-tone: var(--tx-apricot);
}
:root:root table tbody tr:where(:has(> td :is(.status-badge, .status-pill, .status-indicator, .badge, .tx-badge, .tx-pill, .pill, .chip, .tag):is([class*="warn"], [class*="partial"], [class*="delayed"], [class*="hold"], [class*="discrepanc"], [class*="low-stock"], [class*="amber"]))) > td {
  --tx-row-tone: var(--tx-pending-text);
}
:root:root table tbody tr:where(:has(> td :is(.status-badge, .status-pill, .status-indicator, .badge, .tx-badge, .tx-pill, .pill, .chip, .tag):is([class*="danger"], [class*="error"], [class*="fail"], [class*="critical"], [class*="problem"], [class*="damaged"], [class*="depleted"], [class*="overdue"], [class*="exception"]))) > td {
  --tx-row-tone: var(--tx-problem-text);
}
:root:root table tbody tr:is([data-status-tone="good"], [data-status-tone="complete"]) > td { --tx-row-tone: var(--tx-good-text); }
:root:root table tbody tr:is([data-status-tone="pending"], [data-status-tone="progress"]) > td { --tx-row-tone: var(--tx-apricot); }
:root:root table tbody tr[data-status-tone="warning"] > td { --tx-row-tone: var(--tx-pending-text); }
:root:root table tbody tr:is([data-status-tone="problem"], [data-status-tone="alert"]) > td { --tx-row-tone: var(--tx-problem-text); }
:root:root table:not(.tx-table) tbody tr > td {
  background-image: linear-gradient(color-mix(in srgb, var(--tx-row-tone, transparent) 12%, transparent), color-mix(in srgb, var(--tx-row-tone, transparent) 12%, transparent)) !important;
}
:root:root table:not(.tx-table) tbody tr > td:first-child { box-shadow: inset 5px 0 0 var(--tx-row-tone, transparent) !important; }

/* Inventory row view: zebra striping instead of the status tint; the leading tone accent stays */
html:root body.inventory-management-page .shipments-table-view tbody tr > td { background-image: none !important; }
html:root body.inventory-management-page .shipments-table-view tbody tr:nth-child(odd):not(:hover) > td { background-color: var(--tx-card) !important; }
html:root body.inventory-management-page .shipments-table-view tbody tr:nth-child(even) > td { background-color: var(--tx-row-alt) !important; }
html:root body.inventory-management-page .shipments-table-view tbody tr:hover > td { background-color: color-mix(in srgb, var(--tx-apricot) 24%, var(--tx-card)) !important; }

/* Outbound box accordions: tone as a solid tint, not a left edge */
:root :is(.box-acc-sealed, .box-acc-open) { border-left: 0 !important; border-radius: var(--tx-radius-tile) !important; }
:root .box-acc-sealed { background: var(--tx-good-bg) !important; }
:root .box-acc-open { background: var(--tx-pending-bg) !important; }

/* ---------- 10. Status pills (always paired with a word) ---------- */
:root :is(.badge, .tx-badge, .status-badge, .status-pill, .status-indicator, .kpi-pill, .section-badge, .operations-status-chip, .chip, .pill, .tag, .setup-progress-badge, .tx-page-pill) {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 40px;
  padding: 0 16px !important;
  border-radius: 999px !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  background: var(--tx-sage) !important;
  background-image: none !important;
  border: 1.5px solid color-mix(in srgb, currentColor 40%, transparent) !important;
  color: var(--tx-on-sage) !important;
}
:root :is(.status-badge, .status-pill, .tx-badge)::before {
  content: ""; width: 10px; height: 10px; border-radius: 50%; background: currentColor; flex-shrink: 0;
}
:root :is(.status-badge, .status-pill, .status-indicator) { white-space: nowrap !important; }
:root .status-indicator svg { width: 20px !important; height: 20px !important; flex-shrink: 0; }
:root :is(.badge, .tx-badge, .status-badge, .status-pill, .status-indicator, .kpi-pill, .section-badge, .operations-status-chip, .chip, .pill, .tag):is([class*="success"], [class*="complete"], [class*="green"], [class*="received"], [class*="delivered"], [class*="shipped"], [class*="positive"], [class*="good"], [class*="done"], .status-indicator.active) {
  background: var(--tx-good-bg) !important; color: var(--tx-good-text) !important;
}
:root :is(.badge, .tx-badge, .status-badge, .status-pill, .status-indicator, .kpi-pill, .section-badge, .operations-status-chip, .chip, .pill, .tag):is([class*="pending"], [class*="progress"], [class*="transit"], [class*="receiving"], [class*="scheduled"]) {
  background: var(--tx-pending-bg) !important; color: var(--tx-pending-text) !important;
}
:root :is(.badge, .tx-badge, .status-badge, .status-pill, .status-indicator, .kpi-pill, .section-badge, .operations-status-chip, .chip, .pill, .tag):is([class*="warn"], [class*="amber"], [class*="partial"], [class*="delayed"], [class*="hold"], [class*="discrepanc"], [class*="low-stock"]) {
  background: var(--tx-apricot) !important; color: var(--tx-on-apricot) !important;
}
:root :is(.badge, .tx-badge, .status-badge, .status-pill, .status-indicator, .kpi-pill, .section-badge, .operations-status-chip, .chip, .pill, .tag):is([class*="danger"], [class*="error"], [class*="fail"], [class*="negative"], [class*="critical"], [class*="problem"], [class*="damaged"], [class*="depleted"], [class*="overdue"], [class*="exception"], [class*="emphasis"]) {
  background: var(--tx-problem-bg) !important; color: var(--tx-problem-text) !important;
}

/* ---------- 11. Tabs, lists, activity ---------- */
:root :is(.settings-tab-btn, .tab-btn, .tx-tab, .dash-filter) {
  min-height: var(--tx-btn-h) !important;
  padding: 0 20px !important;
  border-radius: 999px !important;
  background: var(--tx-card) !important;
  color: var(--tx-text) !important;
  border: 2px solid var(--tx-line) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: var(--tx-weight-bold) !important;
  box-shadow: none !important;
}
:root :is(.settings-tab-btn, .tab-btn, .tx-tab, .dash-filter):is(.active, [aria-selected="true"]) {
  background: var(--tx-primary) !important;
  color: var(--tx-on-primary) !important;
  border-color: transparent !important;
}
:root :is(.activity-row, .overview-shortcut-card, .list-row) { border-color: var(--tx-line) !important; }
:root .activity-marker { background: var(--tx-apricot) !important; box-shadow: none !important; }
:root :is(.activity-text, .overview-shortcut-title, .workflow-card-title, .dashboard-action-title, .station-card-title) {
  color: var(--tx-text) !important;
  font-family: var(--tx-font) !important;
  font-size: var(--tx-size-body) !important;
  font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
:root :is(.dashboard-action-description, .station-card-description) { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
:root .nav-links .nav-link.active {
  color: var(--tx-primary) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
  font-weight: var(--tx-weight-bold) !important;
}
:root .activity-time { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; font-family: var(--tx-font-numbers) !important; }
:root .overview-page-shell .overview-shortcut-card { grid-template-columns: 50px 1fr !important; column-gap: 14px !important; align-items: center !important; padding: 14px 16px !important; }
:root .overview-page-shell .overview-shortcut-card::before {
  display: inline-grid !important; place-items: center !important; grid-row: span 2 !important;
  width: 50px !important; height: 50px !important; border-radius: 14px !important;
  background: var(--ov-solid, var(--tx-sage)) !important; color: var(--ov-on-solid, var(--tx-numbers)) !important;
  font: 700 24px/1 var(--tx-font) !important;
}

/* ---------- 12. Modals, drawers, menus ---------- */
:root :is(.modal-content, .modal-container, .tpl-modal, .tx-modal, .ptx-modal-card, .ptx-success-popup-card, .ptx-adjust-modal-card, .ptx-drawer, .oq-drawer, .header-menu-shell, .header-popover, .notification-panel, .dropdown-menu, .popover, .ptx-bell__panel, .nav-dropdown, .gs-help-pop, .ptx-toast, .tx-toast) {
  background: var(--tx-card) !important;
  background-image: none !important;
  border: 1.5px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  color: var(--tx-text) !important;
}
:root :is(.ptx-toast__title, .ptx-toast__desc, .ptx-toast__close, .tx-toast-title, .tx-toast-desc, .tx-toast-close, .ptx-success-popup-title, .ptx-success-popup-message, .ptx-success-popup-close, .notification-summary-title, .notification-summary-meta) {
  color: var(--tx-text) !important;
}
:root :is(.ptx-toast__rec, .notification-summary-item) {
  background: var(--tx-row-alt) !important;
  border-color: var(--tx-line) !important;
  color: var(--tx-text) !important;
}
:root :is(#send-bin-info-display, #send-inv-location-info, #bin-info-display, #inventory-location-info) {
  background: var(--tx-good-bg) !important;
  border-color: var(--tx-good-text) !important;
  color: var(--tx-good-text) !important;
}
:root :is(#send-bin-info-display button, button[onclick*="printCurrentSendBinLabel"]) {
  background: var(--tx-card) !important;
  border: 1.5px solid var(--tx-good-text) !important;
  color: var(--tx-good-text) !important;
  font-weight: var(--tx-weight-bold) !important;
  box-shadow: none !important;
}
:root .bin-label-option {
  background: var(--tx-row-alt) !important;
  border-left-color: var(--tx-primary) !important;
  color: var(--tx-text) !important;
}
:root :is(.bin-label-option-copy, .bin-label-option-copy strong, .bin-label-option-copy div, .modal-content .form-label, .modal-content .modal-title, .modal-content .modal-text, .modal-content .modal-stat-label, .modal-content .modal-stat-value, #modal-product-name, #modal-product-sku, #modal-expected-qty, #send-bin-product-name, #send-bin-product-sku, #send-bin-available, #send-bin-quantity-hint, #send-inv-product-name, #send-inv-product-sku, #send-inv-available, #send-inv-quantity-hint, .recommendation-heading, .recommendation-icon) {
  color: var(--tx-text) !important;
}
:root :is(#send-bin-item-info, #send-inv-item-info, #bin-items-summary, #inventory-items-summary, #send-bin-distribution-info, #send-inv-distribution-info, .location-recommendation) {
  background: var(--tx-row-alt) !important;
  border-color: var(--tx-line) !important;
  color: var(--tx-text) !important;
}
:root :is(#send-bin-distribution-info, #send-inv-distribution-info, #previous-progress-indicator, .location-recommendation) :is(div, span, strong) {
  color: var(--tx-text) !important;
}
:root .location-recommendation a {
  color: var(--tx-numbers) !important;
  font-weight: var(--tx-weight-bold) !important;
  text-decoration: underline !important;
}
:root :is(#send-bin-error-display, #send-inv-location-error, #bin-error-display, #inventory-location-error, #modal-discrepancy-warning) {
  background: var(--tx-problem-bg) !important;
  border-color: var(--tx-problem-text) !important;
  color: var(--tx-problem-text) !important;
}
:root :is(#send-bin-error-display, #send-inv-location-error, #bin-error-display, #inventory-location-error, #modal-discrepancy-warning) :is(div, span, strong) {
  color: var(--tx-problem-text) !important;
}
:root :is(.modal-overlay, .modal-backdrop, .tpl-backdrop, .tx-modal-overlay) { background: color-mix(in srgb, var(--tx-side-bg) 70%, transparent) !important; backdrop-filter: none !important; }
:root :is(.modal-header, .modal-footer, .tx-modal-header, .tx-modal-footer) { border-color: var(--tx-line) !important; }
:root :is(.empty-state, .sto-empty, .oq-drawer-empty) { color: var(--tx-text) !important; background: transparent !important; }
:root hr { border-color: var(--tx-line); }
:root :is(progress, meter) { accent-color: var(--tx-primary); }
:root :is(.progress, .progress-bar-track, .tx-progress) { background: var(--tx-row-alt) !important; border-radius: 999px !important; }
:root :is(.progress-bar, .progress-fill, .tx-progress-fill) { background: var(--tx-primary) !important; background-image: none !important; box-shadow: none !important; }


/* ---------- 13. Sign-in and onboarding ---------- */
:root .auth-left {
  background: var(--tx-side-bg) !important;
  background-image: none !important;
  color: var(--tx-side-text) !important;
  border: 0 !important;
  text-shadow: none !important;
}
:root .auth-left::before, :root .auth-left::after { display: none !important; }
:root .auth-left :is(h1, h2, p, span, a, strong, div, .auth-left-title, .auth-left-sub) { color: var(--tx-side-text) !important; text-shadow: none !important; }
:root .auth-left .auth-left-title { font-size: var(--tx-size-page-title) !important; font-weight: var(--tx-weight-bold) !important; line-height: 1.1 !important; letter-spacing: var(--tx-tracking-display) !important; }
:root .auth-left :is(.auth-left-sub, .auth-feature p, .auth-feature span) { font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
:root .auth-left .auth-eyebrow {
  display: inline-flex; min-height: 36px; align-items: center; padding: 0 14px !important;
  background: var(--tx-side-active-bg) !important; border: 2px solid var(--tx-side-active-border) !important;
  border-radius: 999px !important; color: var(--tx-side-text) !important;
}
:root .auth-feature-icon {
  width: 50px !important; height: 50px !important; flex: 0 0 50px !important;
  border-radius: var(--tx-radius-tile) !important;
  background: var(--tx-side-tile-bg) !important;
  border: 1.5px solid var(--tx-side-tile-border) !important;
  color: var(--tx-side-text) !important;
  box-shadow: none !important;
}
:root .auth-feature-icon svg { width: 28px !important; height: 28px !important; stroke: currentColor !important; stroke-width: 2.4 !important; }
:root .auth-left .auth-feature strong { font-size: var(--tx-size-body) !important; font-weight: var(--tx-weight-bold) !important; }
:root .auth-left-footer { border-color: var(--tx-side-hair) !important; }
:root .auth-left-footer :is(a, span) { font-size: var(--tx-size-min) !important; font-weight: 700 !important; }
:root .auth-right { background: var(--tx-canvas) !important; background-image: none !important; border: 0 !important; }
:root .auth-card { padding: 32px !important; }
:root .auth-form { display: flex !important; flex-direction: column !important; gap: var(--tx-gap) !important; }
:root .auth-form .form-group { display: flex !important; flex-direction: column !important; gap: 8px !important; margin: 0 !important; }
:root .auth-form .form-label { margin: 0 !important; }
:root .auth-form :is(.form-submit, .auth-submit) { width: 100% !important; margin: 8px 0 0 !important; }

:root :is(.auth-card-badge, .auth-toggle-btn) {
  background: var(--tx-sage) !important; color: var(--tx-on-sage) !important; border: 0 !important;
  border-radius: 999px !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important;
  letter-spacing: normal !important; text-transform: none !important;
}
:root .auth-toggle-btn { min-height: var(--tx-btn-h) !important; }
:root .auth-toggle-btn.active { background: var(--tx-primary) !important; color: var(--tx-on-primary) !important; }
:root .auth-pane-header :is(h1, h2) { font-size: var(--tx-size-page-title) !important; font-weight: var(--tx-weight-bold) !important; letter-spacing: var(--tx-tracking-display) !important; }
:root :is(.auth-link, .auth-forgot-link, .auth-back-btn) { color: var(--tx-numbers) !important; font-size: var(--tx-size-min) !important; font-weight: var(--tx-weight-bold) !important; }
:root :is(.auth-info-item, .auth-countdown) { color: var(--tx-text) !important; font-size: var(--tx-size-min) !important; }
:root :is(.shipment-date-badge, .inventory-edit-btn) > svg { width: 18px !important; height: 18px !important; flex: 0 0 18px !important; }
:root .auth-info-item { display: inline-flex !important; align-items: center !important; gap: 8px !important; }
:root .auth-info-item > svg { width: 22px !important; height: 22px !important; flex: 0 0 22px !important; color: var(--tx-numbers) !important; stroke-width: 2; }
:root .form-submit { width: 100%; min-height: var(--tx-btn-h-lg) !important; font-size: var(--tx-size-body) !important; }
:root .theme-toggle-float { background: var(--tx-card) !important; border: 2px solid var(--tx-input-border) !important; color: var(--tx-text) !important; }

/* ---------- KPI and stat tiles: numeric value centred on the card ----------
   Cards stack as one centred column: header (icon box + label) above, value in the middle, meta and pills below.
   Wrappers stretch to the card width so traxium-number-fit.js measures the full card, not a shrink-wrapped box. */
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat, .tx-tile) {
  flex-direction: column !important; align-items: center !important; justify-items: center !important; text-align: center !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat, .tx-tile)
  :is(.stat-content, .kpi-content, .progress-stat-content, .kpi-card-body, .kpi-figures, .stat-card-header:has(.stat-value)) {
  flex-direction: column !important; align-items: center !important; align-self: stretch !important;
  width: auto !important; min-width: 0 !important; max-width: 100% !important; text-align: center !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat, .tx-tile)
  :is(.kpi-card-header, .tx-card-header, .dash-kpi-header, .stat-card-header:not(:has(.stat-value)), .tx-tile__label) {
  display: flex !important; flex-wrap: nowrap !important; align-items: center !important;
  justify-content: flex-start !important; align-self: stretch !important; justify-self: stretch !important; gap: 10px !important; min-width: 0 !important; text-align: left !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .tx-tile)
  :is(.kpi-card-header, .tx-card-header, .dash-kpi-header, .tx-tile__label) :is(.kpi-card-label, .tx-card-label, .dash-kpi-label) {
  flex: 0 1 auto !important; min-width: 0 !important; text-align: left !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat, .tx-tile)
  :is(.kpi-card-value, .kpi-value, .stat-value, .dash-kpi-value, .tx-card-value, .tx-glance-value, .tx-tile__number, .orders-summary-value, .ov-metric-value, .metric-value, .summary-value, [class*="-stat-value"], [class*="-metric-value"], [class*="-summary-value"]) {
  align-self: stretch !important; justify-self: stretch !important; max-width: 100% !important; text-align: center !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat, .tx-tile)
  :is(span, strong, b, em, small, output, data):is(.kpi-card-value, .kpi-value, .stat-value, .tx-card-value, [class*="-stat-value"], [class*="-metric-value"]):not([hidden], [style*="display: none"], [style*="display:none"]) {
  display: block !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat, .tx-tile)
  :is(.kpi-card-label, .stat-label, .dash-kpi-label, .tx-card-label, .kpi-card-meta, .stat-meta, .tx-card-meta, .receiving-metric-label, .receiving-metric-copy, [class*="-stat-label"], [class*="-stat-copy"], [class*="-stat-note"], .ccc-label) {
  text-align: center !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .receiving-metric-card, .tx-tile)
  :is(.kpi-card-meta, .tx-card-meta, .receiving-metric-copy, [class*="-stat-copy"], [class*="-stat-note"]) { align-self: stretch !important; justify-self: stretch !important; }
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .tx-tile) .kpi-pill-row {
  justify-content: center !important; align-self: stretch !important; justify-self: stretch !important;
}

/* Reference layout (traxium-design-system, Inventory/Overview screens): icon badge + label top-left,
   big rounded number centred in the remaining space, sub line centred underneath. */
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat) {
  justify-content: space-between !important; border-radius: var(--tx-radius-card) !important;
}
html:root:not(#_) :is(.kpi-card, .stat-card, [class*="-stat-card"], .receiving-metric-card, .ccc-metric):not(:has(> :is(.stat-icon, .storage-stat-icon, .stat-card-header, .kpi-card-header, .tx-card-header, .kpi-card-top))):not([hidden], [style*="display: none"], [style*="display:none"]) {
  display: flex !important; gap: 12px !important;
}
html:root:not(#_) :is(.kpi-card, .stat-card, [class*="-stat-card"], .receiving-metric-card, .ccc-metric):not(:has(> :is(.stat-icon, .storage-stat-icon, .stat-card-header, .kpi-card-header, .tx-card-header, .kpi-card-top)))
  > :is(.stat-label, .kpi-label, .ccc-label, .receiving-metric-label, .tx-card-label, [class*="-stat-label"]) {
  order: -1 !important; align-self: stretch !important; margin: 0 !important; text-align: left !important;
}
html:root:not(#_) :is(.stat-card, [class*="-stat-card"], .progress-stat):has(> :is(.stat-icon, .storage-stat-icon, .progress-stat-icon), > .stat-card-header > .stat-icon):not([hidden], [style*="display: none"], [style*="display:none"]) {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr) !important; grid-template-rows: auto 1fr !important;
  column-gap: 10px !important; row-gap: 12px !important; align-items: center !important; justify-items: stretch !important;
}
html:root:not(#_) :is(.stat-card, [class*="-stat-card"], .progress-stat):has(> :is(.stat-icon, .storage-stat-icon, .progress-stat-icon), > .stat-card-header > .stat-icon)
  :is(.stat-card-header, .stat-content, .progress-stat-content) { display: contents !important; }
html:root:not(#_) :is(.stat-card, [class*="-stat-card"], .progress-stat) :is(.stat-icon, .storage-stat-icon, .progress-stat-icon) {
  grid-row: 1 !important; grid-column: 1 !important; justify-self: start !important; align-self: center !important; margin: 0 !important;
}
html:root:not(#_) :is(.stat-card, [class*="-stat-card"], .progress-stat) :is(.stat-content, .progress-stat-content) > * { grid-column: 1 / -1 !important; }
html:root:not(#_) :is(.stat-card, [class*="-stat-card"], .progress-stat) :is(.stat-content, .progress-stat-content) > :is(.stat-label, .progress-stat-label) {
  grid-row: 1 !important; grid-column: 2 !important; justify-self: stretch !important; margin: 0 !important; text-align: left !important;
}
html:root:not(#_) :is(.stat-card, [class*="-stat-card"], .progress-stat) :is(.stat-content, .progress-stat-content) > :is(.stat-value, .progress-stat-value) {
  grid-row: 2 !important; margin: 0 !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .progress-stat) :is(.tx-icon-box, .kpi-icon-wrapper, .stat-icon, .storage-stat-icon, .progress-stat-icon) {
  width: 44px !important; height: 44px !important; min-width: 44px !important; flex: 0 0 44px !important; border-radius: 12px !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .progress-stat) :is(.tx-icon-box, .kpi-icon-wrapper, .stat-icon, .storage-stat-icon, .progress-stat-icon) > svg {
  width: 26px !important; height: 26px !important;
}
html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, .stat-box, [class*="-stat-card"], .receiving-metric-card, .ccc-metric, .progress-stat, .manifest-stat, .summary-stat, .bin-stat, .modal-stat, .station-stat)
  :is(.kpi-card-value, .kpi-value, .stat-value, .dash-kpi-value, .tx-card-value, .progress-stat-value, [class*="-stat-value"], [class*="-metric-value"]),
html:root:not(#_) .tx-stat-card > h3 {
  font-family: ui-rounded, "SF Pro Rounded", var(--tx-font) !important; font-variant-numeric: tabular-nums;
  font-weight: 700 !important; line-height: 1 !important; letter-spacing: -0.04em !important;
}

/* ---------- Frame navigation: the host keeps the shell; framed pages render content only ---------- */
html[data-traxium-framed]:is(*, #tx-app-layer), html[data-traxium-framed]:is(*, #tx-app-layer) body {
  --txm-sidebar-w: 0px !important; --tx-sidebar-w: 0px !important; --shell-sidebar-width: 0px !important;
  --shell-sidebar-collapsed-width: 0px !important; --ptx-sidebar-width: 0px !important;
  --ptx-nav-left-w: 0px !important; --dash-sidebar-width: 0px !important;
  --tx-topbar-h: 0px !important; --shell-header-height: 0px !important; --ptx-topbar-height: 0px !important;
}
html[data-traxium-framed]:is(*, #tx-app-layer) :is(aside.sidebar, header.dashboard-header, .ptx-bottom-tabs) { display: none !important; }
html[data-traxium-frame-host]:is(*, #tx-app-layer) body { overflow: hidden !important; }
html[data-traxium-frame-host]:is(*, #tx-app-layer) [data-traxium-host-content] { display: none !important; }
html:is(*, #tx-app-layer) iframe.tx-content-frame {
  position: fixed !important; right: 0 !important; bottom: 0 !important; z-index: auto !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; color-scheme: normal;
}
html:is(*, #tx-app-layer) iframe.tx-content-frame[data-traxium-frame="loading"] { visibility: hidden !important; pointer-events: none !important; }

/* ---------- One UI font site-wide (Mona Sans); code, barcodes, brand lockups, and icon fonts keep their own faces ---------- */
html:root:not(#_) body, html:root:not(#_) body *:not(code, pre, kbd, samp, svg, svg *, [class*="mono"], [class*="barcode"], [class*="logo"], [class*="brand"], [style*="monospace"],
  .ph, .ph-bold, .ph-fill, .ph-duotone, .ph-light, .ph-thin) {
  font-family: var(--tx-font) !important;
}

/* ---------- Sidebar: lighter, antialiased labels at every width ---------- */
html:root:not(#_) :is(.sidebar, .dash-sidebar, .site-sidebar, .ship-trax-sidebar, .admin-sidebar) {
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
}
html:root:not(#_) :is(.sidebar-link, .dash-nav-item, .site-sidebar a.site-nav-item, .ptx-nav-item, .ship-trax-sidebar .nav-item, .admin-nav-item) {
  font-weight: 400 !important; letter-spacing: -0.005em !important;
}
html:root:not(#_) :is(.sidebar-link, .dash-nav-item, .site-sidebar a.site-nav-item, .ptx-nav-item, .ship-trax-sidebar .nav-item, .admin-nav-item):is(.active, [aria-current="page"]) {
  font-weight: 500 !important;
}
html:root:not(#_) :is(.sidebar-section-heading, .dash-nav-heading) { font-weight: 500 !important; }

/* ---------- Desktop scale (1025px and up): sidebar section toggles, KPI cards, dashboard buttons ----------
   Tablet and phone sizes are unchanged. */
@media (min-width: 1025px) {
  html:root:not([data-traxium-framed]) { --txm-sidebar-w: 288px !important; --tx-sidebar-w: 288px !important; }
  html:root:not(#_) :is(.sidebar-section-heading, .dash-nav-heading) {
    font-size: 13px !important; letter-spacing: 0.08em !important; line-height: 1.2 !important; padding: 14px 10px 4px !important;
  }
  html:root:not(#_) .sidebar-section-toggle { min-height: 32px !important; gap: 8px !important; border-radius: 8px !important; }

  html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .receiving-metric-card, .ccc-metric) {
    padding: 12px 16px !important; gap: 6px !important; row-gap: 6px !important; min-height: 0 !important;
  }
  html:root:not(#_) body :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card, .stat-card, [class*="-stat-card"], .receiving-metric-card, .ccc-metric)
    :is(.kpi-card-value, .kpi-value, .stat-value, .dash-kpi-value, .tx-card-value, [class*="-stat-value"], [class*="-metric-value"]):not(.stat-value-small) {
    font-size: 44px !important; line-height: 1 !important;
  }
  html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card) :is(.kpi-card-header, .tx-card-header, .dash-kpi-header) { gap: 8px !important; }
  html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card) :is(.kpi-card-label, .tx-card-label, .dash-kpi-label) {
    font-size: 15px !important; line-height: 1.25 !important;
  }
  html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card) :is(.kpi-card-meta, .tx-card-meta, .kpi-pill) { font-size: 14px !important; }
  html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card) :is(.tx-icon-box, .kpi-icon-wrapper) {
    width: 36px !important; height: 36px !important; min-width: 36px !important; flex: 0 0 36px !important; border-radius: 10px !important;
  }
  html:root:not(#_) :is(.kpi-card, .tx-card.operations-kpi-card, .dash-kpi-card) :is(.tx-icon-box, .kpi-icon-wrapper) > svg { width: 20px !important; height: 20px !important; }
  html:root:not(#_) body.overview-page-shell .overview-metric-grid .kpi-card .kpi-card-value { font-size: clamp(44px, 24cqi, 68px) !important; line-height: 1 !important; }

  html:root:not(#_) body.overview-page-shell :is(.hero-action-btn, .activity-panel-link, .dash-btn, .btn) {
    min-height: 40px !important; min-width: 0 !important; padding: 0 18px !important; gap: 8px !important; font-size: 15px !important;
  }
}

}

/* No cross-document fade on page navigation. */
@view-transition { navigation: none; }
::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }


/* Warehouse Home: step-by-step instructional video guide section */
html:root:not(#_) .tx-wh-video-card {
  border: 1.5px solid var(--tx-line) !important;
  border-radius: var(--tx-radius-card) !important;
  background: var(--tx-card) !important;
  padding: 22px 24px !important;
  margin-bottom: var(--tx-gap) !important;
}
html:root:not(#_) .tx-wh-video-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  padding-bottom: 16px !important;
  border-bottom: 1.5px solid var(--tx-line) !important;
  margin-bottom: 18px !important;
}
html:root:not(#_) .tx-wh-video-title {
  margin: 4px 0 4px !important;
  font-size: var(--tx-size-section) !important;
  font-weight: 800 !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) .tx-wh-video-sub {
  margin: 0 !important;
  font-size: var(--tx-size-min) !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) .tx-wh-video-tabs {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 4px !important;
  border-radius: 999px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-row-alt) !important;
}
html:root:not(#_) .tx-wh-vtab {
  min-height: 40px !important;
  padding: 0 16px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--tx-text) !important;
  font-size: var(--tx-size-min) !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}
html:root:not(#_) .tx-wh-vtab.is-active {
  background: var(--tx-primary) !important;
  color: var(--tx-on-primary) !important;
}
html:root:not(#_) .tx-wh-video-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) !important;
  gap: 20px !important;
  align-items: center !important;
}
@media (max-width: 980px) {
  html:root:not(#_) .tx-wh-video-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
html:root:not(#_) .tx-wh-video-player video {
  width: 100% !important;
  display: block !important;
  border-radius: 16px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: #0B1A1A !important;
}
html:root:not(#_) .tx-wh-video-steps {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
html:root:not(#_) .tx-wh-video-steps li a {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 12px 16px !important;
  border-radius: 14px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-row-alt) !important;
  color: var(--tx-text) !important;
  text-decoration: none !important;
}
html:root:not(#_) .tx-wh-video-steps li a:hover {
  border-color: var(--tx-apricot) !important;
}
html:root:not(#_) .tx-wh-video-steps li a strong {
  font-size: var(--tx-size-min) !important;
  font-weight: 800 !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) .tx-wh-video-steps li a span {
  font-size: var(--tx-size-min) !important;
  font-weight: 500 !important;
  color: var(--tx-text) !important;
}

/* ═══ Labor Dashboard: Team & Operational Reports Hub ═══ */
html:root:not(#_) body.labor-dashboard-page .labor-hub-container {
  max-width: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: var(--tx-gap) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 20px !important;
  align-items: center !important;
}
@media (max-width: 900px) {
  html:root:not(#_) body.labor-dashboard-page .labor-hub-hero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-quick-links {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 14px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-qbtn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 40px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-row-alt) !important;
  color: var(--tx-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-qbtn.is-primary {
  background: var(--tx-primary) !important;
  border-color: var(--tx-primary) !important;
  color: var(--tx-on-primary) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-qbtn:hover {
  border-color: var(--tx-apricot) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-clock-box {
  padding: 16px 22px !important;
  border-radius: 18px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-row-alt) !important;
  text-align: right !important;
  min-width: 240px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-clock-kicker {
  display: block !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--tx-muted) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-clock-time {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--tx-numbers) !important;
  line-height: 1.15 !important;
  margin: 4px 0 2px !important;
  text-shadow: none !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-clock-date {
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--tx-muted) !important;
  margin: 0 !important;
  text-shadow: none !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-kpi-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: var(--tx-gap) !important;
}
@media (max-width: 1100px) {
  html:root:not(#_) body.labor-dashboard-page .labor-hub-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  html:root:not(#_) body.labor-dashboard-page .labor-hub-kpi-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-tabs {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 5px !important;
  border-radius: 999px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-card) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-tab {
  min-height: 38px !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--tx-text) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-tab.is-active {
  background: var(--tx-primary) !important;
  color: var(--tx-on-primary) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-panel {
  padding: 22px 24px !important;
  border-radius: var(--tx-radius-card) !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-card) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-panel[hidden] {
  display: none !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-panel-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding-bottom: 14px !important;
  border-bottom: 1.5px solid var(--tx-line) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-panel-title {
  margin: 4px 0 4px !important;
  font-size: var(--tx-size-section) !important;
  font-weight: 800 !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-panel-sub {
  margin: 0 !important;
  font-size: 14px !important;
  color: var(--tx-muted) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-link {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-row-alt) !important;
  color: var(--tx-primary) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-table-wrap {
  overflow-x: auto !important;
  border-radius: 14px !important;
  border: 1.5px solid var(--tx-line) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-table th,
html:root:not(#_) body.labor-dashboard-page .labor-hub-table td {
  padding: 11px 14px !important;
  text-align: left !important;
  border-bottom: 1px solid var(--tx-line) !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-table th {
  background: var(--tx-row-alt) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--tx-muted) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-table .num {
  text-align: right !important;
  font-variant-numeric: tabular-nums !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-split-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}
@media (max-width: 980px) {
  html:root:not(#_) body.labor-dashboard-page .labor-hub-split-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
html:root:not(#_) body.labor-dashboard-page .labor-hub-subtitle {
  margin: 0 0 10px !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-dash-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin-top: 4px !important;
}
@media (max-width: 780px) {
  html:root:not(#_) body.labor-dashboard-page .labor-dash-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
html:root:not(#_) body.labor-dashboard-page .labor-action-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 18px 22px !important;
  border-radius: 16px !important;
  border: 1.5px solid var(--tx-line) !important;
  background: var(--tx-row-alt) !important;
  text-align: left !important;
  text-decoration: none !important;
  color: var(--tx-text) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-card:hover {
  border-color: var(--tx-apricot) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-icon {
  font-size: 32px !important;
  margin: 0 !important;
  color: var(--tx-primary) !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-copy {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-title {
  font-size: 17px !important;
  font-weight: 800 !important;
  color: var(--tx-text) !important;
  margin: 0 0 4px !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-desc {
  font-size: 14px !important;
  color: var(--tx-muted) !important;
  max-width: none !important;
  margin: 0 !important;
}
html:root:not(#_) body.labor-dashboard-page .labor-action-cta {
  padding: 8px 14px !important;
  border-radius: 999px !important;
  background: var(--tx-primary) !important;
  color: var(--tx-on-primary) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

