:root {
  --paper: #fdfcfc; --ink: #141210; --ink2: #2e2b28; --faint: #6b6560; --rule: rgba(20,18,16,.1);
  --orange: #ff7333; --magenta: #ff4d8c; --violet: #994dff;
}
@supports (color: color(display-p3 1 1 1)) {
  :root { --orange: color(display-p3 1 .45 .2); --magenta: color(display-p3 1 .3 .55); --violet: color(display-p3 .6 .3 1); }
}
* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.55 Inter, system-ui, -apple-system, sans-serif; -webkit-font-smoothing: antialiased; }
.glow { position: absolute; inset: 0 0 auto 0; height: 420px; z-index: -1; overflow: hidden; pointer-events: none; }
.glow::before { content: ""; position: absolute; inset: -40%; filter: blur(60px); opacity: .85;
  background:
    radial-gradient(40% 50% at 15% 30%, var(--orange), transparent 70%),
    radial-gradient(35% 45% at 60% 20%, var(--magenta), transparent 70%),
    radial-gradient(40% 55% at 90% 45%, var(--violet), transparent 70%);
  animation: drift 18s ease-in-out infinite alternate; }
.glow::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 30%, var(--paper)); }
@keyframes drift { to { transform: translate3d(6%, 4%, 0) rotate(8deg); } }
@media (prefers-reduced-motion: reduce) { .glow::before { animation: none; } }
main, header, footer { max-width: 680px; margin: 0 auto; padding: 0 16px; }
header { display: flex; justify-content: space-between; align-items: center; padding-top: 20px; }
header a { color: var(--ink); text-decoration: none; font-weight: 600; }
nav a { font-weight: 500; margin-left: 18px; color: var(--ink2); }
h1 { font-size: clamp(36px, 8vw, 56px); line-height: 1.05; letter-spacing: -.02em; margin: 120px 0 16px; }
h2 { font-size: 22px; letter-spacing: -.01em; margin: 40px 0 8px; }
p, li { color: var(--ink2); }
.lead { font-size: 20px; }
.small { font-size: 14px; color: var(--faint); }
a { color: #032b6e; }
ul { padding-left: 20px; }
footer { border-top: 1px solid var(--rule); margin-top: 64px; padding-top: 20px; padding-bottom: 40px; font-size: 14px; color: var(--faint); }
footer a { color: var(--faint); margin-right: 16px; }