/* AUTO-GENERATED by scripts/build-marketing.js — DO NOT EDIT BY HAND
 * Source: public/index.html (:root + [data-theme] blocks)
 * Scoped to .wf-app so marketing replicas render with the real app palette.
 */

.wf-app {
  /* ── MERIDIAN · Rhodium (light, default) ──
     Var names are legacy (--gold = accent, --white = primary ink); values are
     the Meridian system. Spec: MERIDIAN_DESIGN_SYSTEM.md */
  --bg-void: #f3f4f7;
  --bg-base: #eaecf1;
  --bg-raised: #ffffff;
  --bg-panel: #fcfcfe;
  --bg-hover: #eef0f5;
  --bg-active: #e3e7ef;
  --border: #e0e3eb;
  --border-light: #cfd5e1;
  --gold: #2b50c8;
  --gold-dim: color-mix(in srgb, #2b50c8 9%, transparent);
  --gold-bright: #4570e8;
  --white: #161922;
  --off-white: #3d4452;
  --muted: #6b7383;
  --faint: #a8aebc;
  --green: #1d8a58;
  --green-dim: #e0f3e9;
  --red: #c43d3d;
  --red-dim: #fbe9e9;
  --amber: #a8690e;
  --amber-dim: #f9eedb;
  --blue: #2f6cb3;
  --blue-dim: #e4eef9;
  /* FEAT-12: extra stage colors */
  --purple: #6d52b8;
  --purple-dim: #ece7f8;
  --teal: #15808a;
  --teal-dim: #ddf1f3;
  /* Accent tints — soft category colors */
  --tint-inventory: #f6f7fa;
  --tint-deals: #f0f7f3;
  --tint-revenue: #f8f4ec;
  --tint-contacts: #f0f4fa;
  --tint-inventory-border: rgba(43,80,200,0.14);
  --tint-deals-border: rgba(29,138,88,0.16);
  --tint-revenue-border: rgba(168,105,14,0.16);
  --tint-contacts-border: rgba(47,108,179,0.16);
  /* Type system */
  --font-display: 'Clash Display', 'Switzer', sans-serif;
  --font-ui: 'Switzer', -apple-system, sans-serif;
  --font-mono: 'Spline Sans Mono', ui-monospace, monospace;
  /* 8pt spacing scale */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --sidebar-w: 232px;
  --topbar-h: 44px;
  --radius-xs: 3px;
  --radius-sm: 6px;
  --radius: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-pill: 999px;
  --shadow: 0 12px 32px -8px rgba(22,26,37,0.14);
  --shadow-sm: 0 1px 3px rgba(22,26,37,0.06);
  --shadow-card: 0 0 0 1px rgba(22,26,37,0.04), 0 1px 2px rgba(22,26,37,0.05), 0 10px 28px -14px rgba(22,26,37,0.14);
  /* P1-5: paper-surface tokens (Reports doc; theme-stable cream) */
  --paper-bg:        #f8f5ef;
  --paper-ink:       #241f19;
  --paper-ink-h1:    #17130f;
  --paper-meta:      #776f64;
  --paper-rule:      #ddd3c5;
  --paper-rule-soft: #eee5d8;
  --paper-kpi-bg:    #fffdf9;
  --paper-thead-bg:  #efe8dc;
  --paper-kpi-border:#e2d8ca;
  --paper-h2-ink:    #7a6549;
}

.wf-app[data-theme="midnight-gold"] {
  --bg-void: #0b0e14; --bg-base: #0f131b; --bg-raised: #151a24; --bg-panel: #1a2130;
  --bg-hover: #222a3a; --bg-active: #2a3448; --border: #242c3c; --border-light: #34405a;
  --gold: #7295f2; --gold-dim: color-mix(in srgb, #7295f2 14%, transparent); --gold-bright: #93b2ff;
  --white: #eef1f7; --off-white: #c6cddb; --muted: #8d96a8; --faint: #4e576b;
  --green: #41c98a; --green-dim: #12301f;
  --red: #e87474; --red-dim: #3a1a1d;
  --amber: #dda54a; --amber-dim: #33270f;
  --blue: #6ba3e8; --blue-dim: #16273c;
  --purple: #a18ae0; --purple-dim: #251d3d;
  --teal: #4cc3cf; --teal-dim: #0e3034;
  --tint-inventory: #131825; --tint-deals: #10201a;
  --tint-revenue: #201a10; --tint-contacts: #101a26;
  --tint-inventory-border: rgba(114,149,242,0.18); --tint-deals-border: rgba(65,201,138,0.16);
  --tint-revenue-border: rgba(221,165,74,0.16); --tint-contacts-border: rgba(107,163,232,0.16);
  --shadow: 0 16px 40px -8px rgba(0,0,0,0.5);
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-card: 0 0 0 1px rgba(255,255,255,0.03), 0 1px 2px rgba(0,0,0,0.4), 0 12px 32px -16px rgba(0,0,0,0.6);
}

.wf-app {
  font-family: 'Switzer', system-ui, -apple-system, sans-serif;
  color: var(--white);
  background: var(--bg-void);
}
.wf-app * { box-sizing: border-box; }
.wf-app .serif { font-family: 'Clash Display', 'Switzer', sans-serif; }
.wf-app .mono { font-family: 'Spline Sans Mono', monospace; }