/* ============================================================
   Aproject — Base layer
   Minimal, non-invasive resets + the brand defaults (body
   font, antialiasing, warm scrollbars, selection colour, the
   .wordmark serif helper). Component classes live with their
   components; this only sets page-level defaults so specimen
   cards and UI kits inherit the right baseline.
   ============================================================ */

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

body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-snug);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button { font-family: inherit; }

/* serif wordmark / display helper */
.wordmark,
.font-serif { font-family: var(--font-serif); }
.font-mono  { font-family: var(--font-mono); }

::selection { background: var(--terracotta-tint); }

/* brand mark — disc/eye fills come from --brand-logo-* tokens (inverted under .dark) */
.brand-logo { border-radius: 50%; display: block; }

/* warm thin scrollbars (opt-in via .scroll) */
.scroll::-webkit-scrollbar { width: 10px; height: 10px; }
.scroll::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border: 3px solid transparent;
  background-clip: padding-box;
  border-radius: 999px;
}
.scroll::-webkit-scrollbar-thumb:hover { background: var(--sidebar-muted); background-clip: padding-box; }
.scroll { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; }