/* ===========================================================
   课程表工作台 · 新拟态（浮雕 + 漂浮）样式
   手机竖屏优先 · 主表横向可滑动
   =========================================================== */
:root {
  --bg: #e9ecf3;
  --bg-2: #eef1f7;
  --sh-dark: #c6cad6;
  --sh-light: #ffffff;
  --text: #3a3f52;
  --text-2: #6d7488;
  --muted: #9aa0b2;
  --accent: #184581;
  --accent-2: #2a6bb5;
  --accent-soft: rgba(24, 69, 129, 0.14);
  --rest-1: #FBECD7;
  --rest-2: #FBECD7;
  --rest-sh: #e3cfa3;
  --rest-text: #8a6d2e;
  --danger: #d9736f;
  --r-cell: 15px;
  --r-card: 20px;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
  background:
    radial-gradient(1200px 600px at 20% -10%, #f3f5fa 0%, transparent 60%),
    var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  touch-action: pan-x;
}

.app {
  width: 100%;
  max-width: 460px;
  height: 100vh;
  height: 100dvh;
  margin: 0 auto;
  padding: 10px 14px 0;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* ---------- 视图切换 ---------- */
.view { display: none; animation: fade .22s ease both; }
.view.active { display: block; }
#view-grid.active {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
#view-weeks.active,
#view-settings.active,
#view-detail.active,
#view-batch.active,
#view-classes.active {
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 30px;
  box-sizing: border-box;
}
@keyframes fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

/* ---------- 顶栏 ---------- */
.topbar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
  padding: 8px 12px;
  border-radius: var(--r-card);
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 6px 6px 14px var(--sh-dark), -6px -6px 14px var(--sh-light);
  flex-shrink: 0;
}
.topbar-row-title {
  display: flex;
  align-items: center;
  gap: 10px;
}
.topbar-row-buttons {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.topbar-row-buttons .icon-btn,
.topbar-row-buttons .pill-btn,
.topbar-row-buttons .jump-workbuddy-btn {
  width: auto;
  height: 32px;
  padding: 0 12px;
  flex: 1;
  min-width: 0;
  font-size: 12px;
}
.topbar-row-buttons .icon-btn,
.topbar-row-buttons .jump-workbuddy-btn {
  flex: 0 0 32px;
  padding: 0;
}
.topbar-row-title .topbar-main { flex: 1; min-width: 0; }
.topbar-main { flex: 1; min-width: 0; }
.topbar-main.center { text-align: center; }
.topbar h1 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.period {
  margin: 2px 0 0;
  font-size: 10.5px;
  color: var(--text-2);
  letter-spacing: .2px;
}

.icon-btn {
  flex: 0 0 auto;
  width: 38px; height: 38px;
  display: inline-flex; align-items: center; justify-content: center;
  border: none;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--accent);
  box-shadow: 4px 4px 9px var(--sh-dark), -4px -4px 9px var(--sh-light);
  cursor: pointer;
  transition: all .16s ease;
}
.icon-btn:active {
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  transform: scale(.96);
}
.icon-btn.ghost { box-shadow: none; background: transparent; pointer-events: none; }

/* 批量设置胶囊按钮 */
.pill-btn {
  flex: 0 0 auto;
  height: 34px;
  padding: 0 13px;
  border: none;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--accent);
  font-size: 12.5px;
  font-weight: 700;
  font-family: inherit;
  white-space: nowrap;
  box-shadow: 4px 4px 9px var(--sh-dark), -4px -4px 9px var(--sh-light);
  cursor: pointer;
  transition: all .16s ease;
}
.pill-btn:active {
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  transform: scale(.96);
}
.pill-btn.on {
  background: linear-gradient(150deg, var(--accent), var(--accent-2));
  color: #fff;
}

/* ===========================================================
   课程表主网格：8 列 × 6 行，横向可滑动
   列1 节次/时间(吸顶) | 列2 周二休息(最窄) | 列3-8 周三~周一
   =========================================================== */
.grid-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
  scrollbar-width: thin;
  flex: 1;
  min-height: 0;
}
.grid {
  display: grid;
  /* 列1 节次 | 列2 周二(最窄) | 列3-8 周三~周一 */
  grid-template-columns: 62px 58px repeat(6, 83px);
  grid-template-rows: 46px minmax(42px, 0.6fr) repeat(4, minmax(77px, 1.1fr));
  gap: 7px;
  width: max-content;
  height: 100%;
}

.cell {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px 3px;
  text-align: center;
  border-radius: var(--r-cell);
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
  transition: box-shadow .18s ease, transform .14s ease;
}
/* 微弱高光 */
.cell::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(150deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 42%);
  pointer-events: none;
}

/* 第 1 列（节次/时间）吸顶，横滑时固定 */
.cell.corner, .cell.period {
  position: sticky;
  left: 0;
  z-index: 4;
}

/* 表头 */
.cell.head { padding: 3px 2px; }
.cell.head .wk { font-size: 12px; font-weight: 700; color: var(--text); line-height: 1.1; }
.cell.head .dt { margin-top: 2px; font-size: 9px; color: var(--muted); line-height: 1; }
.cell.head.today { box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light), inset 0 0 0 1.5px var(--accent); }
.cell.head.today .wk { color: var(--accent); }
.cell.head.rest-head .wk { color: var(--rest-text); }

/* 左上角（节次标签字号与节次名列一致） */
.cell.corner .c1 { font-size: 14px; font-weight: 700; color: var(--text-2); line-height: 1.15; }
.cell.corner .c2 { font-size: 8px; color: var(--muted); line-height: 1.15; }

/* 节次列 */
.cell.period { padding: 4px 2px; }
.cell.period .nm { font-size: 14px; font-weight: 700; color: var(--text); line-height: 1.15; letter-spacing: .2px; }
.cell.period .tm { margin-top: 4px; font-size: 10px; color: var(--text-2); line-height: 1.3; white-space: normal; }

/* 课程格 · 空 */
.cell.course { cursor: pointer; }
.cell.course.empty {
  background: var(--bg);
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
}
.cell.course.empty::before { background: none; }
.cell.course.empty .plus { font-size: 15px; color: #bcc2d2; font-weight: 300; line-height: 1; }

/* 课程格 · 有课（浮起 + 同背景色） */
.cell.course.has {
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
  transform: translateY(-1px);
}
.cell.course.has .ct {
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.2;
  letter-spacing: .2px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}
.cell.course.has .cs {
  margin-top: 2px;
  font-size: 8px;
  color: var(--text-2);
  line-height: 1.2;
  white-space: normal;
  text-align: center;
  max-width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cell.course.has .dot {
  position: absolute;
  top: 4px; right: 5px;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--accent);
}
/* 双课程模式 */
.cell.course.has.double {
  display: flex;
  flex-direction: column;
  padding: 4px 6px;
}
.cell.course.has.double .course-half {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 0;
  padding: 2px 0;
}
.cell.course.has.double .course-half .ct {
  font-size: 11px;
  line-height: 1.2;
  -webkit-line-clamp: 2;
}
.cell.course.has.double .course-half .cs {
  font-size: 7.5px;
  margin-top: 1px;
  line-height: 1.15;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cell.course.has.double .course-split {
  height: 1px;
  background: var(--sh-dark);
  opacity: .5;
  margin: 2px 8px;
}
/* 教室徽章：底色圆角矩形，颜色来自教室配色 */
.cell.course.has .room-badge {
  display: inline-block;
  max-width: 100%;
  margin-top: 5px;
  padding: 2px 8px;
  border-radius: 9px;
  background: #f4f4f4;
  color: #3a3f52;
  font-size: 9px;
  font-weight: 600;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .10);
}
.cell.course:active { transform: scale(.95); }

/* 课程格 · 批量选中 */
.cell.course.sel {
  box-shadow: 0 0 0 2.5px var(--accent), 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
  transform: translateY(-1px);
}
.cell.course.sel::after {
  content: "✓";
  position: absolute;
  top: 3px; right: 4px;
  width: 16px; height: 16px;
  border-radius: 50%;
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
}

/* 批量模式：表头和节次卡片可点击全选 */
.cell.head.batch-selectable,
.cell.period.batch-selectable {
  cursor: pointer;
  transition: box-shadow .15s ease;
}
.cell.head.batch-all,
.cell.period.batch-all {
  box-shadow: inset 0 0 0 2px var(--accent), 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
}
.cell.head.batch-partial,
.cell.period.batch-partial {
  box-shadow: inset 0 0 0 1.5px rgba(74,144,217,0.5), 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
}
.cell.head.batch-selectable:active,
.cell.period.batch-selectable:active {
  transform: scale(.96);
}

/* 周二休息列（合并 5 行，最窄列2） */
.cell.rest {
  grid-column: 2;
  grid-row: 2 / 7;
  background: linear-gradient(150deg, var(--rest-1), var(--rest-2));
  box-shadow: 5px 5px 13px var(--rest-sh), -4px -4px 11px #fffdf1;
  color: var(--rest-text);
}
.cell.rest .rtxt {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 3px;
  writing-mode: vertical-rl;
  text-orientation: upright;
  color: var(--text);
}

.hint {
  margin: 6px 0 0;
  text-align: center;
  font-size: 10.5px;
  color: var(--muted);
  letter-spacing: .3px;
  flex-shrink: 0;
}

/* 周切换按钮 */
.week-switch {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 10px 6px 12px;
  flex-shrink: 0;
}
.wk-btn {
  flex: 1;
  max-width: 120px;
  padding: 11px 0;
  border: none;
  border-radius: 14px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--text-2);
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
  cursor: pointer;
  transition: all .15s;
}
.wk-btn:active {
  transform: scale(.96);
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
}
.wk-btn:disabled {
  opacity: .35;
  cursor: not-allowed;
  box-shadow: none;
}
.wk-btn.wk-today {
  background: linear-gradient(150deg, var(--accent), var(--accent-2));
  color: #fff;
  box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
}
.wk-btn.wk-today:active {
  box-shadow: inset 3px 3px 7px rgba(0,0,0,.2), inset -3px -3px 7px rgba(255,255,255,.15);
}

/* ===========================================================
   底部批量操作栏
   =========================================================== */
.batch-bar {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 16px;
  width: calc(100% - 28px);
  max-width: 432px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 16px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 6px 6px 18px var(--sh-dark), -6px -6px 18px var(--sh-light);
  z-index: 60;
}
.batch-bar #batchCount {
  flex: 1;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
}
.batch-bar .btn {
  width: auto;
  margin: 0;
  padding: 10px 16px;
  font-size: 13px;
}
.batch-bar .btn.ghost {
  color: var(--text-2);
  background: var(--bg);
  box-shadow: inset 2px 2px 6px var(--sh-dark), inset -2px -2px 6px var(--sh-light);
}

/* ===========================================================
   卡片 / 表单
   =========================================================== */
.card {
  margin-bottom: 14px;
  padding: 16px 15px 6px;
  border-radius: var(--r-card);
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 6px 6px 15px var(--sh-dark), -6px -6px 15px var(--sh-light);
}
.section-label {
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: 10px;
  letter-spacing: .3px;
}

.field { margin-bottom: 14px; }
.field > label {
  display: block;
  margin-bottom: 7px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: .2px;
}
.field > label em {
  margin-left: 6px;
  font-style: normal;
  font-size: 10px;
  font-weight: 400;
  color: var(--muted);
}

input[type="text"], input[type="date"], textarea, select.input-like {
  width: 100%;
  padding: 12px 13px;
  border: none;
  border-radius: 13px;
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  font-family: inherit;
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  outline: none;
  transition: box-shadow .18s ease;
}
input:focus, textarea:focus, select.input-like:focus {
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light), 0 0 0 2px var(--accent-soft);
}
textarea { resize: vertical; line-height: 1.5; }
input::placeholder, textarea::placeholder { color: #b3b9c9; }

/* 教师下拉 */
select.input-like {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%236d7488' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 13px center;
  padding-right: 34px;
}

.tiny { margin: 6px 0 0; font-size: 10.5px; color: var(--muted); line-height: 1.5; }
.tiny.warn { color: #c98a3a; }

.row { display: flex; gap: 8px; align-items: stretch; }
.row input { flex: 1; }

/* 节次/班型 列头 */
.class-switch {
  cursor: pointer;
  transition: all .15s;
}
.class-switch:active {
  transform: scale(.96);
}
.class-switch .c1 {
  font-size: 12px;
  font-weight: 700;
  color: var(--accent);
}
.class-switch .c2 {
  font-size: 10px;
  color: var(--muted);
  font-weight: 500;
}

/* 班型列表 */
.class-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.class-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
  cursor: pointer;
  transition: all .15s;
  position: relative;
}
.class-row:active {
  transform: scale(.98);
  box-shadow: 2px 2px 6px var(--sh-dark), -2px -2px 6px var(--sh-light);
}
.class-row.current {
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
}
.class-color-dot {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}
.class-row-info {
  flex: 1;
  min-width: 0;
}
.class-row-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--text);
  line-height: 1.3;
}
.class-row-meta {
  font-size: 11px;
  color: var(--muted);
  margin-top: 3px;
}
.class-row-current-tag {
  font-size: 11px;
  color: var(--accent);
  font-weight: 700;
  margin-right: 4px;
}
.class-edit-btn {
  background: none;
  border: none;
  color: var(--text-2);
  font-size: 20px;
  padding: 6px 10px;
  cursor: pointer;
  line-height: 1;
  border-radius: 8px;
  transition: background .15s;
}
.class-edit-btn:active {
  background: rgba(0,0,0,.05);
}

/* 班型编辑弹窗 */
.class-edit-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  padding: 20px;
  box-sizing: border-box;
}
.class-edit-box {
  width: 100%;
  max-width: 340px;
  background: var(--bg);
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 10px 40px rgba(0,0,0,.2);
}
.class-edit-box h3 {
  margin: 0 0 16px;
  font-size: 16px;
  text-align: center;
  color: var(--text);
}
.class-edit-box .field { margin-bottom: 14px; }
.class-edit-box input[type="text"],
.class-edit-box input[type="date"] {
  width: 100%;
  padding: 11px 12px;
  border: none;
  border-radius: 12px;
  background: var(--bg);
  color: var(--text);
  font-size: 13.5px;
  font-family: inherit;
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  outline: none;
  box-sizing: border-box;
}
.class-edit-box .field label {
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  color: var(--text-2);
}
.color-picker-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
}
.color-swatch {
  aspect-ratio: 1;
  border-radius: 50%;
  cursor: pointer;
  transition: transform .15s;
  border: 3px solid transparent;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
}
.color-swatch.active {
  border-color: #fff;
  transform: scale(1.15);
  box-shadow: 0 0 0 2px var(--accent), 0 3px 8px rgba(0,0,0,.2);
}

/* 详情页教师座位选择器（5列，紧凑） */
.teacher-seat-box { display: block; }
.pick-seat-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 6px;
  width: 100%;
}
.pick-seat {
  height: 38px;
  border-radius: 9px;
  font-size: 11.5px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 2px;
  box-sizing: border-box;
  transition: all .13s;
  user-select: none;
}
.pick-seat.main {
  background: var(--bg);
  color: var(--text-2);
  box-shadow: inset 2px 2px 4px var(--sh-dark), inset -2px -2px 4px var(--sh-light);
}
.pick-seat.ta {
  background: var(--bg);
  color: var(--text-2);
  box-shadow: inset 2px 2px 4px var(--sh-dark), inset -2px -2px 4px var(--sh-light);
}
.pick-seat.main.on {
  background: linear-gradient(145deg, #5ba7db, #357fae);
  color: #fff;
  box-shadow: 3px 3px 7px rgba(67,150,205,.35), -2px -2px 5px var(--sh-light);
}
.pick-seat.ta.on {
  background: linear-gradient(145deg, #a5b88a, #7c9660);
  color: #fff;
  box-shadow: 3px 3px 7px rgba(146,171,118,.35), -2px -2px 5px var(--sh-light);
}
.pick-seat.empty {
  background: transparent;
  border: 1.5px dashed #d5dae1;
}
.pick-seat:active { transform: scale(.94); }

/* 教师座位图（5列×7排） */
.seat-legend {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-bottom: 10px;
}
.legend-item {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  color: var(--text-2);
}
.legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}
.legend-dot.main { background: #4396CD; }
.legend-dot.ta { background: #92AB76; }
.legend-dot.empty {
  background: transparent;
  border: 1.5px dashed #c8ced6;
}

.seat-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(7, 52px);
  gap: 8px;
}
.seat {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  transition: all .15s;
  user-select: none;
  position: relative;
  overflow: hidden;
  text-align: center;
  padding: 0 3px;
}
.seat.empty {
  background: var(--bg);
  box-shadow: inset 2px 2px 5px var(--sh-dark), inset -2px -2px 5px var(--sh-light);
  color: var(--muted);
  font-weight: 500;
  font-size: 20px;
}
.seat.empty:active {
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
}
.seat.main {
  background: linear-gradient(145deg, #5ba7db, #357fae);
  color: #fff;
  box-shadow: 3px 3px 7px rgba(67,150,205,.35), -3px -3px 7px var(--sh-light);
}
.seat.ta {
  background: linear-gradient(145deg, #a5b88a, #7c9660);
  color: #fff;
  box-shadow: 3px 3px 7px rgba(146,171,118,.35), -3px -3px 7px var(--sh-light);
}
.seat.main:active, .seat.ta:active {
  transform: scale(.95);
}
.seat .seat-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  line-height: 1.2;
}

/* 教师编辑弹窗 */
.teacher-edit-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  padding: 20px;
  box-sizing: border-box;
}
.teacher-edit-box {
  width: 100%;
  max-width: 320px;
  background: var(--bg);
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 10px 40px rgba(0,0,0,.2);
}
.teacher-edit-box h3 {
  margin: 0 0 14px;
  font-size: 15px;
  text-align: center;
  color: var(--text);
}
.teacher-edit-box .field { margin-bottom: 14px; }
.teacher-edit-box input[type="text"] {
  width: 100%;
  padding: 11px 12px;
  border: none;
  border-radius: 12px;
  background: var(--bg);
  color: var(--text);
  font-size: 13.5px;
  font-family: inherit;
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  outline: none;
  box-sizing: border-box;
}
.teacher-edit-box .field label { margin-bottom: 6px; font-size: 12px; color: var(--text-2); }
.level-picker {
  display: flex;
  gap: 8px;
}
.level-picker .lv-btn {
  flex: 1;
  padding: 10px 0;
  border: none;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  background: var(--bg);
  color: var(--text-2);
  box-shadow: inset 2px 2px 5px var(--sh-dark), inset -2px -2px 5px var(--sh-light);
}
.level-picker .lv-btn.active.main {
  background: linear-gradient(145deg, #5ba7db, #357fae);
  color: #fff;
  box-shadow: 3px 3px 7px rgba(67,150,205,.3), -2px -2px 6px var(--sh-light);
}
.level-picker .lv-btn.active.ta {
  background: linear-gradient(145deg, #a5b88a, #7c9660);
  color: #fff;
  box-shadow: 3px 3px 7px rgba(146,171,118,.3), -2px -2px 6px var(--sh-light);
}

/* 材料 chips */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  padding: 9px 14px;
  border: none;
  border-radius: 20px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--text-2);
  font-size: 12.5px;
  font-family: inherit;
  font-weight: 600;
  box-shadow: 4px 4px 9px var(--sh-dark), -4px -4px 9px var(--sh-light);
  cursor: pointer;
  transition: all .16s ease;
}
.chip.on {
  background: linear-gradient(150deg, var(--accent), var(--accent-2));
  color: #fff;
  box-shadow: inset 2px 2px 6px rgba(10,30,60,.45), 2px 3px 8px rgba(24,69,129,.3);
}
.chip:active { transform: scale(.95); }

/* 材料子项勾选 */
.mat-items {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--bg);
  box-shadow: inset 2px 2px 6px var(--sh-dark), inset -2px -2px 6px var(--sh-light);
}
.mat-items .mi-title { font-size: 11.5px; font-weight: 700; color: var(--accent); margin-bottom: 6px; }
.mat-items .mi-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0 14px 6px 0;
  font-size: 12px;
  color: var(--text-2);
}
.mat-items .mi-item input { width: 15px; height: 15px; accent-color: var(--accent); }

/* 设置页编辑行 */
.edit-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.edit-row { display: flex; gap: 8px; align-items: center; }
.edit-row input {
  flex: 1;
  min-width: 0;
  padding: 11px 12px;
  border: none;
  border-radius: 12px;
  background: var(--bg);
  color: var(--text);
  font-size: 13.5px;
  font-family: inherit;
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  outline: none;
}
.edit-row.mat input:first-child { flex: 0 0 38%; }
.edit-row .del {
  flex: 0 0 auto;
  width: 28px; height: 28px;
  border: none;
  border-radius: 9px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--danger);
  font-size: 17px;
  line-height: 1;
  box-shadow: 3px 3px 7px var(--sh-dark), -3px -3px 7px var(--sh-light);
  cursor: pointer;
}
.edit-row .del:active { box-shadow: inset 2px 2px 5px var(--sh-dark); }

/* 教室配色 · 色板 */
.room-row { display: flex; align-items: center; gap: 10px; padding: 6px 2px; flex-wrap: wrap; }
.room-name { flex: 0 0 auto; min-width: 64px; font-size: 13px; color: var(--text); font-weight: 600; }
.swatches { display: flex; gap: 7px; flex-wrap: wrap; }
.swatch {
  width: 26px; height: 26px;
  border: none; border-radius: 50%;
  padding: 0; cursor: pointer;
  box-shadow: 2px 2px 5px var(--sh-dark), -2px -2px 5px var(--sh-light);
  outline: none;
  transition: transform .08s ease;
}
.swatch:active { transform: scale(.9); }
.swatch.sel { box-shadow: 0 0 0 2.5px #184581, 2px 2px 5px var(--sh-dark); }

/* 按钮 */
.btn {
  width: 100%;
  padding: 13px;
  margin-bottom: 12px;
  border: none;
  border-radius: 15px;
  font-size: 14.5px;
  font-family: inherit;
  font-weight: 700;
  letter-spacing: .5px;
  cursor: pointer;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--accent);
  box-shadow: 5px 5px 12px var(--sh-dark), -5px -5px 12px var(--sh-light);
  transition: all .16s ease;
}
.btn:active {
  box-shadow: inset 3px 3px 8px var(--sh-dark), inset -3px -3px 8px var(--sh-light);
  transform: scale(.99);
}
.btn.primary {
  background: linear-gradient(150deg, var(--accent), var(--accent-2));
  color: #fff;
  box-shadow: 5px 6px 14px rgba(24,69,129,.4), -4px -4px 11px var(--sh-light);
}
.btn.primary:active { box-shadow: inset 3px 3px 9px rgba(10,30,60,.5); }
.btn.danger-ghost { color: var(--danger); }
.btn.small { width: auto; padding: 12px 18px; margin: 0; font-size: 13px; }

.actions { margin-top: 4px; }

/* Toast */
.toast {
  position: fixed;
  left: 50%;
  bottom: 34px;
  transform: translate(-50%, 20px);
  padding: 11px 22px;
  border-radius: 14px;
  background: rgba(58, 63, 82, .93);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .3px;
  opacity: 0;
  pointer-events: none;
  transition: all .25s ease;
  z-index: 99;
  box-shadow: 0 8px 24px rgba(58,63,82,.28);
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ===========================================================
   周管理（按月归档 · 卡片网格 · 右键/长按编辑）
   =========================================================== */
.month-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 20px 4px 10px;
}
.month-head:first-child { margin-top: 4px; }
.month-head .mh-label {
  font-size: 14.5px;
  font-weight: 800;
  color: var(--text);
  letter-spacing: .5px;
}
.month-head.cur .mh-label { color: var(--accent); }
.month-head .mh-badge {
  font-size: 10.5px;
  color: var(--muted);
  padding: 3px 10px;
  border-radius: 99px;
  background: var(--bg);
  box-shadow: inset 1px 1px 3px var(--sh-dark), inset -1px -1px 3px var(--sh-light);
}
.month-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px;
}
.wk-card {
  padding: 11px 2px 9px;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 4px 4px 9px var(--sh-dark), -4px -4px 9px var(--sh-light);
  text-align: center;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  touch-action: manipulation;
  transition: transform .13s ease, box-shadow .15s ease;
}
.wk-card:active { transform: scale(.94); }
.wk-card.active {
  box-shadow: 4px 4px 9px var(--sh-dark), -4px -4px 9px var(--sh-light), inset 0 0 0 2px var(--accent);
}
.wkc-range {
  font-size: 12.5px;
  font-weight: 800;
  color: var(--text);
  letter-spacing: .2px;
  white-space: nowrap;
}
.wkc-meta { margin-top: 4px; font-size: 10px; color: var(--muted); white-space: nowrap; }
.wkc-st.st-run { color: var(--accent); font-weight: 700; }
.wkc-st.st-future { color: var(--text-2); }

/* 窄屏微调 */
@media (max-width: 372px) {
  .grid { grid-template-columns: 56px 52px repeat(6, 74px); gap: 6px; }
  .cell.period .nm { font-size: 13px; }
  .cell.period .tm { font-size: 9px; }
  .cell.course.has .ct { font-size: 11px; }
}

/* ===========================================================
   导出操作弹窗（底部 sheet）
   =========================================================== */
.sheet {
  position: fixed; inset: 0; z-index: 200;
  display: flex; align-items: flex-end; justify-content: center;
  animation: fade .18s ease both;
}
.sheet-mask {
  position: absolute; inset: 0;
  background: rgba(58, 63, 82, .35);
  backdrop-filter: blur(2px);
}
.sheet-body {
  position: relative;
  width: 100%; max-width: 432px;
  margin: 0 14px 14px;
  padding: 18px 16px 14px;
  border-radius: 22px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  box-shadow: 6px 6px 22px var(--sh-dark), -6px -6px 22px var(--sh-light);
  text-align: center;
  animation: sheet-up .22s ease both;
}
@keyframes sheet-up {
  from { transform: translateY(30px); opacity: 0; }
  to { transform: none; opacity: 1; }
}
.sheet-title { font-size: 15px; font-weight: 800; color: var(--text); }
.sheet-sub { margin-top: 4px; font-size: 11px; color: var(--muted); }
.sheet-btn {
  display: block; width: 100%;
  margin-top: 12px;
  padding: 13px;
  border: none;
  border-radius: 14px;
  background: linear-gradient(145deg, var(--bg-2), var(--bg));
  color: var(--accent);
  font-size: 14.5px; font-weight: 700; font-family: inherit;
  box-shadow: 4px 4px 10px var(--sh-dark), -4px -4px 10px var(--sh-light);
  cursor: pointer;
  transition: all .14s ease;
}
.sheet-btn:active {
  box-shadow: inset 3px 3px 8px var(--sh-dark), inset -3px -3px 8px var(--sh-light);
  transform: scale(.99);
}
.sheet-btn:first-of-type { background: linear-gradient(150deg, var(--accent), var(--accent-2)); color: #fff; }
.sheet-btn.cancel { color: var(--text-2); margin-top: 6px; box-shadow: inset 2px 2px 6px var(--sh-dark), inset -2px -2px 6px var(--sh-light); }

/* ===========================================================
   开关 / 子标签（设置页企微配置用）
   =========================================================== */
label.switch {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 14px;
  border-radius: 12px;
  background: var(--bg);
  box-shadow: inset 3px 3px 7px var(--sh-dark), inset -3px -3px 7px var(--sh-light);
  font-size: 13.5px; font-weight: 700; color: var(--text);
  cursor: pointer;
  user-select: none;
}
label.switch input { width: 18px; height: 18px; accent-color: var(--accent); cursor: pointer; }
label.sub {
  display: block;
  margin: 0 0 7px;
  font-size: 12px;
  font-weight: 700;
  color: var(--text);
  letter-spacing: .2px;
}
label.sub em {
  margin-left: 6px;
  font-style: normal;
  font-size: 10px;
  font-weight: 400;
  color: var(--muted);
}

/* ===========================================================
   桌面端（≥768px）：整周课程一屏全部显示，无需横滑
   手机端样式完全不变（窄屏媒体查询优先级在本块之前）
   =========================================================== */
@media (min-width: 768px) {
  .app {
    max-width: 1080px;
    padding: 16px 28px 0;
  }

  /* 课程网格：列宽自适应，6 个教学日 + 休息日全部可见 */
  .grid {
    grid-template-columns: 92px 78px repeat(6, 1fr);
    grid-template-rows: 54px minmax(38px, 0.6fr) repeat(4, minmax(70px, 1.1fr));
    gap: 10px;
    width: 100%;
  }

  /* 文字随格子放大，保持桌面端可读性 */
  .cell.head .wk { font-size: 14px; }
  .cell.head .dt { font-size: 10.5px; }
  .cell.period .nm { font-size: 15px; }
  .cell.period .tm { font-size: 10px; }
  .cell.course.has .ct { font-size: 14px; }
  .cell.course.has .cs { font-size: 11px; }
  .cell.course.has .room-badge { font-size: 10.5px; padding: 3px 10px; margin-top: 6px; }
  .cell.course.has .dot { top: 6px; right: 7px; width: 5px; height: 5px; }
  .cell.course.empty .plus { font-size: 20px; }
  .cell.course.has.double .course-half .ct { font-size: 13px; }
  .cell.course.has.double .course-half .cs { font-size: 10px; }
  .cell.rest .rtxt { font-size: 15px; }

  /* 二级页面保持窄版居中，不随宽屏拉伸变形 */
  #view-weeks.active,
  #view-settings.active,
  #view-detail.active,
  #view-batch.active,
  #view-classes.active {
    max-width: 560px;
    margin: 0 auto;
  }
}


/* 跳转到班主任工作台按钮 */
.jump-workbuddy-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: inherit;
}
.jump-workbuddy-btn:hover {
  background: rgba(0,0,0,0.06);
}