#gradeWorkspace .grade-dataset-title { flex:0 1 auto; width:max-content; max-width:calc(100% - 110px); }
#gradeWorkspace .grade-exam-picker { width:auto; max-width:100%; }
#gradeWorkspace .grade-student-seat { display:none; }
#gradeWorkspace .grade-student-list-item { grid-template-columns:minmax(0,max-content) auto; justify-content:start; gap:7px; padding:7px 6px 7px 13px; }
#gradeWorkspace .grade-student-list-item::before { left:3px; width:2px; }
#gradeWorkspace .grade-student-name { min-width:0; }
#seatWorkspace .seat-compact-tools { justify-content:flex-start; }
#growthWorkspace .growth-student-index { display:none; }
#growthWorkspace .growth-layout { display:block; }
.growth-name-picker { display:inline-flex; align-items:center; gap:7px; padding:6px 10px; font:inherit; color:inherit; border:1px solid var(--line); border-radius:9px; background:var(--surface); }
.growth-name-dialog { width:min(640px,calc(100vw - 24px)); max-height:calc(100dvh - 32px); overflow:auto; padding:16px; background:var(--surface); color:var(--ink); border:1px solid var(--line); border-radius:16px; }
.growth-name-dialog::backdrop { background:#15223570; }
.growth-name-dialog > header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.growth-name-dialog h2 { font-size:18px; margin:0; }
.growth-name-dialog .growth-student-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); max-height:65dvh; overflow:auto; }
.cadre-role-display { display:none; }
@media(max-width:760px) {
 #gradeWorkspace .grade-student-list-item { gap:5px; }
 #studentCadreBoard:not(.is-edit-mode) .student-cadre-role-name-input { display:none; }
 #studentCadreBoard:not(.is-edit-mode) .cadre-role-display { display:flex; width:100%; min-height:28px; align-items:center; justify-content:center; text-align:center; font-size:12px; line-height:20px; font-weight:700; overflow-wrap:anywhere; }
 #studentCadreBoard .student-cadre-role-label.has-subject-icon { display:flex; align-items:center; justify-content:center; height:auto; min-height:28px; padding:0; margin:0; color:var(--ink); }
 #studentCadreBoard .cadre-role-display { color:var(--ink); margin:0; padding:0; }
 #hygieneWorkspace .student-hygiene-corner { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:52px; }
 #hygieneWorkspace .student-hygiene-corner-line { display:none; }
 #hygieneWorkspace .student-hygiene-corner > span { position:static; font-size:10px; line-height:1.2; white-space:nowrap; }
 #hygieneWorkspace .student-hygiene-corner-area { padding-bottom:4px; border-bottom:1px solid var(--line); }
 .growth-name-dialog { padding:12px; }
 .growth-name-dialog .growth-student-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
/* Consistent compact controls and directly accessible subjects. */
#gradeWorkspace .grade-compact-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:8px}
#gradeWorkspace .grade-context-actions{width:auto;flex:0 0 auto;gap:6px}
#gradeWorkspace .grade-dataset-title{flex:0 1 auto;width:auto;max-width:100%;min-width:0}
#gradeWorkspace #gradeDownloadTemplateBtn,#gradeWorkspace .grade-file-button,#gradeWorkspace .grade-exam-picker,#gradeWorkspace .grade-subject-picker{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;height:34px;min-height:34px;margin:0;padding:0 9px;gap:5px;font-size:13px;line-height:1.2;font-weight:600;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--ink);box-shadow:none}
#gradeWorkspace .grade-exam-picker{height:auto;min-height:34px;padding-top:6px;padding-bottom:6px;width:max-content;max-width:100%}
#gradeWorkspace .grade-exam-picker strong{font-size:13px;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
#gradeWorkspace .grade-subject-picker{width:34px!important;padding:7px;flex:none}
#gradeWorkspace #gradeSubjectFilters.grade-subject-strip{display:flex;flex-wrap:nowrap;align-items:center;gap:6px;max-width:100%;min-width:0;margin:0 0 10px;padding:2px 0 7px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
#gradeWorkspace .grade-subject-strip .grade-subject-button{display:inline-flex;flex:0 0 auto;width:auto;min-width:0;min-height:32px;gap:5px;padding:5px 9px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted);box-shadow:none}
#gradeWorkspace .grade-subject-strip .grade-subject-label{white-space:nowrap;font-size:13px;overflow:visible;text-overflow:clip}
#gradeWorkspace .grade-subject-strip .grade-subject-icon{display:none}
#gradeWorkspace .grade-subject-strip .grade-subject-button.is-active{color:var(--accent);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 5%,transparent)}
#growthWorkspace .growth-name-picker{min-height:34px;height:34px;width:auto;padding:0 9px;font-size:15px;line-height:1.2;gap:5px;box-sizing:border-box}
#growthWorkspace .growth-name-picker .growth-detail-seat{font-size:12px}
.header-account #teacherSyncStatusButton,.header-account .account-avatar-button{display:grid;place-items:center;grid-template-columns:1fr;flex:0 0 38px;width:38px;height:38px;min-width:38px;min-height:38px;padding:5px;box-sizing:border-box;border-radius:10px}
#homeWorkspace .home-student-directory-actions button{display:inline-flex;align-items:center;justify-content:center;height:34px;min-height:34px;padding:0 9px;gap:5px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--ink);box-shadow:none;font-size:13px;font-weight:600;box-sizing:border-box}
@media(max-width:600px){
 .header-account #teacherSyncStatusButton,.header-account .account-avatar-button{flex-basis:34px;width:34px;height:34px;min-width:34px;min-height:34px;padding:4px}
 #gradeWorkspace .grade-exam-picker strong{font-size:12px}
 #gradeWorkspace #gradeDownloadTemplateBtn,#gradeWorkspace .grade-file-button{padding:0 7px;font-size:12px}
}
#gradeWorkspace .grade-subject-strip .grade-subject-row{display:flex;flex:0 0 auto;width:max-content;min-width:max-content}
#gradeWorkspace .grade-subject-strip .grade-subject-button{width:max-content;min-width:max-content}
#gradeWorkspace .grade-context-actions .grade-file-button{height:34px;min-height:34px}
#gradeWorkspace .grade-subject-strip .grade-total-subject-row{margin-top:0;padding-top:0;border-top:0}
/* Align the wrapper as well as its button; the legacy wrapper had a 40px minimum. */
#gradeWorkspace .grade-dataset-title{display:flex;align-items:center;min-height:34px;margin:0;padding:0;align-self:center}
#gradeWorkspace .grade-compact-toolbar #gradeScoreModeToggle{display:inline-flex;align-items:center;justify-content:center;flex:none;box-sizing:border-box;height:34px;min-height:34px;margin:0;padding:0 9px;gap:5px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--ink);font-size:13px;line-height:1.2;box-shadow:none}
#gradeWorkspace .grade-student-filterbar{display:block;min-height:0;padding:8px 6px}
#gradeWorkspace .grade-average-summary{display:flex;align-items:center;justify-content:center;gap:6px;min-height:26px;margin:0;padding:0;border:0;background:transparent;box-shadow:none;cursor:default;font-size:16px;color:var(--ink)}
#gradeWorkspace .grade-average-summary strong{font-size:16px}
#gradeWorkspace .grade-average-symbol{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-size:20px}
#gradeWorkspace .grade-student-list-item::before{display:none;content:none}
#gradeWorkspace .grade-student-list-item{padding-left:6px}
@media(max-width:600px){#gradeWorkspace .grade-compact-toolbar #gradeScoreModeToggle{font-size:12px;padding:0 7px}}
.remember-login{display:flex!important;align-items:center;justify-content:flex-start;gap:8px;font-size:13px}.remember-login input{width:16px!important;height:16px;min-height:0!important;margin:0}.remember-login span{color:var(--muted);cursor:help}
#settingsWorkspace .settings-compact-head{display:flex;justify-content:flex-end;min-height:0;padding:0;margin:0 0 10px}
#settingsWorkspace .settings-row{min-height:64px;padding:14px 16px;gap:12px}
#settingsWorkspace .settings-row>div{min-width:0}
#settingsWorkspace .settings-row button{flex:none;white-space:nowrap;min-height:34px;padding:6px 10px}
#settingsWorkspace .settings-quiet-description,#settingsWorkspace [hidden],#settingsWorkspace .settings-retired-control{display:none!important}
#settingsWorkspace .settings-version-row .settings-state{font-size:25px;font-weight:750;color:var(--ink)}
#settingsWorkspace .sync-settings{padding:0 16px 12px;border:0;box-shadow:none;background:transparent}
#settingsWorkspace #syncLastSaved{font-size:12px}#settingsWorkspace .sync-primary-row{gap:8px}
#settingsWorkspace .sync-actions:empty{display:none}
@media(max-width:600px){#settingsWorkspace .settings-row{padding:12px;min-height:60px}#settingsWorkspace .settings-row strong{font-size:14px}#settingsWorkspace .sync-primary-row{display:flex;flex-wrap:wrap;justify-content:space-between}#settingsWorkspace .settings-version-row .settings-state{font-size:24px}}
#settingsWorkspace .settings-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between}
#settingsWorkspace .settings-row>div{flex:1;display:flex;align-items:center;gap:10px}
#settingsWorkspace .settings-row>button,#settingsWorkspace .settings-row>.settings-state{width:auto;flex:0 0 auto;margin:0}
#settingsWorkspace .settings-compact-head #themeToggleBtn{width:auto;min-width:0;flex:0 0 auto;height:34px;min-height:34px;padding:0 12px}
#settingsWorkspace .sync-primary-row{display:flex;flex-direction:row;align-items:center;justify-content:space-between}
#settingsWorkspace .sync-primary-row .sync-actions{width:auto;flex:none}
#settingsWorkspace .settings-version-row .settings-state{border:0;background:transparent;padding:0}
#settingsWorkspace .settings-row>.settings-cloud-actions{flex:0 0 auto;width:auto;gap:5px}
#settingsWorkspace #syncHistoryBtn{width:34px;min-width:34px;padding:6px}
#settingsWorkspace .sync-settings{padding:0 12px}
#settingsWorkspace .settings-row>div{max-width:none}
#settingsWorkspace .settings-row strong{white-space:nowrap}
#settingsWorkspace .settings-row button{min-width:0;max-width:none;width:auto;font-size:12px;padding:6px 8px}
#settingsWorkspace .settings-row>.settings-cloud-actions{max-width:none;width:max-content;overflow:visible}
#settingsWorkspace .settings-cloud-actions #syncNowBtn{width:auto;min-width:0;flex:0 0 auto}
#settingsWorkspace #syncHistoryBtn{width:34px;min-width:34px;max-width:34px}
@media(max-width:600px){#settingsWorkspace .settings-row{gap:6px}#settingsWorkspace .settings-row>div{gap:6px}#settingsWorkspace .settings-row>div>span[data-icon]{width:25px;min-width:25px;padding:4px}#settingsWorkspace .settings-row strong{font-size:13px}}

.header-account #teacherSyncStatusButton,.header-account #themeToggleBtn,.header-account #accountAvatarButton{display:grid;place-items:center;width:38px;height:38px;min-width:38px;min-height:38px;max-width:38px;padding:0;gap:0;border-radius:10px;flex:0 0 38px;margin:0}
.header-account #themeToggleBtn .ui-icon{width:21px;height:21px;margin:0}
.header-account #accountAvatarButton{overflow:hidden}
.header-account #accountAvatarButton .account-avatar-frame{width:100%;height:100%;border-radius:inherit;padding:0;margin:0;flex:none}
.header-account #accountAvatarButton .account-avatar-frame img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.header-account #teacherSyncStatusButton .sync-status-icon{width:25px;height:25px;transform-origin:50% 50%;stroke-width:1.65}
.header-account #teacherSyncStatusButton.is-syncing .sync-status-icon{animation:teacher-sync-spin 1.1s linear infinite}
.header-account #teacherSyncStatusButton[data-state="saved"]{color:#218657}
#settingsWorkspace .local-data-size{font-size:12px;color:var(--muted);white-space:nowrap}
#settingsWorkspace #syncHistoryPanel{max-height:290px;overflow:auto}
#settingsWorkspace #syncHistoryList li{gap:8px}
@media(prefers-reduced-motion:reduce){.header-account #teacherSyncStatusButton.is-syncing .sync-status-icon{animation-duration:3s}}

:root.theme-dark{color-scheme:dark}