:root, [data-theme="dark"] {
  --neon-crimson: #ff335c;
  --on-crimson: var(--canvas);
  --canvas: #170a0e;
  --ink: #0d0507;
  --surface-1: #201014;
  --surface-2: #291319;
  --surface-elevated: #32161d;
  --border: #4a222c;
  --text-primary: #fff4f7;
  --text-secondary: #cdbcc1;
  --text-muted: #9e8b91;
  --info-cyan: #35bdf5;
  --success-green: #62d26f;
  --warning-amber: #f3b340;
  --secondary-violet: #8d7cff;
  --danger-critical: var(--neon-crimson);
  --wordmark-r3f: var(--text-primary);
  --wordmark-to: var(--text-secondary);
  --wordmark-node: var(--neon-crimson);
  --shadow-overlay: 0 8px 24px rgba(23, 10, 14, 0.6), 0 1px 0 rgba(74, 34, 44, 0.6);
  --focus-ring: 0 0 0 2px rgba(255, 51, 92, 0.35);
}
:root {
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --space-96: 96px;
  --radius-control: 6px;
  --radius-panel: 8px;
  --radius-pill: 999px;
  --sidebar-width: 256px;
  --topbar-height: 64px;
  --content-padding: 32px;
  --panel-gap: 24px;
  --content-max-width: 1440px;
  --marketing-max-width: 1400px;
  --form-max-width: 720px;
  --control-height: 48px;
  --control-height-compact: 36px;
  --nav-item-height: 44px;
  --table-row-height: 52px;
  --table-header-height: 44px;
  --icon-size: 20px;
  --active-fill: #FF335C1A;
  --duration-ui: 150ms;
  --duration-live: 180ms;
  --font-sans: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
}
.meta { font-family: var(--font-sans); font-size:12px; line-height:16px; font-weight:400; }
.label { font-family: var(--font-sans); font-size:12px; line-height:16px; font-weight:600; }
.eyebrow { font-family: var(--font-sans); font-size:12px; line-height:16px; font-weight:700; letter-spacing:0.04em; }
.body-ui { font-family: var(--font-sans); font-size:14px; line-height:20px; font-weight:400; }
.body { font-family: var(--font-sans); font-size:16px; line-height:24px; font-weight:400; }
.panel-title { font-family: var(--font-sans); font-size:16px; line-height:24px; font-weight:700; }
.h3 { font-family: var(--font-sans); font-size:20px; line-height:28px; font-weight:700; }
.h2 { font-family: var(--font-sans); font-size:28px; line-height:36px; font-weight:700; }
.h1-dashboard { font-family: var(--font-sans); font-size:36px; line-height:44px; font-weight:700; }
.h1-marketing { font-family: var(--font-sans); font-size:48px; line-height:56px; font-weight:700; }
.kpi { font-family: var(--font-sans); font-size:32px; line-height:40px; font-weight:700; }
.kpi-large { font-family: var(--font-sans); font-size:40px; line-height:48px; font-weight:700; }
.wordmark { font-family: var(--font-sans); font-size:28px; line-height:32px; font-weight:900; letter-spacing:-0.01em; }
/* type shorthands: font: var(--type-body-ui) */
:root {
  --type-meta: 400 12px/16px var(--font-sans);
  --type-label: 600 12px/16px var(--font-sans);
  --type-eyebrow: 700 12px/16px var(--font-sans);
  --type-body-ui: 400 14px/20px var(--font-sans);
  --type-body: 400 16px/24px var(--font-sans);
  --type-panel-title: 700 16px/24px var(--font-sans);
  --type-h3: 700 20px/28px var(--font-sans);
  --type-h2: 700 28px/36px var(--font-sans);
  --type-h1-dashboard: 700 36px/44px var(--font-sans);
  --type-h1-marketing: 700 48px/56px var(--font-sans);
  --type-kpi: 700 32px/40px var(--font-sans);
  --type-kpi-large: 700 40px/48px var(--font-sans);
  --type-wordmark: 900 28px/32px var(--font-sans);
  --font-sans: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
}