/* Grade/class management shares the platform's typography and purple accent. */
#gradeClassView{--gc-accent:var(--brand,#625be8);--gc-line:#e9e9ef;--gc-muted:#85858f}
#gradeClassView>.school-organization-note{display:none}
#gradeClassView>.card{background:transparent;border:0;box-shadow:none;overflow:visible}
#gradeClassView>.card>.card-head{border:0;padding:8px 0 22px;gap:16px}
#gradeClassView>.card>.card-head h3{font-size:19px;font-weight:650;letter-spacing:-.4px}
#gradeClassView .gc-intro{font-size:13px;color:var(--gc-muted);margin-top:6px;line-height:1.6}
#gradeClassView>.card>.card-body{padding:0}
.gc-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.gc-summary{display:flex;gap:20px;align-items:center;font-size:12px;color:#85858f;flex-wrap:wrap}
.gc-summary strong{font-size:15px;color:#30303b;font-weight:650;margin-right:4px;font-variant-numeric:tabular-nums}
.gc-summary .gc-summary-dot{width:4px;height:4px;background:#d5d5df;border-radius:50%}
.gc-filters{display:flex;gap:8px;align-items:center}
.gc-search{position:relative;display:block}
.gc-search svg{position:absolute;left:12px;top:12px;width:15px;height:15px;color:#94949e;pointer-events:none}
#gradeClassView .gc-search input,#gradeClassView .gc-filters select{height:38px;background:#fff;border:1px solid var(--gc-line);border-radius:9px;font:inherit;font-size:12px;color:#44444f;outline:none}
#gradeClassView .gc-search input{padding:0 12px 0 35px;width:210px}
#gradeClassView .gc-search input::placeholder{color:#aaaab4}
#gradeClassView .gc-filters select{padding:0 28px 0 11px;max-width:150px}
#gradeClassView .gc-search input:focus,#gradeClassView .gc-filters select:focus{border-color:var(--gc-accent);box-shadow:0 0 0 3px #625be812}
#gradeClassView .grade-block.gc-grade{background:#fff;border:1px solid var(--gc-line);border-radius:13px;padding:0;margin:0 0 18px;overflow:hidden;box-shadow:0 2px 4px #20203903}
.gc-grade-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;gap:12px}
.gc-grade-title{display:flex;gap:10px;align-items:center}
.gc-grade-toggle{border:0;background:transparent;color:inherit;text-align:left;font:inherit;cursor:pointer;flex:1;min-width:0;padding:0}
.gc-grade-toggle:focus-visible{outline:2px solid var(--gc-accent);outline-offset:6px;border-radius:5px}
.gc-grade-chevron{font-size:24px;color:#aaaab4;margin-left:8px;line-height:1}
.gc-grade-toggle[aria-expanded="true"] .gc-grade-chevron{transform:rotate(90deg)}
.gc-grade [data-gc-body][hidden]{display:none!important}
.gc-student-summary{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;font-size:13px;color:#73737f;margin-bottom:16px}
.gc-student-summary strong{font-size:18px;color:#33333f;margin:0 4px;font-variant-numeric:tabular-nums}
.gc-student-summary>.gc-link{margin-left:auto}
.gc-unassigned{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 15px;border:1px solid #eee7d4;background:#fffcf4;border-radius:10px;color:#85704b;font-size:13px;margin-bottom:16px}
.gc-grade-icon{display:grid;place-items:center;background:#f1f0fd;color:var(--gc-accent);width:32px;height:32px;border-radius:9px}
.gc-grade-icon svg{width:16px;height:16px}
.gc-grade-title h4{font-size:14px;font-weight:650;line-height:1.6}
.gc-grade-title small{font-size:11px;color:#9a9aa5;display:block;margin-top:1px}
.gc-grade-actions{display:flex;gap:12px;align-items:center}
.gc-table{width:100%;border-collapse:collapse;table-layout:fixed}
.gc-table th{background:#fafafc;border-top:1px solid #f0f0f4;border-bottom:1px solid #f0f0f4;padding:11px 20px;text-align:left;font-size:11px;color:#9a9aa5;font-weight:500}
.gc-table td{padding:15px 20px;border-bottom:1px solid #f1f1f5;font-size:12px;vertical-align:middle;line-height:1.55}
.gc-table tbody tr:last-child td{border-bottom:0}
.gc-table th:nth-child(1){width:13%}.gc-table th:nth-child(2){width:30%}.gc-table th:nth-child(3){width:19%}.gc-table th:nth-child(4){width:20%}.gc-table th:nth-child(5){width:18%}
.gc-class-name{font-size:13px;font-weight:600;color:#33333f}
.gc-teacher-cell{display:flex;gap:9px;align-items:center;min-width:0}
.gc-avatar{flex-shrink:0;display:grid;place-items:center;width:28px;height:28px;background:#efedf9;color:#777095;border:1px solid #e6e2f1;border-radius:50%;font-size:11px;font-weight:600}
.gc-avatar-empty{background:#f7f7fa;color:#b1b1be;border:1px dashed #dcdce6;font-weight:400}
.gc-teacher-name{color:#4b4b59;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gc-teacher-empty{color:#aaaab5}
#gradeClassView button.gc-link{padding:0;background:none;border:0;box-shadow:none;border-radius:3px;font:inherit;font-size:11px;color:#8a8a97;cursor:pointer;line-height:1.6;white-space:nowrap}
#gradeClassView button.gc-link-accent{color:var(--gc-accent)}
.gc-teacher-cell .gc-link{margin-left:auto}
.gc-student-number{font-size:14px;font-variant-numeric:tabular-nums;font-weight:600;color:#474752}
.gc-student-meta{color:#aaaab4;font-size:11px;margin-left:5px}
.gc-records{display:flex;gap:8px;align-items:center;white-space:nowrap;color:#8d8d9b;font-size:11px}
.gc-progress{width:56px;flex-shrink:0;height:4px;border-radius:3px;background:#efedf7;overflow:hidden}
.gc-progress i{display:block;height:100%;border-radius:3px;background:#aca4e9}
.gc-row-actions{display:flex;flex-wrap:wrap;gap:8px 13px;align-items:center;justify-content:flex-end}
.gc-grade-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #f0f0f5;padding:11px 20px;font-size:11px;color:#a4a4af}
.gc-empty{padding:36px 20px;text-align:center;color:#9999a5;font-size:13px;line-height:1.8;background:#fff;border:1px dashed var(--gc-line);border-radius:12px}
#gradeClassView [hidden]{display:none!important}
@media(hover:hover) and (pointer:fine){.gc-table tbody tr:hover{background:#fdfdff}#gradeClassView button.gc-link:hover{color:var(--gc-accent)}#gradeClassView button.gc-link-danger:hover{color:#d65968}}
@media(max-width:1100px){.gc-controls{align-items:flex-start;flex-direction:column}.gc-filters{width:100%}.gc-search{flex:1}#gradeClassView .gc-search input{width:100%}.gc-table td,.gc-table th{padding-left:14px;padding-right:14px}.gc-table th:nth-child(2){width:31%}.gc-row-actions{gap:9px}}
@media(max-width:640px){#gradeClassView>.card>.card-head{align-items:flex-start}.gc-grade-head{padding:16px}.gc-grade-actions{gap:10px}.gc-summary{gap:12px}.gc-table{display:block}.gc-table thead{display:none}.gc-table tbody{display:block}.gc-table tr{display:grid;grid-template-columns:1fr 1fr;padding:14px 16px;gap:12px 18px;border-top:1px solid #f0f0f5}.gc-table td{display:block;border:0;padding:0}.gc-table td:first-child{grid-column:1 / -1}.gc-table td:nth-child(2){grid-column:1 / -1}.gc-table td:last-child{grid-column:1 / -1}.gc-row-actions{justify-content:flex-start;padding-top:5px}.gc-table td:nth-child(3)::before,.gc-table td:nth-child(4)::before{content:attr(data-label);display:block;color:#aaaab4;font-size:10px;margin-bottom:5px}.gc-teacher-cell .gc-link{margin-left:8px}.gc-grade-bottom{padding:12px 16px}.gc-class-name{font-size:15px}}
/* Homeroom picker */
dialog.hm-dialog{position:fixed;inset:0;margin:auto!important;padding:0;width:min(500px,calc(100vw - 32px));max-height:min(760px,calc(100dvh - 48px));border:1px solid #ffffff70;border-radius:18px;box-shadow:0 24px 100px #20203829,0 4px 16px #2020380d;background:#fff;color:#353541;font-family:inherit;font-size:13px;overflow:hidden}
dialog.hm-dialog::backdrop{background:#24243745;backdrop-filter:blur(3px)}
.hm-header{padding:24px 26px 19px;display:flex;gap:12px;align-items:flex-start;border-bottom:1px solid #efeff5}
.hm-heading-icon{width:38px;height:38px;border-radius:11px;background:#f0eefc;color:#7164d7;display:grid;place-items:center;flex-shrink:0}.hm-heading-icon svg{width:19px;height:19px}
.hm-header h3{font-size:17px;font-weight:650;letter-spacing:-.3px;line-height:1.5;margin:0}.hm-header p{color:#9898a5;font-size:12px;margin:5px 0 0;line-height:1.5}
.hm-close{margin-left:auto;width:28px;height:28px;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:#a1a1ad;cursor:pointer;flex-shrink:0}.hm-close svg{width:16px;height:16px}
.hm-body{padding:18px 26px 16px;overflow:auto;max-height:calc(100dvh - 240px);overscroll-behavior:contain}
.hm-current{border:1px solid #eceaf6;background:#faf9fd;border-radius:10px;padding:12px 14px;display:flex;gap:10px;align-items:center;margin-bottom:20px}.hm-current small{display:block;font-size:10px;color:#a09bad;margin-bottom:3px}.hm-current strong{font-size:12px;font-weight:550}.hm-current-badge{margin-left:auto;font-size:10px;color:#948ca7;border:1px solid #eae6f3;background:#fff;padding:3px 7px;border-radius:5px}
.hm-search{display:flex;align-items:center;gap:9px;padding:0 12px;height:40px;border:1px solid #e7e6ee;border-radius:9px;background:#fff;margin-bottom:16px}.hm-search svg{color:#aaa6b7;width:16px;height:16px;flex-shrink:0}.hm-search input{border:0;outline:none;box-shadow:none;background:transparent;width:100%;height:100%;padding:0;font:inherit;font-size:12px;color:#44404e}.hm-search input::placeholder{color:#b2aebd}.hm-search:focus-within{border-color:#8375df;box-shadow:0 0 0 3px #8070dd12}
.hm-section-label{display:flex;justify-content:space-between;font-size:11px;color:#9893a4;margin-bottom:8px}.hm-section-label span:last-child{font-size:10px;color:#b3adbe}
.hm-options{display:grid;gap:4px;max-height:238px;overflow:auto;padding:2px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d6d2e3 transparent}
.hm-teacher{position:relative;display:flex;align-items:center;gap:11px;padding:10px 11px;border:1px solid transparent;border-radius:9px;cursor:pointer;transition:background-color 120ms,border-color 120ms}.hm-teacher input,.hm-clear input{position:absolute;opacity:0;width:1px;height:1px}.hm-teacher:has(input:checked){background:#f5f2ff;border-color:#dfd8fa}.hm-teacher:has(input:focus-visible),.hm-clear:has(input:focus-visible){outline:2px solid #9a8ce4;outline-offset:1px}
.hm-avatar{width:33px;height:33px;border-radius:50%;background:#f1edf7;color:#8b7b9d;display:grid;place-items:center;font-size:12px;font-weight:550;flex-shrink:0}.hm-teacher:nth-child(3n+2) .hm-avatar{background:#edf3f1;color:#7f9a8f}.hm-teacher:nth-child(3n) .hm-avatar{background:#f5efea;color:#ac9581}
.hm-teacher-name{display:block;font-size:12px;font-weight:550;color:#514b60}.hm-teacher-account{display:block;font-size:10px;color:#aaa3b6;margin-top:3px}.hm-radio{margin-left:auto;width:16px;height:16px;border:1px solid #ddd8e7;border-radius:50%;display:grid;place-items:center;flex-shrink:0;color:transparent}.hm-radio svg{width:11px;height:11px}.hm-teacher:has(input:checked) .hm-radio,.hm-clear:has(input:checked) .hm-radio{background:#7a68d8;border-color:#7a68d8;color:#fff}.hm-label-current{font-size:9px;color:#aaa1bd;padding:2px 5px;border:1px solid #e7e1f0;border-radius:4px;margin-left:4px;vertical-align:middle}
.hm-clear{position:relative;display:flex;gap:10px;align-items:center;border-top:1px solid #f0edf4;padding:12px 10px 4px;margin-top:10px;cursor:pointer;color:#9990a8;font-size:11px}.hm-clear .hm-radio{margin-left:0;width:14px;height:14px}.hm-clear small{font-size:10px;color:#bab3c5;margin-left:auto}
.hm-error{color:#c95467;font-size:12px;line-height:1.7;margin-top:10px}.hm-error:empty{display:none}
.hm-history{margin-top:16px;border-top:1px solid #efedf4;padding-top:13px}.hm-history summary{font-size:11px;color:#a59daf;cursor:pointer;list-style:none;display:flex;align-items:center;gap:5px}.hm-history summary::-webkit-details-marker{display:none}.hm-history summary::before{content:'›';font-size:16px;line-height:1}.hm-history[open] summary::before{transform:rotate(90deg)}.hm-history-entry{border-left:1px solid #e6e1ed;margin:14px 0 0 4px;padding:0 0 0 13px;font-size:11px;line-height:1.7;color:#a49aaf}.hm-history-entry strong{color:#746b80;font-weight:500}.hm-history-entry span{margin-left:7px;font-size:10px;color:#b5aabd}
.hm-footer{padding:16px 26px;border-top:1px solid #eeebf4;display:flex;align-items:center;gap:8px;background:#fff}.hm-selected-note{font-size:11px;color:#aaa2b5;margin-right:auto}.hm-selected-note strong{font-weight:500;color:#7a6e8c}
.hm-button{font:inherit;font-size:12px;font-weight:500;padding:9px 15px;border:1px solid #e6e2ed;border-radius:8px;background:#fff;color:#8b8198;cursor:pointer;transition:background-color 120ms;white-space:nowrap}.hm-button-primary{background:#7864d8;border-color:#7864d8;color:#fff;box-shadow:0 2px 3px #6452b51a}.hm-button:disabled{opacity:.45;cursor:default;box-shadow:none}.hm-no-results{padding:30px 10px;text-align:center;color:#aba2b8;font-size:12px;line-height:1.8}.hm-loading{padding:44px 26px;text-align:center;color:#aaa2b5;line-height:1.8}
@media(hover:hover) and (pointer:fine){.hm-teacher:hover{background:#faf8ff}.hm-teacher:has(input:checked):hover{background:#f0ebfd}.hm-close:hover{background:#f6f3fa;color:#7c718c}.hm-button:hover:not(:disabled){background:#faf8fd}.hm-button-primary:hover:not(:disabled){background:#6b58ca}}
@media(max-width:540px){dialog.hm-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 28px);border-radius:15px}.hm-header{padding:20px 20px 16px}.hm-body{padding:16px 18px;max-height:calc(100dvh - 210px)}.hm-footer{padding:14px 18px}.hm-selected-note{font-size:10px}.hm-button{padding:9px 12px}.hm-clear small{display:none}}
@media(prefers-reduced-motion:reduce){.hm-teacher,.hm-button{transition:none}}
/* Keep everyday administrative data comfortably readable. */
.gc-summary{font-size:12px;color:#85858f}.gc-table th{font-size:12px;color:#8f8f9b}.gc-table td{font-size:13px}.gc-class-name{font-size:14px}.gc-teacher-name{font-size:13px;color:#53535f}.gc-teacher-empty{color:#9c9ca8}.gc-student-meta{font-size:12px;color:#9a9aa7}.gc-records{font-size:12px;color:#93939f}.gc-grade-title h4{font-size:15px}.gc-grade-title small{font-size:12px}.gc-grade-actions .gc-link,#gradeClassView .gc-row-actions .gc-link{font-size:12px;color:#9696a3}.gc-grade-bottom{font-size:12px}
.hm-header h3{font-size:18px}.hm-current small{font-size:11px}.hm-current strong{font-size:14px}.hm-search input{font-size:13px}.hm-section-label{font-size:12px}.hm-teacher-name{font-size:14px}.hm-teacher-account{font-size:11px;color:#9e95ac}.hm-selected-note{font-size:12px}.hm-button{font-size:13px}.hm-clear{font-size:12px}.hm-clear small{font-size:11px}.hm-history summary{font-size:12px}.hm-avatar{font-size:13px}
#gradeClassView .gc-table{min-width:0}
@media(max-width:640px){#gradeClassView .gc-table{min-width:0!important;width:100%}.gc-table tr{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.gc-table td{min-width:0}.gc-records{gap:6px}.gc-progress{width:44px}}
.hm-options{max-height:clamp(126px,calc(100dvh - 540px),238px)}
html:has(dialog.hm-dialog[open]){overflow:hidden;scrollbar-gutter:stable}