/*! Blanksheet v2.0.0 | MIT | spec: blanksheet.css */

/**
 * https://github.com/P233/blanksheet
 *
 * A CSS reset that gives humans and agents a blank sheet to start a project
 * on: each UA default in scope is blanked, normalized or kept as a documented
 * survivor. Fonts, system colors and native controls still vary by engine and
 * user settings.
 *
 *   [B] Blank      zeroed or inherited
 *   [N] Normalize  one shared policy where a blank is unsafe or engines
 *                  disagree; not identical pixels
 *   [S] Survivor   kept on purpose: internals | semantic | a11y | preference
 */

@layer reset {
  /* ==========================================================================
   * Box Model
   *
   * [N] border-box — the conventional box model.
   * ======================================================================== */

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

  /* ==========================================================================
   * Root & Body
   *
   * [B] body margin (UA 8px).
   * [N] -webkit-text-size-adjust — stops mobile text inflation. Safari reads
   *   only this name; Chromium and Firefox Android (49+) alias it.
   * [S:preference] html font and line-height, system colors, selection,
   *   forced-colors overrides — user channels.
   * [S:internals] scrollbars, spellcheck marks.
   * ======================================================================== */

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

  body {
    margin: 0;
  }

  /* ==========================================================================
   * Sections
   *
   * [B] h1–h6 margin and font-size — the level lives in the tag; the UA scale
   *   also differs by engine version since the 2025 spec change.
   * [S:semantic] heading bold — unstyled headings stay distinct from text.
   * Untouched: article, aside, header, footer, main, nav, section, hgroup.
   * ======================================================================== */

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    margin: 0;
    font-size: inherit;
  }

  /* ==========================================================================
   * Grouping Content
   *
   * [B] p, blockquote, figure, pre, hr, dl, dd margins.
   * [N] hr — engines draw the inset border and its color differently; one
   *   1px currentColor line on the block-start edge. Blank would hide it.
   * Untouched: figcaption, dt, div, search.
   * ======================================================================== */

  p,
  blockquote,
  figure,
  pre,
  hr,
  dl,
  dd {
    margin: 0;
  }

  hr {
    color: inherit;
    border: 0;
    border-block-start: 1px solid;
  }

  /* ==========================================================================
   * Text-level Semantics
   *
   * [S:semantic] inline defaults carry author meaning: a color and underline
   *   (W3C F73), strong/b weight, em/i/cite/dfn/var/address italic,
   *   u/ins/abbr underline, s/del strike, small size, mark colors (fixed
   *   yellow/black — mind dark themes), q quotes, code monospace.
   * [N] b, strong: bolder — older Blink/WebKit in the matrix use bold
   *   (light weights: 400 vs 700).
   * [N] pre, code, kbd, samp — a two-item family list stops the 13px
   *   monospace quirk. The quoted "monospace" is load-bearing: lightningcss
   *   dedupes a bare pair (lightningcss#1221).
   * [N] sub, sup — em offsets keep line height intact; size stays the UA's.
   * [S:internals] ruby, rt, rp — engines size and wrap annotations
   *   differently.
   * ======================================================================== */

  b,
  strong {
    font-weight: bolder;
  }

  pre,
  code,
  kbd,
  samp {
    font-family: monospace, "monospace";
  }

  sub,
  sup {
    position: relative;
    line-height: 0;
    vertical-align: baseline;
  }

  sub {
    bottom: -0.25em;
  }

  sup {
    top: -0.5em;
  }

  /* ==========================================================================
   * Lists
   *
   * [B] ul, ol, menu margin, padding and markers.
   * [N] list-style-type: "" rather than none — Safari drops list semantics
   *   for none. Supported across the matrix; older engines show markers.
   * ======================================================================== */

  ul,
  ol,
  menu {
    padding: 0;
    margin: 0;
    list-style-type: "";
  }

  /* ==========================================================================
   * Table
   *
   * [B] th, td padding; border-spacing (would resurface under separate).
   * [N] border-collapse: collapse.
   * [N] text-indent: 0, border-color: currentColor — Safari 15.4 leaks
   *   ancestor text-indent; Chrome 99 and Safari 15.4 paint gray borders.
   *   Not inherit, which imports an ancestor's border-color.
   * [S:semantic] th bold, th/caption centered.
   * ======================================================================== */

  table {
    text-indent: 0;
    border-spacing: 0;
    border-collapse: collapse;
    border-color: currentColor;
  }

  th,
  td {
    padding: 0;
  }

  /* ==========================================================================
   * Forms
   *
   * [B] padding, margin.
   * [B] font, color, letter- and word-spacing inherit — controls opt out of
   *   inheritance by UA design. text-transform inherits on label controls
   *   only: on a field the shown value would differ from the submitted one.
   *   text-align and text-indent keep UA values (centered button labels).
   * [B]+[N] native chrome off, replaced by a 1px currentColor frame —
   *   border/background use CSS-UI-4 devolution; native exceptions are below;
   *   the frame keeps empty fields and buttons recognizable. Unknown input
   *   types fall on the framed side of :not(). Padding is the author's.
   * [N] :disabled — color: inherit erases the UA grays while UA opacity dims
   *   differ (Chrome select 0.7, iOS 0.4): one GrayText signal, opacity 1.
   * [N] textarea vertical-align: bottom — the gap under it differs by engine.
   * [N] ::placeholder — UA grays differ; same color as the input text.
   *   Dimming is the author's call (and a contrast risk).
   * [N] ::file-selector-button font — its own UA font would win.
   * [N] search appearance: textfield — Safari 15.4 keeps the native search
   *   field under the frame (WebKit's isControlStyled skips search fields).
   * [B] fieldset border, padding, margin; min-inline-size: 0 (UA min-content
   *   blocks flex/grid shrinking). legend padding.
   *
   * [S:a11y] checkbox, radio — forced colors cannot restore a removed
   *   appearance. The disabled rule is inert on them (iOS pins opacity 1).
   * [S:a11y] focus indicators — retained; author replacements must stay
   *   visible (W3C F78).
   * [S:a11y] forced colors — the frame is a border the palette recolors.
   * [S:internals] range, color, date, time, datetime-local, month, week —
   *   engine-drawn; they revert color and disabled opacity so text stays
   *   paired with the native field. Keep this list in step with :not().
   * [S:internals] file, image — their text sits on the page and inherits
   *   color; the file button keeps native colors and text-transform (its
   *   label is engine text). Accepted: iOS no longer dims a disabled image.
   * [S:internals] select arrow — the picker cue. iOS Safari before 26 drops
   *   it once a background is set; macOS Safari keeps a rounded shape and
   *   ignores padding. Set appearance: none for a custom arrow, square
   *   corners or padding.
   * [S:internals] number spinners, search ✕, input[list] indicator,
   *   autofill, resize handle, listbox and popup option rendering (options
   *   inherit the select color; recolored pages without color-scheme must
   *   style them).
   * Untouched: form, label, output, datalist.
   * ======================================================================== */

  button,
  input,
  select,
  textarea {
    padding: 0;
    margin: 0;
    font: inherit;
    color: inherit;
    word-spacing: inherit;
    letter-spacing: inherit;
  }

  button:disabled,
  input:disabled,
  select:disabled,
  textarea:disabled {
    color: GrayText;
    opacity: 1;
  }

  input:is(
    [type="range"],
    [type="color"],
    [type="date"],
    [type="time"],
    [type="datetime-local"],
    [type="month"],
    [type="week"]
  ) {
    color: revert;
    opacity: revert;
  }

  button,
  select,
  textarea,
  input:not(
    [type="checkbox"],
    [type="radio"],
    [type="range"],
    [type="color"],
    [type="file"],
    [type="date"],
    [type="time"],
    [type="datetime-local"],
    [type="month"],
    [type="week"],
    [type="image"]
  ) {
    background: none;
    border: 1px solid;
    border-radius: 0;
  }

  button,
  select,
  input[type="button"],
  input[type="submit"],
  input[type="reset"] {
    text-transform: inherit;
  }

  textarea {
    vertical-align: bottom;
  }

  ::file-selector-button {
    font: inherit;
  }

  ::placeholder {
    color: inherit;
    opacity: 1;
  }

  input[type="search"] {
    appearance: textfield;
  }

  input[type="search"]::-webkit-search-decoration {
    appearance: none;
  }

  fieldset {
    min-inline-size: 0;
    padding: 0;
    margin: 0;
    border: 0;
  }

  legend {
    padding: 0;
  }

  /* ==========================================================================
   * Embedded / Media
   *
   * [N] vertical-align: bottom — closes the baseline gap; display stays
   *   inline, so [hidden] still works.
   * [B] iframe border.
   * [S:internals] meter, progress; svg overflow: hidden (clips to the
   *   viewBox — set visible per graphic).
   * Untouched: picture, source, map, area.
   * ======================================================================== */

  img,
  video,
  audio,
  canvas,
  svg,
  iframe,
  embed,
  object {
    vertical-align: bottom;
  }

  iframe {
    border: 0;
  }

  /* ==========================================================================
   * Interactive
   *
   * [N] dialog:modal max sizes: 100% — the UA calc((100% - 6px) - 2em) cap
   *   silently limits author sizes; 100% keeps long content scrollable.
   *   Modal only (non-modal has no UA max). Keep it a standalone rule:
   *   engines without :modal (Chrome < 105, FF < 103, Safari < 15.6) drop
   *   just this rule.
   * [S:internals] dialog panel, modal ::backdrop, positioning — an unstyled
   *   dialog stays readable and working.
   * [S:internals] summary triangle — the expand cue. To remove: list-style:
   *   none, plus ::-webkit-details-marker { display: none } for Safari < 18.4.
   * ======================================================================== */

  dialog:modal {
    max-inline-size: 100%;
    max-block-size: 100%;
  }
}
