/* ============================================================
   简约模式：浅色导航、简单课程表、学生记录和实时提醒
   最后加载，覆盖 refined.css 的深色导航。
   ============================================================ */

.sidebar {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-right: 1px solid var(--line) !important;
}
.sidebar .brand b { color: var(--ink) !important; }
.sidebar .brand small,
.sidebar .nav-label { color: var(--muted) !important; }
.sidebar .nav button { color: var(--muted) !important; }
.sidebar .nav button:hover { color: var(--ink) !important; background: var(--surface-2) !important; }
.sidebar .nav button.active { color: var(--primary) !important; background: var(--primary-soft) !important; }
.sidebar .nav button.active .icon { color: var(--primary) !important; }
.sidebar .sidebar-foot > .quiet { color: var(--muted) !important; }
.sidebar .sidebar-foot > .quiet:hover { color: var(--ink) !important; background: var(--surface-2) !important; }
.sidebar .user-block { border-top-color: var(--line) !important; }
.sidebar .user-block strong { color: var(--ink) !important; }
.sidebar .user-block small { color: var(--muted) !important; }
.sidebar .avatar { background: var(--primary-soft) !important; color: var(--primary) !important; }

.shell.student .session-picker { display: none; }

/* 教师首页：一张简单的课程表 */
.simple-course-panel { overflow: hidden; }
.simple-course-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}
.simple-course-head h2 { font-size: 15px; }
.simple-course-head span { color: var(--muted); font-size: 12px; }
.simple-course-wrap { overflow-x: auto; }
.simple-course-table { width: 100%; min-width: 700px; border-collapse: collapse; }
.simple-course-table th {
  padding: 10px 18px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  text-align: left;
  white-space: nowrap;
}
.simple-course-table td {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.simple-course-table tbody tr:last-child td { border-bottom: 0; }
.simple-course-table tbody tr:hover td { background: oklch(.985 .003 145); }
.simple-course-name { color: var(--ink); font-size: 14px; font-weight: 600; }
.simple-course-extra { margin-top: 1px; color: var(--muted); font-size: 12px; }
.simple-course-time { color: var(--ink); font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.simple-course-action { text-align: right; white-space: nowrap; }
.simple-course-action button { min-height: 34px; padding: 5px 13px; font-size: 12px; }
.simple-empty { display: grid; justify-items: center; gap: 8px; padding: 48px 20px; color: var(--muted); text-align: center; }
.simple-empty p { font-size: 13px; }

/* 学生记录 */
.records-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 22px;
  margin-bottom: 14px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--bg);
}
.records-summary span { display: flex; align-items: baseline; gap: 4px; color: var(--muted); font-size: 12px; }
.records-summary b { color: var(--ink); font-size: 20px; font-variant-numeric: tabular-nums; }
.records-panel { overflow: hidden; }
.records-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
}
.records-head h2 { font-size: 15px; }
.records-head span { color: var(--muted); font-size: 12px; }
.record-row {
  display: flex;
  gap: 16px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--line);
}
.record-row:last-child { border-bottom: 0; }
.record-row.is-new { background: var(--primary-soft); }
.record-date { display: grid; align-content: start; flex-shrink: 0; width: 52px; padding-top: 2px; }
.record-date b { color: var(--ink); font-size: 18px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.record-date span { color: var(--muted); font-size: 11px; }
.record-main { flex: 1; min-width: 0; }
.record-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.record-head h2 { font-size: 15px; }
.record-head p { margin-top: 1px; color: var(--muted); font-size: 12px; }
.record-meta { display: flex; flex-wrap: wrap; gap: 5px 14px; margin-top: 5px; color: var(--muted); font-size: 12px; }
.record-events { display: grid; gap: 6px; margin-top: 10px; }
.record-event {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px;
  border-radius: 7px;
  background: var(--red-soft);
}
.record-event-main { min-width: 0; }
.record-event-main > div { display: flex; align-items: baseline; gap: 8px; }
.record-event-main strong { font-size: 13px; }
.record-event-main span { color: var(--muted); font-size: 11px; }
.record-event-main p { margin-top: 2px; color: var(--muted); font-size: 11px; }
.record-processing {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 7px;
  background: var(--surface);
  color: var(--muted);
  font-size: 12px;
}
.record-processing p { flex-basis: 100%; margin: 0; color: var(--muted); font-size: 11px; }
.record-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.record-actions button { min-height: 32px; padding: 4px 11px; font-size: 12px; }

.student-notices {
  margin-bottom: 14px;
  padding: 12px 16px;
  border: 1px solid oklch(.85 .05 145);
  border-radius: 10px;
  background: var(--primary-soft);
}
.student-notices-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px; }
.student-notices-head strong { color: var(--primary); font-size: 13px; }
.student-notices-head button { min-height: 28px; font-size: 12px; }
.student-notice { display: flex; justify-content: space-between; gap: 10px; padding: 3px 0; font-size: 12px; }
.student-notice time { color: var(--muted); font-size: 11px; white-space: nowrap; }

/* 全局学生提醒 */
.student-alert {
  position: fixed;
  z-index: 58;
  top: 76px;
  right: 20px;
  left: auto;
  display: flex;
  align-items: center;
  gap: 16px;
  width: min(360px, calc(100vw - 24px));
  padding: 10px 14px;
  border: 1px solid oklch(.83 .045 145);
  border-radius: 10px;
  background: var(--bg);
  box-shadow: 0 8px 28px oklch(.2 .015 145 / .18);
  transform: none;
}
.student-alert[hidden] { display: none; }
.student-alert-text { display: grid; gap: 1px; }
.student-alert-text strong { color: var(--primary); font-size: 13px; }
.student-alert-text span { color: var(--ink); font-size: 12px; }
.student-alert-actions { display: flex; gap: 4px; }
.student-alert-actions button { min-height: 32px; padding: 4px 9px; font-size: 12px; }

/* 更多 */
.simple-more { overflow: hidden; }
.simple-more > button,
.simple-more-link {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 62px;
  padding: 16px 18px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  color: var(--ink);
  text-align: left;
  text-decoration: none;
}
.simple-more > button:last-child,
.simple-more-link:last-child { border-bottom: 0; }
.simple-more > button:hover,
.simple-more-link:hover { background: var(--surface); text-decoration: none; }
.simple-more > button > span,
.simple-more-link > span { display: grid; flex: 1; gap: 1px; }
.simple-more b { font-size: 14px; }
.simple-more small { color: var(--muted); font-size: 12px; }

/* 课堂页：手机袋已经在后墙，去掉重复入口 */
.stage .shud-actions [data-view="phones"],
.stage .shud-actions [data-action="start-session"] { display: none; }

@media (max-width: 760px) {
  .records-summary { gap: 14px; padding: 11px 14px; }
  .record-row { flex-direction: column; gap: 8px; padding: 14px; }
  .record-date { width: auto; display: flex; align-items: baseline; gap: 6px; }
  .record-date b { font-size: 16px; }
  .record-head { flex-direction: column; gap: 6px; }
  .record-actions button { min-height: 40px; }
  .simple-course-table { min-width: 640px; }
  .student-alert { top: 68px; top: calc(68px + env(safe-area-inset-top)); right: 12px; left: 12px; width: auto; align-items: flex-start; flex-wrap: wrap; gap: 4px 12px; }
  .student-alert-text { min-width: 0; overflow-wrap: anywhere; }
  .student-alert-actions { margin-left: auto; flex-wrap: wrap; }
  .student-alert-actions button { min-height: 44px; }
}



/* 课程分组与课程详情 */
.simple-class-list { display: grid; gap: 18px; }
.simple-class-group { display: grid; gap: 8px; }
.simple-class-head { display: flex; align-items: baseline; justify-content: space-between; padding: 0 2px; }
.simple-class-head h2 { font-size: 14px; color: var(--muted); font-weight: 600; }
.simple-class-head span { font-size: 11px; color: var(--muted); }
.simple-course-group { border: 1px solid var(--line); border-radius: 10px; background: var(--bg); overflow: hidden; }
.simple-course-group.open { border-color: oklch(.84 .04 145); }
.simple-course-header { display: flex; align-items: center; gap: 16px; padding: 14px 16px; }
.simple-course-heading { flex: 1; min-width: 0; }
.simple-course-heading h3 { font-size: 16px; }
.simple-course-heading p { margin-top: 2px; color: var(--muted); font-size: 12px; }
.simple-course-next { display: grid; justify-items: end; gap: 2px; min-width: 160px; text-align: right; }
.simple-course-next b { font-size: 13px; font-variant-numeric: tabular-nums; }
.simple-course-next span { font-size: 11px; color: var(--muted); }
.simple-course-buttons { display: flex; gap: 6px; flex-shrink: 0; }
.simple-course-buttons button { min-height: 34px; font-size: 12px; }
.simple-class-tag { display: inline-block; margin-bottom: 4px; padding: 1px 6px; border-radius: 4px; background: var(--primary-soft); color: var(--primary); font-size: 10px; }
.simple-course-detail { padding: 0 16px 16px; border-top: 1px solid var(--line); background: var(--surface); }
.simple-course-metrics { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 12px 0; color: var(--muted); font-size: 12px; }
.simple-course-metrics b { margin-right: 4px; color: var(--ink); font-size: 17px; font-variant-numeric: tabular-nums; }
.simple-session-list { display: grid; gap: 4px; }
.simple-session-row { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--bg); font-size: 12px; }
.simple-session-row > div { flex: 1; min-width: 0; display: grid; gap: 1px; }
.simple-session-row b { font-size: 12px; font-variant-numeric: tabular-nums; }
.simple-session-row span { color: var(--muted); }
.simple-session-row button { min-height: 30px; font-size: 12px; }
.simple-course-detail-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-top: 10px; }
.simple-course-detail-foot button { min-height: 32px; font-size: 12px; }
.simple-course-detail-foot span { color: var(--muted); font-size: 11px; }
.simple-course-timeline { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 10px; }
.simple-course-timeline-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; font-size: 12px; }
.simple-course-timeline-head span { color: var(--muted); }.simple-course-timeline-head button { margin-left: auto; }
.simple-event { display: grid; grid-template-columns: 96px 1fr auto; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--line); font-size: 11px; color: var(--muted); }
.simple-event:last-child { border-bottom: 0; }
.simple-event time { font-variant-numeric: tabular-nums; }
.simple-event b { color: var(--ink); font-weight: 550; }
.simple-event p { grid-column: 2 / -1; color: var(--muted); }
.simple-loading { color: var(--muted); font-size: 12px; }
.simple-footer-links { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--line); }
.simple-footer-links button, .simple-footer-links a { display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; color: var(--muted); font-size: 12px; text-decoration: none; }
.simple-footer-links button:hover, .simple-footer-links a:hover { color: var(--primary); }

/* 学生当前课程 */
.student-current { display: grid; gap: 8px; margin-bottom: 14px; }
.student-section-head { display: flex; align-items: baseline; justify-content: space-between; }
.student-section-head h2 { font-size: 15px; }
.student-section-head span { color: var(--muted); font-size: 11px; }
.student-current-empty { padding: 12px 16px; border: 1px dashed var(--line); border-radius: 10px; }
.student-current-empty p { color: var(--muted); font-size: 12px; }
.student-current-card { padding: 14px 16px; border: 1px solid oklch(.84 .04 145); border-radius: 10px; background: var(--bg); }
.student-current-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.student-current-head h2 { font-size: 17px; }
.student-current-head p { margin-top: 2px; color: var(--muted); font-size: 12px; }
.student-current-status { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; color: var(--muted); font-size: 12px; }
.student-current-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.student-current-actions button { min-height: 38px; font-size: 13px; }
.student-current-hint { color: var(--muted); font-size: 12px; }
.simple-timeline { display: grid; gap: 0; max-height: 60vh; overflow: auto; }

@media (max-width: 760px) {
  .simple-course-header { flex-wrap: wrap; gap: 8px; }
  .simple-course-next { min-width: 0; justify-items: start; text-align: left; }
  .simple-course-buttons { width: 100%; }
  .simple-course-buttons button { flex: 1; }
  .simple-session-row { flex-wrap: wrap; }
  .simple-session-row > div { flex-basis: 100%; }
  .student-current-head { flex-direction: column; gap: 6px; }
}

.student-current-events { display: grid; gap: 5px; margin-top: 9px; }
.student-current-event { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 6px; background: var(--red-soft); font-size: 12px; }
.student-current-event span:first-child { flex: 1; font-weight: 550; }
.student-current-event time { color: var(--muted); font-size: 11px; }


/* 登录身份切换 */
.login-role-tabs { display: flex; gap: 4px; margin-bottom: 18px; padding: 3px; border-radius: 8px; background: #eef2ec; }
.login-role-tabs button { flex: 1; min-height: 36px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 13px; font-weight: 550; }
.login-role-tabs button:hover { color: var(--ink); }
.login-role-tabs button.active { background: var(--bg); color: var(--ink); box-shadow: 0 1px 3px rgba(28, 43, 36, .12); }

/* 侧栏班级选择与班级名单 */
.sidebar-class { display: grid; gap: 5px; padding: 4px 14px 12px; }
.sidebar-class-label { padding-left: 4px; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: .08em; }
.sidebar-class-list { display: grid; gap: 2px; max-height: 172px; overflow: auto; }\n.sidebar-class-list button { width: 100%; min-height: 30px; padding: 5px 8px; border: 0; border-radius: 6px; background: transparent; color: var(--muted); font-size: 12px; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }\n.sidebar-class-list button:hover { background: var(--surface); color: var(--ink); }\n.sidebar-class-list button.active { background: var(--primary-soft); color: var(--primary); font-weight: 600; }\n.sidebar-class-empty { padding: 6px 8px; color: var(--muted); font-size: 11px; }
.class-roster-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 10px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); font-size: 12px; }
.roster-course { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; }
.roster-course select { width: auto; min-width: 120px; min-height: 30px; padding: 3px 7px; font-size: 12px; }
.roster-metric { color: var(--muted); white-space: nowrap; }
.roster-metric b { color: var(--ink); font-size: 16px; font-variant-numeric: tabular-nums; }
.roster-metric small { color: var(--muted); font-size: 10px; }
.roster-metric.warn b { color: var(--red); }
.roster-session { flex: 1; min-width: 160px; color: var(--muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.class-roster-toolbar .search { min-width: 170px; max-width: 260px; margin-left: auto; }
.class-roster-toolbar .search input { min-height: 30px; font-size: 12px; }
.class-roster-panel { overflow: hidden; }
.roster-table th { padding: 8px 10px; font-size: 10px; }
.roster-table td { padding: 7px 10px; font-size: 12px; }
.roster-table tbody tr { height: 38px; }
.roster-student { display: grid; gap: 0; line-height: 1.3; }
.roster-student strong { font-size: 13px; font-weight: 600; }
.roster-student span { color: var(--muted); font-size: 10px; font-variant-numeric: tabular-nums; }
.roster-flag { display: inline-flex; align-items: center; min-height: 20px; padding: 1px 6px; border-radius: 4px; font-size: 11px; white-space: nowrap; }
.roster-flag.ok { color: var(--primary); background: var(--primary-soft); }
.roster-flag.bad { color: var(--red); background: var(--red-soft); }
.roster-table td small { margin-left: 4px; color: var(--muted); font-size: 10px; font-variant-numeric: tabular-nums; }
.roster-bad { color: var(--red); }
.roster-weight { display: grid; gap: 0; line-height: 1.25; }
.roster-weight b { font-size: 15px; font-variant-numeric: tabular-nums; }
.roster-weight small { margin-left: 0; color: var(--muted); font-size: 10px; }
.roster-weight em { color: var(--red); font-size: 10px; font-style: normal; }
.roster-rank { display: inline-flex; align-items: baseline; gap: 2px; font-variant-numeric: tabular-nums; }
.roster-rank small { margin: 0; color: var(--muted); font-size: 10px; }
.roster-actions { display: flex; gap: 4px; white-space: nowrap; }
.roster-actions button { min-height: 26px; padding: 3px 7px; font-size: 11px; }
.roster-table tr.roster-failed td { background: oklch(.985 .012 25 / .7); }
.roster-table tr.roster-failed:hover td { background: var(--red-soft); }
.roster-empty { padding: 24px 12px !important; color: var(--muted); text-align: center; }
.roster-foot { padding: 8px 12px; font-size: 10px; line-height: 1.6; white-space: normal; }
.class-roster-loading { padding: 24px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-size: 12px; display: flex; gap: 8px; align-items: center; }
.class-roster-loading .icon { width: 15px; height: 15px; animation: roster-spin 1s linear infinite; }
@keyframes roster-spin { to { transform: rotate(360deg); } }
.class-roster-empty { padding: 20px; }
.class-roster-empty p { color: var(--muted); font-size: 12px; margin-bottom: 10px; }

@media (max-width: 860px) {
  .class-roster-toolbar { gap: 6px 12px; }
  .roster-session { flex-basis: 100%; order: 5; }
  .class-roster-toolbar .search { margin-left: 0; flex: 1 1 100%; max-width: none; }
  .roster-table th, .roster-table td { padding: 7px 8px; }
  .roster-actions { flex-direction: column; }
}

.student-weight-strip { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 0 0 12px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); }
.student-weight-strip > div { display: flex; align-items: baseline; gap: 6px; }
.student-weight-strip span { color: var(--muted); font-size: 11px; }
.student-weight-strip b { font-size: 18px; font-variant-numeric: tabular-nums; }
.student-weight-strip b small { color: var(--muted); font-size: 10px; font-weight: 400; }
.student-weight-strip b.ok { color: var(--primary); }
.student-weight-strip b.bad { color: var(--red); }

.roster-flag.warn { color: var(--amber); background: var(--amber-soft); }


.student-weight-rule { flex-basis: 100%; margin: 2px 0 0; color: var(--muted); font-size: 10px; line-height: 1.6; }

/* 学生常驻座位/手机袋与班级排名 */
.student-place { margin-bottom: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.student-place-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.student-place-head h2 { font-size: 14px; }
.student-place-head span { color: var(--muted); font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.student-place-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.student-place-grid > div { padding: 8px 10px; border-radius: 6px; background: var(--bg); }
.student-place-grid span { display: block; color: var(--muted); font-size: 10px; }
.student-place-grid b { display: block; margin-top: 2px; font-size: 16px; font-variant-numeric: tabular-nums; }
.student-place-grid small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; }
.student-place-actions { display: flex; gap: 6px; margin-top: 8px; }
.student-place-actions button { min-height: 30px; font-size: 11px; }
.student-ranking { margin: 0 0 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.student-ranking-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 7px; }
.student-ranking-head h2 { font-size: 14px; }
.student-ranking-head span { color: var(--muted); font-size: 10px; }
.student-ranking-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 12px; max-height: 210px; overflow: auto; }
.student-ranking-list > div { display: flex; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 4px; font-size: 12px; }
.student-ranking-list > div.me { background: var(--primary-soft); color: var(--primary); font-weight: 600; }
.student-ranking-list b { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.student-ranking-list em { margin-left: auto; color: var(--primary); font-size: 10px; font-style: normal; }
.student-rank-no { min-width: 20px; color: var(--muted); font-variant-numeric: tabular-nums; font-size: 11px; }
.student-ranking-list > div.me .student-rank-no { color: var(--primary); }

@media (max-width: 760px) {
  .student-ranking-list { grid-template-columns: 1fr; max-height: 180px; }
}

/* 请假待办与图片 */
.nav-count { margin-left: auto; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--red); color: #fff; font-size: 10px; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums; }
.nav-count[hidden] { display: none; }
.tab-count { display: inline-flex; align-items: center; justify-content: center; min-width: 17px; height: 17px; margin-left: 5px; padding: 0 4px; border-radius: 9px; background: var(--red); color: #fff; font-size: 10px; line-height: 17px; font-variant-numeric: tabular-nums; }
.request-pending { margin-bottom: 12px; }
.roster-course select { min-width: 105px; }

/* 班级选择只放在学生名单页 */
.roster-class-switch { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin-bottom: 12px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.roster-class-switch > span { padding: 0 7px 0 4px; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: .06em; }
.roster-class-switch button { min-height: 30px; padding: 4px 10px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); font-size: 12px; }
.roster-class-switch button:hover { background: var(--bg); color: var(--ink); }
.roster-class-switch button.active { background: var(--primary-soft); color: var(--primary); font-weight: 600; }
.roster-class-switch em { color: var(--muted); font-size: 11px; font-style: normal; }

/* 老师请假：左列表 + 右预览，压缩空白 */
.teacher-requests-layout { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 14px; align-items: start; }
.request-list-panel { overflow: hidden; }
.request-list-head { display: flex; align-items: baseline; justify-content: space-between; padding: 11px 14px; border-bottom: 1px solid var(--line); font-size: 12px; }
.request-list-head span { color: var(--muted); font-size: 11px; }
.request-compact-list { display: grid; gap: 0; max-height: calc(100vh - 290px); overflow: auto; }
.request-compact { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 9px; width: 100%; padding: 8px 12px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; }
.request-compact:hover { background: var(--surface); }
.request-compact.active { background: var(--primary-soft); }
.request-thumb-wrap { display: flex; align-items: center; justify-content: center; width: 56px; height: 40px; overflow: hidden; border: 1px solid var(--line); border-radius: 5px; background: var(--bg); }
.request-thumb { width: 100%; height: 100%; object-fit: cover; display: block; }
.request-thumb-file { color: var(--muted); font-size: 10px; }
.request-thumb-empty { color: var(--muted); font-size: 10px; }
.request-compact-main { min-width: 0; display: grid; gap: 1px; }
.request-compact-main b { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.request-compact-main small { color: var(--muted); font-size: 10px; line-height: 1.45; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.request-compact-state { align-self: center; }
.request-preview-panel { position: sticky; top: 76px; padding: 13px 14px; max-height: calc(100vh - 100px); overflow: auto; }
.request-preview-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.request-preview-type { color: var(--muted); font-size: 10px; }
.request-preview-head h2 { margin-top: 2px; font-size: 16px; }
.request-preview-panel .meta { color: var(--muted); font-size: 10px; line-height: 1.6; margin-top: 4px; }
.request-preview-reason { margin-top: 9px; padding: 8px 10px; border-radius: 6px; background: var(--bg); font-size: 12px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.request-preview-panel .evidence-preview { margin-top: 10px; }
.request-preview-panel .evidence-preview img { max-height: 420px; }
.request-preview-panel .evidence-preview iframe { height: 300px; }
.request-preview-actions { display: flex; gap: 7px; margin-top: 11px; }
.request-preview-actions button { flex: 1; min-height: 34px; font-size: 12px; }
.request-preview-foot { display: flex; justify-content: flex-end; margin-top: 9px; }
.request-preview-empty { display: flex; min-height: 180px; align-items: center; justify-content: center; color: var(--muted); font-size: 12px; text-align: center; }
.request-compact-list .empty { padding: 24px 12px; }
@media (max-width: 1100px) { .teacher-requests-layout { grid-template-columns: 1fr; } .request-preview-panel { position: static; max-height: none; } .request-compact-list { max-height: none; } }

.request-preview-note { margin-top: 13px; padding-top: 9px; border-top: 1px solid var(--line); }
.request-preview-note b { font-size: 11px; }
.request-preview-note p { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.6; }
.request-recent { margin-top: 14px; overflow: hidden; }
.request-recent-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; padding: 3px 12px 8px; }
.request-recent-row { display: flex; align-items: center; gap: 7px; min-height: 32px; border-bottom: 1px solid var(--line); font-size: 11px; }
.request-recent-row b { font-size: 12px; font-weight: 550; }
.request-recent-row span { color: var(--muted); }
.request-recent-row time { margin-left: auto; color: var(--muted); font-size: 10px; }
.request-recent-empty { padding: 14px 12px; color: var(--muted); font-size: 11px; }
@media (max-width: 760px) { .request-recent-list { grid-template-columns: 1fr; } }


/* 请假页：全宽紧凑表格，图片缩略图点开原图 */
.request-table-panel { overflow: hidden; }
.request-table th { padding: 8px 10px; font-size: 10px; }
.request-table td { padding: 7px 10px; font-size: 12px; }
.request-table td.request-when { white-space: nowrap; color: var(--muted); font-size: 11px; }
.request-table td.request-reason-cell { max-width: 360px; white-space: normal; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.request-table tr.request-row-pending td { background: oklch(.985 .02 70 / .45); }
.request-row-actions { display: flex; gap: 4px; white-space: nowrap; }
.request-row-actions button { min-height: 26px; padding: 3px 8px; font-size: 11px; }
.request-proof { display: inline-flex; width: 56px; height: 40px; align-items: center; justify-content: center; overflow: hidden; border: 1px solid var(--line); border-radius: 4px; background: var(--bg); text-decoration: none; }
.request-proof:hover { border-color: var(--primary); }
.request-proof .request-thumb { width: 100%; height: 100%; object-fit: cover; }
.request-empty { padding: 26px 12px !important; color: var(--muted); text-align: center; }

.proof-lightbox img { max-height: 70vh; width: auto; max-width: 100%; margin: 0 auto; }

.teacher-alert { border-color: oklch(.82 .06 75); }
.teacher-alert .student-alert-text strong { color: var(--amber); }

/* 老师待审批横幅放右下，避免盖住发布课程等页头按钮 */
.teacher-alert { top: auto !important; bottom: 20px; right: 20px; left: auto !important; }
@media (max-width: 760px) { .teacher-alert { left: 12px !important; right: 12px; bottom: 14px; bottom: calc(14px + env(safe-area-inset-bottom)); } }

/* 学生页内层：班级 -> 学生 */
.roster-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 14px; align-items: start; }
.roster-tree { position: sticky; top: 76px; max-height: calc(100vh - 110px); overflow: auto; padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.roster-tree-label { padding: 4px 7px 7px; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: .06em; }
.roster-tree-class > button { display: flex; align-items: center; gap: 6px; width: 100%; min-height: 32px; padding: 5px 7px; border: 0; border-radius: 5px; background: transparent; color: var(--ink); text-align: left; }
.roster-tree-class > button b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 600; }
.roster-tree-class > button span { color: var(--muted); font-size: 10px; }
.roster-tree-class > button.active { background: var(--primary-soft); color: var(--primary); }
.roster-tree-students { display: grid; gap: 0; padding: 1px 0 6px 9px; border-left: 1px solid var(--line); margin-left: 8px; }
.roster-tree-students button { display: flex; align-items: baseline; gap: 5px; min-height: 25px; padding: 2px 5px; border: 0; border-radius: 3px; background: transparent; color: var(--muted); text-align: left; font-size: 11px; }
.roster-tree-students button:hover { background: var(--bg); color: var(--ink); }
.roster-tree-students button.active { background: var(--primary-soft); color: var(--primary); font-weight: 600; }
.roster-tree-students small { margin-left: auto; color: var(--muted); font-size: 9px; font-variant-numeric: tabular-nums; }
.roster-tree-students em, .roster-tree-empty { padding: 5px 7px; color: var(--muted); font-size: 10px; font-style: normal; }
.roster-main { min-width: 0; }
@media (max-width: 1100px) { .roster-layout { grid-template-columns: 1fr; } .roster-tree { position: static; max-height: 220px; } }

/* 课堂页：课程 -> 班级 -> 课次 */
.simple-class-section { margin-top: 8px; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
.simple-class-section-head { display: flex; align-items: center; gap: 8px; padding: 6px; background: var(--surface); border-bottom: 1px solid var(--line); }
.simple-class-toggle { flex: 1; display: flex; align-items: baseline; gap: 8px; min-height: 30px; padding: 4px 7px; border: 0; border-radius: 4px; background: transparent; text-align: left; }
.simple-class-toggle:hover { background: var(--bg); }
.simple-class-toggle b { font-size: 13px; }
.simple-class-toggle span { color: var(--muted); font-size: 10px; }
.simple-class-toggle small { margin-left: auto; color: var(--muted); font-size: 10px; }
.simple-class-add { min-height: 28px; padding: 3px 7px; font-size: 11px; }
.simple-class-section .simple-session-list { padding: 5px; }
.simple-class-tip { padding: 7px 10px; color: var(--muted); font-size: 10px; }