:root { color-scheme: dark; font-family: system-ui, sans-serif; background: #0b1020; color: #f8fafc; }
*, *::before, *::after { box-sizing: border-box; }
body { min-height: 100vh; display: grid; place-items: center; margin: 0; padding: 1rem; }
main { width: min(100%, 380px); padding: 2rem; border: 1px solid #273453; border-radius: 20px; background: #121a2f; box-shadow: 0 20px 60px #0008; }
.eyebrow { margin: 0; color: #a5b4fc; font-size: .75rem; letter-spacing: .12em; }
h1 { margin: .45rem 0; font-size: 2.1rem; }
p { color: #cbd5e1; line-height: 1.5; }
button, input { box-sizing: border-box; width: 100%; border-radius: 10px; padding: .85rem 1rem; font: inherit; }
button { border: 0; background: #818cf8; color: #111827; font-weight: 750; cursor: pointer; }
button:disabled { opacity: .55; cursor: wait; }
details { margin-top: 1.5rem; color: #cbd5e1; }
form { display: grid; gap: .75rem; margin-top: 1rem; }
input { border: 1px solid #475569; background: #0f172a; color: inherit; }
label { font-size: .9rem; }
section { margin-top: 1.5rem; }
h2 { font-size: 1.1rem; margin-top: 1.75rem; }
ul { padding-left: 1.2rem; color: #cbd5e1; }
li { margin: .7rem 0; }
.secondary { width: auto; padding: .35rem .65rem; font-size: .8rem; background: #475569; color: #f8fafc; }
.danger { width: auto; padding: .35rem .65rem; font-size: .8rem; background: #b91c1c; color: #fff; }
