/* ============================================================================
   audora.css — the shared visual foundation.
   Tokens live in tokens.css (imported below) — that file, not this one, is
   what the app imports (docs/handoff/12-frontend.md §3): this file also
   carries www's own base/reset rules (a zero-JS static site needs a full
   reset; the app already has Tailwind's preflight for that), which the app
   has no reason to take on. build-www.mjs resolves this @import before
   inlining, so splitting the file costs www nothing at runtime — same
   bytes land in the page either way.
   ========================================================================== */

@import "./tokens.css";

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

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

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--face);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}

/* zero-specificity reset: class rules always win (the Prism lesson) */
:where(p, h1, h2, h3, h4, h5, h6, ul, ol, figure, table, blockquote) { margin: 0; }
:where(ul, ol) { padding: 0; list-style: none; }
:where(img, svg, video) { display: block; max-width: 100%; height: auto; }
:where(a) { color: inherit; text-decoration: none; }
:where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
:where(table) { border-collapse: collapse; }

/* focus is never invisible */
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }