*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; overscroll-behavior: none; } /* no bounce or rubber band */
body {
  font-family: var(--font); font-size: 13.5px; color: var(--fg);
  background: var(--canvas); -webkit-font-smoothing: antialiased;
}
button, input, select, textarea { font: inherit; color: inherit; }
textarea { overscroll-behavior: none; } /* scrolls inside: no bounce either */
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin: 0; }
img { display: block; }

svg.ico {
  width: 16px; height: 16px; flex: none;
  stroke: currentColor; fill: none; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
}

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.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;
}