:root {
  color-scheme: light;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --bg: #f4f7f8;
  --panel: #ffffff;
  --panel-soft: #f8fafc;
  --line: #d6e0e6;
  --text: #172033;
  --muted: #5f6f84;
  --brand: #155e75;
  --brand-strong: #0f4f62;
  --brand-soft: #e7f4f6;
  --shadow: 0 12px 28px rgba(23, 32, 51, 0.08);
  --good: #166534;
  --warn: #8a5a00;
  --danger: #9b1c1c;
  --basic-task-bg: #f2f7fc;
  --basic-task-border: #c9d8e8;
  --basic-task-accent: #4f7fa8;
  --basic-people-bg: #f1f8f3;
  --basic-people-border: #c8dacf;
  --basic-people-accent: #4f8060;
  --basic-dialogue-bg: #f7f3fa;
  --basic-dialogue-border: #d9cde2;
  --basic-dialogue-accent: #7a5d91;
  --basic-important-bg: #fff8e8;
  --basic-important-border: #e7d19a;
  --basic-important-accent: #a87318;
  --basic-selected-bg: #e3f2f5;
  --basic-selected-border: #2f7d91;
}

body[data-theme="dark"] {
  color-scheme: dark;
  --bg: #141611;
  --panel: #1d211b;
  --panel-soft: #252a24;
  --line: #3c433a;
  --text: #f1eee6;
  --muted: #b5baae;
  --brand: #8ab7a7;
  --brand-strong: #c8ded5;
  --brand-soft: #26362f;
  --shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
  --good: #9bd4bd;
  --warn: #e6c477;
  --danger: #ffb4a8;
  --basic-task-bg: #182431;
  --basic-task-border: #3f6482;
  --basic-task-accent: #7ca7cc;
  --basic-people-bg: #192820;
  --basic-people-border: #456651;
  --basic-people-accent: #7fae91;
  --basic-dialogue-bg: #25202b;
  --basic-dialogue-border: #655073;
  --basic-dialogue-accent: #ae91c2;
  --basic-important-bg: #2d2719;
  --basic-important-border: #7a622d;
  --basic-important-accent: #d4a94f;
  --basic-selected-bg: #243a3d;
  --basic-selected-border: #6fb2c0;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; overflow: hidden; background: #ffffff; color: var(--text); }
button, input, select { font: inherit; }
button { border: 1px solid var(--brand); border-radius: 8px; padding: 9px 13px; min-height: 38px; background: var(--brand); color: #fff; cursor: pointer; }
button.secondary { background: var(--brand-soft); color: var(--brand-strong); border-color: #b8dbe4; }
button:disabled { border-color: #bdc8d4; background: #dce3ea; color: var(--muted); cursor: not-allowed; }
input, select { min-height: 38px; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; background: #fff; color: var(--text); }
input:focus, select:focus { border-color: var(--brand); outline: 2px solid rgba(21, 94, 117, 0.16); outline-offset: 2px; }

.teacher-root { width: 100%; height: 100vh; min-height: 0; padding: 0; display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 0; overflow: hidden; background: #ffffff; }
.teacher-sidebar, .teacher-main { min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: grid; align-content: start; }
.teacher-sidebar { height: 100vh; grid-template-rows: auto auto auto auto auto minmax(0, auto); gap: 10px; padding: 12px; background: #f7f7f8; border-right: 1px solid #e5e5e5; color: #202123; }
.teacher-main { gap: 12px; padding: 20px; background: transparent; }
.teacher-main:empty::before { content: "登入後會在這裡顯示教師工作台內容。"; display: block; padding: 18px; border: 1px dashed #b8c6d2; border-radius: 8px; color: var(--muted); background: #fbfcfd; }
.topbar, .panel, .metric, .notice, .error-panel, .sidebar-sessions-panel { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 20px rgba(23, 32, 51, 0.05); }
.teacher-sidebar .topbar,
.teacher-sidebar .sidebar-sessions-panel,
.teacher-sidebar .notice,
.teacher-sidebar .error-panel { box-shadow: none; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; }
.teacher-sidebar .topbar { align-items: stretch; flex-direction: column; }
.sidebar-brand { display: grid; gap: 12px; padding: 0; background: transparent; border: 0; border-radius: 0; }
.brand-row { min-height: 52px; display: grid; grid-template-columns: minmax(0, 1fr) 40px; align-items: center; gap: 8px; }
.brand-lockup { min-width: 0; min-height: 42px; display: flex; gap: 10px; align-items: center; padding: 4px 2px; }
.brand-logo { width: 48px; height: 48px; object-fit: contain; min-height: 0; border-radius: 0; background: transparent; border: 0; }
.brand { display: flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.brand-icon { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 8px; background: var(--brand); color: #fff; font-weight: 900; }
.brand strong, .brand small { display: block; }
.brand small, .muted, small { color: var(--muted); }
.nav-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.teacher-sidebar .nav-actions { justify-content: stretch; }
.teacher-sidebar .nav-actions a,
.teacher-sidebar .nav-actions button,
.teacher-sidebar .account-pill,
.teacher-sidebar .status-pill { width: 100%; justify-content: center; text-align: center; }
.nav-actions a, .ghost-link, .ghost-btn { min-height: 38px; display: inline-flex; align-items: center; justify-content: center; color: #202123; text-decoration: none; border: 1px solid transparent; border-radius: 8px; padding: 8px 10px; background: transparent; font-size: 14px; }
.nav-actions a:hover, .ghost-link:hover, .ghost-link:focus-visible, .ghost-btn:hover, .ghost-btn:focus-visible { background: #ececf1; border-color: #ececf1; outline: none; }
.teacher-sidebar button.secondary { color: #202123; background: transparent; border-color: transparent; }
.teacher-sidebar button.secondary:hover,
.teacher-sidebar button.secondary:focus-visible { background: #ececf1; border-color: #ececf1; outline: none; }
.primary-btn { min-height: 38px; display: inline-flex; align-items: center; justify-content: flex-start; width: 100%; border: 1px solid #d9d9e3; border-radius: 8px; padding: 8px 10px; background: #ffffff; color: #202123; font-size: 14px; }
.primary-btn:hover, .primary-btn:focus-visible { background: #ececf1; outline: none; }
.sidebar-links { display: grid; gap: 4px; padding: 8px 0 0; border: 0; border-top: 1px solid #e5e5e5; border-radius: 0; background: transparent; }
.sidebar-workspace-links { margin-top: 0; }
.sidebar-return-link { border-color: #cfd7df; background: #ffffff; font-weight: 800; }
.sidebar-return-link:hover,
.sidebar-return-link:focus-visible { border-color: #aebbc8; background: #f4f7fa; }
.sidebar-account-panel { margin-top: 0; }
.sidebar-profile-panel { gap: 10px; margin-top: auto; padding-top: 10px; }
.sidebar-profile-list { display: grid; gap: 8px; }
.sidebar-profile-list div { display: grid; gap: 3px; min-width: 0; padding: 8px 10px; border: 1px solid #e5e5e5; border-radius: 8px; background: #ffffff; }
.sidebar-profile-list small { color: #6b6c70; font-size: 11px; font-weight: 800; }
.sidebar-profile-list strong { color: #202123; font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.sidebar-class-selector { max-width: none; margin-top: 0; }
.sidebar-links .status-pill,
.sidebar-links .account-pill,
.sidebar-links .ghost-link,
.sidebar-links .ghost-btn { width: 100%; justify-content: center; text-align: center; }
.account-pill { display: inline-flex; align-items: center; min-height: 34px; max-width: min(420px, 100%); padding: 6px 10px; border: 1px solid #d9d9e3; border-radius: 8px; background: #ffffff; color: #6b6c70; font-size: 13px; font-weight: 800; }
.topbar-logout { border-color: #d4e0e6; }
.theme-toggle { gap: 8px; }
.brand-theme-toggle { width: 40px; min-width: 40px; height: 40px; min-height: 40px; justify-content: center; padding: 0; border-radius: 999px; }
.theme-toggle span { width: 18px; min-width: 18px; display: inline-grid; place-items: center; font-size: 16px; }
.theme-toggle strong { font-size: 14px; }
.brand-theme-toggle strong { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.hero { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 0.6fr); gap: 16px; align-items: stretch; }
.teacher-sidebar .hero { grid-template-columns: 1fr; }
.hero-compact { grid-template-columns: 1fr; }
.hero-copy { padding: 0; border: 0; box-shadow: none; background: transparent; }
.hero-compact .hero-copy { padding: 0; }
.eyebrow { margin: 0 0 8px; color: #6b6c70; font-size: 11px; font-weight: 800; letter-spacing: 0; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1 { margin: 4px 0 10px; font-size: clamp(28px, 3.4vw, 42px); line-height: 1.1; letter-spacing: 0; }
.hero-compact h1 { font-size: 30px; }
.teacher-sidebar h1,
.teacher-sidebar .hero-compact h1 { font-size: 28px; }
.teacher-sidebar .hero-copy p { line-height: 1.55; }
h2 { margin: 0; font-size: 22px; line-height: 1.25; letter-spacing: 0; }
h3 { margin: 16px 0 8px; font-size: 17px; letter-spacing: 0; }
.hero-copy p { max-width: 840px; line-height: 1.7; color: #40506a; }
.hero-compact .hero-copy p { margin: 0; }

.login-panel { display: grid; gap: 12px; align-content: start; }
.login-empty-main { min-height: 0; display: grid; padding: 0; overflow: hidden; background: #fffaf3; }
.login-empty-image { width: 100%; height: 100vh; object-fit: cover; border-radius: 0; }
.login-form { display: grid; gap: 10px; }
.login-form label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.class-selector { display: grid; gap: 6px; margin-top: 10px; max-width: 260px; color: var(--muted); font-size: 13px; font-weight: 800; }
.token-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.status-pill, .chip { display: inline-flex; align-items: center; min-height: 28px; width: fit-content; padding: 4px 9px; border-radius: 999px; background: var(--brand-soft); color: var(--brand-strong); font-size: 12px; font-weight: 800; }
.status-pill.raw { border: 1px solid #f1b8b8; background: #ffe4e4; color: var(--danger); }
.chip.good { background: #e8f6ed; color: var(--good); }
.chip.warn { background: #fff5d6; color: var(--warn); }
.chip.danger { background: #ffe4e4; color: var(--danger); }

.toolbar { display: grid; gap: 12px; }
.toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.teacher-sidebar .toolbar-actions { display: grid; grid-template-columns: 1fr; }
.teacher-sidebar .toolbar-actions button { width: 100%; }
button.danger-soft { border-color: #f1b8b8; background: #ffe4e4; color: var(--danger); }
.sidebar-sessions-panel { min-height: 0; display: grid; align-content: start; gap: 12px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: hidden; }
.sidebar-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.sidebar-head > div { min-width: 0; display: grid; gap: 4px; }
.sidebar-head h2 { margin: 0; font-size: 20px; line-height: 1.25; }
.sidebar-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.workspace-nav { display: grid; gap: 10px; }
.workspace-nav-list { height: auto; max-height: none; overflow: visible; gap: 10px; }
.workspace-nav-group { display: grid; gap: 4px; padding-top: 8px; border-top: 1px solid #e5e5e5; }
.workspace-nav-group:first-child { padding-top: 0; border-top: 0; }
.workspace-nav-group-label { margin: 0 0 2px; color: #6b6c70; font-size: 11px; font-weight: 900; line-height: 1.2; }
.session-list { min-height: 0; height: 100%; max-height: none; overflow: auto; display: grid; align-content: start; align-items: start; justify-content: stretch; grid-auto-rows: max-content; gap: 3px; padding-right: 2px; }
.session-item { width: 100%; align-self: start; align-content: start; align-items: start; grid-template-rows: auto auto; min-height: 58px; text-align: left; padding: 9px 10px; border: 0; border-radius: 8px; background: transparent; color: #202123; display: grid; gap: 4px; cursor: pointer; }
.session-item:hover,
.session-item:focus-visible,
.session-item.is-active { background: #ececf1; border-color: transparent; box-shadow: none; outline: none; }
.workspace-nav-title { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.workspace-nav-item strong { display: block; font-size: 14px; line-height: 1.35; font-weight: 700; }
.workspace-nav-item small { display: block; color: #6b6c70; font-size: 12px; font-weight: 700; line-height: 1.4; }
.workspace-nav-item.is-active small { color: #6b6c70; }
.workspace-nav-badge { min-width: 22px; height: 22px; display: inline-grid; place-items: center; border: 1px solid #cbd7df; border-radius: 999px; padding: 0 7px; background: #ffffff; color: #40506a; font-size: 11px; font-weight: 900; line-height: 1; }
.workspace-nav-badge.warn { border-color: #e6c477; background: #fff5d6; color: #7a4e00; }
.workspace-nav-badge.danger { border-color: #f1b8b8; background: #ffe4e4; color: #9b1c1c; }
.workspace-nav-badge.good { border-color: #b9e6c6; background: #e8f6ed; color: #166534; }

/* 教師工作台：桌機三欄；提醒與新增任務使用 modal。進階完整版樣式保留於既有區塊。 */
.teacher-root.is-basic { grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); }
.teacher-root.is-basic .teacher-main { padding: 10px 20px 28px; }
.teacher-basic-header { position: relative; min-width: 0; min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 16px; border-bottom: 1px solid #dce3df; background: #f8faf9; }
.teacher-basic-header-primary { min-width: 0; display: flex; align-items: center; gap: 8px; }
.teacher-basic-brand { min-width: 210px; gap: 10px; }
.teacher-basic-brand .brand-logo { width: 48px; height: 48px; }
.teacher-basic-brand .eyebrow { margin-bottom: 2px; }
.teacher-basic-brand h1,
.teacher-basic-brand small { display: block; }
.teacher-basic-brand h1 { margin: 0; font-size: 20px; line-height: 1.25; }
.teacher-basic-header-actions { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.teacher-basic-header-actions .brand-theme-toggle { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
.teacher-basic-header-actions .ghost-link,
.teacher-basic-header-actions .ghost-btn { min-height: 44px; border-color: #cfdad4; background: #ffffff; }
.teacher-basic-alert-shortcut { min-height: 44px; display: inline-flex; align-items: center; gap: 7px; border-color: #d6dfda; background: #ffffff; color: #395448; }
.teacher-basic-alert-shortcut strong { min-width: 24px; min-height: 24px; display: inline-grid; place-items: center; padding: 0 6px; border-radius: 999px; background: #e8f1ec; color: #274d3c; }
.teacher-basic-alert-shortcut.has-critical { border-color: #c97070; background: #fff1f1; color: #8c2525; }
.teacher-basic-alert-shortcut.has-critical strong { background: #b94343; color: #ffffff; }
.teacher-basic-semantic-mask { min-height: 44px; white-space: nowrap; }
.teacher-basic-class-management { min-height: 44px; white-space: nowrap; }
.teacher-basic-student-management { min-height: 44px; white-space: nowrap; }
.teacher-basic-workflow-switch { min-height: 44px; display: inline-flex; overflow: hidden; border: 1px solid #b7c9bf; border-radius: 10px; background: #ffffff; }
.teacher-basic-workflow-switch button { min-height: 42px; border: 0; border-radius: 0; background: transparent; color: #395448; font-size: 13px; font-weight: 850; white-space: nowrap; }
.teacher-basic-workflow-switch button + button { border-left: 1px solid #c9d8d0; }
.teacher-basic-workflow-switch button.is-active { background: #315f49; color: #ffffff; }
.teacher-basic-mobile-menu { display: none; }
.teacher-basic-class-switcher { min-width: 210px; display: grid; grid-template-columns: auto minmax(120px, 1fr); align-items: center; gap: 8px; padding: 5px 7px 5px 11px; border: 1px solid #cfdad4; border-radius: 11px; background: #eaf5ef; color: #234c39; font-size: 13px; font-weight: 900; box-shadow: 0 2px 8px rgba(35, 76, 57, 0.1); }
.teacher-basic-class-switcher > span { white-space: nowrap; }
.teacher-basic-class-switcher select { min-height: 44px; border-color: #8db5a3; background: #ffffff; color: #173b2d; font-weight: 800; }
.teacher-basic-notification-panel { position: absolute; top: calc(100% + 8px); right: 16px; z-index: 105; width: min(420px, calc(100vw - 32px)); max-height: min(620px, calc(100dvh - 96px)); display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid #b9cbc2; border-radius: 15px; background: #ffffff; color: var(--text); box-shadow: 0 22px 58px rgba(17, 24, 39, 0.25); }
.teacher-basic-notification-head { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 14px; border-bottom: 1px solid #dce5e0; background: #eef6f2; }
.teacher-basic-notification-head > div { min-width: 0; display: grid; gap: 2px; }
.teacher-basic-notification-head strong { color: #193d2e; font-size: 17px; }
.teacher-basic-notification-head small { color: #53685d; font-weight: 700; }
.teacher-basic-notification-head button { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; font-size: 22px; }
.teacher-basic-notification-list { min-height: 0; display: grid; align-content: start; gap: 8px; overflow-y: auto; overscroll-behavior: contain; padding: 10px; }
.teacher-basic-notification-item { width: 100%; min-width: 0; min-height: 76px; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 9px; align-items: center; padding: 11px 12px; border: 1px solid #d9e3de; border-radius: 11px; background: #fbfdfc; color: var(--text); text-align: left; box-shadow: none; }
.teacher-basic-notification-item:hover,
.teacher-basic-notification-item:focus-visible { border-color: #5f9780; background: #f0f8f4; box-shadow: none; }
.teacher-basic-notification-item .chip { grid-row: 1 / span 2; }
.teacher-basic-notification-item strong,
.teacher-basic-notification-item small { min-width: 0; overflow-wrap: anywhere; }
.teacher-basic-notification-item strong { font-size: 15px; line-height: 1.4; }
.teacher-basic-notification-item small { color: #53645c; font-size: 13px; line-height: 1.45; }
.teacher-basic-dashboard { min-width: 0; display: grid; gap: 18px; }
.teacher-basic-top-grid { min-width: 0; height: calc(100dvh - 96px); min-height: 680px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 3fr); grid-template-rows: minmax(0, 1fr); gap: 16px; align-items: stretch; }
.teacher-basic-pane { min-width: 0; min-height: 0; display: grid; align-content: start; gap: 16px; padding: 18px; border: 1px solid #dbe4df; border-radius: 18px; background: #ffffff; box-shadow: 0 5px 18px rgba(30, 55, 44, 0.05); }
.teacher-basic-tasks { border-color: var(--basic-task-border); background: var(--basic-task-bg); box-shadow: inset 0 4px 0 var(--basic-task-accent), 0 5px 18px rgba(30, 55, 44, 0.05); }
.teacher-basic-people { border-color: var(--basic-people-border); background: var(--basic-people-bg); box-shadow: inset 0 4px 0 var(--basic-people-accent), 0 5px 18px rgba(30, 55, 44, 0.05); }
.teacher-basic-dialogue { border-color: var(--basic-dialogue-border); background: var(--basic-dialogue-bg); box-shadow: inset 0 4px 0 var(--basic-dialogue-accent), 0 5px 18px rgba(30, 55, 44, 0.05); }
.teacher-basic-important { border-color: var(--basic-important-border); background: var(--basic-important-bg); box-shadow: inset 0 4px 0 var(--basic-important-accent), 0 5px 18px rgba(30, 55, 44, 0.05); }
.teacher-basic-top-grid > .teacher-basic-pane { overflow: hidden; }
.teacher-basic-people { grid-template-rows: auto auto minmax(0, 1fr); row-gap: 10px; }
.teacher-basic-people > .workspace-search { grid-row: 2; margin-top: 0; }
.teacher-basic-people > .teacher-basic-scroll-list { grid-row: 3; padding-right: 0; scrollbar-gutter: auto; }
.teacher-basic-people.has-student-insight { grid-template-rows: auto auto auto minmax(0, 1fr); }
.teacher-basic-people.has-student-insight > .teacher-basic-insight { grid-row: 2; }
.teacher-basic-people.has-student-insight > .workspace-search { grid-row: 3; }
.teacher-basic-people.has-student-insight > .teacher-basic-scroll-list { grid-row: 4; }
.teacher-basic-tasks { grid-template-rows: auto auto minmax(0, 1fr); row-gap: 10px; }
.teacher-basic-pane-head { min-width: 0; min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid #e6ece8; }
.teacher-basic-pane-head h2 { color: #183d2d; font-size: 21px; }
.teacher-basic-tasks .teacher-basic-pane-head h2 { color: #173b57; }
.teacher-basic-people .teacher-basic-pane-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.teacher-basic-people .teacher-basic-pane-head-copy { min-width: 0; width: 100%; }
.teacher-basic-people .teacher-basic-pane-head h2 { width: 100%; color: #214a34; overflow-wrap: normal; word-break: normal; }
.teacher-basic-people .teacher-basic-pane-head-copy .chip { width: fit-content; margin-top: 7px; }
.teacher-basic-people .teacher-basic-pane-head > .compact-action { align-self: start; margin-top: 3px; white-space: nowrap; }
.teacher-basic-dialogue .teacher-basic-pane-head h2 { color: #4f3862; }
.teacher-basic-important .teacher-basic-pane-head h2 { color: #5e4311; }
.teacher-basic-pane-head .eyebrow { margin-bottom: 4px; color: #52685c; font-size: 12px; line-height: 1.4; font-weight: 700; }
.teacher-basic-current-class { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 0; border-radius: 12px; background: #eef7f2; }
.teacher-basic-current-class > span { min-width: 0; display: grid; gap: 3px; }
.teacher-basic-current-class button { display: none; flex: 0 0 auto; max-width: 100%; min-height: 44px; padding-inline: 14px; font-size: 13px; line-height: 1.4; white-space: normal; overflow-wrap: anywhere; }
.teacher-basic-current-class small { color: #52685c; font-size: 12px; line-height: 1.4; font-weight: 700; }
.teacher-basic-current-class strong { color: #173b2d; }
.teacher-basic-scroll-list { min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; align-content: start; padding-right: 3px; }
.teacher-basic-pane .workspace-search { gap: 7px; font-size: 13px; font-weight: 700; }
.teacher-basic-pane .workspace-search > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.teacher-basic-pane .workspace-search input { min-height: 44px; padding-inline: 12px; }
.teacher-basic-pane .workspace-button-list,
.teacher-basic-pane .basic-task-list { gap: 10px; }
.teacher-basic-pane .workspace-list-button,
.teacher-basic-pane .topic-card { gap: 6px; padding: 12px 14px; border-color: #e1e8e4; border-radius: 11px; background: #ffffff; }
.teacher-basic-pane .workspace-list-button small,
.teacher-basic-pane .workspace-list-button span,
.teacher-basic-pane .basic-task-select > small,
.teacher-basic-pane .basic-task-select > span { color: #526277; font-size: 14px; line-height: 1.5; font-weight: 650; }
.teacher-basic-pane .workspace-list-button:hover,
.teacher-basic-pane .workspace-list-button:focus-visible,
.teacher-basic-pane .topic-card:hover,
.teacher-basic-pane .topic-card:focus-visible { border-color: #9bc2cd; background: #f5fbfc; box-shadow: none; }
.teacher-basic-pane .workspace-list-button.is-active,
.teacher-basic-pane .topic-card.is-active { border: 2px solid var(--basic-selected-border); background: var(--basic-selected-bg); box-shadow: none; }
.teacher-root.is-basic .teacher-basic-pane .basic-student-button { height: auto; min-height: 96px; min-block-size: 96px; padding-inline: 10px; font-size: 14px; }
.teacher-basic-pane .basic-student-button > strong,
.teacher-basic-pane .basic-task-select > strong { font-size: 16px; line-height: 1.4; }
.teacher-basic-pane .basic-student-button > strong { width: 100%; overflow-wrap: normal; word-break: normal; }
.basic-student-button .chip { margin-top: 2px; }
.compact-action { min-height: 44px; padding: 7px 10px; }
.teacher-basic-quick-create { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.teacher-basic-quick-create label { min-width: 0; display: grid; gap: 7px; color: var(--muted); font-size: 13px; font-weight: 700; }
.teacher-basic-quick-create input,
.teacher-basic-quick-create button { min-height: 48px; }
.basic-task-list { display: grid; gap: 10px; }
.teacher-root.is-basic .teacher-basic-pane .basic-task-card { height: auto; min-height: 104px; min-block-size: 104px; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; justify-items: stretch; gap: 0; padding: 0; overflow: hidden; font-size: 14px; }
.basic-task-select { width: 100%; min-width: 0; min-height: 102px; display: grid; align-content: start; justify-items: start; gap: 6px; padding: 12px 14px; border: 0; border-radius: inherit; background: transparent; color: inherit; text-align: left; box-shadow: none; }
.basic-task-select:hover,
.basic-task-select:focus-visible { background: transparent; box-shadow: none; }
.basic-task-card:focus-within { border-color: var(--basic-selected-border); box-shadow: none; }
.basic-task-card-actions { display: flex; align-items: center; justify-content: flex-end; padding: 10px 10px 10px 0; }
.teacher-root.is-basic .basic-task-card-actions button { min-width: 72px; min-height: 44px; padding-inline: 12px; font-size: 14px; }
.teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived {
  border-color: #b8bec5;
  background: #e5e8eb;
  color: #4f5862;
  box-shadow: none;
}
.teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived:hover,
.teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived:focus-within {
  border-color: #8e969f;
  background: #dfe3e6;
}
.teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived.is-active {
  border: 2px solid #737c86;
  background: #d9dde1;
}
.teacher-basic-pane .basic-task-card.is-archived .basic-task-select > span,
.teacher-basic-pane .basic-task-card.is-archived .basic-task-select > small { color: #606a74; }
.teacher-root.is-basic .basic-task-card.is-archived .basic-task-card-actions button {
  border-color: #a9b0b8;
  background: #f2f3f4;
  color: #505963;
}
.basic-task-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.basic-task-metrics span { display: grid; gap: 3px; padding: 10px; border-radius: 10px; background: #f3f7f5; color: #52685c; font-size: 12px; line-height: 1.4; font-weight: 700; }
.basic-task-metrics strong { color: var(--text); font-size: 18px; }
.basic-task-modal-backdrop { position: fixed; inset: 0; z-index: 1175; display: grid; place-items: center; padding: 20px; background: rgba(17, 24, 39, 0.66); }
.basic-task-modal { width: min(640px, 96vw); max-height: min(720px, 92vh); display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; border: 1px solid #b8cec4; border-radius: 18px; background: #ffffff; color: var(--text); box-shadow: 0 26px 72px rgba(0, 0, 0, 0.38); }
.basic-task-overview-modal.is-editing { width: min(900px, 96vw); }
.basic-task-edit-form { display: grid; gap: 16px; }
.basic-task-edit-form > label { display: grid; gap: 7px; color: var(--muted); font-size: 14px; font-weight: 800; }
.basic-task-edit-form textarea { min-height: 110px; resize: vertical; }
.basic-task-edit-form fieldset { min-width: 0; margin: 0; padding: 14px; border: 1px solid #c9dcd3; border-radius: 11px; }
.basic-task-edit-form legend { padding: 0 6px; color: var(--muted); font-size: 14px; font-weight: 850; }
.basic-task-edit-form fieldset > .class-check-list,
.basic-task-create-form fieldset > .class-check-list { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.basic-task-assignment-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.basic-task-assignment-modes label { min-height: 44px; display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; font-weight: 800; }
.basic-task-assignment-modes input[type="radio"] { flex: 0 0 18px; width: 18px; min-width: 18px; height: 18px; min-height: 18px; margin: 0; padding: 0; accent-color: var(--brand); }
.basic-task-student-list { max-height: 260px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; overflow-y: auto; }
.basic-task-student-list .class-check-item { min-height: 44px; }
.basic-task-student-list .class-check-item span { min-width: 0; display: grid; gap: 2px; overflow-wrap: anywhere; }
.basic-task-student-list .basic-task-student-identity { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.basic-task-student-list .basic-task-student-identity strong { flex: 0 1 auto; min-width: min(150px, 100%); }
.basic-task-student-list .basic-task-student-identity small { flex: 1 1 170px; }
.basic-task-student-list small { color: var(--muted); }
.basic-task-description-field textarea { width: 100%; min-height: 132px; padding: 12px 14px; border: 1px solid #9fb4aa; border-radius: 10px; background: #ffffff; color: var(--text); font: inherit; line-height: 1.65; resize: vertical; transition: border-color 0.16s ease, box-shadow 0.16s ease, background 0.16s ease; }
.basic-task-description-field textarea::placeholder { color: #687b71; opacity: 1; }
.basic-task-description-field textarea:hover { border-color: #78998a; }
.basic-task-description-field textarea:focus { border-color: #4f8a73; outline: 0; box-shadow: 0 0 0 3px rgba(79, 138, 115, 0.2); }
.basic-task-assignment-note { margin: 0; padding: 12px; border: 1px solid #c9dcd3; border-radius: 10px; background: #f1f6f3; color: #31483d; font-weight: 750; }
.basic-task-modal-head { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 15px; border-bottom: 2px solid #4f8a73; background: #edf5f1; }
.basic-task-modal-head > div { min-width: 0; }
.basic-task-modal-head h2 { margin: 3px 0 0; color: #193d2e; font-size: 23px; line-height: 1.35; overflow-wrap: anywhere; }
.basic-task-modal-close { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 999px; font-size: 24px; line-height: 1; }
.basic-task-modal-body { min-height: 0; display: grid; align-content: start; gap: 18px; overflow-y: auto; overscroll-behavior: contain; padding: 20px; background: #ffffff; }
.basic-task-modal-status { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: #405448; font-size: 13px; font-weight: 750; line-height: 1.5; }
.basic-task-modal-description,
.basic-task-modal-loading { margin: 0; padding: 14px; border: 1px solid #c9dcd3; border-radius: 11px; background: #f1f6f3; color: #31483d; line-height: 1.65; overflow-wrap: anywhere; }
.basic-task-modal-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 14px 20px calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid #c9d8d1; background: #f7faf8; }
.teacher-root.is-basic .basic-task-modal-actions button { width: 100%; min-width: 0; min-height: 46px; }
.basic-task-overview-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.basic-task-overview-actions.is-editing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.basic-task-create-form label { display: grid; gap: 7px; color: var(--muted); font-size: 13px; font-weight: 750; }
.basic-task-create-form input,
.basic-task-create-form textarea { width: 100%; min-height: 48px; }
.basic-task-create-form textarea { min-height: 120px; resize: vertical; }
.basic-task-create-form fieldset { min-width: 0; margin: 0; padding: 14px; border: 1px solid #c9dcd3; border-radius: 11px; }
.basic-task-create-form legend { padding: 0 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.basic-task-create-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.basic-reminder-detail-modal { width: min(600px, 96vw); }
.basic-reminder-detail-body p { margin: 0; padding: 15px; border: 1px solid #c9dcd3; border-radius: 11px; background: #f4f8f6; color: #31483d; font-size: 16px; line-height: 1.7; overflow-wrap: anywhere; }
.basic-reminder-detail-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.teacher-basic-dialogue { grid-column: 3; grid-row: 1; grid-template-rows: auto auto minmax(0, 1fr) !important; }
.basic-dialogue-pane-head { align-items: flex-start; }
.basic-dialogue-student-card { flex: 0 1 210px; display: grid; gap: 3px; padding: 8px 10px; border: 1px solid #a9cbbb; border-radius: 10px; background: #eef8f3; color: #294a3b; line-height: 1.35; }
.basic-dialogue-student-card strong { font-size: 14px; }
.basic-dialogue-student-card small { color: #4e665a; font-size: 12px; font-weight: 700; }
.basic-dialogue-student-card .basic-session-attention { margin-top: 2px; }
.basic-dialogue-layout { min-height: 0; display: grid; grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.6fr); gap: 16px; overflow: hidden; }
.basic-dialogue-layout.is-topic-drilldown { grid-template-columns: minmax(180px, 0.6fr) minmax(0, 1.6fr); }
.basic-topic-conversation-detail { min-width: 0; min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 12px; overflow: hidden; }
.teacher-basic-topic-student-list,
.teacher-basic-session-list { min-height: 0; display: grid; grid-template-columns: 1fr; align-content: start; gap: 10px; overflow-y: auto; padding: 2px 5px 2px 0; }
.basic-dialogue-column-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 2px 2px 7px; color: #4f3862; }
.basic-dialogue-column-heading small { color: #66716b; font-weight: 700; }
.teacher-root.is-basic .teacher-basic-topic-student-list .workspace-list-button { height: auto; min-height: 88px; min-block-size: 88px; }
.basic-topic-conversation-detail .teacher-basic-session-list { grid-auto-flow: column; grid-auto-columns: minmax(180px, 0.8fr); grid-template-columns: none; max-height: 112px; overflow-x: auto; overflow-y: hidden; padding-bottom: 4px; }
.basic-topic-conversation-detail .teacher-basic-session-list .workspace-list-button { min-height: 88px; min-block-size: 88px; }
.teacher-root.is-basic .teacher-basic-session-list .workspace-list-button { height: auto; min-height: 96px; min-block-size: 96px; }
.teacher-basic-session-list .workspace-list-button strong { font-size: 16px; line-height: 1.4; font-weight: 750; }
.teacher-basic-session-list .workspace-list-button small { font-size: 14px; line-height: 1.5; font-weight: 650; }
.teacher-basic-session-list .workspace-session-button.has-attention { border-color: #d29b38; background: #fffaf0; }
.basic-session-attention { width: fit-content; display: inline-flex; align-items: center; min-height: 28px; padding: 3px 9px; border: 1px solid #c98221; border-radius: 999px; background: #fff0cf; color: #7b4300 !important; font-size: 13px !important; line-height: 1.3 !important; font-weight: 850 !important; }
.teacher-basic-message-panel { min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 14px; overflow: hidden; padding: 16px; border: 1px solid #e2e8e4; border-radius: 14px; background: #fbfdfc; }
.teacher-basic-message-panel > .empty { place-self: center; max-width: 28rem; margin: 0; padding: 16px; border: 0; background: transparent; text-align: center; }
.basic-message-heading { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.basic-message-heading strong { min-width: 0; overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; word-break: normal; line-height: 1.45; }
.basic-message-heading .compact-action { flex: 0 0 auto; }
.basic-message-list { min-height: 0; overflow-y: auto; padding-right: 4px; }
.basic-message-list .workspace-message-bubble { max-width: 92%; }
.teacher-basic-insight { display: grid; gap: 8px; padding: 11px 12px; border: 1px solid #a9cbbb; border-radius: 10px; background: #eef8f3; }
.teacher-basic-insight p { margin: 0; color: #4e665a; line-height: 1.5; }
.teacher-basic-weekly-insight ul { margin: 0; padding-left: 20px; color: #41594d; line-height: 1.5; }
.teacher-basic-bottom-nav { display: none; }
.teacher-basic-pane :where(h2, h3, p, strong, small, span),
.teacher-basic-bottom-nav span { min-width: 0; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.teacher-basic-scroll-list > *,
.teacher-basic-session-list > * { max-width: 100%; }
.teacher-basic-scroll-list > .workspace-list-button,
.teacher-basic-scroll-list > .topic-card,
.teacher-basic-session-list > .workspace-list-button { overflow: visible; }
.basic-student-button > *,
.basic-task-card > *,
.teacher-basic-session-list .workspace-list-button > * { min-width: 0; max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.teacher-root.is-basic :where(button, a, select, input, summary) { min-height: 44px; }
.teacher-root.is-basic :where(button, a, select, input, summary):focus-visible { outline: 3px solid #1c6e8c; outline-offset: 2px; }
.dashboard-grid { width: 100%; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 14px; }
.dashboard-section { grid-column: span 12; display: grid; gap: 10px; min-width: 0; padding: 4px 0 8px; border-top: 1px solid rgba(120, 143, 160, 0.28); }
.dashboard-section:first-child { border-top: 0; padding-top: 0; }
.dashboard-section-grid { align-items: start; }
.teacher-section-title { display: flex; justify-content: space-between; align-items: end; gap: 12px; min-height: 46px; }
.teacher-section-title h2 { font-size: 20px; }
.focus-section .priority-actions,
.focus-section .reminders-panel,
.student-section .student-support-panel { border-color: #b9d9df; }
.panel { padding: 16px; min-width: 0; }
.teacher-main > .dashboard-grid { margin: 0; }
.span-12 { grid-column: span 12; }
.span-8 { grid-column: span 8; }
.span-6 { grid-column: span 6; }
.span-4 { grid-column: span 4; }
.section-heading { align-items: start; gap: 12px; }
.section-heading-actions { display: inline-flex; flex-wrap: wrap; gap: 8px; justify-content: end; align-items: center; }
.section-toggle { display: none; }
.section-body { min-width: 0; }
.dashboard-toolbar { display: grid; gap: 10px; align-items: start; }
.dashboard-toolbar .class-selector { margin-top: 0; }
.dashboard-account-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.dashboard-toolbar .account-pill { background: var(--panel-soft); color: var(--text); border-color: var(--line); }
.safety-controls { display: grid; gap: 12px; }
.safety-controls .toolbar-actions { justify-content: flex-start; }
.safety-keyword-panel { display: grid; gap: 12px; }
.safety-keyword-modal-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.safety-keyword-form,
.safety-keyword-edit-grid { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(120px, auto) minmax(120px, auto) auto auto; gap: 8px; align-items: end; }
.safety-keyword-form label { display: grid; gap: 7px; color: var(--muted); font-size: 15px; font-weight: 800; }
.safety-keyword-list { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.safety-keyword-item { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: #fbfdff; }
.safety-keyword-item.is-system { background: var(--panel-soft); }
.safety-keyword-edit-grid input,
.safety-keyword-edit-grid select { width: 100%; }
.safety-keyword-modal-backdrop { position: fixed; inset: 0; z-index: 1100; display: grid; place-items: center; padding: 20px; background: rgba(17, 24, 39, 0.62); }
.safety-keyword-modal { width: min(840px, 96vw); max-height: min(800px, 92vh); display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); color: var(--text); box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35); }
.safety-keyword-modal-head h3 { margin: 2px 0 0; font-size: 24px; line-height: 1.35; }
.safety-keyword-modal-body { min-height: 0; overflow: auto; padding: 18px; background: var(--panel); }
.safety-keyword-modal-body .safety-keyword-list { margin: 0; }
.semantic-mask-description { margin: 0 0 14px; color: var(--muted); font-size: 16px; line-height: 1.65; }
.semantic-mask-form { margin-bottom: 20px; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.semantic-mask-form :is(input, select, button) { min-height: 48px; font-size: 16px; }
.semantic-mask-section { display: grid; gap: 12px; padding: 18px 0; border-top: 1px solid var(--line); }
.semantic-mask-section:first-of-type { border-top: 0; padding-top: 0; }
.semantic-mask-section-heading { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.semantic-mask-section-heading > div { min-width: 0; }
.semantic-mask-section-heading h4 { margin: 2px 0 0; font-size: 20px; line-height: 1.4; }
.semantic-mask-section-heading small { display: block; margin-top: 4px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.safety-keyword-modal .safety-keyword-item strong { font-size: 17px; line-height: 1.5; }
.safety-keyword-modal .safety-keyword-item small { display: block; margin-top: 3px; font-size: 14px; line-height: 1.5; }
.safety-keyword-modal .safety-keyword-item .chip { flex: 0 0 auto; font-size: 13px; }
.safety-keyword-modal .safety-keyword-edit-grid :is(input, select, button) { min-height: 46px; font-size: 15px; }
.student-management-modal-backdrop { position: fixed; inset: 0; z-index: 1150; display: grid; place-items: center; padding: 20px; background: rgba(17, 24, 39, 0.62); }
.student-management-modal { width: min(860px, 96vw); max-height: min(760px, 92vh); display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); color: var(--text); box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35); }
.student-management-modal-head { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 14px; border-bottom: 1px solid var(--line); }
.student-management-modal-head h2 { margin: 0; font-size: 24px; }
.student-management-modal-head p:last-child { margin: 6px 0 0; color: var(--muted); line-height: 1.5; }
.student-management-modal-close { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; padding: 0; border-radius: 999px; font-size: 24px; line-height: 1; }
.student-management-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 10px 20px; border-bottom: 1px solid var(--line); background: var(--panel-soft); }
.student-management-tabs button { min-width: 0; min-height: 44px; border-color: transparent; background: transparent; color: var(--muted); }
.student-management-tabs button:hover,
.student-management-tabs button:focus-visible,
.student-management-tabs button.is-active { border-color: var(--brand); background: var(--panel); color: var(--brand-strong); }
.student-management-modal-body { min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 20px; }
.student-management-modal-section { display: grid; gap: 18px; }
.student-management-section-copy h3 { margin: 0 0 6px; font-size: 19px; }
.student-management-section-copy p { margin: 0; color: var(--muted); line-height: 1.6; }
.roster-import-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.roster-import-heading > div { min-width: 0; }
.roster-template-button { flex: 0 0 auto; min-height: 44px; white-space: nowrap; }
.roster-encoding-note { margin: -6px 0 0; padding: 10px 12px; border: 1px solid #b8dbe4; border-radius: 9px; background: var(--brand-soft); color: var(--brand-strong); font-size: 13px; font-weight: 700; line-height: 1.55; }
.student-management-modal-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.student-management-modal-form.import { grid-template-columns: minmax(220px, 1.4fr) repeat(2, minmax(160px, 0.8fr)); }
.student-management-modal-form label { min-width: 0; display: grid; gap: 7px; color: var(--muted); font-size: 13px; font-weight: 800; }
.student-management-modal-form input,
.student-management-modal-form select { width: 100%; min-height: 44px; }
.student-management-modal-actions { display: flex; justify-content: flex-end; gap: 10px; }
.student-management-modal-actions button { min-height: 44px; min-width: 120px; }
.student-management-modal-actions.split { justify-content: flex-start; flex-wrap: wrap; }
.managed-student-crud-list { display: grid; gap: 14px; }
.managed-student-crud-list .managed-student-list { display: grid; gap: 12px; margin: 0; }
.managed-student-crud-list .managed-student-list > li { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); }
.managed-student-edit-form { margin: 0; }
.student-management-class-list { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel-soft); }
.student-management-warning,
.student-management-modal-error { margin: 0; padding: 12px 14px; border: 1px solid #e6c477; border-radius: 10px; background: #fff8e4; color: #704b00; line-height: 1.5; }
.student-management-modal-error { border-color: #efb3b3; background: #fff1f1; color: var(--danger); }
.student-management-modal-error p { margin: 5px 0 0; }
.student-management-modal-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 11px 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; font-weight: 800; }
.basic-class-management-modal { width: min(1080px, calc(100vw - 40px)); max-height: min(820px, calc(100dvh - 40px)); grid-template-rows: auto minmax(0, 1fr) auto; }
.basic-class-management-modal-body { padding: 18px 20px 20px; }
.basic-class-management-modal-body .class-management-grid { grid-template-columns: minmax(300px, 0.72fr) minmax(460px, 1.28fr); gap: 18px; }
.basic-class-management-modal-body :is(.class-create-panel, .class-list-panel) { gap: 16px; padding: 18px; border-radius: 12px; }
.basic-class-management-modal-body .class-create-panel { align-content: start; background: #f3f8f5; }
.basic-class-management-modal-body .class-list-panel { min-height: 0; background: #fbfcfd; }
.class-management-section-heading { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.class-management-section-heading h3,
.class-management-section-heading h4 { margin: 2px 0 0; line-height: 1.35; }
.class-management-section-heading > div { min-width: 0; }
.class-management-section-heading p:last-child { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.class-create-fields { display: grid; grid-template-columns: 1fr; gap: 12px; }
.class-create-fields label,
.class-management-card-editor label { min-width: 0; display: grid; gap: 7px; color: var(--muted); font-size: 13px; font-weight: 800; }
.class-create-fields input,
.class-management-card-editor input { width: 100%; min-height: 44px; }
.class-create-submit { width: 100%; min-height: 44px; }
.class-list-heading { align-items: center; }
.class-list-heading-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }
.class-list-heading-actions button { min-height: 38px; padding: 8px 12px; }
.basic-class-management-modal-body .class-management-list { min-height: 0; max-height: min(530px, 58vh); display: grid; gap: 10px; margin: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.class-management-list .class-management-card { gap: 12px; padding: 14px; border-radius: 10px; background: var(--panel); }
.class-management-card-summary { min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.class-management-card-title { min-width: 0; display: grid; gap: 3px; }
.class-management-card-title strong { overflow-wrap: anywhere; font-size: 16px; line-height: 1.4; }
.class-management-card-title small { color: var(--muted); overflow-wrap: anywhere; }
.class-management-card-meta { display: flex; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 800; }
.class-management-card-editor { min-width: 0; display: grid; grid-template-columns: minmax(180px, 1fr) auto; align-items: end; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.class-management-card-actions { display: flex; gap: 8px; }
.class-management-card-actions button { min-width: 92px; min-height: 44px; padding: 9px 12px; }
.basic-class-management-modal-foot { align-items: center; }
.basic-class-management-modal-foot small { max-width: 700px; font-size: 13px; line-height: 1.5; }
.teacher-basic-pane-head-actions { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.workspace-tabs { grid-column: span 12; display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); }
.workspace-tab { min-height: 34px; padding: 7px 12px; border-color: transparent; background: transparent; color: var(--muted); }
.workspace-tab:hover,
.workspace-tab:focus-visible,
.workspace-tab.is-active { background: var(--panel); color: var(--brand-strong); border-color: var(--line); outline: none; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.metric { padding: 12px; box-shadow: none; }
.metric span { display: block; color: var(--muted); font-size: 12px; font-weight: 800; }
.metric strong { display: block; margin-top: 4px; font-size: 22px; }
.priority-actions { display: grid; gap: 12px; }
.priority-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.priority-card { min-height: 138px; display: grid; align-content: space-between; gap: 10px; padding: 13px; border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: 8px; background: #fbfdff; }
.priority-card.high { border-left-color: var(--danger); }
.priority-card.medium { border-left-color: var(--warn); }
.priority-card.low { border-left-color: var(--good); }
.priority-card h3 { margin: 10px 0 6px; }
.priority-card p { margin: 0; color: #40506a; line-height: 1.55; }
.priority-card button { width: fit-content; }
.focus-snapshot { display: grid; gap: 12px; }
.focus-snapshot-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.focus-snapshot-card { min-width: 0; display: grid; gap: 8px; align-content: start; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.focus-snapshot-card strong { font-size: 24px; line-height: 1.2; overflow-wrap: anywhere; }
.focus-snapshot-card p { margin: 0; color: var(--muted); font-size: 13px; font-weight: 700; line-height: 1.45; }
.focus-snapshot-card button { width: fit-content; }
.focus-alert-preview { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.compact-list { display: grid; gap: 6px; padding: 0; margin: 0; list-style: none; }
.compact-list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; align-items: start; padding: 8px 0; border-top: 1px solid var(--line); }
.compact-list li:first-child { border-top: 0; padding-top: 0; }
.compact-list p { margin: 0; color: var(--muted); line-height: 1.5; }
.list { display: grid; gap: 8px; padding: 0; margin: 12px 0 0; list-style: none; }
.list li { display: grid; gap: 4px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fbfcfd; }
.list-row { display: flex; gap: 8px; justify-content: space-between; align-items: flex-start; }
.filter-row, .student-row { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); gap: 8px; align-items: end; margin-top: 12px; }
.class-management-panel,
.student-management-panel { display: grid; gap: 14px; }
.class-management-grid,
.student-management-grid { display: grid; grid-template-columns: 1fr; gap: 14px; align-items: start; }
.class-create-panel,
.class-list-panel,
.student-create-panel,
.student-list-panel { min-width: 0; display: grid; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.student-management-form { grid-template-columns: minmax(180px, 1.2fr) minmax(140px, 0.8fr) minmax(140px, 0.8fr) minmax(112px, 0.6fr) minmax(88px, auto) minmax(88px, auto); align-items: end; }
.student-create-panel .student-management-form { grid-template-columns: minmax(200px, 1.2fr) minmax(140px, 0.8fr) minmax(140px, 0.8fr) minmax(112px, 0.6fr) minmax(104px, auto); }
.student-management-form input,
.student-management-form select { width: 100%; }
.learning-record-workspace { display: grid; gap: 14px; min-height: 0; }
.learning-record-grid { height: min(720px, calc(100vh - 190px)); min-height: 420px; display: grid; grid-template-columns: minmax(220px, 0.24fr) minmax(280px, 0.34fr) minmax(360px, 1fr); gap: 14px; align-items: stretch; min-width: 0; min-height: 0; }
.workspace-student-list,
.workspace-session-list,
.workspace-message-timeline { min-width: 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 12px; align-content: start; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.workspace-student-list,
.workspace-session-list,
.workspace-message-timeline { scrollbar-gutter: stable; }
.workspace-pane-head { display: grid; gap: 4px; }
.workspace-pane-head h3 { margin: 0; }
.workspace-search { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 800; }
.workspace-search input { width: 100%; min-height: 36px; background: var(--panel); }
.workspace-button-list,
.workspace-folder-list { display: grid; gap: 8px; min-width: 0; }
.workspace-folder-group { display: grid; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.workspace-folder-group:first-child { padding-top: 0; border-top: 0; }
.workspace-folder-title { display: flex; justify-content: space-between; gap: 8px; align-items: center; min-width: 0; }
.workspace-list-button { width: 100%; min-height: 72px; display: grid; gap: 5px; justify-items: start; align-content: start; text-align: left; padding: 10px 11px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); }
.workspace-list-button:hover,
.workspace-list-button:focus-visible,
.workspace-list-button.is-active { border-color: var(--brand); background: #eef9fb; box-shadow: inset 4px 0 0 var(--brand); outline: none; }
.workspace-list-button strong { line-height: 1.35; }
.workspace-list-button small,
.workspace-list-button span { color: var(--muted); font-weight: 700; line-height: 1.45; }
.workspace-session-button span { font-size: 12px; }
.workspace-message-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.workspace-message-card { width: 100%; max-width: none; display: grid; gap: 4px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.workspace-message-card.user { justify-items: end; }
.workspace-message-card.assistant { justify-items: start; background: transparent; }
.workspace-message-meta { width: fit-content; max-width: min(82%, 760px); display: flex; flex-wrap: wrap; align-items: center; gap: 5px 8px; color: var(--muted); font-size: 12px; font-weight: 800; line-height: 1.35; }
.workspace-message-card.user .workspace-message-meta { justify-content: flex-end; text-align: right; }
.workspace-message-card.assistant .workspace-message-meta { justify-content: flex-start; text-align: left; }
.workspace-message-meta small { color: var(--muted); font-size: 12px; font-weight: 800; line-height: 1.35; }
.workspace-message-meta .chip { min-height: 22px; padding: 2px 7px; font-size: 11px; }
.workspace-message-bubble { width: fit-content; max-width: min(82%, 760px); margin: 0; padding: 9px 12px; border: 1px solid var(--line); border-radius: 18px; color: var(--text); line-height: 1.58; white-space: pre-wrap; overflow-wrap: anywhere; }
.workspace-message-bubble.markdown-body { min-width: 0; line-height: 1.72; white-space: normal; overflow-x: hidden; }
.workspace-message-bubble.markdown-body > * { margin: 0 0 10px; }
.workspace-message-bubble.markdown-body > *:last-child { margin-bottom: 0; }
.workspace-message-bubble.markdown-body h3,
.workspace-message-bubble.markdown-body h4,
.workspace-message-bubble.markdown-body h5 { margin-top: 14px; margin-bottom: 8px; color: #1f2937; font-size: 16px; line-height: 1.35; }
.workspace-message-bubble.markdown-body ul { padding-left: 22px; }
.workspace-message-bubble.markdown-body li + li { margin-top: 4px; }
.workspace-message-bubble.markdown-body code { padding: 2px 5px; border-radius: 6px; background: #f1f5f9; color: #172033; font-size: 0.94em; }
.workspace-message-bubble.markdown-body pre { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; overflow-x: auto; padding: 12px; border-radius: 8px; background: #111827; color: #f8fafc; }
.workspace-message-bubble.markdown-body pre code { padding: 0; background: transparent; color: inherit; }
.workspace-message-card.user .workspace-message-bubble { margin-left: auto; background: #f4f4f4; border-color: #e5e5e5; color: #202123; }
.workspace-message-card.assistant .workspace-message-bubble { margin-right: auto; padding-left: 0; border-color: transparent; background: transparent; }
.workspace-message-card.is-highlighted .workspace-message-bubble { border-color: #b7791f; box-shadow: 0 0 0 3px rgba(183, 121, 31, 0.18); }
.workspace-message-card.is-highlighted .workspace-message-meta { color: #7c4a03; }
.workspace-message-card.user .workspace-message-attachments { justify-items: end; }
.workspace-message-card.assistant .workspace-message-attachments { justify-items: start; }
.workspace-message-attachments { width: min(82%, 760px); display: grid; gap: 8px; }
.workspace-attachment-card { width: min(520px, 100%); display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--text); }
.workspace-attachment-card.image { grid-template-columns: 86px minmax(0, 1fr) auto; }
.workspace-attachment-card strong,
.workspace-attachment-card small { display: block; overflow-wrap: anywhere; }
.workspace-attachment-card small { color: var(--muted); font-size: 12px; font-weight: 700; }
.workspace-attachment-preview { width: 86px; height: 64px; min-height: 64px; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-soft); color: var(--muted); }
.workspace-attachment-preview img,
.workspace-attachment-preview span { width: 100%; height: 100%; display: grid; place-items: center; object-fit: cover; font-size: 12px; }
.workspace-file-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; background: var(--brand-soft); color: var(--brand-strong); font-size: 11px; font-weight: 900; }
.attachment-preview-overlay { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 24px; background: rgba(17, 24, 39, 0.72); }
.attachment-preview-modal { width: min(1100px, 96vw); height: min(760px, 92vh); display: grid; grid-template-rows: auto minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); color: var(--text); box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35); }
.attachment-preview-head { display: flex; gap: 12px; justify-content: space-between; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.attachment-preview-head button { width: 34px; min-width: 34px; min-height: 34px; padding: 0; border-radius: 999px; }
.attachment-preview-body { min-height: 0; display: grid; place-items: center; padding: 12px; background: var(--panel-soft); }
.attachment-preview-body img,
.attachment-preview-body iframe { width: 100%; height: 100%; max-width: 100%; max-height: 100%; border: 0; object-fit: contain; background: #ffffff; }
.workspace-evidence-check { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.workspace-evidence-check input { min-height: 0; width: 18px; height: 18px; padding: 0; }
.learning-record-list-panel { display: grid; gap: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.learning-record-list .toolbar-actions { margin-top: 4px; }
.learning-record-list p { margin: 4px 0 0; line-height: 1.55; }
.student-row { grid-template-columns: minmax(180px, 320px) auto; justify-content: start; }
.student-support-panel { display: grid; gap: 14px; }
.student-support-workspace { display: grid; grid-template-columns: minmax(260px, 360px) minmax(0, 1fr); gap: 14px; align-items: start; }
.student-list-pane, .student-detail-card { display: grid; gap: 12px; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.student-pane-heading h3, .current-student-heading h3 { margin-top: 0; }
.student-filter-row { grid-template-columns: minmax(160px, 1fr); margin-top: 0; }
.student-filter-row input, .student-filter-row select, .student-filter-row button { width: 100%; }
.student-list { display: grid; grid-template-columns: 1fr; gap: 10px; list-style: none; padding: 0; margin: 0; }
.student-card { width: 100%; min-height: 112px; justify-content: start; align-items: start; text-align: left; display: grid; gap: 6px; background: #fbfdff; color: var(--text); border: 1px solid var(--line); }
.student-card:hover, .student-card.active { border-color: var(--brand); box-shadow: 0 0 0 2px rgba(15, 96, 118, 0.14); }
.student-card.active { background: #eef9fb; }
.student-card span, .student-card small { color: var(--muted); font-weight: 700; }
.student-detail-pane { min-width: 0; }
.student-summary-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.teacher-action-list { display: grid; gap: 10px; margin-top: 12px; padding: 13px; border: 1px solid var(--line); border-radius: 8px; background: #f7fbf9; }
.teacher-action-list h3 { margin-top: 0; }
.teacher-action-list ul { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.teacher-action-list li { padding: 9px 10px; border: 1px solid rgba(15, 96, 118, 0.14); border-radius: 8px; background: #fff; color: var(--text); font-size: 14px; font-weight: 700; line-height: 1.45; }
.alert-action-row { display: grid; grid-template-columns: auto minmax(140px, 180px) minmax(220px, 1fr) auto; gap: 8px; align-items: end; margin-top: 10px; }
.alert-action-row label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.weekly-section { margin-top: 12px; }
.weekly-export { display: grid; gap: 10px; margin-top: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.teacher-topic-workspace { display: grid; gap: 14px; }
.topic-workspace-grid { display: grid; grid-template-columns: minmax(240px, 0.32fr) minmax(260px, 0.34fr) minmax(320px, 1fr); gap: 14px; align-items: start; }
.topic-compose-panel,
.topic-list-panel,
.topic-detail-panel { min-width: 0; display: grid; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.topic-compose-panel label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.topic-compose-panel textarea { min-height: 96px; resize: vertical; }
.class-check-list { display: grid; gap: 6px; margin-top: 6px; }
.class-check-item { min-height: 44px; display: flex; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); font-size: 13px; font-weight: 800; }
.class-check-item input[type="checkbox"] { flex: 0 0 18px; width: 18px; min-width: 18px; height: 18px; min-height: 18px; padding: 0; border-radius: 4px; accent-color: var(--brand); }
.topic-publish-classes { display: grid; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.topic-card { width: 100%; min-height: 96px; display: grid; gap: 6px; align-content: start; justify-items: start; text-align: left; border-color: var(--line); background: #fff; color: var(--text); }
.topic-card span,
.topic-card small { color: var(--muted); font-weight: 700; }
.topic-card.is-active { border-color: var(--brand); background: #eef9fb; box-shadow: inset 4px 0 0 var(--brand); }
.topic-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.reminders-panel { display: grid; gap: 12px; }
.reminders-summary { margin-top: 0; }
.reminder-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 10px; padding: 0; margin: 0; list-style: none; }
.reminder-item { min-height: 132px; display: grid; align-content: space-between; gap: 8px; padding: 14px; border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: 8px; background: #fbfdff; }
.reminder-item.high { border-left-color: var(--danger); }
.reminder-item.medium { border-left-color: var(--warn); }
.reminder-item.low { border-left-color: var(--good); }
.reminder-item.is-read { opacity: 0.78; background: #f7fafb; }
.reminder-item p { margin: 6px 0 0; color: #40506a; line-height: 1.55; }
.reminder-action-row { align-items: center; display: flex; gap: 12px; justify-content: space-between; }
.reminder-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.reminder-secondary-actions { display: inline-flex; flex-wrap: wrap; gap: 4px; }
button.button-tertiary { min-height: 32px; padding: 6px 8px; border-color: transparent; background: transparent; color: var(--muted); }
button.button-tertiary:hover { background: #eef5f7; color: var(--brand-strong); }
.support-note { display: grid; gap: 10px; margin-top: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: #fbfdff; }
.support-note label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 800; }
.support-note textarea { min-height: 96px; resize: vertical; }
.empty { margin: 12px 0 0; padding: 14px; border: 1px dashed #b8c6d2; border-radius: 8px; color: var(--muted); background: #fbfcfd; }
.more-button { margin-top: 12px; }
.notice, .error-panel { padding: 16px; }
.teacher-toast {
  position: fixed;
  top: calc(88px + env(safe-area-inset-top, 0px));
  right: 20px;
  z-index: 100;
  width: min(420px, calc(100vw - 40px));
  max-height: min(180px, calc(100dvh - 120px));
  overflow-y: auto;
  border-color: #92c8d5;
  border-left: 5px solid var(--brand);
  background: #f4fbfd;
  color: var(--text);
  box-shadow: 0 18px 44px rgba(17, 24, 39, 0.22);
  pointer-events: none;
  animation: teacher-toast-enter 180ms ease-out;
}
.teacher-toast strong { display: block; line-height: 1.5; }
@keyframes teacher-toast-enter {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.error-panel { border-color: #efb3b3; }
.error-panel strong { color: var(--danger); }
.error-panel pre { overflow: auto; max-height: 220px; padding: 10px; border-radius: 8px; background: #f3f5f8; }
.hidden { display: none !important; }

body[data-theme="dark"] { background: #10120f; color: var(--text); }
body[data-theme="dark"] .teacher-root { background: #10120f; }
body[data-theme="dark"] .teacher-sidebar { background: #191d17; border-right-color: #333a30; color: var(--text); }
body[data-theme="dark"] .teacher-main,
body[data-theme="dark"] .login-empty-main { background: #121510; }
body[data-theme="dark"] button:disabled { background: #232820; color: #858d80; border-color: #343b31; }
body[data-theme="dark"] .topbar,
body[data-theme="dark"] .panel,
body[data-theme="dark"] .metric,
body[data-theme="dark"] .notice,
body[data-theme="dark"] .error-panel,
body[data-theme="dark"] .sidebar-sessions-panel { background: var(--panel); border-color: var(--line); color: var(--text); box-shadow: none; }
body[data-theme="dark"] .teacher-toast { border-color: #4d7680; border-left-color: #70b9ca; background: #17282c; box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42); }
body[data-theme="dark"] .student-management-modal,
body[data-theme="dark"] .student-management-modal-body { background: var(--panel); border-color: var(--line); color: var(--text); }
body[data-theme="dark"] .student-management-tabs,
body[data-theme="dark"] .student-management-class-list { background: #171b15; border-color: var(--line); }
body[data-theme="dark"] .basic-class-management-modal-body :is(.class-create-panel, .class-list-panel) { background: #171b15; border-color: var(--line); }
body[data-theme="dark"] .class-management-list .class-management-card { background: #20251e; border-color: var(--line); }
body[data-theme="dark"] .student-management-tabs button.is-active { background: #20251e; color: var(--text); }
body[data-theme="dark"] .student-management-warning { border-color: #7a6431; background: #2d2818; color: #f1d78e; }
body[data-theme="dark"] .student-management-modal-error { border-color: #8f4d4d; background: #321d1d; color: #ffcaca; }
body[data-theme="dark"] .sidebar-brand,
body[data-theme="dark"] .sidebar-sessions-panel,
body[data-theme="dark"] .sidebar-links { border-color: #333a30; }
body[data-theme="dark"] .sidebar-profile-list div { background: #1a1f18; border-color: #333a30; }
body[data-theme="dark"] .sidebar-profile-list strong { color: var(--text); }
body[data-theme="dark"] .sidebar-profile-list small { color: var(--muted); }
body[data-theme="dark"] .teacher-sidebar button.secondary,
body[data-theme="dark"] .nav-actions a,
body[data-theme="dark"] .ghost-link,
body[data-theme="dark"] .ghost-btn,
body[data-theme="dark"] .primary-btn,
body[data-theme="dark"] .session-item { color: var(--text); background: transparent; border-color: transparent; }
body[data-theme="dark"] .teacher-sidebar button.secondary:hover,
body[data-theme="dark"] .teacher-sidebar button.secondary:focus-visible,
body[data-theme="dark"] .nav-actions a:hover,
body[data-theme="dark"] .ghost-link:hover,
body[data-theme="dark"] .ghost-link:focus-visible,
body[data-theme="dark"] .ghost-btn:hover,
body[data-theme="dark"] .ghost-btn:focus-visible,
body[data-theme="dark"] .primary-btn:hover,
body[data-theme="dark"] .primary-btn:focus-visible,
body[data-theme="dark"] .session-item:hover,
body[data-theme="dark"] .session-item:focus-visible,
body[data-theme="dark"] .session-item.is-active { background: #252b22; border-color: #3b4538; }
body[data-theme="dark"] input,
body[data-theme="dark"] select,
body[data-theme="dark"] textarea { background: #141711; color: var(--text); border-color: #384034; }
body[data-theme="dark"] input:focus,
body[data-theme="dark"] select:focus,
body[data-theme="dark"] textarea:focus { border-color: var(--brand); outline-color: rgba(138, 183, 167, 0.26); }
body[data-theme="dark"] .sidebar-return-link { background: #1f241c; color: var(--text); border-color: #4a5745; }
body[data-theme="dark"] .sidebar-return-link:hover,
body[data-theme="dark"] .sidebar-return-link:focus-visible { background: #252b22; border-color: #6f8066; }
body[data-theme="dark"] .account-pill,
body[data-theme="dark"] .status-pill,
body[data-theme="dark"] .chip { background: #26362f; color: #d9ebe3; border-color: #385848; }
body[data-theme="dark"] .status-pill.raw,
body[data-theme="dark"] button.danger-soft { background: #3a2522; color: #ffb4a8; border-color: #6f3b35; }
body[data-theme="dark"] .chip.good { background: #20372c; color: #9bd4bd; }
body[data-theme="dark"] .chip.warn { background: #3a321f; color: #e6c477; }
body[data-theme="dark"] .chip.danger { background: #3a2522; color: #ffb4a8; }
body[data-theme="dark"] .hero-copy p,
body[data-theme="dark"] .priority-card p,
body[data-theme="dark"] .reminder-item p,
body[data-theme="dark"] .brand small,
body[data-theme="dark"] .muted,
body[data-theme="dark"] small,
body[data-theme="dark"] .eyebrow,
body[data-theme="dark"] .workspace-nav-item small { color: var(--muted); }
body[data-theme="dark"] .workspace-nav-group { border-top-color: #333a30; }
body[data-theme="dark"] .workspace-nav-group-label { color: var(--muted); }
body[data-theme="dark"] .workspace-nav-badge { border-color: #4a5745; background: #1a1f18; color: var(--text); }
body[data-theme="dark"] .workspace-nav-badge.warn { border-color: #8c6d2d; background: #332817; color: #f4d98a; }
body[data-theme="dark"] .workspace-nav-badge.danger { border-color: #8b4f47; background: #351f1c; color: #ffd0ca; }
body[data-theme="dark"] .workspace-nav-badge.good { border-color: #53715f; background: #1f3025; color: #bde8cb; }
body[data-theme="dark"] .dashboard-section { border-top-color: #31372f; }
body[data-theme="dark"] .focus-section .priority-actions,
body[data-theme="dark"] .focus-section .focus-snapshot,
body[data-theme="dark"] .student-section .student-support-panel { border-color: #405045; }
body[data-theme="dark"] .workspace-tabs,
body[data-theme="dark"] .safety-controls,
body[data-theme="dark"] .dashboard-toolbar .account-pill { background: var(--panel-soft); border-color: var(--line); }
body[data-theme="dark"] .workspace-tab:hover,
body[data-theme="dark"] .workspace-tab:focus-visible,
body[data-theme="dark"] .workspace-tab.is-active { background: #1a1f18; color: var(--brand-strong); border-color: #465341; }
body[data-theme="dark"] .safety-keyword-modal,
body[data-theme="dark"] .safety-keyword-modal-body { background: var(--panel); color: var(--text); }
body[data-theme="dark"] .priority-card,
body[data-theme="dark"] .safety-keyword-item,
body[data-theme="dark"] .focus-snapshot-card,
body[data-theme="dark"] .focus-alert-preview,
body[data-theme="dark"] .class-create-panel,
body[data-theme="dark"] .class-list-panel,
body[data-theme="dark"] .student-create-panel,
body[data-theme="dark"] .student-list-panel,
body[data-theme="dark"] .workspace-student-list,
body[data-theme="dark"] .workspace-session-list,
body[data-theme="dark"] .workspace-message-timeline,
body[data-theme="dark"] .student-list-pane,
body[data-theme="dark"] .student-detail-card,
body[data-theme="dark"] .topic-compose-panel,
body[data-theme="dark"] .topic-list-panel,
body[data-theme="dark"] .topic-detail-panel,
body[data-theme="dark"] .topic-publish-classes,
body[data-theme="dark"] .weekly-export,
body[data-theme="dark"] .list li,
body[data-theme="dark"] .reminder-item,
body[data-theme="dark"] .teacher-action-list,
body[data-theme="dark"] .teacher-action-list li,
body[data-theme="dark"] .support-note,
body[data-theme="dark"] .empty,
body[data-theme="dark"] .teacher-main:empty::before { background: #1a1f18; border-color: var(--line); color: var(--muted); }
body[data-theme="dark"] .student-card { background: var(--panel); border-color: var(--line); color: var(--text); box-shadow: none; }
body[data-theme="dark"] .student-card:hover,
body[data-theme="dark"] .student-card.active { background: var(--brand-soft); border-color: var(--brand); box-shadow: inset 4px 0 0 var(--brand); }
body[data-theme="dark"] .class-check-item,
body[data-theme="dark"] .topic-card,
body[data-theme="dark"] .workspace-list-button { background: var(--panel); border-color: var(--line); color: var(--text); }
body[data-theme="dark"] .topic-card.is-active { background: var(--brand-soft); border-color: var(--brand); box-shadow: inset 4px 0 0 var(--brand); }
body[data-theme="dark"] .workspace-list-button:hover,
body[data-theme="dark"] .workspace-list-button:focus-visible,
body[data-theme="dark"] .workspace-list-button.is-active { background: var(--brand-soft); border-color: var(--brand); box-shadow: inset 4px 0 0 var(--brand); }
body[data-theme="dark"] .workspace-message-card { background: transparent; color: var(--text); }
body[data-theme="dark"] .workspace-message-meta,
body[data-theme="dark"] .workspace-message-meta small { color: var(--muted); }
body[data-theme="dark"] .workspace-message-card.user .workspace-message-bubble { background: #252923; border-color: #3d453a; color: var(--text); }
body[data-theme="dark"] .workspace-message-card.assistant .workspace-message-bubble { background: transparent; border-color: transparent; color: var(--text); }
body[data-theme="dark"] .workspace-message-bubble.markdown-body h3,
body[data-theme="dark"] .workspace-message-bubble.markdown-body h4,
body[data-theme="dark"] .workspace-message-bubble.markdown-body h5 { color: #f8fafc; }
body[data-theme="dark"] .workspace-message-bubble.markdown-body code { background: rgba(148, 163, 184, 0.18); color: #f8fafc; }
body[data-theme="dark"] .workspace-message-bubble.markdown-body pre { background: #020617; }
body[data-theme="dark"] .workspace-message-card.is-highlighted .workspace-message-bubble { border-color: #d9a441; box-shadow: 0 0 0 3px rgba(217, 164, 65, 0.24); }
body[data-theme="dark"] .workspace-message-card.is-highlighted .workspace-message-meta { color: #f2d28d; }
body[data-theme="dark"] .workspace-folder-group { border-top-color: var(--line); }
body[data-theme="dark"] .learning-record-list-panel { border-top-color: var(--line); }
body[data-theme="dark"] .reminder-item.is-read { background: #171b15; }
body[data-theme="dark"] .error-panel pre { background: #141711; }
body[data-theme="dark"] .compact-list li { border-top-color: var(--line); }
body[data-theme="dark"] button.button-tertiary:hover { background: #26362f; color: #d9ebe3; }
body[data-theme="dark"] .teacher-basic-header { background: #191d17; border-bottom-color: #3b4538; }
body[data-theme="dark"] .teacher-basic-workflow-switch { border-color: #536550; background: #20251e; }
body[data-theme="dark"] .teacher-basic-workflow-switch button { color: #d6e6da; }
body[data-theme="dark"] .teacher-basic-workflow-switch button + button { border-left-color: #536550; }
body[data-theme="dark"] .teacher-basic-workflow-switch button.is-active { background: #719d82; color: #102318; }
body[data-theme="dark"] .teacher-basic-header-actions .ghost-link,
body[data-theme="dark"] .teacher-basic-header-actions .ghost-btn { background: #20251e; border-color: #4a5745; color: var(--text); }
body[data-theme="dark"] .teacher-basic-notification-panel { border-color: #4a574f; background: #1c221e; }
body[data-theme="dark"] .teacher-basic-notification-head { border-bottom-color: #455148; background: #263129; }
body[data-theme="dark"] .teacher-basic-notification-head strong { color: #e6f3eb; }
body[data-theme="dark"] .teacher-basic-notification-head small,
body[data-theme="dark"] .teacher-basic-notification-item small { color: #b8c8bf; }
body[data-theme="dark"] .teacher-basic-notification-item { border-color: #465249; background: #202722; color: var(--text); }
body[data-theme="dark"] .teacher-basic-notification-item:hover,
body[data-theme="dark"] .teacher-basic-notification-item:focus-visible { border-color: #82ad98; background: #29352e; }
body[data-theme="dark"] .teacher-basic-alert-shortcut { background: #20251e; border-color: #465341; color: var(--text); }
body[data-theme="dark"] .teacher-basic-alert-shortcut.has-critical { background: #402424; border-color: #a65c5c; }
body[data-theme="dark"] .teacher-basic-class-switcher { border-color: #4a5745; background: #203026; color: #e5f5eb; box-shadow: none; }
body[data-theme="dark"] .teacher-basic-class-switcher select { border-color: #6f927d; background: #171d18; color: #f0faf4; }
body[data-theme="dark"] .teacher-basic-mobile-menu > div { background: #20251e; border-color: #465341; }
body[data-theme="dark"] .teacher-basic-pane { background: #1a1f18; border-color: #465341; box-shadow: none; }
body[data-theme="dark"] .teacher-basic-tasks { border-color: var(--basic-task-border); background: var(--basic-task-bg); box-shadow: inset 0 4px 0 var(--basic-task-accent); }
body[data-theme="dark"] .teacher-basic-people { border-color: var(--basic-people-border); background: var(--basic-people-bg); box-shadow: inset 0 4px 0 var(--basic-people-accent); }
body[data-theme="dark"] .teacher-basic-dialogue { border-color: var(--basic-dialogue-border); background: var(--basic-dialogue-bg); box-shadow: inset 0 4px 0 var(--basic-dialogue-accent); }
body[data-theme="dark"] .teacher-basic-important { border-color: var(--basic-important-border); background: var(--basic-important-bg); box-shadow: inset 0 4px 0 var(--basic-important-accent); }
body[data-theme="dark"] .teacher-basic-pane-head { border-bottom-color: #3c4639; }
body[data-theme="dark"] .basic-dialogue-student-card { border-color: #4a7865; background: #20382e; color: #d9f0e2; }
body[data-theme="dark"] .basic-dialogue-student-card small { color: #b8d5c4; }
body[data-theme="dark"] .teacher-basic-pane-head h2 { color: #eaf8ef; }
body[data-theme="dark"] .teacher-basic-tasks .teacher-basic-pane-head h2 { color: #d7e9f7; }
body[data-theme="dark"] .teacher-basic-people .teacher-basic-pane-head h2 { color: #ddf3e4; }
body[data-theme="dark"] .teacher-basic-dialogue .teacher-basic-pane-head h2 { color: #eadff2; }
body[data-theme="dark"] .teacher-basic-important .teacher-basic-pane-head h2 { color: #f5deaa; }
body[data-theme="dark"] .teacher-basic-current-class { border-color: #496351; background: #203026; }
body[data-theme="dark"] .teacher-basic-current-class small { color: #b8cdbd; }
body[data-theme="dark"] .teacher-basic-current-class strong { color: #effff5; }
body[data-theme="dark"] .basic-task-metrics span { background: #232a20; color: var(--muted); }
body[data-theme="dark"] .basic-task-modal { border-color: #56664f; background: #1a1f18; }
body[data-theme="dark"] .basic-task-modal-head { border-bottom-color: #82ad98; background: #263229; }
body[data-theme="dark"] .basic-task-modal-head h2 { color: #effff5; }
body[data-theme="dark"] .basic-task-modal-body { background: #1a1f18; }
body[data-theme="dark"] .basic-task-modal-status { color: #c7d7cb; }
body[data-theme="dark"] .basic-task-modal-description,
body[data-theme="dark"] .basic-task-modal-loading { border-color: #52604c; background: #20271e; color: #d7e7dc; }
body[data-theme="dark"] .basic-task-modal-actions { border-top-color: #465341; background: #20271e; }
body[data-theme="dark"] .basic-task-assignment-modes label,
body[data-theme="dark"] .basic-task-edit-form fieldset { border-color: #52604c; background: #20271e; }
body[data-theme="dark"] .basic-task-description-field textarea { border-color: #607365; background: #171d18; color: var(--text); }
body[data-theme="dark"] .basic-task-description-field textarea::placeholder { color: #aebdb3; }
body[data-theme="dark"] .basic-task-description-field textarea:hover { border-color: #82ad98; }
body[data-theme="dark"] .basic-task-description-field textarea:focus { border-color: #8bb9a2; box-shadow: 0 0 0 3px rgba(139, 185, 162, 0.24); }
body[data-theme="dark"] .basic-task-assignment-note { border-color: #52604c; background: #20271e; color: #d7e7dc; }
body[data-theme="dark"] .teacher-basic-insight { background: #203026; border-color: #496351; }
body[data-theme="dark"] .teacher-basic-insight p,
body[data-theme="dark"] .teacher-basic-weekly-insight ul { color: #c7d7cb; }
body[data-theme="dark"] .teacher-basic-message-panel,
body[data-theme="dark"] .basic-reminder-detail-body p { background: #171b15; border-color: #3d493a; color: #d7e7dc; }
body[data-theme="dark"] .teacher-basic-session-list .workspace-session-button.has-attention { border-color: #b98936; background: #30291b; }
body[data-theme="dark"] .basic-dialogue-column-heading { color: #eadff2; }
body[data-theme="dark"] .basic-dialogue-column-heading small { color: #c4d4dc; }
body[data-theme="dark"] .basic-session-attention { border-color: #d2a34f; background: #493716; color: #ffe3a7 !important; }
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .workspace-list-button:hover,
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .workspace-list-button:focus-visible,
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .topic-card:hover,
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .topic-card:focus-visible { border-color: #527985; background: #202d30; box-shadow: none; }
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .workspace-list-button.is-active,
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .topic-card.is-active { border: 2px solid var(--basic-selected-border); background: var(--basic-selected-bg); box-shadow: none; }
body[data-theme="dark"] .teacher-basic-pane .workspace-list-button small,
body[data-theme="dark"] .teacher-basic-pane .workspace-list-button span,
body[data-theme="dark"] .teacher-basic-pane .basic-task-select > small,
body[data-theme="dark"] .teacher-basic-pane .basic-task-select > span { color: #c4d4dc; }
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived {
  border-color: #5a626a;
  background: #30353a;
  color: #d6d9dc;
}
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived:hover,
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived:focus-within {
  border-color: #79828b;
  background: #383e44;
}
body[data-theme="dark"] .teacher-root.is-basic .teacher-basic-pane .basic-task-card.is-archived.is-active {
  border: 2px solid #9ba3ab;
  background: #3d4349;
}
body[data-theme="dark"] .teacher-basic-pane .basic-task-card.is-archived .basic-task-select > span,
body[data-theme="dark"] .teacher-basic-pane .basic-task-card.is-archived .basic-task-select > small { color: #bec4ca; }
body[data-theme="dark"] .teacher-root.is-basic .basic-task-card.is-archived .basic-task-card-actions button {
  border-color: #68717a;
  background: #454b51;
  color: #f0f2f4;
}
body[data-theme="dark"] .teacher-basic-bottom-nav { background: rgba(25, 29, 23, 0.98); border-color: #465341; }
body[data-theme="dark"] .teacher-basic-bottom-nav button { background: #20251e; border-color: #465341; color: var(--muted); }
body[data-theme="dark"] .teacher-basic-bottom-nav button.is-active { background: #294437; border-color: #8ab7a7; color: #ecfff5; }

@media (max-width: 1020px) {
  body { overflow: auto; }
  .teacher-root { height: auto; min-height: 100vh; grid-template-columns: 1fr; overflow: visible; }
  .teacher-sidebar, .teacher-main { overflow: visible; }
  .teacher-sidebar { height: auto; min-height: 0; border-right: 0; border-bottom: 1px solid #e5e5e5; }
  .hero { grid-template-columns: 1fr; }
  .span-8, .span-6, .span-4 { grid-column: span 12; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .priority-card-grid { grid-template-columns: 1fr; }
  .focus-snapshot-grid { grid-template-columns: 1fr; }
  .learning-record-grid { height: auto; min-height: 0; }
  .workspace-student-list,
  .workspace-session-list,
  .workspace-message-timeline { max-height: none; overflow: visible; }
  .student-support-workspace { grid-template-columns: 1fr; }
  .safety-keyword-form,
  .safety-keyword-edit-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1279px) {
  .teacher-toast { top: calc(88px + env(safe-area-inset-top, 0px)); right: 12px; width: min(420px, calc(100vw - 24px)); }
  .basic-task-modal-backdrop { align-items: end; padding: 10px 8px calc(10px + env(safe-area-inset-bottom, 0px)); }
  .basic-task-modal { width: 100%; max-height: calc(100dvh - 18px); border-radius: 18px 18px 12px 12px; }
  .basic-task-modal-actions { position: relative; z-index: 1; }
  .basic-task-student-list { grid-template-columns: 1fr; }
  body:has(.teacher-root.is-basic) { overflow: auto; }
  .teacher-root.is-basic { height: auto; min-height: 100vh; grid-template-columns: 1fr; grid-template-rows: auto minmax(0, 1fr); overflow: visible; }
  .teacher-root.is-basic .teacher-main { min-height: calc(100vh - 74px); min-height: calc(100dvh - 74px); padding: 8px 12px calc(88px + env(safe-area-inset-bottom, 0px)); overflow: visible; }
  .teacher-basic-header { position: sticky; top: 0; z-index: 70; min-height: 62px; padding: 8px 12px; }
  .teacher-basic-header-primary { flex: 1 1 auto; gap: 10px; }
  .teacher-basic-brand { min-width: 0; }
  .teacher-basic-brand .brand-logo { width: 42px; height: 42px; }
  .teacher-basic-brand small { display: none; }
  .teacher-basic-header-actions > .ghost-link,
  .teacher-basic-header-actions > .ghost-btn,
  .teacher-basic-header-primary > .teacher-basic-class-management { display: none; }
  .teacher-basic-header-primary > .teacher-basic-student-management { display: none; }
  .teacher-basic-header-primary > .teacher-basic-workflow-switch { display: none; }
  .teacher-basic-header-actions > .brand-theme-toggle { display: inline-flex; }
  .teacher-basic-mobile-menu { position: relative; display: block; }
  .teacher-basic-mobile-menu summary { min-width: 52px; min-height: 44px; display: inline-grid; place-items: center; padding: 0 8px; border: 1px solid #cfdad4; border-radius: 9px; background: #ffffff; color: var(--text); font-size: 12px; font-weight: 900; cursor: pointer; list-style: none; }
  .teacher-basic-mobile-menu summary::-webkit-details-marker { display: none; }
  .teacher-basic-mobile-menu > div { position: absolute; top: calc(100% + 8px); right: 0; z-index: 95; width: min(250px, calc(100vw - 24px)); display: grid; gap: 8px; padding: 12px; border: 1px solid #cfdad4; border-radius: 12px; background: #ffffff; box-shadow: 0 18px 44px rgba(17, 24, 39, 0.24); }
  .teacher-basic-mobile-menu > div > * { width: 100%; min-height: 44px; display: flex; align-items: center; justify-content: center; }
  .basic-class-management-modal { width: min(760px, calc(100vw - 24px)); }
  .basic-class-management-modal-body .class-management-grid { grid-template-columns: 1fr; }
  .basic-class-management-modal-body .class-management-list { max-height: none; overflow: visible; }
  .teacher-basic-class-switcher { min-width: 176px; grid-template-columns: 1fr; gap: 3px; padding: 4px 6px; }
  .teacher-basic-class-switcher > span { font-size: 11px; line-height: 1.2; }
  .teacher-basic-class-switcher select { min-height: 44px; }
  .teacher-basic-current-class button { display: inline-flex; align-items: center; justify-content: center; }
  .teacher-basic-top-grid { height: auto; min-height: 0; display: block; }
  .teacher-basic-dashboard [data-basic-section] { display: none; }
  .teacher-basic-dashboard[data-active-basic-section="people"] .teacher-basic-people,
  .teacher-basic-dashboard[data-active-basic-section="tasks"] .teacher-basic-tasks,
  .teacher-basic-dashboard[data-active-basic-section="dialogue"] .teacher-basic-dialogue { display: grid; }
  .teacher-basic-top-grid > .teacher-basic-pane { min-height: calc(100vh - 174px); max-height: none; overflow: visible; }
  .teacher-basic-top-grid > .teacher-basic-pane { min-height: calc(100dvh - 174px); }
  .teacher-basic-scroll-list,
  .teacher-basic-topic-student-list,
  .teacher-basic-session-list,
  .basic-message-list { max-height: none; overflow: visible; }
  .basic-dialogue-layout { min-height: 560px; grid-template-columns: minmax(220px, 0.7fr) minmax(0, 1.6fr); overflow: visible; }
  .basic-dialogue-layout.is-topic-drilldown { grid-template-columns: minmax(180px, 0.6fr) minmax(0, 1.6fr); }
  .teacher-basic-message-panel { min-height: 360px; overflow: visible; }
  .teacher-basic-notification-panel { right: 12px; }
  .teacher-basic-bottom-nav { position: fixed; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); z-index: 90; min-height: 64px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; padding: 7px; border: 1px solid #ccd8d1; border-radius: 16px; background: rgba(255, 255, 255, 0.98); box-shadow: 0 16px 40px rgba(17, 24, 39, 0.22); }
  .teacher-basic-bottom-nav button { min-width: 0; min-height: 50px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px; padding: 7px 6px; border: 1px solid #d7e0db; border-radius: 11px; background: #f7faf8; color: #52665b; font-size: 13px; font-weight: 900; line-height: 1.2; }
  .teacher-basic-bottom-nav button span { overflow: hidden; line-height: 1.15; white-space: normal; }
  .teacher-basic-bottom-nav button strong { min-width: 21px; height: 21px; display: inline-grid; place-items: center; padding: 0 5px; border-radius: 999px; background: #e8efeb; color: #385247; font-size: 11px; }
  .teacher-basic-bottom-nav button.has-critical strong { background: #b94343; color: #ffffff; }
  .teacher-basic-bottom-nav button.is-active { border-color: #508568; background: #e4f3eb; color: #173b2d; }
}

@media (max-width: 640px) {
  .basic-task-assignment-modes { grid-template-columns: 1fr; }
  .teacher-root { padding: 0; }
  .teacher-main { padding: 12px; }
  .topbar, .toolbar { align-items: stretch; flex-direction: column; }
  .nav-actions, .toolbar-actions { justify-content: stretch; }
  .nav-actions a, .nav-actions button, .account-pill, .toolbar-actions button, .token-row button, .student-row button, .filter-row button { width: 100%; text-align: center; justify-content: center; }
  .token-row, .filter-row, .student-row, .alert-action-row, .metric-grid, .student-summary-metrics, .focus-snapshot-grid, .compact-list li, .class-management-grid, .student-management-grid, .learning-record-grid, .student-management-form, .student-create-panel .student-management-form, .safety-keyword-form, .safety-keyword-edit-grid { grid-template-columns: 1fr; }
  .safety-keyword-modal-actions button { width: 100%; justify-content: center; }
  .safety-keyword-modal-backdrop { align-items: end; padding: 12px; }
  .safety-keyword-modal { width: 100%; max-height: 88vh; border-radius: 12px; }
  .safety-keyword-modal-head h3 { font-size: 22px; }
  .safety-keyword-modal-body { padding: 14px; }
  .semantic-mask-section-heading { align-items: stretch; flex-direction: column; gap: 8px; }
  .semantic-mask-section-heading .chip { align-self: flex-start; }
  .student-management-modal-backdrop { align-items: end; padding: 10px 8px calc(10px + env(safe-area-inset-bottom, 0px)); }
  .student-management-modal { width: 100%; max-height: calc(100dvh - 18px); border-radius: 16px 16px 12px 12px; }
  .student-management-modal-head { padding: 14px; }
  .student-management-modal-head h2 { font-size: 21px; }
  .student-management-tabs { gap: 5px; padding: 8px; }
  .student-management-tabs button { padding: 7px 5px; font-size: 12px; }
  .student-management-modal-body { padding: 14px; }
  .student-management-modal-form,
  .student-management-modal-form.import { grid-template-columns: 1fr; }
  .roster-import-heading { align-items: stretch; flex-direction: column; }
  .roster-template-button { width: 100%; }
  .student-management-modal-actions,
  .student-management-modal-actions.split { display: grid; grid-template-columns: 1fr; }
  .student-management-modal-actions button { width: 100%; }
  .student-management-modal-foot { padding: 10px 14px; }
  .basic-class-management-modal { width: 100%; max-height: calc(100dvh - 18px); }
  .basic-class-management-modal button { min-height: 44px; }
  .basic-class-management-modal-body { padding: 12px; }
  .basic-class-management-modal-body :is(.class-create-panel, .class-list-panel) { padding: 14px; }
  .class-management-section-heading,
  .class-management-card-summary { align-items: stretch; flex-direction: column; }
  .class-list-heading-actions { width: 100%; justify-content: space-between; }
  .class-management-card-meta { justify-content: flex-start; }
  .class-management-card-editor { grid-template-columns: 1fr; }
  .class-management-card-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .class-management-card-actions button { width: 100%; min-width: 0; }
  .basic-class-management-modal-foot { align-items: flex-start; flex-direction: column; }
  .section-heading { align-items: stretch; }
  .section-heading-actions { justify-content: stretch; }
  .section-heading-actions .chip { width: 100%; justify-content: center; }
  .section-toggle { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; width: 100%; padding: 7px 10px; border: 1px solid #a9d8e6; border-radius: 8px; background: #eef9fc; color: var(--brand-strong); font-size: 13px; font-weight: 800; cursor: pointer; }
  body[data-theme="dark"] .section-toggle { background: var(--brand-soft); color: var(--brand-strong); border-color: #465341; }
  .section-toggle:focus-visible { outline: 3px solid rgba(21, 94, 117, 0.25); outline-offset: 2px; }
  body[data-theme="dark"] .section-toggle:focus-visible { outline-color: rgba(138, 183, 167, 0.28); }
  .section-body.collapsed { display: none; }
  .mobile-collapsible { display: grid; gap: 12px; }
  .sticky-section-heading { position: sticky; top: 0; z-index: 3; margin: -4px -4px 8px; padding: 8px 4px; border-bottom: 1px solid var(--line); background: var(--panel); }
  .reminder-action-row { align-items: stretch; flex-direction: column; }
  .reminder-actions { justify-content: stretch; }
  .reminder-actions button, .priority-card button, .reminder-secondary-actions { width: 100%; }
  .hero-copy, .login-panel, .panel { padding: 15px; }
  .teacher-section-title { min-height: 0; align-items: start; }
  .dashboard-section { gap: 8px; }
}

@media (max-width: 640px) {
  .teacher-toast { left: 10px; right: 10px; width: auto; max-height: min(160px, calc(100dvh - 96px)); padding: 13px 14px; }
  .basic-task-modal-head { padding: 14px; }
  .basic-task-modal-head h2 { font-size: 20px; }
  .basic-task-modal-body { padding: 14px; }
  .basic-task-modal-actions { grid-template-columns: 1fr; padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .basic-task-overview-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding-inline: 10px; }
  .basic-task-overview-actions.is-editing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teacher-root.is-basic .basic-task-overview-actions button { padding-inline: 5px; font-size: 13px; }
  .teacher-root.is-basic .teacher-basic-pane .basic-task-card { grid-template-columns: minmax(0, 1fr); }
  .basic-task-card-actions { padding: 0 12px 12px; }
  .teacher-basic-header { display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; }
  .teacher-basic-header-primary { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; }
  .teacher-basic-brand .brand-logo { width: 38px; height: 38px; }
  .teacher-basic-brand .eyebrow,
  .teacher-basic-brand small { display: none; }
  .teacher-basic-brand h1 { font-size: 15px; }
  .teacher-basic-header-actions { width: 100%; flex: 1 1 auto; flex-wrap: nowrap; }
  .teacher-basic-semantic-mask { flex: 1 1 auto; }
  .teacher-basic-alert-shortcut { flex: 0 0 44px; width: 44px; min-width: 44px; justify-content: center; padding-inline: 5px; }
  .teacher-basic-alert-shortcut > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .teacher-basic-class-switcher { flex: 1 1 auto; min-width: 0; }
  .teacher-basic-class-switcher > span { display: block; }
  .teacher-basic-header-actions .brand-theme-toggle { flex-basis: 44px; width: 44px; min-width: 44px; height: 44px; min-height: 44px; }
  .teacher-basic-pane { padding: 12px; border-radius: 12px; }
  .basic-dialogue-pane-head { align-items: stretch; }
  .basic-dialogue-student-card { flex-basis: 100%; }
  .teacher-basic-top-grid > .teacher-basic-pane { min-height: calc(100vh - 162px); }
  .teacher-basic-top-grid > .teacher-basic-pane { min-height: calc(100dvh - 162px); }
  .teacher-basic-quick-create { grid-template-columns: 1fr; }
  .teacher-basic-quick-create button { width: 100%; }
  .basic-task-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .basic-dialogue-layout { min-height: 520px; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(340px, 1fr); }
  .basic-dialogue-layout.is-topic-drilldown { min-height: 520px; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(340px, 1fr); }
  .teacher-basic-topic-student-list,
  .teacher-basic-session-list { grid-template-columns: 1fr; }
  .basic-topic-conversation-detail { min-height: 520px; }
  .teacher-basic-notification-panel { top: 100%; left: 8px; right: 8px; width: auto; max-height: min(520px, calc(100dvh - 148px)); }
  .teacher-basic-notification-item { grid-template-columns: minmax(0, 1fr); }
  .teacher-basic-notification-item .chip { grid-row: auto; width: fit-content; }
  .basic-reminder-detail-actions { grid-template-columns: 1fr; }
  .teacher-basic-bottom-nav { left: 6px; right: 6px; bottom: calc(6px + env(safe-area-inset-bottom, 0px)); gap: 5px; padding: 6px; }
  .teacher-basic-bottom-nav button { min-height: 54px; padding: 5px 3px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  .teacher-toast { animation: none; }
}