/* ===== AI视频提示词训练场 · 暗色电影感主题 ===== */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
:root{
  --bg:#0e1016; --bg2:#14171f; --card:#171b26; --card2:#1d2230;
  --line:#2a3040; --line2:#353c50;
  --txt:#e9ebf2; --txt2:#a6aec2; --txt3:#717a90;
  --gold:#f5b942; --gold2:#f7cd72; --teal:#4fd1c5; --teal2:#38b2ac;
  --green:#48bb78; --red:#f56565; --amber:#ed9f38; --blue:#5b8def;
  --radius:14px;
  --shadow:0 8px 28px rgba(0,0,0,.38);
}
html,body{ height:100%; }
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(245,185,66,.08), transparent 60%),
    radial-gradient(900px 500px at -10% 20%, rgba(79,209,197,.06), transparent 55%),
    var(--bg);
  color:var(--txt); font-size:15px; line-height:1.65;
}
.app{ max-width:720px; margin:0 auto; min-height:100%; position:relative; }

/* ===== 顶部栏 ===== */
.topbar{
  position:sticky; top:0; z-index:30;
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 16px; background:rgba(14,16,22,.86); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.topbar-title{ font-weight:700; font-size:16px; letter-spacing:.5px; }
.topbar-stat{
  font-size:13px; color:var(--gold); background:rgba(245,185,66,.12);
  border:1px solid rgba(245,185,66,.3); padding:3px 10px; border-radius:999px; white-space:nowrap;
}

.content{ padding:16px 14px calc(84px + env(safe-area-inset-bottom)); }
.view{ display:none; animation:fade .25s ease; }
.view.active{ display:block; }
@keyframes fade{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }

/* ===== 首页 hero ===== */
.hero{
  background:linear-gradient(135deg, rgba(245,185,66,.13), rgba(79,209,197,.08));
  border:1px solid var(--line); border-radius:var(--radius);
  padding:18px 16px; margin-bottom:18px;
}
.hero-title{ font-size:20px; font-weight:800; margin-bottom:6px; }
.hero-sub{ color:var(--txt2); font-size:13.5px; margin-bottom:14px; }
.hero-progress{ display:flex; align-items:center; gap:10px; }
.hero-progress-bar{ flex:1; height:8px; border-radius:99px; background:rgba(255,255,255,.08); overflow:hidden; }
.hero-progress-bar i{ display:block; height:100%; width:0; border-radius:99px;
  background:linear-gradient(90deg,var(--gold),var(--gold2)); transition:width .4s ease; }
.hero-progress-text{ font-size:12px; color:var(--txt2); white-space:nowrap; }

/* ===== 阶段与课程地图 ===== */
.stage{ margin-bottom:22px; }
.stage-head{ display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.stage-badge{
  width:34px; height:34px; border-radius:10px; display:grid; place-items:center;
  font-size:18px; font-weight:800; color:#1a1408;
}
.stage-badge.s1{ background:linear-gradient(135deg,#f5b942,#f7cd72); }
.stage-badge.s2{ background:linear-gradient(135deg,#4fd1c5,#7de3d9); color:#062825; }
.stage-badge.s3{ background:linear-gradient(135deg,#5b8def,#8fb2ff); color:#0c1733; }
.stage-badge.s4{ background:linear-gradient(135deg,#b794f6,#d6bcfa); color:#1a1033; }
.stage-name{ font-weight:700; font-size:16px; }
.stage-desc{ font-size:12px; color:var(--txt3); }

.lesson-node{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:13px 14px; margin-bottom:10px; cursor:pointer; color:var(--txt);
  transition:border-color .15s, transform .1s;
}
.lesson-node:active{ transform:scale(.99); }
.lesson-node:hover{ border-color:var(--line2); }
.lesson-node.locked{ opacity:.55; cursor:not-allowed; }
.ln-index{
  width:32px; height:32px; flex:none; border-radius:9px; display:grid; place-items:center;
  background:var(--card2); border:1px solid var(--line); font-weight:700; font-size:14px; color:var(--txt2);
}
.lesson-node.locked .ln-index{ color:var(--txt3); }
.ln-main{ flex:1; min-width:0; }
.ln-title{ font-weight:600; font-size:14.5px; }
.ln-sub{ font-size:12px; color:var(--txt3); margin-top:1px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ln-right{ flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:3px; }
.stars{ font-size:13px; letter-spacing:1px; color:var(--gold); }
.stars .off{ color:#3a4152; }
.ln-best{ font-size:11px; color:var(--txt3); }
.ln-lock{ font-size:15px; }

/* ===== 通用卡片/文字 ===== */
.card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:15px; margin-bottom:13px; }
.card h3{ font-size:15px; margin-bottom:9px; display:flex; align-items:center; gap:7px; }
.card h4{ font-size:14px; margin:12px 0 6px; color:var(--gold2); }
.card p{ color:var(--txt2); font-size:14px; margin-bottom:8px; }
.muted{ color:var(--txt3); font-size:12.5px; }
.kv{ font-size:13.5px; color:var(--txt2); }
.kv b{ color:var(--txt); font-weight:600; }
.tag{ display:inline-block; font-size:11.5px; padding:2px 9px; border-radius:99px;
  background:rgba(91,141,239,.14); color:#9db8f5; border:1px solid rgba(91,141,239,.3); margin:0 5px 5px 0; }
.tag.gold{ background:rgba(245,185,66,.12); color:var(--gold2); border-color:rgba(245,185,66,.3); }
.tag.teal{ background:rgba(79,209,197,.12); color:var(--teal); border-color:rgba(79,209,197,.3); }
.tag.red{ background:rgba(245,101,101,.12); color:#ff9b9b; border-color:rgba(245,101,101,.3); }

/* ===== 按钮 ===== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  border:none; border-radius:10px; padding:10px 18px; font-size:14px; font-weight:600;
  cursor:pointer; color:#1a1408; background:linear-gradient(135deg,var(--gold),var(--gold2));
  transition:filter .15s, transform .1s;
}
.btn:active{ transform:scale(.97); }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.btn.block{ width:100%; }
.btn.teal{ background:linear-gradient(135deg,var(--teal),var(--teal2)); color:#062825; }
.btn.ghost{ background:var(--card2); color:var(--txt); border:1px solid var(--line2); }
.btn.sm{ padding:6px 12px; font-size:12.5px; border-radius:8px; }
.btn-ghost{ background:none; border:none; color:var(--txt2); font-size:13.5px; cursor:pointer; padding:5px 2px; }
.btn-ghost:hover{ color:var(--txt); }

/* ===== 练习场 mode tabs ===== */
.mode-tabs{ display:flex; gap:6px; margin-bottom:14px; overflow-x:auto; padding-bottom:2px; }
.mode-tab{
  flex:none; border:1px solid var(--line); background:var(--card); color:var(--txt2);
  padding:7px 14px; border-radius:99px; font-size:13px; cursor:pointer;
}
.mode-tab.active{ background:rgba(245,185,66,.15); border-color:rgba(245,185,66,.45); color:var(--gold2); font-weight:600; }
.mode-pane{ display:none; }
.mode-pane.active{ display:block; animation:fade .2s ease; }

/* 筛选 chips */
.chips{ display:flex; flex-wrap:wrap; gap:7px; margin:8px 0 4px; }
.chip{
  border:1px solid var(--line2); background:var(--card2); color:var(--txt2);
  font-size:12.5px; padding:5px 12px; border-radius:99px; cursor:pointer;
}
.chip.active{ background:rgba(79,209,197,.16); border-color:rgba(79,209,197,.5); color:var(--teal); font-weight:600; }
.field-label{ font-size:12.5px; color:var(--txt3); margin:12px 0 2px; }
select,input[type=text],input[type=password]{
  width:100%; background:var(--bg2); border:1px solid var(--line2); color:var(--txt);
  border-radius:9px; padding:9px 11px; font-size:14px; outline:none;
}
select:focus,input:focus,textarea:focus{ border-color:var(--gold); }
textarea{
  width:100%; min-height:130px; resize:vertical; background:var(--bg2);
  border:1px solid var(--line2); border-radius:10px; color:var(--txt);
  padding:11px 12px; font-size:14px; line-height:1.7; outline:none; font-family:inherit;
}

/* 题卡 */
.quiz-card{ border:1px solid rgba(245,185,66,.35); background:linear-gradient(160deg, rgba(245,185,66,.08), rgba(29,34,48,.6));
  border-radius:var(--radius); padding:15px; margin-bottom:13px; }
.quiz-meta{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:9px; }
.quiz-scene{ font-size:15px; font-weight:600; line-height:1.6; margin-bottom:6px; }
.quiz-req{ font-size:13px; color:var(--txt2); }
.quiz-req li{ margin:3px 0 3px 18px; }
.constraint{
  display:inline-block; font-size:12px; padding:3px 10px; border-radius:8px; margin:0 6px 6px 0;
  background:rgba(237,159,56,.15); border:1px dashed rgba(237,159,56,.6); color:#f5c172;
}
.empty{ text-align:center; color:var(--txt3); padding:46px 20px; }
.empty .big{ font-size:40px; margin-bottom:10px; }

/* ===== 批改报告 ===== */
.report{ border:1px solid var(--line2); border-radius:var(--radius); overflow:hidden; margin:12px 0; background:var(--card); }
.report-head{ display:flex; align-items:center; gap:16px; padding:16px; background:var(--card2); }
.score-ring{ position:relative; width:78px; height:78px; flex:none; }
.score-ring svg{ transform:rotate(-90deg); }
.score-ring .num{ position:absolute; inset:0; display:grid; place-items:center; font-size:21px; font-weight:800; }
.report-verdict h3{ font-size:16px; margin-bottom:2px; }
.report-verdict p{ font-size:12.5px; color:var(--txt3); margin:0; }
.report-body{ padding:14px 16px 16px; }
.dim-row{ margin-bottom:9px; }
.dim-row .dim-top{ display:flex; justify-content:space-between; font-size:12.5px; margin-bottom:3px; }
.dim-bar{ height:7px; border-radius:99px; background:rgba(255,255,255,.07); overflow:hidden; }
.dim-bar i{ display:block; height:100%; border-radius:99px; transition:width .5s ease; }
.dim-comment{ font-size:12px; color:var(--txt3); margin-top:3px; }
.section-title{ font-size:13px; font-weight:700; margin:14px 0 7px; display:flex; align-items:center; gap:6px; }
.good-list li,.issue-list li{ margin:0 0 8px 18px; font-size:13.5px; color:var(--txt2); }
.good-list li::marker{ color:var(--green); }
.issue-box{ background:rgba(237,159,56,.08); border:1px solid rgba(237,159,56,.25); border-radius:10px; padding:10px 12px; margin-bottom:8px; }
.issue-box .ib-problem{ font-size:13.5px; color:#f5c172; }
.issue-box .ib-fix{ font-size:12.5px; color:var(--txt2); margin-top:3px; }
.issue-box .ib-dim{ font-size:11px; color:var(--txt3); }
.prompt-out{
  position:relative; background:var(--bg2); border:1px solid var(--line); border-radius:10px;
  padding:12px 14px; font-size:13.5px; line-height:1.8; white-space:pre-wrap; color:var(--txt);
}
.copy-btn{ position:absolute; top:8px; right:8px; }
.encourage{ margin-top:12px; padding:11px 13px; border-radius:10px; font-size:13.5px;
  background:rgba(79,209,197,.1); border:1px solid rgba(79,209,197,.28); color:var(--teal); }

/* loading */
.loading{ display:flex; align-items:center; gap:10px; color:var(--txt2); padding:16px; font-size:13.5px; }
.spinner{ width:17px; height:17px; border:2px solid var(--line2); border-top-color:var(--gold);
  border-radius:50%; animation:spin .8s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg);} }
.alert{ border-radius:10px; padding:10px 13px; font-size:13px; margin:10px 0; }
.alert.err{ background:rgba(245,101,101,.12); border:1px solid rgba(245,101,101,.35); color:#ff9b9b; }
.alert.ok{ background:rgba(72,187,120,.12); border:1px solid rgba(72,187,120,.35); color:#7ee2a8; }
.alert.info{ background:rgba(91,141,239,.12); border:1px solid rgba(91,141,239,.35); color:#9db8f5; }

/* 课程正文 */
.lesson-sec{ margin-bottom:14px; }
.lesson-sec h3{ font-size:16px; margin-bottom:8px; }
.lesson-sec p{ color:var(--txt2); font-size:14px; margin-bottom:8px; }
.compare{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:10px 0; }
.compare .col{ border-radius:10px; padding:11px; font-size:13px; line-height:1.7; }
.compare .bad{ background:rgba(245,101,101,.08); border:1px solid rgba(245,101,101,.3); }
.compare .good{ background:rgba(72,187,120,.08); border:1px solid rgba(72,187,120,.3); }
.compare .lab{ font-size:12px; font-weight:700; margin-bottom:5px; }
.compare .bad .lab{ color:#ff9b9b; }
.compare .good .lab{ color:#7ee2a8; }
.tips-list li{ margin:4px 0 4px 18px; font-size:13.5px; color:var(--txt2); }
.example-prompt{ background:var(--bg2); border-left:3px solid var(--gold); border-radius:0 10px 10px 0;
  padding:10px 13px; font-size:13.5px; line-height:1.8; margin:8px 0; white-space:pre-wrap; }
.example-note{ font-size:12px; color:var(--txt3); margin-top:4px; }

/* 课程练习区 */
.exercise{ border:1px solid rgba(79,209,197,.35); border-radius:var(--radius); padding:15px;
  background:linear-gradient(160deg, rgba(79,209,197,.07), rgba(29,34,48,.6)); margin-top:16px; }
.exercise h3{ color:var(--teal); }
.spark{ display:flex; align-items:flex-end; gap:4px; height:34px; margin:6px 0 2px; }
.spark i{ width:9px; border-radius:3px 3px 0 0; background:linear-gradient(180deg,var(--gold2),var(--gold)); min-height:3px; }

/* overlay */
.overlay{ position:fixed; inset:0; z-index:40; background:var(--bg); display:flex; flex-direction:column; }
.overlay.hidden{ display:none; }
.overlay-head{ display:flex; align-items:center; gap:12px; padding:11px 14px;
  border-bottom:1px solid var(--line); background:rgba(20,23,31,.95); position:sticky; top:0; z-index:2; }
.overlay-head-title{ font-weight:700; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.overlay-body{ flex:1; overflow-y:auto; padding:16px 14px calc(40px + env(safe-area-inset-bottom)); max-width:720px; width:100%; margin:0 auto; }

/* 底部导航 */
.tabbar{
  position:fixed; bottom:0; left:0; right:0; z-index:30;
  max-width:720px; margin:0 auto; display:flex;
  background:rgba(18,21,29,.95); backdrop-filter:blur(10px);
  border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom);
}
.tab{ flex:1; background:none; border:none; color:var(--txt3); padding:8px 0 7px; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:2px; font-size:11px; }
.tab .tab-ico{ font-size:19px; filter:grayscale(.4); }
.tab.active{ color:var(--gold2); }
.tab.active .tab-ico{ filter:none; }
.tab .dot{ position:relative; }
#tabMistakeDot{ position:absolute; top:-3px; right:-8px; background:var(--red); color:#fff;
  font-size:9px; min-width:14px; height:14px; border-radius:99px; display:none; place-items:center; padding:0 3px; }

/* 弹窗 */
.modal-mask{ position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:50; display:grid; place-items:center; padding:20px; }
.modal-mask.hidden{ display:none; }
.modal{ background:var(--card); border:1px solid var(--line2); border-radius:var(--radius);
  max-width:460px; width:100%; max-height:82vh; overflow-y:auto; padding:18px; box-shadow:var(--shadow); }
.modal h3{ margin-bottom:10px; }
.modal-actions{ display:flex; gap:9px; justify-content:flex-end; margin-top:15px; }

/* 专项卡 */
.special-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.special-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:13px; cursor:pointer; text-align:left; color:var(--txt); }
.special-card:active{ transform:scale(.98); }
.special-card .sc-ico{ font-size:22px; }
.special-card .sc-name{ font-weight:700; font-size:14px; margin:5px 0 3px; }
.special-card .sc-desc{ font-size:11.5px; color:var(--txt3); line-height:1.5; }
.special-card.weak{ border-color:rgba(245,101,101,.5); }
.special-card .weak-tag{ display:inline-block; margin-top:6px; font-size:10.5px; color:#ff9b9b; }

/* 统计 */
.stat-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:9px; margin-bottom:13px; }
.stat-box{ background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 10px; text-align:center; }
.stat-box .v{ font-size:21px; font-weight:800; color:var(--gold2); }
.stat-box .k{ font-size:11.5px; color:var(--txt3); margin-top:2px; }
.chart-wrap{ display:flex; justify-content:center; }
.legend{ display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; justify-content:center; }
.legend span{ font-size:11.5px; color:var(--txt2); display:inline-flex; align-items:center; gap:5px; }
.legend i{ width:9px; height:9px; border-radius:2px; display:inline-block; }

/* 手册 */
.hb-group{ margin-bottom:16px; }
.hb-item{ background:var(--bg2); border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin-bottom:8px; }
.hb-item .t{ font-weight:700; font-size:13.5px; color:var(--gold2); }
.hb-item .d{ font-size:12.5px; color:var(--txt2); margin-top:2px; }
.tool-card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:14px; margin-bottom:12px; }
.tool-card .tc-head{ display:flex; align-items:center; gap:10px; margin-bottom:7px; }
.tool-card .tc-name{ font-size:16px; font-weight:800; }
.tool-card .tc-vendor{ font-size:11.5px; color:var(--txt3); }
.tool-card ul{ margin:5px 0 5px 18px; }
.tool-card li{ font-size:13px; color:var(--txt2); margin:2px 0; }

/* 错题本 */
.mistake-item{ background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 13px; margin-bottom:9px; }
.mistake-item.fixed{ opacity:.5; }
.mistake-head{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:4px 8px; margin-bottom:5px; }
.mistake-src{ font-size:11.5px; color:var(--txt3); }
.mistake-problem{ font-size:13.5px; color:#f5c172; overflow-wrap:anywhere; }
.mistake-fix{ font-size:13px; color:var(--txt2); margin-top:3px; }
.mistake-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.filter-row{ display:flex; gap:7px; overflow-x:auto; padding-bottom:6px; margin-bottom:10px; }

/* 分镜搭建表 */
.sb-subtabs{ display:flex; gap:8px; margin-bottom:13px; }
.board-shot{ background:var(--card); border:1px solid var(--line); border-radius:12px; padding:12px 13px; margin-bottom:11px; }
.bs-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.bs-head b{ font-size:14px; color:var(--gold2); }
.bs-row{ display:flex; gap:9px; flex-wrap:wrap; margin-top:8px; }
.bs-row label{ flex:none; display:flex; flex-direction:column; gap:3px; font-size:11.5px; color:var(--txt3); }
.bs-row input,.bs-row select{ width:auto; min-width:0; padding:7px 9px; font-size:13px; }
.bs-row input[type=number]{ width:78px; }
.bs-row label[style*="flex:1"] input,.bs-row label[style*="flex:1"] select{ width:100%; }
.bs-content{ min-height:54px !important; margin-top:2px; font-size:13.5px; line-height:1.6; }

/* 素材研学 */
.url-row{ display:flex; gap:8px; margin-top:6px; }
.url-row input{ flex:1; min-width:0; width:auto; background:var(--bg2); border:1px solid var(--line2); color:var(--txt); border-radius:9px; padding:9px 11px; font-size:14px; outline:none; }
.url-row input:focus{ border-color:var(--gold); }
.url-row .btn{ flex:none; }
.file-btn{ display:block; text-align:center; border:1px dashed var(--line2); border-radius:12px; padding:16px 12px; font-size:13.5px; color:var(--txt2); cursor:pointer; background:var(--card2); transition:.15s; }
.file-btn:hover{ border-color:var(--teal); color:var(--teal); }
.study-preview{ max-width:100%; overflow:hidden; }
.study-preview img{ max-width:100%; border-radius:10px; border:1px solid var(--line); display:block; }
.frame-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:7px; }
.frame-cell{ position:relative; }
.frame-cell img{ width:100%; display:block; border-radius:8px; border:1px solid var(--line); }
.frame-cell span{ position:absolute; left:5px; top:5px; background:rgba(0,0,0,.62); color:#fff; font-size:10.5px; padding:1px 6px; border-radius:6px; }
.lesson-teach{ background:var(--card2); border-left:3px solid var(--teal); border-radius:0 10px 10px 0; padding:11px 13px; font-size:14px; line-height:1.85; color:var(--txt2); white-space:pre-wrap; }
.drill-card{ background:var(--card2); border:1px solid var(--line); border-radius:11px; padding:11px 13px; margin-top:9px; }
.drill-q{ font-size:14px; color:var(--txt); line-height:1.6; }
.drill-a{ margin-top:8px; background:var(--bg2); border-radius:9px; padding:10px 12px; font-size:13.5px; line-height:1.75; color:var(--txt2); white-space:pre-wrap; }
.study-actions{ margin-top:14px; }
.note-item{ display:flex; justify-content:space-between; gap:10px; align-items:center; padding:10px 0; border-bottom:1px solid var(--line); }
.note-item:last-child{ border-bottom:none; padding-bottom:0; }
.note-main{ min-width:0; flex:1; }
.note-title{ font-size:13.5px; color:var(--txt); line-height:1.5; overflow-wrap:anywhere; }
.report .muted{ overflow-wrap:anywhere; }
.note-acts{ flex:none; display:flex; gap:6px; }

/* 成长教练 */
.coach-card{ border-color:rgba(79,209,197,.4); background:linear-gradient(160deg,rgba(79,209,197,.07),var(--card) 45%); }
.coach-stats{ display:flex; flex-wrap:wrap; gap:7px 16px; font-size:13px; color:var(--txt3); margin:4px 0 10px; }
.coach-stats b{ color:var(--txt); font-size:15px; }
.coach-stats span.due{ color:var(--teal); }
.coach-rec{ background:var(--card2); border:1px solid var(--line); border-radius:11px; padding:11px 13px; }
.cr-label{ font-size:12.5px; color:var(--teal); font-weight:600; margin-bottom:6px; }
.cr-line{ font-size:13px; color:var(--txt2); line-height:1.7; margin-bottom:5px; }
.cr-line b{ color:var(--gold2); }
.coach-acts{ display:flex; flex-wrap:wrap; gap:8px; margin-top:9px; }
.switch-row{ display:flex; gap:10px; align-items:flex-start; font-size:14px; cursor:pointer; padding:6px 0; }
.switch-row input[type=checkbox]{ width:18px; height:18px; margin-top:2px; flex:none; accent-color:var(--teal); }
.rv-badge{ font-size:11px; padding:2px 8px; border-radius:99px; background:var(--bg2); border:1px solid var(--line2); color:var(--txt3); white-space:nowrap; }
.rv-badge.due{ background:rgba(79,209,197,.15); border-color:rgba(79,209,197,.45); color:var(--teal); font-weight:600; }
.rv-badge.grad{ background:rgba(72,187,120,.13); border-color:rgba(72,187,120,.4); color:#7ee2a8; }
.hits-tag{ font-size:11px; color:#ff9b9b; border:1px solid rgba(245,101,101,.35); border-radius:6px; padding:0 5px; white-space:nowrap; }
.mistake-item.graduated{ opacity:.72; }
.mistake-item.graduated .mistake-problem{ color:var(--txt3); }

/* 学情体检 */
.ck-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.ck-sec{ margin-top:12px; }
.ck-t{ font-size:13.5px; font-weight:600; color:var(--gold2); margin-bottom:7px; }
.ck-list{ margin:0 0 0 18px; font-size:13px; color:var(--txt2); line-height:1.8; }
.ck-item{ background:var(--card2); border:1px solid var(--line); border-radius:10px; padding:9px 11px; margin-bottom:7px; }
.ck-prob{ font-size:13px; color:var(--txt); margin-top:5px; line-height:1.6; overflow-wrap:anywhere; }
.ck-fix{ font-size:12.5px; color:var(--teal); margin-top:4px; line-height:1.6; overflow-wrap:anywhere; }
.plan-item{ display:flex; align-items:center; justify-content:space-between; gap:10px; background:var(--card2); border:1px solid var(--line); border-radius:10px; padding:9px 11px; margin-bottom:7px; }
.plan-main{ min-width:0; flex:1; }
.plan-act{ font-size:13.5px; color:var(--txt); line-height:1.55; overflow-wrap:anywhere; }

/* AI 预演成片 */
.pv-tl{ display:flex; gap:10px; align-items:flex-start; background:var(--card2); border:1px solid var(--line); border-radius:10px; padding:8px 11px; margin-bottom:6px; font-size:13px; color:var(--txt2); line-height:1.6; }
.pv-tl .pv-t{ flex:none; font-size:11.5px; font-weight:700; color:var(--teal); border:1px solid rgba(79,209,197,.4); border-radius:6px; padding:1px 6px; margin-top:2px; white-space:nowrap; }

/* 实战回报 */
.frame-strip{ display:flex; gap:6px; flex-wrap:wrap; }
.frame-cell{ width:calc(33.33% - 4px); border-radius:8px; border:1px solid var(--line); display:block; }
.bt-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:4px; }
.bt-card{ background:var(--card2); border:1px solid var(--line); border-radius:12px; padding:9px; cursor:pointer; transition:border-color .15s; }
.bt-card:hover{ border-color:var(--line2); }
.bt-thumb{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; display:block; background:var(--bg2); }
.bt-empty{ display:flex; align-items:center; justify-content:center; font-size:26px; color:var(--txt3); }
.bt-meta{ display:flex; align-items:center; justify-content:space-between; gap:6px; margin-top:7px; font-size:13px; }
.bt-what{ font-size:12.5px; color:var(--txt2); margin-top:5px; line-height:1.55; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ===== 🌍 虚拟世界播放器 ===== */
.world-stage{
  position:relative; border-radius:12px; padding:16px 15px; min-height:180px;
  border:1px solid rgba(255,255,255,.12); box-shadow:inset 0 0 60px rgba(0,0,0,.35);
  overflow:hidden; display:flex; flex-direction:column; gap:8px;
  animation:wsFade .5s ease;
}
@keyframes wsFade{ from{opacity:.3;} to{opacity:1;} }
.ws-top{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.ws-t{ font-size:11.5px; font-weight:700; color:#fff; background:rgba(0,0,0,.35); border-radius:6px; padding:2px 8px; }
.ws-shot{ font-size:12px; color:#ffe9b0; background:rgba(0,0,0,.3); border-radius:6px; padding:2px 8px; }
.ws-cam{ font-size:12px; color:#cde7ff; background:rgba(0,0,0,.3); border-radius:6px; padding:2px 8px; }
.ws-subject{ font-size:15px; font-weight:600; color:#fff; line-height:1.6; text-shadow:0 1px 4px rgba(0,0,0,.6); }
.ws-lighting,.ws-action{ font-size:13px; color:rgba(255,255,255,.92); line-height:1.6; text-shadow:0 1px 3px rgba(0,0,0,.6); }
.ws-risk{
  font-size:12.5px; color:#ffe0b0; background:rgba(245,101,101,.28);
  border:1px solid rgba(245,101,101,.55); border-radius:8px; padding:6px 9px; line-height:1.55;
}
.world-ctrl{ display:flex; align-items:center; gap:8px; margin-top:10px; flex-wrap:wrap; }
.ws-idx{ font-size:13px; color:var(--txt3); margin-left:2px; }
.world-dots{ display:flex; gap:6px; margin-top:9px; justify-content:center; }
.wdot{ width:9px; height:9px; border-radius:50%; background:var(--line2); cursor:pointer; transition:all .2s; }
.wdot.active{ background:var(--gold); transform:scale(1.25); box-shadow:0 0 8px rgba(245,185,66,.6); }

@media (max-width:380px){
  .special-grid{ grid-template-columns:1fr; }
  .compare{ grid-template-columns:1fr; }
  .stat-grid{ grid-template-columns:1fr 1fr 1fr; }
  .bt-grid{ grid-template-columns:1fr; }
}

/* ===== 授权门 ===== */
.auth-mask{ position:fixed; inset:0; z-index:999; background:rgba(10,12,17,.97);
  display:grid; place-items:center; padding:20px; }
.auth-card{ width:100%; max-width:360px; background:var(--card); border:1px solid var(--line2);
  border-radius:var(--radius); padding:30px 24px 22px; text-align:center; box-shadow:var(--shadow); }
.auth-logo{ font-size:46px; }
.auth-title{ font-size:19px; font-weight:800; margin:10px 0 4px; }
.auth-sub{ color:var(--txt2); font-size:13px; margin-bottom:16px; }
.auth-input{ text-align:center; letter-spacing:2px; font-weight:600; font-family:ui-monospace,Consolas,monospace; }
.auth-err{ color:var(--red); font-size:12.5px; min-height:18px; margin-top:9px; }
.auth-foot{ color:var(--txt3); font-size:12px; margin-top:12px; border-top:1px dashed var(--line); padding-top:12px; }