:root { color-scheme:dark; font: 16px/1.5 system-ui,sans-serif; background:#101117; color:#f4f0f7 }
* { box-sizing:border-box } main { width:min(100% - 2rem,40rem); margin:2rem auto 4rem }
header { display:flex; justify-content:space-between; padding-bottom:1rem; border-bottom:1px solid #42404c }
header b, legend { color:#ffb5d5 } h1 { line-height:1.18; overflow-wrap:anywhere }
a { color:#ffc4df } label { display:block; font-weight:600; margin-bottom:.3rem }
input:not([type=checkbox]),select { width:100%; padding:.7rem; background:#202029; color:#fff; border:1px solid #827889; border-radius:.45rem; font:inherit }
input[type=checkbox] + label { display:inline } fieldset { margin:1.4rem 0; padding:1rem; border-radius:.6rem; border:1px solid #696174 }
legend { font-weight:700; padding:0 .35rem } audio { max-width:100% } .errorlist { color:#ffb6ad } li { margin:.45rem 0 }
button,.action { display:inline-block; font:inherit; font-weight:650; padding:.65rem 1.1rem; border:0; border-radius:.5rem; background:#ffc2dd; color:#221620; text-decoration:none; cursor:pointer }
button.secondary { background:#34303c; color:#fff } :focus-visible { outline:3px solid #d9d2ff; outline-offset:3px }