/* Carnaval Riojano — generated from tokens.json */
:root, [data-theme="light"] {
  --blue-50: oklch(96% .02 262);
  --blue-100: oklch(91% .05 262);
  --blue-200: oklch(82% .09 262);
  --blue-300: oklch(68% .14 262);
  --blue-400: oklch(52% .17 262);
  --blue-500: #003199;
  --blue-600: oklch(31% .15 262);
  --blue-700: oklch(26% .12 262);
  --blue-800: oklch(21% .09 262);
  --blue-900: oklch(17% .07 262);
  --pink-50: oklch(96% .02 8);
  --pink-100: oklch(91% .06 8);
  --pink-200: oklch(83% .11 8);
  --pink-300: oklch(75% .17 8);
  --pink-400: oklch(69% .22 8);
  --pink-500: #ea0060;
  --pink-600: oklch(52% .21 8);
  --pink-700: oklch(44% .18 8);
  --pink-800: oklch(34% .14 8);
  --pink-900: oklch(26% .10 8);
  --cyan-50: oklch(97% .015 232);
  --cyan-100: oklch(93% .04 232);
  --cyan-200: oklch(86% .07 232);
  --cyan-300: oklch(78% .10 232);
  --cyan-400: oklch(72% .12 232);
  --cyan-500: #009ed4;
  --cyan-600: oklch(55% .11 232);
  --cyan-700: oklch(45% .09 232);
  --cyan-800: oklch(35% .07 232);
  --cyan-900: oklch(25% .05 232);
  --yellow-50: oklch(98% .02 90);
  --yellow-100: oklch(95% .06 90);
  --yellow-200: oklch(92% .11 90);
  --yellow-300: oklch(88% .15 90);
  --yellow-400: #ffc928;
  --yellow-500: oklch(78% .16 82);
  --yellow-600: oklch(68% .15 78);
  --yellow-700: oklch(55% .13 72);
  --cream-50: #fff8ee;
  --cream-100: #fbf1e2;
  --cream-200: #f4e6d3;
  --cream-300: #e7d5be;
  --ink-50: #f5f5f7;
  --ink-100: #e6e6ea;
  --ink-200: #cfcfd6;
  --ink-300: #a9a9b4;
  --ink-400: #7c7c89;
  --ink-500: #5a5a66;
  --ink-700: #33333c;
  --ink-800: #26262d;
  --ink-900: #1e1e24;
  --ink-950: #131317;
  --logo-pink: #ff006e;
  --surface-page: var(--cream-50);
  --surface-raised: #ffffff;
  --surface-sunken: var(--cream-100);
  --surface-card: #ffffff;
  --surface-card-tinted: var(--cream-100);
  --surface-invert: var(--ink-900);
  --surface-invert-raised: var(--ink-800);
  --surface-brand: var(--blue-500);
  --surface-brand-soft: var(--blue-50);
  --surface-accent: var(--pink-500);
  --surface-accent-soft: var(--pink-50);
  --surface-highlight: var(--yellow-400);
  --surface-highlight-soft: var(--yellow-100);
  --surface-splash: var(--cyan-500);
  --text-strong: var(--ink-900);
  --text-body: var(--ink-700);
  --text-muted: var(--ink-500);
  --text-subtle: var(--ink-400);
  --text-on-brand: var(--cream-50);
  --text-on-accent: #ffffff;
  --text-on-highlight: var(--ink-900);
  --text-on-invert: var(--cream-50);
  --text-on-invert-muted: var(--ink-300);
  --text-brand: var(--blue-500);
  --text-accent: var(--pink-600);
  --border-hairline: var(--cream-300);
  --border-strong: var(--ink-900);
  --border-brand: var(--blue-500);
  --border-accent: var(--pink-500);
  --focus-ring: var(--blue-500);
  --link: var(--blue-500);
  --link-hover: var(--pink-600);
  --link-visited: var(--blue-700);
  --status-live: var(--pink-500);
  --status-upcoming: var(--blue-500);
  --status-done: var(--ink-400);
  --status-info: var(--blue-500);
  --status-warn: var(--yellow-600);
  --shadow-sticker-sm: 3px 3px 0 #1e1e24;
  --shadow-sticker: 5px 5px 0 #1e1e24;
  --shadow-sticker-lg: 8px 8px 0 #1e1e24;
  --shadow-sticker-blue: 5px 5px 0 #003199;
  --shadow-sticker-pink: 5px 5px 0 oklch(44% .18 8);
  --shadow-soft-sm: 0 1px 2px rgba(30,30,36,.07), 0 2px 6px rgba(30,30,36,.06);
  --shadow-soft: 0 4px 10px rgba(30,30,36,.08), 0 12px 28px rgba(30,30,36,.10);
  --shadow-soft-lg: 0 12px 24px rgba(30,30,36,.10), 0 32px 64px rgba(30,30,36,.16);
  --shadow-inset-hair: inset 0 0 0 1px rgba(30,30,36,.08);
}
[data-theme="night"] {
  --surface-page: var(--ink-900);
  --surface-raised: var(--ink-800);
  --surface-sunken: var(--ink-950);
  --surface-card: var(--ink-800);
  --surface-card-tinted: var(--ink-700);
  --surface-invert: var(--ink-900);
  --surface-invert-raised: var(--ink-800);
  --surface-brand: var(--blue-500);
  --surface-brand-soft: var(--blue-50);
  --surface-accent: var(--pink-500);
  --surface-accent-soft: var(--pink-50);
  --surface-highlight: var(--yellow-400);
  --surface-highlight-soft: var(--yellow-100);
  --surface-splash: var(--cyan-500);
  --text-strong: var(--cream-50);
  --text-body: var(--ink-100);
  --text-muted: var(--ink-300);
  --text-subtle: var(--ink-400);
  --text-on-brand: var(--cream-50);
  --text-on-highlight: var(--ink-900);
  --text-on-invert: var(--cream-50);
  --text-on-invert-muted: var(--ink-300);
  --text-brand: var(--blue-500);
  --text-accent: var(--pink-600);
  --border-hairline: var(--ink-700);
  --border-strong: var(--cream-50);
  --border-brand: var(--blue-500);
  --border-accent: var(--pink-500);
  --focus-ring: var(--yellow-400);
  --link: var(--yellow-400);
  --link-hover: var(--cyan-500);
  --link-visited: var(--blue-700);
  --status-live: var(--pink-500);
  --status-upcoming: var(--blue-500);
  --status-done: var(--ink-400);
  --status-info: var(--blue-500);
  --status-warn: var(--yellow-600);
}
:root {
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;
  --sp-32: 128px;
  --gutter: 24px;
  --stack-tight: 12px;
  --stack: 20px;
  --stack-loose: 40px;
  --content-max: 1200px;
  --content-narrow: 720px;
  --content-wide: 1440px;
  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --tap-min: 44px;
  --border-w: 2px;
  --border-w-thick: 3px;
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;
  --ratio-portrait: 4 / 5;
  --ratio-photo: 3 / 2;
  --ratio-video: 16 / 9;
  --ratio-classic: 4 / 3;
  --ratio-square: 1 / 1;
  --ratio-og: 1200 / 630;
  --font-display: "Montserrat", system-ui, sans-serif;
  --font-body: "Inter", "Montserrat", system-ui, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, monospace;
}
.display-xl { font-family: var(--font-display); font-size: 6.5rem; line-height: 0.94; font-weight: 900; letter-spacing: -0.02em; }
.display-lg { font-family: var(--font-display); font-size: 4.25rem; line-height: 0.94; font-weight: 900; letter-spacing: -0.02em; }
.display-md { font-family: var(--font-display); font-size: 3rem; line-height: 1.18; font-weight: 800; letter-spacing: -0.01em; }
.display-sm { font-family: var(--font-display); font-size: 1.75rem; line-height: 1.18; font-weight: 800; letter-spacing: -0.01em; }
.title-lg { font-family: var(--font-display); font-size: 1.5rem; line-height: 1.18; font-weight: 800; letter-spacing: -0.01em; }
.title-md { font-family: var(--font-display); font-size: 1.25rem; line-height: 1.18; font-weight: 700; letter-spacing: -0.01em; }
.title-sm { font-family: var(--font-display); font-size: 1.0625rem; line-height: 1.18; font-weight: 700; letter-spacing: -0.01em; }
.eyebrow { font-family: var(--font-display); font-size: 0.8125rem; line-height: 1.2; font-weight: 700; letter-spacing: 0.16em; }
.button { font-family: var(--font-display); font-size: 0.9375rem; line-height: 1; font-weight: 700; letter-spacing: 0.02em; }
.numerals { font-family: var(--font-display); font-size: 3rem; line-height: 1; font-weight: 800; letter-spacing: -0.01em; }
.body-lg { font-family: var(--font-body); font-size: 1.1875rem; line-height: 1.6; font-weight: 400; }
.body { font-family: var(--font-body); font-size: 1.0625rem; line-height: 1.6; font-weight: 400; }
.body-sm { font-family: var(--font-body); font-size: 0.9375rem; line-height: 1.6; font-weight: 400; }
.caption { font-family: var(--font-body); font-size: 0.8125rem; line-height: 1.35; font-weight: 500; }
.micro { font-family: var(--font-body); font-size: 0.6875rem; line-height: 1.35; font-weight: 500; }
.mono { font-family: var(--font-mono); font-size: 0.6875rem; line-height: 1.35; font-weight: 400; }
@font-face { font-family: "Montserrat"; src: url("fonts/Montserrat-latin-var.woff2") format("woff2"); font-weight: 400 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/Inter-latin-var.woff2") format("woff2"); font-weight: 400 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Inter"; src: url("fonts/Inter-Italic-latin-var.woff2") format("woff2"); font-weight: 400 700; font-style: italic; font-display: swap; }
