/* =====================================================================
 * 教学资源实训平台 · 演示界面样式  V3.0
 * 视觉基调：深空科技（默认）· 立体分层 · 玻璃拟态 · 发光强调
 *           可一键切换「浅色工程图纸」主题（评标投影/打印友好）
 * ===================================================================== */

/* ============ 主题 1：深空科技（默认） ============ */
:root{
  color-scheme:dark;
  --ink:#dae7f5;
  --ink-strong:#f4f9ff;
  --sub:#8ba4bf;
  --faint:#5d7691;
  --line:rgba(112,172,230,.22);
  --line2:rgba(112,172,230,.11);

  --navy:#2f9bff;             /* 科技蓝 · 主操作 */
  --navy-d:#8cc8ff;           /* 主色高亮文字 */
  --navy-bg:rgba(47,155,255,.12);

  --orange:#ff8a3d;           /* 工程橙 · 当前/演示项 */
  --orange-bg:rgba(255,138,61,.13);
  --orange-ink:#ffb37a;

  --ok:#38d39f;
  --warn:#ffbe4d;
  --danger:#ff6b7a;

  --bg:#04070d;
  --card:rgba(13,22,35,.82);
  --card-solid:#0d1623;
  --hover:rgba(120,190,255,.07);
  --radius:6px;
  --mono:"JetBrains Mono","Cascadia Mono",Consolas,"SFMono-Regular",monospace;

  --bevel:inset 0 1px 0 rgba(255,255,255,.07), inset 0 -1px 0 rgba(0,0,0,.35);
  --shadow:0 1px 0 rgba(255,255,255,.05) inset, 0 10px 26px -8px rgba(0,0,0,.75), 0 2px 8px rgba(0,0,0,.4);
  --shadow-lg:0 24px 60px -18px rgba(0,0,0,.85), 0 2px 0 rgba(255,255,255,.06) inset;
  --glow-blue:0 0 0 1px rgba(47,155,255,.35), 0 0 24px -4px rgba(47,155,255,.45);
  --glow-orange:0 0 0 1px rgba(255,138,61,.4), 0 0 22px -4px rgba(255,138,61,.5);
  --grid:rgba(90,150,210,.055);
  --hud:rgba(120,200,255,.5);
}

/* ============ 主题 2：浅色工程图纸 ============ */
body.light{
  color-scheme:light;
  --ink:#22313f;
  --ink-strong:#0e3150;
  --sub:#64748b;
  --faint:#8b99a8;
  --line:#d7dee6;
  --line2:#e8edf2;

  --navy:#17456e;
  --navy-d:#0e3150;
  --navy-bg:#eef4f9;

  --orange:#d96c1e;
  --orange-bg:#fdf6ef;
  --orange-ink:#7c470f;

  --ok:#2e7d32;
  --warn:#b26a00;
  --danger:#c0392b;

  --bg:#eef1f4;
  --card:#ffffff;
  --card-solid:#ffffff;
  --hover:#f3f7fa;
  --radius:4px;

  --bevel:inset 0 1px 0 rgba(255,255,255,.9);
  --shadow:0 1px 2px rgba(23,50,77,.06), 0 4px 14px rgba(23,50,77,.05);
  --shadow-lg:0 18px 50px rgba(10,30,50,.35);
  --glow-blue:0 0 0 1px rgba(23,69,110,.25);
  --glow-orange:0 0 0 1px rgba(217,108,30,.3);
  --grid:rgba(23,69,110,.06);
  --hud:rgba(23,69,110,.45);
}

*{box-sizing:border-box; margin:0; padding:0;}
html,body{height:100%;}
body{
  font-family:"Source Han Sans SC","Noto Sans SC","Microsoft YaHei","PingFang SC",sans-serif;
  font-size:13px; color:var(--ink);
  background:var(--bg);
  display:flex; flex-direction:column; overflow:hidden;
  -webkit-font-smoothing:antialiased;
  position:relative;
}
/* 深空底纹：径向光晕 + 精密网格 */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(1100px 620px at 12% -10%, rgba(47,155,255,.16), transparent 62%),
    radial-gradient(900px 560px at 100% 0%, rgba(255,138,61,.09), transparent 60%),
    radial-gradient(800px 700px at 50% 120%, rgba(47,155,255,.10), transparent 65%);
}
body::after{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:34px 34px;
}
body.light::before{background:none;}
body.light::after{opacity:.75;}
header,main,.toast{position:relative; z-index:1;}

button{font-family:inherit;}
input,select,textarea{font-family:inherit;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-thumb{background:rgba(120,180,235,.28); border-radius:6px; border:2px solid transparent; background-clip:content-box;}
::-webkit-scrollbar-thumb:hover{background:rgba(120,180,235,.45); background-clip:content-box;}
::-webkit-scrollbar-track{background:transparent;}

/* ============ 顶栏 ============ */
header{
  flex:none; height:58px; position:relative;
  background:linear-gradient(180deg,rgba(16,28,44,.94),rgba(9,16,26,.9));
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 rgba(255,255,255,.05) inset, 0 12px 30px -18px rgba(0,0,0,.9);
  display:flex; align-items:center; gap:14px; padding:0 16px;
}
header::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg,transparent,rgba(47,155,255,.65),rgba(255,138,61,.5),transparent);
}
body.light header{background:#fff;}
body.light header::after{background:linear-gradient(90deg,transparent,rgba(23,69,110,.35),transparent);}

.logo{display:flex; align-items:center; gap:11px;}
.logo svg{display:block; filter:drop-shadow(0 0 10px rgba(47,155,255,.45));}
body.light .logo svg{filter:none;}
.logo .t{line-height:1.18;}
.logo .t b{font-size:16px; font-weight:700; color:var(--ink-strong); letter-spacing:.6px; text-shadow:0 0 18px rgba(47,155,255,.35);}
body.light .logo .t b{text-shadow:none; color:var(--navy-d);}
.logo .t span{display:block; font-size:10.5px; color:var(--sub); letter-spacing:.4px;}
.hsep{width:1px; height:26px; background:linear-gradient(180deg,transparent,var(--line),transparent);}

/* 分段切换 */
.seg{display:flex; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:rgba(0,0,0,.22);}
body.light .seg{background:#fff; border-color:#c7d2dd;}
.seg button{
  border:0; background:transparent; color:var(--sub); padding:7px 14px; font-size:12.5px; cursor:pointer;
  border-right:1px solid var(--line2); display:flex; align-items:center; gap:6px; transition:.15s;
}
.seg button:last-child{border-right:0;}
.seg button:hover{color:var(--ink); background:var(--hover);}
.seg button.on{
  background:linear-gradient(180deg,rgba(47,155,255,.34),rgba(47,155,255,.16));
  color:#fff; font-weight:600; text-shadow:0 0 12px rgba(47,155,255,.7);
  box-shadow:inset 0 0 0 1px rgba(47,155,255,.5), 0 0 18px -4px rgba(47,155,255,.7);
}
body.light .seg button.on{background:var(--navy); color:#fff; text-shadow:none; box-shadow:none;}
.mode{display:flex; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:rgba(0,0,0,.22);}
body.light .mode{background:#fff; border-color:#c7d2dd;}
.mode button{border:0; background:transparent; color:var(--sub); padding:7px 13px; font-size:12.5px; cursor:pointer; transition:.15s;}
.mode button:hover{color:var(--ink);}
.mode button.on{
  background:linear-gradient(180deg,rgba(255,138,61,.36),rgba(255,138,61,.18));
  color:#fff; font-weight:600; text-shadow:0 0 12px rgba(255,138,61,.7);
  box-shadow:inset 0 0 0 1px rgba(255,138,61,.5), 0 0 18px -4px rgba(255,138,61,.7);
}
body.light .mode button.on{background:var(--orange); color:#fff; text-shadow:none; box-shadow:none;}
.seg.role button.on{background:linear-gradient(180deg,rgba(255,138,61,.4),rgba(255,138,61,.2));}

.hspace{flex:1;}
.acct{text-align:right; line-height:1.32;}
.acct b{font-size:12.5px; color:var(--ink-strong); font-weight:600;}
.acct span{display:block; font-size:10.5px; color:var(--faint);}
.ver{font-size:10px; color:var(--faint); text-align:right; line-height:1.4; letter-spacing:.3px;}
.thbtn{
  border:1px solid var(--line); background:rgba(0,0,0,.2); color:var(--sub); border-radius:var(--radius);
  padding:6px 10px; font-size:11.5px; cursor:pointer; transition:.15s; white-space:nowrap;
}
.thbtn:hover{color:var(--navy-d); border-color:var(--navy); box-shadow:var(--glow-blue);}
body.light .thbtn{background:#fff;}

/* ============ 主体三栏 ============ */
main{
  flex:1; min-height:0; display:grid;
  grid-template-columns:200px minmax(0,1fr) 344px;
  gap:11px; padding:11px;
}
.panel{
  background:var(--card);
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow);
  display:flex; flex-direction:column; min-height:0; position:relative;
}
.panel::before{
  content:""; position:absolute; left:0; right:0; top:0; height:1px; border-radius:var(--radius) var(--radius) 0 0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);
}
.panel>h2{
  flex:none; font-size:12.5px; font-weight:700; color:var(--ink-strong); letter-spacing:1.1px;
  padding:11px 13px; border-bottom:1px solid var(--line2);
  display:flex; align-items:center; gap:8px; position:relative;
  background:linear-gradient(180deg,rgba(47,155,255,.09),transparent);
}
.panel>h2::before{
  content:""; width:3px; height:13px; border-radius:2px;
  background:linear-gradient(180deg,var(--navy),var(--orange));
  box-shadow:0 0 12px rgba(47,155,255,.8);
}
.panel>h2 .cnt{margin-left:auto; font-weight:400; font-size:11px; color:var(--faint); font-family:var(--mono);}
.panel .bd{flex:1; overflow:auto; min-height:0;}

/* ============ 左导航 ============ */
nav .mi{
  display:flex; align-items:center; gap:9px; padding:10px 12px; cursor:pointer; position:relative;
  border-left:3px solid transparent; color:var(--ink); font-size:12.6px; border-bottom:1px solid var(--line2);
  user-select:none; transition:.15s;
}
nav .mi:hover{background:var(--hover); color:var(--ink-strong);}
nav .mi.on{
  border-left-color:var(--orange);
  background:linear-gradient(90deg,rgba(255,138,61,.17),rgba(255,138,61,.02));
  color:#fff; font-weight:600;
  box-shadow:inset 0 0 22px -8px rgba(255,138,61,.55), 0 0 0 0 transparent;
}
nav .mi.on::after{
  content:""; position:absolute; right:0; top:9px; bottom:9px; width:2px;
  background:linear-gradient(180deg,transparent,var(--orange),transparent);
  box-shadow:0 0 10px rgba(255,138,61,.9);
}
body.light nav .mi.on{background:var(--orange-bg); color:var(--navy-d); box-shadow:none;}
nav .mi svg{flex:none; color:var(--faint); transition:.15s;}
nav .mi.on svg{color:var(--orange); filter:drop-shadow(0 0 6px rgba(255,138,61,.8));}
body.light nav .mi.on svg{color:var(--orange); filter:none;}
nav .mi .sc{
  margin-left:auto; font-size:9.5px; color:var(--orange-ink); border:1px solid rgba(255,138,61,.35);
  padding:1px 5px; border-radius:3px; background:rgba(255,138,61,.1); letter-spacing:.3px;
}
.navfoot{margin-top:auto; padding:11px 13px; border-top:1px solid var(--line2); font-size:11px; color:var(--sub); line-height:1.75;}
.navfoot b{color:var(--ink-strong);}
nav .phead{padding:9px 12px 4px; font-size:10px; color:var(--faint); letter-spacing:1.6px; text-transform:uppercase;}

/* ============ 3D 舞台 ============ */
#stageWrap{position:relative; flex:1; min-height:0; display:flex; flex-direction:column;}
#stage3d{
  position:relative; flex:1; min-height:0; border-radius:var(--radius); overflow:hidden;
  border:1px solid var(--line);
  background:
    radial-gradient(680px 420px at 50% 34%, rgba(47,155,255,.16), transparent 68%),
    linear-gradient(rgba(90,150,210,.09) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(90deg,rgba(90,150,210,.09) 1px,transparent 1px) 0 0/28px 28px,
    radial-gradient(120% 120% at 50% 0%, #0d1a2a, #050a12 78%);
  box-shadow:inset 0 0 90px -20px rgba(47,155,255,.32);
}
body.light #stage3d{
  border-color:#cfd9e3;
  background:
    linear-gradient(#dfe7ee 1px, transparent 1px) 0 0/26px 26px,
    linear-gradient(90deg,#dfe7ee 1px, transparent 1px) 0 0/26px 26px,
    #f4f7fa;
  box-shadow:none;
}
/* HUD 四角 */
#stage3d::before,#stage3d::after{
  content:""; position:absolute; width:20px; height:20px; pointer-events:none; z-index:3;
  border-color:var(--hud); border-style:solid; border-width:0;
}
#stage3d::before{left:9px; top:9px; border-left-width:1.5px; border-top-width:1.5px;}
#stage3d::after{right:9px; bottom:9px; border-right-width:1.5px; border-bottom-width:1.5px;}
#view{width:100%; height:100%; display:block; cursor:grab;}
#view:active{cursor:grabbing;}
/* 图签 */
.tblock{
  position:absolute; right:12px; bottom:12px; z-index:4;
  background:rgba(10,18,29,.86); border:1px solid rgba(120,200,255,.35);
  font-size:10.5px; color:var(--ink); line-height:1.5; backdrop-filter:blur(6px);
  box-shadow:0 8px 26px -10px rgba(0,0,0,.9);
}
body.light .tblock{background:rgba(255,255,255,.94); border-color:var(--navy); color:var(--navy-d);}
.tblock .r{display:flex; border-top:1px solid rgba(120,200,255,.22);}
body.light .tblock .r{border-top-color:var(--navy);}
.tblock .r:first-child{border-top:0;}
.tblock .c{padding:3px 9px; border-left:1px solid rgba(120,200,255,.22);}
body.light .tblock .c{border-left-color:var(--navy);}
.tblock .c:first-child{border-left:0;}
.tblock .c b{color:var(--orange); font-weight:700; font-family:var(--mono);}
.vp-tag{position:absolute; left:12px; top:10px; font-size:11px; color:var(--sub); z-index:4;}
.vp-tag b{color:var(--ink-strong); font-size:12.5px;}
/* 工具条 */
.stagebar{
  flex:none; display:flex; align-items:center; gap:8px; padding:9px 10px;
  background:var(--card); backdrop-filter:blur(10px);
  border:1px solid var(--line); border-radius:var(--radius); margin-top:9px; box-shadow:var(--shadow);
}
.btn{
  display:inline-flex; align-items:center; gap:6px; padding:7px 13px; font-size:12.5px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.015));
  border:1px solid var(--line); border-radius:var(--radius); color:var(--ink); cursor:pointer;
  transition:.15s; box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
}
.btn:hover{border-color:var(--navy); color:var(--navy-d); box-shadow:var(--glow-blue); transform:translateY(-1px);}
.btn:active{transform:translateY(0);}
.btn.primary{
  background:linear-gradient(180deg,#3ba6ff,#1b78d8); border-color:#4fb0ff; color:#fff; font-weight:600;
  box-shadow:0 6px 18px -6px rgba(47,155,255,.9), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn.primary:hover{background:linear-gradient(180deg,#4fb2ff,#2684e4); box-shadow:0 8px 24px -6px rgba(47,155,255,1);}
.btn.accent{
  background:linear-gradient(180deg,#ff9b52,#e4691c); border-color:#ffab6b; color:#fff; font-weight:600;
  box-shadow:0 6px 18px -6px rgba(255,138,61,.9), inset 0 1px 0 rgba(255,255,255,.32);
}
.btn.accent:hover{background:linear-gradient(180deg,#ffa963,#f0761f);}
.btn:disabled{opacity:.4; cursor:not-allowed; transform:none; box-shadow:none;}
.btn.on{border-color:var(--orange); color:var(--orange-ink); background:var(--orange-bg); font-weight:600; box-shadow:var(--glow-orange);}
body.light .btn{background:#fff; border-color:#c7d2dd; box-shadow:none;}
body.light .btn.primary{background:var(--navy); border-color:var(--navy); box-shadow:none;}
body.light .btn.accent{background:var(--orange); border-color:var(--orange); box-shadow:none;}
.stagebar .grow{flex:1;}
.stepind{font-size:12px; color:var(--sub); font-variant-numeric:tabular-nums; font-family:var(--mono);}
.stepind b{color:var(--orange); font-size:15px; text-shadow:0 0 12px rgba(255,138,61,.8);}
body.light .stepind b{text-shadow:none;}

/* ============ 右栏：步骤 ============ */
.step{border-bottom:1px solid var(--line2); padding:11px 13px; cursor:pointer; position:relative; transition:.15s;}
.step:hover{background:var(--hover);}
.step.on{background:linear-gradient(90deg,rgba(255,138,61,.15),rgba(255,138,61,.02)); box-shadow:inset 3px 0 0 var(--orange);}
body.light .step.on{background:var(--orange-bg);}
.step .hd{display:flex; align-items:baseline; gap:8px;}
.step .n{
  flex:none; width:21px; height:21px; border:1px solid var(--line); border-radius:4px;
  display:inline-flex; align-items:center; justify-content:center; background:rgba(0,0,0,.28);
  font-size:11px; color:var(--sub); font-variant-numeric:tabular-nums; font-family:var(--mono);
}
body.light .step .n{background:#fff; border-color:#b9c6d2;}
.step.on .n{background:linear-gradient(180deg,#ff9b52,#e4691c); border-color:#ffab6b; color:#fff; font-weight:700; box-shadow:0 0 14px -2px rgba(255,138,61,.95);}
.step.done .n{background:linear-gradient(180deg,#3ba6ff,#1b78d8); border-color:#4fb0ff; color:#fff;}
.step .t{font-size:12.9px; font-weight:600; color:var(--ink-strong);}
.step .p{font-size:12px; color:var(--sub); line-height:1.78; margin-top:6px; text-align:justify;}
.step .pts{
  margin-top:7px; background:rgba(47,155,255,.07); border:1px solid var(--line2);
  padding:8px 10px; border-radius:4px; border-left:2px solid rgba(47,155,255,.6);
}
body.light .step .pts{background:#f6f9fb;}
.step .pts .ph{font-size:10.5px; color:var(--navy-d); font-weight:700; letter-spacing:1.2px; margin-bottom:4px;}
.step .pts ul{list-style:none;}
.step .pts li{font-size:11.5px; color:var(--sub); line-height:1.72; padding-left:12px; position:relative;}
.step .pts li::before{content:""; position:absolute; left:1px; top:8px; width:5px; height:5px; background:var(--orange); box-shadow:0 0 8px rgba(255,138,61,.9);}
/* 关键要点视频位 */
.vidslot{margin-top:8px; border:1px dashed rgba(120,200,255,.32); border-radius:4px; background:rgba(47,155,255,.05);}
body.light .vidslot{border-color:#b9c6d2; background:#f8fafc;}
.vidslot .vh{display:flex; align-items:center; gap:7px; padding:6px 10px; font-size:11px; color:var(--navy-d); border-bottom:1px dashed var(--line);}
.vidslot .vb{aspect-ratio:16/9; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:6px; color:var(--faint); font-size:11px;}
.vidslot video{width:100%; display:block; background:#000; aspect-ratio:16/9;}
/* 考核模式提示 */
.examnote{
  margin:10px 13px; padding:10px 12px; border:1px solid rgba(255,138,61,.35); background:var(--orange-bg);
  font-size:11.5px; color:var(--orange-ink); line-height:1.72; border-radius:4px;
}
.examnote b{letter-spacing:1px;}

/* ============ 表格 ============ */
.tbl{width:100%; border-collapse:collapse; font-size:12px; margin-bottom:4px;}
.tbl th{
  background:linear-gradient(180deg,rgba(47,155,255,.18),rgba(47,155,255,.07));
  color:var(--ink-strong); font-weight:700; text-align:left;
  border:1px solid var(--line); padding:7px 9px; font-size:11.3px; letter-spacing:.5px; white-space:nowrap;
}
body.light .tbl th{background:var(--navy-bg); color:var(--navy-d); border-color:#d3dfe9;}
.tbl td{border:1px solid var(--line2); padding:7px 9px; vertical-align:top; line-height:1.62;}
.tbl tbody tr:nth-child(even) td,.tbl tr:nth-child(even) td{background:rgba(120,180,235,.035);}
body.light .tbl tr:nth-child(even) td{background:#fafcfd;}
.tbl tr:hover td{background:rgba(47,155,255,.075);}
.tbl .num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; font-family:var(--mono);}
.tbl .code{font-family:var(--mono); color:var(--navy-d); font-size:11px; white-space:nowrap;}
.tbl .spec{color:var(--sub);}
.tbl caption{caption-side:top; text-align:left; font-size:12px; font-weight:700; color:var(--ink-strong); padding:10px 13px 7px; letter-spacing:.5px;}
.tbl caption .cap-sub{font-weight:400; color:var(--faint); font-size:11px; margin-left:8px;}

/* ============ 配件 / 资源卡片 ============ */
.partcard{display:flex; gap:10px; padding:10px 12px; border-bottom:1px solid var(--line2);}
.partcard .ic{
  flex:none; width:44px; height:44px; border:1px solid var(--line); border-radius:5px;
  display:flex; align-items:center; justify-content:center; background:rgba(47,155,255,.08); color:var(--navy-d);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
body.light .partcard .ic{background:#f8fafc; color:var(--navy); border-color:#d7dee6;}
.partcard .info{flex:1; min-width:0;}
.partcard .nm{font-size:12.8px; font-weight:600; color:var(--ink-strong);}
.partcard .nm .code{font-family:var(--mono); font-size:10.5px; color:var(--faint); font-weight:400; margin-left:6px;}
.partcard .spec{font-size:11.5px; color:var(--sub); margin-top:2px;}
.partcard .note{font-size:11px; color:var(--faint); margin-top:2px; line-height:1.62;}
.partcard .qty{flex:none; align-self:center; text-align:right; font-variant-numeric:tabular-nums;}
.partcard .qty b{font-size:17px; color:var(--navy-d); font-weight:700; font-family:var(--mono); text-shadow:0 0 14px rgba(47,155,255,.5);}
body.light .partcard .qty b{text-shadow:none; color:var(--navy);}
.partcard .qty span{display:block; font-size:10px; color:var(--faint);}
.chiprow{display:flex; gap:6px; flex-wrap:wrap; padding:0 12px 10px;}
.chip{font-size:10.5px; color:var(--sub); border:1px solid var(--line); border-radius:3px; padding:2px 7px; background:rgba(0,0,0,.2);}
body.light .chip{background:#fafcfd;}

/* 资源卡网格（工具卡 / 材料卡） */
.cgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(196px,1fr)); gap:10px; padding:11px 13px;}
.rcard{
  border:1px solid var(--line); border-radius:6px; overflow:hidden; background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012));
  display:flex; flex-direction:column; transition:.2s; box-shadow:var(--shadow);
}
.rcard:hover{transform:translateY(-3px); border-color:var(--navy); box-shadow:0 16px 34px -14px rgba(0,0,0,.9), var(--glow-blue);}
body.light .rcard{background:#fff;}
.rcard .thumb{
  aspect-ratio:16/10; position:relative; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(120px 90px at 50% 40%, rgba(47,155,255,.22), transparent 70%),
    linear-gradient(160deg,rgba(47,155,255,.1),rgba(255,138,61,.07));
  border-bottom:1px solid var(--line2); color:var(--navy-d);
}
.rcard .thumb .ph2{font-size:10px; color:var(--faint); position:absolute; bottom:5px; right:7px; letter-spacing:.5px;}
.rcard .meta{padding:9px 11px;}
.rcard .meta .nm{font-size:12.6px; font-weight:600; color:var(--ink-strong);}
.rcard .meta .tag{display:inline-block; font-size:10px; color:var(--orange-ink); border:1px solid rgba(255,138,61,.35); background:rgba(255,138,61,.1); border-radius:3px; padding:0 5px; margin-top:5px;}
.rcard .meta .dsc{font-size:11px; color:var(--sub); line-height:1.66; margin-top:5px;}
.rcard .meta .kv{font-size:10.5px; color:var(--faint); margin-top:5px; line-height:1.6;}
.rcard .meta .kv b{color:var(--sub); font-weight:600;}

/* ============ 识图模块 ============ */
.drawsplit{flex:1; min-height:0; display:flex; gap:9px; padding:9px;}
.drawcard{
  flex:1.2; min-width:0; background:linear-gradient(180deg,#0b1a2c,#071120);
  border:1px solid rgba(120,200,255,.34); position:relative; display:flex; flex-direction:column;
  border-radius:5px; overflow:hidden; box-shadow:inset 0 0 60px -14px rgba(47,155,255,.5);
}
body.light .drawcard{background:#fff; border-color:var(--navy); box-shadow:none;}
.drawcard .dt{flex:none; padding:7px 11px; font-size:11.5px; color:var(--navy-d); border-bottom:1px solid rgba(120,200,255,.28); display:flex; justify-content:space-between;}
body.light .drawcard .dt{border-bottom-color:var(--navy);}
.drawcard svg{flex:1; width:100%; min-height:0; display:block;}
.drawcard .hs:hover .hot{stroke:var(--orange); fill:rgba(255,138,61,.14);}
.drawcard .hs.on .hot{stroke:var(--orange); stroke-width:2.2; fill:rgba(255,138,61,.2);}
.drawcard .hs.on{cursor:pointer;}
/* 深色主题下把图纸线色重映射为蓝印风格（CSS 覆盖 SVG 属性） */
body:not(.light) .drawcard svg [stroke="#17456e"]{stroke:#6fb6ff;}
body:not(.light) .drawcard svg [stroke="#5b7186"]{stroke:#4f7695;}
body:not(.light) .drawcard svg [stroke="#3d7ea0"]{stroke:#5fb6d8;}
body:not(.light) .drawcard svg [stroke="#9db2c4"]{stroke:#3a5f80;}
body:not(.light) .drawcard svg [stroke="#d96c1e"]{stroke:#ff9b52;}
body:not(.light) .drawcard svg [stroke="#8a6a2a"]{stroke:#d8a95c;}
body:not(.light) .drawcard svg [stroke="#7fb6cc"]{stroke:#57a8c4;}
body:not(.light) .drawcard svg [fill="#17456e"]{fill:#a9d4ff;}
body:not(.light) .drawcard svg [fill="#2c6076"]{fill:#8fd0e8;}
body:not(.light) .drawcard svg [fill="#a3560f"]{fill:#ffc38f;}
body:not(.light) .drawcard svg [fill="#8a6a2a"]{fill:#e2bb75;}
body:not(.light) .drawcard svg [fill="#64748b"]{fill:#8ba4bf;}
body:not(.light) .drawcard svg [fill="#8b99a8"]{fill:#6c86a1;}
body:not(.light) .drawcard svg [fill="rgba(23,69,110,.12)"],body:not(.light) .drawcard svg [fill="rgba(23,69,110,.10)"],
body:not(.light) .drawcard svg [fill="rgba(23,69,110,.14)"]{fill:rgba(47,155,255,.16);}
body:not(.light) .drawcard svg [fill="rgba(159,212,232,.35)"]{fill:rgba(90,190,235,.22);}
.drawlist{flex:.8; min-width:0; border:1px solid var(--line); border-radius:var(--radius); overflow:auto; background:var(--card);}
.drawlist .dli{padding:9px 12px; border-bottom:1px solid var(--line2); cursor:pointer; font-size:12px; transition:.15s;}
.drawlist .dli:hover{background:var(--hover);}
.drawlist .dli.on{background:var(--orange-bg); box-shadow:inset 3px 0 0 var(--orange);}
.drawlist .dli b{color:var(--ink-strong);}
.drawlist .dli p{font-size:11px; color:var(--sub); margin-top:3px; line-height:1.62;}

/* ============ 题目模块 ============ */
.qwrap{padding:13px 15px; overflow:auto; flex:1;}
.qhead{display:flex; align-items:center; gap:9px; margin-bottom:11px;}
.qhead .qn{font-size:11.5px; color:var(--faint); font-family:var(--mono);}
.qhead .qt{font-size:14px; font-weight:700; color:var(--ink-strong);}
.qitem{border:1px solid var(--line); border-radius:6px; margin-bottom:11px; background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.008)); box-shadow:var(--shadow);}
body.light .qitem{background:#fff;}
.qitem .qh{padding:9px 12px; font-size:12.8px; font-weight:600; color:var(--ink-strong); border-bottom:1px solid var(--line2); display:flex; gap:8px; align-items:baseline;}
.qitem .qh .idx{color:var(--orange); font-family:var(--mono); font-size:11px;}
.qitem .opts{padding:6px 0;}
.qitem label{display:flex; gap:9px; align-items:flex-start; padding:7px 13px; cursor:pointer; font-size:12.5px; line-height:1.62; transition:.12s;}
.qitem label:hover{background:var(--hover);}
.qitem input{margin-top:3px; accent-color:var(--navy);}
.qitem.right label.sel{color:var(--ok); font-weight:600;}
.qitem.wrong label.sel{color:var(--danger); font-weight:600;}
.qitem .why{
  display:none; margin:0 12px 10px; padding:8px 11px; background:rgba(47,155,255,.07);
  border-left:3px solid var(--navy); font-size:11.5px; color:var(--sub); line-height:1.72; border-radius:0 4px 4px 0;
}
body.light .qitem .why{background:#f6f9fb;}
.qitem.answered .why{display:block;}
.qbar{display:flex; gap:8px; align-items:center; padding:10px 0 2px; flex-wrap:wrap;}
.qstem{font-size:13px; line-height:1.82; padding:8px 13px 4px; color:var(--ink);}
.qitem .opts label.ro{cursor:default;}
.gscore{margin-left:auto; font-size:11.5px; color:var(--sub); font-family:var(--mono);}
.qitem.right .gscore{color:var(--ok); font-weight:600;}
.qitem.wrong .gscore{color:var(--danger); font-weight:600;}
.mk-ok{margin-left:8px; font-size:10.5px; color:var(--ok); border:1px solid rgba(56,211,159,.4); background:rgba(56,211,159,.1); padding:0 5px; border-radius:3px;}
.tagm{margin-left:8px; font-size:10.5px; color:var(--navy-d); border:1px solid rgba(47,155,255,.35); background:var(--navy-bg); padding:1px 6px; border-radius:3px; font-weight:400;}
.ordbtn{
  display:inline-flex; align-items:center; gap:7px; margin:0 8px 8px 0; padding:7px 13px;
  border:1px solid var(--line); border-radius:4px; background:rgba(0,0,0,.2); font-size:12.5px; font-family:inherit;
  color:var(--ink); cursor:pointer; transition:.15s;
}
body.light .ordbtn{background:#fff; border-color:#c7d2dd;}
.ordbtn:hover{border-color:var(--navy); box-shadow:var(--glow-blue);}
.ordbtn.picked{border-color:var(--orange); background:var(--orange-bg); color:var(--orange-ink); font-weight:600; box-shadow:var(--glow-orange);}
.ordbtn .onum{width:18px; height:18px; border-radius:3px; background:rgba(255,255,255,.1); display:inline-flex; align-items:center; justify-content:center; font-size:11px; color:var(--sub); font-variant-numeric:tabular-nums;}
body.light .ordbtn .onum{background:#eef2f6;}
.ordbtn.picked .onum{background:var(--orange); color:#fff; font-weight:700;}

/* ============ 视频题 ============ */
.vqsplit{flex:1; min-height:0; display:flex; flex-direction:column; padding:10px; gap:8px; overflow:auto;}
.vqbox{
  border:1px solid var(--line); border-radius:6px; background:#000; aspect-ratio:16/7; position:relative;
  display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; color:#7f95ab;
  box-shadow:0 0 50px -14px rgba(47,155,255,.5) inset;
}
.vqbox video{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; background:#000;}
.vqpop{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(420px,86%);
  background:linear-gradient(180deg,rgba(16,28,44,.98),rgba(10,18,30,.98));
  border:1px solid rgba(120,200,255,.4); border-top:3px solid var(--orange);
  border-radius:6px; padding:13px 15px; box-shadow:0 22px 60px rgba(0,0,0,.75); z-index:5;
}
body.light .vqpop{background:rgba(255,255,255,.98); border-color:var(--navy);}
.vqpop .qt{font-size:12.8px; font-weight:700; color:var(--ink-strong); margin-bottom:8px;}
.vqpop label{display:flex; gap:8px; padding:5px 2px; font-size:12.5px; cursor:pointer;}
.vqpop input{accent-color:var(--navy);}

/* ============ 投屏 ============ */
.castwrap{flex:1; min-height:0; display:flex; flex-direction:column; padding:10px; gap:9px; overflow:auto;}
.castgrid{flex:1; min-height:220px; display:grid; grid-template-columns:1fr 1fr; gap:9px;}
.peer{border:1px solid var(--line); border-radius:6px; display:flex; flex-direction:column; min-height:0; background:var(--card); box-shadow:var(--shadow);}
.peer .hd{flex:none; padding:7px 11px; border-bottom:1px solid var(--line2); font-size:12px; color:var(--ink-strong); display:flex; align-items:center; gap:8px; font-weight:600;}
.peer .hd .st{margin-left:auto; font-size:10.5px; color:var(--faint); font-weight:400;}
.peer .bd{flex:1; min-height:0; position:relative; background:#04070c; border-radius:0 0 6px 6px; overflow:hidden;}
.peer video{position:absolute; inset:0; width:100%; height:100%; object-fit:contain;}
.peer .ph{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#4f6a86; font-size:11.5px; flex-direction:column; gap:6px;}

/* ============ 成绩 / KPI ============ */
.scorewrap{padding:11px 13px; overflow:auto; flex:1;}
.kpis{display:flex; gap:9px; margin-bottom:12px; perspective:900px;}
.kpi{
  flex:1; border:1px solid var(--line); border-radius:6px; padding:10px 12px; position:relative; overflow:hidden;
  background:linear-gradient(160deg,rgba(47,155,255,.13),rgba(13,22,35,.9) 62%);
  box-shadow:0 12px 28px -14px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.08);
  transform:perspective(900px) rotateX(1.4deg);
}
body.light .kpi{background:#fafcfd; box-shadow:none; transform:none;}
.kpi::before{
  content:""; position:absolute; right:-24px; top:-24px; width:76px; height:76px; border-radius:50%;
  background:radial-gradient(circle,rgba(47,155,255,.3),transparent 68%);
}
.kpi .k{font-size:10px; color:var(--faint); letter-spacing:1.3px; text-transform:uppercase;}
.kpi .v{font-size:21px; font-weight:700; color:var(--ink-strong); font-variant-numeric:tabular-nums; margin-top:3px; font-family:var(--mono); text-shadow:0 0 22px rgba(47,155,255,.6);}
body.light .kpi .v{color:var(--navy-d); text-shadow:none;}
.kpi .v small{font-size:11px; color:var(--sub); font-weight:400; font-family:inherit;}
.empty{padding:26px 12px; text-align:center; color:var(--faint); font-size:12px; line-height:1.85;}

/* ============ 响应表 ============ */
.feature li{list-style:none; padding:10px 13px; border-bottom:1px solid var(--line2); display:flex; gap:10px; align-items:flex-start; cursor:pointer; transition:.15s;}
.feature li:hover{background:var(--hover); box-shadow:inset 3px 0 0 var(--navy);}
.feature .no{flex:none; font-family:var(--mono); font-size:11.5px; color:var(--orange); width:34px; padding-top:1px;}
.feature .fb{flex:1; min-width:0;}
.feature .fn{font-size:12.8px; font-weight:600; color:var(--ink-strong);}
.feature .fn .sc{margin-left:7px; font-size:10px; color:var(--orange-ink); border:1px solid rgba(255,138,61,.35); padding:1px 5px; border-radius:3px; font-weight:400;}
.feature .fr{font-size:11.5px; color:var(--sub); line-height:1.72; margin-top:3px; text-align:justify;}
.feature .fd{font-size:11px; color:var(--navy-d); margin-top:3px;}
.feature .fd::before{content:"演示路径  "; color:var(--faint); letter-spacing:1px;}

/* ============ 通用 ============ */
.hide{display:none!important;}
.toast{
  position:fixed; left:50%; bottom:38px; transform:translateX(-50%) translateY(10px);
  background:linear-gradient(180deg,rgba(20,34,52,.98),rgba(11,19,31,.98));
  color:#fff; font-size:12.5px; padding:10px 20px; border-radius:6px;
  border:1px solid rgba(120,200,255,.4);
  opacity:0; pointer-events:none; transition:.25s; z-index:99;
  box-shadow:0 18px 50px rgba(0,0,0,.75), 0 0 26px -6px rgba(47,155,255,.65);
}
body.light .toast{background:var(--navy-d); border-color:transparent; box-shadow:0 8px 24px rgba(10,30,50,.3);}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0);}
.mt8{margin-top:8px;} .mb8{margin-bottom:8px;}
.secnote{
  margin:0 13px 10px; padding:9px 12px; background:rgba(47,155,255,.08); border-left:3px solid var(--navy);
  font-size:11.5px; color:var(--ink); line-height:1.74; border-radius:0 4px 4px 0;
}
body.light .secnote{background:var(--navy-bg); color:var(--navy-d);}
.secnote b{letter-spacing:.5px; color:var(--ink-strong);}
.hintline{padding:8px 13px; font-size:11px; color:var(--faint); line-height:1.72; border-top:1px solid var(--line2);}
.hintline b{color:var(--sub);}

/* ============ 工具条 / 表单控件 ============ */
.toolbar{
  flex:none; display:flex; align-items:center; gap:8px; padding:9px 11px;
  border-bottom:1px solid var(--line2); background:rgba(47,155,255,.05); flex-wrap:wrap;
}
body.light .toolbar{background:#fafcfd;}
.toolbar .grow{flex:1;}
.sel,.inp{
  font-family:inherit; font-size:12.5px; color:var(--ink);
  background:rgba(0,0,0,.28); border:1px solid var(--line); border-radius:var(--radius); padding:6px 8px; outline:none;
  transition:.15s;
}
body.light .sel,body.light .inp{background:#fff; border-color:#c7d2dd;}
.sel{padding-right:22px;}
.sel option{background:#0d1623; color:var(--ink);}
body.light .sel option{background:#fff; color:#22313f;}
.sel:focus,.inp:focus{border-color:var(--navy); box-shadow:0 0 0 2px rgba(47,155,255,.18), 0 0 18px -6px rgba(47,155,255,.8);}
textarea.inp{width:100%; min-height:64px; resize:vertical; line-height:1.62;}
.btn.mini{padding:4px 9px; font-size:11.5px;}
.lnk{background:none; border:0; color:var(--navy-d); font-size:11.5px; cursor:pointer; padding:2px 5px; text-decoration:underline; text-underline-offset:2px; transition:.15s;}
.lnk:hover{color:var(--orange);}
.badge{
  display:inline-block; font-size:10.5px; padding:1px 7px; border-radius:3px;
  border:1px solid var(--line); background:rgba(255,255,255,.06); color:var(--sub); white-space:nowrap;
}
.badge.st-ok{background:rgba(56,211,159,.12); border-color:rgba(56,211,159,.4); color:var(--ok);}
.badge.st-wait{background:rgba(255,190,77,.12); border-color:rgba(255,190,77,.4); color:var(--warn);}
.badge.st-no{background:rgba(255,107,122,.12); border-color:rgba(255,107,122,.4); color:var(--danger);}
.badge.st-gray{background:rgba(255,255,255,.05); border-color:var(--line); color:var(--faint);}
body.light .badge.st-ok{background:#eef6ef; border-color:#b9d9bd; color:#2e7d32;}
body.light .badge.st-wait{background:#fdf6ef; border-color:#eec9a8; color:#a3560f;}
body.light .badge.st-no{background:#fdf0f0; border-color:#e8b6b6; color:#b03a3a;}
body.light .badge.st-gray{background:#f4f6f8; border-color:#d7dee6; color:#7d8fa1;}
.chk{display:inline-flex; align-items:center; gap:5px; font-size:12.5px; margin-right:12px; cursor:pointer;}
.chk input{accent-color:var(--navy);}
/* 双栏 */
.psplit{flex:1; min-height:0; display:flex; gap:9px; padding:9px;}
.pcol{flex:1.55; min-width:0; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--card);}
.pcol-r{flex:1; min-width:320px;}
.phead{flex:none; padding:8px 12px; font-size:12.5px; font-weight:700; color:var(--ink-strong); background:rgba(47,155,255,.1); border-bottom:1px solid var(--line);}
body.light .phead{background:var(--navy-bg); color:var(--navy-d); border-bottom-color:#d3dfe9;}
.pform{padding:10px 12px; overflow:auto; flex:1;}
.frow{display:flex; gap:10px; padding:6px 0; align-items:flex-start; border-bottom:1px dashed var(--line2);}
.frow>label{flex:none; width:88px; font-size:12px; color:var(--sub); padding-top:6px; text-align:right;}
.fctl{flex:1; min-width:0; font-size:12.5px; line-height:1.72; padding-top:3px;}
.fctl .sel,.fctl .inp{max-width:100%;}
.psum{display:flex; gap:14px; padding:9px 12px; border-top:1px solid var(--line2); background:rgba(47,155,255,.05); font-size:12px; color:var(--sub); flex-wrap:wrap;}
.psum b{color:var(--ink-strong); font-size:14px; font-variant-numeric:tabular-nums; margin:0 2px; font-family:var(--mono);}
.pbtns{display:flex; gap:7px; padding:10px 12px; border-top:1px solid var(--line2); flex-wrap:wrap;}
/* 弹层 */
.modal{position:fixed; inset:0; background:rgba(3,7,13,.62); backdrop-filter:blur(4px); z-index:200; display:flex; align-items:center; justify-content:center; padding:24px;}
.mbox{
  background:linear-gradient(180deg,rgba(16,28,44,.99),rgba(10,18,30,.99));
  border-radius:8px; width:min(780px,96vw); max-height:90vh; display:flex; flex-direction:column;
  border:1px solid rgba(120,200,255,.34); border-top:3px solid var(--navy);
  box-shadow:0 40px 90px -20px rgba(0,0,0,.95), 0 0 40px -10px rgba(47,155,255,.5);
}
body.light .mbox{background:#fff; border-color:var(--navy); box-shadow:var(--shadow-lg);}
.mhead{flex:none; display:flex; align-items:center; padding:12px 16px; font-size:14px; font-weight:700; color:var(--ink-strong); border-bottom:1px solid var(--line);}
.mhead .mx{margin-left:auto; cursor:pointer; color:var(--faint); font-size:13px; padding:2px 6px;}
.mhead .mx:hover{color:var(--orange);}
.mbody{flex:1; overflow:auto; padding:12px 16px;}
.mbody .frow>label{width:96px;}
.mfoot{flex:none; display:flex; justify-content:flex-end; gap:8px; padding:11px 16px; border-top:1px solid var(--line); background:rgba(47,155,255,.05);}
body.light .mfoot{background:#fafcfd;}
.optrow{display:flex; align-items:center; gap:6px; margin-bottom:6px;}
.optag{flex:none; width:20px; height:20px; border:1px solid var(--line); border-radius:4px; display:inline-flex; align-items:center; justify-content:center; font-size:11px; color:var(--sub); background:rgba(0,0,0,.25); font-family:var(--mono);}
body.light .optag{background:#fafcfd; border-color:#b9c6d2;}
/* 答题 */
.sheet{display:flex; gap:4px; flex-wrap:wrap; max-width:340px;}
.snum{width:22px; height:22px; border:1px solid var(--line); border-radius:4px; display:inline-flex; align-items:center; justify-content:center; font-size:11px; color:var(--sub); cursor:pointer; background:rgba(0,0,0,.25); font-variant-numeric:tabular-nums; transition:.15s;}
body.light .snum{background:#fff; border-color:#c7d2dd;}
.snum.on{background:linear-gradient(180deg,#3ba6ff,#1b78d8); border-color:#4fb0ff; color:#fff; font-weight:700; box-shadow:0 0 12px -2px rgba(47,155,255,.9);}
body.light .snum.on{background:var(--navy); border-color:var(--navy); box-shadow:none;}

/* ============ 互动课件编辑器 ============ */
.cwsplit{flex:1; min-height:0; display:flex; gap:9px; padding:9px;}
.cwcol{display:flex; flex-direction:column; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--card); min-width:0;}
.cwcol-l{flex:0 0 216px;}
.cwcol-c{flex:1;}
.cwcol-r{flex:0 0 236px;}
.cwhd{flex:none; padding:8px 11px; font-size:12px; font-weight:700; color:var(--ink-strong); background:rgba(47,155,255,.1); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:6px;}
.cwhd .cntx{margin-left:auto; font-weight:400; font-size:10.5px; color:var(--faint); font-family:var(--mono);}
.cwbd{flex:1; overflow:auto; min-height:0; padding:9px;}
.cwblk{
  display:flex; align-items:center; gap:8px; padding:8px 10px; margin-bottom:7px; cursor:pointer;
  border:1px solid var(--line); border-radius:5px; font-size:12px; color:var(--ink);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.012)); transition:.15s;
}
body.light .cwblk{background:#fff;}
.cwblk:hover{border-color:var(--navy); box-shadow:var(--glow-blue); transform:translateX(2px);}
.cwblk .k{flex:none; width:24px; height:24px; border-radius:4px; display:inline-flex; align-items:center; justify-content:center; font-size:10px; font-family:var(--mono); background:rgba(47,155,255,.16); color:var(--navy-d); border:1px solid rgba(47,155,255,.3);}
.cwblk.t-single .k,.cwblk.t-multi .k,.cwblk.t-judge .k{background:rgba(56,211,159,.14); color:var(--ok); border-color:rgba(56,211,159,.35);}
.cwblk.t-video .k,.cwblk.t-order .k,.cwblk.t-draw .k,.cwblk.t-guide .k{background:rgba(255,138,61,.14); color:var(--orange-ink); border-color:rgba(255,138,61,.35);}
.cwblk .dsc2{font-size:10.5px; color:var(--faint); margin-left:auto;}
/* 课件画布 */
.cwcanvas{
  flex:1; overflow:auto; min-height:0; padding:14px;
  background:
    linear-gradient(rgba(90,150,210,.07) 1px,transparent 1px) 0 0/24px 24px,
    linear-gradient(90deg,rgba(90,150,210,.07) 1px,transparent 1px) 0 0/24px 24px,
    radial-gradient(600px 380px at 50% 20%, rgba(47,155,255,.11), transparent 70%);
}
.cwpage{
  max-width:640px; margin:0 auto; border:1px solid var(--line); border-radius:7px; padding:0; overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.012));
  box-shadow:0 26px 60px -22px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.08);
}
body.light .cwpage{background:#fff; border-color:#d7dee6;}
.cwpage .ph3{
  padding:11px 15px; font-size:14px; font-weight:700; color:var(--ink-strong);
  border-bottom:1px solid var(--line2); display:flex; align-items:center; gap:8px;
  background:linear-gradient(180deg,rgba(47,155,255,.14),transparent);
}
.cwpage .ph3 .sn{margin-left:auto; font-size:10.5px; color:var(--faint); font-family:var(--mono); font-weight:400;}
.cwrow{padding:11px 15px; border-bottom:1px dashed var(--line2); position:relative;}
.cwrow:last-child{border-bottom:0;}
.cwrow .rlbl{font-size:9.5px; color:var(--faint); letter-spacing:1.3px; text-transform:uppercase; margin-bottom:5px;}
.cwrow .rbody{font-size:12.5px; line-height:1.8; color:var(--ink); text-align:justify;}
.cwrow .rdel{position:absolute; right:8px; top:8px; font-size:11px; color:var(--faint); cursor:pointer; opacity:0; transition:.15s;}
.cwrow:hover .rdel{opacity:1;}
.cwrow .rdel:hover{color:var(--danger);}
.cwrow .emb{
  border:1px solid rgba(255,138,61,.35); background:rgba(255,138,61,.08); border-radius:5px;
  padding:9px 11px; display:flex; align-items:center; gap:9px; cursor:pointer; transition:.15s;
}
.cwrow .emb:hover{box-shadow:var(--glow-orange);}
.cwrow .emb .eic{flex:none; width:26px; height:26px; border-radius:5px; background:rgba(255,138,61,.18); color:var(--orange-ink); display:inline-flex; align-items:center; justify-content:center; font-size:10px; font-family:var(--mono);}
.cwrow .emb .etx{flex:1; min-width:0;}
.cwrow .emb .etx b{font-size:12px; color:var(--ink-strong); display:block;}
.cwrow .emb .etx span{font-size:10.5px; color:var(--sub);}
.cwrow .emb .ego{font-size:10.5px; color:var(--orange-ink); border:1px solid rgba(255,138,61,.35); padding:1px 6px; border-radius:3px; white-space:nowrap;}
.cwfig{height:96px; border-radius:5px; border:1px dashed var(--line); display:flex; align-items:center; justify-content:center; font-size:11px; color:var(--faint);
  background:radial-gradient(220px 90px at 50% 50%, rgba(47,155,255,.12), transparent 72%);}
.cwchart{display:flex; align-items:flex-end; gap:9px; height:96px; padding:6px 2px;}
.cwchart .bar{flex:1; border-radius:3px 3px 0 0; background:linear-gradient(180deg,var(--navy),rgba(47,155,255,.25)); position:relative;}
.cwchart .bar span{position:absolute; left:0; right:0; bottom:-15px; text-align:center; font-size:9.5px; color:var(--faint);}

/* ============ 班组管理 ============ */
.clswrap{display:flex; gap:9px; padding:9px; flex:1; min-height:0;}
.clslist{flex:0 0 224px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--card);}
.clsitem{padding:10px 12px; border-bottom:1px solid var(--line2); cursor:pointer; transition:.15s;}
.clsitem:hover{background:var(--hover);}
.clsitem.on{background:var(--orange-bg); box-shadow:inset 3px 0 0 var(--orange);}
.clsitem b{font-size:12.6px; color:var(--ink-strong);}
.clsitem span{display:block; font-size:10.5px; color:var(--faint); margin-top:2px;}
.clsmain{flex:1; min-width:0; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:var(--card);}
.memrow{display:flex; align-items:center; gap:9px; padding:6px 12px; border-bottom:1px solid var(--line2); font-size:12px;}
.memrow:hover{background:var(--hover);}
.memrow .av{flex:none; width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:10.5px; font-family:var(--mono);
  background:linear-gradient(140deg,rgba(47,155,255,.35),rgba(255,138,61,.28)); color:#fff; border:1px solid var(--line);}
.memrow .gd{margin-left:auto; font-size:10.5px; color:var(--faint);}
.importzone{border:1px dashed var(--line); border-radius:6px; padding:10px 12px; background:rgba(47,155,255,.05); font-size:11.5px; color:var(--sub); line-height:1.7;}
.importzone textarea{width:100%; min-height:88px; margin-top:6px; font-family:var(--mono); font-size:11.5px;}

/* ============ 批阅中心 ============ */
.gradeitem{border:1px solid var(--line); border-radius:6px; margin-bottom:10px; overflow:hidden; background:var(--card); box-shadow:var(--shadow);}
.gradeitem .gh{padding:9px 12px; border-bottom:1px solid var(--line2); display:flex; align-items:center; gap:9px; background:rgba(47,155,255,.06);}
.gradeitem .gh b{font-size:12.6px; color:var(--ink-strong);}
.gradeitem .gh .who{font-size:11px; color:var(--sub);}
.gradeitem .gh .st2{margin-left:auto;}
.gradeitem .gb{padding:10px 12px;}
.ansbox{background:rgba(0,0,0,.24); border:1px solid var(--line2); border-radius:5px; padding:8px 10px; font-size:12px; line-height:1.75; color:var(--ink); margin-top:5px;}
body.light .ansbox{background:#f7f9fb;}
.ansbox .lb{font-size:10.5px; color:var(--faint); letter-spacing:1px; text-transform:uppercase;}
.scoreinput{display:flex; align-items:center; gap:7px; margin-top:8px; flex-wrap:wrap;}
.scoreinput input{width:72px; text-align:center; font-family:var(--mono);}
.uploadbox{
  border:1px dashed var(--line); border-radius:5px; padding:14px; text-align:center; font-size:11.5px; color:var(--faint);
  background:rgba(47,155,255,.04); cursor:pointer; transition:.15s;
}
.uploadbox:hover{border-color:var(--navy); color:var(--navy-d); box-shadow:var(--glow-blue);}

/* ============ 动效 ============ */
@keyframes pulseGlow{0%,100%{opacity:.55;} 50%{opacity:1;}}
@keyframes floatIn{from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;}}
.fadein{animation:floatIn .28s ease both;}

/* ======================= V3.1 登录门 & 课程首页 ======================= */
#loginGate{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1100px 600px at 18% -10%,rgba(47,155,255,.16),transparent 60%),
             radial-gradient(900px 520px at 105% 115%,rgba(255,138,61,.12),transparent 55%),
             var(--bg);}
#loginGate .lgdeco{position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(var(--line2) 1px,transparent 1px),linear-gradient(90deg,var(--line2) 1px,transparent 1px);
  background-size:34px 34px;mask-image:radial-gradient(75% 70% at 50% 45%,#000 30%,transparent 100%);}
.lgwrap{position:relative;display:flex;gap:56px;align-items:center;max-width:1080px;width:92%;padding:44px 48px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow);backdrop-filter:blur(14px);}
.lgbrand{flex:1.25;min-width:0}
.lgbrand h1{margin:16px 0 6px;font-size:27px;letter-spacing:1px;color:var(--ink)}
.lgsub{margin:0 0 20px;color:var(--sub);font-size:12.5px}
.lgpts{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:11px}
.lgpts li{display:flex;flex-direction:column;gap:2px;padding:9px 13px;border-left:2px solid var(--navy);
  background:var(--hover);border-radius:0 8px 8px 0}
.lgpts b{font-size:13px;color:var(--ink)}
.lgpts span{font-size:11.5px;color:var(--sub)}
.lgfoot{margin:0;font-size:11px;color:var(--faint);line-height:1.9}
.lgbox{flex:1;min-width:330px;padding:30px 30px 24px;background:var(--card);border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow)}
.lgbox h2{margin:0 0 18px;font-size:16px;color:var(--ink);display:flex;align-items:center;gap:9px}
.lgbox h2:before{content:"";width:4px;height:16px;background:var(--orange);border-radius:2px}
.lgres .btn{flex:1}
.lgbtn{width:100%;margin-top:18px;height:42px;font-size:14.5px;letter-spacing:6px;justify-content:center;padding-left:19px}
.lghint{margin:14px 0 0;font-size:11px;color:var(--faint);line-height:1.7}
body.auth #loginGate{display:none}

.hwelcome{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.hwelcome h3{margin:0;font-size:17px;color:var(--ink)}
.hwelcome p{margin:4px 0 0;font-size:12px;color:var(--sub)}
.hlic{font-size:11px;color:var(--sub);text-align:right;line-height:1.8}
.hlic b{color:var(--navy)}
.coursegrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:16px}
.ccard{position:relative;padding:18px 18px 14px;background:var(--card);border:1px solid var(--line);
  border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.ccard:before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(47,155,255,.09),transparent 45%)}
.ccard.core{border-color:rgba(255,138,61,.55);box-shadow:var(--shadow),0 0 0 1px rgba(255,138,61,.25)}
.ccard h4{margin:0 0 3px;font-size:15.5px;color:var(--ink);position:relative}
.ccard .ctb{margin:0 0 10px;font-size:12px;color:var(--sub);position:relative}
.ccard .cspec{position:relative;display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}
.ccard .cspec i{font-style:normal;font-size:11px;color:var(--sub);background:var(--hover);
  border:1px solid var(--line);border-radius:4px;padding:3px 8px}
.ccard .cbtns{position:relative;display:flex;flex-wrap:wrap;gap:7px}
.cbadge{position:absolute;top:14px;right:14px;font-size:10.5px;color:#fff;background:linear-gradient(135deg,#ff8a3d,#e4691c);
  border-radius:4px;padding:3px 8px;letter-spacing:1px;box-shadow:0 2px 8px rgba(228,105,28,.4)}
.cbadge.normal{background:var(--hover);color:var(--sub);border:1px solid var(--line);box-shadow:none}
.packrow{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.pcard{padding:12px 12px 10px;background:var(--card);border:1px solid var(--line);border-radius:10px;
  box-shadow:var(--shadow);display:flex;flex-direction:column;gap:6px}
.pcard b{font-size:12.5px;color:var(--ink);line-height:1.5}
.pcard span{font-size:10.5px;color:var(--navy);letter-spacing:.5px}
.pcard i{font-style:normal;font-size:10.5px;color:var(--faint)}
@media (max-width:1100px){.packrow{grid-template-columns:repeat(2,1fr)}.coursegrid{grid-template-columns:1fr}.lgwrap{flex-direction:column}}