:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#101b31;color:#f3f5fa}*{box-sizing:border-box}body{margin:0;padding:24px}header{max-width:480px;margin:24px auto;font-size:24px;font-weight:700}small{display:block;font-size:13px;color:#b7c3d9}main{max-width:480px;margin:0 auto;background:#1a2942;border:1px solid #455570;border-radius:16px;padding:28px}h1{font-size:27px}label{display:block;margin:18px 0}input{display:block;width:100%;padding:13px;margin-top:8px;background:#101b31;color:white;border:1px solid #8595ae;border-radius:6px;font:inherit}button{padding:13px 18px;border:0;border-radius:6px;background:#e1cb91;color:#172239;font:inherit;cursor:pointer}button:disabled{opacity:.5}nav{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px;align-items:center}a{color:#d6e4ff}p{line-height:1.5}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #e1cb91;outline-offset:3px}

main>button{margin:8px 8px 8px 0}input[type=checkbox]{display:inline-block;width:22px;height:22px;vertical-align:middle;margin:0 12px 0 0}pre{font:inherit;line-height:1.6;overflow-wrap:anywhere}