/* Quick — colori. Neutri di sistema Apple (grigi 120,120,128 / 60,60,67),
   un solo accento arancio. Verde/ambra/rosso sono RISERVATI agli stati. */
:root {
  /* base — neutri */
  --gray-0: #FFFFFF;
  --gray-50: #F7F7F8;
  --gray-100: #F2F2F4;
  --gray-150: #EAEAED;
  --gray-200: #DEDEE2;
  --gray-300: #C7C7CC;
  --gray-400: #AEAEB2;
  --gray-500: #8E8E93;
  --gray-600: #6C6C70;
  --gray-700: #48484A;
  --gray-800: #2C2C2E;
  --gray-850: #1E1E21;
  --gray-900: #161618;
  --gray-950: #0E0E10;

  /* base — accento (arancio "segnale") */
  --orange-300: #F5A66A;
  --orange-400: #F08A3E;
  --orange-500: #D9772E;
  --orange-600: #BF6424;
  --orange-700: #9A4E1A;

  /* base — stati */
  --green-500: #2F9E5B;
  --green-400: #4CC47A;
  --amber-500: #B98900;
  --amber-400: #E8B53A;
  --red-500: #D83B32;
  --red-400: #FF6A5F;
  --blue-500: #3478D1;
  --blue-400: #5A9BF0;

  /* semantici — superfici */
  --bg-window: #F7F7F8;
  --bg-grouped: #F2F2F4;
  --surface-card: #FFFFFF;
  --surface-raised: #FFFFFF;
  --surface-sidebar: #EFEFF1;
  --surface-sunken: rgba(120,120,128,0.08);
  --surface-band: rgba(120,120,128,0.06);
  --surface-hover: rgba(120,120,128,0.10);
  --surface-selected: rgba(217,119,46,0.12);
  --scrim: rgba(0,0,0,0.32);

  /* semantici — riempimenti controlli */
  --fill-1: rgba(120,120,128,0.08);
  --fill-2: rgba(120,120,128,0.14);
  --fill-3: rgba(120,120,128,0.22);

  /* semantici — testo */
  --text-1: #1C1C1E;
  --text-2: rgba(60,60,67,0.66);
  --text-3: rgba(60,60,67,0.42);
  --text-on-accent: #FFFFFF;
  --text-link: var(--orange-600);

  /* semantici — linee */
  --separator: rgba(60,60,67,0.12);
  --separator-strong: rgba(60,60,67,0.24);
  --hairline: rgba(0,0,0,0.10);

  /* semantici — accento */
  --accent: var(--orange-500);
  --accent-hover: var(--orange-600);
  --accent-pressed: var(--orange-700);
  --accent-soft: rgba(217,119,46,0.12);
  --accent-soft-hover: rgba(217,119,46,0.22);
  --accent-text: var(--orange-600);
  --focus-ring: rgba(217,119,46,0.45);

  /* semantici — stati */
  --status-ok: var(--green-500);
  --status-warn: var(--amber-500);
  --status-danger: var(--red-500);
  --status-info: var(--blue-500);
  --status-none: var(--gray-300);
  --status-ok-soft: rgba(47,158,91,0.12);
  --status-warn-soft: rgba(185,137,0,0.14);
  --status-danger-soft: rgba(216,59,50,0.12);
  --status-info-soft: rgba(52,120,209,0.12);

  /* anzianità (FollowQuick AgeLevel) */
  --age-fresh: var(--status-ok);
  --age-warn: var(--status-warn);
  --age-stale: var(--status-danger);
  --age-none: var(--status-none);

  /* grafici — serie ordinate, accento per primo */
  --chart-1: var(--orange-500);
  --chart-2: #5E6B7E;
  --chart-3: #9AA3B0;
  --chart-4: #C9CED6;
  --chart-grid: rgba(60,60,67,0.10);
  --chart-axis: rgba(60,60,67,0.42);

  color-scheme: light;
}

[data-theme="dark"] {
  --bg-window: #161618;
  --bg-grouped: #0E0E10;
  --surface-card: #1E1E21;
  --surface-raised: #2A2A2D;
  --surface-sidebar: #1A1A1C;
  --surface-sunken: rgba(120,120,128,0.16);
  --surface-band: rgba(120,120,128,0.10);
  --surface-hover: rgba(120,120,128,0.18);
  --surface-selected: rgba(240,138,62,0.20);
  --scrim: rgba(0,0,0,0.55);

  --fill-1: rgba(120,120,128,0.16);
  --fill-2: rgba(120,120,128,0.24);
  --fill-3: rgba(120,120,128,0.34);

  --text-1: #F2F2F5;
  --text-2: rgba(235,235,245,0.62);
  --text-3: rgba(235,235,245,0.34);
  --text-on-accent: #1A0F06;
  --text-link: var(--orange-400);

  --separator: rgba(84,84,88,0.50);
  --separator-strong: rgba(120,120,128,0.55);
  --hairline: rgba(255,255,255,0.08);

  --accent: var(--orange-400);
  --accent-hover: var(--orange-300);
  --accent-pressed: var(--orange-500);
  --accent-soft: rgba(240,138,62,0.18);
  --accent-soft-hover: rgba(240,138,62,0.28);
  --accent-text: var(--orange-400);
  --focus-ring: rgba(240,138,62,0.55);

  --status-ok: var(--green-400);
  --status-warn: var(--amber-400);
  --status-danger: var(--red-400);
  --status-info: var(--blue-400);
  --status-none: #48484A;
  --status-ok-soft: rgba(76,196,122,0.16);
  --status-warn-soft: rgba(232,181,58,0.16);
  --status-danger-soft: rgba(255,106,95,0.16);
  --status-info-soft: rgba(90,155,240,0.16);

  --chart-2: #8593A6;
  --chart-3: #5E6878;
  --chart-4: #3A404A;
  --chart-grid: rgba(235,235,245,0.08);
  --chart-axis: rgba(235,235,245,0.34);

  color-scheme: dark;
}
/* Quick — tipografia. Sans di sistema per l'interfaccia, mono per dati:
   importi, date, codici, conteggi, scorciatoie. Scala densa (desktop). */
:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "IBM Plex Sans", system-ui, "Segoe UI", sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "IBM Plex Sans", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "IBM Plex Mono", Menlo, Consolas, monospace;

  --text-2xs: 9.5px;   /* etichetta di sezione maiuscola */
  --text-xs: 10.5px;   /* meta, riga anzianità */
  --text-sm: 11px;     /* secondario */
  --text-base: 12.5px; /* righe, corpo denso desktop */
  --text-md: 13.5px;   /* corpo web */
  --text-lg: 15px;     /* titolo oggetto */
  --text-xl: 17px;     /* corpo iOS / titolo pannello */
  --text-2xl: 22px;    /* titolo vista */
  --text-3xl: 28px;    /* titolo grande iOS */
  --text-4xl: 36px;    /* numero hero */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --leading-tight: 1.2;
  --leading-snug: 1.35;
  --leading-body: 1.5;

  --tracking-tight: -0.01em;
  --tracking-display: -0.02em;
  --tracking-label: 0.07em;
  --tracking-caps: 0.13em;

  /* ruoli */
  --type-title-font: var(--weight-semibold) var(--text-lg)/var(--leading-tight) var(--font-sans);
  --type-body-font: var(--weight-regular) var(--text-base)/var(--leading-snug) var(--font-sans);
  --type-label-font: var(--weight-bold) var(--text-2xs)/var(--leading-tight) var(--font-sans);
  --type-data-font: var(--weight-medium) var(--text-base)/var(--leading-snug) var(--font-mono);
}
/* Quick — spaziature, raggi, ombre, misure, movimento.
   Valori reali presi dalle spec FollowQuick (non arrotondati alla griglia 4/8). */
:root {
  --space-0: 0;
  --space-1: 2px;
  --space-2: 3px;
  --space-3: 4px;
  --space-4: 6px;
  --space-5: 7px;
  --space-6: 8px;
  --space-7: 10px;
  --space-8: 12px;
  --space-9: 16px;
  --space-10: 20px;
  --space-11: 24px;
  --space-12: 32px;
  --space-13: 40px;
  --space-14: 56px;
  --indent: 24px;          /* rientro outliner per livello */

  --radius-xs: 3px;        /* tag, kbd */
  --radius-row: 5px;       /* righe */
  --radius-control: 7px;   /* bottoni desktop */
  --radius-box: 8px;       /* status box, input */
  --radius-touch: 10px;    /* bottoni iPad/iPhone */
  --radius-card: 12px;
  --radius-ring: 14px;     /* anello selezione, inset −2 */
  --radius-sheet: 16px;
  --radius-pill: 999px;

  --shadow-card: 0 4px 14px rgba(0,0,0,0.10), 0 0 0 0.5px rgba(0,0,0,0.10);
  --shadow-raised: 0 12px 32px rgba(0,0,0,0.18), 0 0 0 0.5px rgba(0,0,0,0.12);
  --shadow-subtle: 0 1px 2px rgba(0,0,0,0.06), 0 0 0 0.5px rgba(0,0,0,0.08);
  --shadow-inset: inset 0 0 0 1px var(--separator);

  --size-control-sm: 22px;   /* handle, chip */
  --size-control-md: 28px;   /* azioni oggetto Mac (larghezza 32) */
  --size-control-lg: 32px;
  --size-toolbar: 26px;      /* controlli toolbar Mac (larghezza 30) */
  --size-touch: 44px;        /* minimo touch */
  --size-appbar: 56px;       /* barra app web */
  --size-sidebar: 232px;
  --size-inspector: 320px;
  --size-card: 280px;
  --status-bar-width: 4px;

  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 120ms;
  --dur-base: 180ms;
  --dur-slow: 260ms;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg-window: #161618; --bg-grouped: #0E0E10; --surface-card: #1E1E21; --surface-raised: #2A2A2D;
    --surface-sidebar: #1A1A1C; --surface-sunken: rgba(120,120,128,0.16); --surface-band: rgba(120,120,128,0.10);
    --surface-hover: rgba(120,120,128,0.18); --surface-selected: rgba(240,138,62,0.20); --scrim: rgba(0,0,0,0.55);
    --fill-1: rgba(120,120,128,0.16); --fill-2: rgba(120,120,128,0.24); --fill-3: rgba(120,120,128,0.34);
    --text-1: #F2F2F5; --text-2: rgba(235,235,245,0.62); --text-3: rgba(235,235,245,0.34); --text-on-accent: #1A0F06;
    --text-link: #F08A3E; --separator: rgba(84,84,88,0.50); --separator-strong: rgba(120,120,128,0.55); --hairline: rgba(255,255,255,0.08);
    --accent: #F08A3E; --accent-hover: #F5A66A; --accent-pressed: #D9772E; --accent-soft: rgba(240,138,62,0.18);
    --accent-soft-hover: rgba(240,138,62,0.28); --accent-text: #F08A3E; --focus-ring: rgba(240,138,62,0.55);
    --status-ok: #4CC47A; --status-warn: #E8B53A; --status-danger: #FF6A5F; --status-info: #5A9BF0; --status-none: #48484A;
    --chart-2: #8593A6; --chart-3: #5E6878; --chart-4: #3A404A; --chart-grid: rgba(235,235,245,0.08); --chart-axis: rgba(235,235,245,0.34);
    color-scheme: dark;
  }
}
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg-window); color: var(--text-1); font-family: var(--font-sans); font-size: var(--text-base); line-height: var(--leading-snug); -webkit-font-smoothing: antialiased; }
a { color: var(--text-link); text-decoration: none; }
a:hover { text-decoration: underline; }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.num, .mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }