/* ============================================================
   The 16 reserved Atla Ventures project colors - CANYON DUSK revision
   (19AUG2026; Harbor added 19AUG2026, Ink assigned to Mindmeld 08SEP2026).
   Registry source of truth (internal, never deployed):
   Non Deployed Files\design-system\project-colors.json - mirrored as a
   swatch card in the project's Mindmeld. The colour-registry /settings page
   was removed 19AUG2026 - /settings exists again as of 08SEP2026, but for an
   unrelated purpose (the Overture look picker); do not confuse the two.

   Changes made when Canyon Dusk was approved:
     - SANDSTONE removed  (#A0703A read as the copper brand)
     - DENIM restored     (brand moved to copper, so blue is free again)
     - EMBER deepened     (see the Ember-vs-brand note below)

   EMBER-vs-BRAND decision: the brand copper is #96502B light /
   #FFB784 dark. Hearth's original Ember (#B5541F / #FFB68E) was
   nearly identical in dark mode - a project accent must never read
   as site chrome, so Ember was pushed hotter and deeper:
   #C24E14 light / #F58E5C dark. The side-by-side comparison lives on
   the Mindmeld's registry card; reverting is a two-line change here
   plus the JSON. (Decision: Jacob kept the deepened Ember, 19AUG2026.)

   An element carrying a .project-<slug> class gets the accent vars;
   the whole template recolors from them. Containers are derived
   uniformly with color-mix (MD3 tone-90-ish light / tone-30-ish
   dark) - consistency over exactness, per plan.
   ============================================================ */

[class*="project-"] {
  --project-on-color: #FFFFFF;
  --project-container: color-mix(in srgb, var(--project-color) 18%, #FFFFFF);
  --project-on-container: color-mix(in srgb, var(--project-color) 55%, #000000);
}

.project-ember     { --project-color: #C24E14; }
.project-lagoon    { --project-color: #00696D; }
.project-garnet    { --project-color: #9E2B25; }
.project-ochre     { --project-color: #9C7C1C; }
.project-moss      { --project-color: #6B7D2C; }
.project-fern      { --project-color: #3E7D3E; }
.project-juniper   { --project-color: #1F6E5A; }
.project-glacier   { --project-color: #2E7191; }
.project-denim     { --project-color: #3D5FA5; }
.project-indigo    { --project-color: #5951A8; }
.project-plum      { --project-color: #7E4BA0; }
.project-ink       { --project-color: #2E4569; }
.project-espresso  { --project-color: #6B4226; }
.project-umber     { --project-color: #6E5C42; }
.project-basalt    { --project-color: #5B6670; }
.project-harbor    { --project-color: #4e6e85; }

/* Dark looks: the tone-80 accent on dark containers.
   REWRITTEN AVT-G14, 06SEP2026. This was TWO duplicated blocks - a
   prefers-color-scheme media query AND a :root[data-theme="dark"] override -
   because a manual toggle had to beat the OS in both directions. The look
   system removes that problem at the root: data-look is ALWAYS set
   explicitly (layout.php seeds it from prefers-color-scheme on a first
   visit), so one selector is enough and every value appears exactly once
   instead of twice.

   This file had to change or the accents would have silently broken: it
   keyed off [data-theme], which no longer exists anywhere, so all sixteen
   would have stayed on their light values in a dark look.

   global-dark and midnight are the dark looks, per Overture's
   dist/looks.json "scheme" field - not a guess. */
:is([data-look="global-dark"], [data-look="midnight"]) [class*="project-"] {
  --project-on-color: #211D18;
  --project-container: color-mix(in srgb, var(--project-color) 30%, #17110C);
  --project-on-container: color-mix(in srgb, var(--project-color) 60%, #FFFFFF);
}
:is([data-look="global-dark"], [data-look="midnight"]) .project-ember    { --project-color: #F58E5C; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-lagoon   { --project-color: #6FDBDF; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-garnet   { --project-color: #FFB3AB; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-ochre    { --project-color: #EAC248; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-moss     { --project-color: #C7CE6B; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-fern     { --project-color: #A2D39A; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-juniper  { --project-color: #7FD6BC; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-glacier  { --project-color: #93CDF0; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-denim    { --project-color: #AFC6FF; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-indigo   { --project-color: #C3BFFF; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-plum     { --project-color: #DEB7FF; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-ink      { --project-color: #A9C3F0; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-espresso { --project-color: #CB9C77; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-umber    { --project-color: #D9C4A5; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-basalt   { --project-color: #C3CDD9; }
:is([data-look="global-dark"], [data-look="midnight"]) .project-harbor   { --project-color: #7093a8; }