:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #202124; background: #fff; font-size: 17px; line-height: 1.6; }
* { box-sizing: border-box; }
body { max-width: 780px; margin: 0 auto; padding: 0 20px; overflow-wrap: anywhere; }
header { padding: 28px 0 20px; border-bottom: 1px solid #ddd; }
.app-name { margin: 0 0 12px; font-weight: 600; }
nav { display: flex; flex-wrap: wrap; gap: 8px 24px; }
nav a { padding: 8px 0; }
a { color: #005ac1; text-underline-offset: 3px; }
a[aria-current="page"] { color: #202124; font-weight: 600; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid #005ac1; outline-offset: 3px; }
main { padding: 28px 0 40px; }
h1 { font-size: 2rem; line-height: 1.2; margin: 0 0 12px; }
h2 { font-size: 1.25rem; line-height: 1.35; margin: 30px 0 12px; }
p { margin: 0 0 16px; }
ul { padding-left: 24px; }
li { margin-bottom: 8px; }
.muted, .helper { color: #555; }
.helper { font-size: .875rem; margin: 8px 0 0; }
form { margin-top: 28px; }
.field { margin: 20px 0; }
label { display: block; margin-bottom: 8px; font-weight: 600; }
input, select, textarea, button { font: inherit; }
input, select, textarea { display: block; width: 100%; min-width: 0; min-height: 48px; padding: 10px 12px; border: 1px solid #777; border-radius: 5px; background: #fff; color: #202124; }
textarea { resize: vertical; }
fieldset { min-width: 0; padding: 16px; margin: 28px 0; border: 1px solid #ccc; }
legend { max-width: 100%; padding: 0 8px; font-weight: 600; }
fieldset .field:last-child { margin-bottom: 0; }
button { display: block; width: 100%; min-height: 48px; padding: 12px 20px; margin-top: 20px; border: 1px solid #005ac1; border-radius: 5px; background: #005ac1; color: #fff; font-weight: 600; cursor: pointer; }
button:disabled { opacity: .65; cursor: default; }
.field-error { color: #a11a1a; margin: 8px 0 0; }
[aria-invalid="true"] { border-color: #a11a1a; }
.notice { margin: 20px 0 0; padding: 16px; border: 1px solid #bbb; }
.notice.error { color: #8f1717; border-color: #a11a1a; }
.notice.success { color: #176134; border-color: #176134; }
[hidden] { display: none !important; }
footer { padding: 20px 0 36px; border-top: 1px solid #ddd; color: #555; font-size: .875rem; }
@media (max-width: 400px) { body { padding: 0 16px; } h1 { font-size: 1.8rem; } fieldset { padding: 12px; } }
@media print { header nav, form, footer { display: none; } body { max-width: none; } a { color: inherit; } }