/* GaweleTV Design System — tokens (fonts + colors + typography + spacing + effects) */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Hanken+Grotesk:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root{
  /* Base neutrals (purple-tinted darks) */
  --ink-950:#0b0814; --ink-900:#120d20; --ink-850:#18122b; --ink-800:#1f1838;
  --ink-750:#251d44; --ink-700:#2d2352; --ink-600:#3b2f68; --ink-500:#4d3f83;
  /* Royal violet */
  --violet-700:#553bb0; --violet-600:#6d4bd6; --violet-500:#8460e6; --violet-400:#9d7cf0; --violet-300:#bda4f7;
  /* Gold */
  --gold-700:#9a6d16; --gold-600:#b8841c; --gold-500:#d99f24; --gold-400:#ecb63f; --gold-300:#f6cd6b; --gold-200:#fbe0a0;
  /* Text ramp */
  --white:#ffffff; --fg-100:#f5f2fc; --fg-300:#d7cfeb; --fg-500:#b3a8d0; --fg-700:#8479a6; --fg-900:#5c5378;
  /* Status */
  --status-live:#e8433f; --status-online:#43d17a; --status-warn:#f2b13c;
  /* Semantic */
  --surface-page:var(--ink-950); --surface-sunken:var(--ink-900); --surface-card:var(--ink-850);
  --surface-raised:var(--ink-800); --surface-inset:var(--ink-750);
  --text-primary:var(--fg-100); --text-secondary:var(--fg-300); --text-muted:var(--fg-500); --text-faint:var(--fg-700);
  --accent:var(--gold-500); --accent-hover:var(--gold-400); --accent-strong:var(--gold-300);
  --accent-contrast:#1a1206; --accent-soft:rgba(217,159,36,0.14);
  --brand-violet:var(--violet-500); --brand-violet-soft:rgba(132,96,230,0.16);
  --border:rgba(157,124,240,0.16); --border-strong:rgba(236,182,63,0.34); --border-hairline:rgba(255,255,255,0.07);
  --focus-ring:var(--gold-400); --link:var(--gold-400); --link-hover:var(--gold-300);
  /* Typography */
  --font-display:'Space Grotesk',system-ui,sans-serif; --font-body:'Hanken Grotesk',system-ui,sans-serif; --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --text-hero:clamp(2.75rem,6vw,5rem); --text-h1:clamp(2.1rem,4vw,3.25rem); --text-h2:clamp(1.6rem,2.6vw,2.25rem);
  --text-h3:1.375rem; --text-lg:1.125rem; --text-md:1rem; --text-sm:0.9375rem; --text-xs:0.8125rem; --text-2xs:0.6875rem;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-black:800;
  --lh-tight:1.05; --lh-snug:1.2; --lh-normal:1.5; --lh-relaxed:1.65;
  --track-tight:-0.02em; --track-normal:0; --track-wide:0.04em; --track-caps:0.16em;
  /* Spacing / layout */
  --section-gap:clamp(4rem,9vw,8rem); --container-max:1200px; --container-pad:clamp(1.25rem,4vw,2.5rem);
  /* Radii, borders, shadows, motion */
  --radius-xs:4px; --radius-sm:8px; --radius-md:12px; --radius-lg:18px; --radius-xl:26px; --radius-pill:999px;
  --shadow-sm:0 1px 3px rgba(0,0,0,0.4); --shadow-card:0 8px 30px rgba(0,0,0,0.45); --shadow-raised:0 18px 60px rgba(0,0,0,0.55);
  --shadow-gold:0 0 0 1px rgba(236,182,63,0.35),0 10px 40px rgba(184,132,28,0.28);
  --shadow-violet:0 0 0 1px rgba(132,96,230,0.3),0 12px 44px rgba(109,75,214,0.3);
  --glow-gold:0 0 24px rgba(236,182,63,0.45);
  --blur-sm:8px; --blur-md:16px; --blur-lg:28px;
  --ease-out:cubic-bezier(0.22,1,0.36,1); --ease-in-out:cubic-bezier(0.65,0.05,0.36,1);
  --dur-fast:140ms; --dur-base:220ms; --dur-slow:400ms;
  --aura:radial-gradient(60% 55% at 20% 0%,rgba(109,75,214,0.28),transparent 60%),radial-gradient(50% 50% at 90% 10%,rgba(217,159,36,0.16),transparent 55%);
}