/* =====================================================================
   Reset leggero + elementi base
   ===================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  font-size: var(--fs-md);
  line-height: 1.5;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, p { margin: 0; }

a { color: inherit; text-decoration: none; }
a:hover { color: var(--brand); }

img { max-width: 100%; display: block; }

button, input, select, textarea { font: inherit; color: inherit; }

svg.icon { width: 16px; height: 16px; flex: none; vertical-align: middle; }

::selection { background: color-mix(in srgb, var(--brand) 30%, transparent); }

/* Scrollbar */
* { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 20px; border: 3px solid transparent; background-clip: content-box; }

.muted { color: var(--text-muted); }
.faint { color: var(--text-faint); }
.mono  { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }
.nowrap { white-space: nowrap; }
.right { text-align: right; }
.center { text-align: center; }