.volunteer-page { padding-top: 26px; }
.volunteer-section,.volunteer-existing{scroll-margin-top:130px}
.volunteer-page [hidden] { display: none !important; }
.volunteer-intro { padding-block: 12px 28px; }
.volunteer-kicker { margin: 28px 0 10px; color: var(--study-accent); font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.volunteer-intro h1 { max-width: 830px; margin: 0; color: var(--study-ink); font-size: clamp(1.85rem, 4vw, 3.2rem); line-height: 1.18; letter-spacing: -.035em; }
.volunteer-lead { max-width: 740px; margin: 18px 0; line-height: 1.75; }
.volunteer-priority { display: flex; gap: 14px; max-width: 880px; padding: 17px 19px; border: 1px solid color-mix(in srgb, var(--study-accent) 30%, var(--study-line)); border-radius: 16px; background: color-mix(in srgb, var(--study-accent) 7%, var(--study-surface)); }
.volunteer-priority > span { color: var(--study-accent); font-size: 30px; }
.volunteer-priority p { display: grid; gap: 4px; margin: 0; font-size: .85rem; line-height: 1.6; }
.volunteer-priority strong { color: var(--study-ink); }
.volunteer-unpaid { max-width: 880px; margin: 14px 0 0; font-size: .8rem; line-height: 1.7; }
.volunteer-layout { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 28px; align-items: start; }
.volunteer-account, .volunteer-existing, .volunteer-section, .volunteer-aside > div { margin: 0 0 22px; border: 1px solid var(--study-line); border-radius: 20px; background: var(--study-surface); padding: 24px; min-width: 0; }
.volunteer-account h2, .volunteer-existing h2 { margin: 0 0 10px; font-size: 1rem; color: var(--study-ink); }
.volunteer-account p, .volunteer-existing p { font-size: .84rem; line-height: 1.7; overflow-wrap: anywhere; }
.volunteer-inline-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.volunteer-inline-actions > * { min-height: 42px; font-size: .75rem; padding: 9px 12px; }
.volunteer-section legend { padding-inline: 8px; color: var(--study-ink); font-size: 1rem; font-weight: 800; }
.volunteer-section legend > span:first-child { color: var(--study-accent); margin-inline-end: 7px; font-size: .77rem; }
.volunteer-section > p, .volunteer-branch > p { margin: 4px 0 20px; font-size: .8rem; line-height: 1.6; }
.volunteer-roles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.volunteer-role { position: relative; display: flex; align-items: flex-start; gap: 10px; border: 1px solid var(--study-line); border-radius: 14px; padding: 16px; cursor: pointer; min-width: 0; }
.volunteer-role:has(input:checked) { border-color: var(--study-accent); background: color-mix(in srgb, var(--study-accent) 7%, var(--study-surface)); }
.volunteer-role > span { display: grid; gap: 5px; min-width: 0; }
.volunteer-role .material-symbols-outlined { color: var(--study-accent); font-size: 25px; }
.volunteer-role strong { color: var(--study-ink); font-size: .84rem; }
.volunteer-role small { line-height: 1.55; font-size: .72rem; }
.volunteer-page input[type="checkbox"] { flex: 0 0 auto; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--study-accent); cursor: pointer; }
.volunteer-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 19px 18px; }
.volunteer-fields > label, .volunteer-branch > label { display: grid; align-content: start; gap: 8px; font-size: .8rem; }
.volunteer-fields > div > span { font-size: .8rem; }
.volunteer-fields label > span, .volunteer-branch label > span { color: var(--study-ink); font-weight: 650; }
.volunteer-fields input, .volunteer-fields select, .volunteer-fields textarea, .volunteer-branch input, .volunteer-branch textarea, .volunteer-admin-controls select, .volunteer-review-form textarea, .volunteer-review-form select { width: 100%; min-width: 0; min-height: 46px; border: 1px solid var(--study-line); border-radius: 10px; background: var(--study-surface-soft); color: var(--study-ink); padding: 11px 12px; font: inherit; line-height: 1.5; }
.volunteer-fields input[readonly] { opacity: .75; }
.volunteer-page textarea { resize: vertical; }
.volunteer-page :is(input, select, textarea, button, a):focus-visible { outline: 3px solid color-mix(in srgb, var(--study-accent) 60%, transparent); outline-offset: 3px; }
.volunteer-fields small, .volunteer-fineprint { color: var(--study-copy); font-size: .72rem; line-height: 1.65; }
.volunteer-wide { grid-column: 1 / -1; }
.volunteer-checks { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 13px; }
.volunteer-checks label { display: flex; gap: 7px; font-size: .8rem; }
.volunteer-branch { display: grid; gap: 18px; margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--study-line); }
.volunteer-branch h3 { color: var(--study-ink); font-size: .95rem; margin: 0; }
.volunteer-branch > p { margin: 0; }
.volunteer-agreements { display: grid; gap: 17px; }
.volunteer-agreements > label { display: flex; gap: 11px; font-size: .79rem; line-height: 1.7; }
.volunteer-submit { margin: 6px 0 30px; }
.volunteer-submit > button { width: 100%; min-height: 50px; justify-content: center; }
.volunteer-page button:disabled { opacity: .6; cursor: not-allowed; }
#volunteer-submit-status { font-size: .85rem; line-height: 1.6; overflow-wrap: anywhere; }
#volunteer-submit-status[data-type="error"] { color: #dc2626; }
#volunteer-submit-status[data-type="success"] { color: #16813a; }
.volunteer-aside { position: sticky; top: 100px; }
.volunteer-aside .material-symbols-outlined { color: var(--study-accent); font-size: 35px; }
.volunteer-aside h2 { color: var(--study-ink); font-size: 1.1rem; margin: 14px 0 12px; }
.volunteer-aside p, .volunteer-aside li { font-size: .8rem; line-height: 1.7; }
.volunteer-aside ol { display: grid; gap: 14px; padding-inline-start: 20px; margin-block: 22px; }
.volunteer-aside a { font-size: .78rem; }
.volunteer-admin-controls { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.volunteer-admin-controls label { display: grid; gap: 6px; font-size: .8rem; }
.volunteer-admin-list { display: grid; gap: 20px; }
.volunteer-admin-card { border: 1px solid var(--study-line); border-radius: 18px; background: var(--study-surface); padding: 22px; min-width: 0; }
.volunteer-admin-card h2 { margin: 0 0 12px; color: var(--study-ink); font-size: 1.1rem; }
.volunteer-admin-card p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .82rem; line-height: 1.7; }
.volunteer-admin-card dl { display: grid; grid-template-columns: 155px minmax(0, 1fr); gap: 9px 16px; font-size: .8rem; }
.volunteer-admin-card dt { font-weight: 700; color: var(--study-ink); }.volunteer-admin-card dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.volunteer-review-form { display: grid; gap: 14px; margin-top: 22px; border-top: 1px solid var(--study-line); padding-top: 20px; }.volunteer-review-form > label { display: grid; gap: 7px; font-size: .8rem; }
[data-theme="dark"] #volunteer-submit-status[data-type="success"] { color: #6ee7b7; }
[data-theme="dark"] #volunteer-submit-status[data-type="error"] { color: #fca5a5; }
@media (max-width: 900px) { .volunteer-layout { grid-template-columns: minmax(0, 1fr); }.volunteer-aside { position: static; } }
@media (max-width: 560px) { .volunteer-page { padding-top: 12px; }.volunteer-intro { padding-bottom: 20px; }.volunteer-account, .volunteer-existing, .volunteer-section, .volunteer-aside > div { padding: 19px 16px; border-radius: 16px; }.volunteer-section legend { font-size: .91rem; }.volunteer-roles, .volunteer-fields { grid-template-columns: minmax(0, 1fr); }.volunteer-role { padding: 14px; }.volunteer-wide { grid-column: auto; }.volunteer-admin-card dl { grid-template-columns: minmax(0, 1fr); gap: 5px; }.volunteer-admin-card dd { margin-bottom: 10px; } }