/* ============================================================
   Modern CSS reset

   Wrapped in `@layer reset` so any unlayered styles (globals.css,
   *.module.css) always win, regardless of source order — no
   specificity battles, no `!important`.

   Selectors use `:where()` to keep specificity at 0 — any rule
   anywhere else in the project beats them trivially.
   ============================================================ */

@layer reset {
  /* 1. More-intuitive box-sizing */
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }

  /* 2. Remove default margin (preserve <dialog> centering) */
  :where(*:not(dialog)) {
    margin: 0;
  }

  /* 3. Root defaults: prevent iOS zoom on rotate, keep tabs sane */
  :where(html) {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    tab-size: 4;
    color-scheme: light;
  }

  /* 4. Enable keyword interpolation for height/width transitions
        (animate to/from `auto`, `min-content`, etc.) — but only
        when the user hasn't asked for reduced motion. */
  @media (prefers-reduced-motion: no-preference) {
    :where(html) {
      interpolate-size: allow-keywords;
    }
  }

  /* 5. Body: comfortable line-height, smoother type rendering,
        use small-viewport units to dodge iOS URL-bar jumps. */
  :where(body) {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    min-block-size: 100svb;
  }

  /* 6. Media defaults — block-level, never overflow */
  :where(img, picture, video, canvas, svg) {
    display: block;
    max-inline-size: 100%;
    block-size: auto;
  }

  /* 7. Form controls inherit typography + color */
  :where(input, button, textarea, select) {
    font: inherit;
    color: inherit;
  }

  /* 8. Long words / URLs can't blow out their container */
  :where(p, h1, h2, h3, h4, h5, h6) {
    overflow-wrap: break-word;
  }

  /* 9. Smarter line wrapping (Safari 17.4+ / Chrome 117+) */
  :where(p) {
    text-wrap: pretty;
  }
  :where(h1, h2, h3, h4, h5, h6) {
    text-wrap: balance;
  }

  /* 10. Root stacking + isolation context */
  :where(#root, #__next) {
    isolation: isolate;
  }
}
