* { box-sizing: border-box; }
html, body {
  height: 100%;
}
body {
  margin: 0;
  background: var(--c-bg);
  background-image:
    radial-gradient(1200px 600px at 85% -10%, rgba(37, 99, 235, 0.14), transparent 60%),
    radial-gradient(900px 500px at -10% 20%, rgba(56, 189, 248, 0.08), transparent 55%);
  background-attachment: fixed;
  color: var(--c-text);
  font-family: var(--font-sans);
  font-size: var(--fs-base);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p { margin: 0; }
button { font-family: inherit; }
a { color: inherit; text-decoration: none; }
::selection { background: rgba(56, 189, 248, 0.3); }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(148, 163, 184, 0.25);
  border-radius: var(--r-pill);
}
::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.4); }

.visually-hidden {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

[hidden] { display: none !important; }