/**
 * Site color palette — single source of truth.
 * All other CSS files must reference these tokens via var(--name), never raw hex/rgba.
 */

:root {
  /* ── Primitives: neutrals ── */
  --color-white: #ffffff;
  --color-black: #000000;
  --color-ink: #111111;
  --color-ink-deep: #111827;
  --color-ink-mid: #09090b;
  --color-ink-soft: #1a1a1a;
  --color-ink-brown: #1a0a00;
  --color-ink-brown-dark: #1a0a04;
  --color-slate-950: #0f172a;
  --color-slate-900: #0f1f33;
  --color-slate-850: #152a45;
  --color-slate-800: #1e293b;
  --color-slate-750: #151a25;
  --color-slate-700: #334155;
  --color-slate-600: #475569;
  --color-slate-500: #64748b;
  --color-slate-400: #94a3b8;
  --color-slate-300: #cbd5e1;
  --color-slate-200: #e2e8f0;
  --color-slate-150: #e8e8e8;
  --color-slate-100: #f1f5f9;
  --color-slate-50: #f8fafc;
  --color-gray-50: #fafafa;
  --color-gray-100: #f5f5f7;
  --color-gray-150: #eef0f5;
  --color-gray-200: #f5f3ff;
  --color-gray-250: #faf5ff;
  --color-gray-300: #f4f6fb;
  --color-gray-400: #e4e4e7;
  --color-gray-500: #d4d4d8;
  --color-gray-600: #a3a3a3;
  --color-gray-650: #a1a1aa;
  --color-gray-700: #737373;
  --color-gray-750: #71717a;
  --color-gray-800: #545454;
  --color-gray-850: #3f3f46;
  --color-gray-900: #2c2f36;
  --color-zinc-950: #050508;
  --color-zinc-900: #0a0a0c;
  --color-zinc-850: #0b0b0b;
  --color-zinc-800: #0f0f0f;
  --color-zinc-750: #0f0f12;
  --color-zinc-700: #141414;
  --color-zinc-650: #121218;
  --color-zinc-600: #18181b;
  --color-zinc-550: #18181e;
  --color-zinc-500: #1a1a22;
  --color-zinc-450: #1e1e26;
  --color-zinc-400: #1e1e24;
  --color-zinc-350: #24242c;
  --color-zinc-300: #141418;
  --color-zinc-250: #151821;

  /* ── Primitives: brand hues ── */
  --color-orange-300: #f7a87c;
  --color-orange-400: #f97316;
  --color-orange-500: #ea8b5c;
  --color-orange-600: #fb923c;
  --color-orange-700: #c2410c;
  --color-amber-300: #fbbf24;
  --color-amber-400: #f59e0b;
  --color-amber-500: #eab308;
  --color-amber-600: #facc15;
  --color-amber-700: #b45309;
  --color-amber-800: #fcd34d;
  --color-amber-900: #fde68a;
  --color-yellow-400: #f9ce34;
  --color-red-300: #fca5a5;
  --color-red-400: #f87171;
  --color-red-500: #ef4444;
  --color-red-600: #dc2626;
  --color-red-700: #b42318;
  --color-red-800: #fecaca;
  --color-red-900: #fe2c55;
  --color-rose-500: #f43f5e;
  --color-rose-600: #ee2a7b;
  --color-pink-500: #ec4899;
  --color-green-300: #86efac;
  --color-green-400: #4ade80;
  --color-green-500: #22c55e;
  --color-green-600: #16a34a;
  --color-green-700: #059669;
  --color-green-800: #15803d;
  --color-green-900: #1e9f4a;
  --color-green-950: #006621;
  --color-green-pale: #eafff4;
  --color-emerald-500: #34d399;
  --color-teal-500: #14b8a6;
  --color-cyan-400: #22d3ee;
  --color-cyan-500: #06b6d4;
  --color-cyan-600: #0ea5e9;
  --color-cyan-700: #38bdf8;
  --color-sky-300: #7dd3fc;
  --color-sky-400: #38bdf8;
  --color-sky-500: #0ea5e9;
  --color-sky-600: #bae6fd;
  --color-sky-700: #93c5fd;
  --color-sky-800: #dbeafe;
  --color-blue-400: #60a5fa;
  --color-blue-500: #3b82f6;
  --color-blue-600: #2563eb;
  --color-blue-700: #1a0dab;
  --color-blue-800: #4b9bff;
  --color-blue-900: #0085ff;
  --color-blue-brand: #1d9bf0;
  --color-blue-950: #1e3a5f;
  --color-indigo-300: #818cf8;
  --color-indigo-400: #6366f1;
  --color-indigo-500: #6366f1;
  --color-indigo-600: #4f46e5;
  --color-violet-300: #c4b5fd;
  --color-violet-400: #a78bfa;
  --color-violet-500: #8b5cf6;
  --color-violet-600: #7c3aed;
  --color-violet-700: #6d28d9;
  --color-violet-800: #6228d7;
  --color-violet-900: #9333ea;
  --color-purple-400: #c084fc;
  --color-purple-500: #a855f7;
  --color-purple-600: #e9d5ff;
  --color-purple-soft: #ede9fe;
  --color-purple-border: #ddd6fe;
  --color-purple-gradient-end: #e0e7ff;
  --color-purple-deep: #6d28d9;

  /* ── Primitives: platform / social brand colors ── */
  --platform-linkedin: #0a66c2;
  --platform-linkedin-dark: #004182;
  --platform-facebook: #1877f2;
  --platform-google: #4285f4;
  --platform-devto: #0a0a0a;
  --platform-instagram-yellow: #f9ce34;
  --platform-instagram-pink: #ee2a7b;
  --platform-instagram-purple: #6228d7;
  --platform-tiktok-cyan: #25f4ee;
  --platform-tiktok-red: #fe2c55;
  --platform-youtube: #ff0000;
  --platform-telegram: #229ed9;
  --platform-pinterest: #e60023;
  --platform-reddit: #ff4500;
  --platform-mastodon: #6364ff;
  --platform-wordpress: #21759b;
  --platform-discord: #5865f2;
  --platform-bluesky: #1185fe;
  --platform-whatsapp: #25d366;
  --platform-stripe: #635bff;
  --platform-paypal: #003087;
  --platform-instagram: #e4405f;

  /* ── Primitives: alpha overlays ── */
  --alpha-black-04: rgba(0, 0, 0, 0.04);
  --alpha-black-06: rgba(0, 0, 0, 0.06);
  --alpha-black-08: rgba(0, 0, 0, 0.08);
  --alpha-black-12: rgba(0, 0, 0, 0.12);
  --alpha-black-18: rgba(0, 0, 0, 0.18);
  --alpha-black-35: rgba(0, 0, 0, 0.35);
  --alpha-white-04: rgba(255, 255, 255, 0.04);
  --alpha-white-06: rgba(255, 255, 255, 0.06);
  --alpha-white-08: rgba(255, 255, 255, 0.08);
  --alpha-white-09: rgba(255, 255, 255, 0.09);
  --alpha-white-12: rgba(255, 255, 255, 0.12);
  --alpha-white-35: rgba(255, 255, 255, 0.35);
  --alpha-slate-06: rgba(15, 23, 42, 0.06);
  --alpha-slate-08: rgba(15, 23, 42, 0.08);
  --alpha-slate-10: rgba(15, 23, 42, 0.1);
  --alpha-slate-12: rgba(15, 23, 42, 0.12);
  --alpha-slate-18: rgba(15, 23, 42, 0.18);
  --alpha-orange-08: rgba(224, 122, 79, 0.08);
  --alpha-orange-10: rgba(224, 122, 79, 0.1);
  --alpha-orange-12: rgba(224, 122, 79, 0.12);
  --alpha-orange-14: rgba(224, 122, 79, 0.14);
  --alpha-orange-15: rgba(247, 168, 124, 0.15);
  --alpha-orange-20: rgba(247, 168, 124, 0.2);
  --alpha-orange-25: rgba(224, 122, 79, 0.25);
  --alpha-orange-35: rgba(224, 122, 79, 0.35);
  --alpha-orange-45: rgba(224, 122, 79, 0.45);
  --alpha-orange-50: rgba(224, 122, 79, 0.5);
  --alpha-orange-55: rgba(247, 168, 124, 0.55);
  --alpha-indigo-06: rgba(99, 102, 241, 0.06);
  --alpha-indigo-08: rgba(99, 102, 241, 0.08);
  --alpha-indigo-10: rgba(99, 102, 241, 0.1);
  --alpha-indigo-12: rgba(99, 102, 241, 0.12);
  --alpha-indigo-15: rgba(99, 102, 241, 0.15);
  --alpha-indigo-16: rgba(99, 102, 241, 0.16);
  --alpha-indigo-18: rgba(99, 102, 241, 0.18);
  --alpha-indigo-20: rgba(99, 102, 241, 0.2);
  --alpha-indigo-22: rgba(99, 102, 241, 0.22);
  --alpha-indigo-25: rgba(99, 102, 241, 0.25);
  --alpha-indigo-35: rgba(99, 102, 241, 0.35);
  --alpha-indigo-40: rgba(99, 102, 241, 0.4);
  --alpha-indigo-45: rgba(99, 102, 241, 0.45);
  --alpha-indigo-55: rgba(99, 102, 241, 0.55);
  --alpha-indigo-85: rgba(99, 102, 241, 0.85);
  --alpha-indigo-90: rgba(99, 102, 241, 0.9);
  --alpha-purple-06: rgba(168, 85, 247, 0.06);
  --alpha-purple-08: rgba(168, 85, 247, 0.08);
  --alpha-purple-10: rgba(168, 85, 247, 0.1);
  --alpha-purple-12: rgba(168, 85, 247, 0.12);
  --alpha-purple-14: rgba(168, 85, 247, 0.14);
  --alpha-purple-15: rgba(168, 85, 247, 0.15);
  --alpha-purple-18: rgba(168, 85, 247, 0.18);
  --alpha-purple-20: rgba(168, 85, 247, 0.2);
  --alpha-purple-22: rgba(168, 85, 247, 0.22);
  --alpha-purple-25: rgba(147, 51, 234, 0.25);
  --alpha-purple-35: rgba(168, 85, 247, 0.35);
  --alpha-purple-40: rgba(168, 85, 247, 0.4);
  --alpha-purple-45: rgba(168, 85, 247, 0.45);
  --alpha-purple-50: rgba(168, 85, 247, 0.5);
  --alpha-purple-95: rgba(168, 85, 247, 0.95);
  --alpha-purple-brand-35: rgba(168, 85, 247, 0.35);
  --alpha-violet-06: rgba(167, 139, 250, 0.06);
  --alpha-violet-07: rgba(167, 139, 250, 0.07);
  --alpha-violet-12: rgba(167, 139, 250, 0.12);
  --alpha-violet-15: rgba(167, 139, 250, 0.15);
  --alpha-violet-18: rgba(167, 139, 250, 0.18);
  --alpha-violet-28: rgba(167, 139, 250, 0.28);
  --alpha-violet-35: rgba(167, 139, 250, 0.35);
  --alpha-violet-38: rgba(124, 58, 237, 0.38);
  --alpha-violet-45: rgba(124, 58, 237, 0.45);
  --alpha-violet-blog-12: rgba(124, 58, 237, 0.12);
  --alpha-violet-blog-15: rgba(124, 58, 237, 0.15);
  --alpha-violet-blog-35: rgba(124, 58, 237, 0.35);
  --alpha-blue-06: rgba(66, 133, 244, 0.06);
  --alpha-blue-08: rgba(96, 165, 250, 0.08);
  --alpha-blue-12: rgba(37, 99, 235, 0.12);
  --alpha-blue-15: rgba(96, 165, 250, 0.15);
  --alpha-blue-18: rgba(96, 165, 250, 0.18);
  --alpha-blue-20: rgba(92, 158, 255, 0.2);
  --alpha-blue-25: rgba(75, 155, 255, 0.25);
  --alpha-blue-35: rgba(96, 165, 250, 0.35);
  --alpha-blue-40: rgba(96, 165, 250, 0.4);
  --alpha-blue-55: rgba(75, 155, 255, 0.55);
  --alpha-blue-72: rgba(92, 158, 255, 0.72);
  --alpha-linkedin-06: rgba(10, 102, 194, 0.06);
  --alpha-green-08: rgba(34, 197, 94, 0.08);
  --alpha-green-10: rgba(34, 197, 94, 0.1);
  --alpha-green-12: rgba(34, 197, 94, 0.12);
  --alpha-green-15: rgba(34, 197, 94, 0.15);
  --alpha-green-18: rgba(34, 197, 94, 0.18);
  --alpha-green-28: rgba(34, 197, 94, 0.28);
  --alpha-green-35: rgba(34, 197, 94, 0.35);
  --alpha-green-40: rgba(34, 197, 94, 0.4);
  --alpha-green-45: rgba(52, 211, 153, 0.45);
  --alpha-emerald-08: rgba(52, 211, 153, 0.08);
  --alpha-emerald-10: rgba(52, 211, 153, 0.1);
  --alpha-emerald-12: rgba(52, 211, 153, 0.12);
  --alpha-emerald-15: rgba(52, 211, 153, 0.15);
  --alpha-emerald-18: rgba(52, 211, 153, 0.18);
  --alpha-emerald-20: rgba(52, 211, 153, 0.2);
  --alpha-emerald-25: rgba(52, 211, 153, 0.25);
  --alpha-emerald-28: rgba(52, 211, 153, 0.28);
  --alpha-emerald-32: rgba(52, 211, 153, 0.32);
  --alpha-emerald-35: rgba(52, 211, 153, 0.35);
  --alpha-emerald-50: rgba(52, 211, 153, 0.5);
  --alpha-emerald-16: rgba(20, 184, 166, 0.16);
  --alpha-green-bright-10: rgba(74, 222, 128, 0.1);
  --alpha-green-bright-28: rgba(74, 222, 128, 0.28);
  --alpha-teal-20: rgba(16, 185, 129, 0.2);
  --alpha-rose-06: rgba(244, 63, 94, 0.06);
  --alpha-rose-10: rgba(244, 63, 94, 0.1);
  --alpha-rose-12: rgba(244, 63, 94, 0.12);
  --alpha-rose-14: rgba(244, 63, 94, 0.14);
  --alpha-rose-15: rgba(244, 63, 94, 0.15);
  --alpha-rose-20: rgba(244, 63, 94, 0.2);
  --alpha-rose-28: rgba(244, 63, 94, 0.28);
  --alpha-rose-30: rgba(244, 63, 94, 0.3);
  --alpha-rose-35: rgba(244, 63, 94, 0.35);
  --alpha-rose-45: rgba(244, 63, 94, 0.45);
  --alpha-rose-pink-18: rgba(251, 113, 133, 0.18);
  --alpha-red-08: rgba(239, 68, 68, 0.08);
  --alpha-red-10: rgba(248, 113, 113, 0.1);
  --alpha-red-12: rgba(239, 68, 68, 0.12);
  --alpha-red-15: rgba(239, 68, 68, 0.15);
  --alpha-red-35: rgba(248, 113, 113, 0.4);
  --alpha-red-40: rgba(239, 68, 68, 0.4);
  --alpha-amber-08: rgba(250, 204, 21, 0.08);
  --alpha-amber-10: rgba(250, 204, 21, 0.1);
  --alpha-amber-12: rgba(245, 158, 11, 0.12);
  --alpha-amber-15: rgba(251, 191, 36, 0.15);
  --alpha-amber-20: rgba(245, 158, 11, 0.2);
  --alpha-amber-25: rgba(251, 191, 36, 0.25);
  --alpha-amber-35: rgba(245, 158, 11, 0.35);
  --alpha-amber-45: rgba(250, 204, 21, 0.45);
  --alpha-amber-95: rgba(245, 158, 11, 0.95);
  --alpha-amber-deep-95: rgba(217, 119, 6, 0.95);
  --alpha-orange-ui-12: rgba(251, 146, 60, 0.12);
  --alpha-cyan-10: rgba(56, 189, 248, 0.1);
  --alpha-cyan-20: rgba(56, 189, 248, 0.2);
  --alpha-pink-18: rgba(236, 72, 153, 0.18);
  --alpha-slate-14: rgba(148, 163, 184, 0.14);
  --alpha-slate-15: rgba(148, 163, 184, 0.15);
  --alpha-slate-28: rgba(154, 164, 182, 0.28);
  --alpha-slate-muted-28: rgba(148, 163, 184, 0.28);
  --alpha-slate-38: rgba(148, 163, 184, 0.38);
  --alpha-slate-40: rgba(148, 163, 184, 0.4);
  --alpha-slate-45: rgba(154, 164, 182, 0.45);
  --alpha-slate-55: rgba(154, 164, 182, 0.55);
  --alpha-ink-62: rgba(9, 9, 11, 0.62);
  --alpha-black-16: rgba(0, 0, 0, 0.16);
  --alpha-black-20: rgba(0, 0, 0, 0.2);
  --alpha-black-25: rgba(0, 0, 0, 0.25);
  --alpha-black-38: rgba(0, 0, 0, 0.38);
  --alpha-black-40: rgba(0, 0, 0, 0.4);
  --alpha-black-45: rgba(0, 0, 0, 0.45);
  --alpha-black-50: rgba(0, 0, 0, 0.5);
  --alpha-black-52: rgba(0, 0, 0, 0.52);
  --alpha-black-55: rgba(0, 0, 0, 0.55);
  --alpha-black-65: rgba(0, 0, 0, 0.65);
  --alpha-black-70: rgba(0, 0, 0, 0.7);
  --alpha-black-72: rgba(0, 0, 0, 0.72);
  --alpha-white-03: rgba(255, 255, 255, 0.03);
  --alpha-white-05: rgba(255, 255, 255, 0.05);
  --alpha-white-10: rgba(255, 255, 255, 0.1);
  --alpha-white-15: rgba(255, 255, 255, 0.15);
  --alpha-white-20: rgba(255, 255, 255, 0.2);
  --alpha-white-25: rgba(255, 255, 255, 0.25);
  --alpha-white-90: rgba(255, 255, 255, 0.9);
  --alpha-white-95: rgba(255, 255, 255, 0.95);
  --alpha-pink-15: rgba(236, 72, 153, 0.15);
  --alpha-cyan-ui-55: rgba(34, 211, 238, 0.55);
  --alpha-cyan-ui-75: rgba(34, 211, 238, 0.75);
  --alpha-cyan-ui-95: rgba(34, 211, 238, 0.95);
  --alpha-green-ui-35: rgba(52, 211, 153, 0.35);
  --alpha-green-dark-95: rgba(20, 30, 25, 0.95);
  --alpha-scrim-dark: rgba(8, 10, 18, 0.72);
  --alpha-scrim-light: rgba(248, 250, 252, 0.82);
  --alpha-scrim-slate: rgba(15, 23, 42, 0.1);
  --alpha-scrim-slate-12: rgba(15, 23, 42, 0.12);
  --alpha-lp-glow: rgba(168, 85, 247, 0.45);
  --alpha-lp-border: rgba(255, 255, 255, 0.08);
  --alpha-green-14: rgba(34, 197, 94, 0.14);
  --alpha-green-20: rgba(34, 197, 94, 0.2);
  --alpha-green-30: rgba(34, 197, 94, 0.3);
  --alpha-green-36: rgba(34, 197, 94, 0.36);
  --alpha-green-45-shadow: rgba(34, 197, 94, 0.45);
  --alpha-red-14: rgba(239, 68, 68, 0.14);
  --alpha-red-20: rgba(239, 68, 68, 0.2);
  --alpha-red-45: rgba(239, 68, 68, 0.45);
  --alpha-blue-10: rgba(96, 165, 250, 0.1);
  --alpha-blue-14: rgba(96, 165, 250, 0.14);
  --alpha-blue-20: rgba(96, 165, 250, 0.2);
  --alpha-blue-55: rgba(96, 165, 250, 0.55);
  --alpha-blue-80: rgba(96, 165, 250, 0.8);
  --alpha-blue-90: rgba(96, 165, 250, 0.9);
  --alpha-blue-500-12: rgba(59, 130, 246, 0.12);
  --alpha-blue-500-18: rgba(59, 130, 246, 0.18);
  --alpha-blue-500-22: rgba(59, 130, 246, 0.22);
  --alpha-blue-600-88: rgba(37, 99, 235, 0.88);
  --alpha-slate-12: rgba(148, 163, 184, 0.12);
  --alpha-slate-16: rgba(148, 163, 184, 0.16);
  --alpha-slate-18: rgba(148, 163, 184, 0.18);
  --alpha-slate-24: rgba(148, 163, 184, 0.24);
  --alpha-slate-45: rgba(15, 23, 42, 0.45);
  --alpha-slate-50: rgba(15, 23, 42, 0.5);
  --alpha-slate-80: rgba(148, 163, 184, 0.8);
  --alpha-slate-85: rgba(148, 163, 184, 0.85);
  --alpha-slate-500-15: rgba(100, 116, 139, 0.15);
  --alpha-slate-shadow-28: rgba(15, 23, 42, 0.28);
  --alpha-slate-text-78: rgba(226, 232, 240, 0.78);
  --alpha-slate-text-85: rgba(226, 232, 240, 0.85);
  --alpha-slate-text-88: rgba(226, 232, 240, 0.88);
  --alpha-ink-35: rgba(17, 24, 39, 0.35);
  --alpha-midnight-28: rgba(2, 6, 23, 0.28);
  --alpha-midnight-34: rgba(2, 6, 23, 0.34);
  --alpha-midnight-42: rgba(2, 6, 23, 0.42);
  --alpha-yellow-18: rgba(234, 179, 8, 0.18);
  --alpha-white-02: rgba(255, 255, 255, 0.02);
  --alpha-white-18: rgba(255, 255, 255, 0.18);
  --alpha-emerald-600-88: rgba(5, 150, 105, 0.88);
  --alpha-violet-blog-08: rgba(124, 58, 237, 0.08);
  --alpha-violet-blog-18: rgba(124, 58, 237, 0.18);
  --alpha-violet-blog-22: rgba(124, 58, 237, 0.22);
  --alpha-violet-blog-25: rgba(124, 58, 237, 0.25);
  --alpha-violet-blog-50: rgba(124, 58, 237, 0.5);
  --alpha-violet-blog-88: rgba(124, 58, 237, 0.88);
  --alpha-purple-55: rgba(168, 85, 247, 0.55);
  --alpha-purple-90: rgba(168, 85, 247, 0.9);
  --alpha-purple-24: rgba(168, 85, 247, 0.24);
  --alpha-purple-deep-14: rgba(147, 51, 234, 0.14);
  --alpha-pink-12: rgba(236, 72, 153, 0.12);
  --alpha-pink-20: rgba(236, 72, 153, 0.2);
  --alpha-green-bright-08: rgba(74, 222, 128, 0.08);
  --alpha-green-bright-12: rgba(74, 222, 128, 0.12);
  --alpha-green-bright-15: rgba(74, 222, 128, 0.15);
  --alpha-green-bright-35: rgba(74, 222, 128, 0.35);
  --alpha-green-bright-55: rgba(74, 222, 128, 0.55);
  --alpha-cyan-ui-35: rgba(34, 211, 238, 0.35);
  --alpha-cyan-ui-70: rgba(34, 211, 238, 0.7);
  --alpha-violet-40: rgba(167, 139, 250, 0.4);
  --alpha-violet-65: rgba(167, 139, 250, 0.65);
  --alpha-slate-35: rgba(15, 23, 42, 0.35);
  --alpha-lp-border-purple: rgba(168, 85, 247, 0.35);
  --alpha-indigo-meter: rgba(129, 140, 248, 0.35);

  /* ── Semantic: brand accents ── */
  --accent-orange: var(--color-orange-300);
  --accent-orange-dim: var(--alpha-orange-15);
  --accent-orange-strong: var(--color-orange-400);
  --accent-purple: var(--color-violet-400);
  --accent-purple-vivid: var(--color-purple-500);
  --accent-green: var(--color-emerald-500);
  --accent-blue: var(--color-blue-400);
  --accent-color: var(--color-blue-brand);
  --accent: var(--color-indigo-500);

  /* ── Semantic: status ── */
  --color-success: var(--color-green-500);
  --color-success-light: var(--color-green-400);
  --color-success-dark: var(--color-green-600);
  --color-danger: var(--color-rose-500);
  --color-danger-red: var(--color-red-500);
  --danger: var(--color-red-700);
  --color-warning: var(--color-amber-400);
  --color-warning-light: var(--color-amber-300);
  --color-info: var(--color-blue-400);
  --color-muted: var(--color-slate-500);

  /* ── Semantic: status backgrounds ── */
  --color-success-bg: var(--alpha-green-08);
  --color-success-border: var(--alpha-green-28);
  --color-danger-bg: var(--alpha-rose-10);
  --color-danger-border: var(--alpha-rose-20);
  --color-warning-bg: var(--alpha-amber-10);
  --color-warning-border: var(--alpha-amber-45);
  --color-info-bg: var(--alpha-blue-08);
  --color-info-border: var(--alpha-blue-40);
  --badge-success-bg: var(--alpha-emerald-15);
  --badge-warning-bg: var(--alpha-amber-15);
  --badge-danger-bg: var(--alpha-rose-15);
  --badge-info-bg: var(--alpha-blue-18);
  --badge-muted-bg: var(--alpha-slate-15);

  /* ── Semantic: nav dots ── */
  --dot-publishing: var(--color-violet-400);
  --dot-accounts: var(--color-orange-300);
  --dot-analytics: var(--color-purple-400);
  --dot-billing: var(--color-emerald-500);
  --dot-account: var(--color-cyan-700);
  --dot-admin: var(--color-rose-500);

  /* ── Semantic: chart series ── */
  --chart-1: var(--color-indigo-500);
  --chart-2: var(--platform-linkedin);
  --chart-3: var(--platform-instagram);
  --chart-4: var(--color-orange-400);
  --chart-5: var(--color-green-500);
  --chart-6: var(--color-pink-500);
  --chart-7: var(--color-teal-500);
  --chart-8: var(--color-purple-500);
  --chart-fallback: var(--color-slate-600);
  --chart-format-video: var(--color-purple-500);
  --chart-format-carousel: var(--color-indigo-500);
  --chart-format-image: var(--color-pink-500);
  --chart-format-text: var(--color-slate-400);

  /* ── Semantic: AI meter gradients ── */
  --ai-meter-from: var(--color-indigo-300);
  --ai-meter-to: var(--color-cyan-400);
  --ai-meter-glow: var(--alpha-indigo-meter);
  --ai-meter-warn-from: var(--color-amber-400);
  --ai-meter-warn-to: var(--color-amber-300);
  --ai-meter-warn-glow: var(--alpha-amber-35);
  --ai-meter-danger-from: var(--color-red-400);
  --ai-meter-danger-to: var(--color-orange-600);
  --ai-meter-danger-glow: var(--alpha-red-35);

  /* ── Semantic: gradients ── */
  --gradient-brand: linear-gradient(135deg, var(--color-indigo-500), var(--color-pink-500));
  --gradient-brand-triple: linear-gradient(135deg, var(--color-indigo-500) 0%, var(--color-purple-500) 50%, var(--color-pink-500) 100%);
  --gradient-brand-purple: linear-gradient(135deg, var(--color-indigo-500) 0%, var(--color-violet-600) 100%);
  --gradient-brand-full: linear-gradient(135deg, var(--color-indigo-500) 0%, var(--color-violet-500) 50%, var(--color-blue-500) 100%);
  --gradient-purple-vivid: linear-gradient(135deg, var(--color-purple-500) 0%, var(--color-violet-900) 100%);

  /* ── Landing accent (referenced by pricing + marketing) ── */
  --lp-accent: #e07a4f;
  --lp-accent-deep: #c96a42;
  --lp-accent-soft: #fff4ef;
  --lp-accent-text: #9a4520;
  --lp-accent-text-on-soft: #7a3618;

  /* ── Semantic: pricing “most popular” (app plans + landing) ── */
  --plan-popular-badge-bg: var(--lp-accent);
  --plan-popular-badge-color: var(--color-white);
  --plan-popular-badge-shadow: 0 0 0 1px var(--alpha-orange-12), 0 4px 20px var(--alpha-orange-35);
  --plan-popular-line-gradient: linear-gradient(
    90deg,
    transparent,
    var(--lp-accent) 20%,
    var(--lp-accent-deep) 80%,
    transparent
  );
  --plan-popular-line-shadow: 0 0 14px var(--alpha-orange-35);
  --plan-featured-border-color: var(--alpha-orange-45);
  --plan-featured-highlight: var(--alpha-orange-12);
  --plan-featured-ring-shadow: 0 0 0 1px var(--alpha-orange-15);
  --gradient-purple-vertical: linear-gradient(180deg, var(--color-purple-500), var(--color-indigo-500));
  --gradient-cyan: linear-gradient(135deg, var(--color-sky-500), var(--color-cyan-500));
  --gradient-sky-indigo: linear-gradient(90deg, var(--color-cyan-700), var(--color-indigo-300));
  --gradient-violet-brand: linear-gradient(135deg, var(--color-violet-600), var(--color-violet-400));
  --gradient-linkedin: linear-gradient(135deg, var(--platform-linkedin), var(--platform-linkedin-dark));
  --gradient-orange-cta: linear-gradient(135deg, var(--color-orange-300), var(--color-orange-500));
  --gradient-slate: linear-gradient(135deg, var(--color-slate-400), var(--color-slate-500));
  --gradient-receipt: linear-gradient(165deg, var(--color-blue-950) 0%, var(--color-slate-850) 48%, var(--color-slate-900) 100%);
  --gradient-lp-hero: linear-gradient(165deg, var(--color-zinc-600) 0%, var(--color-zinc-900) 100%);
  --gradient-lp-cta: linear-gradient(135deg, var(--color-violet-900) 0%, var(--color-violet-600) 50%, var(--color-pink-500) 100%);
  --gradient-blog-hero: linear-gradient(135deg, var(--color-gray-200) 0%, var(--color-gray-250) 45%, var(--color-slate-50) 100%);
  --gradient-blog-card: linear-gradient(135deg, var(--color-purple-soft) 0%, var(--color-purple-gradient-end) 100%);
  --gradient-blog-cta: linear-gradient(135deg, var(--color-gray-200) 0%, var(--color-purple-soft) 50%, var(--color-gray-250) 100%);
  --gradient-blog-btn: linear-gradient(135deg, var(--blog-primary) 0%, var(--color-violet-700) 100%);
  --gradient-instagram: linear-gradient(45deg, var(--platform-instagram-yellow) 0%, var(--platform-instagram-pink) 48%, var(--platform-instagram-purple) 100%);
  --gradient-success-badge: linear-gradient(135deg, var(--color-green-400) 0%, var(--color-amber-600) 100%);
  --gradient-indigo-fade: linear-gradient(180deg, var(--color-indigo-500), var(--alpha-indigo-40));
  --gradient-modal-purple: linear-gradient(135deg, var(--color-purple-500) 20%, var(--color-violet-900) 80%, transparent);
  --gradient-kpi-indigo: linear-gradient(135deg, var(--alpha-indigo-22), var(--alpha-purple-15));
  --gradient-kpi-sky: linear-gradient(135deg, var(--alpha-cyan-20), var(--alpha-indigo-12));
  --gradient-kpi-pink: linear-gradient(135deg, var(--alpha-pink-18), var(--alpha-purple-12));
  --gradient-kpi-green: linear-gradient(135deg, var(--alpha-green-18), var(--alpha-cyan-10));
  --gradient-composer-highlight: linear-gradient(145deg, var(--alpha-indigo-12), var(--alpha-purple-06));
  --gradient-insights-bar: linear-gradient(180deg, var(--alpha-purple-95), var(--alpha-indigo-40));
  --gradient-insights-promo: linear-gradient(135deg, var(--alpha-indigo-10), var(--alpha-purple-08));
  --gradient-insights-icon: linear-gradient(135deg, var(--alpha-indigo-12), var(--alpha-purple-08));
  --gradient-lp-glow: radial-gradient(ellipse 80% 60% at 50% 40%, var(--alpha-lp-glow), transparent 70%);

  /* ── Semantic: misc UI ── */
  --color-primary: var(--color-blue-600);
  --color-on-accent: var(--color-white);
  --color-on-dark: var(--color-slate-50);
  --color-on-brand-dark: var(--color-ink-brown);
  --surface-subtle: var(--color-slate-50);
  --border-subtle: var(--color-slate-150);
  --surface: var(--color-white);
  --text-on-dark: var(--color-slate-50);
  --muted: var(--color-slate-400);
  --offline-card-dark-bg: var(--color-zinc-250);
  --offline-card-dark-text: var(--color-gray-300);
  --offline-icon-muted: var(--color-slate-400);
  --offline-icon-muted-light: var(--color-slate-500);
  --offline-btn-bg: var(--color-indigo-500);

  /* ── Landing page aliases ── */
  --lp-bg: #ffffff;
  --lp-bg-elevated: #f9fafb;
  --lp-bg-card: #f4f4f5;
  --lp-border: #e4e4e7;
  --lp-border-strong: rgba(224, 122, 79, 0.45);
  --lp-purple: var(--lp-accent);
  --lp-purple-deep: var(--lp-accent-deep);
  --lp-pink: var(--lp-accent);
  --lp-text: #18181b;
  --lp-muted: #5c5c62;
  --lp-muted2: #52525b;
  --lp-glow: none;

  /* ── Landing mockup app aliases ── */
  --ma-bg: var(--color-zinc-850);
  --ma-sidebar: var(--color-zinc-800);
  --ma-elevated: var(--color-zinc-700);
  --ma-input: var(--color-zinc-700);
  --ma-border: rgba(255, 255, 255, 0.08);
  --ma-text: var(--color-gray-50);
  --ma-muted: var(--color-gray-600);
  --ma-faint: var(--color-gray-700);
  --ma-orange: var(--lp-accent);
  --ma-orange-dim: var(--alpha-orange-20);
  --ma-border-strong: var(--alpha-white-12);
  --ma-radius: 10px;
  --ma-radius-lg: 14px;
  --ma-purple: var(--lp-accent);
  --ma-dot-pub: var(--lp-accent);
  --ma-dot-acc: var(--color-orange-300);
  --ma-dot-ana: var(--lp-accent);
  --ma-dot-bill: var(--color-emerald-500);
  --ma-dot-user: var(--color-cyan-700);

  /* ── Blog aliases ── */
  --blog-primary: var(--lp-accent-deep);
  --blog-primary-soft: var(--lp-accent-soft);
  --blog-text: var(--color-slate-950);
  --blog-muted: var(--color-slate-500);
  --blog-border: var(--color-slate-200);
  --blog-surface: var(--color-white);
  --blog-bg: var(--color-slate-100);
}

/* ── Theme: light surfaces ── */
[data-theme="light"] {
  --bg-app: var(--color-gray-100);
  --bg-sidebar: var(--color-white);
  --bg-elevated: var(--color-white);
  --bg-input: var(--color-white);
  --bg-hover: var(--alpha-black-04);
  --bg-active: var(--alpha-black-06);
  --border: var(--alpha-black-08);
  --border-strong: var(--alpha-black-12);
  --shadow-card: 0 1px 2px var(--alpha-black-04), 0 1px 3px var(--alpha-black-06);
  --text: var(--color-ink-soft);
  --text-muted: var(--color-gray-700);
  --text-faint: var(--color-gray-600);
  --logo-filter: none;
  --composer-bg: var(--color-gray-150);
}

/* ── Theme: dark surfaces ── */
[data-theme="dark"],
:root:not([data-theme="light"]) {
  --bg-app: var(--color-zinc-300);
  --bg-elevated: var(--color-zinc-400);
  --bg-sidebar: var(--color-zinc-550);
  --bg-input: var(--color-zinc-350);
  --bg-hover: var(--alpha-white-06);
  --bg-active: var(--alpha-white-09);
  --border: var(--alpha-white-08);
  --border-strong: var(--alpha-white-12);
  --text: var(--color-gray-50);
  --text-muted: var(--color-gray-600);
  --text-faint: var(--color-gray-700);
  --surface-subtle: var(--bg-input);
  --border-subtle: var(--border);
  --logo-filter: brightness(0) invert(1);
}