*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; min-height: 100vh; display: flex; flex-direction: column;
  background: var(--bg); color: var(--ink); font-family: var(--font-body);
  font-size: 16px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
body::before {
  content: ""; position: fixed; inset: 0; z-index: -2; pointer-events: none;
  background-image: radial-gradient(circle, rgba(46, 196, 182, .11) 2px, transparent 2px), radial-gradient(circle, rgba(79, 168, 255, .09) 2px, transparent 2px);
  background-size: 28px 28px, 42px 42px; background-position: 0 0, 14px 20px;
}
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse at 50% -8%, rgba(46, 196, 182, .10), transparent 62%);
}
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
:focus-visible { outline: 2px solid var(--accent-deep); outline-offset: 2px; border-radius: 6px; }