/* 本文件在 style.css 之后加载，用于覆盖基础样式里与学生端/老师端体验冲突的地方。
   用 !important 是为了盖过 style.css 中第 186 行那条 .lv-badge 的 !important 覆盖。 */

/* —— 学生端：闯关任务单的关卡标签（第一关/第二关…）更大、单行 —— */
.lv-badge{
  flex:0 0 auto !important; width:auto !important; height:auto !important;
  padding:5px 14px !important; border-radius:11px !important;
  background:var(--brand-soft) !important; color:#B4601F !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  font-weight:800 !important; font-size:19px !important; white-space:nowrap !important; letter-spacing:1px !important;
}
.lv.done .lv-badge{background:var(--green) !important; color:#fff !important}
.lv-title b{font-size:18px !important; font-weight:800 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important}

/* —— 老师端：关卡开关大按钮（直接开/关，实时显示状态）—— */
.lvtoggle{
  display:inline-flex; align-items:center; gap:9px;
  padding:11px 16px; border-radius:13px; cursor:pointer;
  font-size:16px; font-weight:700; font-family:inherit;
  border:2px solid var(--line); background:#fff; color:#8A7052;
  transition:.12s; line-height:1.1;
}
.lvtoggle .e{font-size:20px}
.lvtoggle .t{white-space:nowrap}
.lvtoggle .s{font-size:12px; font-weight:600; opacity:.85; white-space:nowrap}
.lvtoggle.on{border-color:#3E9E6A; background:#E9F6EF; color:#2C7A4E}
.lvtoggle.on .s{color:#2C7A4E}
.lvtoggle.off{border-color:#E0D2C0; background:#FBF7F1; color:#A08A6C}
.lvtoggle.off .s{color:#A08A6C}
.lvtoggle:hover{transform:translateY(-1px)}
.lvtoggle:active{transform:translateY(0)}

/* —— 老师端：关卡开关卡片（一排五关，每关一个大开关，直观开/关）—— */
.lvrow{display:grid; grid-template-columns:repeat(5,1fr); gap:12px}
@media (max-width:720px){ .lvrow{grid-template-columns:repeat(2,1fr)} }
.lvcard{
  display:flex; flex-direction:column; align-items:center; gap:7px;
  padding:16px 10px 14px; border-radius:16px; cursor:pointer; user-select:none;
  border:2px solid #E0D2C0; background:#FBF7F1; transition:.14s; text-align:center;
}
.lvcard:hover{transform:translateY(-2px); box-shadow:0 8px 18px rgba(74,44,20,.12)}
.lvcard.on{border-color:#3E9E6A; background:#E9F6EF}
.lvcard .em{font-size:38px; line-height:1}
.lvcard .lv{font-size:12px; font-weight:800; letter-spacing:1px; color:#B4601F}
.lvcard.on .lv{color:#2C7A4E}
.lvcard .nm{font-size:15px; font-weight:800; color:#3A2E22; line-height:1.25}
.lvcard .switch{
  width:62px; height:30px; border-radius:15px; background:#D9CBBA; position:relative;
  transition:background .18s; margin-top:3px;
}
.lvcard .switch::after{
  content:''; position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:50%;
  background:#fff; box-shadow:0 2px 5px rgba(0,0,0,.25); transition:left .18s;
}
.lvcard.on .switch{background:#3E9E6A}
.lvcard.on .switch::after{left:35px}
.lvcard .st{font-size:13px; font-weight:800}
.lvcard.on .st{color:#2C7A4E}
.lvcard.off .st{color:#A08A6C}

/* —— 学生端：老师发给我的消息（常驻面板）—— */
.my-msgs{margin:0 0 12px;display:flex;flex-direction:column;gap:10px}
.my-msgs:empty{display:none}
.mm-head{font-size:14px;font-weight:700;color:var(--ink2);margin-top:2px}
.msg{display:flex;gap:11px;align-items:flex-start;padding:14px 16px;border-radius:14px;font-size:15px;line-height:1.5;border:2px solid}
.msg .ic{font-size:24px;line-height:1;flex:0 0 auto}
.msg b{display:block;font-size:15px;margin-bottom:3px}
.msg.honor{background:#FFF7E6;border-color:#E7B84B;color:#7A5A12}
.msg.tip{background:#EAF3FB;border-color:#7FB3DE;color:#23506E}
.msg.improve{background:#FDEEEA;border-color:#E8856B;color:#8A3B22}
.msg.fresh{animation:msgpop .6s ease}
@keyframes msgpop{0%{transform:translateY(-6px) scale(.97);opacity:0}100%{transform:none;opacity:1}}

/* —— 步骤图点击放大 —— */
.imgzoom{position:fixed;inset:0;z-index:9999;background:rgba(24,16,8,.9);display:flex;
  align-items:center;justify-content:center;flex-direction:column;gap:14px;cursor:zoom-out}
.imgzoom.hide{display:none}
.imgzoom img{max-width:96vw;max-height:86vh;border-radius:12px;background:#fff;
  box-shadow:0 12px 48px rgba(0,0,0,.55);object-fit:contain}
.imgzoom-tip{color:#FFD98A;font-size:17px;font-weight:700}
.stepimg{cursor:zoom-in!important;transition:transform .15s}
.stepimg:hover{transform:scale(1.01)}

/* —— 老师发的消息：称号做成大标题 —— */
.msg-title{font-size:19px;font-weight:900;color:#B4601F;letter-spacing:1px;margin-bottom:3px;line-height:1.25}
.msg.honor .msg-title{color:#B8860B;font-size:21px}
.msg-text{font-size:14px;line-height:1.6}