:root { color-scheme: light dark; font: 1rem/1.5 system-ui, sans-serif; }
* { box-sizing: border-box; }
body { margin: 0; color: #18212c; background: #f3f5f8; }
header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding: 1rem 1.5rem; background: #fff; border-bottom: 1px solid #cbd2dc; }
header > a { font-size: 1.5rem; font-weight: 750; }
nav { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
main { max-width: 38rem; margin: 2rem auto; padding: 2rem; background: #fff; border: 1px solid #cbd2dc; border-radius: .75rem; }
h1 { font-size: 1.75rem; line-height: 1.25; margin-top: 0; hyphens: auto; overflow-wrap: break-word; }
a { color: #005da8; }
label { display: block; font-weight: 600; margin: 1rem 0; }
input, textarea, select { display: block; width: 100%; font: inherit; color: inherit; background: transparent; padding: .7rem; border: 1px solid #65758b; border-radius: .35rem; margin-top: .35rem; }
.check { display: flex; align-items: center; gap: .75rem; min-height: 44px; }
.check input { width: 1.25rem; height: 1.25rem; margin: 0; flex-shrink: 0; }
textarea, .identifier { font-family: ui-monospace, monospace; overflow-wrap: anywhere; }
textarea[readonly] { font-size: .8125rem; }
.qr { max-width: 100%; height: auto; background: #fff; }
.shared-description, .shared-details dd { overflow-wrap: anywhere; }
.shared-details dd { margin-left: 0; }
.shared-details dt { font-weight: 600; margin-top: 1rem; }
fieldset { min-width: 0; border: 1px solid #65758b; border-radius: .35rem; }
li { margin: 1rem 0; overflow-wrap: anywhere; }
button, .button { display: inline-block; font: inherit; font-weight: 600; padding: .7rem 1rem; border: 1px solid transparent; border-radius: .35rem; background: #005da8; color: #fff; cursor: pointer; text-decoration: none; min-height: 44px; }
button:hover, .button:hover { background: #00467e; }
:focus-visible { outline: 3px solid #914e00; outline-offset: 3px; }
.error { border-left: 4px solid #a11919; padding: .75rem; background: #fff0f0; color: #8f1717; }
@media (max-width: 42rem) { main { margin: 1rem; padding: 1.25rem; } header { padding: 1rem; } }
@media (prefers-color-scheme: dark) {
    body { color: #edf2f8; background: #111820; } header, main { background: #1c2733; border-color: #65758b; }
    a { color: #91caff; } button, .button { background: #005da8; color: #fff; }
    :focus-visible { outline-color: #ffbf69; } .error { background: #421c24; color: #ffd4d4; }
}