:root { color-scheme: dark; }
* { box-sizing: border-box; }
body { background: #08080a; color: #f3f0e8; margin: 0; font: 1.06rem/1.55 system-ui, sans-serif; }
main, header { width: min(660px, calc(100% - 38px)); margin: auto; }
header { border-bottom: 1px solid #4b4843; padding: 1.4rem 0; color: #e7e2d4; font: bold .78rem ui-monospace, monospace; letter-spacing: .13em; text-transform: uppercase; }
main { padding: 2.6rem 0; }
h1 { font-size: clamp(2.5rem, 7vw, 4.1rem); letter-spacing: -.05em; line-height: 1.03; margin: .6rem 0 1rem; }
p { max-width: 53ch; color: #c7c3b9; }
a { color: inherit; text-underline-offset: .2em; }
.buttons { display: flex; flex-wrap: wrap; gap: .8rem; }
button { font: inherit; font-weight: 700; min-height: 48px; padding: .65rem 1.1rem; border: 0; border-radius: 2rem; background: #e7e2d4; color: #08080a; cursor: pointer; }
button:disabled { opacity: .6; cursor: default; }
:focus-visible { outline: 2px solid #e7e2d4; outline-offset: 4px; }
aside { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid #4b4843; }