:root { font-family: system-ui, sans-serif; color: #183148; background: #edf3f7; color-scheme: light; }
body { margin: 0; padding: 2rem 1rem; }
main { max-width: 26rem; margin: 3vh auto; padding: 2rem; background: white; border-radius: 1rem; box-shadow: 0 4px 24px #18314814; }
.brand { font-weight: 750; color: #12675e; letter-spacing: .03em; }
h1 { font-size: 1.7rem; }
label { display: block; font-weight: 600; margin: 1.2rem 0; }
input { display: block; width: 100%; box-sizing: border-box; font: inherit; padding: .8rem; margin-top: .4rem; border: 1px solid #879bad; border-radius: .4rem; }
input:focus-visible, button:focus-visible, a:focus-visible { outline: 3px solid #2779be; outline-offset: 3px; }
button { font: inherit; width: 100%; border: 0; border-radius: .4rem; padding: .9rem; background: #12675e; color: white; cursor: pointer; margin: .4rem 0; }
button:disabled { opacity: .6; cursor: wait; }
#error { color: #a21b2e; }
.note { color: #526575; font-size: .85rem; margin-top: 2rem; }
#seed { display: block; overflow-wrap: anywhere; user-select: all; }
#qr { max-width: 100%; height: auto; }
a { color: #125ca0; }
[hidden] { display: none !important; }