/* GENERATED by lib/tokens/build.ts from source.ts — DO NOT EDIT (RULE §2.9). */
:root {
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;
  --space-13: 128px;
  --font-display: 72px;
  --leading-display: 76px;
  --weight-display: 800;
  --font-h1: 56px;
  --leading-h1: 60px;
  --weight-h1: 800;
  --font-h2: 40px;
  --leading-h2: 46px;
  --weight-h2: 700;
  --font-h3: 28px;
  --leading-h3: 36px;
  --weight-h3: 700;
  --font-h4: 20px;
  --leading-h4: 28px;
  --weight-h4: 600;
  --font-body-lg: 18px;
  --leading-body-lg: 30px;
  --weight-body-lg: 400;
  --font-body: 16px;
  --leading-body: 26px;
  --weight-body: 400;
  --font-body-sm: 14px;
  --leading-body-sm: 22px;
  --weight-body-sm: 400;
  --font-eyebrow: 13px;
  --leading-eyebrow: 16px;
  --weight-eyebrow: 600;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;
  --container-content: 720px;
  --container-wide: 1200px;
  --container-max: 1200px;
  --bwp-shadow-sm: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .10);
  --bwp-shadow-md: 0 4px 8px -2px rgba(16, 24, 40, .08), 0 2px 4px -2px rgba(16, 24, 40, .06);
  --bwp-shadow-lg: 0 12px 24px -6px rgba(16, 24, 40, .12), 0 4px 8px -4px rgba(16, 24, 40, .06);
  --bwp-shadow-xl: 0 24px 48px -12px rgba(16, 24, 40, .18), 0 8px 16px -8px rgba(16, 24, 40, .07);
  --bwp-radius-pill: 9999px;
  --color-surface: #ffffff;
  --color-text: #0d1220;
  --color-primary: #5b4ded;
  --color-on-primary: #ffffff;
  --color-accent: #9333ea;
  --color-on-accent: #ffffff;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --bwp-gradient-brand: linear-gradient(135deg, #5b4ded, #9333ea);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #5b4ded 14%, #ffffff), color-mix(in srgb, #9333ea 12%, #ffffff));
  --bwp-gradient-surface: linear-gradient(180deg, #ffffff, color-mix(in srgb, #0d1220 5%, #ffffff));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #5b4ded 18%, #ffffff), #ffffff 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #0d1220 82%, transparent), color-mix(in srgb, #0d1220 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #5b4ded 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #9333ea 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #0d1220 3%, #ffffff);
  --bwp-surface-2: color-mix(in srgb, #0d1220 6%, #ffffff);
  --bwp-surface-3: color-mix(in srgb, #0d1220 10%, #ffffff);
}

[data-theme="dark-startup"] {
  --color-surface: #05070e;
  --color-text: #f5f8ff;
  --color-primary: #22d3ee;
  --color-on-primary: #05070e;
  --color-accent: #a855f7;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Sora", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #22d3ee, #a855f7);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #22d3ee 14%, #05070e), color-mix(in srgb, #a855f7 12%, #05070e));
  --bwp-gradient-surface: linear-gradient(180deg, #05070e, color-mix(in srgb, #f5f8ff 5%, #05070e));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #22d3ee 18%, #05070e), #05070e 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #f5f8ff 82%, transparent), color-mix(in srgb, #f5f8ff 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #22d3ee 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #a855f7 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #f5f8ff 3%, #05070e);
  --bwp-surface-2: color-mix(in srgb, #f5f8ff 6%, #05070e);
  --bwp-surface-3: color-mix(in srgb, #f5f8ff 10%, #05070e);
}

[data-theme="minimal-mono"] {
  --color-surface: #ffffff;
  --color-text: #181b20;
  --color-primary: #3f4d63;
  --color-on-primary: #ffffff;
  --color-accent: #54627a;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #3f4d63, #54627a);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #3f4d63 14%, #ffffff), color-mix(in srgb, #54627a 12%, #ffffff));
  --bwp-gradient-surface: linear-gradient(180deg, #ffffff, color-mix(in srgb, #181b20 5%, #ffffff));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #3f4d63 18%, #ffffff), #ffffff 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #181b20 82%, transparent), color-mix(in srgb, #181b20 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #3f4d63 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #54627a 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #181b20 3%, #ffffff);
  --bwp-surface-2: color-mix(in srgb, #181b20 6%, #ffffff);
  --bwp-surface-3: color-mix(in srgb, #181b20 10%, #ffffff);
}

[data-theme="warm-editorial"] {
  --color-surface: #f7f0e3;
  --color-text: #312921;
  --color-primary: #c95a2d;
  --color-on-primary: #ffffff;
  --color-accent: #e8941a;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Fraunces", Georgia, Cambria, 'Times New Roman', Times, serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 22px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #c95a2d, #e8941a);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #c95a2d 14%, #f7f0e3), color-mix(in srgb, #e8941a 12%, #f7f0e3));
  --bwp-gradient-surface: linear-gradient(180deg, #f7f0e3, color-mix(in srgb, #312921 5%, #f7f0e3));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #c95a2d 18%, #f7f0e3), #f7f0e3 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #312921 82%, transparent), color-mix(in srgb, #312921 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #c95a2d 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #e8941a 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #312921 3%, #f7f0e3);
  --bwp-surface-2: color-mix(in srgb, #312921 6%, #f7f0e3);
  --bwp-surface-3: color-mix(in srgb, #312921 10%, #f7f0e3);
}

[data-theme="bold-creative"] {
  --color-surface: #ffffff;
  --color-text: #19142a;
  --color-primary: #f01588;
  --color-on-primary: #ffffff;
  --color-accent: #fa7016;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 26px;
  --radius-xl: 36px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #f01588, #fa7016);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #f01588 14%, #ffffff), color-mix(in srgb, #fa7016 12%, #ffffff));
  --bwp-gradient-surface: linear-gradient(180deg, #ffffff, color-mix(in srgb, #19142a 5%, #ffffff));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #f01588 18%, #ffffff), #ffffff 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #19142a 82%, transparent), color-mix(in srgb, #19142a 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #f01588 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #fa7016 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #19142a 3%, #ffffff);
  --bwp-surface-2: color-mix(in srgb, #19142a 6%, #ffffff);
  --bwp-surface-3: color-mix(in srgb, #19142a 10%, #ffffff);
}

[data-theme="corporate-blue"] {
  --color-surface: #ffffff;
  --color-text: #18222f;
  --color-primary: #173bbf;
  --color-on-primary: #ffffff;
  --color-accent: #268add;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 18px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #173bbf, #268add);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #173bbf 14%, #ffffff), color-mix(in srgb, #268add 12%, #ffffff));
  --bwp-gradient-surface: linear-gradient(180deg, #ffffff, color-mix(in srgb, #18222f 5%, #ffffff));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #173bbf 18%, #ffffff), #ffffff 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #18222f 82%, transparent), color-mix(in srgb, #18222f 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #173bbf 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #268add 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #18222f 3%, #ffffff);
  --bwp-surface-2: color-mix(in srgb, #18222f 6%, #ffffff);
  --bwp-surface-3: color-mix(in srgb, #18222f 10%, #ffffff);
}

[data-theme="midnight-luxe"] {
  --color-surface: #11100d;
  --color-text: #eee3d2;
  --color-primary: #d2a851;
  --color-on-primary: #11100d;
  --color-accent: #d6c19c;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Fraunces", Georgia, Cambria, 'Times New Roman', Times, serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 12px;
  --radius-xl: 18px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #d2a851, #d6c19c);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #d2a851 14%, #11100d), color-mix(in srgb, #d6c19c 12%, #11100d));
  --bwp-gradient-surface: linear-gradient(180deg, #11100d, color-mix(in srgb, #eee3d2 5%, #11100d));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #d2a851 18%, #11100d), #11100d 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #eee3d2 82%, transparent), color-mix(in srgb, #eee3d2 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #d2a851 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #d6c19c 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #eee3d2 3%, #11100d);
  --bwp-surface-2: color-mix(in srgb, #eee3d2 6%, #11100d);
  --bwp-surface-3: color-mix(in srgb, #eee3d2 10%, #11100d);
}

[data-theme="ocean-fresh"] {
  --color-surface: #f5fbfd;
  --color-text: #162a32;
  --color-primary: #159aab;
  --color-on-primary: #ffffff;
  --color-accent: #2fc4b2;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #159aab, #2fc4b2);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #159aab 14%, #f5fbfd), color-mix(in srgb, #2fc4b2 12%, #f5fbfd));
  --bwp-gradient-surface: linear-gradient(180deg, #f5fbfd, color-mix(in srgb, #162a32 5%, #f5fbfd));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #159aab 18%, #f5fbfd), #f5fbfd 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #162a32 82%, transparent), color-mix(in srgb, #162a32 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #159aab 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #2fc4b2 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #162a32 3%, #f5fbfd);
  --bwp-surface-2: color-mix(in srgb, #162a32 6%, #f5fbfd);
  --bwp-surface-3: color-mix(in srgb, #162a32 10%, #f5fbfd);
}

[data-theme="deep-navy-serif"] {
  --color-surface: #ffffff;
  --color-text: #10203a;
  --color-primary: #1f3a8a;
  --color-on-primary: #ffffff;
  --color-accent: #3f6fd4;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Lora", Georgia, Cambria, 'Times New Roman', Times, serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 3px;
  --radius-md: 6px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #1f3a8a, #3f6fd4);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #1f3a8a 14%, #ffffff), color-mix(in srgb, #3f6fd4 12%, #ffffff));
  --bwp-gradient-surface: linear-gradient(180deg, #ffffff, color-mix(in srgb, #10203a 5%, #ffffff));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #1f3a8a 18%, #ffffff), #ffffff 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #10203a 82%, transparent), color-mix(in srgb, #10203a 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #1f3a8a 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #3f6fd4 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #10203a 3%, #ffffff);
  --bwp-surface-2: color-mix(in srgb, #10203a 6%, #ffffff);
  --bwp-surface-3: color-mix(in srgb, #10203a 10%, #ffffff);
}

[data-theme="warm-cream"] {
  --color-surface: #fbf6ec;
  --color-text: #3a2f24;
  --color-primary: #b5642f;
  --color-on-primary: #ffffff;
  --color-accent: #d39a4a;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Fraunces", Georgia, Cambria, 'Times New Roman', Times, serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 5px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #b5642f, #d39a4a);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #b5642f 14%, #fbf6ec), color-mix(in srgb, #d39a4a 12%, #fbf6ec));
  --bwp-gradient-surface: linear-gradient(180deg, #fbf6ec, color-mix(in srgb, #3a2f24 5%, #fbf6ec));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #b5642f 18%, #fbf6ec), #fbf6ec 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #3a2f24 82%, transparent), color-mix(in srgb, #3a2f24 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #b5642f 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #d39a4a 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #3a2f24 3%, #fbf6ec);
  --bwp-surface-2: color-mix(in srgb, #3a2f24 6%, #fbf6ec);
  --bwp-surface-3: color-mix(in srgb, #3a2f24 10%, #fbf6ec);
}

[data-theme="dark-gradient"] {
  --color-surface: #0a0a16;
  --color-text: #eef0ff;
  --color-primary: #7c5cff;
  --color-on-primary: #ffffff;
  --color-accent: #22d3ee;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Sora", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 30px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #7c5cff, #22d3ee);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #7c5cff 14%, #0a0a16), color-mix(in srgb, #22d3ee 12%, #0a0a16));
  --bwp-gradient-surface: linear-gradient(180deg, #0a0a16, color-mix(in srgb, #eef0ff 5%, #0a0a16));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #7c5cff 18%, #0a0a16), #0a0a16 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #eef0ff 82%, transparent), color-mix(in srgb, #eef0ff 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #7c5cff 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #22d3ee 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #eef0ff 3%, #0a0a16);
  --bwp-surface-2: color-mix(in srgb, #eef0ff 6%, #0a0a16);
  --bwp-surface-3: color-mix(in srgb, #eef0ff 10%, #0a0a16);
}

[data-theme="soft-pastel"] {
  --color-surface: #fdf7fb;
  --color-text: #3b2f3a;
  --color-primary: #c061c0;
  --color-on-primary: #ffffff;
  --color-accent: #6fb7d4;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-xl: 34px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #c061c0, #6fb7d4);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #c061c0 14%, #fdf7fb), color-mix(in srgb, #6fb7d4 12%, #fdf7fb));
  --bwp-gradient-surface: linear-gradient(180deg, #fdf7fb, color-mix(in srgb, #3b2f3a 5%, #fdf7fb));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #c061c0 18%, #fdf7fb), #fdf7fb 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #3b2f3a 82%, transparent), color-mix(in srgb, #3b2f3a 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #c061c0 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #6fb7d4 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #3b2f3a 3%, #fdf7fb);
  --bwp-surface-2: color-mix(in srgb, #3b2f3a 6%, #fdf7fb);
  --bwp-surface-3: color-mix(in srgb, #3b2f3a 10%, #fdf7fb);
}

[data-theme="mono-editorial"] {
  --color-surface: #ffffff;
  --color-text: #14130f;
  --color-primary: #222019;
  --color-on-primary: #ffffff;
  --color-accent: #9a8c6a;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "IBM Plex Mono", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 1px;
  --radius-md: 2px;
  --radius-lg: 4px;
  --radius-xl: 8px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #222019, #9a8c6a);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #222019 14%, #ffffff), color-mix(in srgb, #9a8c6a 12%, #ffffff));
  --bwp-gradient-surface: linear-gradient(180deg, #ffffff, color-mix(in srgb, #14130f 5%, #ffffff));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #222019 18%, #ffffff), #ffffff 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #14130f 82%, transparent), color-mix(in srgb, #14130f 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #222019 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #9a8c6a 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #14130f 3%, #ffffff);
  --bwp-surface-2: color-mix(in srgb, #14130f 6%, #ffffff);
  --bwp-surface-3: color-mix(in srgb, #14130f 10%, #ffffff);
}

[data-theme="forest-calm"] {
  --color-surface: #f4f8f2;
  --color-text: #1d2b21;
  --color-primary: #2f7a52;
  --color-on-primary: #ffffff;
  --color-accent: #6fae6f;
  --color-surface-alt: color-mix(in srgb, var(--color-text) 4%, var(--color-surface));
  --color-border: color-mix(in srgb, var(--color-text) 12%, var(--color-surface));
  --color-text-muted: color-mix(in srgb, var(--color-text) 55%, var(--color-surface));
  --font-family-heading: "Nunito", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-family-body: "Nunito Sans", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 26px;
  --radius-full: 9999px;
  --bwp-gradient-brand: linear-gradient(135deg, #2f7a52, #6fae6f);
  --bwp-gradient-brand-soft: linear-gradient(135deg, color-mix(in srgb, #2f7a52 14%, #f4f8f2), color-mix(in srgb, #6fae6f 12%, #f4f8f2));
  --bwp-gradient-surface: linear-gradient(180deg, #f4f8f2, color-mix(in srgb, #1d2b21 5%, #f4f8f2));
  --bwp-gradient-radial-glow: radial-gradient(ellipse at 50% 0%, color-mix(in srgb, #2f7a52 18%, #f4f8f2), #f4f8f2 70%);
  --bwp-gradient-dark-fade: linear-gradient(180deg, color-mix(in srgb, #1d2b21 82%, transparent), color-mix(in srgb, #1d2b21 96%, transparent));
  --bwp-glow-1: color-mix(in srgb, #2f7a52 30%, transparent);
  --bwp-glow-2: color-mix(in srgb, #6fae6f 26%, transparent);
  --bwp-surface-1: color-mix(in srgb, #1d2b21 3%, #f4f8f2);
  --bwp-surface-2: color-mix(in srgb, #1d2b21 6%, #f4f8f2);
  --bwp-surface-3: color-mix(in srgb, #1d2b21 10%, #f4f8f2);
}