* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: grid; place-items: center; padding: 32px 24px; background: #111217; color: #f7f7fa; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", sans-serif; }
main { width: 100%; max-width: 400px; text-align: center; }
.logo { border-radius: 22px; display: block; margin: 0 auto 28px; }
.eyebrow { font-size: 12px; letter-spacing: 0.24em; color: #a6a8bb; margin-bottom: 14px; }
h1 { font-size: 26px; font-weight: 650; letter-spacing: -0.03em; margin: 0 0 14px; }
p { font-size: 15px; line-height: 1.7; color: #b4b6c6; margin: 0 0 26px; }
.button { display: inline-block; padding: 13px 28px; border-radius: 14px; background: #b7b3ff; color: #19172d; font-size: 15px; font-weight: 600; text-decoration: none; }
.button:focus-visible { outline: 3px solid #f7f7fa; outline-offset: 5px; }
[hidden] { display: none !important; }
.hint { margin: 28px 0 0; font-size: 13px; color: #9294a5; }
noscript { display: block; margin-top: 24px; line-height: 1.6; }
@media (prefers-color-scheme: light) { body { background: #f7f7fb; color: #20202b; } p { color: #5c5e70; } .eyebrow, .hint { color: #696b7c; } .button { background: #5750c7; color: white; } .button:focus-visible { outline-color: #20202b; } }