/* ─── Niro base layer ────────────────────────────────────────────────────────
   Global resets, the signature dot-grid + grain background (ambient layers
   kept by explicit sign-off), and small utilities. All values come from the
   DS v2 tokens loaded ahead of this. */

* { margin: 0; padding: 0; box-sizing: border-box; }

html { overflow-x: hidden; }

body {
  font-family: var(--font-sans);
  background-color: var(--surface-page);
  color: var(--text-primary);
  font-size: var(--size-ui);
  line-height: var(--leading-prose);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-sans);
  color: var(--text-primary);
}

a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; outline: none; }

/* ── Signature dot-grid background (ambient layer — kept) ── */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 32px 32px;
  pointer-events: none;
  z-index: 0;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 40%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 40%, transparent 100%);
}
[data-theme="light"] body::before {
  background-image: radial-gradient(circle, rgba(30, 30, 30, 0.08) 1px, transparent 1px);
}

/* ── Subtle film grain overlay (ambient layer — kept) ── */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PScwIDAgMjU2IDI1NicgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48ZmlsdGVyIGlkPSdub2lzZSc+PGZlVHVyYnVsZW5jZSB0eXBlPSdmcmFjdGFsTm9pc2UnIGJhc2VGcmVxdWVuY3k9JzAuOScgbnVtT2N0YXZlcz0nNCcgc3RpdGNoVGlsZXM9J3N0aXRjaCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNub2lzZSknIG9wYWNpdHk9JzAuMDM1Jy8+PC9zdmc+");
  pointer-events: none;
  z-index: 0;
  opacity: 0.4;
}
[data-theme="light"] body::after { opacity: 0.08; }

.mono { font-family: var(--font-mono); }

/* ── Selection & scrollbar ── */
::selection { background: var(--accent-soft); color: var(--text-primary); }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--surface-page); }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-faint); }
