/* KindMX v2: base (reset, tipografía, iconos, utilidades). */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; min-height: 100vh; background: var(--canvas); color: var(--ink);
  font: 400 16px/1.5 var(--font-ui); -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: var(--accent-strong); }
a:hover { color: var(--accent-ink); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, p, ol, ul { margin: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.on-night :focus-visible { outline-color: var(--accent-line); }

.wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
@media (max-width: 719px) { .wrap { padding-inline: var(--gutter-m); } }

.display { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.tight { font-family: var(--font-tight); }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Iconos Lucide (sprite) */
.icon {
  width: 20px; height: 20px; flex: none;
  stroke: currentColor; fill: none; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round;
}
.i-14 { width: 14px; height: 14px; }
.i-16 { width: 16px; height: 16px; }
.i-18 { width: 18px; height: 18px; }
.i-26 { width: 26px; height: 26px; }
.i-40 { width: 40px; height: 40px; }
.icon.bold { stroke-width: 2.25; }

/* Ícono V-Bucks: el círculo usa color y la V usa stroke */
.vb-light { color: var(--on-night); stroke: var(--ink); }
.vb-dark { color: var(--ink); stroke: var(--on-night); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}
