:root {
  --color-employer-primary: #0891b2;
  --color-employer-surface: #ecfeff;
  --color-employer-border: #a5f3fc;
  --color-creator-primary: #9333ea;
  --color-creator-surface: #faf5ff;
  --color-creator-border: #e9d5ff;
  --color-bg-app: #f8fafc;
  --color-bg-card: #ffffff;
  --color-border-default: #e2e8f0;
  --color-border-subtle: #f1f5f9;
  --color-text-main: #0f172a;
  --color-text-muted: #334155;
  --color-text-subtle: #94a3b8;
  --color-status-success: #10b981;
  --color-status-warning: #f59e0b;
  --color-dark-overlay: rgba(15, 23, 42, .8);
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --font-hero-size: clamp(38px, 5.6vw, 64px);
  --font-hero-line: 1.08;
  --font-hero-weight: 800;
  --font-title-card-size: 15px;
  --font-title-card-line: 1.4;
  --font-title-card-weight: 700;
  --font-body-size: 13.5px;
  --font-body-bold-weight: 700;
  --font-body-regular-weight: 400;
  --font-micro-size: 11px;
  --font-micro-weight: 500;
  --font-micro-bold-weight: 700;
  --radius-sm: 9px;
  --radius-md: 13px;
  --radius-lg: 20px;
  --radius-full: 9999px;
  --glass-blur: blur(24px);
  --glass-bg: rgba(255, 255, 255, .78);
  --hero-blur: blur(150px);
  --hero-glow-opacity: .26;
  --shadow-card: 0 1px 2px rgba(15,23,42,.04), 0 8px 24px -12px rgba(15,23,42,.08);
  --transition-role: all 700ms ease-out;
  --transition-card: all 300ms;
  --shadow-employer: 0 12px 30px -10px rgba(6, 182, 212, .2);
  --shadow-creator: 0 12px 30px -10px rgba(168, 85, 247, .2);
  --watermark-text: rgba(15, 23, 42, .08);
  --watermark-scan: rgba(16, 185, 129, .35);
  --role-primary: var(--color-employer-primary);
  --role-surface: var(--color-employer-surface);
  --role-border: var(--color-employer-border);
  --role-shadow: var(--shadow-employer);
}
[data-role="creator"] {
  --role-primary: var(--color-creator-primary);
  --role-surface: var(--color-creator-surface);
  --role-border: var(--color-creator-border);
  --role-shadow: var(--shadow-creator);
}
