.student-academic-year {
  box-sizing: border-box;
  width: min(680px, calc(100vw - 24px));
  max-height: calc(100dvh - 24px);
  margin: auto;
  padding: clamp(24px, 5vw, 48px);
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 2px solid var(--color-accent);
  border-radius: 24px;
  background: var(--color-surface);
  color: var(--color-text);
  box-shadow: 0 28px 80px rgb(10 32 33 / 30%);
  z-index: 11010;
}
.student-academic-year::backdrop { background: color-mix(in srgb, var(--color-bg) 86%, #102b2c 14%); }
.student-academic-year__eyebrow { color: var(--color-accent); font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.student-academic-year h1 { margin: 14px 0 18px; font-size: clamp(1.7rem, 5vw, 2.35rem); line-height: 1.18; }
.student-academic-year p { font-size: 1rem; line-height: 1.6; }
.student-academic-year [data-year-selection], .student-academic-year [data-year-confirmation] { display: grid; gap: 14px; margin-top: 28px; }
.student-academic-year select { width: 100%; box-sizing: border-box; min-height: 48px; padding: 10px 12px; font-size: 16px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface-2); color: var(--color-text); }
.student-academic-year .btn { min-height: 48px; white-space: normal; width: 100%; margin-top: 6px; }
.student-academic-year [hidden] { display: none !important; }
.student-academic-year :focus-visible { outline: 3px solid var(--color-accent); outline-offset: 4px; }
.student-academic-year .student-auth-error { color: var(--color-text); }
.student-academic-year-setting { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.student-academic-year-setting [role=status] { flex: 1 1 100%; font-size: .8rem; }
.student-academic-year-setting[hidden] { display: none; }