.school-registration-page { max-width: 46rem; }
.home-dialog.school-registration-dialog { padding: 2rem; max-height: calc(100dvh - 2rem); }
.school-registration-dialog .home-eyebrow { margin: 0 3rem .65rem 0; }
.school-registration-dialog h2 { margin-bottom: .75rem; font-size: clamp(1.85rem, 3vw, 2.4rem); }
.school-registration-dialog > p:not(.home-eyebrow) { margin-bottom: 1rem; }
/* Hide the invitation only after a successful registration, including a native POST. */
.school-registration-dialog:has(> .school-dod > .school-dod__fields[hidden]) > h2 + p,
.school-registration-page:has(> .school-dod > .school-dod__fields[hidden], > .school-dod__status) > .content-page__head > h1 + p {
    display: none;
}
.school-registration-dialog .school-dod__fields { row-gap: .8rem; }
.school-registration-dialog .school-dod :is(label, legend) { margin-bottom: .3rem; }
:is(.school-registration-dialog, .school-dod-date__options, .school-dod textarea) { scrollbar-width: thin; scrollbar-color: #80678f var(--color-card); }
@media (min-width: 600px) and (max-height: 800px) {
    .home-dialog.school-registration-dialog { padding-block: 1rem; }
    .school-registration-dialog .school-dod__fields { row-gap: .6rem; }
}
@media (min-width: 600px) and (max-height: 740px) {
    .school-registration-dialog h2 { margin-bottom: .5rem; }
    .school-registration-dialog > p:not(.home-eyebrow) { margin-bottom: .5rem; }
    .school-registration-dialog .school-dod__fields { row-gap: .35rem; }
    .school-registration-dialog .school-dod :is(label, legend) { margin-bottom: .2rem; }
}
@media (max-width: 599px) { .home-dialog.school-registration-dialog { padding: 1.5rem; } }
.school-dod__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }
.school-dod__fields[hidden] { display: none; }
.school-dod__field, .school-dod__privacy, .school-dod__required, .school-dod button[type="submit"] { grid-column: 1 / -1; }
.school-dod__field--email, .school-dod__field--phone { grid-column: auto; }
.school-dod label, .school-dod legend { display: block; margin-bottom: .45rem; font-size: .9rem; font-weight: 650; }
.school-dod input:not([type="radio"]), .school-dod textarea, .school-dod-date__toggle { width: 100%; min-height: 2.8rem; border: 1px solid var(--color-control-border); border-radius: .6rem; background: var(--color-card); color: var(--color-paper); padding: .65rem .8rem; font: inherit; }
.school-dod-date { margin: 0; padding: 0; border: 0; min-width: 0; }
.school-dod-date__control { position: relative; }
.school-dod-date[data-enhanced] .school-dod-date__options { position: absolute; z-index: 5; inset-inline: 0; top: calc(100% + .5rem); margin: 0; max-height: var(--date-space, 16rem); overflow-y: auto; overscroll-behavior: contain; box-shadow: 0 .6rem 1.5rem #0006; }
.school-dod-date[data-enhanced][data-direction="up"] .school-dod-date__options { top: auto; bottom: calc(100% + .5rem); }
.school-dod__phone { display: flex; gap: .5rem; min-width: 0; }
.school-dod__country { display: flex; align-items: center; flex: 0 0 5.4rem; border: 1px solid var(--color-control-border); border-radius: .6rem; background: var(--color-card); padding-left: .65rem; }
.school-dod .school-dod__country input { min-width: 0; border: 0; padding-inline: .25rem .4rem; background: transparent; }
.school-dod__phone > input { min-width: 0; flex: 1; }
.school-dod__country:has([aria-invalid="true"]) { border-color: #ffa5b1; }
.school-dod-date__toggle { display: flex; align-items: center; justify-content: space-between; gap: 1rem; text-align: left; line-height: 1.5; cursor: pointer; }
.school-dod-date__toggle span, .school-dod-date__option span { min-width: 0; overflow-wrap: anywhere; }
.school-dod-date__toggle::after { content: ''; width: .45rem; height: .45rem; flex-shrink: 0; margin-right: .2rem; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.school-dod-date__toggle[aria-expanded="true"]::after { transform: rotate(225deg); }
.school-dod-date__toggle:hover, .school-dod-date__toggle[aria-expanded="true"] { border-color: var(--color-brand-text); }
.school-dod-date__options { display: grid; gap: .25rem; margin-top: .5rem; padding: .35rem; border: 1px solid var(--color-control-border); border-radius: .75rem; background: var(--color-card); }
.school-dod-date__toggle[hidden], .school-dod-date__options[hidden] { display: none; }
.school-dod .school-dod-date__option { display: flex; align-items: flex-start; gap: .7rem; min-height: 2.8rem; margin: 0; padding: .7rem; border: 1px solid transparent; border-radius: .45rem; font-size: .95rem; font-weight: 400; line-height: 1.5; cursor: pointer; }
.school-dod-date__option:hover { background: var(--color-surface); }
.school-dod-date__option:has(input:checked) { border-color: var(--color-brand-text); background: var(--color-surface); }
.school-dod-date__option:has(input:focus-visible) { outline: 2px solid var(--color-focus); outline-offset: -2px; }
.school-dod-date input[type="radio"] { width: 1rem; height: 1rem; flex-shrink: 0; margin: .2rem 0 0; accent-color: var(--color-brand-text); }
.school-dod textarea { resize: vertical; field-sizing: content; }
.school-dod textarea[data-autosize] { resize: none; overflow-y: hidden; }
.school-dod :is(input, textarea, button):focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.school-dod__country:has(input:focus-visible) { outline: 3px solid var(--color-focus); outline-offset: 3px; }
.school-dod .school-dod__country input:focus-visible { outline: none; }
.school-dod [aria-invalid="true"] { border-color: #ffa5b1; }
.school-dod__error { display: block; color: #ffc0c9; font-size: .85rem; margin-top: .3rem; }
.school-dod__error:empty, .school-dod__status:empty { display: none; }
.school-dod__status { margin-block: 1rem; padding: 1rem; border: 1px solid #c5a3dd; border-radius: .6rem; }
.school-dod__privacy, .school-dod__required { font-size: .85rem; line-height: 1.6; margin: 0 !important; }
.school-dod__privacy a { text-decoration: underline; text-underline-offset: .2em; color: #e7c7fc; }
.school-dod button:disabled { opacity: .65; cursor: wait; }
.school-dod__trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 420px) { .school-dod__field--email, .school-dod__field--phone { grid-column: 1 / -1; } }