.academic-panel { padding: 24px; }
.academic-view-student .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.academic-panel h2, .academic-panel h3, .academic-drawer h2, .academic-drawer h3 { margin-top: 0; }
.academic-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.academic-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: end; margin: 20px 0; }
.academic-filters label, .academic-term-fields label, .academic-score-editor label { display: flex; flex-direction: column; gap: 7px; min-width: 0; font-weight: 600; }
.academic-panel input, .academic-panel select, .academic-drawer input, .academic-drawer select { min-width: 0; width: 100%; min-height: 46px; box-sizing: border-box; }
.academic-panel button, .academic-drawer button, .academic-file-button { min-height: 46px; white-space: normal; line-height: 1.4; }
.academic-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.academic-message { padding: 12px 14px; background: #eff6ff; color: #154677; border-radius: 10px; line-height: 1.7; }
.academic-message[hidden], .academic-drawer [hidden], .academic-panel [hidden] { display: none !important; }
.academic-error { padding: 14px; background: #fff1f0; border: 1px solid #eaa39b; border-radius: 10px; color: #8c2521; line-height: 1.8; overflow-wrap: anywhere; }
.academic-warning { color: #825600; font-size: 0.88rem; }
.academic-table { width: 100%; table-layout: fixed; border-collapse: collapse; }
.academic-table th, .academic-table td { text-align: left; vertical-align: top; padding: 14px 9px; border-bottom: 1px solid #e3e9f0; overflow-wrap: anywhere; }
.academic-table th { background: #f2f6fa; font-weight: 700; }
.academic-table th:first-child { width: 18%; }
.academic-table th:last-child { width: 76px; }
.academic-table small { display: block; color: #5d6b80; margin-top: 5px; }
.academic-status { display: inline-block; border-radius: 999px; padding: 4px 10px; color: #78530a; background: #fff4d6; font-size: .85rem; white-space: nowrap; }
.academic-status.is-complete { background: #e4f5eb; color: #23613e; }
.academic-mobile-list { display: none; }
.academic-student-card { padding: 18px; border: 1px solid #d8e2ed; border-radius: 14px; background: #fff; }
.academic-student-card h3 { margin: 0; font-size: 1.15rem; }
.academic-score-list { margin: 12px 0; }
.academic-score-list > div { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid #e9edf3; }
.academic-score-list dt { font-weight: 600; }
.academic-score-list dd { margin: 0; overflow-wrap: anywhere; }
.academic-score-list dd small { display: block; margin-top: 5px; }
.academic-file-button { position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; padding: 12px 18px; background: #175bb5; color: #fff; font-weight: 600; cursor: pointer; box-sizing: border-box; overflow: hidden; }
.academic-file-button input[type=file] { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.academic-file-button:focus-within { outline: 3px solid #6bacff; outline-offset: 3px; }
.academic-file-button:has(input:disabled) { opacity: .55; cursor: wait; }
.academic-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 22px 0; }
.academic-summary > div { background: #f1f5fa; padding: 14px 8px; border-radius: 10px; text-align: center; }
.academic-summary strong { display: block; font-size: 1.55rem; color: #194d86; }
.academic-summary span { display: block; font-size: .9rem; margin-top: 3px; }
.academic-change-list { max-height: 370px; overflow: auto; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; margin: 14px 0; }
.academic-change-list article { border: 1px solid #d8e2ed; padding: 12px; border-radius: 10px; overflow-wrap: anywhere; }
.academic-change-list p { margin-bottom: 0; line-height: 1.7; }
.academic-change-action { display: block; margin-top: 6px; color: #496784; font-size: .9rem; }
.academic-confirm-updates { display: flex; align-items: center; gap: 12px; padding: 14px; background: #fff4d6; border-radius: 10px; margin: 16px 0; line-height: 1.7; }
.academic-confirm-updates input { width: 22px; min-height: 22px; flex-shrink: 0; }
.academic-drawer { margin: 0 0 0 auto; padding: 0; width: min(820px, 92vw); max-width: 100vw; height: 100dvh; max-height: 100dvh; border: none; border-radius: 18px 0 0 18px; color: #23344e; background: #f6f8fc; box-shadow: -12px 0 60px #14223833; }
.academic-drawer[open] { display: flex; flex-direction: column; }
.academic-drawer::backdrop { background: #15233888; }
.academic-drawer-open { overflow: hidden; }
.academic-drawer-header { flex: 0 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 24px; border-bottom: 1px solid #dae2ed; background: #fff; }
.academic-drawer-header h2 { margin: 0; font-size: 1.3rem; }
.academic-drawer-header .hint { margin: 0 0 4px; }
.academic-drawer-header button { flex-shrink: 0; }
.academic-drawer-body { overflow-y: auto; padding: 24px; flex: 1; overscroll-behavior: contain; }
.academic-term-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.academic-context { color: #53647a; margin: 16px 0; }
.academic-record-section { margin: 20px 0; background: #fff; border: 1px solid #dce5ef; padding: 20px; border-radius: 14px; }
.academic-record-section .academic-heading { align-items: flex-start; }
.academic-record-section .academic-heading h3 { padding-top: 8px; margin-bottom: 0; }
#academic-grade-editor:empty { display: none; }
#academic-grade-editor { scroll-margin-top: 12px; padding: 20px; margin: 20px 0; background: #fff; border: 2px solid #6a9bd0; border-radius: 14px; }
.academic-score-editor { border: 1px solid #d9e3f0; border-radius: 10px; margin: 16px 0; padding: 16px; display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 14px; }
.academic-score-editor legend { padding: 0 8px; font-weight: 700; font-size: 1.05rem; }
.academic-score-editor [data-paper-label] { grid-column: 1 / -1; }
.academic-attachment-choices { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.academic-attachment-upload { background: #edf4fc; padding: 16px; border-radius: 12px; margin-top: 16px; }
.academic-attachment-list { list-style: none; padding: 0; margin: 16px 0 0; }
.academic-attachment-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 0; border-bottom: 1px solid #e4ebf3; }
.academic-attachment-list span { display: block; overflow-wrap: anywhere; margin-top: 5px; }
.academic-attachment-list li > div:first-child { min-width: 0; }
.academic-attachment-list .academic-actions { flex-shrink: 0; }
#academic-attachment-preview iframe { width: 100%; height: 60vh; border: 1px solid #ced8e4; background: #fff; }
#academic-attachment-preview img { display: block; max-width: 100%; height: auto; }
@media (max-width: 1100px) { .academic-desktop-list { display: none; } .academic-mobile-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; } }
@media (max-width: 600px) {
  .academic-panel { padding: 16px; }
  .academic-filters { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .academic-filters > button { grid-column: 1 / -1; }
  .academic-mobile-list { grid-template-columns: minmax(0,1fr); }
  .academic-student-card > button { width: 100%; }
  .academic-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .academic-change-list { grid-template-columns: minmax(0,1fr); }
  .academic-drawer { width: 100vw; border-radius: 0; }
  .academic-drawer-header, .academic-drawer-body { padding: 16px; }
  .academic-record-section { padding: 16px; }
  .academic-record-section .academic-heading { flex-wrap: wrap; }
  .academic-score-editor { grid-template-columns: minmax(0,1fr); padding: 12px; }
  .academic-attachment-choices { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .academic-attachment-list li { flex-direction: column; align-items: stretch; }
  .academic-actions > button, .academic-actions > .academic-file-button { flex: 1 1 150px; }
  .academic-attachment-upload { padding: 12px; }
  #academic-grade-editor { padding: 14px; }
}

.academic-pdf-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 12px 0; }
.academic-pdf-toolbar button { flex: 0 1 auto; width: auto; min-height: 44px; }
.academic-pdf-page { display: block; max-width: 100%; height: auto; background: white; border: 1px solid #ced8e4; }

/* The full student header must scroll away on small screens, not cover scores. */
@media (max-width: 760px) {
  #student-detail-shell:has(#student-academic-tab:not([hidden])) .student-sticky-context {
    position: static;
    top: auto;
    z-index: auto;
    box-shadow: none;
    backdrop-filter: none;
  }
}