:root {
    /* Base & Surface Palette: Warm Editorial Ivory, Porcelain White, and Chapter Surfaces */
    --bg-page: #FAF7F2;                 /* Warm Alabaster / Ivory Canvas */
    --bg-surface: #FFFFFF;              /* Pure White Reading Surface */
    --bg-subtle: #F5EFE6;               /* Tender warm tint */
    --bg-card: #FFFFFF;
    --bg-soundtrack: #221E1C;           /* Atmospheric warm charcoal for musical pause */
    --bg-soundtrack-surface: #2E2926;   /* Dark elevated card surface */
    --bg-discovery: #FFF9F5;            /* Soft playful discovery surface */

    /* Typographic Color Contrasts */
    --text-main: #2D2A26;               /* Warm Charcoal (High legibility, soft on eyes) */
    --text-heading: #1C1A18;            /* Deep Sumi Espresso */
    --text-muted: #6E6862;              /* Balanced editorial secondary text */
    --text-light: #9C958E;              /* Subdued metadata */
    --text-inverse: #FFFFFF;
    --text-soundtrack: #FDFBFA;         /* Crisp light on dark soundtrack */
    --text-soundtrack-muted: #B8B0A8;

    /* Intentional Color Accents (Used with restraint — ~20% of personality) */
    --accent-strawberry: #FF6B8B;
    --accent-strawberry-hover: #E55776;
    --accent-strawberry-light: #FFF0F3;
    --accent-coral: #FF8E72;
    --accent-butter: #F9C74F;
    --accent-butter-light: #FFF8E7;
    --accent-mint: #06D6A0;
    --accent-mint-hover: #05B888;
    --accent-mint-light: #EBFBF6;
    --accent-sky: #4EA8DE;
    --accent-sky-light: #EEF7FC;
    --accent-lavender: #9D8DF1;
    --accent-peach: #FFB4A2;

    /* Primary Interactive Accent */
    --accent-primary: var(--accent-strawberry);
    --accent-primary-hover: var(--accent-strawberry-hover);

    /* Clean Editorial Borders & Dividers (Subtle, never heavy) */
    --border-subtle: #EDE7DE;
    --border-medium: #DDD5C9;
    --border-dark: rgba(255, 255, 255, 0.1);

    /* Editorial + Friendly Typography Pairings */
    --font-serif: "Lora", "Playfair Display", "Merriweather", Georgia, serif;
    --font-sans: "Quicksand", "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-heading: var(--font-sans);
    --font-editorial: var(--font-serif);

    /* Proportional Radii Hierarchy (Never round everything to 24px) */
    --radius-xs: 4px;
    --radius-sm: 8px;                   /* Subtle image corners */
    --radius-md: 12px;                  /* Moderate container corners */
    --radius-lg: 16px;                  /* Section panels */
    --radius-xl: 22px;                  /* Floating islands */
    --radius-pill: 9999px;              /* Buttons & badge tags */

    /* Restrained, Purposeful Elevations (Flat editorial first, shadow only on floating layers) */
    --shadow-subtle: 0 2px 8px rgba(45, 42, 38, 0.04);
    --shadow-hover: 0 8px 24px -4px rgba(45, 42, 38, 0.08);
    --shadow-floating: 0 16px 36px -6px rgba(34, 30, 28, 0.25);
    --shadow-clay-button: 0 4px 12px rgba(255, 107, 139, 0.32);
    --shadow-clay-pill: none;           /* Eliminated: pills are clean */
    --shadow-clay-card: none;           /* Eliminated: cards are flat & quiet */

    /* Editorial Measures & Layout Widths */
    --container-max: 1220px;
    --article-measure: 680px;           /* Ideal line measure for human reading */
    --article-layout-max: 1140px;
    --lead-max: 820px;

    /* Organic Transitions */
    --transition-bounce: all 0.24s cubic-bezier(0.34, 1.56, 0.64, 1);
    --transition-smooth: all 0.2s ease-out;
}
