@font-face {
  font-family: 'Geist';
  src: url('../fonts/Geist-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}
@font-face {
  font-family: 'Geist Mono';
  src: url('../fonts/GeistMono-Variable.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

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

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  font-size: .875rem; /* 14px */
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

h1, h2, h3, h4 { color: var(--text); }
img, svg, canvas { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
button:disabled { cursor: not-allowed; }
ul, ol { padding: 0; list-style: none; }

a { color: var(--accent-text); text-decoration: none; }
a:hover { color: var(--accent-hover); text-decoration: underline; }

/* Foco sempre visível */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.field :focus-visible, .seg :focus-visible { outline: none; }

.mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; margin: -1px; padding: 0; border: 0;
}

/* Barras de rolagem finas */
* { scrollbar-width: thin; scrollbar-color: #D3D7DF transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #D3D7DF; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

/* inputs >= 16px evitam o zoom automático do iOS */
input, select, textarea { font-size: 1rem; }

@media (pointer: coarse) { button, [role="button"] { touch-action: manipulation; } }

/* O atributo hidden precisa vencer qualquer display definido nos componentes (flex, grid...) */
[hidden] { display: none !important; }