:root { color-scheme: light; font-family: system-ui, sans-serif; color: #183730; background: #f5f7f3; }
* { box-sizing: border-box; }
body { margin: 0; padding: 0 1.25rem 3rem; }
header { max-width: 62rem; margin: 0 auto; padding: 1.5rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem 2rem; flex-wrap: wrap; border-bottom: 1px solid #dce5da; }
.brand { font-weight: 700; text-decoration: none; }
nav { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem 1.5rem; }
nav form { margin: 0; }
.username { color: #516357; overflow-wrap: anywhere; }
main { max-width: 48rem; margin: clamp(2rem, 7vh, 5rem) auto; }
.panel { padding: clamp(1.5rem, 5vw, 3rem); background: white; border: 1px solid #dce5da; border-radius: 1rem; }
.label { margin: 0; color: #516357; font-size: .8rem; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; }
h1 { margin: .75rem 0 1rem; font-size: clamp(2rem, 6vw, 2.75rem); line-height: 1.15; letter-spacing: -.04em; overflow-wrap: anywhere; }
h2 { margin: 0 0 .75rem; font-size: 1.2rem; overflow-wrap: anywhere; }
p { line-height: 1.65; }
a { color: #1b5e43; text-underline-offset: .2em; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid #5a8545; outline-offset: 4px; }
button { font: inherit; cursor: pointer; }
.button { color: white; background: #1b5e43; border: 1px solid #1b5e43; border-radius: .5rem; padding: .7rem 1.15rem; font-weight: 650; }
.button:hover { background: #13452f; }
.signout { color: #1b5e43; background: transparent; border: 1px solid #b5c9b5; border-radius: .5rem; padding: .45rem .8rem; }
.intro { margin-bottom: 1.75rem; color: #516357; }
.organizations { margin: 0; padding: 0; list-style: none; display: grid; gap: 1rem; }
.organization { background: white; border: 1px solid #dce5da; border-radius: .8rem; padding: 1.5rem; }
.roles { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: .75rem 0 0; padding: 0; }
.roles li { border-radius: 2rem; padding: .35rem .75rem; background: #e8f1e4; font-size: .9rem; font-weight: 600; }
.muted { color: #516357; }
.note { margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid #e7ece3; font-size: .9rem; color: #516357; }
.field { margin: 1.25rem 0; }
label { display: block; font-weight: 650; margin-bottom: .5rem; }
input:not([type=hidden]) { display: block; width: 100%; max-width: 28rem; padding: .7rem .8rem; border: 1px solid #98ac9d; border-radius: .4rem; background: white; color: #183730; font: inherit; }
.errorlist { color: #922e24; padding-left: 1.25rem; line-height: 1.5; }
.errors { padding: .1rem 1rem; background: #fff1ed; border-left: 3px solid #b44533; }
.back { display: inline-block; margin-bottom: 1.5rem; }
textarea { display: block; width: 100%; resize: vertical; padding: .7rem .8rem; border: 1px solid #98ac9d; border-radius: .4rem; background: white; color: #183730; font: inherit; line-height: 1.5; }
select { width: 100%; max-width: 28rem; padding: .7rem .8rem; border: 1px solid #98ac9d; border-radius: .4rem; background: white; color: #183730; font: inherit; }
.help { margin: .4rem 0; font-size: .85rem; color: #516357; }
.notice { padding: .8rem 1rem; background: #e8f1e4; border-left: 3px solid #5a8545; }
.programs { margin-top: 2rem; }
.answers dt { font-weight: 650; margin-top: 1.25rem; }
.answers dd { margin: .4rem 0 1rem; line-height: 1.65; overflow-wrap: anywhere; }
.confirmation { display: flex; align-items: flex-start; gap: .75rem; margin: 1.5rem 0; }
.confirmation input[type=checkbox] { width: auto; margin-top: .25rem; }
