@layer base {
  :root[data-theme="theme"] * { box-sizing: border-box; }
  :root[data-theme="theme"] { min-height: 100%; }
  :root[data-theme="theme"] body {
    min-height: 100%;
    margin: 0;
    overflow-x: hidden;
    background: var(--bg);
    color: var(--text);
    font: 400 var(--fs-md) / 1.55 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }
  :root[data-theme="theme"] button,
  :root[data-theme="theme"] input,
  :root[data-theme="theme"] textarea,
  :root[data-theme="theme"] select { font: inherit; color: inherit; }
  :root[data-theme="theme"] button { touch-action: manipulation; }
  :root[data-theme="theme"] h1,
  :root[data-theme="theme"] h2,
  :root[data-theme="theme"] h3,
  :root[data-theme="theme"] p,
  :root[data-theme="theme"] ul,
  :root[data-theme="theme"] ol { margin: 0; }
  :root[data-theme="theme"] ul,
  :root[data-theme="theme"] ol { padding: 0; }
  :root[data-theme="theme"] fieldset,
  :root[data-theme="theme"] dl,
  :root[data-theme="theme"] dd { margin: 0; padding: 0; }
  :root[data-theme="theme"] h1,
  :root[data-theme="theme"] h2,
  :root[data-theme="theme"] h3 {
    color: var(--text);
    font-weight: 750;
    line-height: 1.16;
    text-wrap: balance;
  }
  :root[data-theme="theme"] h1 { font-size: clamp(2rem, 4vw, var(--fs-2xl)); }
  :root[data-theme="theme"] h2 { font-size: clamp(1.35rem, 3vw, var(--fs-xl)); }
  :root[data-theme="theme"] h3 { font-size: var(--fs-lg); }
  :root[data-theme="theme"] p { color: var(--text-soft); }
  :root[data-theme="theme"] a { color: inherit; }
  :root[data-theme="theme"] :focus-visible {
    outline: 3px solid color-mix(in srgb, var(--accent) 70%, white);
    outline-offset: 3px;
  }
  :root[data-theme="theme"] ::selection { background: var(--accent-soft); color: var(--text); }
  @media (prefers-reduced-motion: reduce) {
    :root[data-theme="theme"] * { scroll-behavior: auto !important; }
  }
}