:root{
  /* coral — MARCHIO + distruttivo. Rev. 2026-08: non è più il colore dell'azione.
     Vedi il blocco AZIONE più sotto per il motivo. */
  --coral-50:#FAECE7; --coral-100:#F5C4B3; --coral-200:#F0997B; --coral-400:#D85A30; --coral-600:#993C1D; --coral-800:#712B13; --coral-900:#4A1B0C;
  /* teal — AZIONE (primario) + stati positivi */
  --teal-50:#E1F5EE; --teal-100:#9FE1CB; --teal-200:#5DCAA5; --teal-400:#1D9E75; --teal-600:#0F6E56; --teal-800:#085041; --teal-900:#04342C;
  /* warm gray — text & structure neutral */
  --gray-50:#F1EFE8; --gray-100:#D3D1C7; --gray-200:#B4B2A9; --gray-400:#888780; --gray-600:#5F5E5A; --gray-800:#444441; --gray-900:#2C2C2A;
  /* ochre — SEMANTIC ONLY ("attenzione"). Never brand expression: never in comms,
     illustration, charts or decorative surfaces — only warning text/subtle surfaces.
     Never a filled button: ochre-400 vs coral-400 measures 1.31:1 as adjacent fills. */
  --ochre-50:#FBF1DF; --ochre-100:#F2DCA9; --ochre-400:#C98A14; --ochre-600:#8A5C08; --ochre-900:#4A3104;
  /* paper — never pure white */
  --paper:#FBF8F3;
  --paper-alt:#F5EFE4;
  --ink:#2C2320;

  /* semantic aliases — page-level chrome only; cards/mockups/swatches stay on fixed values above by design */
  --page:var(--paper);
  --page-alt:var(--paper-alt);
  --surface-card:var(--paper);
  --nav-bg:rgba(251,248,243,0.92);
  --heading:var(--teal-900);
  --body-text:var(--gray-800);
  --muted-text:var(--gray-600);
  --faint-text:var(--gray-400);
  --border:var(--gray-100);

  /* ================= AZIONE — teal ==================================
     Rev. 2026-08 ("verde clinico"). Il primario passa da coral-600 a teal-600.
     Perché: nello staff platform il coral faceva insieme titolo, link di
     navigazione, CTA, toggle attivo E cestino — fino a 5 pieni corallo per
     schermata. Quando lo stesso rosso dice «procedi» e «elimina», non è più
     un allarme. Il coral resta su un solo mestiere: distruttivo.
     Contrasti: teal-600 su carta 5,94:1 · teal-50 su teal-600 5,54:1
     (era 3,36:1 con coral-400 come fill: la migrazione chiude anche quel gap).
     ATTENZIONE: coral-600 e teal-600 hanno luminanza quasi identica — 1,11:1
     l'uno contro l'altro. Due pieni affiancati restano indistinguibili per un
     deuteranope, quindi la regola dei DUE PESI non decade con il cambio di
     tinta: si applica esattamente come prima (guidelines/colors-hierarchy). */
  --primary:var(--teal-600);
  --primary-hover:var(--teal-800);
  --primary-active:var(--teal-900);
  --primary-text:var(--teal-50);
  /* secondo PESO dello stesso ruolo, non una seconda tinta */
  --primary-soft-bg:var(--teal-50);
  --primary-soft-text:var(--teal-800);
  --primary-soft-border:var(--teal-100);
  /* --secondary è il peso di TESTO del ruolo azione (link, label forti):
     teal-800, 8,77:1 su carta. Chi lo usa come fill ha --secondary-text sopra
     a 9,28:1, quindi resta valido anche per i consumatori ingenui. */
  --secondary:var(--teal-800);
  --secondary-hover:var(--teal-900);
  --secondary-text:var(--teal-50);
  --accent-soft:var(--teal-50);
  /* controlli: check, radio, switch, slider. teal-600 porta il segno a 5,54:1 */
  --control-accent:var(--teal-600);
  --selection-bg:var(--teal-50);
  --selection-border:var(--teal-400); /* 3,20:1 su carta — passa 1.4.11 */
  --focus-ring-color:var(--teal-400);
  /* navigazione: NEUTRA per default, colore solo sull'attivo. Sostituire 15 link
     corallo con 15 link teal avrebbe solo cambiato la tinta del rumore. */
  --nav-link:var(--gray-800);
  --nav-link-hover:var(--teal-800);
  --nav-link-active:var(--teal-600);

  /* ================= MARCHIO — coral =================================
     coral-400 è la superficie del marchio e NIENTE ALTRO: logo, icona, tile di
     brand, ornamento onda, grafica di comunicazione (slide, marketing).
     Mai un'azione, mai testo piccolo sopra (coral-50 su coral-400 = 3,36:1). */
  --brand-surface:var(--coral-400);
  --brand-ink:var(--coral-900);

  /* dismiss / neutral outline — the 69 "Annulla" of the staff platform.
     The hairline is DELIBERATELY faint: gray-100 measures 1.45:1 on paper (coral-100,
     the soft-destructive border, 1.48:1). WCAG 1.4.11 is satisfied by the label, not
     the border — 6.13:1 here — and a stronger border would put back the noise that
     moving the action row to outline had just removed. In Ledea a non-filled button
     is delimited by its label, not by its cage. Decided, not an oversight. */
  --dismiss-text:var(--gray-600);
  --dismiss-border:var(--gray-100);
  --dismiss-hover-bg:var(--gray-800);
  --dismiss-hover-text:var(--paper);

  /* disabled — one state for every variant, so a disabled screen stays grey
     instead of turning into a rainbow. Exempt from WCAG 1.4.3 / 1.4.11. */
  --disabled-bg:var(--gray-50);
  --disabled-text:var(--gray-400);
  --disabled-border:var(--gray-100);

  --avoid-text:var(--coral-600);
  --good-text:var(--teal-800);
  /* danger: coral-600. Dal 2026-08 il coral è ESCLUSIVO del distruttivo, quindi
     non condivide più il valore con --primary. Restano separati per PESO perché
     la luminanza è quasi identica a quella del primario (1,11:1). */
  --danger:var(--coral-600);
  --danger-bg:var(--coral-50);
  --success:var(--teal-800);
  --success-bg:var(--teal-50);
  --warning:var(--ochre-600);
  --warning-bg:var(--ochre-50);
  --warning-border:var(--ochre-100);
  --info:var(--gray-800);
  --info-bg:var(--gray-50);
  --info-border:var(--gray-100);

  /* rgb triplets — Bootstrap needs these for rgba() focus rings */
  --coral-400-rgb:216,90,48; /* @kind other */ --coral-600-rgb:153,60,29; /* @kind other */
  --teal-400-rgb:29,158,117; /* @kind other */ --teal-600-rgb:15,110,86; /* @kind other */ --teal-800-rgb:8,80,65; /* @kind other */ --teal-900-rgb:4,52,44; /* @kind other */
  --gray-600-rgb:95,94,90; /* @kind other */ --gray-800-rgb:68,68,65; /* @kind other */ --gray-900-rgb:44,44,42; /* @kind other */
  --ochre-400-rgb:201,138,20; /* @kind other */ --ochre-600-rgb:138,92,8; /* @kind other */
  --paper-rgb:251,248,243; /* @kind other */
  --focus-ring-width:3px;
}
@media (prefers-color-scheme:dark){
  :root{
    --page:#211B18;
    --page-alt:#2A211D;
    --nav-bg:rgba(33,27,24,0.92);
    --heading:#9FE1CB;
    --body-text:#E4DCD3;
    --muted-text:#B4A99E;
    --faint-text:#8C8177;
    --ink:#E4DCD3;
    --avoid-text:#F0997B;
    --good-text:#5DCAA5;
  }
}