:root { color-scheme: light dark; font-family: system-ui, sans-serif; background: #fff8f2; color: #233936; }
body { margin: 0; min-height: 100svh; display: grid; place-items: center; }
main { box-sizing: border-box; width: min(100%, 38rem); padding: 3rem 1.5rem; }
.brand { color: #356e63; font-weight: 750; letter-spacing: .04em; }
h1 { font-size: clamp(2rem, 6vw, 3rem); line-height: 1.15; letter-spacing: -.035em; }
p { line-height: 1.7; font-size: 1.1rem; }
.note { font-size: .95rem; color: #50645f; }
@media (prefers-color-scheme: dark) {
  :root { background: #122321; color: #eff7f3; }
  .brand { color: #a8d6c8; }
  .note { color: #b9cbc5; }
}