/* =====================================================================
   超级体育老师工作站 · 体育漫画动漫风主题 v11
   明亮配色 + 粗描边 + 贴纸式投影 + 网点/速度线 + 手绘风SVG插画
   ===================================================================== */
:root{
  /* ---- 主色板:球场绿 / 天空蓝 / 阳光黄 / 珊瑚红 ---- */
  --primary:#2EAD5C;        /* 主品牌草地绿 */
  --primary-dark:#1E8A45;
  --primary-mid:#57D08A;    /* 进度填充亮绿 */
  --primary-light:#DDF3E4;  /* 辅助浅绿 */
  --accent:#FF9F43;         /* 橙(活动/训练) */
  --sky:#3D9BFF;            /* 天空蓝 */
  --sun:#FFD93D;            /* 阳光黄 */
  --coral:#FF6B6B;          /* 珊瑚红 */
  --grape:#9B5DE5;          /* 葡萄紫(教科研) */
  --pink-bg:#FFE3E9;--pink-line:#FF5A85;
  --blue-bg:#E1F0FF;--blue-line:#3D9BFF;
  --orange-bg:#FFF0DC;--orange-line:#FF9F43;
  --danger-bg:#FFE0E0;--danger-text:#E5484D;
  --btn-gray:#F0EEE9;
  /* ---- 画布 & 轮廓 ---- */
  --bg:#FFF6E7;             /* 奶油色画布(带网点) */
  --card:#FFFFFF;
  --border:#EFE6D6;         /* 细分隔线 */
  --outline:#33414F;        /* 漫画粗描边(墨色) */
  --outline-soft:rgba(51,65,79,.16);
  --text:#2E3440;
  --text-2:#626D7E;
  --title:#23402E;          /* 深绿标题 */
  --track:#F0EDE4;          /* 进度条轨道 */
  --radius:16px;
  --shadow:0 4px 0 var(--outline-soft),0 12px 26px rgba(51,65,79,.10);
  --shadow-lift:0 6px 0 var(--outline-soft),0 16px 34px rgba(51,65,79,.16);
  /* ---- 语义化表面色 ---- */
  --panel:#F6F8F3;          /* 内嵌面板:表头/时间格/甘特槽/提示条 */
  --panel-2:#FFF3D6;        /* 强调提示底(单元提示/范围选中) */
  --panel-2-line:#F0D98E;
  --line-soft:#F1ECDE;      /* 虚线分隔 */
  /* 子项斑马纹:同一色相的深浅两档(不引入新色相,免得密集清单里喧宾夺主)。
     两档都压在浅色区间:分得清行,又不跟"已完成划线/悬停高亮"抢注意力 */
  --sub-zebra-a:#F4F9F5;    /* 浅档(奇数行) */
  --sub-zebra-b:#DEEDE3;    /* 深档(偶数行),与浅档亮度差 ~0.10,肉眼可辨 */
  /* 3D 骰子的光影墨色(R,G,B 分量,便于按面叠不同透明度):
     浅色主题用与描边同源的墨色压暗,深色主题改成纯黑 —— 深底上"压暗"要靠黑,不是靠墨 */
  --mp-shade:51,65,79;
  --input-bg:#FFFFFF;
  --sidebar-bg:#FFFDF5;
  --modal-bg:#FFFDF7;
  --ai-bg:#EFF3FB; --ai-line:#ccd8f0;
  --ok-bg:#E7F7EC; --ok-line:#BDE6CB; --ok-text:#1E8A45;
  --shelf-bg:linear-gradient(180deg,#FFFDF5,#fff);
  --banner-tint:#EAF6EF; --banner-tint-2:#D8EEDF;
  --flag-bg:rgba(255,255,255,.82); --flag-text:#8a6a3f;
  --muted:#c9c2b0; --muted-warm:#b06a2c;
  --gray-text:#6a6a66;
  --check-border:#c9c4b6;
  --gridline:rgba(51,65,79,.08);
  --done1:#b8bcb4; --done2:#d4d8d0;
  --toast-bg:#23402E;
  --empty-hover:#F0FBF3;
  --on-pl:#1E8A45;          /* primary-light 底上的文字 */
  --strip-rainbow:linear-gradient(90deg,#FF6B6B,#FF9F43,#FFD93D,#57D08A,#3D9BFF,#9B5DE5);
  color-scheme:light;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  font-family:"Inter","Microsoft YaHei","PingFang SC","Segoe UI",system-ui,sans-serif;
  background:
    radial-gradient(rgba(51,65,79,.05) 1.1px, transparent 1.3px) 0 0/22px 22px,
    var(--bg);
  color:var(--text);font-size:14px;line-height:1.5;
}
#app{display:flex;height:100vh;overflow:hidden;}

/* ================= 顶部通栏 ================= */
#topbar{
  position:fixed;top:0;left:0;right:0;height:58px;background:var(--card);
  border-bottom:1px solid var(--border);display:flex;align-items:center;
  justify-content:space-between;padding:0 22px;z-index:50;
  box-shadow:0 2px 14px rgba(51,65,79,.06);
}
/* 顶部彩虹能量条(漫画味) */
#topbar::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:4px;
  background:var(--strip-rainbow);z-index:51;pointer-events:none;}
.topbar-left{display:flex;align-items:center;gap:12px;min-width:260px;}
.brand-logo{
  width:38px;height:38px;border-radius:12px;color:#31414F;display:flex;
  align-items:center;justify-content:center;font-size:20px;flex-shrink:0;
  background:linear-gradient(135deg,#FFE37A,#FF9F43);
  border:2px solid var(--outline);box-shadow:2px 2px 0 var(--outline);
}
.brand-logo img{width:100%;height:100%;object-fit:cover;border-radius:9px;}
/* logo 未确定时不显示空色块(JS 填入内容后 :empty 自动失效,无需额外开关) */
.brand-logo:empty{visibility:hidden;}
/* 设置弹窗里的头像选择网格 */
.avatar-grid{display:grid;grid-template-columns:repeat(8,38px);gap:4px;}
.avatar-grid .av-item{
  width:38px;height:38px;display:flex;align-items:center;justify-content:center;
  font-size:20px;border-radius:10px;cursor:pointer;border:2px solid transparent;
}
.avatar-grid .av-item:hover{background:var(--panel);}
.avatar-grid .av-item.on{border-color:var(--primary);background:var(--panel);}
.brand-name{font-size:16px;font-weight:800;color:var(--title);letter-spacing:.5px;}
.page-crumb{font-size:13px;color:var(--text-2);border-left:1px solid var(--border);padding-left:12px;}
.topbar-center{flex:1;display:flex;justify-content:center;}
.pe-tag{
  font-size:11px;letter-spacing:3px;font-weight:700;color:var(--primary-dark);
  border:2px solid var(--outline);border-radius:16px;padding:4px 16px;
  background:#fff;box-shadow:2px 2px 0 rgba(51,65,79,.2);
}
/* 顶栏每日一言 */
.pe-tag.daily-quote{
  letter-spacing:.5px;font-size:12.5px;font-weight:600;padding:4px 14px;
  max-width:460px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.topbar-right{display:flex;align-items:center;gap:10px;min-width:260px;justify-content:flex-end;}
.btn-saved{
  background:var(--primary-light);color:var(--primary-dark);border:2px solid var(--outline);
  border-radius:10px;padding:6px 14px;font-size:12px;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;gap:6px;font-weight:600;box-shadow:2px 2px 0 rgba(51,65,79,.16);
}
.btn-saved:hover{filter:brightness(.97);}
.icon-btn{
  border:2px solid var(--outline);background:var(--input-bg);border-radius:10px;
  width:34px;height:34px;cursor:pointer;font-size:15px;transition:.15s;
  box-shadow:2px 2px 0 rgba(51,65,79,.16);
}
.icon-btn:hover{border-color:var(--outline);color:var(--primary);transform:translateY(-1px);box-shadow:3px 3px 0 rgba(51,65,79,.18);}
.icon-btn:active{transform:translateY(1px);box-shadow:1px 1px 0 rgba(51,65,79,.16);}

/* ================= 侧边栏 ================= */
#sidebar{
  width:224px;background:var(--sidebar-bg);border-right:1px solid var(--border);
  display:flex;flex-direction:column;transition:width .25s;flex-shrink:0;
  overflow:hidden;margin-top:58px;
}
#sidebar.collapsed{width:0;border-right:none;}
/* 抽屉头部(仅移动端抽屉显示):品牌 + 关闭按钮 */
.sb-head{display:none;}
#nav{flex:1;overflow-y:auto;padding:14px 12px 10px;}
#nav::-webkit-scrollbar{width:4px;}
#nav::-webkit-scrollbar-thumb{background:#ddd8cb;border-radius:2px;}
.nav-group{margin-top:16px;}
.nav-group:first-child{margin-top:2px;}
.nav-group-title{font-size:11px;color:var(--text-2);padding:0 12px 6px;letter-spacing:3px;font-weight:700;line-height:1.2;}
.nav-item{
  display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;cursor:pointer;
  margin:3px 0;transition:.15s;font-size:14px;position:relative;white-space:nowrap;color:var(--text);
  border:2px solid transparent;
  /* 侧栏行距比正文(1.5)紧:单行项只按字号占高,菜单整体更紧凑 */
  line-height:1.2;
}
.nav-item .ico{width:20px;text-align:center;font-size:16px;flex-shrink:0;}
/* 带副标题的菜单项:标题与副标题两行,行距收到 1.1(原来 1.25 偏松) */
.nav-item>span:nth-child(2){display:flex;flex-direction:column;line-height:1.1;}
.nav-item:hover{background:var(--primary-light);color:var(--primary-dark);transform:translateX(2px);}
.nav-item.active{
  background:linear-gradient(180deg,#3FC173,#2EAD5C);color:#fff;font-weight:700;
  border-color:var(--outline);box-shadow:3px 3px 0 rgba(51,65,79,.22);
}
.nav-item .sub{font-size:11px;color:inherit;opacity:.7;}
.nav-item.active .sub{opacity:.85;}
.nav-item .badge{position:absolute;right:10px;background:#FF5A85;color:#fff;font-size:10px;border-radius:9px;padding:1px 6px;min-width:18px;text-align:center;border:1.5px solid #fff;box-shadow:1px 1px 0 rgba(51,65,79,.25);}
.sidebar-foot{
  margin:10px 12px 12px;padding:10px 14px;border:2px solid var(--outline);
  border-radius:14px;font-size:12px;color:var(--text-2);display:flex;align-items:center;gap:8px;
  background:#fff;box-shadow:3px 3px 0 rgba(51,65,79,.18);position:relative;
}
/* 对话气泡小尾巴 */
.sidebar-foot::after{content:"";position:absolute;left:30px;bottom:-8px;
  border:7px solid transparent;border-top-color:var(--outline);}
.sidebar-foot::before{content:"";position:absolute;left:31px;bottom:-5px;
  border:6px solid transparent;border-top-color:#fff;}
.sidebar-foot .foot-ico{
  width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:15px;background:linear-gradient(135deg,#FFE37A,#FF9F43);
  border:2px solid var(--outline);box-shadow:1.5px 1.5px 0 var(--outline);flex-shrink:0;
}
.sidebar-foot b{color:var(--primary-dark);font-size:12.5px;display:block;font-weight:700;}
/* 侧栏最底部的开发署名 */
.sidebar-copy{
  padding:0 10px 12px;font-size:10.5px;color:var(--text-2);text-align:center;
  letter-spacing:.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;user-select:none;
}

/* ================= 主区 ================= */
#main{flex:1;display:flex;flex-direction:column;min-width:0;margin-top:58px;}
#page{flex:1;overflow-y:auto;padding:20px 22px 40px;}

/* ================= 通用组件 ================= */
/* hidden 属性的兜底:组件类(.btn/.card 等)都设了 display,会盖掉 hidden 的
   默认 display:none,导致"该藏起来的元素照样显示"。放最前面,优先级最低,
   只在元素确实带 hidden 时兜底,不影响任何正常显示的组件。 */
[hidden]{display:none !important;}
.card{
  background:var(--card);border-radius:18px;border:2px solid var(--outline);
  box-shadow:var(--shadow);padding:20px;margin-bottom:16px;position:relative;
}
.card-title{
  font-size:16px;font-weight:800;color:var(--title);display:flex;align-items:center;gap:8px;
  margin-bottom:4px;flex-wrap:wrap;
}
.card-title .note{font-size:12px;color:var(--text-2);font-weight:400;margin-top:2px;}
.card-title .right{margin-left:auto;display:flex;gap:6px;align-items:center;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end;}
.grid{display:grid;gap:16px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-dash{grid-template-columns:repeat(4,minmax(240px,1fr));}
@media(max-width:1280px){.grid-dash,.grid-4{grid-template-columns:repeat(2,1fr);}.grid-3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:760px){.grid-2,.grid-3,.grid-4,.grid-dash{grid-template-columns:1fr;}}

/* 统计卡片行:移动端仍保持一行三列(与 .grid-3 的响应式塌陷区分开,专供顶部指标卡使用)。
   这里用 .grid.grid-stats 两个类名叠加提高优先级,确保能覆盖上面 760px 的塌陷规则。 */
.grid-stats{grid-template-columns:repeat(3,1fr);}
@media(max-width:760px){
  .grid.grid-stats{grid-template-columns:repeat(3,1fr);gap:8px;}
  .grid-stats .stat-mini{padding:10px 8px;border-radius:12px;align-items:center;text-align:center;}
  .grid-stats .stat-mini b{font-size:19px;}
  .grid-stats .stat-mini span{font-size:11px;line-height:1.3;}
}

/* ---- 按钮:粗描边 + 贴纸投影 ---- */
.btn{
  border:2px solid var(--outline);border-radius:11px;padding:8px 16px;cursor:pointer;
  font-size:13px;transition:.12s;font-family:inherit;display:inline-flex;align-items:center;
  gap:6px;white-space:nowrap;font-weight:600;box-shadow:0 3px 0 var(--outline);
}
.btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--outline);}
.btn-primary{background:linear-gradient(180deg,#3FC173,#2EAD5C);color:#fff;}
.btn-primary:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 4px 0 var(--outline);}
.btn-primary:active{transform:translateY(2px);box-shadow:0 1px 0 var(--outline);}
.btn-outline{background:var(--input-bg);border:2px solid var(--outline);color:var(--text);box-shadow:0 3px 0 var(--outline-soft);}
.btn-outline:hover{border-color:var(--primary);color:var(--primary);}
.btn-gray{background:var(--btn-gray);color:#45453f;box-shadow:0 3px 0 var(--outline-soft);}
.btn-gray:hover{filter:brightness(.96);}
.btn-danger{background:linear-gradient(180deg,#FF8A8A,#FF6B6B);color:#fff;box-shadow:0 3px 0 rgba(229,72,77,.5);}
.btn-danger:hover{filter:brightness(1.05);}
.btn-sm{padding:4px 10px;font-size:12px;border-radius:8px;box-shadow:0 2px 0 var(--outline);}
.btn-ghost{background:transparent;color:var(--text-2);border:none;box-shadow:none;}
.btn-ghost:hover{background:var(--panel);color:var(--text);box-shadow:none;}

input[type=text],input[type=number],input[type=date],input[type=time],input[type=password],select,textarea{
  border:2px solid var(--border);border-radius:10px;padding:8px 10px;font-size:13px;
  font-family:inherit;background:var(--input-bg);color:var(--text);outline:none;transition:.15s;
}
input[type=checkbox]{accent-color:var(--primary);}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(46,173,92,.18);}
textarea{resize:vertical;min-height:76px;width:100%;}
/* 备注框:默认与单行输入框等高的外观,文字换行时由 JS 自动撑高,完整显示全部内容 */
textarea.note-grow{resize:none;min-height:0;height:auto;overflow:hidden;line-height:1.25;display:block;}
.form-row{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap;align-items:center;}
.form-row label{font-size:12px;color:var(--text-2);flex-shrink:0;font-weight:600;}
.tag{
  display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:2px 9px;border-radius:20px;
  background:var(--primary-light);color:var(--on-pl);margin-right:4px;font-weight:600;
  border:1px solid rgba(46,173,92,.25);
}
.tag.gray{background:var(--btn-gray);color:var(--gray-text);border-color:transparent;}
.tag.orange{background:var(--orange-bg);color:#b06a2c;border-color:rgba(255,159,67,.35);}
.tag.red{background:var(--danger-bg);color:var(--danger-text);border-color:rgba(229,72,77,.25);}
.tag.blue{background:var(--blue-bg);color:#2f6fb8;border-color:rgba(61,155,255,.3);}
.empty{text-align:center;color:var(--text-2);padding:34px 0;font-size:13px;}
.empty .big{font-size:44px;margin-bottom:10px;display:inline-block;animation:floaty 3.2s ease-in-out infinite;}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(-3deg);}50%{transform:translateY(-6px) rotate(3deg);}}
table.tbl{width:100%;border-collapse:collapse;font-size:13px;}
table.tbl th{
  background:linear-gradient(180deg,#F2FBF5,#E4F6EB);color:#23402E;font-weight:700;text-align:left;
  padding:9px 10px;border-bottom:3px solid var(--primary);white-space:nowrap;
}
table.tbl td{padding:9px 10px;border-bottom:1px solid var(--line-soft);vertical-align:middle;}
table.tbl tr:hover td{background:var(--panel);}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px;}
.toolbar .right{margin-left:auto;}

/* 通用输入框 */
.inp{
  padding:8px 12px;border:2px solid var(--border);border-radius:10px;background:var(--input-bg);
  font-size:13px;color:var(--text);outline:none;transition:.15s;
}
.inp:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light);}

/* ---- 弹窗 ---- */
.modal-mask{position:fixed;inset:0;background:rgba(23,30,38,.55);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .15s;}
.modal{
  background:var(--modal-bg);border-radius:20px;border:2px solid var(--outline);
  width:560px;max-width:94vw;max-height:88vh;display:flex;flex-direction:column;
  animation:pop .2s;box-shadow:8px 8px 0 rgba(51,65,79,.18),0 20px 50px rgba(0,0,0,.18);
}
.modal.wide{width:820px;}
.modal-head{
  padding:16px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;
  align-items:center;font-weight:800;font-size:18px;color:var(--title);
}
.modal-close{border-radius:50%!important;width:32px!important;height:32px!important;background:var(--input-bg);box-shadow:2px 2px 0 var(--outline-soft);}
.modal-body{padding:18px 20px;overflow-y:auto;}
.modal-foot{padding:14px 20px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;}
@keyframes pop{from{transform:scale(.94) rotate(-1deg);opacity:0;}to{transform:scale(1) rotate(0);opacity:1;}}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}

/* ---- toast ---- */
#toastRoot{position:fixed;top:70px;right:24px;z-index:200;display:flex;flex-direction:column;gap:8px;}
.toast{
  background:var(--toast-bg);color:#fff;padding:10px 18px;border-radius:12px;font-size:13px;
  border:2px solid var(--outline);box-shadow:4px 4px 0 rgba(51,65,79,.25);
  animation:slideIn .25s;font-weight:600;
}
.toast.ok{background:var(--primary);}
.toast.err{background:#E5484D;}
@keyframes slideIn{from{transform:translateX(40px) rotate(2deg);opacity:0;}to{transform:translateX(0) rotate(0);opacity:1;}}

/* ================= 应用 · 到点提醒(上课/待办/活动) ================= */
/* 未授权浏览器通知(或安卓等平台不支持网页通知)时,提醒落到这张卡片上,
   挂在 #toastRoot 里复用右上角定位与移动端整行规则;停留时长由 js/app/reminder.js 控制。 */
.remind-card{
  position:relative;max-width:320px;box-sizing:border-box;
  background:var(--card);border:2px solid var(--outline);border-left:6px solid var(--primary);
  border-radius:14px;box-shadow:4px 4px 0 rgba(51,65,79,.2);
  padding:12px 34px 12px 14px;animation:slideIn .25s;
}
.remind-t{font-weight:800;font-size:14px;color:var(--title);}
.remind-b{margin-top:4px;font-size:12.5px;line-height:1.6;color:var(--text-2);}
.remind-x{position:absolute;top:6px;right:8px;border:none;background:none;cursor:pointer;
  font-size:13px;color:var(--text-2);padding:2px 4px;}
.remind-x:hover{color:var(--danger-text);}
@media(max-width:760px){.remind-card{max-width:none;}}
/* 设置弹窗里的行内勾选(开关)。用 .form-row .chk-line 两个类名压过
   通用规则 .form-row label 的 12px 灰字,开关文案要跟正文一样醒目。 */
.form-row .chk-line{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text);cursor:pointer;}
.chk-line input[type=checkbox]{width:16px;height:16px;margin:0;cursor:pointer;}

/* ================= 仪表盘 · 天空球场大横幅 ================= */
.banner-panel{
  background:
    radial-gradient(rgba(255,255,255,.22) 1.4px, transparent 1.6px) 0 0/14px 14px,
    linear-gradient(118deg,#2E8CFF 0%,#4FA8FF 45%,#2FA96B 100%);
  border:3px solid var(--outline);border-radius:22px;box-shadow:6px 6px 0 rgba(51,65,79,.16);
  padding:22px 26px 30px;margin-bottom:18px;display:flex;align-items:flex-start;gap:18px;
  position:relative;overflow:hidden;color:#fff;
}
/* 插图:笑脸太阳 + 云朵(纯SVG,无需图片文件) */
.banner-panel::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='20' fill='%23FFD93D' stroke='%2333414F' stroke-width='5'/%3E%3Cg stroke='%23FFD93D' stroke-width='6' stroke-linecap='round'%3E%3Cline x1='50' y1='6' x2='50' y2='18'/%3E%3Cline x1='50' y1='82' x2='50' y2='94'/%3E%3Cline x1='6' y1='50' x2='18' y2='50'/%3E%3Cline x1='82' y1='50' x2='94' y2='50'/%3E%3Cline x1='18' y1='18' x2='26' y2='26'/%3E%3Cline x1='74' y1='74' x2='82' y2='82'/%3E%3Cline x1='82' y1='18' x2='74' y2='26'/%3E%3Cline x1='26' y1='74' x2='18' y2='82'/%3E%3C/g%3E%3Ccircle cx='42' cy='45' r='3.5' fill='%2333414F'/%3E%3Ccircle cx='58' cy='45' r='3.5' fill='%2333414F'/%3E%3Cpath d='M42 58 q8 8 16 0' stroke='%2333414F' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 90% 6%/104px 104px,
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 70'%3E%3Cpath d='M18 56 h84 a15 15 0 0 0 0-30 a20 20 0 0 0-38-7 a16 16 0 0 0-46 9 a13 13 0 0 0 0 28 z' fill='%23FFFFFF' stroke='%2333414F' stroke-width='4'/%3E%3C/svg%3E") no-repeat 64% 14%/110px 62px,
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 70'%3E%3Cpath d='M18 56 h84 a15 15 0 0 0 0-30 a20 20 0 0 0-38-7 a16 16 0 0 0-46 9 a13 13 0 0 0 0 28 z' fill='%23FFFFFF' stroke='%2333414F' stroke-width='4'/%3E%3C/svg%3E") no-repeat 45% 6%/74px 42px;
  opacity:.92;
}
/* 插图:底部草地 + 速度线 */
.banner-panel::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:26px;pointer-events:none;
  background:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 26'%3E%3Cpath d='M0 26 L12 6 L24 26 L36 8 L48 26 L60 6 L72 26 L84 8 L96 26 L108 6 L120 26 Z' fill='%232EAD5C' opacity='.55'/%3E%3C/svg%3E") repeat-x left bottom/120px 26px;
}
.banner-icon{
  width:54px;height:54px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;font-size:28px;color:#31414F;
  background:linear-gradient(135deg,#FFE37A,#FF9F43);
  border:3px solid var(--outline);box-shadow:3px 3px 0 rgba(51,65,79,.3);
}
.banner-icon img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.banner-main{flex:1;position:relative;z-index:1;}
.banner-title{font-size:22px;font-weight:800;color:#fff;letter-spacing:.5px;text-shadow:0 2px 4px rgba(15,35,40,.45);}
.banner-desc{display:flex;align-items:baseline;gap:6px;margin:10px 0 2px;}
.banner-desc .lbl{font-size:13px;color:#fff;font-weight:700;text-shadow:0 1px 3px rgba(15,35,40,.5);}
.banner-desc .num{
  font-size:46px;font-weight:800;color:var(--sun);line-height:1;
  text-shadow:3px 3px 0 rgba(15,35,40,.42),0 2px 10px rgba(15,35,40,.3);
}
.banner-desc .unit{font-size:13px;color:#fff;font-weight:700;text-shadow:0 1px 3px rgba(15,35,40,.5);}
.banner-date{font-size:14px;color:#fff;margin-top:6px;font-weight:700;text-shadow:0 1px 3px rgba(15,35,40,.5);}
.banner-note{font-size:12.5px;color:#fff;margin-top:4px;font-weight:600;background:rgba(20,40,34,.34);display:inline-block;padding:3px 12px;border-radius:20px;}
/* 学期信息条 */
.banner-sem{
  font-size:12.5px;color:#fff;margin-top:5px;font-weight:700;background:rgba(255,255,255,.22);
  display:inline-block;padding:3px 12px;border-radius:20px;text-shadow:0 1px 2px rgba(15,35,40,.5);
}
.banner-week{
  position:absolute;top:18px;right:150px;background:#fff;color:var(--primary-dark);
  font-size:12px;font-weight:700;border-radius:12px;padding:6px 14px;
  border:2.5px solid var(--outline);box-shadow:3px 3px 0 rgba(51,65,79,.28);
  transform:rotate(3deg);z-index:2;white-space:nowrap;
}
.banner-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;position:relative;z-index:1;}
.banner-chip{
  font-size:12px;color:var(--primary-dark);background:#fff;border:2px solid var(--outline);
  border-radius:18px;padding:3px 12px;font-weight:700;box-shadow:2px 2px 0 rgba(51,65,79,.22);
}
.banner-chip:nth-child(2){transform:rotate(-1.5deg);}
.banner-chip:nth-child(3){transform:rotate(1.5deg);}
/* 假期倒数日:阳光黄高亮贴纸 */
.banner-chip.vac{background:linear-gradient(135deg,#FFE37A,#FFD93D);color:#6b4d00;text-shadow:none;}
/* 寒暑假倒数:冰蓝贴纸,与节假日阳光黄区分 */
.banner-chip.vac.big{background:linear-gradient(135deg,#BEE7FF,#7FC4FF);color:#155a8a;}
[data-theme="dark"] .banner-chip.vac{color:#6b4d00;}
[data-theme="dark"] .banner-chip.vac.big{color:#155a8a;}
/* 奔跑的运动小人 + 星星插画 */
.banner-runner{
  position:absolute;right:34px;bottom:4px;font-size:52px;z-index:2;pointer-events:none;
  animation:runBob 0.9s ease-in-out infinite;transform-origin:bottom center;
  filter:drop-shadow(3px 4px 0 rgba(51,65,79,.3));
}
@keyframes runBob{
  0%,100%{transform:translateY(0) rotate(-4deg);}
  50%{transform:translateY(-7px) rotate(4deg);}
}
.banner-star{
  position:absolute;right:150px;top:16px;font-size:20px;z-index:2;pointer-events:none;
  animation:twinkle 1.6s ease-in-out infinite;
}
@keyframes twinkle{0%,100%{transform:scale(1) rotate(0);opacity:.9;}50%{transform:scale(1.35) rotate(20deg);opacity:.5;}}

/* ================= 仪表盘 · 今日课程表 ================= */
.lesson-row{display:flex;align-items:center;gap:10px;border-radius:12px;padding:10px 12px;margin-top:8px;position:relative;border:2px solid transparent;transition:.12s;}
.lesson-row:hover{transform:translateX(2px);}
.lesson-row.pink{background:var(--pink-bg);border-left:5px solid var(--pink-line);border-color:var(--pink-line) rgba(255,90,133,.15) rgba(255,90,133,.15) rgba(255,90,133,.15);}
.lesson-row.blue{background:var(--blue-bg);border-left:5px solid var(--blue-line);border-color:var(--blue-line) rgba(61,155,255,.15) rgba(61,155,255,.15) rgba(61,155,255,.15);}
.lesson-row.orange{background:var(--orange-bg);border-left:5px solid var(--orange-line);border-color:var(--orange-line) rgba(255,159,67,.15) rgba(255,159,67,.15) rgba(255,159,67,.15);}
.lesson-row.now{outline:3px solid var(--primary);outline-offset:2px;}
.lesson-time-sm{font-size:12px;color:var(--text-2);width:88px;flex-shrink:0;line-height:1.35;font-weight:600;}
.lesson-body{flex:1;min-width:0;}
.lesson-type{font-size:13px;font-weight:700;color:var(--text);}
.lesson-cls{font-size:12px;color:var(--text-2);}
.lesson-flag{position:absolute;top:6px;right:8px;font-size:10px;background:var(--flag-bg);color:var(--flag-text);border-radius:6px;padding:1px 6px;border:1px solid rgba(138,106,63,.3);}
.lesson-state-sm{font-size:10px;border-radius:6px;padding:1px 7px;flex-shrink:0;background:var(--primary);color:#fff;border:1px solid var(--outline);font-weight:700;}

/* ================= 仪表盘 · 自律打卡 ================= */
.habit-row{display:flex;align-items:center;gap:10px;background:var(--primary-light);border-radius:12px;padding:10px 12px;margin-top:8px;cursor:pointer;transition:.15s;border:1px solid rgba(46,173,92,.25);}
.habit-row:hover{filter:brightness(.96);transform:translateX(2px);}
.habit-check{
  width:20px;height:20px;border-radius:7px;background:linear-gradient(180deg,#3FC173,#2EAD5C);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;flex-shrink:0;
  border:2px solid var(--outline);box-shadow:1.5px 1.5px 0 rgba(51,65,79,.25);
}
.habit-check.off{background:var(--input-bg);border:2px solid var(--check-border);box-shadow:none;}
.habit-name-sm{font-size:14px;font-weight:700;}
.habit-state{font-size:11px;color:var(--text-2);margin-left:auto;font-weight:600;}
.icon-pick{display:flex;flex-wrap:wrap;gap:6px;}
.icon-pick .ic{
  width:34px;height:34px;border-radius:10px;background:var(--primary-light);display:flex;
  align-items:center;justify-content:center;font-size:18px;cursor:pointer;user-select:none;transition:.15s;
  border:1px solid transparent;
}
.icon-pick .ic:hover{filter:brightness(.94);transform:scale(1.08);}
.icon-pick .ic.sel{background:var(--primary);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--primary-mid);border-color:var(--outline);}
.heat-wrap{margin-top:14px;}
.heat-title{font-size:12px;color:var(--text-2);margin-bottom:6px;font-weight:600;}
.heat-grid{display:grid;grid-template-columns:repeat(11,1fr);gap:4px;padding-bottom:4px;}
.heat-cell{width:100%;aspect-ratio:1;border-radius:4px;background:var(--track);}
.heat-cell[data-heat]{cursor:pointer;}
.heat-cell[data-heat]:hover{outline:1.5px solid var(--primary);outline-offset:1px;}
.heat-cell.c1{background:#6FAFFF;}
.heat-cell.c2{background:var(--primary-mid);}
.heat-cell.c3{background:var(--primary);}
.heat-cell.today{outline:1.5px solid var(--title);outline-offset:1px;}
.heat-legend{display:flex;gap:12px;font-size:11px;color:var(--text-2);margin-top:6px;align-items:center;flex-wrap:wrap;}
.heat-legend .sq{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:4px;vertical-align:-1px;}
.heat-stat{font-size:11px;color:var(--text-2);margin-top:5px;}

/* ================= 仪表盘 · 待办 / 活动 ================= */
.dash-head-note{font-size:12px;color:var(--text-2);margin-bottom:8px;}
.progress-line{display:flex;align-items:center;gap:10px;margin:10px 0 4px;}
.progress-line .lbl{font-size:12px;color:var(--text-2);flex-shrink:0;font-weight:600;}
.progress-track{flex:1;height:10px;background:var(--track);border-radius:8px;overflow:hidden;border:1px solid var(--border);}
.progress-fill-sm{height:100%;background:linear-gradient(90deg,#3FC173,#57D08A);border-radius:8px;transition:width .4s;}
.progress-line .num{font-size:12px;color:var(--text-2);flex-shrink:0;font-weight:600;}
/* 行内是"顶部对齐 + 允许换行":行里可能还挂着子项清单(整行会变高),
   若按 center 对齐,✏️/删除 会被居中到子项那一行,与标题错位;
   换行是给子项清单通铺留的(见 .sub-list) */
.todo-row{display:flex;align-items:flex-start;flex-wrap:wrap;gap:8px;padding:8px 2px;border-bottom:1px dashed var(--line-soft);}
.todo-row:last-child{border-bottom:none;}
/* 勾选框对第一行标题做光学居中:标题行高 19.5px(13px×1.5),方框 18px */
.todo-row .todo-check{margin-top:1px;}
.todo-check{
  width:18px;height:18px;border-radius:6px;border:2px solid var(--check-border);cursor:pointer;
  flex-shrink:0;background:var(--input-bg);transition:.12s;
}
.todo-check:hover{border-color:var(--primary);}
.todo-check.on{background:var(--primary);border-color:var(--outline);position:relative;}
.todo-check.on::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;}
/* 待办标题:与「近期活动」的 .event-name 同一字重(700),标题与子项在粗细上分清主次;
   完成后同样退回正常字重(见 .done),与活动标题的处理保持一致 */
.todo-text-sm{flex:1;font-size:13px;font-weight:700;min-width:0;line-height:1.5;overflow-wrap:break-word;word-break:break-word;}
.todo-text-sm.done{text-decoration:line-through;color:var(--text-2);font-weight:400;}
.prio{font-size:10px;border-radius:6px;padding:1px 6px;flex-shrink:0;background:var(--primary-light);color:var(--on-pl);font-weight:700;border:1px solid rgba(46,173,92,.25);}
.prio.mid{background:var(--orange-bg);color:#b06a2c;border-color:rgba(255,159,67,.35);}
.prio.high{background:var(--danger-bg);color:var(--danger-text);border-color:rgba(229,72,77,.25);}
.todo-time{font-size:11px;color:var(--text-2);flex-shrink:0;width:36px;text-align:right;}
.todo-date{font-size:10px;flex-shrink:0;border-radius:6px;padding:1px 6px;font-weight:600;background:var(--blue-bg);color:var(--blue-line);border:1px solid rgba(61,155,255,.3);}
.todo-date.past{background:var(--danger-bg);color:var(--danger-text);border-color:rgba(229,72,77,.3);}
.todo-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:3px;}
.todo-meta .todo-time{width:auto;text-align:left;}
.del-btn{
  background:var(--danger-bg);color:var(--danger-text);border:none;border-radius:8px;font-size:11px;
  padding:3px 9px;cursor:pointer;font-family:inherit;flex-shrink:0;border:1px solid rgba(229,72,77,.3);font-weight:600;
}
.del-btn:hover{background:#ffd4d4;}
.event-row{display:flex;align-items:flex-start;flex-wrap:wrap;gap:8px;padding:9px 2px;border-bottom:1px dashed #F1ECDE;}
.event-row:last-child{border-bottom:none;}
.event-main{flex:1;min-width:0;}
.event-name{font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.event-name.done{text-decoration:line-through;color:var(--text-2);font-weight:400;}
.event-meta{font-size:11px;color:var(--text-2);margin-top:2px;}
/* 待办/活动子项清单:通铺整行(flex-basis:100% 把它顶到下一行并占满行宽)。
   若是留在标题列里,标题列的可用宽度 = 卡片宽 − 勾选框 − 右侧徽章(还剩N天/已过)− ✏️ − 删除,
   在窄卡片(如右侧「近期活动」)里剩不到二十个字,稍长的子项就被迫折成多行;
   通铺后它只跟自己的勾选框与按钮竞争宽度,单行能放下的字数大约翻倍。
   缩进用 padding 补回来,宽 26px(勾选框 18px + 行间距 8px),其中 6px 由子项行自己的内边距承担 */
.sub-list{flex:0 0 100%;min-width:0;margin-top:5px;padding-left:20px;display:flex;flex-direction:column;gap:3px;}
.sub-row{display:flex;align-items:center;gap:8px;font-size:12.5px;}
/* 子项斑马纹:相邻行深浅交替,密集清单里一眼分清行界。
   · :nth-of-type 按**各自父容器**计数,所以将来若支持子项嵌套,内层清单会从"浅档"重新起算,
     与外层交替互不干扰(当前数据结构是单层:见 js/views/dashboard.js 的 subRowHTML);
   · 编辑态行有自己的整行高亮(见 .sub-row.editing),用 :not(.editing) 排除,不被斑马纹盖掉;
   · 圆角让每条底色成为独立色块,行与行之间靠 .sub-list 的 gap 留白 */
.sub-list .sub-row{padding:2px 6px;border-radius:8px;}
.sub-list .sub-row:nth-of-type(odd):not(.editing){background:var(--sub-zebra-a);}
.sub-list .sub-row:nth-of-type(even):not(.editing){background:var(--sub-zebra-b);}
.sub-check{width:16px;height:16px;min-width:16px;border:1.5px solid var(--border);border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:11px;cursor:pointer;color:#fff;background:var(--card);line-height:1;}
.sub-check.on{background:var(--primary);border-color:var(--primary);}
/* 子项显式声明正常字重:即便以后有人给父级(如 .event-main)设了 700,
   子项也不会被"继承"成粗体,标题/子项的层次不会被悄悄破坏 */
.sub-text{flex:1;min-width:0;font-weight:400;word-break:break-all;cursor:text;border-radius:5px;padding:1px 2px;}
/* 文字可点即改:悬停给出可编辑的暗示(移动端没有 hover,靠 ✏️ 按钮与点击反馈) */
.sub-text:hover{color:var(--primary);background:var(--primary-light);box-shadow:inset 0 0 0 1px rgba(46,173,92,.35);}
.sub-row.done .sub-text{text-decoration:line-through;color:var(--text-2);}
/* 弹窗内的子项文本(编辑的是副本,保存才落库):只展示,不做"可点击编辑"的暗示 */
.sub-text-static{flex:1;min-width:0;font-weight:400;word-break:break-all;}
/* 弹窗里的子项清单(改的是 subs 副本,保存才落库):与卡片用同一套斑马纹,
   同一份数据在两处的观感一致;内边距交给样式管,行内不再写死 */
#subList .sub-row{padding:3px 6px;border-radius:8px;}
#subList .sub-row:nth-of-type(odd){background:var(--sub-zebra-a);}
#subList .sub-row:nth-of-type(even){background:var(--sub-zebra-b);}
/* 子项行内按钮(修改/删除/保存/取消):统一尺寸,保证移动端好点 */
.sub-btn{flex:0 0 auto;background:none;border:none;color:var(--text-2);font-size:12px;cursor:pointer;padding:3px 5px;font-family:inherit;line-height:1;border-radius:6px;touch-action:manipulation;}
.sub-btn:hover{color:var(--primary);background:var(--card);}
.sub-edit{opacity:.7;}
.sub-del:hover{color:var(--danger-text);}
.sub-ok{color:var(--ok-text);font-size:14px;font-weight:800;}
.sub-ok:hover{color:var(--primary);}
.sub-cancel{font-size:13px;}
.sub-cancel:hover{color:var(--danger-text);}
/* 编辑态:整行高亮 + 编辑框描边,一眼看出"正在改这一条"。
   flex-wrap:窄屏/长文本时按钮换到下一行,而不是被编辑框挤出卡片 */
.sub-row.editing{background:var(--primary-light);border:1.5px solid var(--primary);border-radius:9px;padding:3px 4px;gap:6px;flex-wrap:wrap;}
.sub-row.editing .sub-in{flex:1 1 140px;min-width:0;width:auto;max-width:none;box-shadow:0 0 0 2px rgba(46,173,92,.18);}
/* 子项编辑框(textarea):文字自动换行并随内容增高 —— 单行 input 遇到长内容只能横向滚动,
   看不到全貌;这里超过 max-height 才出现内部滚动条,保证"内容多少都能读全" */
.sub-in{
  display:block;line-height:1.5;resize:none;overflow-y:auto;
  white-space:pre-wrap;word-break:break-word;max-height:min(35vh,9em);
}
.sub-add{align-self:flex-start;background:none;border:none;color:var(--text-2);font-size:12px;cursor:pointer;padding:2px 0;font-family:inherit;}
.sub-add:hover{color:var(--primary);}
.sub-in{font-size:12.5px;padding:4px 8px;border:1.5px solid var(--primary);border-radius:8px;font-family:inherit;background:var(--card);color:var(--text);outline:none;width:100%;max-width:260px;}
.dday{font-size:10px;border-radius:6px;padding:1px 7px;flex-shrink:0;background:var(--orange-bg);color:#b06a2c;margin-top:2px;font-weight:700;border:1px solid rgba(255,159,67,.35);}
.dday.today{background:var(--danger-bg);color:var(--danger-text);border-color:rgba(229,72,77,.3);}
.dday.past{background:var(--btn-gray);color:var(--gray-text);border-color:transparent;}

/* ================= 课表(新版) ================= */
.tabs{display:flex;align-items:flex-start;gap:6px;border-bottom:3px solid var(--border);margin-bottom:16px;}
.tab{padding:9px 20px 7px;cursor:pointer;font-size:14px;color:var(--text-2);position:relative;top:2px;border-radius:12px 12px 0 0;transition:.15s;font-weight:600;border:2px solid transparent;}
.tab:hover{color:var(--primary);}
.tab.active{
  color:#fff;border-color:var(--outline) var(--outline) transparent;background:linear-gradient(180deg,#3FC173,#2EAD5C);
  font-weight:800;box-shadow:0 -2px 0 var(--outline),2px -2px 0 var(--outline),-2px -2px 0 var(--outline);
}
.week-nav{display:flex;align-items:center;gap:8px;}
.sc-table{width:100%;border-collapse:separate;border-spacing:5px;table-layout:fixed;}
.sc-table th{font-size:12.5px;color:var(--text);padding:6px 4px;font-weight:700;}
.sc-table th.today-col{color:var(--primary);}
.sc-time{text-align:center;background:var(--panel);border-radius:10px;padding:6px 2px;vertical-align:middle;}
.sc-time b{display:block;font-size:12.5px;color:var(--title);font-weight:700;}
.sc-time span{font-size:10.5px;color:var(--text-2);}
.sc-cell{border-radius:12px;min-height:66px;padding:8px 9px;cursor:pointer;transition:.12s;font-size:12px;position:relative;vertical-align:top;border:2px solid transparent;}
.sc-cell.empty{background:var(--panel);border:2px dashed var(--check-border);}
.sc-cell.empty:hover{border-color:var(--primary);background:var(--empty-hover);}
.sc-plus{text-align:center;color:var(--muted);font-size:16px;line-height:46px;}
.sc-cell.filled{color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.45);box-shadow:0 3px 0 rgba(51,65,79,.2);}
.sc-cell.filled:hover{transform:translateY(-2px);box-shadow:0 5px 0 rgba(51,65,79,.2);}
.sc-cell.off{background:var(--orange-bg);border:2px dashed var(--orange-line);cursor:default;}
.sc-cell.hol{background:var(--danger-bg);border:2px dashed var(--danger-text);}
.sc-empty-txt{text-align:center;color:var(--muted-warm);font-size:11.5px;padding-top:18px;font-weight:700;}
.sc-cell.hol .sc-empty-txt{color:var(--danger-text);}
.sc-tags{position:absolute;top:5px;right:6px;display:flex;gap:3px;}
.cell-tag{font-size:10px;border-radius:6px;padding:1px 5px;background:rgba(255,255,255,.9);color:#7a6a3a;font-weight:700;line-height:1.4;display:inline-block;border:1px solid rgba(51,65,79,.18);}
/* 单双周角标:单=蓝,双=橙 */
.cell-tag.weeks-odd{background:#E1F0FF;color:#2D7DD2;border-color:rgba(61,155,255,.35);}
.cell-tag.weeks-even{background:#FFF0DC;color:#B06A2C;border-color:rgba(255,159,67,.35);}
.sc-name{font-size:13px;font-weight:800;line-height:1.3;padding-right:30px;}
.sc-sub{font-size:11.5px;opacity:.94;margin-top:2px;}
.sc-note{font-size:10.5px;opacity:.8;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* 弹窗:生效范围 / 功能Tab / 表单 / 配色 */
.scope-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.scope-pill{font-size:12.5px;border:2px solid var(--border);background:var(--input-bg);border-radius:20px;padding:7px 16px;cursor:pointer;transition:.15s;color:var(--text-2);font-weight:600;}
.scope-pill:hover{border-color:var(--primary);color:var(--primary);}
.scope-pill.on{background:var(--panel-2);border-color:var(--outline);color:var(--title);font-weight:800;box-shadow:2px 2px 0 rgba(51,65,79,.2);}
.ftabs{display:flex;gap:8px;margin-bottom:16px;}
.ftab{font-size:15px;font-weight:600;padding:7px 18px;border-radius:11px;background:var(--btn-gray);color:var(--gray-text);cursor:pointer;transition:.15s;border:2px solid transparent;}
.ftab:hover{filter:brightness(.95);}
.ftab.on{background:linear-gradient(180deg,#3FC173,#2EAD5C);color:#fff;font-weight:800;border-color:var(--outline);box-shadow:3px 3px 0 rgba(51,65,79,.2);}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;}
@media(max-width:700px){.form-grid{grid-template-columns:1fr;}}
.fg-item label{display:block;font-size:14px;color:var(--text);margin-bottom:5px;font-weight:600;}
.fg-item input,.fg-item select{width:100%;}
.color-block{margin-top:18px;padding-top:14px;border-top:1px dashed var(--border);}
.swatches{display:grid;grid-template-columns:repeat(7,32px);gap:10px;}
.swatch{width:28px;height:28px;border-radius:50%;cursor:pointer;display:inline-block;border:2px solid transparent;transition:.12s;position:relative;}
.swatch:hover{transform:scale(1.18) rotate(8deg);}
.swatch.on{border-color:rgba(255,255,255,.9);box-shadow:0 0 0 2px #fff,0 0 0 4px rgba(0,0,0,.28);}
.swatch.on::after{content:"✓";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;}
.swatch.none{background:var(--input-bg);border:2px dashed var(--check-border);}
.swatch.none.on::after{content:"班级色";font-size:8px;color:var(--text-2);font-weight:400;}
.stat-mini{
  display:flex;flex-direction:column;gap:4px;background:var(--card);border-radius:14px;padding:14px 16px;
  border:2px solid var(--outline);box-shadow:var(--shadow);transition:transform .18s,box-shadow .18s;
}
.stat-mini:hover{transform:translateY(-3px) rotate(-.6deg);box-shadow:var(--shadow-lift);}
.stat-mini b{font-size:24px;color:var(--primary);}
.stat-mini span{font-size:12px;color:var(--text-2);font-weight:600;}
.stat-mini.red b{color:var(--danger-text);}
.stat-mini.orange b{color:#b06a2c;}
.record-item{display:flex;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px dashed var(--line-soft);font-size:13px;}
.record-item:last-child{border-bottom:none;}

/* ================= 教学计划(新版) ================= */
.plan-top{
  background:var(--card);border:2px solid var(--outline);border-radius:18px;box-shadow:var(--shadow);
  padding:16px 20px;margin-bottom:12px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
}
.plan-top .pt-label{font-size:13px;color:var(--text);font-weight:700;flex-shrink:0;}
.plan-ops{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap;}
.stat-block{display:flex;align-items:baseline;gap:8px;padding:0 18px;border-left:1px solid var(--border);}
.stat-block b{font-size:28px;font-weight:800;color:var(--primary);line-height:1;text-shadow:2px 2px 0 rgba(46,173,92,.15);}
.stat-block span{font-size:12px;color:var(--text-2);font-weight:600;}
.assign-track{display:flex;align-items:center;gap:10px;flex:1;min-width:180px;}
.assign-track .progress-track{height:10px;}
.hint-bar{
  background:var(--panel-2);border-radius:12px;padding:8px 14px;font-size:12.5px;color:var(--title);
  margin-bottom:14px;font-weight:600;border:1px dashed var(--panel-2-line);
}
.unit-block{
  background:var(--card);border:2px solid var(--outline);border-radius:18px;box-shadow:var(--shadow);
  margin-bottom:14px;overflow:hidden;
}
.unit-head{display:flex;align-items:center;gap:10px;padding:14px 18px;flex-wrap:wrap;}
.unit-color2{width:13px;height:13px;border-radius:4px;flex-shrink:0;}
.unit-title{font-size:15px;font-weight:800;color:var(--title);}
.unit-sub{font-size:12px;color:var(--text-2);}
.unit-meta{font-size:12px;color:var(--text-2);}
.unit-head .progress-track{flex:1;min-width:120px;height:10px;}
.unit-ops{display:flex;gap:6px;}
.unit-body{border-top:1px dashed var(--border);padding:6px 12px 10px;}
.ls-row{display:flex;align-items:center;gap:10px;padding:10px 8px;border-bottom:1px dashed var(--line-soft);}
.ls-row:last-child{border-bottom:none;}
/* 状态/教案/反思 三控件容器:桌面端不参与布局,窄屏变纵向紧凑列 */
.ls-ops{display:contents;}
.ls-no{width:62px;flex-shrink:0;font-size:13px;font-weight:800;color:var(--title);}
.ls-status{font-size:11px;border-radius:8px;padding:2px 8px;flex-shrink:0;background:var(--btn-gray);color:var(--gray-text);font-weight:700;border:1px solid transparent;}
.ls-status.taught{background:var(--primary-light);color:var(--on-pl);border-color:rgba(46,173,92,.3);}
.ls-status.prep{background:var(--orange-bg);color:#b06a2c;border-color:rgba(255,159,67,.35);}
.ls-status.ref{background:var(--blue-bg);color:#2f6fb8;border-color:rgba(61,155,255,.3);}
.ls-main{flex:1;min-width:0;}
.ls-topic{font-size:13.5px;font-weight:600;}
.ls-topic.empty{color:#aaa69a;font-weight:400;font-style:italic;}
.ls-detail{font-size:12px;color:var(--text-2);margin-top:2px;}
.ls-date{font-size:11px;color:var(--text-2);flex-shrink:0;width:120px;text-align:right;}
@media(max-width:900px){.ls-date{display:none;}}
/* 课时行内快捷操作 */
.unit-no{width:22px;height:22px;border-radius:8px;color:#fff;font-size:12px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border:1.5px solid var(--outline);box-shadow:1.5px 1.5px 0 rgba(51,65,79,.25);}
.unit-goal{font-size:12.5px;color:var(--text-2);background:var(--panel);border-radius:10px;padding:7px 12px;margin:8px 8px 0;line-height:1.7;}
.ls-row{border-radius:10px;transition:background .12s;}
.ls-row:hover{background:var(--panel);}
.ls-st{cursor:pointer;user-select:none;}
.ls-st:hover{filter:brightness(.92);}
.ls-ref-btn{border:none;background:var(--btn-gray);border-radius:8px;width:28px;height:24px;cursor:pointer;font-size:13px;flex-shrink:0;font-family:inherit;opacity:.5;transition:.12s;line-height:1;display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;}
.ls-ref-btn:hover{opacity:1;filter:brightness(.94);}
.ls-ref-btn.on{background:var(--primary-light);opacity:1;border-color:rgba(46,173,92,.3);}
/* 通用进度条(作业/教科研等) */
.progress-bar{height:12px;background:var(--track);border-radius:8px;overflow:hidden;margin:8px 0 4px;border:1px solid var(--border);}
.progress-fill{height:100%;border-radius:8px;background:linear-gradient(90deg,#3FC173,#57D08A);transition:width .4s;position:relative;overflow:hidden;}
.progress-fill::after{content:"";position:absolute;top:0;left:0;right:0;height:45%;background:rgba(255,255,255,.28);}
.progress-fill.warn{background:linear-gradient(90deg,#FFB84D,#FF9F43);}
.progress-fill.over{background:linear-gradient(90deg,#FF7B7B,#E5484D);}
.unit-color{width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:6px;}
/* AI 生成面板 */
.ai-panel{background:var(--ai-bg);border:1.5px solid var(--ai-line);border-radius:12px;padding:12px 14px;margin-bottom:14px;}
.ai-head{display:flex;align-items:center;font-size:14px;font-weight:800;color:var(--title);}
.ai-head button{margin-left:auto;}
#aiStatus{font-size:12px;margin-top:8px;line-height:1.6;min-height:16px;color:var(--text-2);}
#aiStatus.ok{color:var(--ok-text);}
#aiStatus.err{color:#C85C5C;}
#aiTestStatus{font-size:12px;margin-top:6px;min-height:18px;}
/* ---------- 登录 / 注册浮层(漫画场景版) ---------- */
.login-mask{position:fixed;inset:0;background:rgba(23,30,38,.6);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:90;animation:fadeIn .2s;padding:16px;}
.login-card{
  background:var(--modal-bg);border:3px solid var(--outline);border-radius:24px;
  box-shadow:10px 10px 0 rgba(51,65,79,.25),0 24px 60px rgba(0,0,0,.3);
  width:400px;max-width:94vw;max-height:94vh;overflow-y:auto;animation:pop .25s;position:relative;
}
/* 头图:太阳 + 云朵 + 草地的天空球场 */
.login-hero{
  position:relative;overflow:hidden;text-align:center;color:#fff;padding:26px 24px 22px;
  background:
    radial-gradient(rgba(255,255,255,.2) 1.4px, transparent 1.6px) 0 0/14px 14px,
    linear-gradient(118deg,#2E8CFF,#4FA8FF 55%,#2FA96B);
  border-bottom:3px solid var(--outline);
}
.login-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.95;
  background:
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Ccircle cx='50' cy='50' r='20' fill='%23FFD93D' stroke='%2333414F' stroke-width='5'/%3E%3Cg stroke='%23FFD93D' stroke-width='6' stroke-linecap='round'%3E%3Cline x1='50' y1='6' x2='50' y2='18'/%3E%3Cline x1='50' y1='82' x2='50' y2='94'/%3E%3Cline x1='6' y1='50' x2='18' y2='50'/%3E%3Cline x1='82' y1='50' x2='94' y2='50'/%3E%3Cline x1='18' y1='18' x2='26' y2='26'/%3E%3Cline x1='74' y1='74' x2='82' y2='82'/%3E%3Cline x1='82' y1='18' x2='74' y2='26'/%3E%3Cline x1='26' y1='74' x2='18' y2='82'/%3E%3C/g%3E%3Ccircle cx='42' cy='45' r='3.5' fill='%2333414F'/%3E%3Ccircle cx='58' cy='45' r='3.5' fill='%2333414F'/%3E%3Cpath d='M42 58 q8 8 16 0' stroke='%2333414F' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 86% 8%/72px 72px,
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 70'%3E%3Cpath d='M18 56 h84 a15 15 0 0 0 0-30 a20 20 0 0 0-38-7 a16 16 0 0 0-46 9 a13 13 0 0 0 0 28 z' fill='%23FFFFFF' stroke='%2333414F' stroke-width='4'/%3E%3C/svg%3E") no-repeat 56% 16%/88px 50px,
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 26'%3E%3Cpath d='M0 26 L12 6 L24 26 L36 8 L48 26 L60 6 L72 26 L84 8 L96 26 L108 6 L120 26 Z' fill='%232EAD5C' opacity='.55'/%3E%3C/svg%3E") repeat-x left bottom/120px 22px;
}
.login-hero>*{position:relative;z-index:1;}
.lh-emoji{font-size:46px;line-height:1;display:inline-block;filter:drop-shadow(0 3px 0 rgba(15,35,40,.35));animation:floaty 3s ease-in-out infinite;}
.lh-title{font-size:20px;font-weight:800;margin-top:8px;letter-spacing:.5px;text-shadow:0 2px 3px rgba(15,35,40,.5);}
.lh-sub{font-size:12px;opacity:.96;margin-top:5px;text-shadow:0 1px 2px rgba(15,35,40,.5);}
.lh-runner{position:absolute;right:14px;bottom:0;font-size:32px;z-index:2;pointer-events:none;animation:runBob .9s ease-in-out infinite;filter:drop-shadow(2px 3px 0 rgba(15,35,40,.3));}
.lh-star{position:absolute;left:16px;top:14px;font-size:16px;z-index:2;pointer-events:none;animation:twinkle 1.6s ease-in-out infinite;}
.login-body{padding:20px 26px 24px;}
.login-tabs{margin-bottom:16px;}
.login-tabs .ftab{flex:1;text-align:center;}
.login-field{
  display:flex;align-items:center;gap:9px;background:var(--input-bg);
  border:2px solid var(--border);border-radius:14px;padding:0 12px;margin-bottom:12px;transition:.15s;
}
.login-field:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(46,173,92,.18);}
.login-field .lf-ico{font-size:16px;flex-shrink:0;}
.login-field input{flex:1;min-width:0;border:none;background:transparent;padding:11px 0;font-size:14px;box-shadow:none;}
.login-field input:focus{border:none;box-shadow:none;}
.lf-eye{border:none;background:transparent;cursor:pointer;font-size:15px;opacity:.55;padding:4px 2px;flex-shrink:0;font-family:inherit;line-height:1;}
.lf-eye:hover{opacity:1;}
.login-status{font-size:12.5px;min-height:18px;color:var(--danger-text);font-weight:600;}
.login-status.shake{animation:shakeX .3s;}
@keyframes shakeX{0%,100%{transform:translateX(0);}25%{transform:translateX(-5px);}75%{transform:translateX(5px);}}
.login-go{width:100%;justify-content:center;padding:12px;font-size:15.5px;font-weight:800;border-radius:14px;margin-top:2px;}
.login-go:disabled{opacity:.7;cursor:wait;transform:none!important;}
.login-hint{font-size:11.5px;color:var(--text-2);text-align:center;margin-top:12px;background:var(--panel);border-radius:10px;padding:7px 10px;line-height:1.6;}
.login-hint b{color:var(--title);}
.user-chip{font-size:12.5px;color:var(--title);background:var(--primary-light);border-radius:16px;padding:6px 13px;font-weight:700;white-space:nowrap;border:1px solid rgba(46,173,92,.3);}
/* 游戏库 AI 生成 */
.btn-ai-open{
  background:rgba(255,255,255,.18);color:#fff;border:2.5px solid var(--outline);border-radius:14px;
  padding:12px 24px;font-size:15px;font-weight:800;cursor:pointer;transition:.15s;
  box-shadow:3px 3px 0 rgba(51,65,79,.3);backdrop-filter:blur(2px);
}
.btn-ai-open:hover{background:#fff;color:var(--primary-dark);transform:translateY(-2px);}
.ai-chip-group{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:8px;}
.ai-chip-group .lbl{font-size:12px;color:var(--text-2);width:64px;flex-shrink:0;font-weight:600;}
.ai-chip{padding:5px 13px;border-radius:18px;background:var(--input-bg);border:2px solid var(--border);font-size:12.5px;cursor:pointer;transition:.12s;font-weight:600;}
.ai-chip:hover{border-color:var(--primary);color:var(--primary);}
.ai-chip.on{background:var(--primary);border-color:var(--outline);color:#fff;box-shadow:2px 2px 0 rgba(51,65,79,.2);}
.ai-cfg{margin-top:12px;border:1.5px dashed var(--border);border-radius:12px;padding:8px 12px;background:var(--card);}
.ai-cfg summary{cursor:pointer;font-size:13px;color:var(--text-2);user-select:none;}
#aiGStatus{font-size:12px;margin-top:12px;min-height:18px;line-height:1.6;color:var(--text-2);}
#aiGStatus.ok{color:var(--ok-text);}
#aiGStatus.err{color:#C85C5C;}
.ai-preview{margin-top:10px;border:2px solid var(--border);border-radius:14px;padding:14px;background:var(--card);}
.badge-ai{position:absolute;top:10px;left:12px;font-size:10px;background:rgba(255,255,255,.28);border-radius:8px;padding:1px 7px;font-weight:700;border:1px solid rgba(255,255,255,.5);}
.game-cover{position:relative;}

/* ================= AI 设置弹窗(三级配置:全校默认 / 我的配置) ================= */
/* 「当前生效」卡片:来源不同用不同色调,让层级一眼可辨 */
.ai-eff{border:2px solid var(--border);border-radius:14px;padding:12px 14px;margin-bottom:16px;background:var(--panel);}
.ai-eff.is-global{background:var(--ai-bg);border-color:var(--ai-line);}
.ai-eff.is-mine{background:var(--ok-bg);border-color:var(--ok-line);}
.ai-eff.is-none{background:var(--danger-bg);border-color:rgba(229,72,77,.35);}
.ai-eff-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;}
.ai-eff.is-none .ai-eff-head b{color:var(--danger-text);}
.ai-dot{width:9px;height:9px;border-radius:50%;background:var(--text-2);flex-shrink:0;}
.ai-eff.is-global .ai-dot{background:var(--sky);}
.ai-eff.is-mine .ai-dot{background:var(--primary);}
.ai-eff.is-none .ai-dot{background:var(--danger-text);}
.ai-tag{font-size:11px;padding:2px 9px;border-radius:20px;background:var(--card);color:var(--text-2);border:1px solid var(--border);font-weight:600;}
.ai-tag.is-lock{background:var(--danger-bg);color:var(--danger-text);border-color:rgba(229,72,77,.35);}
.ai-eff-row{display:flex;gap:8px;align-items:baseline;margin-top:7px;font-size:12px;}
/* 只约束「标签」那一列:写成 >span 会把值也套上固定宽度,导致长文本(如 设置人 + 日期)被挤断行 */
.ai-eff-row>span:first-child{color:var(--text-2);width:66px;flex-shrink:0;}
.ai-eff-row code{font-family:ui-monospace,Consolas,monospace;font-size:12px;color:var(--text);background:var(--card);border:1px solid var(--border);border-radius:7px;padding:2px 8px;word-break:break-all;}
.ai-eff-warn{margin-top:8px;font-size:12.5px;color:var(--danger-text);font-weight:600;line-height:1.6;}

.ai-sec-title{font-size:13px;font-weight:800;color:var(--title);margin:2px 0 10px;}
/* 三态分段控件 */
.ai-seg{display:flex;gap:6px;flex-wrap:wrap;background:var(--panel);border:2px solid var(--border);border-radius:12px;padding:5px;margin-bottom:8px;}
.ai-seg-btn{flex:1 1 auto;min-width:104px;border:none;background:transparent;color:var(--text-2);font-family:inherit;font-size:13px;font-weight:700;padding:8px 10px;border-radius:9px;cursor:pointer;transition:.15s;}
.ai-seg-btn:hover:not(:disabled){color:var(--primary);}
.ai-seg-btn.on{background:linear-gradient(180deg,#3FC173,#2EAD5C);color:#fff;box-shadow:2px 2px 0 rgba(51,65,79,.2);}
.ai-seg-btn:disabled{opacity:.42;cursor:not-allowed;}
.ai-seg-desc{font-size:12px;color:var(--text-2);margin-bottom:12px;line-height:1.6;}
.ai-miss{font-size:12px;line-height:1.7;margin:-4px 0 10px;}

/* 管理员区:与个人配置明确分隔,避免误操作 */
.ai-admin{margin-top:6px;padding-top:14px;border-top:2px dashed var(--line-soft);}
.ai-admin-note{font-size:12px;color:var(--text-2);line-height:1.7;margin-bottom:10px;}
.ai-def-box{background:var(--panel);border:2px solid var(--border);border-radius:12px;padding:10px 12px;margin-bottom:10px;}
.ai-def-row{display:flex;gap:8px;align-items:baseline;font-size:12px;margin-bottom:5px;}
.ai-def-row:last-child{margin-bottom:0;}
.ai-def-row>span:first-child{color:var(--text-2);width:58px;flex-shrink:0;}
.ai-def-row code{font-family:ui-monospace,Consolas,monospace;font-size:12px;color:var(--text);word-break:break-all;}
.ai-def-empty{font-size:12.5px;color:var(--danger-text);font-weight:600;line-height:1.6;}
.ai-admin-ops{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
.ai-lock-row{display:flex;gap:10px;align-items:flex-start;background:var(--panel-2);border:2px solid var(--panel-2-line);border-radius:12px;padding:10px 12px;cursor:pointer;font-size:12.5px;line-height:1.7;color:var(--text);}
.ai-lock-row input{margin-top:3px;flex-shrink:0;}
.ai-lock-sub{display:block;color:var(--text-2);font-weight:400;font-size:12px;}

/* 弹窗底部状态行 */
.ai-teststatus{font-size:12.5px;line-height:1.7;min-height:19px;color:var(--text-2);margin-top:12px;}
.ai-teststatus.is-ok{color:var(--ok-text);font-weight:600;}
.ai-teststatus.is-err{color:var(--danger-text);font-weight:600;}

/* ================= 学生管理 ================= */
.class-chip{
  display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:22px;background:var(--input-bg);
  border:2px solid var(--border);cursor:pointer;font-size:13px;transition:.15s;font-weight:600;
}
.class-chip:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-1px);}
.class-chip.active{background:linear-gradient(180deg,#3FC173,#2EAD5C);border-color:var(--outline);color:#fff;font-weight:700;box-shadow:2px 2px 0 rgba(51,65,79,.2);}
.class-chip small{opacity:.7;}
.class-chip .chip-ops{display:none;gap:2px;margin-left:2px;}
.class-chip:hover .chip-ops,.class-chip.active .chip-ops{display:inline-flex;}
.class-chip .chip-op{font-size:12px;line-height:1;padding:2px 3px;border-radius:5px;opacity:.7;}
.class-chip .chip-op:hover{opacity:1;background:rgba(0,0,0,.08);}
.class-chip.active .chip-op:hover{background:rgba(255,255,255,.25);}

/* ================= 游戏库 ================= */
.filter-bar{
  display:flex;gap:14px;flex-wrap:wrap;align-items:center;background:var(--card);border-radius:16px;
  border:2px solid var(--outline);padding:14px 16px;box-shadow:var(--shadow);margin-bottom:16px;
}
.filter-group{display:flex;align-items:center;gap:6px;flex-wrap:wrap;row-gap:6px;}
.filter-group .lbl{font-size:12px;color:var(--text-2);flex-shrink:0;font-weight:700;}
.f-opt{
  padding:5px 12px;border-radius:18px;background:var(--panel);font-size:12px;cursor:pointer;
  transition:.12s;border:1.5px solid transparent;font-weight:600;
}
.f-opt:hover{border-color:var(--primary);color:var(--primary);}
.f-opt.on{background:var(--primary);color:#fff;border-color:var(--outline);box-shadow:1.5px 1.5px 0 rgba(51,65,79,.2);}
.game-card{
  background:var(--card);border-radius:18px;border:2px solid var(--outline);box-shadow:var(--shadow);
  padding:0;overflow:hidden;cursor:pointer;transition:.2s;display:flex;flex-direction:column;
}
.game-card:hover{transform:translateY(-5px) rotate(-.5deg);box-shadow:var(--shadow-lift);}
.game-cover{height:88px;color:#fff;display:flex;flex-direction:column;justify-content:center;padding:0 16px;background:var(--primary);position:relative;overflow:hidden;}
/* 封面上的网点装饰 */
.game-cover::after{content:"";position:absolute;inset:0;background:radial-gradient(rgba(255,255,255,.2) 1.2px, transparent 1.4px) 0 0/11px 11px;pointer-events:none;}
.game-cover .g-name{font-size:16px;font-weight:800;text-shadow:0 2px 0 rgba(51,65,79,.3);}
.game-cover .g-type{font-size:11px;opacity:.92;margin-top:3px;font-weight:600;}
.game-body{padding:12px 16px 14px;flex:1;}
.game-meta{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px;}
.game-desc{font-size:12px;color:var(--text-2);line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.game-fav{position:absolute;top:10px;right:12px;font-size:16px;background:rgba(255,255,255,.28);border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid rgba(255,255,255,.5);}
.draw-panel{
  background:
    radial-gradient(rgba(255,255,255,.2) 1.4px, transparent 1.6px) 0 0/13px 13px,
    linear-gradient(120deg,#F08A35 0%,#F7556B 62%,#E24A6D 100%);
  border-radius:22px;color:#fff;padding:22px 26px;margin-bottom:16px;display:flex;align-items:center;
  gap:24px;flex-wrap:wrap;border:3px solid var(--outline);box-shadow:6px 6px 0 rgba(51,65,79,.18);
  position:relative;overflow:hidden;
}
.draw-panel::after{content:"🎲";position:absolute;right:18px;bottom:-16px;font-size:96px;opacity:.16;transform:rotate(-12deg);pointer-events:none;}
.draw-panel .d-info{flex:1;min-width:200px;position:relative;z-index:1;}
.draw-panel .d-info h3{font-size:18px;margin-bottom:6px;text-shadow:0 2px 4px rgba(70,10,30,.45);}
.draw-panel .d-info p{font-size:12px;opacity:.97;line-height:1.7;text-shadow:0 1px 2px rgba(70,10,30,.45);}
.btn-draw{
  background:linear-gradient(180deg,#FFF3B0,#FFD93D);color:var(--outline);border:3px solid var(--outline);
  border-radius:14px;padding:13px 30px;font-size:16px;font-weight:800;cursor:pointer;transition:.15s;
  box-shadow:0 5px 0 var(--outline);position:relative;z-index:1;
}
.btn-draw:hover{transform:scale(1.05) rotate(-1deg);}
.btn-draw:active{transform:scale(.96) translateY(3px);box-shadow:0 2px 0 var(--outline);}
.draw-card-wrap{perspective:1200px;}
.draw-card{
  background:var(--card);color:var(--text);border-radius:18px;padding:24px;max-width:640px;
  border:2px solid var(--outline);box-shadow:8px 8px 0 rgba(51,65,79,.2),0 10px 40px rgba(0,0,0,.12);
  animation:flipIn .5s;
}
@keyframes flipIn{from{transform:rotateY(90deg) rotate(2deg);}to{transform:rotateY(0) rotate(0);}}
.rule-step{display:flex;gap:8px;margin-bottom:7px;font-size:13px;line-height:1.65;}
.rule-step .n{
  width:21px;height:21px;background:var(--primary-light);color:var(--on-pl);border-radius:50%;
  text-align:center;line-height:21px;font-size:11px;flex-shrink:0;font-weight:800;border:1.5px solid var(--outline);
}
.safety-box{background:var(--orange-bg);border:2px solid var(--orange-line);border-radius:12px;padding:10px 14px;font-size:12.5px;color:#8a5a20;line-height:1.7;font-weight:500;}
.prog-box{background:var(--ok-bg);border:2px solid var(--ok-line);border-radius:12px;padding:10px 14px;font-size:12.5px;color:var(--ok-text);line-height:1.7;font-weight:500;}

/* ================= 班级卡片 ================= */
.cls-card{
  background:var(--card);border:2px solid var(--outline);border-radius:16px;padding:16px;
  display:flex;align-items:center;gap:13px;box-shadow:var(--shadow);
  transition:transform .18s,box-shadow .18s;
}
.cls-card:hover{transform:translateY(-3px) rotate(-.5deg);box-shadow:var(--shadow-lift);}
.cls-avatar{
  width:42px;height:42px;border-radius:13px;flex-shrink:0;display:flex;align-items:center;
  justify-content:center;color:#fff;font-weight:800;font-size:17px;border:2px solid var(--outline);
  box-shadow:2px 2px 0 rgba(51,65,79,.25);
}

/* ================= 课表:今天列高亮 ================= */
.sc-table td.today-td{background:rgba(46,173,92,.08);border-radius:12px;}

/* ================= 体质嵌入 ================= */
.embed-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;}
.embed-tab{padding:7px 15px;border-radius:11px;background:var(--input-bg);border:2px solid var(--border);cursor:pointer;font-size:13px;transition:.15s;font-weight:600;}
.embed-tab:hover{border-color:var(--primary);color:var(--primary);}
.embed-tab.active{background:linear-gradient(180deg,#3FC173,#2EAD5C);color:#fff;border-color:var(--outline);box-shadow:2px 2px 0 rgba(51,65,79,.2);}
.embed-frame{width:100%;border:2px solid var(--border);border-radius:16px;background:var(--card);min-height:70vh;}

/* ================= 教科研 ================= */
.res-hero{
  background:
    radial-gradient(rgba(255,255,255,.2) 1.4px, transparent 1.6px) 0 0/13px 13px,
    linear-gradient(120deg,#7C49D9 0%,#9B5DE5 50%,#7A59E0 100%);
  border-radius:22px;color:#fff;padding:22px 26px;margin-bottom:16px;display:flex;align-items:center;
  gap:18px;flex-wrap:wrap;border:3px solid var(--outline);box-shadow:6px 6px 0 rgba(51,65,79,.18);
  position:relative;overflow:hidden;
}
.res-hero::after{content:"🎓";position:absolute;right:20px;bottom:-18px;font-size:96px;opacity:.16;transform:rotate(10deg);pointer-events:none;}
.res-hero-ico{
  width:54px;height:54px;border-radius:15px;background:rgba(255,255,255,.2);display:flex;align-items:center;
  justify-content:center;font-size:28px;flex-shrink:0;border:2px solid rgba(255,255,255,.5);
}
.res-hero-main{flex:1;min-width:220px;position:relative;z-index:1;}
.res-hero-title{font-size:20px;font-weight:800;letter-spacing:.5px;text-shadow:0 2px 4px rgba(40,20,70,.45);}
.res-hero-desc{font-size:12.5px;color:#fff;opacity:.97;margin-top:4px;text-shadow:0 1px 2px rgba(40,20,70,.45);}
.res-hero-btn{
  margin-top:10px;background:rgba(255,255,255,.2);color:#fff;border:2px solid rgba(255,255,255,.85);
  border-radius:10px;padding:5px 14px;font-size:12.5px;font-weight:700;cursor:pointer;transition:.15s;font-family:inherit;
  box-shadow:2px 2px 0 rgba(51,65,79,.3);text-shadow:0 1px 2px rgba(40,20,70,.35);
}
.res-hero-btn:hover{background:#fff;color:var(--primary-dark);transform:translateY(-1px);}
.res-hero-stats{display:flex;gap:28px;padding-right:6px;position:relative;z-index:1;}
.res-hero-stats .rhs{text-align:center;min-width:56px;}
.res-hero-stats b{display:block;font-size:28px;font-weight:800;line-height:1.15;text-shadow:0 2px 4px rgba(40,20,70,.45);}
.res-hero-stats span{font-size:11.5px;opacity:.97;font-weight:700;}
.tab .tab-n{font-style:normal;font-size:10.5px;background:var(--btn-gray);color:var(--gray-text);border-radius:10px;padding:1px 7px;margin-left:5px;vertical-align:1px;font-weight:800;}
.tab.active .tab-n{background:rgba(255,255,255,.28);color:#fff;}
.toolbar-tip{font-size:12px;color:var(--text-2);}
/* 级别配色体系(公开课/课题/成果通用) */
.tag.lv-nat{background:#FBEED9;color:#9C6F1D;border-color:#E8C98A;}
.tag.lv-prov{background:#EFE9F8;color:#6B48D8;border-color:#C9B8F0;}
.tag.lv-city{background:#E6EEF6;color:#3d6fb0;border-color:#BBD4EF;}
.tag.lv-dist{background:#D8E7DF;color:#1E8A45;border-color:#B4D6C4;}
.tag.lv-school{background:#E9E9E7;color:#6a6a66;border-color:transparent;}
/* 教科研筛选条 */
.res-filterbar{
  display:flex;gap:14px;flex-wrap:wrap;align-items:center;background:var(--card);border-radius:14px;
  border:2px solid var(--outline);padding:10px 16px;box-shadow:var(--shadow);margin-bottom:14px;
}
.res-filterbar .lbl{font-size:12px;color:var(--text-2);flex-shrink:0;font-weight:700;}
.res-search{margin-left:auto;width:220px;}
@media(max-width:760px){.res-search{width:100%;margin-left:0;}}
/* 课题卡片 */
.pj-card .card-title .sub{font-size:12px;color:var(--text-2);font-weight:400;}
.pj-next{font-size:12.5px;color:var(--text);background:var(--panel);border-radius:10px;padding:7px 12px;margin-bottom:10px;line-height:1.6;border-left:3px solid var(--primary);}
.ms-list{margin:10px 0;}
.ms-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px dashed var(--line-soft);font-size:13px;}
.ms-item:last-child{border-bottom:none;}
.ms-item input[type=checkbox]{width:16px;height:16px;cursor:pointer;flex-shrink:0;accent-color:var(--primary);}
.ms-date{width:80px;color:var(--text-2);font-size:12px;flex-shrink:0;}
.ms-date.overdue{color:var(--danger-text);font-weight:800;}
.ms-name{flex:1;min-width:0;}
.ms-name.done{color:#94a3b8;text-decoration:line-through;}
.ms-line{flex:1;height:7px;background:var(--track);border-radius:5px;overflow:hidden;border:1px solid var(--border);}
.ms-line .f{height:100%;background:linear-gradient(90deg,#3FC173,#57D08A);}
/* 里程碑「移除」的两段式确认态:第一击后进入,再击一次才移除,6 秒不操作自动复位 */
.ms-rm-armed{animation:msRmArm 1s ease-in-out infinite}
@keyframes msRmArm{0%,100%{filter:none}50%{filter:brightness(1.32)}}
/* 甘特图 */
.gantt-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:12px;}
.gantt-name{width:170px;flex-shrink:0;text-align:right;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700;}
.gantt-track{flex:1;height:24px;background:var(--panel);border-radius:8px;position:relative;overflow:hidden;border:1px solid var(--border);}
.gantt-line{position:absolute;top:0;bottom:0;width:1px;background:var(--gridline);z-index:1;}
.gantt-bar{position:absolute;top:3px;height:17px;border-radius:6px;background:linear-gradient(90deg,#3FC173,#57D08A);min-width:8px;z-index:2;box-shadow:0 2px 0 rgba(51,65,79,.25);}
.gantt-bar.done{background:linear-gradient(90deg,var(--done1),var(--done2));box-shadow:none;}
.gantt-ms{position:absolute;top:50%;width:7px;height:7px;transform:translate(-50%,-50%) rotate(45deg);background:var(--card);border:2px solid var(--primary-mid);z-index:3;border-radius:1px;cursor:default;}
.gantt-ms.done{background:var(--primary);border-color:var(--primary);}
.gantt-now{position:absolute;top:0;bottom:0;width:2px;background:var(--danger-text);z-index:4;}
.gantt-pct{width:56px;font-size:11px;color:var(--text-2);flex-shrink:0;text-align:right;font-weight:600;}
.gantt-months{display:flex;font-size:10px;color:var(--text-2);margin-left:180px;margin-bottom:4px;}
/* 成果展 */
.shelf-item{
  border:2px solid var(--outline);border-radius:16px;padding:16px;background:var(--shelf-bg);
  position:relative;display:flex;flex-direction:column;box-shadow:var(--shadow);
  transition:transform .18s,box-shadow .18s;
}
.shelf-item:hover{transform:translateY(-4px) rotate(-.4deg);box-shadow:var(--shadow-lift);}
.shelf-band{height:6px;border-radius:6px;margin:-16px -16px 12px;background:linear-gradient(90deg,#9a968a,#c9c5b8);}
.shelf-band.lv-nat{background:linear-gradient(90deg,#E8B028,#F5D78A);}
.shelf-band.lv-prov{background:linear-gradient(90deg,#6B48D8,#A58BE0);}
.shelf-band.lv-city{background:linear-gradient(90deg,#4387D8,#8FB8E8);}
.shelf-band.lv-dist{background:linear-gradient(90deg,#2EAD5C,#7FB89E);}
.shelf-band.lv-school{background:linear-gradient(90deg,#9a968a,#c9c5b8);}
.shelf-item .medal{position:absolute;top:-10px;right:14px;font-size:28px;filter:drop-shadow(0 2px 3px rgba(0,0,0,.18));}
.shelf-name{font-weight:800;font-size:14px;margin-bottom:8px;line-height:1.5;padding-right:26px;}
.shelf-tags{margin-bottom:8px;}
.shelf-date{font-size:12px;color:var(--text-2);}
.shelf-note{font-size:12px;color:var(--text-2);margin-top:6px;line-height:1.6;}
.shelf-ops{margin-top:auto;padding-top:10px;}

.section-note{font-size:12px;color:var(--text-2);background:var(--panel);border-radius:12px;padding:10px 14px;line-height:1.8;margin-bottom:14px;border-left:4px solid var(--primary);}
.list-scroll{max-height:340px;overflow-y:auto;}
/* 全展开:条目多时不让卡片内部出现滚动条,整页往下长(今日总览的课表/待办/活动) */
.list-scroll.full{max-height:none;overflow:visible;}

/* 到期弹窗倒计时条 */
.exp-countdown{
  background:#FDF0E4;color:#8a5a20;border:2px solid #E8C88A;border-radius:10px;
  padding:9px 12px;font-size:13px;text-align:center;line-height:1.9;
}
.exp-countdown b{color:#C85C5C;font-size:17px;font-variant-numeric:tabular-nums;}

/* 顶栏账号到期倒计时小徽章 */
.exp-chip{
  display:inline-block;margin-left:6px;padding:1px 8px;border-radius:20px;
  font-size:10.5px;font-weight:700;background:#E9E9E7;color:#5a5a56;vertical-align:1px;
}
.exp-chip.warn{background:#FDF0E4;color:#B26A00;border:1px solid #E8C88A;}
.exp-chip.danger{background:#F5E6E6;color:#C85C5C;border:1px solid #E3B8B8;}

/* ================= 互动交流 ================= */
.post-composer textarea{min-height:84px;font-size:13.5px;line-height:1.7;}
.post-toolbar{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap;position:relative;}
.post-img-btn label{cursor:pointer;}
.emoji-panel{
  position:absolute;bottom:44px;left:0;z-index:20;display:grid;grid-template-columns:repeat(8,32px);gap:2px;
  background:var(--card);border:2px solid var(--outline);border-radius:14px;padding:8px;
  box-shadow:var(--shadow-lift);animation:pop .15s;
}
.post-toolbar .emoji-panel{bottom:44px;}
.reply-tools{position:relative;display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:4px;}
.reply-tools .emoji-panel{bottom:34px;left:0;grid-template-columns:repeat(7,28px);}
.emoji-panel span{font-size:20px;cursor:pointer;text-align:center;border-radius:8px;line-height:32px;}
.reply-tools .emoji-panel span{line-height:28px;font-size:18px;}
.emoji-panel span:hover{background:var(--panel);}
.post-img-previews{display:inline-flex;gap:6px;flex-wrap:wrap;}
.post-img-previews .pv{position:relative;width:52px;height:52px;border-radius:10px;overflow:hidden;border:2px solid var(--border);flex-shrink:0;}
.post-img-previews .pv img{width:100%;height:100%;object-fit:cover;display:block;}
.post-img-previews .pv button{
  position:absolute;top:0;right:0;border:none;background:rgba(23,30,38,.7);color:#fff;
  font-size:10px;width:16px;height:16px;border-radius:0 0 0 6px;cursor:pointer;line-height:1;
}
.post-card{padding:16px 18px;}
.post-head{display:flex;align-items:center;gap:10px;}
.post-who{flex:1;min-width:0;}
.post-who b{font-size:14px;color:var(--title);}
.post-time{font-size:11.5px;color:var(--text-2);margin-left:8px;font-weight:400;}
.post-avatar,.reply-avatar{
  border-radius:12px;color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--outline);box-shadow:2px 2px 0 rgba(51,65,79,.25);flex-shrink:0;user-select:none;
  overflow:hidden;
}
.post-avatar img,.reply-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;}
.post-avatar{width:38px;height:38px;font-size:16px;}
.reply-avatar{width:28px;height:28px;font-size:13px;border-radius:9px;box-shadow:1.5px 1.5px 0 rgba(51,65,79,.2);}
.post-text{margin:12px 2px 2px;line-height:1.8;white-space:pre-wrap;word-break:break-word;font-size:14px;}
.post-imgs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 2px;}
.post-imgs img{
  max-width:220px;max-height:180px;border-radius:12px;border:2px solid var(--border);
  cursor:zoom-in;background:#fff;transition:.15s;
}
.post-imgs img:hover{transform:scale(1.03);box-shadow:var(--shadow-lift);}
.post-replies{margin-top:12px;border-top:2px dashed var(--line-soft);padding-top:4px;}
.reply-item{display:flex;gap:9px;padding:9px 0;border-bottom:1px dashed var(--line-soft);}
.reply-item:last-of-type{border-bottom:none;}
.reply-main{flex:1;min-width:0;}
.reply-who{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.reply-who b{font-size:13px;color:var(--title);}
.reply-text{font-size:13px;line-height:1.7;margin-top:2px;white-space:pre-wrap;word-break:break-word;}
.reply-composer{display:flex;gap:7px;margin-top:10px;align-items:center;flex-wrap:wrap;}
.reply-input{flex:1;min-width:140px;}
.post-search{flex:1;min-width:180px;max-width:320px;}
.post-files{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:10px 0 2px;}
.post-file{
  display:inline-flex;align-items:center;gap:9px;max-width:100%;padding:8px 12px;
  background:var(--panel);border:2px solid var(--border);border-radius:10px;
  text-decoration:none;color:var(--text);transition:.15s;
}
.post-file:hover{border-color:var(--primary);background:var(--card);transform:translateY(-1px);}
.post-file .f-icon{font-size:17px;flex-shrink:0;}
.post-file .f-name{font-size:13px;font-weight:600;color:var(--title);word-break:break-all;line-height:1.4;}
.post-file .f-size{font-size:11px;color:var(--text-2);flex-shrink:0;}
.post-file .f-dl{font-size:12px;flex-shrink:0;}
.f-pv{
  position:relative;display:inline-flex;align-items:center;gap:6px;max-width:230px;padding:5px 26px 5px 10px;
  background:var(--panel);border:2px solid var(--border);border-radius:10px;font-size:12px;
}
.f-pv .f-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--title);}
.f-pv .f-size{font-size:10.5px;color:var(--text-2);flex-shrink:0;}
.f-pv button{
  position:absolute;top:2px;right:2px;border:none;background:rgba(23,30,38,.7);color:#fff;
  font-size:10px;width:16px;height:16px;border-radius:6px;cursor:pointer;line-height:1;
}

/* ================= 课表内嵌 待办/活动 行(与课程同表显示) ================= */
.sc-dash-row td{background:var(--panel);border-top:3px solid var(--border);}
.sc-dash-cells{display:flex;flex-direction:column;gap:3px;}
.sc-dash-item{font-size:11.5px;color:var(--text);line-height:1.5;white-space:normal;word-break:break-word;}
.sc-dash-item.done{color:#aaa69a;text-decoration:line-through;}

/* ================= 触控与滚动体验(全局) ================= */
*{-webkit-tap-highlight-color:transparent;}
html,body{overscroll-behavior:none;}
.btn,.icon-btn,.nav-item,.tab,.f-opt,.lesson-row,.habit-row,.todo-check,.habit-check,.ls-st,
.ls-ref-btn,.heat-cell[data-heat],.emoji-panel span,.swatch,.game-card,.cls-card,.dday,.prio,
.embed-tab,.class-chip,.scope-pill,.ai-chip,.toast{touch-action:manipulation;}
#topbar{padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right));}
@keyframes sheetUp{from{transform:translateY(48px);opacity:.5;}to{transform:none;opacity:1;}}

/* ================= 移动端适配(≤900px:侧栏抽屉化 + 触控优化) ================= */
@media(max-width:900px){
  /* 抽屉与遮罩:抽屉全屏高度从最顶部滑出,点主区/遮罩/✕ 关闭 */
  #sidebar{position:fixed;left:0;top:0;bottom:0;margin-top:0;z-index:70;width:min(300px,82vw);
    box-shadow:8px 0 28px rgba(0,0,0,.25);background:var(--sidebar-bg);}
  .sb-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;
    height:58px;padding:0 10px 0 14px;border-bottom:1px solid var(--border);}
  .sb-brand{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:800;color:var(--title);}
  .sb-brand .brand-logo{width:32px;height:32px;font-size:17px;border-radius:10px;}
  .sb-head .icon-btn{width:38px;height:38px;font-size:16px;box-shadow:none;border:none;background:transparent;}
  #sidebar.collapsed{width:0;box-shadow:none;}
  body.sb-open::after{content:"";position:fixed;inset:0;background:rgba(23,30,38,.45);
    z-index:60;animation:fadeIn .2s;}
  #main{margin-left:0;}
  #page{padding:12px 12px calc(36px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch;}
  #topbar{padding:0 max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));}
  .topbar-left{min-width:0;gap:8px;}
  .brand-name,.page-crumb,.topbar-center{display:none;}
  .topbar-right{min-width:0;gap:6px;}
  .icon-btn{width:40px;height:40px;font-size:17px;}
  .btn-saved{display:block;padding:7px 10px;font-size:11px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .user-chip{max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  /* 触控目标加大 */
  .btn{padding:11px 16px;font-size:14px;}
  .btn-sm{padding:8px 12px;font-size:13px;border-radius:9px;}
  .nav-item{padding:12px 14px;font-size:15px;border-radius:13px;}
  .nav-item .ico{font-size:18px;}
  .tab{padding:10px 14px 8px;}
  .f-opt,.ai-chip,.scope-pill,.embed-tab,.class-chip{padding:8px 14px;font-size:13px;}
  .del-btn{padding:6px 12px;font-size:12px;}
  .todo-check{width:22px;height:22px;}
  .habit-check{width:24px;height:24px;font-size:14px;}
  .habit-row{padding:12px;}
  .ls-row{padding:12px 6px;}
  /* 子项行内编辑:触控目标加大;编辑框用 16px,避免 iOS 聚焦时把页面整体放大 */
  .sub-btn{padding:5px 7px;font-size:13.5px;}
  .sub-ok,.sub-cancel{font-size:15px;padding:5px 9px;}
  .sub-area{font-size:16px;padding:7px 10px;}
  /* 窄屏:编辑框独占一整行,保存/取消换到下一行并靠右 —— 16px 字体下能多显示一倍字数。
     只把第一个按钮推到右侧,否则两个按钮各吃一份剩余空间、会被拉开一大截 */
  .sub-row.editing .sub-in{flex:1 1 100%;}
  .sub-row.editing .sub-btn:first-of-type{margin-left:auto;}
  /* 窄屏:未备/教案/反思三控件纵向紧凑排列 */
  .ls-ops{display:flex;flex-direction:column;gap:4px;align-items:center;flex-shrink:0;}
  /* 课时号徽章收窄,文字两行竖排 */
  .ls-no{width:36px;text-align:center;line-height:1.35;padding:3px 2px;border-radius:8px;}
  .lesson-row{padding:12px;}
  /* 输入框 16px:避免 iOS 聚焦时页面自动放大 */
  input[type=text],input[type=number],input[type=date],input[type=time],input[type=password],
  select,textarea,.inp,.reply-input{font-size:16px;}
  /* 头图 */
  .banner-panel{padding:16px;padding-bottom:30px;gap:12px;}
  .banner-icon{width:44px;height:44px;font-size:22px;border-radius:13px;}
  .banner-title{font-size:18px;}
  .banner-desc .num{font-size:36px;}
  .banner-week{font-size:11px;padding:4px 10px;right:auto;left:14px;top:auto;bottom:14px;}
  .banner-panel::before{background-size:60px 60px,70px 40px,46px 26px;background-position:92% 12%,70% 20%,40% 8%;}
  .banner-panel::after{height:20px;background-size:96px 20px;}
  .banner-runner{font-size:40px;right:20px;}
  .banner-chips{gap:6px;}
  .card{padding:14px;border-radius:14px;}
  .card-title{font-size:15px;}
  /* 教学计划 */
  .plan-top{padding:12px 14px;gap:10px;}
  /* 窄屏:操作按钮纵向紧凑排列,节省空间 */
  .plan-top .plan-ops{width:100%;margin-left:0;flex-direction:column;align-items:stretch;gap:8px;}
  .plan-top .plan-ops .btn{padding:8px 12px;font-size:13px;text-align:center;}
  .plan-top .stat-block{padding:0 10px;border-left-width:1px;}
  .stat-block{padding:0 10px;}
  .stat-block b{font-size:20px;}
  /* 教科研 */
  .res-hero{padding:16px;gap:12px;}
  .res-hero-ico{width:44px;height:44px;font-size:22px;}
  .res-hero-title{font-size:17px;}
  .res-hero-stats{gap:16px;}
  .res-hero-stats b{font-size:22px;}
  /* 游戏库 */
  .draw-panel{padding:16px 18px;gap:14px;}
  .btn-draw{padding:11px 22px;font-size:14px;}
  .btn-ai-open{padding:10px 18px;font-size:13px;}
  /* 其他 */
  .tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .tab{white-space:nowrap;flex-shrink:0;}
  .gantt-name{width:92px;font-size:11px;}
  .gantt-months{margin-left:102px;}
  .gantt-pct{width:38px;}
  .modal{max-height:92vh;}
  .modal-body{padding:14px 16px;}
  .modal-head{padding:12px 16px;font-size:16px;}
  .login-hero{padding:20px 14px 16px;}
  .login-body{padding:16px 14px 18px;}
  .lesson-time-sm{width:72px;font-size:11px;}
  .heat-grid{gap:3px;}
  .cls-avatar{width:36px;height:36px;font-size:15px;}
  .filter-bar,.res-filterbar{padding:10px 12px;gap:10px;}
  /* 窄屏:每个筛选维度独占一行,组内选项自动换行,防止溢出卡片 */
  .filter-bar .filter-group,.res-filterbar .filter-group{width:100%;}
  .res-search{width:100%;margin-left:0;}
  #gameKw{width:100%!important;margin-left:0;}
  .toolbar{gap:8px;}
  .sidebar-foot{margin-bottom:calc(12px + env(safe-area-inset-bottom));}
  .post-imgs img{max-height:150px;}
}

/* ================= 窄屏(≤760px:弹窗改底部抽屉) ================= */
@media(max-width:760px){
  .card{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  /* 弹窗 = 底部抽屉,从底部滑出 */
  .modal-mask{align-items:flex-end;padding:0;}
  .modal,.modal.wide{
    width:100%;max-width:100%;max-height:90vh;border-radius:22px 22px 0 0;
    border-left:none;border-right:none;border-bottom:none;animation:sheetUp .28s;
  }
  .modal-head{position:sticky;top:0;background:var(--modal-bg);z-index:2;}
  .modal-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom));flex-wrap:wrap;}
  .modal-foot .btn{flex:1 1 auto;justify-content:center;}
  /* 顶部提示改全宽 */
  #toastRoot{left:12px;right:12px;top:64px;}
  .toast{width:100%;box-sizing:border-box;}
  .banner-desc .num{font-size:34px;}
  /* 计划页统计纵排 */
  .plan-top .pt-label{width:100%;}
  .stat-block{border-left:none;padding:0;border-top:1px dashed var(--border);width:100%;}
  .heat-grid{gap:2px;}
  .post-imgs img{max-width:46%;}
  .reply-input{flex:1 1 100%;}
  .draw-card{padding:16px;}
  .form-grid{gap:10px 12px;}
  .swatches{display:flex;flex-wrap:wrap;gap:10px;}
}

/* ================= 全局视觉打磨 ================= */
body{font-variant-numeric:tabular-nums;}
::selection{background:rgba(46,173,92,.25);}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:6px;}
.modal-mask{backdrop-filter:blur(3px);}
.stat-mini{transition:transform .18s,box-shadow .18s;}
@keyframes pageIn{from{opacity:0;transform:translateY(6px) rotate(-.4deg);}to{opacity:1;transform:none;}}
#page>*{animation:pageIn .22s ease both;}
/* 统一滚动条样式 */
#page::-webkit-scrollbar,.modal-body::-webkit-scrollbar,.list-scroll::-webkit-scrollbar,#nav::-webkit-scrollbar{width:9px;height:9px;}
#page::-webkit-scrollbar-track,.modal-body::-webkit-scrollbar-track,.list-scroll::-webkit-scrollbar-track,#nav::-webkit-scrollbar-track{background:transparent;}
#page::-webkit-scrollbar-thumb,.modal-body::-webkit-scrollbar-thumb,.list-scroll::-webkit-scrollbar-thumb,#nav::-webkit-scrollbar-thumb{background:#D9D5C9;border-radius:5px;border:2px solid transparent;background-clip:content-box;}
#page::-webkit-scrollbar-thumb:hover,.modal-body::-webkit-scrollbar-thumb:hover,.list-scroll::-webkit-scrollbar-thumb:hover,#nav::-webkit-scrollbar-thumb:hover{background:#C2BDAD;border:2px solid transparent;background-clip:content-box;}
/* 尊重系统「减少动态效果」设置 */
@media(prefers-reduced-motion:reduce){
  #page>*{animation:none;}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important;}
}

/* ================= 深色模式(app.js 依据设置/系统偏好在 <html> 置 data-theme="dark") ================= */
[data-theme="dark"]{
  color-scheme:dark;
  --primary:#41C37A;
  --primary-dark:#2EAD5C;
  --primary-mid:#57D08A;
  --primary-light:#1E3527;
  /* 深色主题下的斑马纹:绿调的深档/较亮档。深底上不能再"变暗"(卡片已是深色),
     只能把偶数行略微提亮;两档亮度差控制在 0.035 左右 ——
     再小就看不出来,再大夜间会像一块发光条(回归里对亮度差与对比度都有断言) */
  --sub-zebra-a:#1F2A24;--sub-zebra-b:#33473C;
  --mp-shade:0,0,0;         /* 3D 骰子的压暗色:深底上用纯黑 */
  --pink-bg:#33222A;--pink-line:#FF6B93;
  --blue-bg:#1E2A3A;--blue-line:#4DA3FF;
  --orange-bg:#332A1E;--orange-line:#FF9F43;
  --danger-bg:#3A2226;--danger-text:#FF7B7B;
  --btn-gray:#262F3A;
  --bg:#121920;
  --card:#1B242E;
  --border:#2B3743;
  --outline:#46586A;
  --outline-soft:rgba(70,88,106,.35);
  --text:#E8EEF5;
  --text-2:#9AA8B8;
  --title:#D8F0E1;
  --track:#222B34;
  --shadow:0 4px 0 rgba(0,0,0,.35),0 12px 26px rgba(0,0,0,.35);
  --shadow-lift:0 6px 0 rgba(0,0,0,.4),0 16px 34px rgba(0,0,0,.5);
  --panel:#202934;
  --panel-2:#2E2A1D;
  --panel-2-line:#5C5233;
  --line-soft:#232E38;
  --input-bg:#1E2833;
  --sidebar-bg:#151D25;
  --modal-bg:#1B242E;
  --ai-bg:#242B33;--ai-line:#39434F;
  --ok-bg:#1C2E23;--ok-line:#3A5243;--ok-text:#9FD4B6;
  --shelf-bg:linear-gradient(180deg,#1D2731,#1B242E);
  --banner-tint:#20302A;--banner-tint-2:#1B2B22;
  --flag-bg:rgba(0,0,0,.4);--flag-text:#D8C9A0;
  --muted:#4A5158;--muted-warm:#C9955C;
  --gray-text:#A2A79C;
  --check-border:#45505A;
  --gridline:rgba(255,255,255,.08);
  --done1:#4A4F48;--done2:#5C615A;
  --toast-bg:#1E3A2A;
  --empty-hover:#22352B;
  --on-pl:#9FD4B6;
}
/* 深色下的暖橙/蓝系文字提亮 */
[data-theme="dark"] .tag.blue{background:var(--blue-bg);color:#8FB0D8;}
[data-theme="dark"] .tag.orange,[data-theme="dark"] .prio.mid,[data-theme="dark"] .dday,
[data-theme="dark"] .ls-status.prep,[data-theme="dark"] .stat-mini.orange b{color:#D9A05C;}
[data-theme="dark"] .stat-mini.red b{color:var(--danger-text);}
[data-theme="dark"] .btn-gray{color:var(--text);}
[data-theme="dark"] .sidebar-foot b{color:var(--on-pl);}
[data-theme="dark"] .nav-item:hover{color:var(--on-pl);}
[data-theme="dark"] .banner-chip{color:#23402E;}
[data-theme="dark"] .safety-box{color:#D8B98A;}
[data-theme="dark"] #topbar{box-shadow:0 2px 12px rgba(0,0,0,.3);}
[data-theme="dark"] .sc-cell.filled{box-shadow:0 3px 0 rgba(0,0,0,.4);}
[data-theme="dark"] .btn-outline,.btn-gray,.btn-ghost{box-shadow:0 3px 0 rgba(0,0,0,.4);}
[data-theme="dark"] .pe-tag{background:var(--card);color:var(--primary-mid);}
/* 深色下横幅贴纸用深字,保证可读 */
[data-theme="dark"] .banner-chip{color:var(--primary-dark);}
[data-theme="dark"] .banner-week{color:var(--primary-dark);}
[data-theme="dark"] .sidebar-foot{background:var(--card);}
[data-theme="dark"] .sidebar-foot::before{border-top-color:var(--card);}
/* 滚动条深色 */
[data-theme="dark"] #page::-webkit-scrollbar-thumb,
[data-theme="dark"] .modal-body::-webkit-scrollbar-thumb,
[data-theme="dark"] .list-scroll::-webkit-scrollbar-thumb,
[data-theme="dark"] #nav::-webkit-scrollbar-thumb{background:#3A3F38;border:2px solid transparent;background-clip:content-box;}
[data-theme="dark"] #page::-webkit-scrollbar-thumb:hover,
[data-theme="dark"] .modal-body::-webkit-scrollbar-thumb:hover,
[data-theme="dark"] .list-scroll::-webkit-scrollbar-thumb:hover,
[data-theme="dark"] #nav::-webkit-scrollbar-thumb:hover{background:#4A5048;border:2px solid transparent;background-clip:content-box;}

/* =====================================================================
   资源 · 运动抽奖(js/views/lottery.js · js/lottery/core.js)
   布局:标题条 / 结果大屏(抽奖动画) / 操作条 / 项目清单 / 抽奖记录
   视觉:沿用全站"粗描边 + 贴纸硬投影 + 圆角卡片",不引入新的视觉体系
   动画时长的唯一来源是 LOT.ANIM:JS 把它注入 --lot-roll-ms / --lot-settle-ms,
   这里只消费变量 —— 两边各写一份数字就会出现"名字停了、高亮还在动"
   ===================================================================== */
/* 标题条:体育场「计分屏」—— 墨绿深底 + 网点 + 顶部彩虹能量条,赛事转播质感 */
.lot-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(rgba(255,255,255,.09) 1.2px,transparent 1.4px) 0 0/18px 18px,
    linear-gradient(120deg,#1F3A2C,#23402E 55%,#1E3A4A);
  border:3px solid var(--outline);border-radius:var(--radius);
  padding:16px 20px;font-size:20px;font-weight:900;color:#FFF6E7;
  box-shadow:var(--shadow);display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  letter-spacing:1px;
}
.lot-hero::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--strip-rainbow);}
.lot-hero .lot-tt{display:inline-flex;align-items:center;gap:6px;}
.lot-hero .lot-sub{color:rgba(255,246,231,.72);}
.lot-hero .btn-outline{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.38);color:#FFF6E7;}
.lot-hero .btn-outline:hover{border-color:#FFD93D;}
[data-theme="dark"] .lot-hero{background:
  radial-gradient(rgba(255,255,255,.07) 1.2px,transparent 1.4px) 0 0/18px 18px,
  linear-gradient(120deg,#15251C,#182B22 55%,#152733);}

/* 结果大屏:聚光舞台 —— 金色光晕 + 左右两道舞台灯,项目图标放在「金牌」里 */
.lot-stage{
  margin-top:14px;padding:36px 18px 30px;text-align:center;position:relative;overflow:hidden;
  background:
    radial-gradient(150px 150px at 50% 30%,rgba(255,217,61,.22),rgba(255,217,61,0) 72%),
    var(--card);
  border:3px solid var(--outline);border-radius:20px;
  box-shadow:var(--shadow);
}
/* 舞台灯:左右两道斜光,抽奖中来回扫 */
.lot-spot{position:absolute;inset:0;pointer-events:none;opacity:.55;
  background:
    conic-gradient(from 200deg at 18% -12%,rgba(255,217,61,.20),transparent 24%),
    conic-gradient(from 340deg at 82% -12%,rgba(61,155,255,.16),transparent 24%);}
.lot-stage.rolling .lot-spot{animation:lotSweep .9s ease-in-out infinite alternate;opacity:.9}
@keyframes lotSweep{from{transform:translateX(-3.5%)}to{transform:translateX(3.5%)}}
/* 金牌底座:金色圆盘 + 虚线内环,emoji 居中 */
.lot-medal{position:relative;width:116px;height:116px;margin:0 auto;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 32% 26%,#FFF9DB,#FFD93D 60%,#E8B028);
  border:3px solid var(--outline);
  box-shadow:0 6px 0 rgba(51,65,79,.18),inset 0 3px 0 rgba(255,255,255,.7);}
.lot-medal::before{content:'';position:absolute;inset:8px;border-radius:50%;
  border:2px dashed rgba(51,65,79,.32);}
.lot-emoji{font-size:56px;line-height:1;}
.lot-stage.rolling .lot-medal{animation:lotMedalShake .34s ease-in-out infinite}
@keyframes lotMedalShake{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.lot-name-big{
  font-size:34px;font-weight:900;color:var(--title);margin-top:14px;line-height:1.2;
  word-break:break-word;letter-spacing:1px;
}
.lot-meta{display:inline-block;font-size:12.5px;color:var(--text-2);margin-top:12px;
  background:var(--panel);border:2px solid var(--border);border-radius:999px;padding:4px 16px;}
/* 抽奖中:整体呼吸 + 轻微放大,给"正在随机"的反馈 */
.lot-stage.rolling{
  animation:lotPulse var(--lot-roll-ms,1600ms) ease-in-out infinite;
  border-color:var(--primary);
}
@keyframes lotPulse{
  0%,100%{box-shadow:var(--shadow);transform:scale(1);}
  50%{box-shadow:0 0 0 6px var(--primary-light),var(--shadow);transform:scale(1.012);}
}
/* 定格:一次性弹一下,时长同样来自 LOT.ANIM */
.lot-stage.pop{animation:lotPop var(--lot-settle-ms,420ms) cubic-bezier(.2,1.4,.4,1) 1;}
@keyframes lotPop{
  0%{transform:scale(.9);opacity:.6;}
  60%{transform:scale(1.06);}
  100%{transform:scale(1);opacity:1;}
}
/* 主视图:抽奖按钮居中,下方一行汇总提示(设置项都在弹窗里,本屏不出现任何可编辑项) */
.lot-go-wrap{display:flex;flex-direction:column;align-items:center;gap:10px;margin-top:20px;}
/* 大按钮:发令枪似的胶囊大按钮,一道高光从左到右扫过(仪式感) */
.lot-go{font-size:19px;font-weight:900;padding:16px 46px;border-radius:999px;letter-spacing:3px;
  position:relative;overflow:hidden;
  box-shadow:0 6px 0 rgba(20,80,45,.55),0 14px 26px rgba(51,65,79,.22);}
.lot-go::after{content:'';position:absolute;top:0;bottom:0;left:-70%;width:42%;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  animation:lotShine 2.8s ease-in-out infinite;}
@keyframes lotShine{0%{left:-70%}55%,100%{left:135%}}
.lot-go:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 8px 0 rgba(20,80,45,.55),0 16px 30px rgba(51,65,79,.26);}
.lot-go:not(:disabled):active{transform:translateY(2px);box-shadow:0 2px 0 rgba(20,80,45,.55);}
.lot-tip{font-size:12.5px;color:var(--text-2);text-align:center;}
/* 标题条右侧的设置入口 */
.lot-cfg-btn{margin-left:auto;flex-shrink:0;}
/* 设置弹窗顶部:统计 + 批量操作 */
.lot-cfg-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
/* 清单区自己滚动:项目多时"新增项目"与预设条始终留在可视区内,不必先滚到底 */
#lotCfgBody{max-height:44vh;overflow:auto;}
.lot-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px;}
.lot-head-ops{display:flex;gap:8px;flex-wrap:wrap;}
.lot-sub{font-size:12px;color:var(--text-2);font-weight:400;}
/* 清单表格:输入框直接改名称/概率,列宽固定住,免得边打字边抖 */
.lot-tbl input{font-size:13px;}
.lot-tbl .lot-in-emoji{width:42px;text-align:center;font-size:16px;padding:4px 2px;}
.lot-tbl .lot-in-name{width:100%;min-width:90px;max-width:240px;padding:4px 8px;}
.lot-tbl .lot-in-p{width:74px;padding:4px 6px;text-align:center;}
.lot-tbl tr.off{opacity:.5;}
.lot-sumrow td{background:var(--panel);font-size:12.5px;}
.lot-add{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;}
.lot-add .lot-emoji{width:52px;text-align:center;}
.lot-add .lot-name{width:180px;}
.lot-add .lot-prob{width:96px;}
.lot-presets{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;}
.lot-chip{
  font-family:inherit;font-size:12.5px;color:var(--text);cursor:pointer;
  background:var(--input-bg);border:1.5px solid var(--border);border-radius:999px;
  padding:4px 12px;transition:.12s;touch-action:manipulation;
}
.lot-chip:hover{border-color:var(--primary);color:var(--primary);background:var(--primary-light);}
/* 抽奖记录:票根式小卡,最新一条高亮 */
.lot-his{display:flex;flex-wrap:wrap;gap:8px;}
.lot-his-item{
  font-size:12.5px;background:var(--card);border:2px dashed var(--outline-soft);
  border-radius:12px;padding:5px 12px;color:var(--text);
}
.lot-his-item:first-child{border-style:solid;border-color:var(--primary);background:var(--primary-light);}
.lot-his-item i{font-style:normal;color:var(--text-2);margin-left:6px;font-size:11px;}
@media(max-width:760px){
  .lot-name-big{font-size:25px;}
  .lot-medal{width:96px;height:96px;}
  .lot-emoji{font-size:46px;}
  .lot-go{font-size:17px;padding:14px 34px;letter-spacing:2px;}
  .lot-add .lot-name{width:100%;}
}
/* 尊重系统「减少动态效果」:抽奖靠 LOT.ANIM 的降级分支直接跳结果,这里再兜一层 */
@media(prefers-reduced-motion:reduce){
  .lot-stage.rolling,.lot-stage.pop{animation:none;}
  .lot-stage.rolling .lot-spot,.lot-stage.rolling .lot-medal,.lot-go::after{animation:none;}
}

/* =====================================================================
   工具栏 · 画图(js/views/draw.js · drlib.js · drawing.js)
   布局:页签行(两个页签 + 右端"当前图稿 / 新建") · 顶部工具条两行(第一行 工具+画笔参数+视图控件
        · 第二行 选中元素属性) · 左侧素材面板 + 中间画布 · 底部状态条(提示 + 元素计数)
   视觉:沿用全站"粗描边 + 贴纸硬投影 + 圆角卡片",不引入新的视觉体系
   ===================================================================== */
.dr-top{
  display:flex;flex-direction:column;gap:9px;
  background:var(--card);border:2px solid var(--outline);border-radius:14px;
  box-shadow:var(--shadow);padding:10px 14px;margin-bottom:12px;
}
/* 工具栏两行:
   第一行 = 绘图工具 + 画笔参数(颜色 / 线宽 / 线型)+ 右端的视图控件(撤销…清空画布)
   第二行 = 选中元素的属性行(.dr-props)
   #drBrush 用 display:contents,让参数组的子项直接参与这一行排布,
   选中元素时整组被重建也不影响行结构 */
.dr-row{display:flex;gap:9px;align-items:center;flex-wrap:wrap;}
#drBrush{display:contents;}
/* 一组"标签 + 控件":整体参与折行,不会把标签和色板拆到两行 */
.dr-fld{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;}
.dr-grp{display:inline-flex;gap:6px;align-items:center;}
#drBrush .dr-w{width:26px;height:26px;}
.dr-sel{
  border:2px solid var(--outline);border-radius:10px;padding:6px 10px;font-size:13px;
  font-family:inherit;background:var(--input-bg);color:var(--text);max-width:190px;
}
/* 分段控件:绘图工具 */
.dr-seg{
  display:inline-flex;gap:3px;padding:3px;border:2px solid var(--outline);
  border-radius:13px;background:var(--panel);flex-wrap:wrap;
}
.dr-tool{
  width:38px;height:34px;display:flex;align-items:center;justify-content:center;
  border-radius:9px;font-size:17px;color:var(--text-2);cursor:pointer;
  transition:.12s;user-select:none;touch-action:manipulation;
}
.dr-tool:hover{background:var(--card);color:var(--primary);}
.dr-tool.on{
  background:linear-gradient(180deg,#3FC173,#2EAD5C);color:#fff;
  box-shadow:2px 2px 0 rgba(51,65,79,.22);
}
/* 线型选择器(实线 / 虚线 / 箭头 / 虚线箭头):每个按钮里直接画出该线型的样子,
   比"实线/虚线"四个字直观得多,尤其"虚线+箭头"这种组合。
   同一套样式在工具条(选工具后的线型)与属性条(改选中元素)里复用 */
.dr-lt-seg{
  display:inline-flex;gap:3px;padding:3px;border:2px solid var(--outline);
  border-radius:13px;background:var(--panel);align-items:center;
}
.dr-lt{
  width:46px;height:34px;display:flex;align-items:center;justify-content:center;
  border-radius:9px;cursor:pointer;color:var(--text-2);transition:.12s;
  border:2px solid transparent;user-select:none;touch-action:manipulation;
}
.dr-lt:hover{background:var(--card);color:var(--primary);}
.dr-lt.on{background:var(--primary-light);border-color:var(--primary);color:var(--on-pl);}
.dr-lt-svg{width:38px;height:15px;display:block;overflow:visible;}
/* 页签行右侧:当前图稿下拉 + 新建(由画板页填进 #drTabScene 空槽) */
.dr-scene{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto;}
/* 视图控件组:在工具栏第一行的右端(工具与画笔参数靠左,它靠右,窄屏各自折行) */
.dr-acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto;}
.dr-acts .btn:disabled{opacity:.45;cursor:not-allowed;}
/* 全屏是"开着/关着"的态,用实心高亮表示开着 */
.dr-acts .btn.on{
  background:var(--primary-light);border-color:var(--primary);color:var(--on-pl);
  font-weight:800;box-shadow:2px 2px 0 rgba(51,65,79,.18);
}

/* ---- 中部:素材面板 + 画布 ---- */
.dr-mid{display:flex;gap:12px;align-items:stretch;min-height:0;}
.dr-palette{
  width:286px;flex-shrink:0;display:flex;flex-direction:column;gap:8px;
  background:var(--card);border:2px solid var(--outline);border-radius:16px;
  box-shadow:var(--shadow);padding:10px;max-height:calc(100vh - 300px);
}
.dr-cats{display:flex;gap:5px;flex-wrap:wrap;}
.dr-cat{
  font-size:12px;padding:5px 10px;border-radius:20px;cursor:pointer;font-weight:600;
  background:var(--btn-gray);color:var(--gray-text);border:2px solid transparent;
  transition:.12s;user-select:none;
}
.dr-cat:hover{color:var(--primary);}
.dr-cat.on{
  background:var(--panel-2);border-color:var(--outline);color:var(--title);font-weight:800;
  box-shadow:2px 2px 0 rgba(51,65,79,.18);
}
.dr-search{
  width:100%!important;margin:0!important;border:2px solid var(--border);border-radius:10px;
  padding:7px 10px;font-size:12.5px;background:var(--input-bg);color:var(--text);font-family:inherit;
}
.dr-tiles{
  display:grid;grid-template-columns:repeat(3,1fr);gap:7px;overflow-y:auto;
  padding:2px;flex:1;min-height:80px;
}
.dr-tile{
  display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;
  background:var(--input-bg);border:2px solid var(--border);border-radius:12px;
  padding:6px 3px 4px;transition:.12s;font-family:inherit;color:var(--text);
  touch-action:manipulation;
}
.dr-tile:hover{transform:translateY(-2px);border-color:var(--primary);box-shadow:0 3px 0 var(--outline-soft);}
.dr-tile.on{border-color:var(--primary);background:var(--primary-light);}
.dr-th-svg{width:100%;height:auto;max-height:50px;display:block;}
.dr-th-emoji{font-size:25px;line-height:50px;height:50px;}
.dr-tile-n{font-size:10.5px;color:var(--text-2);line-height:1.2;text-align:center;}

.dr-stage{
  flex:1;min-width:0;overflow:auto;background:var(--panel);
  border:2px solid var(--outline);border-radius:16px;box-shadow:var(--shadow);
  padding:12px;max-height:calc(100vh - 300px);
  touch-action:pan-x pan-y;   /* 留白区只允许原生滚动;双指交给 JS 捏合缩放(画布 SVG 本身是 none) */
}
.dr-canvas{
  margin:0 auto;aspect-ratio:1600/1000;background:#fff;border-radius:8px;
  box-shadow:0 2px 12px rgba(51,65,79,.14);overflow:hidden;
}
.dr-svg{display:block;width:100%;height:100%;touch-action:none;user-select:none;}
.dr-emoji{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;}
.dr-tx{font-family:inherit;}
/* 画布是"纸":深浅色模式下都保持白纸深线 —— 这样"看到什么就打印出什么"。
   在画布层重定义这几个变量,就不用给每个 SVG 内部元素再写一遍深色适配 */
[data-theme="dark"] .dr-canvas{
  --outline:#33414F;--outline-soft:rgba(51,65,79,.16);--gridline:rgba(51,65,79,.08);
  --primary:#2EAD5C;--sky:#3D9BFF;--sun:#FFD93D;--coral:#FF6B6B;--grape:#9B5DE5;
  --accent:#FF9F43;--danger-text:#E5484D;--text:#2E3440;--text-2:#626D7E;
}

/* ---- 属性行(工具栏第二行):选中元素才有的字号 / 填充 / 层级 / 复制 / 删除
       平铺在工具条里,不再是一张单独的卡片 */
.dr-props{display:flex;gap:9px;align-items:center;flex-wrap:wrap;min-height:38px;}
.dr-pl{font-size:12px;color:var(--text-2);font-weight:700;flex-shrink:0;}
.dr-none{font-size:12px;color:var(--text-2);}
.dr-sw{
  width:22px;height:22px;border-radius:50%;cursor:pointer;display:inline-block;
  border:2px solid rgba(51,65,79,.25);transition:.12s;position:relative;
}
.dr-sw:hover{transform:scale(1.16) rotate(6deg);}
.dr-sw.on{border-color:#fff;box-shadow:0 0 0 2px var(--outline);}
.dr-w{
  width:24px;height:24px;border-radius:7px;cursor:pointer;display:inline-flex;
  align-items:center;justify-content:center;border:2px solid var(--border);background:var(--input-bg);
}
.dr-w i{display:block;width:14px;border-radius:3px;background:var(--text-2);}
.dr-w.on{border-color:var(--primary);background:var(--primary-light);}
.dr-w.on i{background:var(--primary);}
.dr-tg{
  font-size:12px;padding:4px 10px;border-radius:20px;cursor:pointer;font-weight:600;
  border:2px solid var(--border);background:var(--input-bg);color:var(--text-2);user-select:none;
}
.dr-tg.on{background:var(--primary-light);border-color:var(--primary);color:var(--on-pl);font-weight:800;}
.dr-range{width:120px;accent-color:var(--primary);}
.dr-pops{display:flex;gap:6px;margin-left:auto;flex-wrap:wrap;}

/* ---- 底部状态条:绘图提示 + 元素计数(缩放 / 全屏 / 清空都在页签行那一侧) ---- */
.dr-bar{
  display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px;
  font-size:12px;color:var(--text-2);
}
/* 工具栏第二行里的视图控件:缩放 −/%/＋ 与"适应窗口"抱团,左边一条竖线把它和撤销/吸附分开 */
.dr-view{
  display:inline-flex;gap:6px;align-items:center;
  padding-left:10px;border-left:2px solid var(--outline-soft);
}
.dr-view b{min-width:44px;text-align:center;color:var(--text);font-size:12px;}
.dr-zbtn{
  width:28px;height:28px;border-radius:9px;border:2px solid var(--outline);cursor:pointer;
  background:var(--input-bg);color:var(--text);font-size:14px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;font-family:inherit;
}
.dr-zbtn:hover{border-color:var(--primary);color:var(--primary);}
.dr-hint{margin-left:4px;}
.dr-count{margin-left:auto;}
.dr-count.warn{color:#B26A00;font-weight:800;}

/* ---- 画布全屏 ----
   用 position:fixed 覆盖层(而非 requestFullscreen):原生全屏只渲染全屏元素,
   #modalRoot / #toastRoot 在它之外,全屏里点「文字标注」会看不见弹窗、也收不到提示。
   z-index 80:压住顶栏(50)与侧栏,又低于 .modal-mask(100)和 #toastRoot(200)。 */
body.dr-fs-lock{overflow:hidden;}
/* ⚠ 全屏能铺满的关键前提:#drTabBody 是 #page 的直接子元素,带着
   「#page>*{animation:pageIn .22s ease both}」。animation-fill-mode:both 会让
   动画结束后 transform 仍被"填充"成 matrix(1,0,0,1,0,0)(≠ none),
   于是它成了 position:fixed 的包含块 —— 覆盖层会被压缩在内容区里、铺不满屏。
   所以全屏期间必须把这一层动画摘掉,transform 才会真正回到 none。 */
body.dr-fs-lock #page>*{animation:none;}
body.dr-fs-lock #page{overflow:visible;}
.dr-wrap.dr-fs{
  position:fixed;inset:0;z-index:80;
  display:flex;flex-direction:column;
  background:var(--bg);padding:12px;overflow:hidden;
}
.dr-fs .dr-top{flex-shrink:0;margin-bottom:10px;}
.dr-fs .dr-mid{flex:1;min-height:0;}          /* 关键:让这一行吃掉剩余高度 */
.dr-fs .dr-palette,.dr-fs .dr-stage{max-height:none;}
.dr-fs .dr-bar{flex-shrink:0;margin-top:10px;}
/* 全屏时素材区在窄屏上不再压缩,给磁贴更多行 */
@media(max-width:900px){
  .dr-fs .dr-mid{flex-direction:row;}
  .dr-fs .dr-palette{width:210px;max-height:none;}
  .dr-fs .dr-tiles{grid-template-columns:repeat(3,1fr);max-height:none;}
}
@media(max-width:760px){
  .dr-wrap.dr-fs{padding:6px;gap:0;}
  /* 手机竖屏太矮:工具条与素材区都限高可滚,把高度让给画布。
     工具条第二行的属性行(字号/填充/图层/删除)在触屏全屏里基本用不到 ——
     颜色·线宽·线型已经在第一行里,这里把第二行隐藏,免得它压在画布上。 */
  .dr-fs .dr-top{max-height:30vh;overflow-y:auto;margin-bottom:6px;}
  .dr-fs .dr-mid{flex-direction:column;}      /* 手机上素材区仍在画布上方,可纵向滚 */
  .dr-fs .dr-palette{width:100%;flex-shrink:0;max-height:26vh;padding:8px;}
  .dr-fs .dr-tiles{max-height:12vh;}
  .dr-fs .dr-stage{flex:1 1 auto;min-height:40vh;padding:6px;}
  .dr-fs .dr-props{display:none;}
  .dr-fs .dr-bar{gap:8px;margin-top:6px;}
  .dr-fs .dr-hint{display:none;}               /* 提示语在窄屏一行放不下,让位给元素计数 */
}

/* ---- 我的图稿(图库) ---- */
.dr-hero>.right{margin-left:auto;display:flex;gap:8px;align-items:center;}
.dr-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;}
.dr-card{
  background:var(--card);border:2px solid var(--outline);border-radius:16px;
  box-shadow:var(--shadow);padding:10px;display:flex;flex-direction:column;gap:9px;
  transition:.14s;
}
.dr-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lift);}
.dr-card-th{
  aspect-ratio:1600/1000;background:#fff;border:2px solid var(--border);border-radius:11px;
  overflow:hidden;
}
.dr-card-th svg{display:block;width:100%;height:100%;}
.dr-card-b{display:flex;flex-direction:column;gap:5px;}
.dr-card-n{font-size:14px;font-weight:800;color:var(--title);cursor:pointer;word-break:break-all;}
.dr-card-n:hover{color:var(--primary);}
.dr-card-m{font-size:11.5px;color:var(--text-2);}
.dr-card-a{display:flex;gap:6px;flex-wrap:wrap;}
[data-theme="dark"] .dr-card-th{background:#EEF2F6;color:#222;}
.dr-rename{
  width:100%;border:2px solid var(--primary);border-radius:9px;padding:5px 8px;
  font-size:14px;font-weight:800;font-family:inherit;background:var(--input-bg);color:var(--text);outline:none;
}

/* ---- 窄屏:素材面板转为可横向滚动的一栏,画布占满 ---- */
@media(max-width:900px){
  .dr-mid{flex-direction:column;}
  .dr-palette{width:100%;max-height:none;}
  .dr-tiles{grid-template-columns:repeat(5,1fr);max-height:200px;}
  .dr-stage{max-height:none;}
  .dr-acts{margin-left:0;width:100%;}
}
@media(max-width:760px){
  .dr-top{gap:8px;padding:9px 10px;}
  .dr-sel{max-width:130px;font-size:12px;}
  .dr-tool{width:34px;height:31px;font-size:15px;}
  .dr-lt{width:40px;height:31px;}
  .dr-lt-svg{width:32px;}
  .dr-tiles{grid-template-columns:repeat(4,1fr);gap:6px;}
  .dr-th-svg{max-height:42px;}
  .dr-th-emoji{font-size:21px;line-height:42px;height:42px;}
  .dr-props{gap:7px;}
  .dr-view{gap:5px;padding-left:8px;}
  .dr-view b{min-width:38px;font-size:11.5px;}
  .dr-grp{gap:5px;}
  #drBrush .dr-sw{width:24px;height:24px;}   /* 触屏上色块略放大,好点中 */
  .dr-pops{margin-left:0;width:100%;}
  .dr-range{width:100%;}
  .dr-cards{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;}
  .dr-card-a .btn{font-size:11.5px;padding:6px 10px;}
}

/* ================= 打印样式(课表/教学计划打印) ================= */
@media print{
  body{background:#fff;color:#000;}
  /* .ft-tabbar 与全部画图控件都要隐藏 —— 只留画布内容 */
  #sidebar,#topbar,#toastRoot,#modalRoot,.toolbar,.tabs,.res-filterbar,.filter-bar,
  .res-hero,.draw-panel,.banner-panel,.plan-top,.section-note,.hint-bar,.unit-ops,
  .del-btn,.btn,.ls-ref-btn,.week-nav,
  .ft-tabbar,.dr-top,.dr-palette,.dr-props,.dr-bar,.dr-cards,.dr-hint{display:none!important;}
  .dr-mid{display:block;}
  .dr-stage{border:none!important;box-shadow:none!important;background:#fff!important;padding:0!important;max-height:none!important;overflow:visible!important;}
  .dr-canvas{width:100%!important;box-shadow:none!important;border-radius:0!important;}
  [data-theme="dark"] .dr-canvas{
    --outline:#33414F;--outline-soft:rgba(51,65,79,.16);--gridline:rgba(51,65,79,.08);
    --primary:#2EAD5C;--sky:#3D9BFF;--sun:#FFD93D;--coral:#FF6B6B;--grape:#9B5DE5;
    --accent:#FF9F43;--danger-text:#E5484D;--text:#2E3440;--text-2:#626D7E;
  }
  #app{display:block;height:auto;overflow:visible;}
  #main{margin-top:0;}
  #page{padding:0;overflow:visible;height:auto;}
  .card,.unit-block{box-shadow:none;border:none;padding:0 0 12px;background:#fff;}
  .list-scroll{max-height:none!important;overflow:visible!important;}
  .unit-block{page-break-inside:avoid;}
  .sc-table,.tbl,.lesson-row,.heat-grid{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .sc-table td{border:1px solid #ddd;}
}

/* ================= 体测模块(体质测试一体化) ================= */
.ft-tabbar{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;
  background:var(--card);border:2px solid var(--outline);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:10px 12px;margin-bottom:14px;
}
.ft-tabbar .ftab{font-size:13.5px;padding:6px 14px;}
.ft-hero{
  background:linear-gradient(120deg,#EAF6EF,#D8EEDF 60%,#E1F0FF);
  border:2px solid var(--outline-soft);border-radius:var(--radius);
  padding:14px 18px;font-size:18px;font-weight:800;color:var(--title);
  box-shadow:var(--shadow);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
}
.ft-hero-sub{font-size:12px;font-weight:400;color:var(--text-2)}
.ft-scope{
  display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap;
  background:var(--card);border:1.5px solid var(--border);border-radius:12px;padding:8px 12px;
}
.ft-scope label{font-size:13px;color:var(--text-2)}
.ft-scope select{min-width:130px}
.ft-table{width:100%;border-collapse:collapse;font-size:13px}
.ft-table th{
  background:var(--panel);color:var(--text-2);font-weight:700;padding:7px 8px;text-align:left;
  border-bottom:2px solid var(--border);white-space:nowrap;font-size:12.5px;
}
.ft-table th .th-sub{font-weight:400;font-size:10.5px;color:var(--muted-warm)}
.ft-table td{padding:6px 8px;border-bottom:1px solid var(--line-soft);vertical-align:middle;white-space:nowrap}
.ft-table tbody tr:hover{background:var(--empty-hover)}
.ft-idx{color:var(--text-2);font-size:12px;width:34px}
.ft-no{font-family:ui-monospace,Consolas,monospace;color:var(--text-2);font-size:12px}
.ft-name{min-width:64px}
.ft-entry .ft-in{
  width:78px;padding:4px 6px;font-size:13px;text-align:center;
  border:1.5px solid var(--border);border-radius:8px;background:var(--input-bg);color:var(--text);
}
.ft-entry .ft-in:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}
.ft-entry .ft-in:disabled{background:var(--track);color:var(--muted)}
.ft-entry td{padding:4px 5px}
/* 单项等级徽标:紧跟在录入框右侧同行显示;录入框相应收窄 */
.ft-entry td.fe-cell{white-space:nowrap}
.ft-entry td.fe-cell .ft-in{width:58px}
.fe-lv{
  display:inline-block;vertical-align:middle;line-height:15px;
  margin-left:3px;font-size:11px;font-weight:800;text-align:center;letter-spacing:1px;
}
.fe-lv:empty{display:none}
.fe-lv-no{letter-spacing:0}
.ft-bonus{color:var(--muted-warm);font-size:11px;margin-left:2px;font-weight:700}
.ft-exempt{display:flex;align-items:center;gap:3px;font-size:12px;color:var(--text-2);cursor:pointer;white-space:nowrap}
.ft-cond .form-row{flex-wrap:wrap}
.ft-chk-group{display:flex;gap:10px;flex-wrap:wrap}
.ft-chk{display:inline-flex;align-items:center;gap:4px;font-size:13px;color:var(--text);cursor:pointer}
.ft-cls-chip{
  display:inline-flex;align-items:center;gap:4px;background:var(--panel);border:1.5px solid var(--border);
  border-radius:999px;padding:3px 6px 3px 10px;font-size:12.5px;
}
.ft-chip-x{
  border:none;background:transparent;color:var(--text-2);cursor:pointer;font-size:14px;line-height:1;
  padding:0 4px;border-radius:50%;
}
.ft-chip-x:hover{color:var(--danger-text)}
.ft-batch-row{
  display:flex;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px solid var(--line-soft);
}
.ft-warn{background:var(--danger-bg);color:#8a3a3a;border-radius:10px;padding:10px 12px;font-size:12.5px;margin-bottom:10px;line-height:1.7}
.ft-ok{background:var(--ok-bg);color:var(--ok-text);border-radius:10px;padding:10px 12px;font-size:13px;margin-bottom:10px;line-height:1.8}
.ft-search-cards{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;padding:10px}
.ft-hit{cursor:pointer;padding:6px 10px;border:1.5px solid var(--border);border-radius:10px;background:var(--panel)}
.ft-hit:hover{border-color:var(--primary);background:var(--empty-hover)}
.ft-chart{width:100%}
.ft-chart-title{text-align:center;font-size:12px;color:var(--text-2);margin-top:2px}
/* 追踪对比:左列表 + 右详情(复刻原系统布局) */
.ft-cols{display:grid;grid-template-columns:1fr 2.1fr;gap:14px;align-items:start}
.ft-cols>*,.ft-chart-grid>*{min-width:0}
@media(max-width:1000px){.ft-cols{grid-template-columns:1fr}}
.ft-list-wrap{padding:12px 10px}
.ft-list-scroll{max-height:600px;overflow:auto}
.ft-list-scroll .ft-table{min-width:430px}
.ft-pointer tbody tr{cursor:pointer}
.ft-pointer tbody tr:hover{background:var(--empty-hover)}
.ft-pointer tbody tr.cur,.ft-pointer tbody tr.cur:hover{background:var(--panel-2)}
.ft-lv-solid{
  display:inline-block;color:#fff;border-radius:5px;padding:1.5px 8px;
  font-size:11px;font-weight:700;line-height:1.5;vertical-align:middle;
}
.ft-score-tag{
  display:inline-block;border:1px solid;border-radius:5px;padding:0 6px;
  font-size:11px;font-weight:700;line-height:1.6;vertical-align:middle;margin-left:3px;
}
.ft-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
@media(max-width:1000px){.ft-chart-grid{grid-template-columns:1fr}}
.advice{border:1.5px solid var(--border);border-radius:12px;padding:12px 16px;margin:10px 0;background:var(--card)}
.advice-item{margin:10px 0;padding:10px 12px;background:var(--panel);border-radius:10px}
.advice-title{font-weight:700;color:var(--title);margin-bottom:5px;font-size:13.5px}
.advice-line{font-size:13px;line-height:1.8;color:var(--text)}
.advice-line ul{margin:2px 0 2px 18px}
[data-theme="dark"] .ft-hero{background:linear-gradient(120deg,#22352A,#24343F);color:#cfe8d8}
[data-theme="dark"] .ft-warn{color:#e8b9b9}
/* ============ 体测 · 家长查询:列表折叠条 ============
   学生清单与访问日志都默认"收起"(只列开放查询的学生 / 最近 10 条),
   这条控制栏是两处共用的:固定在表格正上方、按钮与文案口径一致,
   在一处学会的交互到另一处同样成立 */
.fq-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  padding:8px 10px;margin-bottom:8px;
  background:var(--panel);border:1.5px dashed var(--border);border-radius:10px;
}
.fq-bar-ops{display:flex;gap:6px;flex-wrap:wrap;}
/* 不可用的按钮置灰而非隐藏:位置固定,用户不必到处找"展开/收起去哪了"
   (与画图模块 .dr-acts 的禁用样式一致) */
.fq-bar .btn:disabled{opacity:.45;cursor:not-allowed;}
/* ============ 外出培训教研记录 ============ */
.train-list{display:flex;flex-direction:column;gap:12px}
.train-card{padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.train-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.train-title{font-size:15px;color:var(--text)}
.train-date{margin-left:auto;font-size:12px;color:var(--text-2);white-space:nowrap}
.train-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--text-2)}
.train-detail{font-size:13px;color:var(--text);line-height:1.7;white-space:pre-wrap;background:var(--panel);border-radius:8px;padding:8px 10px}
.train-thumbs{display:flex;gap:8px;flex-wrap:wrap}
.train-thumbs img{width:96px;height:72px;object-fit:cover;border-radius:8px;cursor:pointer;border:1px solid var(--border)}
.train-ops{display:flex;align-items:center;gap:8px;margin-top:2px}
@media(max-width:640px){.train-date{margin-left:0}.train-thumbs img{width:80px;height:60px}}

/* ============================================================================
   体育大单元教案库 · 新增样式(追加段,不改动既有规则)
   三层 Modal 链:教案库 → 课时选择 → 完整详案
   ============================================================================ */
/* ---- 覆盖层与主容器 ---- */
.lib-overlay{position:fixed;inset:0;background:rgba(23,30,38,.55);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;animation:fadeIn .15s;}
.lib-modal{width:1100px;max-width:90vw;max-height:90vh;min-height:60vh;display:flex;flex-direction:column;border-radius:18px;border:2px solid var(--outline);box-shadow:0 18px 46px rgba(23,30,38,.28);overflow:hidden;}
.lib-paper{background:#FFFDF7;color:#2E3440;}
.lib-head{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:2px solid #EFE6D6;background:#FFFDF7;flex-shrink:0;}
.lib-head-actions{display:flex;align-items:center;gap:8px;}
.lib-title{font-size:17px;font-weight:800;color:#23402E;letter-spacing:.5px;}
.lib-body{overflow-y:auto;overflow-x:hidden;padding:18px 20px 22px;flex:1;-webkit-overflow-scrolling:touch;}
.lib-body::-webkit-scrollbar{width:9px;height:9px;}
.lib-body::-webkit-scrollbar-thumb{background:#D9D5C9;border-radius:5px;border:2px solid transparent;background-clip:content-box;}

/* ---- 顶部提示卡(浅绿色) ---- */
.lib-hint{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#EAF6EF;border:1.5px solid #BFE3D0;border-radius:14px;padding:14px 18px;margin-bottom:16px;}
.lib-hint-t{font-size:15px;font-weight:700;color:#1E8A45;}
.lib-hint-t b{color:#0F6B34;}
.lib-hint-s{font-size:12.5px;color:#4C7A5F;margin-top:3px;}
.lib-hint-r{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;flex-shrink:0;}
.lib-hint-r b{font-size:30px;font-weight:800;color:#1E8A45;}
.lib-hint-r span{font-size:12px;color:#4C7A5F;}

/* ---- 筛选区 ---- */
.lib-filter{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;padding:12px 14px;background:#F6F8F3;border:1.5px solid #EFE6D6;border-radius:14px;margin-bottom:10px;}
.lib-filter-item{display:flex;flex-direction:column;gap:5px;}
.lib-filter-lbl{font-size:11.5px;font-weight:700;color:#626D7E;letter-spacing:.5px;}
.lib-filter-kw{flex:1;min-width:200px;}
.lib-filter-kw input{width:100%;padding:9px 12px;border:2px solid #EFE6D6;border-radius:10px;font-size:13.5px;background:#fff;color:#2E3440;font-family:inherit;}
.lib-filter-kw input:focus{outline:none;border-color:#2EAD5C;}
.lib-result{font-size:13.5px;color:#626D7E;margin:6px 2px 12px;}
.lib-result b{font-size:17px;color:#23402E;}

/* ---- 自定义下拉(深灰菜单,蓝高亮选中) ---- */
.dd{position:relative;display:inline-block;}
.dd-btn{display:flex;align-items:center;gap:6px;padding:9px 14px;background:#fff;border:2px solid #D8D2C4;border-radius:10px;font-size:13.5px;color:#2E3440;cursor:pointer;font-family:inherit;white-space:nowrap;}
.dd-btn:hover{border-color:#2EAD5C;}
.dd-caret{font-size:11px;color:#626D7E;}
.dd-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;min-width:230px;max-height:320px;overflow-y:auto;background:#2E3440;border-radius:12px;padding:6px;box-shadow:0 14px 34px rgba(23,30,38,.30);z-index:130;}
.dd.open .dd-menu{display:block;}
.dd-menu::-webkit-scrollbar{width:7px;}
.dd-menu::-webkit-scrollbar-thumb{background:#4A5460;border-radius:4px;}
.dd-group{font-size:10.5px;color:#9AA4B0;padding:7px 10px 3px;letter-spacing:2px;font-weight:700;}
.dd-opt{padding:8px 10px;border-radius:8px;font-size:13.5px;color:#F2F4F7;cursor:pointer;white-space:nowrap;}
.dd-opt:hover{background:#3E4854;}
.dd-opt.on{background:#3D9BFF;color:#fff;font-weight:700;}

/* ---- 卡片网格 ---- */
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:14px;}
.lib-card{background:#fff;border:1.5px solid #EFE6D6;border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;box-shadow:0 2px 10px rgba(51,65,79,.05);transition:box-shadow .15s,transform .15s;}
.lib-card:hover{box-shadow:0 6px 18px rgba(51,65,79,.12);transform:translateY(-1px);}
.lib-card-tags{display:flex;gap:6px;flex-wrap:wrap;}
.lb-tag{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:11.5px;font-weight:700;line-height:1.4;}
.lb-tag-green{background:#E7F7EC;color:#1E8A45;border:1px solid #BFE3D0;}
.lb-tag-milk{background:#F6EFDD;color:#8a6a3f;border:1px solid #E9DDBF;}
.lb-tag-line{background:#fff;color:#626D7E;border:1px solid #D8D2C4;}
/* 教学计划页单元卡片上的水平段/年级胶囊 */
.lb-chip{display:inline-flex;align-items:center;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700;white-space:nowrap;flex-shrink:0;}
.lb-chip-lv{background:#E7F7EC;color:#1E8A45;border:1px solid #BFE3D0;}
.lb-chip-gr{background:#F6EFDD;color:#8a6a3f;border:1px solid #E9DDBF;}
.lib-card-name{font-size:18px;font-weight:800;color:#23402E;}
.lib-card-full{font-size:12.5px;color:#626D7E;line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:40px;}
.lib-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:2px;}
.lib-card-doc{font-size:12px;color:#1E8A45;font-weight:700;}
.lib-card-btn{margin-top:2px;width:100%;justify-content:center;}
.lib-empty{grid-column:1/-1;text-align:center;padding:46px 20px;color:#626D7E;font-size:14px;line-height:1.8;}
.lib-empty span{font-size:12px;color:#9AA4B0;}

/* ---- 课时选择 Modal ---- */
.lsel-top{display:flex;justify-content:space-between;gap:18px;background:#EAF6EF;border:1.5px solid #BFE3D0;border-radius:14px;padding:14px 18px;margin-bottom:14px;}
.lsel-top-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:7px;}
.lsel-top-title{font-size:14px;color:#2E3440;line-height:1.7;font-weight:600;}
.lsel-top-r{display:flex;flex-direction:column;gap:2px;align-items:flex-end;flex-shrink:0;}
.lsel-top-r b{font-size:22px;color:#1E8A45;font-weight:800;}
.lsel-top-r span{font-size:11.5px;color:#4C7A5F;}
.lsel-count-row{display:flex;align-items:flex-end;gap:14px;margin-bottom:12px;}
.lsel-count-q{font-size:15px;font-weight:800;color:#23402E;}
.lsel-count-input{display:flex;align-items:flex-end;gap:8px;}
.lsel-count-input input{width:86px;padding:9px 10px;border:2px solid #D8D2C4;border-radius:10px;font-size:16px;font-weight:700;color:#23402E;background:#fff;font-family:inherit;}
.lsel-count-input input:focus{outline:none;border-color:#2EAD5C;}
.lsel-quick{display:flex;gap:6px;}
.lsel-quick-btn{font-size:12.5px;padding:8px 14px;border-radius:20px;cursor:pointer;}
.lsel-quick-btn.on{background:#1E8A45;color:#fff;border-color:#1E8A45;}
.lsel-status{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13.5px;color:#626D7E;padding:9px 14px;background:#F6F8F3;border:1.5px solid #EFE6D6;border-radius:10px;margin-bottom:12px;}
.lsel-status b{color:#23402E;font-size:15px;}
.lsel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;margin-bottom:14px;}
.lsel-card{display:flex;align-items:center;gap:10px;background:#fff;border:1.5px solid #EFE6D6;border-radius:12px;padding:10px 12px;cursor:pointer;transition:.15s;}
.lsel-card:hover{border-color:#BFD8C8;}
.lsel-card.on{background:#E7F7EC;border-color:#57D08A;box-shadow:0 2px 8px rgba(46,173,92,.14);}
.lsel-check{width:22px;height:22px;border-radius:50%;border:2px solid #C9C4B6;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;font-weight:800;background:#fff;}
.lsel-card.on .lsel-check{background:#2EAD5C;border-color:#2EAD5C;}
.lsel-main{flex:1;min-width:0;}
.lsel-no{font-size:11px;font-weight:700;color:#9AA4B0;letter-spacing:.5px;}
.lsel-topic{font-size:14px;font-weight:700;color:#23402E;margin:2px 0;}
.lsel-type{font-size:11.5px;color:#626D7E;}
.lsel-detail{flex-shrink:0;font-size:12px;}
.lsel-foot{position:sticky;bottom:0;display:flex;align-items:center;gap:12px;padding:13px 2px 2px;background:linear-gradient(180deg,rgba(255,253,247,0),#FFFDF7 40%);margin-top:auto;}
.lsel-foot-tip{flex:1;text-align:center;font-size:13px;color:#8a6a3f;font-weight:600;}
.lsel-foot-tip.ok{color:#1E8A45;}

/* ---- 完整详案 ---- */
.ld-body{padding-bottom:26px;}
.ld-hero{display:flex;justify-content:space-between;gap:18px;background:#F6F8F3;border:1.5px solid #EFE6D6;border-radius:14px;padding:16px 20px;margin-bottom:14px;}
.ld-hero-unit{font-size:12px;color:#626D7E;line-height:1.6;}
.ld-hero-title{font-size:24px;font-weight:800;color:#23402E;margin:6px 0 5px;}
.ld-hero-meta{font-size:13px;color:#1E8A45;font-weight:700;}
.ld-hero-r{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;min-width:74px;border-left:1.5px dashed #C9C4B6;padding-left:16px;margin-left:10px;}
.ld-hero-r b{font-size:34px;font-weight:800;color:#23402E;line-height:1;}
.ld-hero-r span{font-size:12px;color:#626D7E;margin-top:3px;}
.ld-info-cards{display:grid;grid-template-columns:1fr 1fr 1.6fr;gap:12px;margin-bottom:16px;}
.ld-info-card{background:#fff;border:1.5px solid #EFE6D6;border-radius:12px;padding:12px 14px;}
.ld-info-label{font-size:11px;color:#9AA4B0;font-weight:700;letter-spacing:1px;}
.ld-info-value{font-size:16px;font-weight:800;color:#23402E;margin-top:5px;line-height:1.5;}
.ld-info-sub{font-size:12.5px;color:#626D7E;margin-top:2px;}
.ld-sec{margin-bottom:18px;}
.ld-sec-head{display:flex;align-items:center;gap:12px;padding:11px 16px;background:#23402E;border-radius:12px;margin-bottom:12px;}
.ld-sec-no{width:34px;height:34px;border-radius:9px;background:#1E8A45;color:#fff;font-size:14px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ld-sec-name{font-size:16px;font-weight:800;color:#fff;letter-spacing:1px;}
.ld-block{background:#fff;border:1.5px solid #EFE6D6;border-radius:12px;padding:12px 16px;margin-bottom:10px;}
.ld-block-title{font-size:13px;font-weight:800;color:#23402E;margin-bottom:6px;}
.ld-block-text{font-size:13px;line-height:1.9;color:#3A4450;}
.ld-quality{white-space:pre-line;}
.ld-two{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:10px;}
.ld-link{display:flex;align-items:stretch;justify-content:center;gap:14px;background:#F6F8F3;border:1.5px solid #EFE6D6;border-radius:12px;padding:14px;}
.ld-link-item{flex:1;max-width:280px;text-align:center;font-size:12px;color:#626D7E;background:#fff;border:1.5px solid #EFE6D6;border-radius:10px;padding:10px 8px;display:flex;flex-direction:column;gap:4px;}
.ld-link-item b{font-size:13px;color:#23402E;font-weight:700;line-height:1.5;}
.ld-link-cur{border-color:#57D08A;background:#E7F7EC;}
.ld-link-cur b{color:#1E8A45;}
.ld-link-arrow{display:flex;align-items:center;font-size:20px;color:#2EAD5C;font-weight:800;}
/* ---- 教学过程表格 ---- */
.ld-part{margin-bottom:14px;}
.ld-part-head{display:flex;align-items:center;gap:8px;padding:10px 14px;background:#F6F8F3;border:1.5px solid #EFE6D6;border-bottom:none;border-radius:12px 12px 0 0;}
.ld-part-name{font-size:15px;font-weight:800;color:#23402E;flex:1;}
/* 表格完全显示:不限高、不做内部滚动框,随弹窗整体滚动;仅窄屏保留横向滚动 */
.ld-table-wrap{overflow-x:auto;border:1.5px solid #EFE6D6;border-radius:0 0 12px 12px;background:#fff;}
.ld-table{width:100%;min-width:880px;border-collapse:separate;border-spacing:0;table-layout:fixed;}
.ld-table thead th{background:#23402E;color:#fff;font-size:12.5px;font-weight:700;padding:9px 8px;letter-spacing:.5px;}
.ld-table thead th.ld-td-content,.ld-table td.ld-td-content{width:24%;}
.ld-table thead th.ld-td-org,.ld-table td.ld-td-org{width:33%;}
.ld-table thead th.ld-td-num,.ld-table td.ld-td-num{width:6.5%;text-align:center;}
.ld-table thead th.ld-td-form,.ld-table td.ld-td-form{width:23.5%;}
.ld-table tbody td{padding:9px 10px;font-size:12.5px;line-height:1.7;color:#3A4450;border-top:1px solid #F1ECDE;vertical-align:top;}
.ld-table tbody tr:nth-child(odd) td{background:#FFFDF7;}
.ld-table tbody tr:nth-child(even) td{background:#FFFFFF;}
.ld-table td.ld-td-num{text-align:center;color:#626D7E;}
.ld-table td.ld-td-form pre{font-family:inherit;white-space:pre;font-size:12px;line-height:1.5;color:#4C7A5F;margin:0;}

/* ---- 课时编辑:详案同款卡片(可编辑) ---- */
.pe-edit .ld-hero-title{font-size:24px;font-weight:800;color:#23402E;margin:6px 0 5px;}
.pe-hero-title{width:100%;font-size:22px;font-weight:800;color:#23402E;background:transparent;border:1.5px solid transparent;border-radius:10px;padding:6px 10px;margin:4px 0;font-family:inherit;}
.pe-hero-title:focus{outline:none;border-color:#2EAD5C;background:#fff;}
.pe-input{width:100%;padding:6px 8px;font-size:13.5px;border:1.5px solid #EFE6D6;border-radius:8px;background:#FFFDF7;color:#3A4450;font-family:inherit;margin-top:4px;}
.pe-input:focus{outline:none;border-color:#2EAD5C;background:#fff;}
.pe-pair{display:flex;align-items:center;gap:6px;margin-top:5px;}
.pe-pair span{font-size:11px;color:#9AA4B0;font-weight:700;white-space:nowrap;}
.pe-pair .pe-input{margin-top:0;}
.pe-area{width:100%;padding:8px 10px;font-size:12.5px;line-height:1.7;border:1.5px solid #EFE6D6;border-radius:8px;background:#FFFDF7;color:#3A4450;font-family:inherit;resize:vertical;}
.pe-area:focus{outline:none;border-color:#2EAD5C;background:#fff;}
.pe-link{width:100%;padding:6px 8px;font-size:13px;font-weight:700;color:#23402E;border:1.5px solid transparent;border-radius:8px;background:transparent;text-align:center;font-family:inherit;margin-top:4px;}
.pe-link:focus{outline:none;border-color:#2EAD5C;background:#fff;}
.pe-flow{margin-bottom:2px;}
.pe-part{margin-bottom:10px;}
.pe-part:last-child{margin-bottom:0;}
.pe-dur{display:flex;align-items:center;gap:4px;font-size:11.5px;color:#626D7E;margin:0;}
.pe-dur span{white-space:nowrap;}
.pe-dur input{width:52px;padding:4px 6px;border:1.5px solid #D8D2C4;border-radius:6px;font-size:12px;color:#23402E;background:#fff;font-family:inherit;}
.pe-dur input:focus{outline:none;border-color:#2EAD5C;}
.pe-cell{width:100%;min-height:34px;font-size:12px;line-height:1.6;padding:5px 6px;border:1px solid transparent;border-radius:6px;background:transparent;color:#3A4450;resize:none;font-family:inherit;}
.pe-cell:focus{border-color:#2EAD5C;background:#fff;outline:none;}
.pe-cell-n{width:100%;padding:5px 6px;font-size:12px;border:1px solid transparent;border-radius:6px;background:transparent;color:#3A4450;text-align:center;font-family:inherit;}
.pe-cell-n:focus{border-color:#2EAD5C;background:#fff;outline:none;}
/* 队形列编辑框:多行队形图,样式与详案 pre 一致 */
.pe-cell-f{color:#4C7A5F;}
/* 编辑弹窗内所有文本框自适应内容高度(JS 自动长高),禁止手动拖拽 */
.pe-edit textarea{resize:none;}
.pe-del{width:22px;height:22px;border-radius:6px;border:none;background:transparent;color:#C9C4B6;cursor:pointer;font-size:11px;line-height:1;margin:0 auto;}
.pe-del:hover{background:#FDE8E8;color:#C85C5C;}
/* 课时编辑底部:备课状态 + 课时内容 + 反思 */
.pe-extra{display:flex;gap:14px;align-items:flex-start;margin-top:6px;background:#F6F8F3;border:1.5px solid #EFE6D6;border-radius:12px;padding:12px 14px;}
.pe-state{flex:0 0 auto;margin:0;display:flex;flex-direction:column;gap:4px;}
.pe-state span{font-size:13px;font-weight:800;color:#23402E;}
.pe-detail{flex:1;min-width:0;}
.pe-detail label{display:block;font-size:13px;font-weight:800;color:#23402E;margin-bottom:4px;}
.pe-detail textarea{min-height:56px;font-size:12.5px;line-height:1.7;padding:8px 10px;border:1.5px solid #EFE6D6;border-radius:8px;background:#FFFDF7;color:#3A4450;font-family:inherit;}
.pe-detail textarea:focus{outline:none;border-color:#2EAD5C;}
.pe-refl{flex:0 0 auto;display:flex;align-items:center;gap:6px;font-size:13px;color:#23402E;font-weight:700;cursor:pointer;margin-top:24px;}

/* ---- 响应式(桌面优先:1440/1280 正常,1024 可用,≤900 收紧) ---- */
@media (max-width:1024px){
  .lib-modal{width:96vw;}
  .lib-grid{grid-template-columns:repeat(2,1fr);}
  .lsel-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:900px){
  .lib-modal{width:100vw;max-width:100vw;max-height:100vh;border-radius:0;border:none;}
  .lib-grid,.lsel-grid,.ld-two{grid-template-columns:1fr;}
  .ld-info-cards{grid-template-columns:1fr 1fr;}
  .ld-info-card-wide{grid-column:1/-1;}
  .pe-extra{flex-direction:column;}
  .lib-filter{flex-direction:column;align-items:stretch;}
  .lib-filter-kw{min-width:0;}
  .dd{width:100%;}
  .dd-btn{width:100%;justify-content:space-between;}
  .lsel-top{flex-direction:column;}
  .lsel-top-r{align-items:flex-start;}
  .lsel-count-row{flex-direction:column;align-items:stretch;gap:8px;}
  .lsel-count-input{flex-wrap:wrap;}
  .lsel-count-input input{width:100%;}
  .ld-hero{flex-direction:column;}
  .ld-hero-r{flex-direction:row;gap:8px;padding-left:0;border-left:none;min-width:0;}
  .ld-link{flex-direction:column;}
  .ld-link-arrow{justify-content:center;transform:rotate(90deg);}
}

/* ================= 体测 · 现场计时录入(移动端 H5,追加段,不动既有规则) ================= */
.st-topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;flex-wrap:wrap;}
.st-tip{font-size:11.5px;color:var(--text-2)}
.st-cfg-title{font-size:13px;font-weight:700;color:var(--text-2);margin-bottom:8px}
.st-proj-pick{display:flex;gap:10px;flex-wrap:wrap}
.st-proj-card{flex:1;min-width:150px;padding:12px 14px;border:2px solid var(--border);border-radius:12px;background:var(--input-bg);cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:4px;font-family:inherit}
.st-proj-card b{font-size:15px;color:var(--title)}
.st-proj-card span{font-size:11.5px;color:var(--text-2)}
.st-proj-card.on{border-color:var(--primary);background:var(--primary-light);box-shadow:0 0 0 2px var(--primary-light)}
.st-proj-card.on b{color:var(--primary)}
/* 随手计「测试项目」改用下拉:收起时只占一行,展开才是全部可选项。
   上面的卡片栅格仍供现场计时(fitstop)使用,不要删。 */
.qt-proj-sel,.qt-sess-sel{width:100%;max-width:420px;font-size:14px;font-weight:600;color:var(--title)}
.qt-proj-desc{font-size:12px;color:var(--text-2);margin-top:7px;line-height:1.6;min-height:18px}
.st-start{width:100%;margin-top:14px;padding:14px;font-size:17px}
.st-group-strip{display:flex;gap:8px;overflow-x:auto;padding:12px 2px 6px;-webkit-overflow-scrolling:touch}
.st-gchip{flex:0 0 auto;padding:7px 14px;border:1.5px solid var(--border);border-radius:999px;background:var(--card);font-size:13px;color:var(--text-2);cursor:pointer;touch-action:manipulation}
.st-gchip.on{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:700}
.st-gcard{margin-top:10px;padding:12px}
.st-gcard.on{border-color:var(--primary)}
.st-ghead{font-size:14px;font-weight:800;color:var(--title);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.st-ghead>span:first-child{display:flex;align-items:center;gap:6px}
.st-gtag{font-style:normal;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--primary-light);color:var(--primary)}
.st-gmeta{font-size:11.5px;font-weight:400;color:var(--text-2)}
.st-lane{min-width:44px;min-height:34px;padding:4px 8px;border:1.5px solid var(--primary);border-radius:8px;background:var(--primary-light);color:var(--primary);font-weight:800;font-size:12.5px;cursor:pointer;touch-action:manipulation;font-family:inherit}
.st-lane.absent{border-color:var(--coral);background:transparent;color:var(--coral);text-decoration:line-through}
.st-lane.dirty{border-color:var(--sun);box-shadow:0 0 0 2px var(--sun)}
.st-absent td{opacity:.55;text-decoration:line-through}
.st-time-cell{cursor:pointer;min-width:76px;text-align:center;font-family:ui-monospace,Consolas,monospace;font-size:14px;font-weight:700}
.st-time-cell .st-ph{color:var(--muted);font-weight:400;font-size:11.5px}
.st-score-cell{min-width:44px;text-align:center;font-weight:800}
.st-score-cell b{color:var(--primary)}
.st-in{width:100%;box-sizing:border-box;padding:6px 8px;font-size:16px;text-align:center;border:1.5px solid var(--primary);border-radius:8px;background:var(--input-bg);color:var(--text);font-family:ui-monospace,Consolas,monospace}
.st-in:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}
.st-stop{margin-top:12px;padding:14px;border-color:var(--primary)}
.st-stop-head{font-size:14px;font-weight:800;color:var(--title);display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;align-items:center}
.st-time{font-size:54px;font-weight:900;text-align:center;font-variant-numeric:tabular-nums;color:var(--primary);line-height:1.15;margin:10px 0 6px;font-family:ui-monospace,Consolas,monospace}
.st-bigzone{display:flex;flex-direction:column;align-items:center;gap:12px;margin:14px 0 8px}
.st-big-go{
  width:min(44vw,190px);height:min(44vw,190px);box-sizing:border-box;
  border-radius:30px;
  font-size:22px;font-weight:900;color:#fff;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:linear-gradient(180deg,#3FBF6B,#2EAD5C);
  border:3px solid var(--outline-soft);
  box-shadow:var(--shadow);
  touch-action:manipulation;-webkit-user-select:none;user-select:none;
  font-family:inherit;line-height:1.25;
}
.st-big-go:active{transform:scale(.96)}
.st-big-go.st-go{background:linear-gradient(180deg,#FF7A6B,#FF5F4D)}
.st-go-sub{font-size:13px;font-weight:600;opacity:.92;font-variant-numeric:tabular-nums}
.st-stop-small{min-width:130px}
.st-sec-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.st-sec-btns .btn{margin:0}
.st-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.st-chip{padding:5px 10px;border-radius:999px;background:var(--panel);border:1.5px solid var(--border);font-size:12.5px;font-family:ui-monospace,Consolas,monospace;color:var(--text)}
.st-chip.pending{border-style:dashed;border-color:var(--accent);color:var(--accent);cursor:pointer}
.st-chip-div{width:100%}
.st-manual{display:flex;gap:8px;margin-top:12px;align-items:center;flex-wrap:wrap}
.st-manual .st-in{flex:1;min-width:130px}
.st-manual .st-tip{flex-basis:100%}
.st-bar{position:sticky;bottom:0;z-index:30;display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:var(--card);border-top:2px solid var(--outline-soft);box-shadow:0 -4px 0 var(--outline-soft);margin-top:14px}
.st-bar .btn{flex:1;padding:12px 6px}
@media (max-width:760px){
  .st-time{font-size:46px}
  .st-proj-card{min-width:120px}
  .st-gcard{padding:10px}
  .st-gcard .ft-table th,.st-gcard .ft-table td{padding:6px 6px;font-size:12.5px}
  .st-time-cell{min-width:70px}
}

/* 大单元计划详情区块(水平一模块化结构) */
.unit-plan{margin:10px 0 12px;border:1.5px dashed var(--border);border-radius:10px;padding:10px 14px;background:var(--panel);}
.up-sec{margin-bottom:8px}
.up-sec:last-child{margin-bottom:0}
.up-sec>b{font-size:13px;color:var(--title)}
.up-item{font-size:12.5px;color:var(--text);margin-top:4px;line-height:1.6}
.up-sub{margin-left:14px;color:var(--text)}
.up-empty{font-size:12.5px;color:var(--text-2)}

/* 大单元课时五列结构表(完成情况/课次/学习目标/主要教学内容/教学组织与方法) */
.ls-table{width:100%;border-collapse:collapse}
.ls-table th{font-size:12px;color:var(--text-2);text-align:left;padding:6px 8px;border-bottom:2px solid var(--border);white-space:nowrap;background:var(--panel)}
.ls-table td{vertical-align:top;padding:8px;border-bottom:1px dashed var(--line-soft)}
.ls-table tr:last-child td{border-bottom:none}
.lsth-done{width:92px}.lsth-no{width:76px;text-align:center}
.lstd-done{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.lstd-done .ls-status,.lstd-done .ls-ref-btn,.lstd-done .ls-plan-btn{display:inline-block}
.lstd-no{text-align:center}
.ls-no-v{writing-mode:vertical-rl;letter-spacing:3px;font-weight:700;font-size:12.5px;color:var(--title);margin:0 auto 4px}
.ls-topic-sm{font-size:11.5px;color:var(--text-2);margin:0 auto 4px;max-width:76px;word-break:break-all;line-height:1.4}
.ls-gi{font-size:12.5px;line-height:1.55;margin-bottom:5px;overflow-wrap:break-word;word-break:break-word}
.ls-gi b{color:var(--title);margin-right:2px}
.ls-gi.ls-pre{white-space:pre-wrap}
.ls-ph{color:var(--muted);font-size:11.5px}
@media(max-width:760px){.lsth-done{width:78px}.lsth-no{width:56px}}

/* 修正:ls-table 内的行恢复表格布局(覆盖旧 .ls-row 的 flex) */
.ls-table tr.ls-row{display:table-row}
.ls-table tr.ls-row:hover{background:var(--empty-hover)}
.ls-table td.lstd-done{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.ls-table td.lstd-cell{display:table-cell}

/* 课时表:六列(完成情况仅图标/课次横排/独立编辑列) */
.ls-table .lsth-done{width:60px}
.ls-table .lsth-no{width:72px}
.ls-table .lsth-edit{width:88px}
.ls-no-h{font-weight:700;font-size:12.5px;color:var(--title);margin:0 auto 4px}
.lstd-edit{text-align:center}
.lstd-done .ls-plan-btn,.lstd-done .ls-ref-btn{font-size:14px}

/* 完成情况列:三按键美化并居中 */
.ls-table td.lstd-done{align-items:center;justify-content:center;gap:6px;text-align:center;padding:10px 6px}
.ls-table td.lstd-done .ls-status{min-width:46px;text-align:center;font-size:11.5px;padding:3px 8px;border-radius:999px}
.ls-table td.lstd-done .ls-plan-btn,.ls-table td.lstd-done .ls-ref-btn{width:36px;height:32px;font-size:15px;border:1.5px solid var(--border);border-radius:9px;background:var(--card);line-height:1;transition:transform .12s,border-color .12s,background .12s}
.ls-table td.lstd-done .ls-plan-btn:hover,.ls-table td.lstd-done .ls-ref-btn:hover{transform:scale(1.15);border-color:var(--primary-mid);background:var(--empty-hover)}
.ls-table td.lstd-done .ls-ref-btn.on{background:var(--sun);border-color:var(--outline-soft)}

/* 课时表列宽:固定三窄列,学习目标与主要教学内容均分剩余 */
.ls-table{table-layout:fixed}
.ls-table .lsth-org{width:180px}
.ls-table .lstd-cell{overflow-wrap:break-word;word-break:break-word}

/* 课时表手机适配:横向滚动容器,窄屏保持五列不被挤压 */
.ls-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ls-table-wrap .ls-table{min-width:720px}
@media(max-width:760px){.ls-table-wrap .ls-table{min-width:680px}.ls-table .lsth-done{width:56px}.ls-table .lsth-no{width:64px}.ls-table .lsth-edit{width:72px}.ls-table .lsth-org{width:150px}}

/* 编辑列:编辑本课按键垂直居中 */
.ls-table td.lstd-edit{vertical-align:middle;text-align:center}
.ls-table td.lstd-edit button{margin:0 auto}

/* 编辑列:按键纵向居中 */
.ls-table td.lstd-edit{vertical-align:middle;text-align:center}

/* 编辑按钮:文字在按钮内纵向居中 */
.ls-table td.lstd-edit .btn{display:inline-flex;align-items:center;justify-content:center}
.ls-table td.lstd-done .ls-status{display:inline-flex;align-items:center;justify-content:center}

/* 编辑图标并入完成情况列;第六列已删除 */
.ls-table td.lstd-done .ls-edit-btn{width:36px;height:32px;font-size:15px;border:1.5px solid var(--border);border-radius:9px;background:var(--card);line-height:1;transition:transform .12s,border-color .12s,background .12s;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.ls-table td.lstd-done .ls-edit-btn:hover{transform:scale(1.15);border-color:var(--primary-mid);background:var(--empty-hover)}
@media(max-width:760px){.ls-table-wrap .ls-table{min-width:620px}.ls-table .lsth-org{width:150px}}

/* ================= 运动大富翁(棋盘 / 骰子 / 计分板 / 任务卡) =================
   配色一律走既有 CSS 变量,深色模式自动适配 */
.mp-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.mp-modes{display:flex;gap:8px;flex-wrap:wrap}
.mp-mode{display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:13px;font-weight:700;padding:8px 14px;border-radius:12px;border:2px solid var(--outline-soft);background:var(--card);color:var(--text);cursor:pointer;transition:.15s}
.mp-mode:hover{border-color:var(--primary)}
.mp-mode.on{background:var(--primary-light);border-color:var(--primary);color:var(--on-pl)}
.mp-top-right{margin-left:auto;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mp-meta{font-size:12px;color:var(--text-2)}
.mp-meta b{color:var(--title);font-size:13px}

.mp-stage{display:flex;gap:16px;align-items:flex-start}
/* 棋盘外框:粗描边 + 双层贴纸投影 + 内圈白线,像一块真实的桌游板 */
.mp-board{flex:1 1 auto;min-width:0;max-width:640px;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);aspect-ratio:1/1;gap:5px;padding:10px;background:var(--card);border:3px solid var(--outline);border-radius:20px;box-shadow:0 6px 0 var(--outline-soft),0 16px 30px rgba(51,65,79,.14),inset 0 0 0 2px rgba(255,255,255,.4)}
.mp-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:2px 1px;border-radius:10px;border:2px solid var(--border);background:var(--card);overflow:hidden;text-align:center;line-height:1.12;transition:transform .15s,border-color .15s,box-shadow .15s;box-shadow:0 2px 0 var(--outline-soft);cursor:default}
/* 格面高光:上半部一道斜向光泽,贴纸质感(深色模式下调弱) */
.mp-tile::before{content:'';position:absolute;inset:0 0 55% 0;background:linear-gradient(180deg,rgba(255,255,255,.30),rgba(255,255,255,0));pointer-events:none}
[data-theme="dark"] .mp-tile::before{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,0))}
.mp-tile:hover{transform:translateY(-1px);box-shadow:0 3px 0 var(--outline-soft);z-index:1}
.mp-tile.cur:hover{transform:scale(1.07) translateY(-1px)}
.mp-ico{font-size:17px;line-height:1;filter:drop-shadow(0 1.5px 0 rgba(51,65,79,.18))}
.mp-lb{font-size:10.5px;font-weight:800;color:var(--text);white-space:nowrap;max-width:100%;overflow:hidden;letter-spacing:.3px}
/* 六个外角是转弯点:描边加重一点,提示「到角要转向」 */
.mp-corner{border-width:2.5px;box-shadow:0 3px 0 var(--outline-soft)}
.mp-start{background:linear-gradient(180deg,var(--primary-light),var(--card) 78%);border-color:var(--primary)}
/* 起点格:格子旗纹(不支持的浏览器回落到上一条的浅绿渐变) */
.mp-start{background:repeating-conic-gradient(rgba(46,173,92,.14) 0 25%,rgba(255,255,255,.8) 0 50%) 0 0/14px 14px,var(--primary-light)}
.mp-task{background:linear-gradient(180deg,var(--blue-bg),var(--card) 78%);border-color:var(--blue-line)}
.mp-team{background:linear-gradient(180deg,var(--orange-bg),var(--card) 78%);border-color:var(--orange-line)}
/* 前进/后退格:斜纹底 + 天空蓝描边,与「团队挑战」的橙色区分开(两者的底色变量本来很接近) */
.mp-move{background:repeating-linear-gradient(45deg,var(--panel-2) 0 5px,var(--gridline) 5px 10px);border-color:var(--sky)}
.mp-bonus{background:linear-gradient(180deg,var(--pink-bg),var(--card) 78%);border-color:var(--pink-line)}
/* 休息格:灰绿弱化,一眼可辨「不用做事」 */
.mp-rest{background:linear-gradient(180deg,var(--panel),var(--card) 78%);border-color:var(--outline-soft);border-style:dashed}
.mp-tile.cur{border-color:var(--primary);transform:scale(1.07);z-index:2;animation:mpCurPulse 1.6s ease-in-out infinite}
@keyframes mpCurPulse{0%,100%{box-shadow:0 0 0 3px var(--primary-light),0 2px 0 var(--outline-soft)}50%{box-shadow:0 0 0 6px var(--primary-light),0 2px 0 var(--outline-soft)}}
.mp-pcs{position:absolute;top:2px;right:2px;display:flex;gap:2px;flex-wrap:wrap;max-width:66%}
.mp-pc{display:inline-block;width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 1.5px rgba(255,255,255,.85)}
[data-theme="dark"] .mp-pc{box-shadow:0 0 0 1.5px rgba(0,0,0,.55)}

/* 中心场地:同心环纹(跑道内场),配一点顶部高光;主题底色由 data-mp-theme 提供 */
.mp-center{grid-area:2/2/7/7;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:10px;border-radius:16px;
  background:
    radial-gradient(circle at 50% 34%,rgba(255,255,255,.72),rgba(255,255,255,.28) 56%,rgba(255,255,255,0) 74%),
    repeating-radial-gradient(circle at 50% 50%,transparent 0 24px,var(--gridline) 24px 26.5px),
    var(--panel);
  border:2px dashed var(--outline-soft);text-align:center;box-shadow:inset 0 2px 12px rgba(51,65,79,.07)}
[data-theme="dark"] .mp-center{background:
  radial-gradient(circle at 50% 34%,rgba(255,255,255,.05),rgba(255,255,255,0) 70%),
  repeating-radial-gradient(circle at 50% 50%,transparent 0 24px,rgba(255,255,255,.05) 24px 26.5px),
  var(--panel)}
/* 行进方向罗盘:贴在中心区四边中点的小圆徽,提示棋子绕行方向(纯装饰) */
.mp-dir{position:absolute;z-index:4;width:16px;height:16px;display:flex;align-items:center;justify-content:center;
  font-size:8px;color:var(--text-2);background:var(--card);border:1.5px solid var(--outline-soft);border-radius:50%;
  pointer-events:none;transform:translate(-50%,-50%);box-shadow:0 1px 0 var(--outline-soft)}
.mp-dir-b{left:50%;top:85.3%}
.mp-dir-r{left:85.3%;top:50%}
.mp-dir-t{left:50%;top:14.7%}
.mp-dir-l{left:14.7%;top:50%}
.mp-turn{font-size:12.5px;color:var(--text-2);display:flex;align-items:center;gap:6px;
  background:var(--card);border:2px solid var(--outline-soft);border-radius:999px;padding:4px 14px;
  box-shadow:0 2px 0 var(--outline-soft)}
.mp-turn b{font-size:18px;color:var(--title)}
/* ============ 3D 骰子(真几何:CSS 3D 立方体,零依赖零贴图) ============
   几何只有一个尺寸来源 --mp-die-size(各断点只改它):面的大小、圆角、描边、点距、
   六个面的 translateZ 全部由它推导 —— 加一处断点不必再改第二处。
   层次:.mp-dice(透视场景 + 放大态) > .mp-dice-hop(弹跳层) > .mp-cube(翻滚层) > 六个 .mp-face。
   ⚠ .mp-dice **自身**只允许挂一个带动画的类(mpRollShake):同一个元素上叠两个 animation,
     后声明的会按 CSS 层叠规则整个覆盖前一个(放大就会失效 —— 历史上"只有第一次掷骰才放大"
     就是这么来的)。所以弹跳与落地回弹都写在**后代层**上,碰不到 .mp-dice 自身。 */
.mp-dice{
  --mp-die-size:76px;                    /* 骰子边长:唯一的几何尺寸来源 */
  --mp-half:calc(var(--mp-die-size)/2);  /* 半边长 = 六个面各自的位移量 */
  /* 观察角(斜上方偏左):只几度,结果面依旧正对观众,但静止时能同时看到顶面与侧面,
     否则"正对观众"的立方体只有一面可见,和平面骰子看不出区别 */
  --mp-tilt-x:-8deg;
  --mp-tilt-y:12deg;
  position:relative;width:var(--mp-die-size);height:var(--mp-die-size);
  perspective:520px;                     /* 透视:近大远小的空间感来源(越小越夸张) */
  perspective-origin:50% 42%;            /* 视点略偏上:像人站在桌边俯视骰子 */
  /* 倾斜后的投影轮廓比原方块高约 12%(顶面与底面各伸出去一点),
     留一点下边距,免得骰子压到下面的「掷骰子」按钮上 */
  margin-bottom:calc(var(--mp-die-size)*.1);
}
/* 还没掷过:保持原来的贴纸方块 + 🎲 图标 */
.mp-dice.idle{
  display:flex;align-items:center;justify-content:center;
  background:var(--input-bg);border:3px solid var(--outline);border-radius:16px;box-shadow:var(--shadow);
}
.mp-dice.idle b{font-size:34px;line-height:1}
/* 地面投影:骰子跳起时变小变淡(与弹跳同周期),给"离地"一个参照物。
   弱机(lite)直接不显示 —— 它只是氛围,不影响判断点数 */
.mp-dice-shadow{
  position:absolute;left:9%;right:9%;bottom:-12%;height:14%;border-radius:50%;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(var(--mp-shade),.30),rgba(var(--mp-shade),0) 72%);
}
/* 弹跳层:整颗骰子上下跳。放在立方体之外 —— 位移不参与透视,不会顺带被压扁 */
.mp-dice-hop{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 62%}
/* 翻滚层:JS 只改这一层的 transform(rotateX/rotateY,90° 的整数倍) */
.mp-cube{position:absolute;inset:0;transform-style:preserve-3d;transform-origin:50% 50%}
/* 六个面:同一个正方形旋转后沿自身法线平移半边长,拼成封闭立方体。
   边长/圆角/描边/内边距/点距全部按 --mp-die-size 缩放,断点无需再管 */
.mp-face{
  position:absolute;inset:0;box-sizing:border-box;
  display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);
  padding:calc(var(--mp-die-size)*.12);gap:calc(var(--mp-die-size)*.045);
  background:var(--input-bg);
  border:calc(var(--mp-die-size)*.04) solid var(--outline);
  border-radius:calc(var(--mp-die-size)*.17);
  box-shadow:inset 0 0 calc(var(--mp-die-size)*.12) rgba(var(--mp-shade),.10);
  backface-visibility:hidden;
}
.mp-face span{border-radius:50%;background:transparent;place-self:center;width:100%;aspect-ratio:1}
/* 点数凹坑:顶部内侧压暗 + 底部内侧提亮,做出"陷进面里"的立体感(真实骰子的点不是印上去的圆片) */
.mp-face span.on{
  background:var(--text);
  box-shadow:inset 0 calc(var(--mp-die-size)*.028) calc(var(--mp-die-size)*.05) rgba(0,0,0,.40),
             inset 0 calc(var(--mp-die-size)*-.018) calc(var(--mp-die-size)*.03) rgba(255,255,255,.32);
}
/* 面高光:左上一道斜向的镜面反光(叠在各面明暗之上,模拟骰子表面反光);
   ::after 不参与 grid 布局,不会挤动点数 */
.mp-face::after{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.26),rgba(255,255,255,0) 46%);
}
.mp-face.f-fr{transform:translateZ(var(--mp-half))}
.mp-face.f-bk{transform:rotateY(180deg) translateZ(var(--mp-half))}
.mp-face.f-rt{transform:rotateY(90deg) translateZ(var(--mp-half))}
.mp-face.f-lf{transform:rotateY(-90deg) translateZ(var(--mp-half))}
.mp-face.f-tp{transform:rotateX(90deg) translateZ(var(--mp-half))}
.mp-face.f-bt{transform:rotateX(-90deg) translateZ(var(--mp-half))}
/* 光影:光源固定在左上 —— 顶面最亮、底面最暗、左右介于两者之间、背面稍暗。
   用叠一层半透明色实现(而不是 filter):省掉每个面一次离屏渲染,弱机也扛得住。
   明暗跟着面走,所以立方体转到任何角度体积感都成立 */
.mp-face.f-tp{background-image:linear-gradient(rgba(255,255,255,.18),rgba(255,255,255,.18))}
.mp-face.f-fr{background-image:linear-gradient(rgba(255,255,255,.02),rgba(255,255,255,.02))}
.mp-face.f-rt{background-image:linear-gradient(rgba(var(--mp-shade),.05),rgba(var(--mp-shade),.05))}
.mp-face.f-bk{background-image:linear-gradient(rgba(var(--mp-shade),.09),rgba(var(--mp-shade),.09))}
.mp-face.f-lf{background-image:linear-gradient(rgba(var(--mp-shade),.13),rgba(var(--mp-shade),.13))}
.mp-face.f-bt{background-image:linear-gradient(rgba(var(--mp-shade),.18),rgba(var(--mp-shade),.18))}
/* 平面降级(不支持 preserve-3d 的老浏览器):点数与 3D 完全同源,只是没有立体感 */
.mp-flat{
  position:absolute;inset:0;box-sizing:border-box;
  display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);
  padding:calc(var(--mp-die-size)*.13);gap:calc(var(--mp-die-size)*.05);
  background:var(--input-bg);border:calc(var(--mp-die-size)*.04) solid var(--outline);
  border-radius:calc(var(--mp-die-size)*.2);
}
.mp-flat span{border-radius:50%;background:transparent}
.mp-flat span.on{background:var(--text)}
/* 掷骰中:翻面由 JS 写进 .mp-cube 的 transform(连续补间,见 dice3d.js 的 tumble),
   这里只负责"跳"与"投影跟着呼吸";两者同周期,合起来才像一次弹跳 */
.mp-dice.rolling .mp-dice-hop{animation:mpDiceHop var(--mp-hop-ms,340ms) ease-in-out infinite}
.mp-dice.rolling .mp-dice-shadow{animation:mpShadowBreath var(--mp-hop-ms,340ms) ease-in-out infinite}
.mp-dice.rolling .mp-cube{will-change:transform}
@keyframes mpDiceHop{
  0%,100%{transform:translateY(0)}
  40%{transform:translateY(-20%)}     /* 跳起 */
  62%{transform:translateY(0)}        /* 落回 */
  78%{transform:translateY(-6%)}      /* 再小弹一下:一次落地的骰子不会只跳一下 */
}
@keyframes mpShadowBreath{
  0%,100%{transform:scale(1);opacity:.9}
  40%{transform:scale(.7);opacity:.45}
}
/* 定面落地:压缩回弹一次(同样只作用在弹跳层) */
.mp-dice.bounce .mp-dice-hop{animation:mpDiceBounce var(--mp-bounce-ms,420ms) cubic-bezier(.2,1.4,.35,1) 1}
@keyframes mpDiceBounce{
  0%{transform:translateY(-10%) scale(1.07,.93)}
  45%{transform:translateY(0) scale(.93,1.07)}
  100%{transform:translateY(0) scale(1)}
}
/* 弱机:去掉纯装饰的地面投影(翻滚、弹跳、定面都保留 —— 那些是玩法信息) */
.mp-dice.lite .mp-dice-shadow{display:none}

/* 掷骰:一按下**立刻**跳到放大尺寸(纯 class 切换 + transform,不走任何动画与过渡),
   然后在这个尺寸上轻微摇摆(翻滚本身已经是连续 3D 旋转,晃动只是助兴,幅度要小 ——
   大幅度平面旋转会盖过立方体自身的翻滚,反而显假)。
   · 尺寸写在 .rolling 的 transform 上,而不是写进关键帧 —— 这样尺寸一定是**瞬时到位**的,
     连在「减少动态」把 animation 关掉时也照样生效;
   · 晃动只改角度、且复用同一个 --mp-roll-zoom,所以全程尺寸恒定,不会出现"逐渐变大";
   · ⚠ **骰子自身只能有这一处 animation**(见上方层次说明):弹跳/回弹都在后代层上;
   · z-index 抬高:放大到 2 倍会盖住中心区的文字,需要压在它们上面。 */
.mp-dice.rolling{
  --mp-roll-zoom:2;
  position:relative;z-index:6;
  transform:scale(var(--mp-roll-zoom));
  transition:none;                              /* 明确禁用过渡:放大必须是瞬时切换 */
  animation:mpRollShake .28s ease-in-out infinite;   /* 只晃角度,尺寸不变 */
}
@keyframes mpRollShake{
  0%,100%{transform:rotate(-5deg) scale(var(--mp-roll-zoom,2))}
  50%    {transform:rotate(5deg)  scale(var(--mp-roll-zoom,2))}
}
.mp-roll{font-size:16px;font-weight:800;padding:12px 32px;border-radius:999px;box-shadow:0 4px 0 rgba(30,138,69,.5)}
.mp-roll:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 5px 0 rgba(30,138,69,.5)}
.mp-roll:not(:disabled):active{transform:translateY(2px);box-shadow:0 2px 0 rgba(30,138,69,.5)}
.mp-roll:disabled{opacity:.55;cursor:default;transform:none!important;box-shadow:none}
/* 提示条:半透明白胶囊,压在任何主题场地上都可读 */
.mp-hint{font-size:11.5px;color:var(--text-2);line-height:1.6;max-width:250px;
  background:rgba(255,255,255,.72);border-radius:9px;padding:3px 10px}
[data-theme="dark"] .mp-hint{background:rgba(20,24,30,.6)}

.mp-side{flex:0 0 300px;display:flex;flex-direction:column;gap:12px;min-width:0}
/* 侧栏卡片标题:标题后接一条渐隐分隔线 */
.mp-side-t{font-weight:800;font-size:13px;margin-bottom:10px;display:flex;align-items:center;gap:8px;letter-spacing:.3px}
.mp-side-t::after{content:'';flex:1;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--line-soft),rgba(0,0,0,0))}
.mp-score-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:12px;background:var(--panel);border:2px solid transparent;transition:.15s}
.mp-score-row.cur{border-color:var(--primary);background:var(--primary-light)}
.mp-score-row .nm{flex:1;min-width:0;font-size:13px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-score-row .sc{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--title);text-shadow:0 1px 0 rgba(255,255,255,.6)}
.mp-bar{height:6px;border-radius:6px;background:var(--track);overflow:hidden;margin:4px 0 8px;box-shadow:inset 0 1px 2px rgba(51,65,79,.10)}
.mp-bar i{display:block;height:100%;border-radius:6px;transition:width .35s;box-shadow:inset 0 -2px 0 rgba(0,0,0,.08)}
.mp-set{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px;font-size:12px;color:var(--text-2)}
.mp-mini{display:inline-flex;align-items:center;gap:5px;font-family:inherit;font-size:12px;font-weight:700;padding:5px 10px;border-radius:9px;border:2px solid var(--border);background:var(--card);color:var(--text);cursor:pointer;transition:.15s;max-width:100%}
.mp-mini:hover{border-color:var(--primary)}
.mp-mini.on{background:var(--primary-light);border-color:var(--primary);color:var(--on-pl)}
.mp-log{max-height:160px;overflow-y:auto;font-size:12px;color:var(--text-2);line-height:1.6}
.mp-log div{padding:4px 2px;border-bottom:1px dashed var(--line-soft)}
.mp-log div:first-child{color:var(--text);font-weight:600;background:var(--panel);border-radius:8px;padding:4px 8px;border-bottom:none;animation:mpLogIn .25s ease-out}
@keyframes mpLogIn{0%{opacity:0;transform:translateY(-4px)}100%{opacity:1;transform:none}}

/* ---- 任务卡:头部横幅 + 计时胶囊 ---- */
.mp-card-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;padding:10px 14px;border-radius:14px;
  background:linear-gradient(135deg,var(--primary-light),var(--blue-bg));border:2px solid var(--outline-soft);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55)}
.mp-card.is-team .mp-card-head{background:linear-gradient(135deg,var(--orange-bg),var(--pink-bg))}
.mp-card-ico{font-size:36px;line-height:1;flex-shrink:0;filter:drop-shadow(0 2px 0 rgba(51,65,79,.18))}
.mp-card-team{font-size:12px;color:var(--text-2);display:flex;align-items:center;gap:5px;margin-bottom:3px}
.mp-card-name{font-size:17px;font-weight:800;color:var(--title);line-height:1.3}
.mp-card-meta{font-size:12.5px;color:var(--text-2);margin-bottom:8px}
.mp-card-eq{font-size:12.5px;color:var(--muted-warm);font-weight:700;margin-bottom:6px}
.mp-card-tip{font-size:12.5px;color:var(--text);background:var(--ai-bg);border-radius:10px;padding:9px 12px;line-height:1.7}
.mp-timer-row{display:flex;align-items:center;gap:8px;margin-top:12px}
.mp-timer{font-size:26px;font-weight:800;color:var(--title);font-variant-numeric:tabular-nums;min-width:72px;text-align:right;
  background:var(--panel);border:2px solid var(--outline-soft);border-radius:12px;padding:2px 10px;box-shadow:inset 0 2px 4px rgba(51,65,79,.06)}
.mp-timer.hot{color:var(--danger-text);border-color:var(--pink-line);animation:mpTimerHot .8s ease-in-out infinite}
@keyframes mpTimerHot{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
.mp-timer.over{font-size:18px;color:var(--danger-text)}

.mp-win{text-align:center;padding:6px 0 2px}
.mp-win-ico{font-size:52px;line-height:1;animation:mpWinPop .6s cubic-bezier(.34,1.56,.64,1)}
@keyframes mpWinPop{0%{transform:scale(0) rotate(-18deg)}100%{transform:scale(1) rotate(0)}}
.mp-crown{font-size:12px;line-height:1;display:inline-block;animation:mpCrownSwing 1.8s ease-in-out infinite;transform-origin:50% 0}
@keyframes mpCrownSwing{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
.mp-win-name{font-size:20px;font-weight:800;color:var(--title);margin-top:6px}
.mp-win-sub{font-size:12.5px;color:var(--text-2);margin-top:4px}

/* 自定义任务:管理列表行 + 表单预览 */
.mpc-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--panel);border:2px solid var(--border);margin-bottom:6px;flex-wrap:wrap}
.mpc-row .ico{font-size:20px;width:26px;text-align:center;flex-shrink:0;line-height:1}
.mpc-row .nm{font-size:13px;font-weight:700;word-break:break-all}
.mpc-row .meta{font-size:11.5px;color:var(--text-2);margin-top:1px}
.mpc-prev{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:var(--ai-bg);border:2px dashed var(--ai-line);font-size:12.5px;color:var(--text);line-height:1.6}
.mpc-tile{width:64px;height:64px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:9px;border:2px solid var(--border);background:var(--panel);overflow:hidden;text-align:center}
.mpc-tile .mp-lb{font-size:11px}

/* 减少动态:只关掉晃动、弹跳与落地回弹。放大是 .rolling 的 transform(不是动画),所以依然生效;
   翻面也照常(那是 JS 写进立方体的 transform 补间) */
@media(prefers-reduced-motion:reduce){.mp-dice.rolling{animation:none}}
@media(prefers-reduced-motion:reduce){
  .mp-dice.rolling .mp-dice-hop,.mp-dice.rolling .mp-dice-shadow,.mp-dice.bounce .mp-dice-hop{animation:none}
}
@media (max-width:900px){
  .mp-stage{flex-direction:column}
  .mp-board{max-width:100%;width:100%;gap:3px;padding:6px}
  .mp-ico{font-size:12px}
  .mp-lb{font-size:8px}
  .mp-dice{--mp-die-size:54px;perspective:380px}   /* 小屏:整颗骰子连带透视距离一起收 */
  .mp-center{gap:6px;padding:6px}
  .mp-dir{width:13px;height:13px;font-size:6.5px}
  .mp-turn{padding:3px 10px}
  .mp-turn b{font-size:15px}
  .mp-roll{font-size:14px;padding:10px 20px}
  .mp-hint{font-size:10px;max-width:100%}
  .mp-side{flex:1 1 auto;width:100%}
  .mp-meta{order:3}
}

/* =====================================================================
   运动大富翁 · 界面 2.0(卡通运动会 / 贴纸质感)
   - 棋子 .mpp(队徽底座 + 运动形象)绝对定位在 .mp-pieces 层,transform 由 rAF 驱动
   - 主题 .mp-board[data-mp-theme=...] 只改底色/纹理/中心装饰,不重排 24 格
   - 特效 .mpfx-* 由 js/monopoly/fx.js 挂在棋盘内,pointer-events:none
   ===================================================================== */

/* ---- 顶部按钮文字:平板及以下收成图标(触摸目标仍 ≥40px) ---- */
.mp-tx{margin-left:3px}

/* ---- 棋盘主题:底色 + 纹理(浅色) ----
   主题必须「一眼可辨」:格缝/外沿是饱和的主题色(格子只留 5px 缝,浅色根本看不见),
   中心场地由各主题单独绘制(见下方 .mp-center 主题规则) */
.mp-board{position:relative;touch-action:manipulation}
.mp-board[data-mp-theme="track"]{background:
  repeating-linear-gradient(180deg,rgba(255,255,255,.35) 0 2px,transparent 2px 16px),
  #D96C3F}
.mp-board[data-mp-theme="gym"]{background:
  repeating-linear-gradient(90deg,rgba(51,65,79,.12) 0 2px,transparent 2px 22px),
  #D8A55E}
.mp-board[data-mp-theme="campus"]{background:
  radial-gradient(rgba(255,255,255,.45) 1.4px,transparent 1.6px) 0 0/16px 16px,
  #79C163}
.mp-board[data-mp-theme="ocean"]{background:
  repeating-linear-gradient(180deg,rgba(255,255,255,.28) 0 2px,transparent 2px 12px),
  #3E97D6}
/* ---- 中心场地:随主题画成真正的场地 ----
   最上层统一是一块半透明白色「舞台」圆,保证骰子/按钮/提示文字在任何主题上都可读 */
.mp-board[data-mp-theme="track"] .mp-center{background:
  radial-gradient(circle at 50% 50%,rgba(255,255,255,.92) 0 21%,rgba(255,255,255,0) 22%),
  repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.85) 0 2px,rgba(255,255,255,0) 2px 20px),
  linear-gradient(180deg,#E8834E,#DE6E38)}
.mp-board[data-mp-theme="gym"] .mp-center{background:
  radial-gradient(circle at 50% 50%,rgba(255,255,255,.9) 0 20%,rgba(255,255,255,0) 21%),
  repeating-radial-gradient(circle at 50% 50%,rgba(51,65,79,.22) 0 2px,rgba(51,65,79,0) 2px 22px),
  repeating-linear-gradient(90deg,rgba(51,65,79,.10) 0 2px,rgba(51,65,79,0) 2px 26px),
  linear-gradient(180deg,#E9BD7E,#DDA65C)}
.mp-board[data-mp-theme="campus"] .mp-center{background:
  radial-gradient(circle at 50% 56%,rgba(255,255,255,.9) 0 20%,rgba(255,255,255,0) 21%),
  radial-gradient(42px 15px at 24% 14%,rgba(255,255,255,.95),rgba(255,255,255,0) 65%),
  radial-gradient(34px 12px at 74% 11%,rgba(255,255,255,.9),rgba(255,255,255,0) 65%),
  linear-gradient(180deg,#9ED4F5 0%,#C4E8A0 52%,#8CC96A 100%)}
.mp-board[data-mp-theme="ocean"] .mp-center{background:
  radial-gradient(circle at 50% 50%,rgba(255,255,255,.9) 0 20%,rgba(255,255,255,0) 21%),
  repeating-radial-gradient(ellipse 62px 26px at 50% 58%,rgba(255,255,255,0) 0 14px,rgba(255,255,255,.32) 14px 17px),
  linear-gradient(180deg,#6FC4EC 0%,#3E97D6 100%)}
/* ---- 棋盘主题:深色模式(压暗的主题色,保持可辨) ---- */
[data-theme="dark"] .mp-board[data-mp-theme="track"]{background:
  repeating-linear-gradient(180deg,rgba(255,255,255,.14) 0 2px,transparent 2px 16px),#8A4626}
[data-theme="dark"] .mp-board[data-mp-theme="gym"]{background:
  repeating-linear-gradient(90deg,rgba(51,65,79,.35) 0 2px,transparent 2px 22px),#8A6A3A}
[data-theme="dark"] .mp-board[data-mp-theme="campus"]{background:
  radial-gradient(rgba(255,255,255,.25) 1.4px,transparent 1.6px) 0 0/16px 16px,#4E7A3E}
[data-theme="dark"] .mp-board[data-mp-theme="ocean"]{background:
  repeating-linear-gradient(180deg,rgba(255,255,255,.16) 0 2px,transparent 2px 12px),#2C6086}
[data-theme="dark"] .mp-board[data-mp-theme="track"] .mp-center{background:
  radial-gradient(circle at 50% 50%,rgba(20,24,30,.88) 0 21%,rgba(20,24,30,0) 22%),
  repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.30) 0 2px,rgba(255,255,255,0) 2px 20px),
  linear-gradient(180deg,#7A3E23,#6E3620)}
[data-theme="dark"] .mp-board[data-mp-theme="gym"] .mp-center{background:
  radial-gradient(circle at 50% 50%,rgba(20,24,30,.88) 0 20%,rgba(20,24,30,0) 21%),
  repeating-radial-gradient(circle at 50% 50%,rgba(255,255,255,.28) 0 2px,rgba(255,255,255,0) 2px 22px),
  repeating-linear-gradient(90deg,rgba(0,0,0,.18) 0 2px,transparent 2px 26px),
  linear-gradient(180deg,#8A6A3A,#7A5C30)}
[data-theme="dark"] .mp-board[data-mp-theme="campus"] .mp-center{background:
  radial-gradient(circle at 50% 56%,rgba(20,24,30,.88) 0 20%,rgba(20,24,30,0) 21%),
  radial-gradient(42px 15px at 24% 14%,rgba(255,255,255,.55),rgba(255,255,255,0) 65%),
  radial-gradient(34px 12px at 74% 11%,rgba(255,255,255,.5),rgba(255,255,255,0) 65%),
  linear-gradient(180deg,#3C6A8C 0%,#4E7A3E 100%)}
[data-theme="dark"] .mp-board[data-mp-theme="ocean"] .mp-center{background:
  radial-gradient(circle at 50% 50%,rgba(20,24,30,.88) 0 20%,rgba(20,24,30,0) 21%),
  repeating-radial-gradient(ellipse 62px 26px at 50% 58%,rgba(255,255,255,0) 0 14px,rgba(255,255,255,.22) 14px 17px),
  linear-gradient(180deg,#2C6086,#204E70)}

/* ---- 格子:难度小圆点(1★绿 / 2★橙 / 3★红,色相之外的第二区分通道) / 落格脉冲 ---- */
.mp-stars{font-size:5px;line-height:1;letter-spacing:1.5px;color:var(--outline-soft)}
.mp-diff-1{color:var(--primary-mid)}
.mp-diff-2{color:var(--accent)}
.mp-diff-3{color:var(--coral)}
.mp-tile.hit{animation:mpHit .5s ease-out}
@keyframes mpHit{
  0%{transform:scale(1)}
  35%{transform:scale(1.12);box-shadow:0 0 0 4px var(--primary-light)}
  100%{transform:scale(1)}
}

/* ---- 棋盘中心:主题徽章(白底圆徽,主题切换的显眼标识) ---- */
.mp-center{position:relative;z-index:2}
.mp-center-deco{position:absolute;top:8px;right:10px;width:40px;height:40px;font-size:23px;line-height:1;
  display:flex;align-items:center;justify-content:center;pointer-events:none;
  background:rgba(255,255,255,.88);border:2px solid var(--outline-soft);border-radius:50%;
  box-shadow:0 2px 0 var(--outline-soft)}
[data-theme="dark"] .mp-center-deco{background:rgba(20,24,30,.75)}

/* ---- 棋子:圆形队徽底座 + 运动形象 ---- */
.mp-pieces{position:absolute;inset:0;pointer-events:none;z-index:3}
.mpp{position:absolute;left:0;top:0;width:0;height:0;display:flex;align-items:center;justify-content:center;
  pointer-events:none;will-change:transform}
.mpp-inner{position:relative;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%}
.mpp-badge{position:absolute;inset:0;border-radius:50%;border:2px solid var(--outline);
  box-shadow:0 2px 0 rgba(51,65,79,.35),0 0 0 2px rgba(255,255,255,.85)}
[data-theme="dark"] .mpp-badge{box-shadow:0 2px 0 rgba(0,0,0,.45),0 0 0 2px rgba(0,0,0,.45)}
.mpp-face{position:relative;font-size:13px;line-height:1;transform:translateY(-1px)}
.mpp.active .mpp-badge{animation:mpGlow 1.5s ease-in-out infinite}
@keyframes mpGlow{
  0%,100%{box-shadow:0 2px 0 rgba(51,65,79,.35),0 0 0 2px rgba(255,255,255,.85)}
  50%{box-shadow:0 2px 0 rgba(51,65,79,.35),0 0 0 5px var(--primary-light)}
}
.mpp-land{animation:mpLand .3s cubic-bezier(.34,1.56,.64,1)}
@keyframes mpLand{
  0%{transform:scaleY(.78) scaleX(1.16)}
  55%{transform:scaleY(1.14) scaleX(.9)}
  100%{transform:scaleY(1) scaleX(1)}
}
.mpp-nope{animation:mpNope .4s ease-in-out}
@keyframes mpNope{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-4px)}
  45%{transform:translateX(4px)}
  70%{transform:translateX(-3px)}
}
/* 换装预览里的棋子(脱离定位层,给固定尺寸) */
.mpp-demo{width:34px;height:34px;position:static;transform:none;flex-shrink:0}
.mpp-demo .mpp-inner{width:30px;height:30px}
.mpp-demo .mpp-face{font-size:17px}

/* ---- 计分板:徽记 / 皇冠 / 连击 / 道具 ---- */
.mp-badge{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;
  border-radius:50%;font-size:11px;line-height:1;border:2px solid var(--outline);
  box-shadow:1px 1px 0 rgba(51,65,79,.25)}
.mp-crown{font-size:12px;line-height:1}
.mp-combo{font-size:10px;font-weight:800;color:var(--accent);background:var(--orange-bg);
  border:1px solid var(--orange-line);border-radius:8px;padding:1px 5px;line-height:1.5}
.mp-bag{font-size:10px;font-weight:800;color:var(--primary-dark);background:var(--primary-light);
  border:1px solid var(--ok-line);border-radius:8px;padding:1px 5px;line-height:1.5}
.mp-score-row.cur{animation:mpRowPulse 1.7s ease-in-out infinite}
@keyframes mpRowPulse{0%,100%{box-shadow:inset 0 0 0 0 transparent}50%{box-shadow:inset 3px 0 0 var(--primary)}}

/* ---- 事件卡 / 获胜面板:弹入 ---- */
.mp-card{animation:mpCardIn .34s cubic-bezier(.34,1.56,.64,1)}
.mp-win{animation:mpCardIn .4s cubic-bezier(.34,1.56,.64,1)}
@keyframes mpCardIn{0%{opacity:0;transform:translateY(16px) scale(.94)}100%{opacity:1;transform:none}}

/* ---- 队伍与道具面板 ---- */
.mp-team-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.mp-team{border:2px solid var(--border);border-radius:12px;background:var(--panel);padding:8px;transition:.15s}
.mp-team.cur{border-color:var(--primary);background:var(--primary-light)}
.mp-team-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mp-team-face{font-size:16px;line-height:1}
.mp-bag-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:6px}
.mp-bag-t{font-size:11px;font-weight:800;color:var(--text-2)}
.mp-bag-empty{font-size:10.5px;color:var(--text-2);line-height:1.5;
  background:repeating-linear-gradient(45deg,transparent 0 5px,var(--gridline) 5px 10px);
  border:1px dashed var(--line-soft);border-radius:8px;padding:3px 7px}
.mp-prop{display:inline-flex;align-items:center;gap:3px;font-family:inherit;font-size:11px;font-weight:700;
  padding:4px 8px;border-radius:9px;border:2px solid var(--outline);background:var(--card);color:var(--text);
  cursor:pointer;transition:.15s;box-shadow:1px 1px 0 rgba(51,65,79,.18)}
.mp-prop:hover{transform:translateY(-1px)}
.mp-prop:active{transform:translate(1px,1px);box-shadow:none}
.mp-prop.off{opacity:.45;cursor:default;filter:grayscale(1)}
.mp-prop:disabled{opacity:.45;cursor:default}
.mp-card-props{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:10px;padding-top:9px;
  border-top:1px dashed var(--line-soft)}
.mp-card-props-t{font-size:11.5px;font-weight:800;color:var(--text-2);margin-right:2px}

/* ---- 主题选择弹窗 ---- */
.mp-theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:8px}
.mp-theme{display:flex;flex-direction:column;align-items:center;gap:3px;font-family:inherit;padding:12px 8px;
  border:2px solid var(--outline);border-radius:14px;background:var(--card);cursor:pointer;transition:.15s;
  box-shadow:2px 2px 0 rgba(51,65,79,.16)}
.mp-theme:hover{transform:translateY(-2px)}
.mp-theme.on{border-color:var(--primary);background:var(--primary-light);box-shadow:3px 3px 0 rgba(51,65,79,.2)}
.mp-theme-sw{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:19px;border:2px solid var(--outline)}
/* 主题选择器的色板与实际棋盘配色一致(跑道红 / 木地板 / 蓝天草地 / 海蓝) */
.mp-theme-sw-track{background:#D96C3F}
.mp-theme-sw-gym{background:#D8A55E}
.mp-theme-sw-campus{background:linear-gradient(180deg,#9ED4F5 50%,#8CC96A 50%)}
.mp-theme-sw-ocean{background:#3E97D6}
[data-theme="dark"] .mp-theme-sw-track{background:#8A4626}
[data-theme="dark"] .mp-theme-sw-gym{background:#8A6A3A}
[data-theme="dark"] .mp-theme-sw-campus{background:linear-gradient(180deg,#3C6A8C 50%,#4E7A3E 50%)}
[data-theme="dark"] .mp-theme-sw-ocean{background:#2C6086}
.mp-theme-nm{font-size:13px;font-weight:800;color:var(--title)}
.mp-theme-ds{font-size:10.5px;color:var(--text-2)}

/* ---- 换装:队色色板 + 预览 ---- */
.mp-swatch-grid{display:flex;gap:6px;flex-wrap:wrap}
.mp-swatch{width:24px;height:24px;border-radius:8px;border:2px solid var(--outline);cursor:pointer;padding:0;transition:.15s}
.mp-swatch:hover{transform:scale(1.12)}
.mp-swatch.on{box-shadow:0 0 0 3px var(--primary-light),2px 2px 0 rgba(51,65,79,.3);transform:scale(1.08)}
.mp-team-preview{display:flex;align-items:center;gap:12px;margin:10px 0;padding:12px;border-radius:12px;
  background:var(--ai-bg);border:2px dashed var(--ai-line)}
.mp-team-prev-t{font-size:13px;font-weight:800;color:var(--title)}

/* ---- 特效层:粒子 / 飘字 / 拖尾 / 震动 ---- */
.mpfx-layer{position:absolute;inset:0;pointer-events:none;z-index:6;overflow:visible}
.mpfx-p{position:absolute;font-size:13px;line-height:1;opacity:0;will-change:transform,opacity}
.mpfx-burst{animation:mpfxBurst var(--dur,760ms) cubic-bezier(.16,.84,.44,1) forwards}
@keyframes mpfxBurst{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.4) rotate(0deg)}
  14%{opacity:1}
  100%{opacity:0;transform:translate(calc(-50% + var(--dx,0px)),calc(-50% + var(--dy,0px))) scale(1.05) rotate(var(--rot,0deg))}
}
.mpfx-float{position:absolute;font-weight:800;opacity:0;white-space:nowrap;
  text-shadow:1px 1px 0 rgba(51,65,79,.35);will-change:transform,opacity}
.mpfx-float{animation:mpfxFloat var(--dur,900ms) ease-out forwards}
@keyframes mpfxFloat{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}
  18%{opacity:1;transform:translate(-50%,-62%) scale(1.12)}
  100%{opacity:0;transform:translate(-50%,-170%) scale(1)}
}
.mpfx-trail{position:absolute;width:9px;height:9px;border-radius:50%;opacity:.75;
  border:1.5px solid rgba(255,255,255,.8);animation:mpfxTrail .42s ease-out forwards}
@keyframes mpfxTrail{0%{opacity:.8;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(.2)}}
.mpfx-shake{animation:mpfxShake .46s ease-in-out}
@keyframes mpfxShake{
  0%,100%{transform:translate(0,0) rotate(0)}
  20%{transform:translate(-3px,1px) rotate(-.4deg)}
  45%{transform:translate(3px,-1px) rotate(.4deg)}
  70%{transform:translate(-2px,0) rotate(-.2deg)}
}

/* ---- 事件大弹窗:加分/休息/再掷等,棋盘正中央的大卡片(替代右上角 toast) ----
   覆盖层本身 pointer-events:none,不挡棋盘;点卡片立即跳过 */
.mp-pop{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:9;pointer-events:none}
.mp-pop-card{pointer-events:auto;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;
  min-width:210px;max-width:76%;padding:18px 30px;border-radius:20px;background:var(--card);
  border:3px solid var(--outline);box-shadow:0 6px 0 var(--outline-soft),0 18px 44px rgba(51,65,79,.30);
  animation:mpPopIn .38s cubic-bezier(.34,1.56,.64,1);text-align:center}
.mp-pop-card.out{animation:mpPopOut .3s ease-in forwards}
@keyframes mpPopIn{0%{opacity:0;transform:scale(.55) translateY(14px)}100%{opacity:1;transform:none}}
@keyframes mpPopOut{to{opacity:0;transform:scale(.86)}}
.mp-pop-ico{font-size:42px;line-height:1;filter:drop-shadow(0 2px 0 rgba(51,65,79,.18))}
.mp-pop-t{font-size:20px;font-weight:800;color:var(--title);line-height:1.3}
.mp-pop-s{font-size:13px;font-weight:700;color:var(--text-2);line-height:1.45}
/* 五种事件色调:金=奖励 绿=完成 蓝=前进 红=后退 灰=休息/未完成 */
.mp-pop-gold .mp-pop-card{background:linear-gradient(180deg,#FFF4CF,var(--card) 82%);border-color:var(--sun)}
.mp-pop-gold .mp-pop-ico{filter:drop-shadow(0 2px 0 rgba(240,217,138,.6))}
.mp-pop-green .mp-pop-card{background:linear-gradient(180deg,var(--ok-bg),var(--card) 82%);border-color:var(--primary-mid)}
.mp-pop-blue .mp-pop-card{background:linear-gradient(180deg,var(--blue-bg),var(--card) 82%);border-color:var(--sky)}
.mp-pop-coral .mp-pop-card{background:linear-gradient(180deg,var(--pink-bg),var(--card) 82%);border-color:var(--coral)}
.mp-pop-gray .mp-pop-card{background:linear-gradient(180deg,var(--panel),var(--card) 82%);border-color:var(--outline-soft)}
[data-theme="dark"] .mp-pop-gold .mp-pop-card{background:linear-gradient(180deg,rgba(255,217,61,.16),var(--card) 82%)}
[data-theme="dark"] .mp-pop-green .mp-pop-card{background:linear-gradient(180deg,rgba(87,208,138,.14),var(--card) 82%)}
[data-theme="dark"] .mp-pop-blue .mp-pop-card{background:linear-gradient(180deg,rgba(61,155,255,.14),var(--card) 82%)}
[data-theme="dark"] .mp-pop-coral .mp-pop-card{background:linear-gradient(180deg,rgba(255,107,107,.14),var(--card) 82%)}
@media (max-width:900px){
  .mp-pop-card{min-width:160px;padding:14px 20px;border-radius:16px}
  .mp-pop-ico{font-size:32px}
  .mp-pop-t{font-size:16px}
  .mp-pop-s{font-size:11.5px}
}

/* ---- 手机吸底掷骰条(默认隐藏,≤900px 显示) ---- */
.mp-dock{display:none}

/* ---- 「减少动态效果」:全部降级(结算逻辑不变,只是不做动画) ---- */
@media(prefers-reduced-motion:reduce){
  .mp-dice.rolling{animation:none}
  .mp-dice.rolling .mp-dice-hop,.mp-dice.rolling .mp-dice-shadow,.mp-dice.bounce .mp-dice-hop{animation:none}
  .mpp.active .mpp-badge,.mp-score-row.cur,.mp-tile.hit,.mp-tile.cur,.mp-card,.mp-win{animation:none}
  .mpp-land,.mpp-nope,.mpfx-shake,.mp-win-ico,.mp-crown,.mp-log div:first-child,.mp-timer.hot{animation:none}
  .mp-pop-card{animation:none}
  .mp-pop.out{display:none}
  .mpfx-p,.mpfx-float,.mpfx-trail{display:none}
  .mp-theme:hover,.mp-prop:hover,.mp-swatch:hover,.mp-tile:hover,.mp-roll:not(:disabled):hover{transform:none}
}

/* ---- 平板(900~1200px):棋盘占主区、侧栏收窄 ---- */
@media (max-width:1200px){
  .mp-side{flex:0 0 264px}
  .mp-board{max-width:560px}
  .mp-tx{display:none}
  .mp-top-right .btn{padding:6px 10px}
}

/* ---- 大屏投屏(≥1600px):字号整体上调,后排学生可读 ---- */
@media (min-width:1600px){
  .mp-board{max-width:760px}
  .mp-turn b{font-size:22px}
  .mp-dice{--mp-die-size:86px;perspective:600px}   /* 大屏投屏:骰子跟着放大,透视同步拉远 */
  .mpp-inner{width:26px;height:26px}
  .mpp-face{font-size:15px}
}

/* ---- 手机(≤900px):纵向单列 + 吸底掷骰条 ---- */
@media (max-width:900px){
  .mp-dock{display:flex;position:sticky;bottom:8px;z-index:20;align-items:center;gap:10px;
    padding:8px 10px;margin-top:10px;border:2px solid var(--outline);border-radius:14px;
    background:var(--card);box-shadow:var(--shadow-lift)}
  .mp-dock-turn{flex:1;min-width:0;font-size:13px;font-weight:800;color:var(--title);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mp-dock .mp-roll{flex:0 0 auto;padding:12px 24px;min-height:44px}
  .mp-stars{display:none}
  .mp-center-deco{width:30px;height:30px;font-size:17px;top:4px;right:5px}
  .mp-badge{width:17px;height:17px;font-size:9.5px}
  .mpp-inner{width:17px;height:17px}
  .mpp-face{font-size:10px}
  .mp-prop{min-height:32px}
  .mp-card-props .mp-prop{padding:8px 10px;min-height:40px}
  .mp-team-list{gap:6px}
}

/* ---- 小屏(≤560px):再降一档 ---- */
@media (max-width:560px){
  .mp-lb{font-size:8.5px}
  .mp-ico{font-size:11px}
  .mp-dir{display:none}
  .mp-dice{--mp-die-size:48px;perspective:330px}
  .mp-prop{font-size:10px;padding:5px 7px;min-height:36px}
  .mp-card-props .mp-prop{padding:7px 9px;min-height:40px}
  .mp-theme-grid{grid-template-columns:repeat(2,1fr)}
}

/* ---- 手机横屏:高度受限时改回双栏,最大化棋盘 ---- */
@media (max-width:900px) and (orientation:landscape) and (max-height:560px){
  .mp-stage{flex-direction:row}
  .mp-side{flex:0 0 240px}
  .mp-dock{position:static}
}

/* =====================================================================
   工具栏 · 随手计(独立于体测的计时工具;计时 UI 复用 .st-*,页签复用 .ftab)
   ===================================================================== */
/* 名单勾选网格(发起计时) */
.qt-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;
  max-height:300px;overflow:auto;padding:2px;-webkit-overflow-scrolling:touch}
.qt-pick-item{display:flex;align-items:center;gap:6px;padding:7px 9px;font-size:13px;
  border:2px solid var(--border);border-radius:10px;background:var(--input-bg);cursor:pointer;transition:.15s}
.qt-pick-item:hover{border-color:var(--primary)}
.qt-pick-item.on{border-color:var(--primary);background:var(--primary-light)}
.qt-pick-item input[type=checkbox]{width:15px;height:15px;accent-color:var(--primary);flex-shrink:0;margin:0;cursor:pointer}
/* 卡内两行:姓名行永不截断(长学号挤压姓名的修复);学号行超长省略号,悬停可看全号 */
.qt-pick-item .qt-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.qt-pick-item .qt-nm{font-size:13.5px;color:var(--title);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qt-meta{display:flex;align-items:center;gap:6px;min-width:0}
.qt-no{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;
  font-size:11px;color:var(--text-2);font-variant-numeric:tabular-nums}
/* 计时表格里的姓名:点姓名标记/取消请假(回填成绩改由「道次」触发) */
.qt-name{cursor:pointer}
.qt-name:hover{color:var(--primary)}
/* 场次记录卡 */
.qt-sess{margin-top:10px}
@media (max-width:900px){
  .qt-pick{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));max-height:240px}
  .qt-pick-item{padding:9px;font-size:14px}
}