*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
/* only body gets a background (never html) so the fixed #bg-root layer at z-index:-1 stays visible */
body {
  background: var(--bg); color: var(--ink);
  font-family: var(--font-display); font-size: 20px; line-height: var(--lh);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  transition: background-color 420ms, color 420ms;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
button:focus-visible, a:focus-visible { outline: 2px dashed var(--ink); outline-offset: 3px; }
.mono { font-family: var(--font-mono); font-size: 12px; letter-spacing: .04em; color: var(--ink-dim); }
.hidden { display: none !important; }
a.u { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .25s; }
a.u:hover, a.u.active { background-size: 100% 1px; }
::selection { background: var(--ink); color: var(--bg); }
/* Indic text: no letter-spacing tweaks, keep conjuncts intact */
html:not([lang="en"]) body { letter-spacing: 0; font-kerning: normal; font-feature-settings: "kern", "liga", "clig"; }