*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
html, body { height: 100%; margin: 0; }
body {
  background: var(--bg);
  color: var(--text);
  font: 400 15px/1.45 var(--font);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior: none;
  -webkit-tap-highlight-color: transparent;
}
body.np-open { overflow: hidden; }
h1, h2, h3, p, ol { margin: 0; padding: 0; }
ol { list-style: none; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; color: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.fatal { padding: 32px; text-align: center; color: var(--text-2); }
.icon { display: inline-flex; flex: none; }
.icon svg { display: block; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}