.school-year-context { margin-block: var(--space-16); color: var(--color-text-strong); }
.school-year-row { display: flex; align-items: end; flex-wrap: wrap; gap: var(--space-16); }
.school-year-row > *, .school-year-form > * { min-width: 0; max-width: 100%; }
.school-year-context .form-field { margin: 0; }
.school-year-status { margin-block: var(--space-8); }
.school-year-status:empty { display: none; }
.school-year-dialog { width: min(48rem, calc(100% - 2rem)); max-height: calc(100dvh - 2rem); padding: 0;
  border: 1px solid var(--modal-shell-border-color); border-radius: var(--radius-md); background: var(--modal-shell-bg); color: var(--color-text-strong); }
.school-year-dialog[open] { display: flex; flex-direction: column; }
.school-year-dialog::backdrop { background: var(--modal-overlay-bg); }
.school-year-dialog > h2 { flex: none; margin: 0; padding: var(--space-20); background: var(--modal-strip-bg); color: var(--modal-strip-text); }
.school-year-dialog > .school-year-row { flex: none; padding: var(--space-20); }
.school-year-dialog-body { min-height: 0; overflow: auto; display: flex; flex-direction: column; align-items: start; gap: var(--space-16); padding: var(--space-20); }
.school-year-dialog-body > *, .school-year-form { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.school-year-dialog-body p { margin: 0; }
.school-year-form { display: flex; flex-direction: column; align-items: start; gap: var(--space-16); width: 100%; }
.school-year-form fieldset { margin: 0; border: 1px solid var(--color-base-200); border-radius: var(--radius-sm); padding: var(--space-16); display: grid; gap: var(--space-12); width: 100%; box-sizing: border-box; }
.school-year-check { display: flex; align-items: start; gap: var(--space-12); min-height: var(--ui-control-min-block-size); padding-block: var(--space-8); }
.school-year-check input { flex: none; }
.school-year-check span { min-width: 0; overflow-wrap: anywhere; }