/* ═══════════════════════════════════════════
   panel.css — 教师端样式
   ═══════════════════════════════════════════ */

.panel-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0 12px; border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-wrap: wrap; gap: 8px;
}
.panel-head .ph-left { display: flex; align-items: center; gap: 10px; }
.panel-head h1 {
  font-size: 1.15rem; font-weight: 800;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.panel-head .ph-sub { font-size: 0.72rem; color: var(--text-dim); }
.panel-head .ph-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ── Tabs ── */
.panel-tabs { display: flex; gap: 6px; margin: 14px 0; flex-wrap: wrap; }
.panel-tab {
  padding: 8px 20px; border-radius: 20px; cursor: pointer; font-family: inherit;
  background: var(--card-bg); border: 1px solid rgba(255,255,255,0.08);
  color: var(--text); font-size: 0.85rem; font-weight: 600; transition: all 0.15s;
}
.panel-tab:hover { border-color: rgba(255,255,255,0.2); }
.panel-tab.active {
  background: linear-gradient(135deg, var(--accent), #ff8c00);
  color: #1a1a2e; font-weight: 800; border-color: transparent;
}

/* ── 概览卡片 ── */
.pp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin-bottom: 14px; }
.pp-card {
  background: var(--card-bg); border-radius: 14px; padding: 14px 16px;
  border: 1px solid rgba(255,255,255,0.06); text-align: center;
}
.pp-card .num { font-size: 1.4rem; font-weight: 800; color: var(--accent); }
.pp-card .num.c2 { color: var(--accent2); }
.pp-card .num.c3 { color: var(--accent3); }
.pp-card .num.c4 { color: #b388ff; }
.pp-card .lbl { font-size: 0.7rem; color: var(--text-dim); margin-top: 3px; }

/* ── 工具条 ── */
.pp-toolbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-bottom: 12px;
}
.pp-toolbar .grow { flex: 1; }
.pp-toolbar .pp-input, .pp-toolbar .pp-select { width: auto; }

/* ── 表格 ── */
.pp-table-wrap { overflow-x: auto; border-radius: 14px; border: 1px solid rgba(255,255,255,0.06); }
.pp-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; min-width: 720px; }
.pp-table th {
  text-align: left; padding: 10px 12px; color: var(--text-dim); font-size: 0.72rem;
  font-weight: 700; background: rgba(255,255,255,0.03); white-space: nowrap;
}
.pp-table td { padding: 10px 12px; border-top: 1px solid rgba(255,255,255,0.05); vertical-align: middle; }
.pp-table tr:hover td { background: rgba(255,255,255,0.02); }
.pp-table .rank-cell { font-weight: 800; color: var(--text-dim); width: 44px; }
.pp-table .rank-cell.top1 { color: #ffd700; }
.pp-table .rank-cell.top2 { color: #c0c0c0; }
.pp-table .rank-cell.top3 { color: #cd7f32; }
.pp-table .name-cell { font-weight: 700; }
.pp-table .name-cell .acc { font-weight: 400; color: var(--text-dim); font-size: 0.72rem; }
.pp-table .pts { color: var(--accent); font-weight: 800; }
.pp-table .subj-cell { font-size: 0.72rem; color: var(--text-dim); max-width: 180px; line-height: 1.5; }
.pp-table .actions-cell { white-space: nowrap; }
/* pp122：操作列只剩「👀 查看 / ✉️ 私信 / ⋯」三个短按钮（编辑/重置/删除收进菜单了），
   不用再为了 5 个按钮提前换行 —— 断点从 1100 收到 620，1024 的笔记本上按钮排成一行。 */
@media (max-width: 620px) {
  .pp-table .actions-cell { white-space: normal; }
  .pp-table .actions-cell .btn { margin-bottom: 3px; }
}
/* 「请实名」已提醒状态：绿色描边 + 浅绿底，一眼看出这行已经提醒过了（pp76） */
.btn-tiny.rn-on {
  color: #2E7D32;
  border: 1px solid rgba(46, 125, 50, 0.45);
  background: rgba(76, 175, 80, 0.12);
}
.btn-tiny.rn-on:hover { background: rgba(76, 175, 80, 0.22); }

/* pp90：孤儿存档行（有存档、账号记录已经没了）——
   浅色底用深色实值，别用 --text-dim（在浅色面板上会糊成一片看不见）。
   整行淡黄底 + 左侧橙色竖条，扫一眼就知道这几行要处理。 */
.pp-table tr.pp-orphan-row { background: rgba(255, 193, 7, 0.10); }
.pp-table tr.pp-orphan-row:hover { background: rgba(255, 193, 7, 0.18); }
.pp-table tr.pp-orphan-row > td:first-child { box-shadow: inset 3px 0 0 #E08A00; }
.pp-orphan-tag { color: #B26A00; font-weight: 700; }

/* ── 分页 ── */
.pp-pager { display: flex; align-items: center; gap: 10px; justify-content: center; margin-top: 12px; }
.pp-pager .info { font-size: 0.78rem; color: var(--text-dim); }

/* ── 学科管理 ── */
.subject-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.subject-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  flex-wrap: wrap; margin-bottom: 12px;
  background: var(--card-bg); border-radius: 14px; padding: 12px 16px;
  border: 1px solid rgba(255,255,255,0.06);
}
.subject-toolbar .st-left { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.subject-toolbar .st-right { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.subject-toolbar h3 { font-size: 1rem; }

/* 开关 */
.pp-switch { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; user-select: none; }
.pp-switch .track {
  width: 40px; height: 22px; border-radius: 12px; background: rgba(255,255,255,0.12);
  position: relative; transition: background 0.2s;
}
.pp-switch .track::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px;
  border-radius: 50%; background: #888; transition: all 0.2s;
}
.pp-switch.on .track { background: rgba(46,204,113,0.4); }
.pp-switch.on .track::after { left: 20px; background: var(--green); }
.pp-switch .sw-label { font-size: 0.78rem; font-weight: 600; }

/* 题干单元格 */
.q-text-cell { max-width: 420px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.q-badge { display: inline-block; font-size: 0.68rem; padding: 1px 8px; border-radius: 8px; background: rgba(255,255,255,0.06); color: var(--text-dim); }
.q-badge.right { background: rgba(46,204,113,0.12); color: var(--green); }
.q-badge.t-choice { background: rgba(78,205,196,0.14); color: var(--accent2); }
.q-badge.t-fill { background: rgba(255,215,0,0.14); color: var(--accent); }
.q-badge.t-short { background: rgba(189,16,224,0.16); color: #d980f0; }
.q-badge.grade { background: rgba(255,107,107,0.12); color: var(--accent3); }
.q-badge.grade.gen { background: rgba(255,255,255,0.06); color: var(--text-dim); }

/* 题库年级筛选条 */
.bank-filter {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: var(--card-bg); border-radius: 12px; padding: 8px 14px;
  border: 1px solid rgba(255,255,255,0.06); margin-bottom: 12px;
}
.bank-filter .bf-label { font-size: 0.78rem; color: var(--text-dim); font-weight: 600; }
.bank-filter .bf-types { display: inline-flex; gap: 6px; margin-left: 4px; }
.bank-filter .grow { flex: 1; }
.bank-filter .bf-count { font-size: 0.74rem; color: var(--text-dim); }
/* 题库关键词搜索（pp81）—— 教师端面板是浅色底（kid-app.css 最后加载），
   所以输入框/清除按钮/高亮都用深色实值，别用 --text-dim 之类的暗色系变量 */
.bank-filter .bf-search-wrap { position: relative; display: inline-flex; align-items: center; flex: 0 1 300px; min-width: 176px; }
.bank-filter .bf-search {
  width: 100%; padding: 7px 28px 7px 11px; font-size: 0.82rem;
  background: #FFFFFF; border: 1px solid #D6D3E8; border-radius: 9px; color: #2E2A45;
  outline: none;
}
.bank-filter .bf-search::placeholder { color: #948FAC; }
.bank-filter .bf-search:focus { border-color: var(--accent2); box-shadow: 0 0 0 2px rgba(255,138,61,0.14); }
.bank-filter .bf-clear {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; padding: 0; line-height: 1; border: 0; border-radius: 50%;
  background: #ECEAF4; color: #55507A; font-size: 0.68rem; cursor: pointer;
}
.bank-filter .bf-clear:hover { background: #E0DDF0; color: #2E2A45; }
mark.qk { background: #FFE9A8; color: #6B4E00; padding: 0 1px; border-radius: 3px; }
.q-type-area { border-top: 1px dashed rgba(255,255,255,0.08); padding-top: 12px; margin-top: 2px; }

/* 选项编辑器 */
.opt-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.opt-row input[type="radio"] { accent-color: var(--green); width: 16px; height: 16px; flex-shrink: 0; cursor: pointer; }
.opt-row .pp-input { flex: 1; }
.opt-row .opt-del {
  background: none; border: none; color: var(--accent3); cursor: pointer;
  font-size: 0.9rem; padding: 4px 6px; border-radius: 6px; flex-shrink: 0;
}
.opt-row .opt-del:hover { background: rgba(255,107,107,0.12); }
.opt-hint { font-size: 0.72rem; color: var(--text-dim); margin-bottom: 10px; }
.import-result { margin-top: 10px; font-size: 0.78rem; line-height: 1.7; max-height: 140px; overflow-y: auto; }
.import-result .ok { color: var(--green); }
.import-result .bad { color: var(--accent3); }

/* ── 设置页 ── */
.set-section {
  background: var(--card-bg); border-radius: 16px; padding: 18px 20px;
  border: 1px solid rgba(255,255,255,0.06); margin-bottom: 14px;
}
.set-section h3 { font-size: 0.95rem; margin-bottom: 12px; }
.set-inline { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.set-inline label { font-size: 0.82rem; min-width: 110px; color: var(--text); font-weight: 600; }
.set-tip { font-size: 0.72rem; color: var(--text-dim); margin-top: 6px; line-height: 1.6; }

.set-bg-area {
  width: 100%; height: 110px; border-radius: 12px; overflow: hidden;
  background: rgba(0,0,0,0.2); border: 1px solid rgba(255,255,255,0.06);
  margin-bottom: 10px;
}
.set-bg-preview { width: 100%; height: 100%; object-fit: cover; }
.set-bg-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: var(--text-dim); font-size: 0.8rem; }
.set-bg-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.set-bg-presets-label { font-size: 0.76rem; color: var(--text-dim); margin: 14px 0 8px; }
.set-bg-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.set-bg-thumb {
  position: relative; padding: 0; background: none; cursor: pointer;
  border: 2px solid transparent; border-radius: 10px; overflow: hidden;
  aspect-ratio: 16 / 10;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.set-bg-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.set-bg-thumb span {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 12px 6px 3px;
  font-size: 0.68rem; font-weight: 700; color: #fff; text-align: center;
  background: linear-gradient(transparent, rgba(0,0,0,0.62));
}
.set-bg-thumb:hover { transform: translateY(-2px); }
.set-bg-thumb.active { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(255,179,0,0.35); }

.set-pet-section { margin-bottom: 6px; border-radius: 12px; overflow: hidden; background: rgba(0,0,0,0.15); }
.set-pet-header {
  display: flex; align-items: center; gap: 8px; padding: 10px 12px;
  cursor: pointer; user-select: none; transition: background 0.15s;
}
.set-pet-header:hover { background: rgba(255,255,255,0.04); }
.set-pet-header.open { background: rgba(255,255,255,0.03); }
.set-pet-emoji { font-size: 1.3rem; }
.set-pet-name { font-size: 0.85rem; font-weight: 600; flex: 1; }
.set-pet-badge { font-size: 0.65rem; color: var(--text-dim); background: rgba(255,255,255,0.05); padding: 2px 8px; border-radius: 10px; }
.set-pet-arrow { font-size: 0.7rem; color: var(--text-dim); transition: transform 0.2s; }
.set-pet-header.open .set-pet-arrow { transform: rotate(180deg); }
.set-pet-body { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
.set-pet-body.open { max-height: 420px; overflow-y: auto; }
.set-lv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(80px, 1fr)); gap: 6px; padding: 8px 12px 12px; }
.set-lv-slot {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  background: rgba(0,0,0,0.12); border-radius: 8px; padding: 6px;
}
.set-preview-sm { width: 36px; height: 36px; border-radius: 8px; overflow: hidden; background: rgba(0,0,0,0.15); display: flex; align-items: center; justify-content: center; }
.set-preview-img { width: 100%; height: 100%; object-fit: contain; }
.set-preview-num { font-size: 0.6rem; color: var(--text-dim); }
.set-lv-label { font-size: 0.6rem; color: var(--text-dim); }
.set-lv-upload-btn {
  padding: 2px 8px; font-size: 0.65rem; border-radius: 10px;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: var(--text-dim); cursor: pointer; font-family: inherit;
}
.set-lv-upload-btn:hover { background: rgba(255,255,255,0.08); color: #fff; }
.set-lv-clear {
  background: none; border: none; color: var(--accent3); font-size: 0.6rem;
  cursor: pointer; padding: 1px 4px;
}
.set-lv-clear:hover { background: rgba(255,107,107,0.15); border-radius: 4px; }

/* ── pp77 配图上传规范指引 ──
   ⚠ 教师端是浅色主题：文字必须用深色实值，别用 --text-dim / 浅绿色，
     否则白底上几乎看不见（踩过一次）。 */
.set-pet-guide {
  display: flex; gap: 14px; align-items: flex-start;
  margin: 8px 0 12px; padding: 12px 14px;
  background: #f2faf2;
  border: 1px solid #bfe0c0;
  border-radius: 10px;
}
.set-pet-guide-fig {
  flex: none; position: relative;
  width: 92px; height: 92px;
  border: 1px solid #c3b89f; border-radius: 8px;
  /* 棋盘格＝透明背景，示意「背景要抠干净」 */
  background-color: #fff;
  background-image:
    linear-gradient(45deg, #e8e4d8 25%, transparent 25%),
    linear-gradient(-45deg, #e8e4d8 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #e8e4d8 75%),
    linear-gradient(-45deg, transparent 75%, #e8e4d8 75%);
  background-size: 12px 12px;
  background-position: 0 0, 0 6px, 6px -6px, -6px 0;
}
.set-pet-guide-safe {
  position: absolute; inset: 8%;
  border: 1px dashed #2e7d32; border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(46,125,50,0.1);
}
.set-pet-guide-safe span {
  font-size: 0.7rem; font-weight: 700; color: #1b5e20;
  background: rgba(255,255,255,0.94); padding: 1px 5px; border-radius: 4px;
  border: 1px solid rgba(46,125,50,0.35);
}
.set-pet-guide-txt { flex: 1; min-width: 0; font-size: 0.76rem; line-height: 1.75; color: #4a4a3c; }
.set-pet-guide-txt > b { display: block; margin-bottom: 5px; font-size: 0.82rem; color: #2e7d32; }
.set-pet-guide-txt ul { margin: 0; padding-left: 1.1em; }
.set-pet-guide-txt li { margin-bottom: 3px; }
.set-pet-guide-txt li em { font-style: normal; font-weight: 700; color: #1b5e20; }
.set-pet-guide-auto {
  margin: 9px 0 0; padding: 7px 10px; font-size: 0.73rem;
  color: #33691e; background: #e8f5e9; border-left: 3px solid #7cb342; border-radius: 4px;
}
.set-pet-guide-auto b { color: #1b5e20; }
@media (max-width: 560px) {
  .set-pet-guide { flex-direction: column; align-items: stretch; gap: 10px; }
  .set-pet-guide-fig { width: 74px; height: 74px; align-self: center; }
  .set-pet-guide-txt { font-size: 0.74rem; }
}

/* 批量建号结果 */
.create-result { margin-top: 12px; font-size: 0.8rem; line-height: 1.8; max-height: 160px; overflow-y: auto; }
.create-result .ok { color: var(--green); }
.create-result .bad { color: var(--accent3); }

/* ═══════════════════ 教学开放范围（题库页） ═══════════════════ */
.scope-card {
  background: var(--card-bg); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px; margin-bottom: 12px; overflow: hidden;
}
.scope-card.on { border-color: rgba(78,205,196,0.45); }
.scope-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; background: rgba(255,255,255,0.03); flex-wrap: wrap;
}
.scope-title { font-size: 0.86rem; font-weight: 700; }
.scope-sum { font-size: 0.76rem; color: var(--text-dim); }
.scope-card.on .scope-sum { color: var(--accent2); }
.scope-head #scope-toggle { margin-left: auto; }
.scope-body { padding: 6px 14px 12px; }
.scope-tip { font-size: 0.76rem; color: var(--text-dim); line-height: 1.7; margin: 6px 0 10px; }
.scope-tip b { color: var(--accent); }
.scope-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 10px; }
.scope-row .sr-label { font-size: 0.76rem; color: var(--text-dim); font-weight: 600; }
.scope-units { display: flex; flex-direction: column; gap: 8px; }
.scope-unit { background: rgba(0,0,0,0.14); border-radius: 10px; padding: 8px 10px; }
.scope-chk {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.78rem; cursor: pointer; user-select: none;
}
.scope-chk input { accent-color: var(--accent2); cursor: pointer; width: 14px; height: 14px; }
.scope-unit-head { font-size: 0.82rem; }
.scope-unit-head b { color: var(--text); }
.su-cnt { font-size: 0.68rem; color: var(--text-dim); margin-left: 6px; }
.scope-lessons {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  margin: 9px 0 0 20px; padding-left: 10px;
  border-left: 2px solid rgba(255,255,255,0.07);
}
.sl-cnt { font-size: 0.66rem; color: var(--text-dim); margin-left: 3px; }
.scope-note { font-size: 0.72rem; color: var(--text-dim); margin-top: 9px; }
.scope-actions {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 12px; padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.scope-actions .grow { flex: 1 1 auto; }

/* 年级块（pp79）：三上第 1 课和五上第 1 课是两门不同的课，
   界面必须按年级分开，否则两个年级的同一单元号会并成一组。 */
.scope-gblk {
  border: 1px solid rgba(255,255,255,0.08); border-left: 3px solid var(--accent2);
  border-radius: 10px; padding: 9px 11px; margin-bottom: 10px;
}
.scope-gblk:last-of-type { margin-bottom: 0; }
.scope-gblk.off { opacity: 0.55; border-left-color: var(--text-dim); }
.scope-ghead { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.scope-ghead .grow { flex: 1 1 auto; }
.scope-gchk b { font-size: 0.86rem; color: var(--text); }
.sg-cnt { font-size: 0.72rem; color: var(--text-dim); }
.scope-gblk .scope-units { gap: 6px; }
.scope-gblk .scope-unit { background: rgba(0,0,0,0.10); }

/* ═══════════════════ 题目配图 + 批量导入工具 ═══════════════════ */
.q-badge.unit { background: rgba(78,205,196,0.10); color: var(--accent2); }
.q-thumb-link { display: inline-block; line-height: 0; }
.q-thumb {
  width: 44px; height: 32px; object-fit: cover; border-radius: 6px;
  border: 1px solid rgba(255,255,255,0.14); background: #fff; transition: transform 0.12s;
}
.q-thumb:hover { transform: scale(1.6); }

/* 添加 / 编辑题目弹窗里的配图区 */
.q-img-edit { display: flex; gap: 12px; align-items: flex-start; }
.q-img-preview {
  width: 150px; height: 100px; border-radius: 10px; flex: 0 0 auto;
  border: 1px dashed rgba(255,255,255,0.16); background: rgba(0,0,0,0.18);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.q-img-preview img { max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; }
.q-img-btns { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }

/* 添加 / 编辑题目弹窗里的干扰项（选择题错误选项） */
.alt-inputs { display: flex; flex-direction: column; gap: 6px; }
.alt-inputs .pp-input { width: 100%; }
.alt-tip { font-size: 0.72rem; color: var(--text-dim); margin-top: 6px; line-height: 1.6; }
.alts-note { font-size: 0.68rem; color: var(--text-dim); margin-top: 3px; letter-spacing: 0.02em; }
/* 图片选项题提示条：答案/干扰项里是图片地址，提醒老师别手改 */
.q-pic-note {
  margin: 4px 0 10px; padding: 9px 11px; border-radius: 10px;
  background: #FFF8E1; border: 1px solid #F0DFA8; border-left: 3px solid #E0B84C;
  font-size: 0.76rem; line-height: 1.7; color: #6B4E00;
}

/* 批量导入弹窗里的工具行 */
.im-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.im-tpl { text-decoration: none; }

/* ═══════════════════ 分班题库（班级范围） ═══════════════════ */
.class-chips {
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: -6px 0 14px;
  max-height: 132px; overflow-y: auto; padding: 2px;
}
.class-chips .cc-label { font-size: 0.78rem; color: var(--text-dim); font-weight: 600; }
.class-chip {
  font-family: inherit; cursor: pointer; padding: 4px 13px; border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.05);
  font-size: 0.78rem; font-weight: 600; color: var(--text); transition: all 0.15s;
}
.class-chip:hover { border-color: var(--accent2); }
.class-chip.active {
  background: linear-gradient(135deg, var(--accent), #ff8c00);
  color: #1a1a2e; border-color: transparent; font-weight: 800;
}
.bank-scope-tag {
  margin-left: 8px; padding: 2px 9px; border-radius: 8px; font-size: 0.68rem;
  font-weight: 600; vertical-align: middle;
  background: rgba(255,255,255,0.08); color: var(--text-dim);
}
.bank-scope-tag.cls { background: rgba(255,215,0,0.16); color: var(--accent); }
.bank-scope-note {
  margin-bottom: 12px; padding: 9px 13px; border-radius: 12px; font-size: 0.78rem;
  line-height: 1.5; color: var(--text);
  background: rgba(255,215,0,0.09); border: 1px solid rgba(255,215,0,0.22);
}

/* ═══ 打卡统计页 ═══ */
.stat-sec-title {
  font-size: 0.92rem; font-weight: 700; margin: 18px 0 10px;
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.stat-rule-tip {
  font-size: 0.7rem; font-weight: 400; color: var(--text-dim);
  background: rgba(255,255,255,0.05); padding: 2px 9px; border-radius: 8px;
}

/* 近 7 日趋势弹窗里的迷你条形图 */
.trend-bar {
  display: inline-block; width: 74px; height: 9px; vertical-align: middle;
  background: rgba(255,255,255,0.08); border-radius: 5px; overflow: hidden; margin-right: 7px;
}
.trend-bar > i {
  display: block; height: 100%; border-radius: 5px;
  background: linear-gradient(90deg, var(--accent2), var(--accent));
}

/* 按班级游戏规则：已配置班级列表 */
.set-cr-list {
  margin-top: 10px; padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.set-cr-list .set-inline { padding: 3px 0; }

/* ═══ 班级排名页 ═══ */
.rank-toolbar { flex-wrap: wrap; row-gap: 8px; }
.rank-sort-label { font-size: 0.76rem; color: var(--text-dim); font-weight: 600; }
.rank-sorts { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.rank-sort {
  font-family: inherit; font-size: 0.76rem; font-weight: 700; cursor: pointer;
  padding: 6px 12px; border-radius: 12px; white-space: nowrap;
  border: 2px solid var(--kid-line, rgba(120,110,170,0.22));
  background: var(--card-bg, #fff); color: var(--text, #3B3557);
  transition: all 0.15s;
}
.rank-sort:hover { border-color: var(--accent2); }
.rank-sort.active {
  border-color: transparent; color: #fff;
  background: linear-gradient(135deg, #4ECDC4, #35B2A8);
  box-shadow: 0 4px 12px rgba(78,205,196,0.28);
}

/* 班级行可点开班内排名 */
.rank-table .rank-row { cursor: pointer; }
.rank-table .rank-row.expanded td { background: rgba(78,205,196,0.07); }
.rank-table .rank-row .btn { white-space: nowrap; }

/* 班内排名明细（展开行） */
.rank-detail > td { padding: 4px 12px 14px !important; border-top: none !important; }
.rank-detail-head { font-size: 0.8rem; font-weight: 700; margin: 4px 0 8px; color: var(--text); }
.rank-detail-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 6px;
}
.rank-mini {
  display: flex; align-items: center; gap: 7px; flex-wrap: nowrap;
  padding: 7px 11px; border-radius: 11px; font-size: 0.78rem;
  background: rgba(255,255,255,0.05);
  border: 1px solid var(--kid-line, rgba(120,110,170,0.18));
}
.rank-mini.top1 { background: #FFF7DF; border-color: #FFD98A; }
.rank-mini.top2 { background: #F6F6FA; border-color: #DCDCE8; }
.rank-mini.top3 { background: #FDF3E7; border-color: #E8C9A6; }
.rank-mini .rm-rank { font-weight: 800; color: var(--text-dim); min-width: 22px; flex: 0 0 auto; }
.rank-mini .rm-name {
  flex: 1 1 auto; font-weight: 700; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rank-mini .rm-stat { color: var(--accent); font-weight: 700; white-space: nowrap; flex: 0 0 auto; }
.rank-mini .rm-stat.rm-dim { color: var(--accent2); }
.rank-mini .rm-badge {
  font-size: 0.66rem; font-weight: 700; padding: 2px 7px; border-radius: 8px;
  background: rgba(120,110,170,0.14); color: var(--text-dim); white-space: nowrap; flex: 0 0 auto;
}
.rank-mini .rm-badge.ok { background: rgba(88,214,141,0.22); color: #2E9E63; }
.rank-tip { font-size: 0.72rem; color: var(--text-dim); margin-top: 10px; line-height: 1.5; }

@media (max-width: 640px) {
  .rank-sorts { width: 100%; }
  .rank-detail-grid { grid-template-columns: 1fr; }
}

/* 班内排名可点击 → 只读查看该学生的乐园（pp34） */
.rank-mini[data-view] { cursor: pointer; transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s; }
.rank-mini[data-view]:hover {
  border-color: #6C63C8; box-shadow: 0 2px 10px rgba(108,99,200,0.18); transform: translateY(-1px);
}
.rank-mini[data-view]::after { content: '👀'; font-size: 0.8rem; opacity: 0.45; flex: 0 0 auto; }
.rank-mini[data-view]:hover::after { opacity: 1; }

/* ── 错题本页签（教师端）──
   ⚠ ../kid-app.css 是最终覆盖层，新样式一律加 body 前缀把权重提到 (0,2,1) 以上 ── */
body .q-badge.wrong { background: rgba(231,76,60,0.14); color: #ff8a7a; }
body .wb-hot-table td { vertical-align: top; }
body .wb-q-cell { min-width: 220px; max-width: 380px; line-height: 1.55; }
body .wb-a-cell { color: var(--green); font-weight: 700; min-width: 90px; }
body .wb-day-row td {
  background: rgba(78,205,196,0.08); color: var(--accent2);
  font-weight: 700; letter-spacing: 0.02em;
}

/* ── 每周排名（pp50）── */
body .wk-weekbar { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 12px; }
body .wk-week {
  font-family: inherit; font-size: 0.76rem; font-weight: 700; cursor: pointer;
  padding: 6px 14px; border-radius: 999px; white-space: nowrap;
  border: 2px solid var(--kid-line, rgba(120,110,170,0.22));
  background: var(--card-bg, #fff); color: var(--text, #3B3557);
  transition: all 0.15s;
}
body .wk-week:hover { border-color: #F5C518; }
body .wk-week.active {
  border-color: transparent; color: #6b4e00;
  background: linear-gradient(135deg, #FFE066, #FFC933);
  box-shadow: 0 4px 12px rgba(245,185,62,0.28);
}
/* ── 每周奖励编辑器（教师端是浅色主题：一律用暖棕系文字，别写浅金） ── */
body .wk-prize-box {
  padding: 12px 14px; border-radius: 14px; margin-bottom: 8px;
  background: linear-gradient(180deg, #FFFDF5, #FFF8E1);
  border: 2px dashed #FFD98A;
  transition: box-shadow .15s, border-color .15s;
}
body .wk-prize-box.dirty { border-color: #F5A623; box-shadow: 0 0 0 3px rgba(245,166,35,.16); }
body .wk-prize-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
body .wk-prize-ico { font-size: 1.05rem; }
body .wk-prize-title { font-size: 0.86rem; font-weight: 800; color: #B8860B; }
body .wk-prize-sub { font-size: 0.72rem; color: #8A7A5A; }
body .wk-prize-rows { display: flex; flex-direction: column; gap: 8px; }
body .wk-prize-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px 10px; border-radius: 10px;
  background: #fff; border: 1px solid #F3E3BE;
}
body .wk-prize-rank {
  flex: 0 0 auto; font-size: 0.76rem; font-weight: 800; color: #7A5C00;
  background: linear-gradient(135deg, #FFF0C2, #FFE39B);
  border: 1px solid #F0CE7A; border-radius: 999px; padding: 2px 10px; white-space: nowrap;
}
body .wk-prize-row .pp-input { flex: 1; min-width: 190px; }
body .wk-prize-thumb {
  width: 40px; height: 40px; flex: 0 0 auto; object-fit: cover;
  border-radius: 9px; border: 1px solid #F0CE7A; background: #fff; cursor: zoom-in;
}
body .wk-prize-nothumb {
  width: 40px; height: 40px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.62rem; color: #BCA98A;
  border: 1px dashed #E8D5AE; border-radius: 9px; background: #FFFDF8;
}
body .wk-prize-who { font-size: 0.72rem; color: #8A7A5A; white-space: nowrap; }
body .wk-prize-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
body .wk-prize-count { font-size: 0.72rem; color: #B8860B; font-weight: 700; }
/* 「撤销修改」「● 未保存」常驻 DOM，只有编辑器处于 dirty 时才显示（打字不重渲染 → 不丢焦点） */
body .wk-prize-box .wk-prize-reset, body .wk-prize-box .wk-prize-dirty { display: none; }
body .wk-prize-box.dirty .wk-prize-reset { display: inline-flex; }
body .wk-prize-box.dirty .wk-prize-dirty { display: inline; color: #E07B00; }
/* 教师端点奖品缩略图放大 */
body .pp-img-zoom {
  position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.82);
  display: flex; align-items: center; justify-content: center; padding: 24px; cursor: zoom-out;
}
body .pp-img-zoom img { max-width: 92vw; max-height: 88vh; border-radius: 10px; background: #fff; }
body .wk-table .wk-pts { font-size: 0.9rem; }
body .wk-table .wk-pts.zero { color: var(--text-dim); font-weight: 600; }
body .wk-table tr.wk-top1 td { background: #FFFBE6; }
body .wk-gift { font-size: 0.85rem; }

/* ── 每周排名：按年级分块（名次在年级内评） ──
   教师端浅色主题：用 neutral 灰紫 + 暖棕点缀，别写浅金 */
body .wk-grade-block { margin-bottom: 18px; }
body .wk-grade-head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 7px 12px; margin-bottom: 8px; border-radius: 10px;
  background: linear-gradient(90deg, #F4F0FF, #FAF7FF);
  border-left: 4px solid #8B7BD8;
}
body .wk-grade-name { font-size: 0.94rem; font-weight: 800; color: #4B3F86; }
body .wk-grade-stat { font-size: 0.76rem; color: #6E6688; }
body .wk-grade-stat b { color: #4B3F86; }
body .wk-grade-cnt { font-size: 0.72rem; color: #8A7A5A; background: #fff; border: 1px solid #E4DCF7; border-radius: 999px; padding: 1px 9px; }
body .wk-prize-box .wk-prize-who { flex: 1 1 100%; }

/* ── 奖品库（pp109）：每行「📚 库」展开的面板 ──
   教师端浅色主题，沿用奖品编辑器的暖棕系；网格自适应，窄屏自动落成 2 列。
   ⚠ 面板底色必须是不透明实值（#FFFBEF）—— 面板压在白色卡片上，半透明会看穿。 */
body .wk-prize-item { display: flex; flex-direction: column; }
body .wk-prize-item.libopen .wk-prize-row {
  border-color: #E0B96A;
  border-bottom-left-radius: 0; border-bottom-right-radius: 0;
  box-shadow: 0 0 0 3px rgba(245,166,35,.12);
}
body .wk-lib-n {
  display: inline-block; margin-left: 3px; padding: 0 5px; border-radius: 999px;
  font-size: 0.62rem; font-weight: 800; color: #7A5C00; background: #FFE9B0;
}
body .wk-lib-hint { color: #B8860B; font-weight: 800; }
body .wk-lib {
  padding: 8px 10px 10px; border-radius: 0 0 10px 10px;
  background: #FFFBEF; border: 1px solid #E0B96A; border-top: none;
}
body .wk-lib-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 0.72rem; font-weight: 700; color: #7A5C00; margin-bottom: 8px;
}
body .wk-lib-cnt { font-size: 0.68rem; color: #8A7A5A; font-weight: 600; }
body .wk-lib-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 8px;
  max-height: 262px; overflow-y: auto; padding-right: 2px;
}
body .wk-lib-item {
  position: relative; display: flex; align-items: center; gap: 8px;
  padding: 6px 8px; border-radius: 9px; cursor: pointer;
  background: #fff; border: 1px solid #F3E3BE;
  transition: border-color .15s, box-shadow .15s, transform .1s;
}
body .wk-lib-item:hover { border-color: #E0B96A; box-shadow: 0 2px 8px rgba(200,147,58,.18); }
body .wk-lib-item:active { transform: scale(.98); }
body .wk-lib-thumb {
  width: 34px; height: 34px; flex: 0 0 auto; object-fit: cover;
  border-radius: 7px; border: 1px solid #F0CE7A; background: #fff;
}
body .wk-lib-nothumb {
  width: 34px; height: 34px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.56rem; color: #BCA98A;
  border: 1px dashed #E8D5AE; border-radius: 7px; background: #FFFDF8;
}
body .wk-lib-tx {
  flex: 1; min-width: 0; font-size: 0.73rem; color: #4A3D22; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; word-break: break-word;
}
body .wk-lib-tx i { color: #BCA98A; font-style: normal; }
body .wk-lib-del {
  flex: 0 0 auto; width: 18px; height: 18px; padding: 0; line-height: 1;
  border-radius: 50%; border: 1px solid #E8D5AE; background: #fff;
  color: #B08A4A; font-size: 0.62rem; cursor: pointer;
}
body .wk-lib-del:hover { background: #FDECEC; border-color: #E5A0A0; color: #C0392B; }
body .wk-lib-empty { font-size: 0.72rem; color: #8A7A5A; }

/* ── 每周奖励：按年级分套的页签（pp58） ──
   教师端浅色主题：没选中的用白底 + 浅棕边，选中的用暖棕渐变实心 */
body .wk-prize-tabs {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  margin: 0 0 10px; padding-bottom: 8px; border-bottom: 1px dashed #F0DFB8;
}
body .wk-prize-tab {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 12px; border-radius: 999px; cursor: pointer;
  font-size: 0.76rem; font-weight: 700; color: #7A5C00;
  background: #fff; border: 1px solid #EAD9B4;
  transition: background .15s, border-color .15s, color .15s;
}
body .wk-prize-tab:hover { border-color: #E0B96A; background: #FFFBEF; }
body .wk-prize-tab.active {
  color: #fff; border-color: transparent;
  background: linear-gradient(135deg, #C8933A, #A9741F);
  box-shadow: 0 3px 9px rgba(169,116,31,0.24);
}
body .wk-prize-tab.dirty { border-style: dashed; border-color: #F5A623; }
body .wk-prize-tab.active.dirty { border-style: solid; border-color: #FFD98A; }
body .wk-prize-dot { font-size: 0.6rem; color: #E07B00; line-height: 1; }
body .wk-prize-tab.active .wk-prize-dot { color: #FFE9B0; }
body .wk-prize-fallback {
  display: flex; align-items: center; gap: 6px;
  margin: 0 0 10px; padding: 6px 10px; border-radius: 9px;
  font-size: 0.73rem; color: #6E6688;
  background: #F6F3FF; border: 1px dashed #D9D0F2;
}

/* ── 留言条（pp70）：学生给本年级同学和老师留的言 ──
   ⚠ kid-app.css 是最终覆盖层，面板是**浅色**的：白卡片 + kid-line 描边 + #3B3557 字。
      别用 rgba(255,255,255,.0x) 做面，白底上看不见。 */
.nw-list { display: flex; flex-direction: column; gap: 14px; }
/* 类型筛选提示（pp72）：只在筛了日常/奖品时出现 */
.nw-filter-note {
  margin-bottom: 12px; padding: 8px 12px; border-radius: 10px;
  background: #FFF7DF; border: 1px solid #FFD98A; color: #8A6D1F;
  font-size: 0.78rem; font-weight: 700;
}
.nw-day { display: flex; flex-direction: column; gap: 8px; }
.nw-day-head {
  display: flex; align-items: baseline; gap: 8px;
  font-size: 0.84rem; font-weight: 800; color: #2FA98C;
  padding-bottom: 4px; border-bottom: 2px solid rgba(120,110,170,.16);
}
.nw-day-n { font-size: 0.7rem; font-weight: 600; color: #A79EBE; }
.nw-item {
  background: #fff; border: 2px solid rgba(120,110,170,.18);
  border-radius: 13px; padding: 10px 12px;
}
.nw-item-head { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.nw-av { font-size: 1rem; line-height: 1; }
.nw-nm { font-size: 0.86rem; font-weight: 800; color: #3B3557; }
.nw-cls { font-size: 0.72rem; color: #8E86A6; }
.nw-kd {
  padding: 1px 7px; border-radius: 9px; font-size: 0.68rem; font-weight: 700;
  white-space: nowrap; border: 1px solid transparent;
}
.nw-kd.daily { background: #EAFBF9; color: #2FA98C; border-color: rgba(78,205,196,.45); }
.nw-kd.prize { background: #FFF3D6; color: #C67C00; border-color: #F5D08A; }
.nw-tm { font-size: 0.7rem; color: #A79EBE; }
.nw-del { margin-left: auto; }
.nw-tx {
  margin-top: 7px; font-size: 0.88rem; line-height: 1.7; color: #3B3557;
  white-space: pre-wrap; word-break: break-word;
}
.nw-tip { margin-top: 12px; font-size: 0.72rem; color: #8E86A6; text-align: center; line-height: 1.7; }

/* ── 留言审核（pp73）──
   ⚠ 面板是浅色底：状态色一律「深字 + 浅底 + 描边」，别用纯白或浅金（看不见）。 */
/* 顶部待办提醒：还有没审的留言时压在统计卡下面 */
.nw-review-note {
  margin: -4px 0 12px; padding: 8px 12px; border-radius: 10px;
  background: #FFF4E5; border: 1px solid #F5C27A; color: #A85B00;
  font-size: 0.8rem; font-weight: 700; line-height: 1.6;
}
.nw-review-note b { font-size: 0.95rem; }

/* 每条留言的状态徽章 */
.nw-st {
  padding: 1px 7px; border-radius: 9px; font-size: 0.66rem; font-weight: 800;
  white-space: nowrap; border: 1px solid transparent;
}
.nw-st.s-pending { background: #F0EEFA; color: #6B6386; border-color: rgba(120,110,170,.28); }
.nw-st.s-ok { background: #E7F9EE; color: #2E9E63; border-color: rgba(88,214,141,.55); }
.nw-st.s-rejected { background: #FFECEC; color: #C0392B; border-color: #F0A6A6; }

/* 待审＝虚线圈（一眼看出还没放行）；未通过＝红边红底（要跟学生谈的那几条） */
.nw-item.s-pending { border-style: dashed; }
.nw-item.s-rejected { border-color: #F3C2C2; background: #FFF8F8; }
.nw-why {
  margin-top: 7px; padding: 5px 9px; border-radius: 9px;
  background: #FFF0F0; color: #A83A2E; font-size: 0.78rem; line-height: 1.6;
}

/* 操作行（通过 / 不通过 / 删除） */
.nw-acts { display: flex; align-items: center; gap: 8px; margin-top: 9px; flex-wrap: wrap; }

/* 记录与禁言台账 */
.nw-judge {
  margin-top: 14px; padding: 10px 12px; border-radius: 13px;
  background: #FFF8F8; border: 1px solid #F3C2C2;
}
.nw-judge-head {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  margin-bottom: 6px; font-size: 0.82rem; font-weight: 800; color: #A83A2E;
}
.nw-judge-head span { font-size: 0.7rem; font-weight: 600; color: #B98A8A; }
.nw-jrow {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 7px 0; border-top: 1px dashed rgba(168,58,46,.18);
}
.nw-judge-head + .nw-jrow { border-top: 0; }
.nw-jnm { font-size: 0.82rem; font-weight: 800; color: #3B3557; }
.nw-jg { margin-left: 5px; font-size: 0.68rem; font-weight: 600; color: #8E86A6; }
.nw-jst {
  padding: 1px 7px; border-radius: 9px; font-size: 0.66rem; font-weight: 800;
  white-space: nowrap; border: 1px solid transparent;
}
.nw-jst.warn { background: #FFF3D6; color: #C67C00; border-color: #F5D08A; }
.nw-jst.ban { background: #FFECEC; color: #C0392B; border-color: #F0A6A6; }
.nw-jnote {
  flex: 1 1 90px; min-width: 0; font-size: 0.72rem; color: #B98A8A;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* ── 出题形态提示（pp71）：只能出选择题 / 不出填空 ──
   ⚠ kid-app.css 里 .q-badge 是浅色（#F1EDFF 底），这里用「类叠加」提权重把颜色盖过去。 */
.q-badge.only-choice, .q-badge.no-fill { margin-left: 6px; border: 1px solid transparent; white-space: nowrap; }
.q-badge.only-choice { background: #EAFBF9; color: #2FA98C; border-color: rgba(78,205,196,.45); }
.q-badge.no-fill { background: #FFF3D6; color: #C67C00; border-color: #F5D08A; }

/* ══ 留言回复 / 老师留言（pp77）═════════════════════════════════════ */

/* 老师留言写字区（点「✍️ 老师留言」展开，默认收起） */
.nw-writebox {
  margin: 0 0 14px; padding: 11px 13px; border-radius: 14px;
  background: #F6F4FF; border: 1px solid rgba(124,108,240,.34);
}
.nw-write-head {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  font-size: 0.76rem; font-weight: 800; color: #5B45C9; margin-bottom: 8px;
}
.nw-write-input {
  width: 100%; resize: vertical; font-family: inherit; font-size: 0.86rem; line-height: 1.6;
  padding: 8px 10px; border-radius: 11px; color: #3B3557; background: #fff;
  border: 2px solid rgba(124,108,240,.28);
}
.nw-write-input:focus { outline: none; border-color: #7C6CF0; }
.nw-write-input::placeholder { color: #A79EBE; }
.nw-write-foot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.nw-write-cnt { font-size: 0.72rem; color: #8E86A6; margin-right: auto; }

/* 老师发的留言 / 回复：浅紫，跟学生的一眼分开 */
.nw-item.by-teacher { background: #F8F6FF; border-color: rgba(124,108,240,.34); }
.nw-kd.teacher { background: #EFEBFF; color: #5B45C9; border-color: rgba(124,108,240,.42); }

/* 一条留言下面的回复 */
.nw-reps {
  margin-top: 9px; padding: 8px 9px 3px; border-radius: 11px;
  background: #FBFAFF; border: 1px dashed rgba(120,110,170,.28);
}
.nw-reps-head {
  font-size: 0.72rem; font-weight: 800; color: #8E86A6; margin-bottom: 6px;
}
.nw-rep { padding: 6px 0 8px; border-top: 1px solid rgba(120,110,170,.14); }
.nw-rep:first-of-type { border-top: none; }
.nw-rep.p-pending { background: #FFFCF3; border-radius: 9px; padding-left: 7px; padding-right: 7px; }
.nw-rep.p-rejected { background: #FFF8F8; border-radius: 9px; padding-left: 7px; padding-right: 7px; }
.nw-rep.p-teacher { background: #F4F1FF; border-radius: 9px; padding-left: 7px; padding-right: 7px; }
.nw-rep-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
/* pp111：这条回复在接谁的话 —— 老师审核时先看清「他在回谁」 */
.nw-rep-to {
  display: inline-block; margin-top: 4px; padding: 1px 7px; border-radius: 7px;
  font-size: 0.68rem; font-weight: 800; color: #1F6FA8;
  background: #EAF4FF; border: 1px solid rgba(31,111,168,.24);
}
.nw-rep-tx {
  margin-top: 4px; font-size: 0.82rem; line-height: 1.6; color: #3B3557;
  white-space: pre-wrap; word-break: break-word;
}
.nw-rep-acts { display: flex; align-items: center; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.nw-rep-acts .btn { flex: 0 0 auto; }

/* ── pp85：教师端留言附图 + 「上周获奖同学」编辑器 ─────────────────────
   ⚠ 教师面板是**浅色**底（kid-app.css 最后加载）→ 一律深棕/深紫字 + 白/暖黄底。 */

/* 留言列表里的附图（审核时也能看到学生发的照片） */
.nw-img {
  display: block; margin-top: 7px;
  max-width: 100%; max-height: 240px; width: auto; height: auto;
  border-radius: 10px; border: 1px solid rgba(120,110,170,.22);
  background: #fff; object-fit: contain; cursor: zoom-in;
}

/* 老师留言写字区里的「📷 配图」 */
.nw-write-att { display: inline-flex; align-items: center; gap: 6px; }
.nw-write-att .nw-write-thumb {
  width: 34px; height: 34px; object-fit: cover; border-radius: 8px;
  border: 1px solid rgba(120,110,170,.24); background: #fff; cursor: zoom-in;
}

/* ── 上周获奖同学编辑器（pp92：名单自动生成，老师只传照片）──
   ⚠ 教师面板是**浅色底**，这里全部用深色实值（#8A6A17 / #6B4E00 / #A07C2A），
     别用 --text-dim —— 那是给深色底准备的，浅底上会糊成一片看不见。 */
body .wk-honor-box {
  margin: 10px 0 4px; padding: 12px 14px; border-radius: 14px;
  background: linear-gradient(180deg, #FFFDF5, #FFF8E1);
  border: 2px solid #FFDFA0;
}
body .wk-honor-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
body .wk-honor-ico { font-size: 1.05rem; }
body .wk-honor-title { font-size: 0.86rem; font-weight: 800; color: #B8860B; }
body .wk-honor-week {
  margin-left: auto; font-size: 0.7rem; font-weight: 700; color: #6B4E00;
  background: #FFF0C8; border: 1px solid #F0CE7A; border-radius: 999px;
  padding: 2px 9px; white-space: nowrap;
}
body .wk-honor-sub {
  font-size: 0.72rem; color: #8A7A5A; line-height: 1.7; margin-bottom: 10px;
}
body .wk-honor-sub b { color: #8A6D1F; }
body .wk-honor-empty {
  font-size: 0.74rem; color: #6B4E00; line-height: 1.7;
  padding: 10px 12px; border-radius: 10px;
  background: #FFF6DC; border: 1px dashed #E8D5AE;
}
/* 年级分组 */
body .wk-honor-g { margin-top: 10px; }
body .wk-honor-ghead {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 0 2px 6px;
}
body .wk-honor-gname { font-size: 0.78rem; font-weight: 800; color: #6B4E00; }
body .wk-honor-gstat {
  font-size: 0.7rem; font-weight: 700; border-radius: 999px; padding: 1px 9px;
  white-space: nowrap;
}
body .wk-honor-gstat.todo { color: #B23B00; background: #FFE7D6; border: 1px solid #FFC4A0; }
body .wk-honor-gstat.done { color: #1B6B32; background: #E8F7EC; border: 1px solid #B5E3C2; }
/* 一个人一行 */
body .wk-honor-row {
  display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
  padding: 8px 10px; border-radius: 10px; margin-bottom: 6px;
  background: #fff; border: 1px solid #F3E3BE;
}
body .wk-honor-row:last-child { margin-bottom: 0; }
body .wk-honor-row.todo { background: #FFFDF6; border-style: dashed; border-color: #E4CFA2; }
/* 把「传照片」按钮顶到最右（.grow 只在特定父容器里生效，这里得自己声明） */
body .wk-honor-row > .grow { flex: 1 1 auto; min-width: 0; }
body .wk-honor-medal { flex: 0 0 auto; font-size: 1rem; font-weight: 800; color: #A07C2A; min-width: 26px; text-align: center; }
body .wk-honor-thumb {
  width: 46px; height: 46px; flex: 0 0 auto; object-fit: cover;
  border-radius: 10px; border: 1px solid #F0CE7A; background: #fff; cursor: zoom-in;
}
body .wk-honor-nothumb {
  width: 46px; height: 46px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center; text-align: center;
  font-size: 0.6rem; line-height: 1.3; color: #A08250;
  border: 1px dashed #E8D5AE; border-radius: 10px; background: #FFFDF8;
}
body .wk-honor-who { display: flex; flex-direction: column; gap: 1px; min-width: 96px; }
body .wk-honor-nm { font-size: 0.82rem; font-weight: 800; color: #3A2E12; }
body .wk-honor-meta { font-size: 0.68rem; color: #8A7A5A; }
body .wk-honor-prize {
  font-size: 0.7rem; font-weight: 700; color: #6B4E00;
  background: #FFF6DC; border: 1px solid #F0CE7A; border-radius: 8px;
  padding: 2px 8px; max-width: 240px;
}
/* pp105：行内奖品小图（快照）—— 一眼看出「当时那份奖品长什么样」 */
body .wk-honor-pthumb {
  width: 26px; height: 26px; flex: 0 0 auto; object-fit: cover;
  border-radius: 6px; border: 1px solid #F0CE7A; background: #fff; cursor: zoom-in;
}
body .wk-honor-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
body .wk-honor-count { font-size: 0.72rem; color: #8A6A17; font-weight: 700; }

@media (max-width: 620px) {
  body .wk-honor-who { flex: 1 1 90px; }
  body .wk-honor-prize { flex: 1 1 100%; max-width: none; }
}

/* pp116：学生数据行的「✉️ 私信」按钮 —— 学生发来悄悄话没读时标红（●N 由 JS 填） */
.pm-row-btn.has-unread {
  color: #B23A2E; background: #FFF0EC; border-color: rgba(214,90,74,0.5); font-weight: 800;
}
.pm-row-btn.has-unread:hover { background: #FFE2DB; }

/* ═══════════════════════════════════════════════════════════════
   pp121 · 教师端「道具卡花费」列（学生数据 / 班级排名 / 导出 CSV）
   ⚠ 只是展示：花销记在存档 spentPoints 里，**不减总积分、不影响任何排名口径**。
   0 值走 dim-zero 灰显 —— 一个班十几行全是「0」会抢掉真正有数据的行。
   ═══════════════════════════════════════════════════════════════ */
.pp-card .num.c5 { color: #f0a33c; }
.pp-table td.dim-zero { color: var(--text-dim); font-weight: 400; opacity: 0.55; }
.rank-mini .rm-stat.rm-spent { color: #E08A00; }

/* pp121：班内小卡多了「🎴 花费」一个 chip 后，nowrap 会把学生名字挤成「UI…」
   → 允许换行（只在这行真的放不下时才换，放得下时外观不变）。 */
.rank-mini { flex-wrap: wrap; row-gap: 3px; }

/* ═══════════════════════════════════════════════════════════════
   pp122 · 教师端两级导航 + 概览卡瘦身
   为什么改：
     · 原来 8 个标签平铺（数据/排名/统计/内容/设置混在一层），1440 宽刚好塞满、
       1024 宽就换行；现在 5 个一级栏目 + 右侧子页胶囊。
     · 每页 4~7 张 KPI 大卡（数字 1.4rem、内边距 14/16）把内容压到屏幕折线以下，
       学生数据页光卡片就吃掉 ~90px。卡缩一号、留白收紧，页面立刻松下来。
   ═══════════════════════════════════════════════════════════════ */
.panel-tabs { align-items: center; gap: 6px; margin: 12px 0 10px; }
.panel-tab { padding: 7px 16px; font-size: 0.82rem; }
/* 有子页的栏目被选中时用「淡底 + 描边」，而不是实心橙 —— 实心橙留给当前**子页**，
   一层只能有一个最重的焦点（不然两排都是亮的，看不出自己在哪一页）。
   ⚠ 字色用深棕橙 #8A5A00：主题的 --accent 是 #FFB300，直接当 12px 正文字用对比度只有 ~1.9:1，
      浅底上看着像灰色的（pp123 连同菜单一起提对比度）。 */
.panel-tab.on {
  background: rgba(255,179,0,0.16); color: #8A5A00;
  border-color: rgba(255,179,0,0.48);
}
/* 子页胶囊：贴在右端，视觉上明确「从属」于当前栏目（小一号、灰字）
   ⚠ 底色不能用 rgba(255,255,255,.05)：教师端是白底，白 5% = 看不见，胶囊会像三个裸字 */
.panel-subtabs {
  display: flex; gap: 2px; margin-left: auto;
  background: rgba(120,110,170,0.08); border-radius: 18px; padding: 3px;
  border: 1px solid rgba(120,110,170,0.22);
}
.panel-subtab {
  padding: 5px 13px; border-radius: 15px; cursor: pointer; font-family: inherit;
  background: transparent; border: none; color: #6B6386;
  font-size: 0.78rem; font-weight: 600; transition: all 0.15s; white-space: nowrap;
}
.panel-subtab:hover { color: #3B3557; background: rgba(120,110,170,0.10); }
/* 当前子页：白底 + 深棕橙字（不用 --accent：#FFB300 在白底上只有 ~1.9:1） */
.panel-subtab.active {
  background: #FFFFFF; color: #8A5A00; font-weight: 800;
  box-shadow: 0 1px 4px rgba(59,53,87,0.14);
}
@media (max-width: 760px) {
  /* 窄屏：子页胶囊换到一级标签下面一行，两边都撑满 */
  .panel-tabs { gap: 4px; }
  .panel-subtabs { margin-left: 0; flex: 1 1 100%; justify-content: flex-start; }
}

/* 概览卡缩一号（原 padding 14/16、数字 1.4rem）
   ⚠ 只留 3 张卡的页面（学生数据）用 1fr 会把每张拉到 300px 宽、数字孤零零居中，
     所以给卡片封顶 168px 并左对齐；auto-fit 会把多余的空轨道塌掉，不会留缝。 */
.pp-card { padding: 9px 12px; border-radius: 12px; }
.pp-card .num { font-size: 1.15rem; }
.pp-card .lbl { font-size: 0.66rem; margin-top: 1px; }
.pp-cards { gap: 8px; margin-bottom: 10px; grid-template-columns: repeat(auto-fit, minmax(112px, 152px)); justify-content: start; }

/* ═══ pp122：操作列「⋯」菜单 + 实名小标签 ═══════════════════════════
   菜单用 fixed + 遮罩：表格容器有 overflow，放单元格里会被裁。
   ⚠⚠ 配色必须用**浅色实值**，不能用 var(--text) + 深色底：
     教师端最后加载的 ../kid-app.css 把 --card-bg 覆盖成 #FFFFFF、--text 覆盖成 #3B3557，
     我当时按深色主题写了 background:#2b2b40 + color:var(--text) → 深底深字，对比度约 1.6:1，
     点开菜单几乎什么都看不见（pp123 修）。深色实值这套在 panel 里一律别用。 */
.row-menu-mask { position: fixed; inset: 0; z-index: 9998; background: rgba(59,53,87,0.10); }
.row-menu {
  position: fixed; z-index: 9999; min-width: 150px; padding: 5px;
  display: flex; flex-direction: column; gap: 2px;
  background: #FFFFFF; border: 1px solid rgba(120,110,170,0.30);
  border-radius: 12px; box-shadow: 0 14px 34px rgba(59,53,87,0.22);
}
.row-menu button {
  text-align: left; padding: 9px 12px; border: none; border-radius: 8px;
  background: transparent; color: #3B3557; font-family: inherit;
  font-size: 0.84rem; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.row-menu button:hover { background: #F3F0FA; }
.row-menu button.danger { color: #C62828; }
.row-menu button.danger:hover { background: #FDECEC; }
/* 「⋯」本身也得看得清：加粗 + 实色，别用默认的淡字 */
.row-more-btn {
  padding-left: 11px; padding-right: 11px; font-weight: 800; letter-spacing: 1.5px;
  font-size: 1rem; line-height: 1; color: #3B3557;
}
/* 实名小标签：0.66rem + 0.72 透明在浅底上太糊，收到 0.7rem / 0.85 */
.rn-chip { margin-top: 3px; font-size: 0.7rem; padding: 1px 7px; opacity: 0.85; color: #6B6288; }
.rn-chip:hover { opacity: 1; }
.rn-chip.rn-on { color: #2E7D32; border-color: rgba(46,125,50,0.4); opacity: 1; }

/* pp122：短字段不再折行 —— 1024 宽下「三年级9班」会断成两行、「2026-10-19」会断成
   「2026-10- / 19」，一行表格被撑成两行高，整张表看起来像坏掉。
   表格自己要更宽就让 .pp-table-wrap 横滑（本来就有 overflow-x:auto）。 */
.pp-table td { white-space: nowrap; }
.pp-table .subj-cell { white-space: normal; }
@media (max-width: 1100px) {
  .pp-table td, .pp-table th { padding-left: 8px; padding-right: 8px; }
}

/* ═══════════════════════════════════════════
   pp130 教师端「✉️ 私信」集中页
   老师原话：私信我时要一个个翻学生数据页，太麻烦。
   ⚠ 颜色全部跟着教师端主题变量走（panel.css 通篇用 rgba(255,255,255,.06) 的边框，
    说明这里本来就是深色底）—— 别再写死浅色，会把一屏白块糊在深色面板上。
   ═══════════════════════════════════════════ */
.pm-inbox-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 12px; flex-wrap: wrap;
}
.pm-inbox-title { font-size: 0.95rem; font-weight: 800; color: var(--text); }
.pm-inbox-sub { font-size: 0.72rem; font-weight: 600; color: var(--text-dim); margin-left: 8px; }
.pm-inbox-sum { color: #FF8A8A; }

.pm-inbox-list { display: flex; flex-direction: column; gap: 8px; }
.pm-inbox-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 12px;
  background: var(--card-bg); border: 1px solid rgba(255,255,255,0.08);
  cursor: pointer; transition: border-color .15s, background .15s;
}
.pm-inbox-row:hover { border-color: rgba(255,255,255,0.18); background: rgba(255,255,255,0.04); }
.pm-inbox-row:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.pm-inbox-row.has-unread { border-color: rgba(255,179,0,0.55); background: rgba(255,179,0,0.08); }

.pm-inbox-av {
  width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 19px; line-height: 1; overflow: hidden;
  background: rgba(255,255,255,0.08);
}
.pm-inbox-av .av-img, .pm-inbox-av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }

.pm-inbox-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pm-inbox-nm {
  display: flex; align-items: center; gap: 6px;
  font-size: 0.86rem; font-weight: 800; color: var(--text);
}
.pm-inbox-cls {
  font-style: normal; font-size: 0.68rem; font-weight: 600;
  color: var(--text-dim); border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px; padding: 0 5px;
}
.pm-inbox-badge {
  font-size: 0.66rem; font-weight: 800; color: #fff;
  background: #FF5B5B; border-radius: 9px; padding: 1px 6px; line-height: 1.5;
}
.pm-inbox-pv {
  font-size: 0.76rem; color: var(--text-dim);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pm-inbox-pv em { font-style: normal; color: rgba(255,255,255,0.45); }
.pm-inbox-tm { font-size: 0.68rem; color: var(--text-dim); flex: 0 0 auto; opacity: .8; }

.pm-inbox-empty {
  padding: 26px 16px; text-align: center; line-height: 1.9;
  font-size: 0.82rem; color: var(--text-dim);
  background: rgba(255,255,255,0.03); border-radius: 12px;
  border: 1px dashed rgba(255,255,255,0.1);
}
.pm-inbox-empty b { color: var(--text); }

/* ── pp131 同学之间待审核的私信（排在私信页最上面） ── */
.pmx-pend {
  margin-bottom: 14px; padding: 12px 14px; border-radius: 14px;
  background: rgba(255,179,0,0.06); border: 1px solid rgba(255,179,0,0.35);
}
.pmx-pend-head {
  font-size: 0.9rem; font-weight: 800; color: var(--text);
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 10px;
}
.pmx-pend-head b { color: #FFC53D; font-size: 1.05rem; }
.pmx-pend-tip { font-size: 0.7rem; font-weight: 500; color: var(--text-dim); }
.pmx-pend-list { display: flex; flex-direction: column; gap: 8px; }
.pmx-pend-row {
  padding: 10px 12px; border-radius: 10px;
  background: rgba(0,0,0,0.18); border: 1px solid rgba(255,255,255,0.07);
}
.pmx-pend-meta {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 0.78rem; color: var(--text-dim); margin-bottom: 4px;
}
.pmx-pend-meta b { color: var(--text); font-size: 0.84rem; }
.pmx-arrow { opacity: .55; }
.pmx-when { margin-left: auto; font-size: 0.68rem; opacity: .75; }
.pmx-pend-tx {
  font-size: 0.84rem; line-height: 1.55; color: var(--text);
  margin-bottom: 8px; word-break: break-word;
}
.pmx-pend-acts { display: flex; gap: 8px; flex-wrap: wrap; }