/* Our Episode — design tokens v1.0 (direction 4a "Title Card") */
@import url('https://fonts.googleapis.com/css2?family=Shrikhand&family=Caprasimo&family=Instrument+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  /* Core color */
  --ep-den: #22140e;          /* page background */
  --ep-den-2: #2e1c13;        /* raised surface / card */
  --ep-den-3: #3a2a20;        /* hairline on dark */
  --ep-walnut: #6b3a1f;
  --ep-walnut-hi: #9a5b34;
  --ep-walnut-lo: #552c15;
  --ep-cream: #fff4e0;        /* primary text on dark, light surface */
  --ep-cream-2: #f9e9c8;      /* inset on cream (dropzone) */
  --ep-paper: #e0cdae;        /* secondary text on dark */
  --ep-muted: #a8977c;        /* tertiary text on dark (6.3:1) */
  --ep-tomato: #c8302c;       /* primary action, brand red */
  --ep-tomato-hover: #d63a35;
  --ep-tomato-press: #a92521;
  --ep-mustard: #f0b43c;      /* accent, offset shadow, stickers */
  --ep-mustard-press: #c98f22;
  --ep-chrome: #d9d6d0;
  --ep-ink: #22140e;          /* text on cream / mustard */
  --ep-ink-2: #5a4a3a;        /* secondary text on cream */
  --ep-success: #2f8a52;
  --ep-danger: #c8302c;

  /* Type */
  --ep-font-logo: 'Shrikhand', serif;      /* logo, nameplate, on-screen title cards ONLY */
  --ep-font-display: 'Caprasimo', serif;   /* headlines, modal titles */
  --ep-font-ui: 'Instrument Sans', system-ui, sans-serif;
  --ep-font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  --ep-text-display-xl: 400 56px/1.02 var(--ep-font-display);  /* mobile 40px */
  --ep-text-display-l: 400 40px/1.05 var(--ep-font-display);
  --ep-text-display-m: 400 32px/1.1 var(--ep-font-display);
  --ep-text-title: 700 20px/1.3 var(--ep-font-ui);
  --ep-text-body-l: 400 18px/1.55 var(--ep-font-ui);
  --ep-text-body: 400 16px/1.5 var(--ep-font-ui);
  --ep-text-body-s: 400 14px/1.45 var(--ep-font-ui);
  --ep-text-label: 700 12px/1.3 var(--ep-font-ui);              /* uppercase, tracking .16em */
  --ep-text-mono: 500 13px/1.4 var(--ep-font-mono);

  /* Space (4pt) */
  --ep-space-1: 4px; --ep-space-2: 8px; --ep-space-3: 12px; --ep-space-4: 16px;
  --ep-space-5: 20px; --ep-space-6: 24px; --ep-space-8: 32px; --ep-space-10: 40px;
  --ep-space-14: 56px; --ep-space-18: 72px;

  /* Radius */
  --ep-radius-xs: 6px;   /* stickers, chips */
  --ep-radius-sm: 10px;  /* small buttons, player controls */
  --ep-radius-md: 12px;  /* buttons, avatar */
  --ep-radius-lg: 14px;  /* primary CTA, menus */
  --ep-radius-xl: 18px;  /* cards, modal */
  --ep-radius-2xl: 28px; /* page sections */
  --ep-radius-full: 999px;

  /* Elevation — hard offset shadows. Use ONLY on primary actions, menus, modals, player. */
  --ep-pop-1: 2px 2px 0 var(--ep-tomato);
  --ep-pop-2: 3px 3px 0 var(--ep-mustard);
  --ep-pop-3: 4px 4px 0 var(--ep-mustard);
  --ep-pop-menu: 5px 5px 0 var(--ep-tomato), 0 20px 50px rgba(0,0,0,.45);
  --ep-pop-modal: 6px 6px 0 var(--ep-tomato), 0 30px 80px rgba(0,0,0,.5);
  --ep-border-strong: 2px solid var(--ep-ink);

  /* Motion */
  --ep-ease: cubic-bezier(.2,.8,.2,1);
  --ep-dur-press: 90ms;
  --ep-dur-ui: 160ms;
  --ep-dur-screen: 420ms;    /* TV screen state changes (power-on / channel flip) */

  /* Focus */
  --ep-focus: 0 0 0 3px var(--ep-den), 0 0 0 6px var(--ep-mustard);          /* on dark */
  --ep-focus-on-light: 0 0 0 3px var(--ep-cream), 0 0 0 5.5px var(--ep-tomato); /* on cream */
}

/* Seasonal layer — set data-season on <html>. Only these change across the year. */
[data-season="christmas"]  { --ep-season-ink:#9e1b2f; --ep-season-glow:rgba(255,190,110,.35); --ep-season-card:#143626; --ep-season-card-hi:#2a6146; --ep-season-gold:#f3cf7a; --ep-season-accent:#d8343f; --ep-season-month:12; }
[data-season="hanukkah"]   { --ep-season-ink:#1f4f9e; --ep-season-glow:rgba(140,190,255,.40); --ep-season-card:#11214a; --ep-season-card-hi:#264684; --ep-season-gold:#f3d98a; --ep-season-accent:#7fb8ff; --ep-season-month:12; }
[data-season="halloween"]  { --ep-season-ink:#c4500c; --ep-season-glow:rgba(255,140,40,.40);  --ep-season-card:#1f0e26; --ep-season-card-hi:#3f1e4a; --ep-season-gold:#ffb347; --ep-season-accent:#a86bff; --ep-season-month:10; }
[data-season="valentines"] { --ep-season-ink:#c2185b; --ep-season-glow:rgba(255,110,150,.40); --ep-season-card:#420d24; --ep-season-card-hi:#6e1c3d; --ep-season-gold:#ffd0dc; --ep-season-accent:#ff5c8a; --ep-season-month:2; }