/**
 * Pawsies - Design tokens
 *
 * The single declaration of every design value on the site. Nothing here
 * styles anything; it only names things, so that a change to the palette or
 * the radius scale is one edit rather than twenty-one.
 *
 * WHY THIS FILE EXISTS
 *   Before it, :root was declared in 21 separate files - once per page,
 *   inline, copy-pasted. Remarkably, the values had NOT drifted: all 19
 *   tokens held the same value in all 18 files that carried the full set,
 *   and the three outliers were strict subsets or supersets, never a
 *   conflict. That is luck, not process, and it does not survive the site
 *   tripling in size. The one file that HAD drifted (--text-muted #6b7280
 *   against #9A8F85 everywhere else) was assets/css/style.css, which nothing
 *   loaded - the drift went unnoticed for exactly as long as the file went
 *   unused.
 *
 * ADDING A TOKEN
 *   Add it here, use it anywhere. Do NOT redeclare :root in a page; a page
 *   that needs a value no other page needs still belongs here, because the
 *   next page will need it too. tools/check-css.php fails the build on a
 *   second :root.
 *
 * Loaded on every page by includes/header.php, before base.css and before
 * any page stylesheet, so everything downstream can use var().
 */

:root {
    /* Brand ------------------------------------------------------------- */
    --coral: #E8830C;
    --coral-light: #FFF3E8;
    --coral-dark: #C96E08;
    --sage: #7DB88F;
    --sage-light: #E8F5EC;
    --lavender: #B8A5D6;
    --lavender-light: #F5F0FF;

    /* Grounds ----------------------------------------------------------- */
    --cream: #FFFBF7;
    --cream-dark: #FFF5EC;
    --white: #FFFFFF;

    /* Ink --------------------------------------------------------------- */
    --text-primary: #2D2519;
    --text-secondary: #6B5E52;
    --text-muted: #9A8F85;

    /* Elevation --------------------------------------------------------- */
    --shadow-soft: 0 4px 24px rgba(45, 37, 25, 0.08);
    --shadow-medium: 0 8px 40px rgba(45, 37, 25, 0.12);
    --shadow-glow: 0 0 60px rgba(232, 131, 12, 0.15);

    /* Radius ------------------------------------------------------------ */
    --radius-sm: 12px;
    --radius-md: 20px;
    --radius-lg: 32px;
    --radius-xl: 48px;
}
