/* 
  -----------------------------------------------------------------------------
  CINEMATIC DESIGN SYSTEM - CORE TOKENS
  -----------------------------------------------------------------------------
  "Light is the paintbrush. Shadow is the canvas."
*/

:root {
    /* --------------------------------------------------------------------------
     1. TIMING & MOTION (The Heartbeat)
     -------------------------------------------------------------------------- */
    --ease-cinema: cubic-bezier(0.25, 1, 0.5, 1);
    /* Smooth, weighted stop */
    --ease-lens: cubic-bezier(0.19, 1, 0.22, 1);
    /* Quick snap, long settle */
    --ease-drama: cubic-bezier(0.6, 0.05, 0.01, 0.99);
    /* Slow start, fast finish, slow stop */

    --duration-flash: 150ms;
    --duration-cut: 300ms;
    --duration-fade: 600ms;
    --duration-reveal: 1200ms;
    --duration-epic: 2400ms;

    /* --------------------------------------------------------------------------
     2. DEPTH & LAYERING (Z-Space)
     -------------------------------------------------------------------------- */
    --z-background: -1;
    --z-floor: 1;
    --z-prop: 10;
    --z-actor: 50;
    --z-overlay: 100;
    --z-lens-fx: 500;
    /* Grain, Vignette */
    --z-cinema-hud: 999;

    /* --------------------------------------------------------------------------
     3. TYPOGRAPHY (The Script)
     -------------------------------------------------------------------------- */
    /* Fluid typography for dramatic scaling */
    --font-hero: clamp(2.5rem, 5vw + 1rem, 5rem);
    --font-title: clamp(1.8rem, 3vw + 1rem, 3rem);
    --font-subtitle: clamp(1.2rem, 1.5vw + 0.5rem, 1.8rem);
    --font-body: 1rem;
    --font-micro: 0.75rem;

    --weight-thin: 100;
    --weight-body: 300;
    /* Lighter body for elegance */
    --weight-bold: 600;
    --weight-heavy: 800;

    --tracking-tight: -0.02em;
    --tracking-wide: 0.05em;
    --tracking-epic: 0.2em;
}

/* ----------------------------------------------------------------------------
   4. COLOR GRADING (The Look)
   ---------------------------------------------------------------------------- */

/* DARK MODE: "The Void / Neon Noir" */
[data-md-color-scheme="slate"] {
    /* Base - Deep, rich charcoals, lifted from pitch black */
    --cinematic-bg-void: #0f1014;
    --cinematic-bg-depth: #15161a;
    --cinematic-bg-surface: #1e2026;

    /* Lighting - Tungsten & Moonlight */
    --cinematic-light-key: #ffffff;
    /* Pure White */
    --cinematic-light-fill: #94a3b8;
    /* Lighter Slate */
    --cinematic-light-rim: #475569;

    /* Accents - Anamorphic Flares */
    --cinematic-accent-primary: #3b82f6;
    /* Arri Blue */
    --cinematic-accent-glow: rgba(59, 130, 246, 0.6);
    --cinematic-error: #cf6679;

    /* Texture */
    --film-grain-opacity: 0.07;
    --vignette-strength: radial-gradient(circle at center, transparent 0%, rgba(0, 0, 0, 0.6) 100%);
}

/* LIGHT MODE: "Studio Day / High Key" */
[data-md-color-scheme="default"] {
    /* Base - "Studio Cyclorama" White */
    --cinematic-bg-void: #fafafa;
    --cinematic-bg-depth: #f0f2f5;
    --cinematic-bg-surface: #ffffff;

    /* Lighting - Soft box diffusion */
    --cinematic-light-key: #1a1a1a;
    /* High contrast ink */
    --cinematic-light-fill: #4a4a4a;
    --cinematic-light-rim: #e5e7eb;

    /* Accents - Technical & Clean */
    --cinematic-accent-primary: #2563eb;
    /* Cobalt */
    --cinematic-accent-glow: rgba(37, 99, 235, 0.2);
    --cinematic-error: #b91c1c;

    /* Texture */
    --film-grain-opacity: 0.04;
    /* Subtler in light mode */
    --vignette-strength: radial-gradient(circle at center, transparent 40%, rgba(0, 0, 0, 0.1) 120%);
}

/* ----------------------------------------------------------------------------
   5. COMPONENT MAPPING (Bridging Material to Cinema)
   ---------------------------------------------------------------------------- */
:root {
    --md-default-fg-color: var(--cinematic-light-key);
    --md-default-bg-color: var(--cinematic-bg-void);
    --md-default-fg-color--light: var(--cinematic-light-fill);
    --md-default-fg-color--lighter: var(--cinematic-light-rim);
    --md-default-bg-color--lighter: var(--cinematic-bg-surface);

    --md-primary-fg-color: var(--cinematic-accent-primary);
    --md-accent-fg-color: var(--cinematic-accent-primary);

    --md-code-bg-color: var(--cinematic-bg-depth);
    --md-admonition-bg-color: var(--cinematic-bg-surface);
}