:root { color-scheme: dark; font-family: system-ui, sans-serif; background: #101817; color: #eff5ee; }
* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(100% - 2.5rem, 720px); margin: 8vh auto; }
.eyebrow { letter-spacing: .18em; font-size: .75rem; color: #b5d7aa; }
h1 { font-size: clamp(2.2rem, 6vw, 3.5rem); line-height: 1.1; letter-spacing: -.04em; }
.intro, section p, footer { color: #b7c4bd; line-height: 1.65; }
section { margin-top: 3rem; padding: 1.5rem; border: 1px solid #35443c; border-radius: 1rem; background: #17221d; }
h2 { margin-top: 0; }
label { display: block; font-size: .9rem; margin: 1.5rem 0 .5rem; }
input { width: 100%; border: 1px solid #65756b; border-radius: .5rem; padding: .85rem; background: #101817; color: inherit; font: inherit; }
button, .open { display: inline-block; border: 0; border-radius: .5rem; padding: .8rem 1rem; margin-top: .8rem; background: #c4e6a8; color: #132019; font: inherit; cursor: pointer; text-decoration: none; }
button:focus-visible, input:focus-visible, a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
#forget-browser { background: transparent; color: #b7c4bd; text-decoration: underline; }
[hidden] { display: none !important; }
footer { margin-top: 1.5rem; font-size: .8rem; }