/* ═══════════════════════════════════════════════════════════════════════════
   tokens.css — Holmes Design System (Fase 3 + sess 11 rework + sess 12 rename)

   Sorgente unica di verità per palette, tipografia e scale dimensionali.
   Consumata da: simple.css, orbit-v2.css, rich-blocks.css, memory-panel.css,
   e anche da orbit.css (via override delle sue vars --bg/--ink/--glow/--line
   su scope [data-theme]).

   Scope unificato (sess 11): 3 temi [data-theme="light|dark|gold"] + auto.
   Rimossi: [data-orb-theme="tempio|holo|mission"] (solo v1 legacy archiviata) e
   [data-theme="theme3"] (viola saturo — ridotto a gold dal briefing OWNER).

   Documentazione: /var/www/holmes/DESIGN-TOKENS.md.
   Cache-bust policy: ?v=YYYYMMDDx manuale su index.html + simple.html.

   Ordine di caricamento: questo file PRIMA di qualunque altro CSS v2.
═══════════════════════════════════════════════════════════════════════════ */

/* ─── ROOT — token stabili condivisi (tipografia, spacing, radius, z-index) ──
   NON specifici del tema: valgono uguali per light/dark/gold.
   Il colore vive nei 3 scope sotto.                                          */
:root {
  /* Tipografia */
  --font-body:
    'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-display:
    'Space Grotesk', 'Inter', system-ui, -apple-system, sans-serif;

  --fs-xs:     0.688rem;   /* 11px */
  --fs-sm:     0.813rem;   /* 13px */
  --fs-base:   0.938rem;   /* 15px — body default chat */
  --fs-md:     1rem;       /* 16px */
  --fs-lg:     1.125rem;   /* 18px */
  --fs-xl:     1.375rem;   /* 22px */
  --fs-2xl:    1.75rem;    /* 28px */

  --fw-regular:   400;
  --fw-medium:    500;
  --fw-semibold:  600;

  --lh-tight:  1.2;
  --lh-base:   1.5;
  --lh-loose:  1.7;

  --ls-heading:  -0.01em;
  --ls-body:     0;
  --ls-wide:     0.04em;

  /* Spacing base 4 */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;

  /* Radius */
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-lg:    12px;
  --radius-xl:    16px;
  --radius-2xl:   20px;
  --radius-full:  9999px;

  /* Z-index */
  --z-base:      0;
  --z-raised:    10;
  --z-sticky:    20;
  --z-header:    30;
  --z-popup:     40;
  --z-dropdown:  100;
  --z-modal:     1000;
  --z-tooltip:   1100;
  --z-toast:     1200;
}

/* ═══════════════════════════════════════════════════════════════════════════
   TEMA UNICO — TEMPIO (oro/sabbia originale Orbit v1)
   Valori 1:1 dal vecchio [data-orb-theme="tempio"] di orbit.css legacy.
   Caratteristiche: bg cool-dark (blue-gray), text cream off-white (non giallo),
   glow oro sabbia soft (#f4d9a0, non #E6C158 saturo).
   ═══════════════════════════════════════════════════════════════════════════ */
:root {
  --bg:              #0b0b0c;
  --surface:         #0b0b0c;
  --bg-2:            #050709;
  --surface-hover:   rgba(244, 217, 160, 0.06);

  --border:          rgba(232, 226, 212, 0.14);
  --border-strong:   rgba(232, 226, 212, 0.32);

  --text:            #e8e2d4;
  --text-dim:        #8a8578;
  --text-muted:      rgba(232, 226, 212, 0.46);

  --accent:          #f4d9a0;
  --accent-hover:    #ffe9b8;
  --accent-text:     #14181c;
  --accent-soft:     rgba(244, 217, 160, 0.14);

  --danger:          #E0665E;
  --danger-soft:     rgba(224, 102, 94, 0.20);
  --warning:         #D9A44A;
  --warning-soft:    rgba(217, 164, 74, 0.24);
  --success:         #6DC691;

  --focus-ring:      rgba(244, 217, 160, 0.55);

  --shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.28),
                0 1px 3px rgba(0, 0, 0, 0.34);
  --shadow-md:  0 2px 6px rgba(0, 0, 0, 0.36),
                0 4px 12px rgba(0, 0, 0, 0.40);
  --shadow-lg:  0 8px 24px rgba(0, 0, 0, 0.48),
                0 4px 8px rgba(0, 0, 0, 0.30);
  --shadow-xl:  0 16px 40px rgba(0, 0, 0, 0.58),
                0 8px 20px rgba(0, 0, 0, 0.38);

  /* ─── Orbit legacy vars (consumate da orbit.css per sfera/ottaedro/linee) ── */
  --ink:             #e8e2d4;
  --mute:            #8a8578;
  --faint:           rgba(232, 226, 212, 0.46);
  --line:            rgba(232, 226, 212, 0.14);
  --line-2:          rgba(232, 226, 212, 0.32);
  --glow:            #f4d9a0;
  --glow-2:          #ffe9b8;
  --glow-soft:       rgba(244, 217, 160, 0.45);
  --glow-dim:        rgba(244, 217, 160, 0.08);
  --glow-line:       rgba(244, 217, 160, 0.28);
  --glow-line-strong: rgba(244, 217, 160, 0.45);
  --screen-bg:       rgba(10, 13, 17, 0.78);
}
