/* Canonical V289/V289.1 Catchie palettes, scoped to module variables. */
:root,
:root[data-theme="light"] {
  color-scheme: light;
  --catchie-bg1: #eef6ff;
  --catchie-bg2: #fff7ed;
  --catchie-bg3: #f3e8ff;
  --catchie-page-bg: #f8fbff;
  --catchie-surface: rgba(255, 255, 255, 0.86);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(255, 255, 255, 0.64);
  --catchie-surface-muted: #f1f5f9;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: #dbe7ff;
  --catchie-stroke-strong: #bfdbfe;
  --catchie-text: #0f172a;
  --catchie-muted: #475569;
  --catchie-primary: #2563eb;
  --catchie-primary2: #7c3aed;
  --catchie-primary-soft: #eff6ff;
  --catchie-good: #16a34a;
  --catchie-good-soft: #dcfce7;
  --catchie-bad: #ef4444;
  --catchie-bad-soft: #fee2e2;
  --catchie-amber: #b45309;
  --catchie-amber-soft: #fef3c7;
  --catchie-shadow: 0 18px 55px rgba(2, 6, 23, .12);
  --catchie-shadow2: 0 6px 18px rgba(2, 6, 23, .08);
  --catchie-overlay: rgba(15, 23, 42, 0.40);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --catchie-bg1: rgba(37, 99, 235, 0.28);
  --catchie-bg2: rgba(245, 158, 11, 0.12);
  --catchie-bg3: rgba(124, 58, 237, 0.24);
  --catchie-page-bg: #0b1120;
  --catchie-surface: rgba(15, 23, 42, 0.82);
  --catchie-surface-solid: #111827;
  --catchie-surface-soft: rgba(30, 41, 59, 0.74);
  --catchie-surface-muted: #1e293b;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(148, 163, 184, 0.28);
  --catchie-stroke-strong: rgba(147, 197, 253, 0.48);
  --catchie-text: #e5eefb;
  --catchie-muted: #a8b3c7;
  --catchie-primary: #60a5fa;
  --catchie-primary2: #a78bfa;
  --catchie-primary-soft: rgba(37, 99, 235, 0.18);
  --catchie-good: #4ade80;
  --catchie-good-soft: rgba(34, 197, 94, 0.16);
  --catchie-bad: #fb7185;
  --catchie-bad-soft: rgba(239, 68, 68, 0.16);
  --catchie-amber: #fbbf24;
  --catchie-amber-soft: rgba(245, 158, 11, 0.14);
  --catchie-shadow: 0 20px 60px rgba(0, 0, 0, .35);
  --catchie-shadow2: 0 8px 22px rgba(0, 0, 0, .24);
  --catchie-overlay: rgba(0, 0, 0, 0.62);
}
:root,
:root[data-theme="light"] {
  color-scheme: light;
  --catchie-bg1: #dbeafe;
  --catchie-bg2: #ffedd5;
  --catchie-bg3: #ede9fe;
  --catchie-page-bg: #f7fbff;
  --catchie-surface: rgba(255, 255, 255, 0.96);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(255, 255, 255, 0.88);
  --catchie-surface-muted: #eef6ff;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: #b9d7ff;
  --catchie-stroke-strong: #7db5ff;
  --catchie-text: #102033;
  --catchie-muted: #334155;
  --catchie-primary: #1d4ed8;
  --catchie-primary2: #7e22ce;
  --catchie-primary-soft: #dbeafe;
  --catchie-good: #15803d;
  --catchie-good-soft: #dcfce7;
  --catchie-bad: #b91c1c;
  --catchie-bad-soft: #fee2e2;
  --catchie-amber: #92400e;
  --catchie-amber-soft: #ffedd5;
  --catchie-kid-yellow: #fde68a;
  --catchie-kid-cyan: #bae6fd;
  --catchie-kid-pink: #fbcfe8;
  --catchie-kid-green: #bbf7d0;
  --catchie-shadow: 0 16px 42px rgba(30, 64, 175, .10);
  --catchie-shadow2: 0 6px 16px rgba(30, 64, 175, .08);
  --catchie-overlay: rgba(15, 23, 42, 0.38);
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --catchie-bg1: rgba(37, 99, 235, 0.18);
  --catchie-bg2: rgba(245, 158, 11, 0.08);
  --catchie-bg3: rgba(124, 58, 237, 0.18);
  --catchie-page-bg: #0f172a;
  --catchie-page-bg-deep: #020617;
  --catchie-surface: rgba(30, 41, 59, 0.88);
  --catchie-surface-solid: #1e293b;
  --catchie-surface-soft: rgba(51, 65, 85, 0.78);
  --catchie-surface-muted: #334155;
  --catchie-surface-elevated: #273449;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(100, 116, 139, 0.45);
  --catchie-stroke-strong: rgba(129, 140, 248, 0.55);
  --catchie-text: #f1f5f9;
  --catchie-text-body: #cbd5e1;
  --catchie-muted: #94a3b8;
  --catchie-muted-soft: #64748b;
  --catchie-primary: #818cf8;
  --catchie-primary2: #a78bfa;
  --catchie-primary-soft: rgba(99, 102, 241, 0.18);
  --catchie-good: #34d399;
  --catchie-good-soft: rgba(16, 185, 129, 0.16);
  --catchie-bad: #fb7185;
  --catchie-bad-soft: rgba(244, 63, 94, 0.16);
  --catchie-amber: #fbbf24;
  --catchie-amber-soft: rgba(251, 191, 36, 0.14);
  --catchie-shadow: 0 22px 58px rgba(2, 6, 23, 0.46);
  --catchie-shadow2: 0 10px 26px rgba(2, 6, 23, 0.34);
  --catchie-overlay: rgba(2, 6, 23, 0.72);
}
:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#172033;background:#f6f8fc}
:root[data-theme="minimal_dark"] {
  color-scheme: dark;
  --catchie-bg1: rgba(37, 99, 235, 0.28);
  --catchie-bg2: rgba(245, 158, 11, 0.12);
  --catchie-bg3: rgba(124, 58, 237, 0.24);
  --catchie-page-bg: #0b1120;
  --catchie-surface: rgba(15, 23, 42, 0.82);
  --catchie-surface-solid: #111827;
  --catchie-surface-soft: rgba(30, 41, 59, 0.74);
  --catchie-surface-muted: #1e293b;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(148, 163, 184, 0.28);
  --catchie-stroke-strong: rgba(147, 197, 253, 0.48);
  --catchie-text: #e5eefb;
  --catchie-muted: #a8b3c7;
  --catchie-primary: #60a5fa;
  --catchie-primary2: #a78bfa;
  --catchie-primary-soft: rgba(37, 99, 235, 0.18);
  --catchie-good: #4ade80;
  --catchie-good-soft: rgba(34, 197, 94, 0.16);
  --catchie-bad: #fb7185;
  --catchie-bad-soft: rgba(239, 68, 68, 0.16);
  --catchie-amber: #fbbf24;
  --catchie-amber-soft: rgba(245, 158, 11, 0.14);
  --catchie-shadow: 0 20px 60px rgba(0, 0, 0, .35);
  --catchie-shadow2: 0 8px 22px rgba(0, 0, 0, .24);
  --catchie-overlay: rgba(0, 0, 0, 0.62);
  --catchie-theme-gradient: radial-gradient(1200px 600px at 15% 10%, var(--catchie-bg1), transparent 60%), radial-gradient(900px 600px at 90% 30%, var(--catchie-bg3), transparent 55%), radial-gradient(900px 700px at 40% 95%, var(--catchie-bg2), transparent 55%), linear-gradient(180deg, var(--catchie-page-bg), var(--catchie-surface-solid));
  --catchie-kh-purple: #6d28d9;
  --catchie-kh-purple2: #9333ea;
  --catchie-kh-blue: #2563eb;
  --catchie-kh-card: rgba(15, 23, 42, .72);
  --catchie-kh-text: #e5eefb;
  --catchie-kh-muted: #a8b3c7;
}
:root[data-theme="modern"] {
  color-scheme: light;
  --catchie-bg1: #dbeafe;
  --catchie-bg2: #eef2ff;
  --catchie-bg3: #f5f3ff;
  --catchie-page-bg: #f8fafc;
  --catchie-surface: rgba(255, 255, 255, 0.92);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(241, 245, 249, 0.9);
  --catchie-surface-muted: #f1f5f9;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(148, 163, 184, .38);
  --catchie-stroke-strong: rgba(79, 70, 229, .45);
  --catchie-text: #0f172a;
  --catchie-muted: #475569;
  --catchie-primary: #4f46e5;
  --catchie-primary2: #0891b2;
  --catchie-primary-soft: #eef2ff;
  --catchie-good: #059669;
  --catchie-good-soft: #d1fae5;
  --catchie-bad: #dc2626;
  --catchie-bad-soft: #fee2e2;
  --catchie-amber: #b45309;
  --catchie-amber-soft: #fef3c7;
  --catchie-shadow: 0 18px 50px rgba(15, 23, 42, .12);
  --catchie-shadow2: 0 8px 22px rgba(15, 23, 42, .08);
  --catchie-overlay: rgba(15, 23, 42, .42);
  --catchie-theme-gradient: radial-gradient(980px 620px at 12% 8%, rgba(79, 70, 229, .12), transparent 58%), radial-gradient(850px 560px at 88% 16%, rgba(8, 145, 178, .12), transparent 54%), linear-gradient(180deg, #f8fafc, #ffffff);
  --catchie-kh-purple: #4f46e5;
  --catchie-kh-purple2: #7c3aed;
  --catchie-kh-blue: #0891b2;
  --catchie-kh-card: rgba(255,255,255,.74);
  --catchie-kh-text: #0f172a;
  --catchie-kh-muted: #475569;
}
:root[data-theme="minimal"] {
  color-scheme: light;
  --catchie-bg1: rgba(226, 232, 240, .55);
  --catchie-bg2: rgba(241, 245, 249, .75);
  --catchie-bg3: rgba(248, 250, 252, .75);
  --catchie-page-bg: #fafafa;
  --catchie-surface: #ffffff;
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: #f8fafc;
  --catchie-surface-muted: #f1f5f9;
  --catchie-card: #ffffff;
  --catchie-stroke: #e2e8f0;
  --catchie-stroke-strong: #cbd5e1;
  --catchie-text: #111827;
  --catchie-muted: #64748b;
  --catchie-primary: #2563eb;
  --catchie-primary2: #334155;
  --catchie-primary-soft: #eff6ff;
  --catchie-good: #15803d;
  --catchie-good-soft: #dcfce7;
  --catchie-bad: #b91c1c;
  --catchie-bad-soft: #fee2e2;
  --catchie-amber: #92400e;
  --catchie-amber-soft: #fef3c7;
  --catchie-shadow: 0 10px 28px rgba(15, 23, 42, .06);
  --catchie-shadow2: 0 4px 14px rgba(15, 23, 42, .05);
  --catchie-overlay: rgba(15, 23, 42, .32);
  --catchie-theme-gradient: linear-gradient(180deg, #fafafa, #ffffff);
  --catchie-kh-purple: #334155;
  --catchie-kh-purple2: #2563eb;
  --catchie-kh-blue: #2563eb;
  --catchie-kh-card: rgba(255,255,255,.84);
  --catchie-kh-text: #111827;
  --catchie-kh-muted: #64748b;
}
:root[data-theme="neon"] {
  color-scheme: dark;
  --catchie-bg1: rgba(34, 211, 238, .22);
  --catchie-bg2: rgba(236, 72, 153, .20);
  --catchie-bg3: rgba(168, 85, 247, .26);
  --catchie-page-bg: #070314;
  --catchie-surface: rgba(15, 23, 42, .78);
  --catchie-surface-solid: #0f1024;
  --catchie-surface-soft: rgba(30, 41, 59, .68);
  --catchie-surface-muted: #181a37;
  --catchie-card: rgba(15, 23, 42, .78);
  --catchie-stroke: rgba(34, 211, 238, .28);
  --catchie-stroke-strong: rgba(236, 72, 153, .58);
  --catchie-text: #f8fafc;
  --catchie-muted: #b9c8e8;
  --catchie-primary: #22d3ee;
  --catchie-primary2: #ec4899;
  --catchie-primary-soft: rgba(34, 211, 238, .14);
  --catchie-good: #4ade80;
  --catchie-good-soft: rgba(74, 222, 128, .14);
  --catchie-bad: #fb7185;
  --catchie-bad-soft: rgba(251, 113, 133, .14);
  --catchie-amber: #facc15;
  --catchie-amber-soft: rgba(250, 204, 21, .14);
  --catchie-shadow: 0 22px 65px rgba(0,0,0,.45), 0 0 28px rgba(34,211,238,.12);
  --catchie-shadow2: 0 10px 28px rgba(0,0,0,.32), 0 0 16px rgba(236,72,153,.10);
  --catchie-overlay: rgba(2, 6, 23, .70);
  --catchie-theme-gradient: radial-gradient(900px 540px at 16% 10%, rgba(34,211,238,.24), transparent 58%), radial-gradient(900px 520px at 90% 18%, rgba(236,72,153,.24), transparent 56%), radial-gradient(900px 640px at 45% 105%, rgba(168,85,247,.24), transparent 58%), linear-gradient(135deg, #070314, #111827 48%, #250a38);
  --catchie-kh-purple: #a855f7;
  --catchie-kh-purple2: #ec4899;
  --catchie-kh-blue: #22d3ee;
  --catchie-kh-card: rgba(15, 23, 42, .68);
  --catchie-kh-text: #f8fafc;
  --catchie-kh-muted: #b9c8e8;
}
:root[data-theme="genz"] {
  color-scheme: light;
  --catchie-bg1: #cffafe;
  --catchie-bg2: #fce7f3;
  --catchie-bg3: #ede9fe;
  --catchie-page-bg: #fbf7ff;
  --catchie-surface: rgba(255, 255, 255, .88);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(255, 255, 255, .76);
  --catchie-surface-muted: #f5f3ff;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(168, 85, 247, .25);
  --catchie-stroke-strong: rgba(236, 72, 153, .45);
  --catchie-text: #24113d;
  --catchie-muted: #6b5a7c;
  --catchie-primary: #8b5cf6;
  --catchie-primary2: #ec4899;
  --catchie-primary-soft: #f5f3ff;
  --catchie-good: #10b981;
  --catchie-good-soft: #d1fae5;
  --catchie-bad: #f43f5e;
  --catchie-bad-soft: #ffe4e6;
  --catchie-amber: #d97706;
  --catchie-amber-soft: #fef3c7;
  --catchie-shadow: 0 18px 48px rgba(139, 92, 246, .16);
  --catchie-shadow2: 0 8px 20px rgba(236, 72, 153, .10);
  --catchie-overlay: rgba(36, 17, 61, .38);
  --catchie-theme-gradient: radial-gradient(900px 540px at 10% 6%, #cffafe, transparent 60%), radial-gradient(860px 560px at 90% 16%, #fce7f3, transparent 58%), radial-gradient(760px 560px at 48% 95%, #ede9fe, transparent 56%), linear-gradient(180deg, #fbf7ff, #ffffff);
  --catchie-kh-purple: #8b5cf6;
  --catchie-kh-purple2: #ec4899;
  --catchie-kh-blue: #06b6d4;
  --catchie-kh-card: rgba(255,255,255,.74);
  --catchie-kh-text: #24113d;
  --catchie-kh-muted: #6b5a7c;
}
:root[data-theme="vibrant"] {
  color-scheme: light;
  --catchie-bg1: #bfdbfe;
  --catchie-bg2: #fde68a;
  --catchie-bg3: #fbcfe8;
  --catchie-page-bg: #fff7ed;
  --catchie-surface: rgba(255,255,255,.9);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(255,255,255,.78);
  --catchie-surface-muted: #fff7ed;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(249, 115, 22, .30);
  --catchie-stroke-strong: rgba(37, 99, 235, .42);
  --catchie-text: #1f2937;
  --catchie-muted: #5b6472;
  --catchie-primary: #ea580c;
  --catchie-primary2: #2563eb;
  --catchie-primary-soft: #ffedd5;
  --catchie-good: #16a34a;
  --catchie-good-soft: #dcfce7;
  --catchie-bad: #dc2626;
  --catchie-bad-soft: #fee2e2;
  --catchie-amber: #ca8a04;
  --catchie-amber-soft: #fef9c3;
  --catchie-shadow: 0 18px 48px rgba(234, 88, 12, .14);
  --catchie-shadow2: 0 8px 20px rgba(37, 99, 235, .10);
  --catchie-overlay: rgba(31, 41, 55, .40);
  --catchie-theme-gradient: radial-gradient(900px 600px at 8% 6%, #bfdbfe, transparent 58%), radial-gradient(820px 540px at 92% 16%, #fde68a, transparent 58%), radial-gradient(780px 620px at 45% 100%, #fbcfe8, transparent 58%), linear-gradient(180deg, #fff7ed, #ffffff);
  --catchie-kh-purple: #ea580c;
  --catchie-kh-purple2: #eab308;
  --catchie-kh-blue: #2563eb;
  --catchie-kh-card: rgba(255,255,255,.76);
  --catchie-kh-text: #1f2937;
  --catchie-kh-muted: #5b6472;
}
:root[data-theme="pink"] {
  color-scheme: light;
  --catchie-bg1: #fce7f3;
  --catchie-bg2: #ffe4e6;
  --catchie-bg3: #fae8ff;
  --catchie-page-bg: #fff5fa;
  --catchie-surface: rgba(255,255,255,.9);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(253, 242, 248, .86);
  --catchie-surface-muted: #fdf2f8;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(244, 114, 182, .32);
  --catchie-stroke-strong: rgba(219, 39, 119, .45);
  --catchie-text: #401125;
  --catchie-muted: #7a4b61;
  --catchie-primary: #db2777;
  --catchie-primary2: #be185d;
  --catchie-primary-soft: #fce7f3;
  --catchie-good: #059669;
  --catchie-good-soft: #d1fae5;
  --catchie-bad: #e11d48;
  --catchie-bad-soft: #ffe4e6;
  --catchie-amber: #b45309;
  --catchie-amber-soft: #fef3c7;
  --catchie-shadow: 0 18px 48px rgba(219, 39, 119, .14);
  --catchie-shadow2: 0 8px 20px rgba(244, 114, 182, .12);
  --catchie-overlay: rgba(64, 17, 37, .40);
  --catchie-theme-gradient: radial-gradient(900px 560px at 12% 8%, #fce7f3, transparent 60%), radial-gradient(850px 560px at 88% 18%, #fae8ff, transparent 58%), linear-gradient(180deg, #fff5fa, #ffffff);
  --catchie-kh-purple: #db2777;
  --catchie-kh-purple2: #be185d;
  --catchie-kh-blue: #a21caf;
  --catchie-kh-card: rgba(255,255,255,.76);
  --catchie-kh-text: #401125;
  --catchie-kh-muted: #7a4b61;
}
:root[data-theme="pride"] {
  color-scheme: light;
  --catchie-bg1: #fee2e2;
  --catchie-bg2: #fef3c7;
  --catchie-bg3: #dbeafe;
  --catchie-page-bg: #ffffff;
  --catchie-surface: rgba(255,255,255,.92);
  --catchie-surface-solid: #ffffff;
  --catchie-surface-soft: rgba(255,255,255,.78);
  --catchie-surface-muted: #f8fafc;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(99, 102, 241, .24);
  --catchie-stroke-strong: rgba(236, 72, 153, .42);
  --catchie-text: #111827;
  --catchie-muted: #4b5563;
  --catchie-primary: #7c3aed;
  --catchie-primary2: #ec4899;
  --catchie-primary-soft: #f5f3ff;
  --catchie-good: #16a34a;
  --catchie-good-soft: #dcfce7;
  --catchie-bad: #dc2626;
  --catchie-bad-soft: #fee2e2;
  --catchie-amber: #d97706;
  --catchie-amber-soft: #fef3c7;
  --catchie-shadow: 0 18px 48px rgba(99, 102, 241, .12);
  --catchie-shadow2: 0 8px 20px rgba(236, 72, 153, .10);
  --catchie-overlay: rgba(17, 24, 39, .38);
  --catchie-theme-gradient: linear-gradient(90deg, rgba(239,68,68,.14), rgba(249,115,22,.14), rgba(234,179,8,.14), rgba(34,197,94,.14), rgba(59,130,246,.14), rgba(139,92,246,.14)), linear-gradient(180deg, #ffffff, #f8fafc);
  --catchie-kh-purple: #7c3aed;
  --catchie-kh-purple2: #ec4899;
  --catchie-kh-blue: #2563eb;
  --catchie-kh-card: rgba(255,255,255,.78);
  --catchie-kh-text: #111827;
  --catchie-kh-muted: #4b5563;
}
:root[data-theme="village"] {
  color-scheme: light;
  --catchie-bg1: #edf3df;
  --catchie-bg2: #f3f0dc;
  --catchie-bg3: #ecd2bd;
  --catchie-page-bg: #f3f0dc;
  --catchie-surface: rgba(255, 253, 240, .94);
  --catchie-surface-solid: #fffdf0;
  --catchie-surface-soft: #edf3df;
  --catchie-surface-muted: #e1e7d2;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(53, 94, 59, .20);
  --catchie-stroke-strong: rgba(82, 125, 67, .54);
  --catchie-text: #253620;
  --catchie-muted: #526349;
  --catchie-primary: #355e3b;
  --catchie-primary2: #527d43;
  --catchie-primary-soft: #edf3df;
  --catchie-good: #527d43;
  --catchie-good-soft: #dcebd7;
  --catchie-bad: #8e3e33;
  --catchie-bad-soft: #f5dfd8;
  --catchie-amber: #735200;
  --catchie-amber-soft: #f6e8b7;
  --catchie-shadow: 0 20px 54px rgba(51, 74, 40, .16);
  --catchie-shadow2: 0 8px 22px rgba(51, 74, 40, .10);
  --catchie-overlay: rgba(37, 54, 32, .38);
  --catchie-theme-gradient: radial-gradient(920px 560px at 9% 5%, rgba(120,163,93,.22), transparent 60%), radial-gradient(860px 540px at 92% 10%, rgba(199,154,47,.20), transparent 58%), linear-gradient(180deg, #f3f0dc, #fffdf0);
  --catchie-kh-purple: #355e3b;
  --catchie-kh-purple2: #6e934a;
  --catchie-kh-blue: #66877d;
  --catchie-kh-card: rgba(255,253,240,.80);
  --catchie-kh-text: #253620;
  --catchie-kh-muted: #526349;
}
:root[data-theme="pattaya"] {
  color-scheme: light;
  --catchie-bg1: #d8f0f5;
  --catchie-bg2: #fff1cf;
  --catchie-bg3: #f4c2ae;
  --catchie-page-bg: #eaf6f8;
  --catchie-surface: rgba(255, 253, 246, .94);
  --catchie-surface-solid: #fffdf6;
  --catchie-surface-soft: #edf8f8;
  --catchie-surface-muted: #dcecef;
  --catchie-card: var(--catchie-surface);
  --catchie-stroke: rgba(34, 91, 118, .19);
  --catchie-stroke-strong: rgba(39, 126, 167, .52);
  --catchie-text: #173b4d;
  --catchie-muted: #466878;
  --catchie-primary: #225b76;
  --catchie-primary2: #469dcc;
  --catchie-primary-soft: #e7f7fb;
  --catchie-good: #176b52;
  --catchie-good-soft: #d8eee6;
  --catchie-bad: #9d382d;
  --catchie-bad-soft: #f9e2dc;
  --catchie-amber: #785800;
  --catchie-amber-soft: #f7ebc6;
  --catchie-shadow: 0 20px 56px rgba(27, 86, 111, .16);
  --catchie-shadow2: 0 8px 22px rgba(27, 86, 111, .10);
  --catchie-overlay: rgba(23, 59, 77, .38);
  --catchie-theme-gradient: radial-gradient(940px 560px at 8% 5%, rgba(70,157,204,.23), transparent 60%), radial-gradient(880px 540px at 92% 10%, rgba(77,190,184,.20), transparent 58%), radial-gradient(760px 520px at 52% 100%, rgba(223,119,103,.13), transparent 58%), linear-gradient(180deg, #eaf6f8, #fffdf6);
  --catchie-kh-purple: #225b76;
  --catchie-kh-purple2: #277ea7;
  --catchie-kh-blue: #469dcc;
  --catchie-kh-card: rgba(255,253,246,.80);
  --catchie-kh-text: #173b4d;
  --catchie-kh-muted: #466878;
}
:root {
  
  --catchie-theme-switcher-control-clearance: 78px;
}
:root { --catchie-theme-switcher-control-clearance: 68px; }
:root,
:root[data-theme="light"] {
  --catchie-theme-readable-text: #0f172a;
  --catchie-theme-readable-muted: #475569;
  --catchie-theme-link-text: #1d4ed8;
  --catchie-theme-button-start: #1d4ed8;
  --catchie-theme-button-end: #6d28d9;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #166534;
  --catchie-theme-bad-text: #991b1b;
  --catchie-theme-warning-text: #78350f;
  --catchie-theme-disabled-bg: #e2e8f0;
  --catchie-theme-disabled-text: #475569;
}
:root[data-theme="dark"],
:root[data-theme="minimal_dark"] {
  --catchie-theme-readable-text: #f1f5f9;
  --catchie-theme-readable-muted: #cbd5e1;
  --catchie-theme-link-text: #93c5fd;
  --catchie-theme-button-start: #1d4ed8;
  --catchie-theme-button-end: #6d28d9;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #86efac;
  --catchie-theme-bad-text: #fda4af;
  --catchie-theme-warning-text: #fde68a;
  --catchie-theme-disabled-bg: #334155;
  --catchie-theme-disabled-text: #cbd5e1;
}
:root[data-theme="modern"] {
  --catchie-theme-readable-text: #0f172a;
  --catchie-theme-readable-muted: #475569;
  --catchie-theme-link-text: #3730a3;
  --catchie-theme-button-start: #4338ca;
  --catchie-theme-button-end: #0e7490;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #065f46;
  --catchie-theme-bad-text: #991b1b;
  --catchie-theme-warning-text: #78350f;
  --catchie-theme-disabled-bg: #e2e8f0;
  --catchie-theme-disabled-text: #475569;
}
:root[data-theme="minimal"] {
  --catchie-theme-readable-text: #111827;
  --catchie-theme-readable-muted: #475569;
  --catchie-theme-link-text: #1d4ed8;
  --catchie-theme-button-start: #1d4ed8;
  --catchie-theme-button-end: #334155;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #166534;
  --catchie-theme-bad-text: #991b1b;
  --catchie-theme-warning-text: #78350f;
  --catchie-theme-disabled-bg: #e2e8f0;
  --catchie-theme-disabled-text: #475569;
}
:root[data-theme="neon"] {
  --catchie-theme-readable-text: #f8fafc;
  --catchie-theme-readable-muted: #dbeafe;
  --catchie-theme-link-text: #67e8f9;
  --catchie-theme-button-start: #0e7490;
  --catchie-theme-button-end: #9d174d;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #86efac;
  --catchie-theme-bad-text: #fda4af;
  --catchie-theme-warning-text: #fef08a;
  --catchie-theme-disabled-bg: #272b4b;
  --catchie-theme-disabled-text: #dbeafe;
}
:root[data-theme="genz"] {
  --catchie-theme-readable-text: #24113d;
  --catchie-theme-readable-muted: #5b456f;
  --catchie-theme-link-text: #6d28d9;
  --catchie-theme-button-start: #6d28d9;
  --catchie-theme-button-end: #9d174d;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #065f46;
  --catchie-theme-bad-text: #9f1239;
  --catchie-theme-warning-text: #78350f;
  --catchie-theme-disabled-bg: #ede9fe;
  --catchie-theme-disabled-text: #5b456f;
}
:root[data-theme="vibrant"] {
  --catchie-theme-readable-text: #1f2937;
  --catchie-theme-readable-muted: #4b5563;
  --catchie-theme-link-text: #9a3412;
  --catchie-theme-button-start: #c2410c;
  --catchie-theme-button-end: #1d4ed8;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #166534;
  --catchie-theme-bad-text: #991b1b;
  --catchie-theme-warning-text: #713f12;
  --catchie-theme-disabled-bg: #ffedd5;
  --catchie-theme-disabled-text: #4b5563;
}
:root[data-theme="pink"] {
  --catchie-theme-readable-text: #401125;
  --catchie-theme-readable-muted: #6b3d54;
  --catchie-theme-link-text: #9d174d;
  --catchie-theme-button-start: #be185d;
  --catchie-theme-button-end: #831843;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #065f46;
  --catchie-theme-bad-text: #9f1239;
  --catchie-theme-warning-text: #78350f;
  --catchie-theme-disabled-bg: #fce7f3;
  --catchie-theme-disabled-text: #6b3d54;
}
:root[data-theme="pride"] {
  --catchie-theme-readable-text: #111827;
  --catchie-theme-readable-muted: #4b5563;
  --catchie-theme-link-text: #6d28d9;
  --catchie-theme-button-start: #6d28d9;
  --catchie-theme-button-end: #9d174d;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #166534;
  --catchie-theme-bad-text: #991b1b;
  --catchie-theme-warning-text: #78350f;
  --catchie-theme-disabled-bg: #e2e8f0;
  --catchie-theme-disabled-text: #4b5563;
}
:root[data-theme="village"] {
  --catchie-theme-readable-text: #253620;
  --catchie-theme-readable-muted: #526349;
  --catchie-theme-link-text: #315737;
  --catchie-theme-button-start: #315737;
  --catchie-theme-button-end: #3f662f;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #315737;
  --catchie-theme-bad-text: #8e3e33;
  --catchie-theme-warning-text: #735200;
  --catchie-theme-disabled-bg: #e1e7d2;
  --catchie-theme-disabled-text: #526349;
}
:root[data-theme="pattaya"] {
  --catchie-theme-readable-text: #173b4d;
  --catchie-theme-readable-muted: #466878;
  --catchie-theme-link-text: #225b76;
  --catchie-theme-button-start: #225b76;
  --catchie-theme-button-end: #176f7d;
  --catchie-theme-button-text: #ffffff;
  --catchie-theme-good-text: #176b52;
  --catchie-theme-bad-text: #9d382d;
  --catchie-theme-warning-text: #785800;
  --catchie-theme-disabled-bg: #dcecef;
  --catchie-theme-disabled-text: #466878;
}
:root[data-theme] {
  --catchie-theme-surface: var(--catchie-surface-solid);
  --catchie-card-bg: var(--catchie-surface-solid);
  --catchie-surface-2: var(--catchie-surface-soft);
  --catchie-border-color: var(--catchie-stroke);
  --catchie-text-color: var(--catchie-theme-readable-text, var(--catchie-text));
  --catchie-accent-color: var(--catchie-theme-link-text, var(--catchie-primary));

  --catchie-theme-layer-floating: 800;
  --catchie-theme-layer-switcher: 900;
  --catchie-theme-layer-overlay: 2000;
  --catchie-theme-layer-dialog: 2010;
  --catchie-theme-layer-notice: 2100;

  
  --catchie-kh-red: #b91c1c;
  --catchie-kh-blue: #1d4ed8;
  --catchie-kh-yellow: #854d0e;
  --catchie-kh-green: #166534;
}
:root{--theme-on-primary:var(--catchie-theme-button-text);--theme-link:var(--catchie-theme-link-text);--theme-status-good:var(--catchie-theme-good-text);--theme-status-bad:var(--catchie-theme-bad-text);--theme-status-amber:var(--catchie-theme-warning-text)}