/* Fondamenta comuni. Gli stili futuri possono sovrascrivere questi token
   sotto html[data-ui-version="..."] senza modificare i componenti. */
:root {
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --text-muted: #64748b;
  --muted: var(--text-muted);
  --ok: var(--success);
  --ui-radius: 12px;
  --ui-radius-small: 8px;
  --ui-focus: #1d4ed8;
  --ui-overlay: rgba(15, 23, 42, .55);
  --ui-motion: 160ms;
  --ui-shadow: 0 8px 28px rgba(15, 23, 42, .12);
  --action-bg: color-mix(in srgb, var(--accent) 80%, #0f172a);
  --action-hover: color-mix(in srgb, var(--accent) 65%, #0f172a);
}
html[data-theme="dark"] {
  --surface: #1e293b;
  --surface-raised: #243144;
  --text-muted: #a3b1c6;
  --ui-focus: #93c5fd;
  --ui-overlay: rgba(2, 6, 23, .72);
  --ui-shadow: 0 10px 32px rgba(0, 0, 0, .4);
}
