/* Ultra Dewan — colour architecture in five layers.
   L1 Core (permanent, inherited verbatim from the Dewan Design System)
   L2 Extended (curated material tones: grounds + accents)
   L3 Functional (data visualisation)
   L4 Sector lens (optional aliases — a lens, not a law)
   L5 Mood scopes (document-level colour worlds via [data-mood])
   Discipline: one dominant ground + one accent per document. Extended tones
   never carry body text on light grounds; Ink does. Dewan Red remains
   punctuation — it does not need to appear on every page, and never
   exceeds ~10% of a layout. Tints are made with
   color-mix(in oklab, var(--token), var(--white) N%), never new hexes. */
:root {
  /* ——— L1 · Core Dewan (permanent) ——— */
  --ink: #171717;        /* carries the brand: text, headlines, dark ground */
  --dewan-red: #E61E28;  /* punctuation, the Cut, recognition */
  --graphite: #5A5A58;   /* secondary text */
  --steel: #9C9C99;      /* captions, dividers */
  --concrete: #E3E2DF;   /* hairlines, subtle fills */
  --paper: #F7F6F3;      /* warm off-white surface */
  --white: #FFFFFF;

  /* ——— L2 · Extended — light grounds ——— */
  --cream: #F1ECE1;      /* warm paper; publications, hospitality */
  --sand: #DED4C2;       /* light material tone; covers, fills */
  --stone: #B6AFA2;      /* mid warm grey; large quiet type, fills */

  /* ——— L2 · Extended — accents ——— */
  --clay: #A6543A;       /* muted terracotta */
  --olive: #6A6B4B;      /* muted green */
  --mineral: #40607C;    /* desaturated blue */
  --bronze: #8A6C49;     /* warm metallic brown */

  /* ——— L2 · Extended — deep grounds ——— */
  --forest: #2C3A30;     /* deep green */
  --oxide: #57262E;      /* deep burgundy */
  --umber: #3C332A;      /* deep brown */
  --basalt: #232E38;     /* deep blue-grey */

  /* ——— L3 · Functional — data visualisation ——— */
  --chart-1: var(--ink);
  --chart-2: var(--dewan-red);   /* the key series only */
  --chart-3: var(--mineral);
  --chart-4: var(--clay);
  --chart-5: var(--olive);
  --chart-6: var(--bronze);
  --chart-grid: var(--concrete);
  --chart-axis: var(--steel);
  --chart-label: var(--graphite);

  /* ——— L4 · Sector lens (optional; unassigned sectors take --accent-editorial) ——— */
  --sector-hospitality: var(--clay);
  --sector-residential: var(--bronze);
  --sector-commercial: var(--mineral);
  --sector-public: var(--oxide);
  --sector-urban: var(--forest);
  --sector-education: var(--olive);

  /* ——— Semantic aliases — light ground (default) ——— */
  --surface-page: var(--white);
  --surface-alt: var(--paper);
  --surface-card: var(--white);
  --surface-inverse: var(--ink);
  --text-heading: var(--ink);
  --text-body: var(--ink);
  --text-secondary: var(--graphite);
  --text-caption: var(--steel);
  --text-inverse: var(--paper);
  --accent: var(--dewan-red);            /* brand punctuation, fixed */
  --accent-editorial: var(--dewan-red);  /* per-document accent, overridable */
  --border-hairline: var(--concrete);
  --border-strong: var(--ink);
  --focus-ring: var(--ink);
}

/* ——— L5 · Mood scopes — one identity, multiple moods.
       Set data-mood on the page/canvas root. Red holds at #E61E28 on all. */
[data-mood="paper"] {
  --surface-page: var(--paper);
  --surface-alt: var(--white);
  --surface-card: var(--white);
}
[data-mood="cream"] {
  --surface-page: var(--cream);
  --surface-alt: #EAE3D5;
  --surface-card: var(--cream);
  --border-hairline: #DCD4C4;
}
[data-mood="dark"] {
  --surface-page: var(--ink);
  --surface-alt: #1F1F1F;
  --surface-card: #1F1F1F;
  --surface-inverse: var(--white);
  --text-heading: var(--paper);
  --text-body: var(--paper);
  --text-secondary: var(--concrete);
  --text-caption: var(--steel);
  --text-inverse: var(--ink);
  --border-hairline: #2E2E2E;
  --border-strong: var(--paper);
  --focus-ring: var(--paper);
}
[data-mood="forest"] {
  --surface-page: var(--forest);
  --surface-alt: #33423A;
  --surface-card: #33423A;
  --text-heading: var(--cream);
  --text-body: var(--cream);
  --text-secondary: #AFB8AC;
  --text-caption: #8C968A;
  --text-inverse: var(--forest);
  --border-hairline: #3E4D43;
  --border-strong: var(--cream);
  --focus-ring: var(--cream);
}
[data-mood="oxide"] {
  --surface-page: var(--oxide);
  --surface-alt: #63303A;
  --surface-card: #63303A;
  --text-heading: var(--cream);
  --text-body: var(--cream);
  --text-secondary: #C4A6A5;
  --text-caption: #A2807F;
  --text-inverse: var(--oxide);
  --border-hairline: #6B3841;
  --border-strong: var(--cream);
  --focus-ring: var(--cream);
}
[data-mood="basalt"] {
  --surface-page: var(--basalt);
  --surface-alt: #2B3844;
  --surface-card: #2B3844;
  --text-heading: var(--paper);
  --text-body: var(--paper);
  --text-secondary: #A7B2BC;
  --text-caption: #7E8A95;
  --text-inverse: var(--basalt);
  --border-hairline: #33414D;
  --border-strong: var(--paper);
  --focus-ring: var(--paper);
}
[data-mood="umber"] {
  --surface-page: var(--umber);
  --surface-alt: #483E33;
  --surface-card: #483E33;
  --text-heading: var(--cream);
  --text-body: var(--cream);
  --text-secondary: #B5AB9C;
  --text-caption: #92887A;
  --text-inverse: var(--umber);
  --border-hairline: #4E4437;
  --border-strong: var(--cream);
  --focus-ring: var(--cream);
}