/* Token dell'app GeoTobler, copiati da geotobler_app/frontend/src/styles/tokens.css (ramo notte-30-10, 2/11/2026). Non modificare qui: se l'app cambia, si ricopia. */
:root {
  /* ── Blu di prodotto (#2j · 600 azioni, 50/100 superfici, 700 hover) ──── */
  --gt-blue-50: #eaf3fe;
  --gt-blue-100: #d3e6fd;
  --gt-blue-300: #8fc0f7;
  --gt-blue-600: #2f7ff0;
  --gt-blue-700: #1c6fe0;
  --gt-blue-900: #123f7f;

  /* ── Neutri (#2j · testo 900/600, bordi 200, fondi 0/50) ─────────────── */
  --gt-n-0: #ffffff;
  --gt-n-50: #f6f8fa;
  --gt-n-100: #eef1f5;
  --gt-n-200: #dfe4ec;
  --gt-n-400: #98a3b0;
  --gt-n-600: #5a6b7d;
  --gt-n-900: #17222f;

  /* Neutri ricorrenti nelle 18 schermate (non nella tavolozza di #2j) */
  --gt-n-25: #f7f9fc;   /* testata tabella, input congelati */
  --gt-n-75: #f1f4f9;   /* selettore modalità, binario delle barre */
  --gt-n-80: #f0f3f7;   /* filetto fra le righe di tabella */
  --gt-n-150: #e4e8ef;  /* bordo standard di card e pannelli */
  --gt-n-160: #e9edf3;  /* bordo della testata di tabella */
  --gt-n-250: #c9d3e0;  /* tratteggio degli stati vuoti, controlli spenti */
  --gt-n-350: #a3aeba;  /* icone secondarie */
  --gt-n-450: #8a97a6;  /* testo meta, mono di servizio */
  --gt-n-650: #4a5a6c;  /* testo del corpo secondario */
  --gt-n-700: #3d4b5c;  /* testo di pastiglie e numeri in tabella */
  --gt-n-800: #2c3a4a;  /* testo lungo del thread */
  --gt-hatch: #eef2f7;  /* tratteggio a righe degli scheletri di mappa */
  --gt-app-bg: #eceff3; /* fondo della tela */

  /* ── Semantiche: una tinta, un bordo, un testo ──────────────────────── */
  --gt-pending: #b8791b;
  --gt-pending-bg: #fdf8ee;
  --gt-pending-bd: #f0dcbb;
  --gt-failed: #c3372a;
  --gt-failed-bg: #fdf1ef;
  --gt-failed-bd: #f4cfc9;
  --gt-active: #1f9d63;
  --gt-active-bg: #eef9f3;
  --gt-active-bd: #cfeadd;

  /* ── Accenti ────────────────────────────────────────────────────────── */
  --gt-critical: #d9432e;      /* valori critici negli indicatori */
  --gt-signal: #e2542f;        /* badge 17 del drawer */
  --gt-row-selected: #fdf7e6;  /* riga selezionata in tabella */
  --gt-selected-bg: #f4f9ff;   /* riga/card selezionata */
  --gt-selected-bd: #dce9fb;

  /* ── Scala di valore sequenziale (6 classi, basso → alto) ───────────── */
  --gt-seq-1: #fff0b8;
  --gt-seq-2: #fdd38a;
  --gt-seq-3: #fba85f;
  --gt-seq-4: #f4713f;
  --gt-seq-5: #dd3f3a;
  --gt-seq-6: #a52252;

  /* ── Archetipi delle personas: cinque tinte categoriali ─────────────────
     Dicono «che tipo», non «quanto»: per questo non sono né la sequenziale
     né la divergente delle mappe. Scelte col validatore della skill dataviz
     (separazione per daltonici e a visione normale, contrasto sul bianco);
     accanto c'è sempre il nome dell'archetipo, mai il colore da solo. */
  --gt-arch-1: #4a3aa7;
  --gt-arch-2: #1baf7a;
  --gt-arch-3: #2a78d6;
  --gt-arch-4: #eda100;
  --gt-arch-5: #e87ba4;
  /* Le stesse tinte per l'icona esagonale delle personas (ui/Ritratto.jsx,
     tavola «Icona» del wireframe v3): -soft è il fondo chiaro dell'esagono di
     una persona, -ink il segno, e il fondo pieno dell'esagono di una famiglia. */
  --gt-arch-1-soft: #f1effa;
  --gt-arch-1-ink: #3a2d8a;
  --gt-arch-2-soft: #e8f7f0;
  --gt-arch-2-ink: #138a60;
  --gt-arch-3-soft: #eaf2fc;
  --gt-arch-3-ink: #1d5fae;
  --gt-arch-4-soft: #fdf5e3;
  --gt-arch-4-ink: #a46d00;
  --gt-arch-5-soft: #fcedf3;
  --gt-arch-5-ink: #b0446f;

  /* ── Scala divergente (7 classi, sotto → sopra la soglia) ───────────── */
  --gt-div-1: #3fa89b;
  --gt-div-2: #7cc9a8;
  --gt-div-3: #cfe6b0;
  --gt-div-4: #fdefb4;
  --gt-div-5: #fba85f;
  --gt-div-6: #ef6a43;
  --gt-div-7: #d3372f;

  /* ── Basemap desaturata ─────────────────────────────────────────────── */
  --gt-map-land: #f2efeb;
  --gt-map-green: #cfe8b6;
  --gt-map-water: #a3d5f2;
  --gt-map-road: #c6ccd8;
  --gt-map-highway: #a9b2c1;
  --gt-map-building: #e6e1d8;
  --gt-map-label: #3f4b59;
  /* La basemap Standard delle mappe a celle (basemap.js, CONFIG_STANDARD):
     parchi, acqua, aree e strade attenuati, così le celle in multiply restano
     dei colori della legenda. */
  --gt-map-park: #e2e5da;
  --gt-map-sea: #c8dbe9;
  --gt-map-area: #ece8e2;
  --gt-map-street: #d4d8df;
  --gt-map-trunk: #c3c9d3;

  /* ── Ruoli (alias: usare questi nei componenti) ─────────────────────── */
  --gt-accent: var(--gt-blue-600);
  --gt-accent-hover: var(--gt-blue-700);
  --gt-accent-soft: var(--gt-blue-50);
  --gt-surface: var(--gt-n-0);
  --gt-surface-2: var(--gt-n-50);
  --gt-text: var(--gt-n-900);
  --gt-text-2: var(--gt-n-600);
  --gt-text-3: var(--gt-n-450);
  --gt-text-4: var(--gt-n-400);
  --gt-line: var(--gt-n-150);
  --gt-line-strong: var(--gt-n-200);
  --gt-on-accent: var(--gt-n-0);
  --gt-veil: rgba(16, 24, 40, .42);
  /* Sopra e sotto il riferimento (semplificazione v3): blu = sopra, arancio
     = sotto; «sotto» non vuol dire «male», il rosso resta agli errori. */
  --gt-sopra: var(--gt-blue-600);
  --gt-sotto: var(--gt-seq-4);
  /* ── «Rispetto all'Italia» (7 classi, sotto → sopra): arancio → neutro → blu
     (flash.md §3.27, F05). I capi sono --gt-sotto e --gt-sopra, con un passo
     in più ai due estremi; la classe di mezzo è «come l'Italia». Per le mappe
     a celle (map/scale.js) e la legenda a soglie; non è la divergente
     verde → rosso (--gt-div-*), che resta a ciò che ha un «male». ─────── */
  --gt-vs-1: #d85a1c;  /* molto sotto */
  --gt-vs-2: #f4713f;  /* = --gt-sotto */
  --gt-vs-3: #f9b88f;
  --gt-vs-4: #e4e8ef;  /* = --gt-n-150, come l'Italia */
  --gt-vs-5: #8fc0f7;  /* = --gt-blue-300 */
  --gt-vs-6: #2f7ff0;  /* = --gt-sopra */
  --gt-vs-7: #1b55bf;  /* molto sopra */

  /* ── Tipografia ─────────────────────────────────────────────────────── */
  --gt-font-sans: "Lato", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gt-font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* ── Raggi ──────────────────────────────────────────────────────────── */
  --gt-r-pill: 999px;
  --gt-r-16: 16px;
  --gt-r-14: 14px;
  --gt-r-13: 13px;
  --gt-r-12: 12px;
  --gt-r-11: 11px;
  --gt-r-10: 10px;
  --gt-r-9: 9px;
  --gt-r-8: 8px;
  --gt-r-7: 7px;
  --gt-r-6: 6px;
  --gt-r-3: 3px;
  --gt-r-2: 2px;

  /* ── Ombre ──────────────────────────────────────────────────────────── */
  --gt-shadow-card: 0 1px 2px rgba(16, 24, 40, .04);
  --gt-shadow-raised: 0 2px 10px rgba(16, 24, 40, .07);
  --gt-shadow-menu: 0 8px 24px rgba(16, 24, 40, .10);
  --gt-shadow-popover: 0 16px 40px rgba(16, 24, 40, .16);
  --gt-shadow-home: 0 6px 24px rgba(47, 127, 240, .10);
  --gt-shadow-pin: 0 2px 6px rgba(16, 24, 40, .2);
  --gt-shadow-focus: 0 0 0 3px var(--gt-blue-50);
  --gt-focus-ring: 0 0 0 2px var(--gt-n-0), 0 0 0 4px var(--gt-blue-600);

  /* ── Durate (§10.2 · tetto .5s) e curve ─────────────────────────────── */
  --gt-dur-toggle: .15s;
  --gt-dur-popover: .16s;
  --gt-dur-overlay: .18s;
  --gt-dur-select: .18s;
  --gt-dur-cell: .2s;
  --gt-dur-block: .22s;
  --gt-dur-scene: .25s;
  --gt-dur-bar: .4s;
  --gt-dur-tilt: .5s;
  /* La coreografia della v3 (semplificazione.md, «Animazioni»): numeri che
     contano, onda delle celle, dissolvenza fra indicatori, volo d'arrivo,
     colonna che scorre, passo della cascata. Conta e arrivo superano il
     tetto di mezzo secondo: sono i due movimenti lunghi del primo arrivo,
     entro il secondo tutto insieme. */
  --gt-dur-conta: .6s;
  --gt-dur-onda: .5s;
  --gt-dur-sfuma: .3s;
  --gt-dur-arrivo: .9s;
  --gt-dur-colonna: .25s;
  --gt-cascata-passo: 60ms;
  --gt-ease-out: cubic-bezier(.2, .7, .3, 1);
  --gt-rise: 6px;

  /* ── Misure fisse (§1, §4, §5, §6, §7, §8) ──────────────────────────── */
  --gt-h-globalbar: 58px;
  --gt-h-ambiente: 24px;  /* la striscia di staging/dev, vedi app/AvvisoAmbiente */
  --gt-h-projectbar: 52px;
  --gt-w-reading: 730px;
  --gt-w-thread-analysis: 456px;
  --gt-w-thread-ipad: 400px;
  --gt-w-drawer-closed: 60px;
  --gt-w-drawer-open: 330px;
  --gt-w-overlay-skill: 790px;
  --gt-w-overlay-file: 980px;
  --gt-w-infocard: 360px;
  --gt-w-readcard: 236px;
  --gt-w-scorecard: 246px;
  --gt-w-menu: 196px;
  --gt-w-table-narrow: 416px;
  --gt-bp-fullscreen: 1180px;
  --gt-touch: 44px;

  /* ── Scala di z-index ───────────────────────────────────────────────── */
  --gt-z-projectbar: 6;
  --gt-z-artifact: 24;
  --gt-z-overlay: 30;
  --gt-z-popover: 40;
  --gt-z-toast: 50;
}