* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  color: var(--text-main);
  background: linear-gradient(120deg, var(--bg-1), var(--bg-2) 50%, var(--bg-3));
  font: 16px/1.6 var(--font-ui);
  overflow-wrap: anywhere;
}
button, input, textarea, select { font: inherit; }
a { color: var(--accent-strong); text-underline-offset: .2em; }
:where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 4px;
}
[hidden] { display: none !important; }
@media (forced-colors: active) {
  body { background: Canvas; color: CanvasText; }
}