:root{
/* Brand — Nyashi Pink (primary), Zing Lime (reward), Tangerine (heat), Sky (info), Grape (premium) */
--pink-50:#FFF0F5;
--pink-100:#FFD6E5;
--pink-200:#FFADCB;
--pink-300:#FF7FAE;
--pink-400:#FF5596;
--pink-500:#FF2E7E;
--pink-600:#E3166A;
--pink-700:#B80D55;
--pink-800:#860A3F;
--pink-900:#4D0624;
--lime-100:#F3FFD1;
--lime-300:#E2FF7A;
--lime-400:#D4FF3D;
--lime-500:#BEF01A;
--lime-700:#6E8A00;
--tangerine-100:#FFE8D6;
--tangerine-400:#FF8A3D;
--tangerine-500:#FF6B12;
--tangerine-700:#B84300;
--sky-100:#DDF3FF;
--sky-400:#4CC3FF;
--sky-500:#14A8F5;
--sky-700:#0670A8;
--grape-100:#EFE2FF;
--grape-400:#B57BFF;
--grape-500:#9A4DFF;
--grape-700:#5E1FB3;
--red-400:#FF5A5A;
--red-500:#FF3B3B;
--green-400:#3DDC84;
--green-500:#1FC46C;
--amber-400:#FFC93D;
/* Neutrals — warm "ink" (slightly plum) */
--ink-0:#FFFFFF;
--ink-50:#F7F4F8;
--ink-100:#ECE7EE;
--ink-200:#D7CFDA;
--ink-300:#B4AAB8;
--ink-400:#8D8292;
--ink-500:#6A5F70;
--ink-600:#4A4150;
--ink-700:#322B37;
--ink-800:#221D26;
--ink-850:#1A161D;
--ink-900:#131016;
--ink-950:#0B090D;
/* Signature gradients (use sparingly: CTA hero, live ring, streaks) */
--grad-hype:linear-gradient(135deg,#FF2E7E 0%,#FF6B12 100%); /* @kind color */
--grad-ring:conic-gradient(from 200deg,#FF2E7E,#FF6B12,#D4FF3D,#FF2E7E); /* @kind color */
--grad-scrim-bottom:linear-gradient(180deg,rgba(11,9,13,0) 0%,rgba(11,9,13,.55) 55%,rgba(11,9,13,.9) 100%); /* @kind color */
--grad-scrim-top:linear-gradient(0deg,rgba(11,9,13,0) 0%,rgba(11,9,13,.6) 100%); /* @kind color */
/* Semantic (dark is the default theme — content-first, video-first) */
--bg-app:var(--ink-950);
--bg-elevated:var(--ink-900);
--surface-1:var(--ink-900);
--surface-2:var(--ink-850);
--surface-3:var(--ink-800);
--surface-4:var(--ink-700);
--surface-glass:rgba(26,22,29,.62);
--surface-glass-light:rgba(255,255,255,.16);
--fg-1:var(--ink-0);
--fg-2:var(--ink-200);
--fg-3:var(--ink-400);
--fg-disabled:var(--ink-600);
--fg-on-accent:var(--ink-0);
--fg-on-lime:var(--ink-950);
--border-1:rgba(255,255,255,.08);
--border-2:rgba(255,255,255,.16);
--border-strong:rgba(255,255,255,.32);
--accent:var(--pink-500);
--accent-hover:var(--pink-400);
--accent-press:var(--pink-600);
--accent-soft:rgba(255,46,126,.16);
--reward:var(--lime-400);
--reward-soft:rgba(212,255,61,.14);
--heat:var(--tangerine-500);
--info:var(--sky-400);
--premium:var(--grape-400);
--premium-soft:rgba(181,123,255,.16);
--success:var(--green-400);
--warning:var(--amber-400);
--danger:var(--red-500);
--live:var(--red-500);
--text-body:var(--fg-2);
--text-heading:var(--fg-1);
--text-muted:var(--fg-3);
--text-link:var(--pink-300);
--surface-card:var(--surface-2);
--surface-input:var(--surface-3);
--surface-sheet:var(--ink-850);
--focus-ring:0 0 0 3px rgba(255,46,126,.45); /* @kind shadow */
--overlay-scrim:rgba(11,9,13,.64);
}
[data-theme="light"]{
--bg-app:var(--ink-50);
--bg-elevated:var(--ink-0);
--surface-1:var(--ink-0);
--surface-2:var(--ink-0);
--surface-3:var(--ink-100);
--surface-4:var(--ink-200);
--surface-glass:rgba(255,255,255,.72);
--fg-1:var(--ink-950);
--fg-2:var(--ink-700);
--fg-3:var(--ink-500);
--fg-disabled:var(--ink-300);
--border-1:rgba(19,16,22,.08);
--border-2:rgba(19,16,22,.14);
--border-strong:rgba(19,16,22,.3);
--text-link:var(--pink-600);
--surface-card:var(--ink-0);
--surface-input:var(--ink-100);
--surface-sheet:var(--ink-0);
--accent-soft:rgba(255,46,126,.1);
--reward-soft:rgba(190,240,26,.2);
--overlay-scrim:rgba(19,16,22,.4);
}