/* ═══════════════════════════════════════════════════════════════════════════
   TOKEN — riskinnare per un cliente significa toccare solo questo file.
   L'accento del brand vive nella chrome e non tocca mai la carta: il giorno in
   cui cambia colore, i documenti restano identici.
   ═════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── brand ─────────────────────────────────────────────────────────────── */
  --brand-nero:      #0A0A0A;
  --brand-accento:   #E9B44C;   /* ambra: neutro, e leggibile sul buio della stanza */
  --brand-display:   'Archivo', 'Archivo Narrow', system-ui, sans-serif;
  --brand-mono:      'IBM Plex Mono', ui-monospace, 'Cascadia Mono', monospace;

  /* ── carta & inchiostro ────────────────────────────────────────────────── */
  --carta:            #F4EFE4;
  --carta-alta:       #F8F5EE;
  --carta-copia:      #E7E0CD;
  --carta-manila:     #D9C4A0;
  --carta-postit:     #F2D45C;
  --inchiostro:       #14100C;
  --inchiostro-lieve: #5C544A;
  --inchiostro-tenue: #14100C40;
  --rosso:            #B4231F;

  /* ── il piano ──────────────────────────────────────────────────────────── */
  --piano:       #0D0C0A;
  --piano-linea: #FFFFFF10;

  /* ── i sipari, uno per tappa ───────────────────────────────────────────── */
  --osso:    #E8E2D4;
  --ambra:   #A85B12;
  --cobalto: #10214A;
  --nero:    #0A0A0A;

  /* ── tipografia ────────────────────────────────────────────────────────── */
  --serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --mano:  'Caveat', 'Segoe Script', cursive;

  /* Nessuno legge in piccolo, mai: 19px è il corpo in modalità lettura. */
  --corpo-lettura: 19px;

  /* ── ombre: una sola scala, usata ovunque ──────────────────────────────── */
  --posato: 0 1px 1px #00000059, 0 6px 14px -6px #00000073;
  --alzato: 0 2px 4px #0000006b, 0 26px 40px -18px #000000a6;
  --inMano: 0 4px 10px #00000073, 0 50px 90px -30px #000000cc;

  /* ── movimento ─────────────────────────────────────────────────────────── */
  /* Niente entra in scena dal nulla: tutto viene posato. */
  --posa:  380ms cubic-bezier(.22, 1, .36, 1);
  --presa: 120ms cubic-bezier(.4, 0, .2, 1);
  --lastra: 480ms cubic-bezier(.76, 0, .24, 1);
}

/* La luce fa metà del lavoro drammatico, ed è un orologio che si legge senza
   accorgersene. Una classe per tappa sulla scena. */
.luce-pomeriggio { --pozza: #FFD9A02e; --freddo: #00000000; }
.luce-sera       { --pozza: #FFD09040; --freddo: #0A142A26; }
.luce-notte      { --pozza: #FFC97A4d; --freddo: #0E2A5C4d; }
.luce-neon       { --pozza: #FFFFFF1a; --freddo: #E8F0FF14; }

@media (prefers-reduced-motion: reduce) {
  :root { --posa: 1ms; --presa: 1ms; --lastra: 1ms; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
