:root { color-scheme: dark; font-family: Tahoma, Arial, sans-serif; background: #101722; color: #e9eef5; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
main { width: min(100%, 480px); background: #192333; border: 1px solid #32435a; border-radius: 18px; padding: 32px; }
h1 { font-size: 23px; line-height: 1.9; margin: 10px 0; }
.eyebrow { color: #96c4e4; font-size: 14px; }
.intro, noscript { color: #c4cedb; line-height: 1.9; font-size: 14px; }
form { display: grid; gap: 12px; margin-top: 24px; }
label { font-size: 14px; }
input, button { font: inherit; font-size: 16px; min-height: 46px; width: 100%; border-radius: 8px; }
input { background: #101722; color: inherit; border: 1px solid #62758d; padding: 10px 12px; }
button { margin-top: 8px; background: #8fc9ed; color: #101722; border: 0; cursor: pointer; font-weight: bold; }
button:disabled { opacity: .6; cursor: wait; }
:focus-visible { outline: 3px solid #f3ba69; outline-offset: 3px; }
#status { min-height: 24px; color: #ffd19b; line-height: 1.8; font-size: 14px; overflow-wrap: anywhere; }
@media (max-width: 390px) { main { padding: 22px; } h1 { font-size: 20px; } }