/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; }
body {
  position: relative;
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow-x: hidden; overflow-x: clip;
  font-family: "Inter Tight", system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--ink);
  background-color: var(--bg);
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: var(--u) var(--u);
  background-position: var(--gx, 0px) var(--gy, 0px);
}
body.is-locked { height: 100vh; height: 100dvh; overflow: hidden; }
body.menu-open { overflow: hidden; }
/* No scroll anchoring: the grid layout settles after load, and Chrome must not move a refreshed page (or one opened
   fresh) away from where it was, e.g. down to the footer. */
html { overflow-anchor: none; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.mono { font-family: "JetBrains Mono", ui-monospace, monospace; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 10px 14px; background: var(--ink); color: var(--bg); text-decoration: none; }
.skip:focus { top: 16px; }