/* =========================================================================
   研学台 V3 · 设计系统
   原则：近黑底 + 纸白字（高对比）｜橙色＝唯一主色（"当下/行动"）｜
        学科色只做细标记，不做大面积填充｜零渐变零发光零玻璃拟态
   ========================================================================= */
:root{
  --bg:#0B0C10;          /* 页面底 */
  --rail:#101217;        /* 侧栏 */
  --card:#171A20;        /* 卡片 */
  --card2:#1E222A;       /* 卡内浮层 */
  --line:#272B33;        /* 细线 */
  --line2:#3A3F49;       /* 强线 */
  --tx:#F6F7F8;          /* 主字 对比 ≈ 17:1 */
  --tx2:#ADB4BD;         /* 次字 对比 ≈ 8.3:1 */
  --tx3:#8A929D;         /* 标签字（仅小字/标签）对比 ≈ 5:1 */
  --act:#FF6B1F;         /* 主色：行动 / 当下 */
  --act2:#FF8A45;
  --onact:#140700;       /* 主色上的字 */
  --ok:#3ED598; --bad:#FF5757; --warn:#FFC042; --info:#6FA8FF;
  --s-en:#59A5EE; --s-ma:#E4745F; --s-po:#57AE83; --s-cs:#AE8DEE; --s-vo:#E3A651;
  --r-s:8px; --r-m:12px; --r-l:16px; --r-p:999px;
  --f:14px; --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--bg);color:var(--tx);font-size:var(--f);line-height:1.7;
  font-family:"Inter","PingFang SC","Noto Sans SC","Microsoft YaHei",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,textarea{font:inherit;color:inherit;background:none;border:0;outline:none}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--act);outline-offset:2px;border-radius:4px}
::selection{background:var(--act);color:var(--onact)}
*{scrollbar-width:thin;scrollbar-color:#2C313A transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#2C313A;border-radius:8px;border:3px solid var(--bg);background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#3D444F}

/* ---------- 图标 ---------- */
.ic{width:18px;height:18px;flex:none;display:block}

/* ---------- 字阶（拉开层级，不只靠颜色） ---------- */
.display{font-size:34px;line-height:1.15;font-weight:800;letter-spacing:-.025em}
h2.pt{font-size:26px;line-height:1.2;font-weight:750;letter-spacing:-.02em}
h3{font-size:16px;line-height:1.4;font-weight:700}
.lbl{font-size:12px;line-height:1.3;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3)}
.sub{font-size:13px;line-height:1.65;color:var(--tx3)}
.mono{font-family:"SFMono-Regular",Consolas,Menlo,monospace;font-variant-numeric:tabular-nums}
.num{font-family:"SFMono-Regular",Consolas,Menlo,monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
strong{font-weight:700;color:var(--tx)}
em.a{font-style:normal;color:var(--act)}

/* ---------- 外壳 ---------- */
.app{display:grid;grid-template-columns:252px minmax(0,1fr);height:100vh;overflow:hidden}
.rail{background:var(--rail);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.rail-scroll{flex:1;min-height:0;overflow-y:auto;padding:20px 14px 12px}
.brand{display:flex;align-items:center;gap:12px;padding:4px 8px 22px}
.brand .lg{width:38px;height:38px;flex:none;border-radius:11px;background:var(--act);color:var(--onact);display:grid;place-items:center}
.brand b{display:block;font-size:15px;font-weight:750;letter-spacing:-.01em}
.brand span{display:block;font-size:12px;color:var(--tx3);letter-spacing:.02em}

.nav{display:flex;flex-direction:column;gap:2px}
.navitem{display:flex;align-items:center;gap:11px;width:100%;padding:10px 10px;border-radius:9px;
  color:var(--tx2);font-size:14px;font-weight:550;text-align:left;transition:background .15s var(--ease),color .15s var(--ease)}
.navitem .ic{opacity:.9}
.navitem:hover{background:#1A1D24;color:var(--tx)}
.navitem .cnt{margin-left:auto;font-size:12px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace;letter-spacing:0}
.navitem.on{background:var(--card2);color:var(--tx);font-weight:700}
.navitem.on .ic{color:var(--act);opacity:1}
.navsep{height:1px;background:var(--line);margin:14px 10px}

/* 常驻主行动：永远一次点击回到"接着学" */
.resume{margin:0 14px;padding:14px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.resume .lbl{display:block;margin-bottom:8px}
.resume .t{font-size:13px;line-height:1.5;color:var(--tx);font-weight:600;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.resume .m{font-size:12px;color:var(--tx3);margin-top:6px}
.resume .go{margin-top:12px;width:100%;justify-content:center}
.streak{margin:12px 14px 16px;display:flex;gap:4px}
.streak i{flex:1;height:5px;border-radius:3px;background:#20242B}
.streak i.f{background:var(--act)}

/* ---------- 顶栏 ---------- */
.main{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg)}
.top{height:84px;flex:none;display:flex;align-items:center;gap:24px;padding:0 40px;border-bottom:1px solid var(--line)}
.ptitle{min-width:0}
.ptitle h2{display:flex;align-items:baseline;gap:12px}
.ptitle .kick{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--act)}
.ptitle p{font-size:13px;color:var(--tx3);margin-top:3px;line-height:1.5}
.top .right{margin-left:auto;display:flex;align-items:center;gap:14px}
.search{display:flex;align-items:center;gap:10px;width:280px;height:40px;padding:0 14px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-p);color:var(--tx3);font-size:13px}
.search:hover{border-color:var(--line2);color:var(--tx2)}
.search kbd{margin-left:auto;font-family:inherit;font-size:12px;border:1px solid var(--line2);
  border-radius:5px;padding:1px 6px;color:var(--tx3)}
.tchip{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:var(--r-p);
  background:var(--card);border:1px solid var(--line);font-size:13px;color:var(--tx2)}
.tchip b{color:var(--tx);font-weight:700}
.avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(0deg,#2A2F38,#2A2F38);
  background:var(--card2);border:1px solid var(--line2);display:grid;place-items:center;
  font-size:13px;font-weight:700;color:var(--tx)}

/* ---------- 内容区 ---------- */
.view{flex:1;min-height:0;overflow-y:auto}
.page{display:none;padding:36px 40px 72px}
.page.on{display:block}
.wrap{max-width:1180px}
.grid2{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:32px;align-items:start}
.grid2b{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
.sec{margin-top:36px}
.sec:first-child{margin-top:0}
.sechd{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.sechd h3{letter-spacing:-.01em}
.sechd .meta{margin-left:auto;font-size:12px;color:var(--tx3)}

/* ---------- 卡片（克制：只在"独立区块/可点/对比"用） ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-l)}
.card.pad{padding:20px 22px}
.cardhd{display:flex;align-items:baseline;gap:12px;padding:18px 22px 0}
.cardhd .meta{margin-left:auto;font-size:12px;color:var(--tx3)}

/* 行列表：靠分隔线分组，不套卡 */
.rows{display:flex;flex-direction:column}
.row{display:flex;align-items:center;gap:14px;padding:15px 22px;border-top:1px solid var(--line);text-align:left;width:100%}
.row:first-child{border-top:0}
.row.link{transition:background .15s var(--ease)}
.row.link:hover{background:#1B1E25}
.row .bar{width:3px;height:26px;border-radius:2px;flex:none;background:var(--line2)}
.row .idx{font-family:"SFMono-Regular",Consolas,monospace;font-size:12px;color:var(--tx3);width:18px;flex:none}
.row .tt{min-width:0;flex:1}
.row .tt b{display:block;font-size:14px;font-weight:600;color:var(--tx);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .tt span{display:block;font-size:12px;color:var(--tx3);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .rt{flex:none;font-size:12px;color:var(--tx3);display:flex;align-items:center;gap:10px}
.row .chev{color:var(--tx3);flex:none}

/* ---------- 按钮 ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:38px;padding:0 16px;
  border-radius:9px;font-size:13px;font-weight:600;border:1px solid var(--line2);color:var(--tx2);
  transition:.15s var(--ease);white-space:nowrap}
.btn:hover{border-color:var(--tx3);color:var(--tx)}
.btn.act{background:var(--act);border-color:var(--act);color:var(--onact)}
.btn.act:hover{background:var(--act2);border-color:var(--act2)}
.btn.lg{height:46px;padding:0 22px;font-size:14px;border-radius:11px}
.btn.sm{height:30px;padding:0 11px;font-size:12px;border-radius:7px}
.btn.ghost{border-color:transparent;color:var(--tx3)}
.btn.ghost:hover{background:#1A1D24;color:var(--tx)}
.btn.block{width:100%}
.btn:disabled{opacity:.42;cursor:default}
.btn:disabled:hover{border-color:var(--line2);color:var(--tx2)}

/* ---------- 标记 / 标签 ---------- */
.bdg{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:6px;
  font-size:12px;font-weight:700;letter-spacing:.01em;background:#20242B;color:var(--tx2)}
.bdg.ok{background:rgba(62,213,152,.14);color:var(--ok)}
.bdg.bad{background:rgba(255,87,87,.14);color:var(--bad)}
.bdg.warn{background:rgba(255,192,66,.14);color:var(--warn)}
.bdg.act{background:rgba(255,107,31,.16);color:var(--act)}
.dot{width:7px;height:7px;border-radius:50%;flex:none;background:var(--line2)}
.dot.ok{background:var(--ok)} .dot.warn{background:var(--warn)} .dot.act{background:var(--act)}

/* ---------- chips ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{height:34px;padding:0 14px;border-radius:var(--r-p);border:1px solid var(--line);
  background:var(--card);color:var(--tx2);font-size:13px;font-weight:550;transition:.15s var(--ease)}
.chip:hover{border-color:var(--line2);color:var(--tx)}
.chip.on{background:var(--tx);border-color:var(--tx);color:#0B0C10;font-weight:700}
.chip.on .n{opacity:.6}

/* ---------- 进度条 ---------- */
.bar{height:5px;border-radius:3px;background:#20242B;overflow:hidden}
.bar>i{display:block;height:100%;border-radius:3px;background:var(--tx3)}
.bar>i.en{background:var(--s-en)} .bar>i.ma{background:var(--s-ma)}
.bar>i.po{background:var(--s-po)} .bar>i.cs{background:var(--s-cs)}
.bar>i.vo{background:var(--s-vo)} .bar>i.act{background:var(--act)}

/* ---------- 今日 · Hero ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1fr) 384px;gap:40px;align-items:center}
.hero .kick{display:inline-flex;align-items:center;gap:10px;font-size:12px;color:var(--tx2);
  padding:6px 12px;border-radius:var(--r-p);background:var(--card);border:1px solid var(--line)}
.hero .kick b{color:var(--act)}
.hero h1{margin:20px 0 14px}
.hero .lead{font-size:15px;line-height:1.75;color:var(--tx2);max-width:520px}
.hero .acts{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.hero-art{position:relative;border-radius:var(--r-l);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;background:var(--card)}
.hero-art img{width:100%;height:100%;object-fit:cover;opacity:.88}
.hero-art::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,9,11,.22),rgba(8,9,11,.5))}
.hero-art .cap{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:14px 16px;font-size:12px;color:#C9CED6;
  background:linear-gradient(180deg,transparent,rgba(6,7,9,.92));letter-spacing:.01em}
.hero-art .tagtl{position:absolute;z-index:2;top:12px;left:12px}

/* ---------- KPI ---------- */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden}
.kpi{background:var(--card);padding:18px 20px}
.kpi .k{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3)}
.kpi .v{font-family:"SFMono-Regular",Consolas,monospace;font-size:26px;line-height:1.2;margin-top:8px;letter-spacing:-.02em}
.kpi .v small{font-size:12px;color:var(--tx3);font-family:inherit;letter-spacing:0;margin-left:5px}
.kpi .d{font-size:12px;color:var(--tx3);margin-top:6px}

/* ---------- 建议条 ---------- */
.advice{display:flex;gap:14px;padding:18px 20px;border-radius:var(--r-l);
  background:var(--card);border:1px solid var(--line);border-left:2px solid var(--act)}
.advice .av{width:34px;height:34px;flex:none;border-radius:10px;background:var(--card2);
  display:grid;place-items:center;color:var(--act)}
.advice b{font-size:13px;display:block;margin-bottom:4px}
.advice p{font-size:13px;line-height:1.7;color:var(--tx2)}
.advice em{font-style:normal;color:var(--tx);font-weight:600}

/* ---------- 课表 ---------- */
.tl{border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;background:var(--card)}
.tl-head{display:grid;grid-template-columns:64px repeat(7,minmax(0,1fr));border-bottom:1px solid var(--line)}
.tl-head .h{padding:12px 10px;text-align:center;border-left:1px solid var(--line)}
.tl-head .h:first-child{border-left:0}
.tl-head .h b{font-size:13px;font-weight:700;display:block}
.tl-head .h em{font-style:normal;font-size:12px;color:var(--tx3)}
.tl-head .h.today b{color:var(--act)}
.tl-body{display:grid;grid-template-columns:64px repeat(7,minmax(0,1fr));height:520px}
.gutter{border-right:1px solid var(--line);position:relative}
.gutter span{position:absolute;right:10px;font-size:12px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace;transform:translateY(-50%)}
.day{border-left:1px solid var(--line);position:relative;background:
  repeating-linear-gradient(180deg,transparent,transparent 65px,#1C1F25 65px,#1C1F25 66px)}
.day.today{background:#141820}
.blk{position:absolute;left:6px;right:6px;border-radius:8px;padding:8px 10px;overflow:hidden;
  background:var(--card2);border-left:3px solid var(--line2)}
.blk b{font-size:12px;font-weight:650;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk span{font-size:12px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace}
.blk.en{border-left-color:var(--s-en)} .blk.ma{border-left-color:var(--s-ma)}
.blk.po{border-left-color:var(--s-po)} .blk.cs{border-left-color:var(--s-cs)}
.blk.vo{border-left-color:var(--s-vo)}
.blk.part{border-left-style:dashed;opacity:.82}
.blk:hover{z-index:3;background:var(--card3,var(--card2));cursor:default}
/* 课表排程：日期与分钟是本页唯一的输入，输了才有下面所有块 */
.fld{display:flex;flex-direction:column;gap:6px}
.fld>span{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3)}
#schDays .day{min-height:520px}
.legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:12px;color:var(--tx2)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}

/* ---------- 课程库 ---------- */
.courses{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.cc{border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;background:var(--card);
  display:flex;flex-direction:column;transition:.18s var(--ease)}
.cc:hover{border-color:var(--line2);transform:translateY(-2px)}
.cc .cover{position:relative;aspect-ratio:16/9;background:#000}
.cc .cover img{width:100%;height:100%;object-fit:cover;opacity:.9}
.cc .cover::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,9,11,.2),rgba(8,9,11,.55))}
.cc .cover .kind{position:absolute;z-index:2;top:10px;left:10px}
.cc .cover .dur{position:absolute;z-index:2;right:10px;bottom:10px;font-size:12px;font-family:"SFMono-Regular",Consolas,monospace;
  background:rgba(8,9,11,.86);color:var(--tx);border-radius:6px;padding:3px 7px}
.cc .pl{position:absolute;z-index:2;inset:0;display:grid;place-items:center}
.cc .pl i{width:52px;height:52px;border-radius:50%;background:rgba(8,9,11,.62);display:grid;place-items:center;
  color:var(--tx);border:1px solid rgba(255,255,255,.22);transition:.18s var(--ease)}
.cc:hover .pl i{background:var(--act);color:var(--onact);border-color:var(--act)}
.cc .bd{padding:16px 18px 18px;display:flex;flex-direction:column;gap:12px;flex:1}
.cc .bd h4{font-size:14px;font-weight:700;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cc .tg{display:flex;gap:6px;flex-wrap:wrap}
.cc .pr{display:flex;align-items:center;gap:10px}
.cc .pr .bar{flex:1}
.cc .pr b{font-size:12px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace;font-weight:600;white-space:nowrap}
.cc .now{font-size:12px;color:var(--tx3);line-height:1.5}
.cc .foot{margin-top:auto}

/* ---------- 课堂：左目录＋播放器＋下方学习舱 ---------- */
.cls3{display:grid;grid-template-columns:270px minmax(0,1fr);gap:22px;align-items:start}
.cls3.hide{grid-template-columns:minmax(0,1fr)}
.cls3.hide .tocpane{display:none}
.tocpane{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);overflow:hidden;
  display:flex;flex-direction:column;max-height:calc(100vh - 236px)}
.tocpane-hd{padding:12px;border-bottom:1px solid var(--line)}
.tocsearch{display:flex;align-items:center;gap:9px;height:34px;padding:0 12px;border-radius:8px;width:100%;
  background:var(--card2);border:1px solid var(--line);color:var(--tx3);font-size:12.5px}
.tocpane-list{flex:1;min-height:0;overflow-y:auto;padding:4px 0}
.tocch{border-top:1px solid var(--line)}
.tocch:first-child{border-top:0}
.tocch-h{display:flex;align-items:center;gap:8px;width:100%;padding:11px 14px;font-size:12.5px;font-weight:700;
  color:var(--tx2);text-align:left}
.tocch-h:hover{background:#1B1E25;color:var(--tx)}
.tocch-h .cv{transition:transform .18s var(--ease);color:var(--tx3);width:14px;height:14px}
.tocch.open .tocch-h .cv{transform:rotate(90deg)}
.tocch-h .n{margin-left:auto;font-size:12px;color:var(--tx3);font-weight:600}
.tocch-kids{display:none}
.tocch.open .tocch-kids{display:block}
.tocit{display:flex;align-items:center;gap:9px;width:100%;padding:9px 14px 9px 18px;font-size:12.5px;
  color:var(--tx3);text-align:left}
.tocit:hover{background:#1B1E25;color:var(--tx2)}
.tocit.on{background:rgba(255,107,31,.1);color:var(--act);font-weight:650;box-shadow:inset 2px 0 0 var(--act)}
.tocit .st{width:7px;height:7px;border-radius:50%;border:1.5px solid var(--line2);flex:none}
.tocit .st.done{background:var(--ok);border-color:var(--ok)}
.tocit .st.cur{background:var(--act);border-color:var(--act)}
.tocit .nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tocit .du{font-size:10.5px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace}
.tocit.pend{background:rgba(255,107,31,.05);color:var(--tx2);box-shadow:inset 2px 0 0 rgba(255,107,31,.55)}
.tocit.pend .du{color:var(--act)}
.tocpane-ft{padding:12px 14px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:9px}
.tocpane-ft .r{display:flex;font-size:11.5px;color:var(--tx3)}
.tocpane-ft .r b{margin-left:auto;color:var(--tx);font-family:"SFMono-Regular",Consolas,monospace}
.studycol{display:flex;flex-direction:column;gap:20px;min-width:0}
.stage{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);overflow:hidden}
.stage-hd{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.stage-hd .t{min-width:0}
.stage-hd .t b{display:block;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stage-hd .t span{display:block;font-size:12px;color:var(--tx3);margin-top:2px}
.screen{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden}
.screen img{width:100%;height:100%;object-fit:cover;opacity:.46}
.screen .ov{position:absolute;inset:0;display:grid;place-items:center}
.screen .ov i{width:74px;height:74px;border-radius:50%;background:rgba(8,9,11,.7);border:1px solid rgba(255,255,255,.28);
  display:grid;place-items:center;color:#fff;transition:.18s var(--ease)}
.screen .ov:hover i{background:var(--act);color:var(--onact);border-color:var(--act)}
/* 视频放不出来时的诊断层：把「哪一环断的」直接写在画面上，不让人对着黑屏猜 */
.screen .vid-fail{position:absolute;inset:0;display:flex;flex-direction:column;gap:8px;justify-content:center;
  padding:28px 32px;background:rgba(8,9,11,.9);text-align:left}
.screen .vid-fail b{font-size:15px;color:var(--act)}
.screen .vid-fail span{font-size:12.5px;color:var(--tx2);line-height:1.55;word-break:break-all}
.screen .vid-fail span.p{color:var(--tx3);font-size:11.5px}
.screen .srcnote{position:absolute;top:12px;left:12px}
.screen .times{position:absolute;right:12px;bottom:12px;font-size:12px;
  font-family:"SFMono-Regular",Consolas,monospace;background:rgba(8,9,11,.82);padding:3px 8px;border-radius:6px}
.pline{padding:16px 18px 20px}
.pline .barwrap{position:relative;padding:10px 0}
.pline .bar{height:6px}
.pline .bar>i{background:var(--act)}
.mk{position:absolute;top:50%;width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%;
  background:var(--card2);border:2px solid var(--tx3);cursor:pointer;transition:.15s var(--ease)}
.mk:hover{border-color:var(--tx);transform:scale(1.15)}
.mk.pass{background:var(--ok);border-color:var(--ok)}
.mk.now{background:var(--act);border-color:var(--act);box-shadow:0 0 0 4px rgba(255,107,31,.18)}
.pline .ph{display:flex;align-items:baseline;gap:14px;font-size:12px;color:var(--tx3)}
.pline .ph .num{font-size:13px;color:var(--tx)}
.pline .ph .sp{margin-left:auto}
.dock{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);overflow:hidden}
.dtabs{display:flex;gap:2px;padding:8px;border-bottom:1px solid var(--line);background:var(--card)}
.dtabs button{flex:1;height:34px;border-radius:8px;font-size:12px;font-weight:600;color:var(--tx3);transition:.15s var(--ease)}
.dtabs button:hover{color:var(--tx2)}
.dtabs button.on{background:var(--card2);color:var(--tx)}
.dpanel{padding:20px 22px 22px;display:none}
.dpanel.on{display:block}
.dgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 26px}
.wordline{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid var(--line)}
.wordline:first-child{border-top:0;padding-top:0}
.wordline b{font-size:14px;font-weight:700;font-family:"SFMono-Regular",Consolas,monospace}
.wordline .ph{font-size:12px;color:var(--tx3)}
.wordline .cn{font-size:12px;color:var(--tx2);margin-left:auto;text-align:right}
.toclist{display:none}
.pagethumb{border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;background:var(--card2);max-width:340px}
.pagethumb img{width:100%;aspect-ratio:3/4;object-fit:cover;opacity:.9}
.notearea{width:100%;min-height:130px;background:var(--card2);border:1px solid var(--line);border-radius:var(--r-m);
  padding:12px 14px;font-size:13px;line-height:1.7;color:var(--tx);resize:vertical}
.notearea::placeholder{color:var(--tx3)}
.pickbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.sel{display:flex;align-items:center;gap:9px;height:38px;padding:0 14px;border-radius:9px;
  background:var(--card);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--tx)}
.sel:hover{border-color:var(--line2)}
.sel .ic{color:var(--tx3)}
.sel .cv{margin-left:2px;color:var(--tx3)}

/* ---------- 背单词：训练卡（内嵌助记图）＋常驻本组词表 ---------- */
.wgrid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:26px;align-items:start}
.wordcard{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);padding:24px 26px 26px}
.whead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--line)}
.whead .lbl{flex:none}
.whead .chips{margin-left:auto}
.wbody{display:flex;gap:26px;align-items:flex-start;margin-top:22px}
.wbody .wcol{flex:1;min-width:0}
.wbig{font-size:52px;line-height:1.05;font-weight:800;letter-spacing:-.03em;font-family:"SFMono-Regular",Consolas,monospace}
.wbig.cn{font-size:28px;line-height:1.45;font-family:inherit;font-weight:750;letter-spacing:-.01em}
.wbig.mask{font-size:42px;letter-spacing:.2em;color:var(--act)}
.wbig.plain{font-size:26px;font-family:inherit;font-weight:700;letter-spacing:0;color:var(--tx2)}
.ipa{display:flex;align-items:center;gap:12px;margin-top:12px;font-size:14px;color:var(--tx2);flex-wrap:wrap}
.ipa .pos{font-size:12px;font-weight:700;color:var(--s-en);border:1px solid rgba(89,165,238,.4);border-radius:5px;padding:0 6px}
.def{margin-top:20px;font-size:22px;line-height:1.5;font-weight:600;color:var(--tx);letter-spacing:-.01em}
.defmask{margin-top:20px;padding:22px;border-radius:var(--r-m);border:1px dashed var(--line2);text-align:center;color:var(--tx3);font-size:13px}
.stars{color:var(--s-vo);letter-spacing:2px;font-size:14px}
.freqrow{display:flex;align-items:center;gap:10px;margin-top:16px;font-size:12px;color:var(--tx3)}
.mnemogrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;margin-top:26px}
.mnemogrid .m{background:var(--card);padding:14px 16px}
.mnemogrid .m .k{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3);margin-bottom:6px}
.mnemogrid .m .v{font-size:13px;line-height:1.65;color:var(--tx2)}
.rate{display:flex;gap:12px;margin-top:26px}
.rate button{flex:1;padding:14px 16px;border-radius:var(--r-m);border:1px solid var(--line2);text-align:left;transition:.15s var(--ease)}
.rate button:hover{border-color:var(--tx3);background:#1B1E25}
.rate button b{display:block;font-size:14px;font-weight:700;color:var(--tx)}
.rate button span{display:block;font-size:12px;color:var(--tx3);margin-top:2px}
.rate button.act{background:var(--act);border-color:var(--act)}
.rate button.act b{color:var(--onact)} .rate button.act span{color:rgba(20,7,0,.62)}
.spellrow{display:flex;gap:10px;margin-top:20px;align-items:center}
.spellin{flex:1;height:52px;background:var(--card2);border:1px solid var(--line2);border-radius:var(--r-m);
  padding:0 16px;font-size:18px;font-family:"SFMono-Regular",Consolas,monospace;letter-spacing:.06em}
.spellin::placeholder{color:var(--tx3);font-size:14px;letter-spacing:0}
.wmap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.wmap button{text-align:left;padding:10px 12px;border-radius:9px;background:var(--card2);border:1px solid var(--line);transition:.15s var(--ease)}
.wmap button:hover{border-color:var(--line2)}
.wmap button.on{border-color:var(--act);background:rgba(255,107,31,.1)}
.wmap button b{display:block;font-size:12px;font-weight:650}
.wmap button span{display:block;font-size:12px;color:var(--tx3);margin-top:2px}
.sess{display:flex;flex-direction:column;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden}
.sess .s{background:var(--card);padding:13px 16px;display:flex;align-items:baseline;gap:10px}
.sess .s .k{font-size:12px;color:var(--tx3)}
.sess .s .v{margin-left:auto;font-family:"SFMono-Regular",Consolas,monospace;font-size:17px}

/* 本组词表：常驻右栏，与训练区联动（当前词高亮 / 掌握状态可见） */
.wordtable{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);overflow-y:auto;
  max-height:560px}
.wt{display:flex;align-items:center;gap:9px;width:100%;padding:9px 14px;text-align:left;border-top:1px solid var(--line)}
.wt:first-child{border-top:0}
.wt:hover{background:#1B1E25}
.wt.on{background:rgba(255,107,31,.1);box-shadow:inset 2px 0 0 var(--act)}
.wt .st{width:7px;height:7px;border-radius:50%;flex:none;background:#20242B;border:1px solid var(--line2)}
.wt .st.f{background:var(--ok);border-color:var(--ok)}
.wt .st.c{background:var(--act);border-color:var(--act)}
.wt b{flex:none;width:92px;font-size:12.5px;font-family:"SFMono-Regular",Consolas,monospace;font-weight:650;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wt .cn{flex:1;font-size:11.5px;color:var(--tx3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wt .d{flex:none;font-size:10.5px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace}

/* ---------- 背单词 V2：自动闯关（交互学多邻国，视觉沿用本项目克制语言） ---------- */
.duo{display:grid;grid-template-columns:minmax(0,1fr) 264px;gap:26px;align-items:start}
.duo-main{border:1px solid var(--line);border-radius:20px;background:var(--card);padding:20px 26px 24px;
  display:flex;flex-direction:column;min-height:580px;position:relative;transition:border-color .2s var(--ease)}
.duo-main.ok{border-color:rgba(62,213,152,.55)}
.duo-main.bad{border-color:rgba(255,87,87,.55)}
.duo-top{display:flex;align-items:center;gap:14px}
.duo-top .bar{flex:1;height:10px;border-radius:6px}
.duo-top .bar>i{background:var(--act);transition:width .35s var(--ease)}
.duo-combo{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:8px;flex:none;
  background:rgba(255,107,31,.14);color:var(--act);font-size:12px;font-weight:700;transition:.15s var(--ease)}
.duo-combo.zero{background:#20242B;color:var(--tx3)}
.duo-prompt{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:26px 0}
.duo-kicker{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);text-align:center}
.duo-body{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%}
.duo-q{font-size:46px;line-height:1.2;font-weight:800;letter-spacing:-.02em;text-align:center;
  font-family:"SFMono-Regular",Consolas,monospace}
.duo-q.cn{font-size:26px;line-height:1.5;font-weight:750;letter-spacing:-.01em;font-family:inherit;max-width:640px}
.duo-q.mask{letter-spacing:.2em;color:var(--act)}
.spk{width:100px;height:100px;border-radius:50%;background:var(--card2);border:1px solid var(--line2);
  display:grid;place-items:center;color:var(--tx);position:relative;transition:.15s var(--ease)}
.spk:hover{color:var(--act);border-color:var(--act)}
.spk.on{color:var(--act);border-color:var(--act)}
.spk.on::after{content:'';position:absolute;inset:-9px;border-radius:50%;border:2px solid rgba(255,107,31,.5);
  animation:ring 1.3s var(--ease) infinite}
@keyframes ring{0%{transform:scale(.9);opacity:.85}100%{transform:scale(1.2);opacity:0}}
.spk .ic{width:38px;height:38px}
.duo-in{width:100%;max-width:540px;height:64px;text-align:center;font-size:24px;letter-spacing:.06em;
  font-family:"SFMono-Regular",Consolas,monospace;background:var(--card2);border:1px solid var(--line2);border-radius:14px}
.duo-in::placeholder{color:var(--tx3);font-size:15px;letter-spacing:0;font-family:inherit}
.duo-in.ok{border-color:var(--ok);background:rgba(62,213,152,.08)}
.duo-in.bad{border-color:var(--bad);background:rgba(255,87,87,.08)}
.duo-foot{margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}
.duo-fb{display:none;align-items:center;gap:12px;margin-bottom:14px;padding:14px 16px;border-radius:12px;
  border:1px solid var(--line2);background:var(--card2)}
.duo-fb.on{display:flex}
.duo-fb.ok{border-color:rgba(62,213,152,.5);background:rgba(62,213,152,.09)}
.duo-fb.bad{border-color:rgba(255,87,87,.5);background:rgba(255,87,87,.09)}
.duo-fb b{font-size:14px}
.duo-fb b em{font-style:normal;font-family:"SFMono-Regular",Consolas,monospace;color:var(--tx)}
.duo-fb .r{margin-left:auto;font-size:12px;color:var(--tx3)}
.cta3d{width:100%;height:56px;border-radius:14px;font-size:16px;font-weight:800;background:var(--act);
  color:var(--onact);border:1px solid var(--act);border-bottom:4px solid #A63B08;transition:.1s var(--ease)}
.cta3d:hover{background:var(--act2)}
.cta3d:active{transform:translateY(2px);border-bottom-width:2px}
.cta3d.wait{background:var(--card2);color:var(--tx2);border-color:var(--line);border-bottom-color:var(--line2)}
.duo-hint{margin-top:10px;text-align:center;font-size:12px;color:var(--tx3)}
.duo-rail .wordtable{max-height:600px}
.wt.ok b{color:var(--ok)}
.wt.bad b{color:var(--bad)}
.wt .st.x{background:var(--bad);border-color:var(--bad)}

/* 背单词路径指引：先看卡片 → 再选模式练 */
.pathsteps{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:14px;
  font-size:12px;color:var(--tx3);flex-wrap:wrap}
.pathsteps i{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;
  background:var(--card2);border:1px solid var(--line2);color:var(--tx2);
  font-style:normal;font-size:12px;font-weight:700;margin-right:6px;vertical-align:-3px}
.pathsteps b{color:var(--tx2);font-weight:600}
.pathsteps .ar{color:var(--line2)}
.pathsteps .now i{background:var(--act);border-color:var(--act);color:var(--onact)}
.pathsteps .now b{color:var(--tx)}
.pathsteps .okd i{background:transparent;border-color:var(--ok);color:var(--ok)}
.pathsteps .okd b{color:var(--ok)}

/* 第一轮四选一：词面在上面，四个选项紧跟着 —— 不能让人先滚一屏才看见选项 */
.firstopts{width:100%;max-width:790px;display:flex;flex-direction:column;gap:2px}
.firstopts .fohd{display:flex;align-items:baseline;gap:10px;font-size:13px;font-weight:650;color:var(--tx2);
  margin-bottom:8px;padding-left:2px}
.firstopts .fohd .sub{font-weight:400;color:var(--tx3)}
.firstopts .opts{width:100%;margin-top:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.firstopts .opt{width:100%;text-align:left;min-height:52px;align-items:center}
.firstfoot{justify-content:center;margin-top:2px}
.firstfoot .btn{height:42px;min-width:180px}

/* 第一轮只留「认这个词」需要的：词 / 音标 / 考频 / 释义 / 配图 / 一句真卷例句。
   900px 高的屏里，词面 + 一行例句 + 2×2 选项必须全部落在首屏 —— 选项掉到折线以下
   这一轮就废了，所以在这里硬压高度，不靠用户滚。 */
.wcard.is-first{gap:6px}
.wcard.is-first .mnemogrid{display:none}
.wcard.is-first .wbig{font-size:32px;line-height:1.15}
.wcard.is-first .wcard-row{gap:12px}
.wcard.is-first .wpic{max-height:104px;width:132px;flex:none}
.wcard.is-first .wpic img{max-height:80px;object-fit:contain}
.wcard.is-first .wpic figcaption{display:none}
.wcard.is-first .sents{max-height:48px;overflow:auto}
.wcard.is-first .sents .sent:nth-child(n+2){display:none}
.wcard.is-first .firstmask{font-size:13px;color:var(--tx3);border:1px dashed var(--line);border-radius:8px;
  padding:6px 10px;margin-top:6px;line-height:1.35}
.wcard.is-first .freqrow{margin-top:0}
.wcard.is-first .ipa{margin-top:2px}
.wcard.is-first .fohd{margin-top:4px}
.wcard.is-first .firstopts .opt{min-height:44px;font-size:13.5px}
.wcard.is-first .firstfoot{margin-top:2px}
.wcard.is-first #wSkip{height:34px;font-size:12.5px}

@media (max-width:760px){
  .firstopts .opts{grid-template-columns:1fr}
}

/* 认词阶段：只有「认识 / 不认识」+ 上下翻页 */
.knownav{justify-content:space-between}
.knownav .cta3d{height:46px;font-size:14.5px;border-radius:12px}
.knownav .btn{height:46px;min-width:132px}

/* 模式栏：认词阶段结束后才出现，是加练、不是必经步骤 */
.duo-modes .picklab{font-size:11.5px;color:var(--tx3);padding:0 4px;align-self:center;white-space:nowrap}
.duo-modes .picklab.nos{color:var(--bad)}
.duo-modes .endbt{height:32px;padding:0 12px;border-radius:8px;border:1px solid var(--line2);
  background:transparent;color:var(--tx2);font-size:12px;font-weight:650;white-space:nowrap;cursor:pointer}
.duo-modes .endbt:hover{background:var(--card2);color:var(--tx)}
.duo-modes{flex-wrap:wrap;justify-content:center}

/* 认词过完这一遍的收尾屏 */
.knowend{width:100%;max-width:790px;text-align:center}
.knowend .kpis{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.knowend .kp{flex:1;min-width:150px;padding:16px 18px;border-radius:var(--r-m);
  border:1px solid var(--line);background:var(--card2)}
.knowend .kp b{display:block;font-size:30px;line-height:1.1;letter-spacing:-.02em}
.knowend .kp span{display:block;margin-top:5px;font-size:12px;color:var(--tx3)}
.knowend .kp.ok b{color:var(--ok)}
.knowend .kp.bad b{color:var(--bad)}

/* 单词卡片（学习态：一屏看完这个词的所有信息）
   duo-main 是 column flex，所以卡片这里是「纵向堆叠的几条」，
   每一条自己决定横排还是居中——不要把 flex 再铺一层横排，会把文字挤成竖线。 */
.wcard{display:flex;flex-direction:column;gap:14px;width:100%;max-width:790px}
.wcard-row{display:flex;gap:20px;align-items:flex-start;width:100%}
.wcard-top{flex:1;min-width:0}
.cimg{width:186px;flex:none;border-radius:var(--r-m);overflow:hidden;border:1px solid var(--line);background:var(--card2)}
.cimg img{width:100%;aspect-ratio:1;object-fit:cover;opacity:.94}
.cimg figcaption{padding:9px 11px;font-size:10.5px;line-height:1.5;color:var(--tx3);border-top:1px solid var(--line)}
/* 词图：百词斩那张图解内存的插画，是这一页的主角，不是配饰 */
.wpic{width:290px;background:var(--card)}
.wpic .wpic-slot{display:flex;align-items:center;justify-content:center;
  aspect-ratio:4/3;padding:14px;text-align:center;background:var(--card2)}
.wpic .wpic-slot img{width:100%;height:100%;object-fit:cover;border-radius:var(--r-s);
  opacity:1;transition:opacity .18s var(--ease)}
.wpic .wpic-slot .sub{font-size:12px;line-height:1.6;color:var(--tx3)}
.wpic.has .wpic-slot{padding:0;background:none}
.wpic figcaption{font-size:10.5px;color:var(--tx3)}
/* 主图在源站失效、拿例句配图顶上的时候，留一道边，别让人以为那是主图 */
.wpic.is-example .wpic-slot{outline:1px dashed var(--line);outline-offset:-1px}
.wpic.is-example figcaption{color:var(--tx3)}
#wMemo .m .v{word-break:break-word}

/* 分条释义在窄屏会挤压，这一格允许占两列 */
@media (max-width:900px){
  .wcard-row{flex-wrap:wrap}
  .wpic{width:100%}
  .wpic .wpic-slot{aspect-ratio:16/9}
  .mnemogrid{grid-template-columns:1fr}
}
.cardnav{display:flex;gap:12px;align-items:center;width:100%;max-width:790px;margin-top:4px}
.cardnav .cta3d{flex:1;height:50px;font-size:14.5px;border-radius:12px}
.sm2line{font-size:12px;color:var(--tx3);text-align:center;width:100%;max-width:790px}

/* 模式切换：听写默写 / 挖空填写 / 看词选义 / 看中文默写 / 翻转自评 都是「独立模式」 */
.duo-modes{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:4px;margin-bottom:16px;
  background:var(--card2);border:1px solid var(--line);border-radius:12px}
.duo-modes button{flex:0 0 auto;height:36px;padding:0 14px;border-radius:9px;font-size:12.5px;font-weight:650;
  color:var(--tx3);transition:.15s var(--ease)}
.duo-modes button:hover{color:var(--tx2)}
.duo-modes button.on{background:var(--act);color:var(--onact)}

/* 听写：分层提示出口（中文 / 首字母） */
.duo-tools{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.duo-tools .tip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 14px;border-radius:9px;
  border:1px dashed var(--line2);color:var(--tx2);font-size:12.5px;font-weight:600;transition:.15s var(--ease)}
.duo-tools .tip:hover{border-color:var(--act);color:var(--act);border-style:solid}
.duo-tools .tip:disabled{opacity:.45;cursor:default}
.duo-tools .tip:disabled:hover{border-color:var(--line2);color:var(--tx2);border-style:dashed}
.hintline{font-size:15px;line-height:1.7;color:var(--tx);font-weight:650;text-align:center;max-width:620px}

/* 挖空：直接在横线上填，填一处跳下一处 */
.slotrow{display:flex;gap:14px;justify-content:center;align-items:flex-end;flex-wrap:wrap}
.slot{width:44px;height:58px;padding:0;border:0;border-bottom:3px solid var(--line2);
  border-radius:8px 8px 0 0;background:transparent;text-align:center;line-height:1;
  font-size:30px;font-weight:700;font-family:"SFMono-Regular",Consolas,monospace;color:var(--tx);
  transition:.15s var(--ease)}
.slot:focus{outline:0;border-bottom-color:var(--act);background:rgba(255,107,31,.1)}
.slot.fixed{display:flex;align-items:center;justify-content:center;border-bottom-color:var(--line);color:var(--tx3)}
.slot.ok{border-bottom-color:var(--ok);color:var(--ok);background:rgba(62,213,152,.1)}
.slot.bad{border-bottom-color:var(--bad);color:var(--bad);background:rgba(255,87,87,.1)}
.slotrow.tight .slot{width:36px;height:50px;font-size:24px}

/* ---------- 练习 / 考场 ---------- */
.q{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);padding:26px 28px}
.q .qno{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.q .stem{font-size:17px;line-height:1.75;font-weight:600;letter-spacing:-.005em;margin-top:14px}
.opts{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.opt{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;border-radius:var(--r-m);
  border:1px solid var(--line);background:var(--card);text-align:left;font-size:14px;line-height:1.6;transition:.15s var(--ease)}
.opt:hover{border-color:var(--line2);background:#1B1E25}
.opt i{width:26px;height:26px;flex:none;border-radius:7px;background:var(--card2);border:1px solid var(--line2);
  display:grid;place-items:center;font-style:normal;font-size:12px;font-weight:700;color:var(--tx2)}
.opt.pick{border-color:var(--tx3)}
.opt.ok{border-color:var(--ok);background:rgba(62,213,152,.08)}
.opt.ok i{background:var(--ok);border-color:var(--ok);color:#04241A}
.opt.bad{border-color:var(--bad);background:rgba(255,87,87,.08)}
.opt.bad i{background:var(--bad);border-color:var(--bad);color:#2A0505}
.explain{margin-top:20px;padding:18px 20px;border-radius:var(--r-m);background:var(--card2);border:1px solid var(--line)}
.explain .k{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tx3);margin-bottom:8px}
.explain p{font-size:13px;line-height:1.75;color:var(--tx2)}
.sheet{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.sheet button{aspect-ratio:1;border-radius:7px;font-size:12px;font-weight:600;
  font-family:"SFMono-Regular",Consolas,monospace;background:var(--card2);border:1px solid var(--line);color:var(--tx2)}
.sheet button:hover{border-color:var(--line2)}
.sheet button.done{background:rgba(62,213,152,.14);border-color:rgba(62,213,152,.4);color:var(--ok)}
.sheet button.err{background:rgba(255,87,87,.14);border-color:rgba(255,87,87,.4);color:var(--bad)}
.sheet button.cur{background:var(--act);border-color:var(--act);color:var(--onact)}
.sheet button.na{opacity:.4}
.timer{font-family:"SFMono-Regular",Consolas,monospace;font-size:52px;line-height:1;letter-spacing:-.03em}
.qsrc{display:flex;flex-direction:column}
.qsrc .kv{display:flex;align-items:center;gap:14px;padding:13px 22px;border-top:1px solid var(--line);font-size:13px}
.qsrc .kv:first-child{border-top:0}
.qsrc .kv .k{width:76px;flex:none;color:var(--tx3);font-size:12px}
.qsrc .kv .v{color:var(--tx2);flex:1}
.passage{border:1px solid var(--line);border-radius:var(--r-l);background:var(--card);padding:24px 26px;
  font-size:15px;line-height:1.95;color:var(--tx2)}
.passage::first-line{color:var(--tx)}

/* ---------- 统计 ---------- */
.statbars{display:flex;flex-direction:column}
.statrow{display:flex;align-items:center;gap:16px;padding:14px 22px;border-top:1px solid var(--line)}
.statrow:first-child{border-top:0}
.statrow .k{width:200px;flex:none;font-size:13px;color:var(--tx2)}
.statrow .bar{flex:1}
.statrow .v{width:96px;flex:none;text-align:right;font-family:"SFMono-Regular",Consolas,monospace;font-size:13px;color:var(--tx)}
.memrow{display:flex;align-items:center;gap:14px;padding:13px 22px;border-top:1px solid var(--line)}
.memrow:first-child{border-top:0}
.memrow .w{width:150px;flex:none;font-family:"SFMono-Regular",Consolas,monospace;font-size:13px;font-weight:650}
.memrow .box{display:flex;gap:4px}
.memrow .box i{width:22px;height:16px;border-radius:4px;background:#20242B;border:1px solid var(--line)}
.memrow .box i.f{background:var(--ok);border-color:var(--ok)}
.memrow .v{margin-left:auto;font-size:12px;color:var(--tx3)}

/* ---------- Agent ---------- */
.toolrow{display:flex;align-items:center;gap:14px;padding:13px 22px;border-top:1px solid var(--line)}
.toolrow:first-child{border-top:0}
.toolrow .nm{width:210px;flex:none;font-family:"SFMono-Regular",Consolas,monospace;font-size:12.5px;color:var(--tx)}
.toolrow .d{flex:1;font-size:13px;color:var(--tx2)}
.logrow{display:flex;gap:14px;padding:11px 22px;border-top:1px solid var(--line);font-size:12px;align-items:center}
.logrow:first-child{border-top:0}
.logrow .t{font-family:"SFMono-Regular",Consolas,monospace;color:var(--tx3);flex:none;width:64px}
.logrow .n{font-family:"SFMono-Regular",Consolas,monospace;color:var(--tx2);flex:1}
.jevc{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.jevc .c{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r-m);
  background:var(--card2);border:1px solid var(--line)}
.jevc .c .w{margin-left:auto;font-family:"SFMono-Regular",Consolas,monospace;font-size:12px;color:var(--tx2)}
.jevc .c .pick{border-color:var(--act)}

/* 空态 / 提示 */
.hint{font-size:12px;line-height:1.75;color:var(--tx3);border-left:2px solid var(--line2);padding-left:12px}
.kbd{font-family:inherit;font-size:12px;border:1px solid var(--line2);border-radius:5px;padding:1px 6px;color:var(--tx3);background:var(--card2)}
.reveal{display:none}.reveal.on{display:block}

@media (max-width:1420px){
  .courses{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero{grid-template-columns:minmax(0,1fr) 300px}
}
@media (max-width:1180px){
  .app{grid-template-columns:84px minmax(0,1fr)}
  .brand div,.navitem span,.resume,.streak{display:none}
  .grid2,.grid2b,.hero,.wgrid{grid-template-columns:minmax(0,1fr)}
  .cls3{grid-template-columns:minmax(0,1fr)}
  .tocpane{max-height:none}
  .top{padding:0 24px}.page{padding:24px 24px 64px}
}

/* ============ 接线新增（V3 设计系统延续，不加渐变/发光） ============ */
[hidden]{display:none!important}
.booterr{margin:24px;padding:22px 26px;border:1px solid var(--line2);border-radius:var(--r-l);background:var(--card)}
.booterr b{display:block;font-size:16px;margin-bottom:8px}
.booterr p{font-size:13px;color:var(--tx2);margin-top:4px}
.logrow .r{flex:1;color:var(--tx3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.logrow .ms{flex:none;width:60px;text-align:right;color:var(--tx3)}
.logrow .bdg{flex:none}
#clsMenu{position:absolute;z-index:60;min-width:300px;padding:8px;margin-top:52px}
#clsMenu button,#examMenu button{display:flex;width:100%;text-align:left;padding:10px 12px;border-radius:8px;font-size:13.5px;align-items:center}
#clsMenu button:hover,#examMenu button:hover{background:var(--card2)}
#clsMenu button .sub,#examMenu button .sub{margin-left:auto;font-size:12px;color:var(--tx3)}
.pickbar{position:relative}
#dwlist .wordline{cursor:pointer}
#dwlist .wordline:hover b{color:var(--act)}
#plineNow{font-variant-numeric:tabular-nums}
.barwrap .mk{cursor:pointer}
#vocabmap button span{line-height:1.5}
#examGroups .chip{margin-right:8px}
.top{position:relative}
#searchPop{position:absolute;right:0;top:calc(100% - 4px);z-index:80;width:520px;max-height:70vh;overflow-y:auto}
#searchPop .sh{display:flex;align-items:center;gap:8px;padding:12px 18px 8px;font-size:11px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);border-top:1px solid var(--line)}
#searchPop .sh:first-child{border-top:0}
#searchPop button{display:block;width:100%;text-align:left;padding:9px 18px}
#searchPop button:hover{background:var(--card2)}
#searchPop button b{font-size:13px;font-weight:600}
#searchPop button .sub{display:block;margin-top:2px}
input.tocsearch{width:100%;height:34px;padding:0 12px;border-radius:9px;background:var(--card2);
  border:1px solid var(--line);font-size:12.5px;color:var(--tx)}
input.tocsearch::placeholder{color:var(--tx3)}
input.tocsearch:focus{border-color:var(--act);outline:none}
.sbox{display:flex;align-items:center;gap:8px;height:36px;padding:0 6px 0 12px;border-radius:var(--r-p);
  background:var(--card2);border:1px solid var(--line);color:var(--tx3);min-width:290px}
.sbox input{flex:1;min-width:0;font-size:13px;color:var(--tx)}
.sbox input::placeholder{color:var(--tx3)}
.sbox:focus-within{border-color:var(--line2)}
.sgo{height:26px;padding:0 12px;border-radius:var(--r-p);background:var(--act);color:var(--onact);
  font-size:12px;font-weight:700}

/* ---- 第 2 期新增 ---- */
[hidden]{display:none!important}
.devlink{margin:0 10px 12px;padding:8px 10px;border-radius:8px;font-size:12px;color:var(--tx3);
  text-align:left;transition:.15s var(--ease)}
.devlink:hover{background:#1A1D24;color:var(--tx2)}
.tagbox{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px;
  padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--card2)}
.tagbox .lbl{margin-right:2px}
.tagbox button{height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--line2);
  font-size:13px;color:var(--tx2);transition:.15s var(--ease)}
.tagbox button:hover{border-color:var(--act);color:var(--tx)}
.tagbox button.on{border-color:var(--act);color:var(--act);font-weight:700}
.tagbox .done{font-size:12px;color:var(--tx3);margin-left:auto}

/* 题源条：五科共用一张表，选的是「从哪个源取题」，不是选科目 */
.srcbar{display:flex;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.srcbar button{flex:1 1 180px;display:flex;flex-direction:column;gap:6px;padding:14px 16px;
  border:1px solid var(--line);border-radius:var(--r-m);background:var(--card);text-align:left;
  transition:.15s var(--ease);min-height:74px}
.srcbar button:hover{border-color:var(--line2);background:#1B1E25}
.srcbar button.on{border-color:var(--act);background:rgba(255,107,31,.07)}
.srcbar .sn{font-size:13.5px;font-weight:700;color:var(--tx2);display:flex;align-items:center;gap:8px}
.srcbar button.on .sn{color:var(--tx)}
.srcbar .sm{font-size:12px;color:var(--tx3);font-family:"SFMono-Regular",Consolas,monospace}
.srcbar .sj{font-size:11.5px;color:var(--tx3)}
.srcbar button.on .sj{color:var(--tx2)}
.srcbar .dot{width:7px;height:7px;border-radius:50%;flex:none}
/* 第一行是科目（英语/计算机/政治…），第二行才是这一科底下的题源。
   五个题源平铺会让人以为「只有英语」，所以拆两层。 */
.srcbar .sbtn{flex:0 1 auto;min-width:150px;flex-direction:row;align-items:center;gap:10px;padding:11px 16px}
.srcbar .sbtn .sn{font-size:13px;white-space:nowrap}
.srcbar .sbtn .sm{margin-left:auto;font-size:11px;white-space:nowrap}
.srcbar.srclist{margin-top:-6px;padding-left:2px}
.srcbar.srclist:empty{display:none}
/* 填空/简答：不是四选一的题，让手去敲 */
.fillin{display:flex;gap:12px;margin-top:6px}
.fillin input{flex:1;height:52px;padding:0 16px;border-radius:var(--r-m);border:1px solid var(--line2);

/* ---------- 一句话入口（今日页） ---------- */
.askbox{padding:18px 20px}
.askhd{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.askhd h3{margin:0;font-size:15px;font-weight:750;letter-spacing:.2px}
.askrow{display:flex;gap:10px}
.askrow input{flex:1 1 auto;height:52px;padding:0 16px;border-radius:var(--r);border:1px solid var(--line2);
  background:var(--bg2,#101216);color:var(--tx);font-size:15px;font-weight:550;outline:none;transition:.15s var(--ease)}
.askrow input::placeholder{color:var(--dim);font-weight:500}
.askrow input:focus{border-color:var(--act)}
.askrow .btn{flex:0 0 auto;height:52px;padding:0 22px;border-radius:var(--r)}
.asktry{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.asktry .chip{cursor:pointer}
.askout{margin-top:16px;padding:16px 18px;border-radius:var(--r);border:1px solid var(--line);background:var(--card2,#14161B)}
.askout[data-k="planned"]{border-color:rgba(95,196,140,.45)}
.askout[data-k="refuse"]{border-color:rgba(214,122,122,.45)}
.askout[data-k="ask"]{border-color:rgba(226,168,80,.45)}
.askout>.say{font-size:14.5px;line-height:1.72;color:var(--tx);font-weight:550}
.askout>.why{margin-top:10px;font-size:13px;line-height:1.7;color:var(--tx2)}
.askout>.why b{color:var(--tx);font-weight:700}
.askout>.acts{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.askok{display:inline-flex;align-items:center;gap:5px;margin-left:6px;font-size:12px;color:#5fc48c}
@media (max-width:760px){
  .askrow{flex-direction:column}
  .askrow .btn{width:100%}
}

  background:var(--card2);color:var(--tx);font-size:14px;font-family:inherit;outline:none}
.fillin input:focus{border-color:var(--act)}
.fillin .btn{flex:none;height:52px}
.fillin input:disabled{opacity:.6}

/* ---- 第 3 期新增 ---- */
.scorecard{margin-top:18px;padding:18px 20px;border-radius:var(--r-l);
  background:var(--card2);border:1px solid var(--line)}
.scorecard .sctop{display:flex;align-items:flex-start;gap:14px}
.scorecard .scnum{font-family:"SFMono-Regular",Consolas,monospace;font-size:40px;line-height:1.1;
  letter-spacing:-.03em;margin-top:6px}
.scorecard .scnum small{font-size:13px;color:var(--tx3);font-family:inherit;letter-spacing:0;margin-left:6px}
.scorecard .sctop .bdg{margin-left:auto}
.scorecard .scmeta{margin-top:10px;font-size:12.5px;color:var(--tx3);line-height:1.7}
.cimg .sents{display:flex;flex-direction:column;gap:8px;padding:11px}
.cimg .sents .k{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tx3)}
.cimg .sents .sbody{display:flex;flex-direction:column;gap:9px}
.cimg .sent p{font-size:11.5px;line-height:1.65;color:var(--tx2)}
.cimg .sent span{display:block;margin-top:3px;font-size:10px;color:var(--tx3);line-height:1.5}
.cimg figcaption{white-space:normal}

/* ---- 第 4 期新增 ---- */
#timeCard .kpis{grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
#timeCard .kpi{border-right:1px solid var(--line);border-bottom:0}
#timeCard .kpi:last-child{border-right:0}
#timeCard .statrow{padding:9px 0}
.bakrow{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.bakrow:first-child{border-top:0}
.bakrow .nm{font-family:"SFMono-Regular",Consolas,monospace;font-size:12px;color:var(--tx2);
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bakrow .sz{font-size:11.5px;color:var(--tx3);flex:none}
.bakrow .tag{font-style:normal;font-size:10px;letter-spacing:.04em;color:var(--tx3);
  border:1px solid var(--line);border-radius:4px;padding:1px 5px;margin-left:8px;vertical-align:1px}
/* 自动副本压暗一档，一眼看出不是自己导的 */
.bakrow.auto .nm{color:var(--tx3)}
.bakrow.auto{border-top-style:dashed}
/* 多端同步包列表：设备名不用等宽字体，本机那份右侧给个标签而不是按钮 */
#syncList .bakrow .nm{font-family:inherit;font-size:13px}
.tagme{flex:none;font-size:10px;letter-spacing:.04em;color:var(--tx3);
  border:1px solid var(--line);border-radius:4px;padding:1px 5px}

/* ---- 本讲考点 → 题库分部（点一下直接刷这一分部） ---- */
.dqcovers{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.dqcovers:empty{display:none}
.coverchip{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;
  padding:8px 12px;background:var(--card2);border:1px solid var(--line);border-radius:10px;cursor:pointer;
  font:inherit;color:inherit;transition:border-color .16s,background .16s}
.coverchip:hover{border-color:var(--tx3);background:var(--card)}
.coverchip b{font-size:12.5px;font-weight:600;color:var(--tx)}
.coverchip span{font-size:11px;color:var(--tx3);line-height:1.4}
.coverchip[data-picked]{border-color:var(--act);background:var(--card)}

/* ============================================================
   背单词（重做）—— 版面只留三块：词、四个释义、页脚两个按钮。
   旧版的流程解说、进度条文案、A–D 快捷键提示、默写入口在认词阶段全部不出现。
   ============================================================ */
#p-vocab{padding-top:6px}

/* 顶部一条：词组 + 今日词量 + 两个入口，克制到只有一行 */
.vbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.vbar-g{display:inline-flex;align-items:center;height:30px;padding:0 12px;border-radius:8px;
  background:rgba(255,107,31,.12);color:var(--act);font-size:12.5px;font-weight:700;letter-spacing:.02em}
.vbar-n{font-size:12.5px;color:var(--tx3)}
.vbar-sp{flex:1}
.vbtn{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:9px;
  border:1px solid var(--line);color:var(--tx2);font-size:12.5px;font-weight:600;transition:.15s var(--ease)}
.vbtn .ic{width:14px;height:14px}
.vbtn:hover{border-color:var(--line2);color:var(--tx);background:var(--card2)}

.vmap{margin-bottom:14px;border:1px solid var(--line);border-radius:14px;background:var(--card);padding:14px 16px}
.vmap[hidden]{display:none}
.vmap-hd{display:flex;align-items:baseline;gap:12px;margin-bottom:10px}
.vmap-hd b{font-size:13px;font-weight:700}
.vmap-hd span{font-size:12px;color:var(--tx3)}
.vmap-body .wmap{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}

/* 主区：卡片 1fr + 侧栏 236px */
.vw{display:grid;grid-template-columns:minmax(0,1fr) 236px;gap:20px;align-items:start}
.vw-card{border:1px solid var(--line);border-radius:18px;background:var(--card);
  padding:18px 20px 16px;display:flex;flex-direction:column;min-height:472px;position:relative;transition:.18s var(--ease)}
.vw-card.ok{border-color:rgba(62,213,152,.5)}
.vw-card.bad{border-color:rgba(255,87,87,.5)}
.vw-prog{height:3px;border-radius:2px;background:var(--card2);overflow:hidden;margin-bottom:18px;flex:none}
.vw-prog>i{display:block;height:100%;width:0;background:var(--act);transition:width .35s var(--ease)}
.vw-stage{flex:1;display:flex;flex-direction:column;justify-content:center;width:100%}

/* ---- 卡片本体 ---- */
.wc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:22px;width:100%;align-items:start}
.wc-l{min-width:0}
.wc-w{font-size:52px;line-height:1.04;font-weight:800;letter-spacing:-.03em;word-break:break-word;
  font-family:"SFMono-Regular",Consolas,monospace}
.wc-ph{display:flex;align-items:center;gap:10px;margin-top:8px;color:var(--tx3);font-size:14px}
.wc-ph .pos{font-size:11.5px;color:var(--tx3);border:1px solid var(--line);border-radius:5px;padding:1px 5px}
.wc-say{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;
  border:1px solid var(--line);color:var(--tx2);transition:.15s var(--ease)}
.wc-say .ic{width:15px;height:15px}
.wc-say:hover{border-color:var(--act);color:var(--act)}
.wc-pic{margin:16px 0 0;border-radius:12px;overflow:hidden;background:var(--card2);border:1px solid var(--line)}
.wc-pic-slot{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;
  color:var(--tx3);font-size:12px}
.wc-pic-slot img{width:100%;height:100%;object-fit:cover;display:block}
.wc-pic figcaption{padding:7px 10px;font-size:10.5px;color:var(--tx3);border-top:1px solid var(--line)}
.wc-pic figcaption:empty{display:none}

.wc-r{min-width:0}
.wc-opts{display:flex;flex-direction:column;gap:10px}
.wc-opts .opts{display:flex;flex-direction:column;gap:10px}
.wc-opts .opt{width:100%;min-height:56px;padding:0 16px;border-radius:12px;border:1px solid var(--line2);
  background:var(--card2);color:var(--tx);font-size:15px;font-weight:650;text-align:left;
  display:flex;align-items:center;gap:12px;transition:.14s var(--ease)}
.wc-opts .opt i{font-style:normal;flex:none;width:20px;font-size:12px;font-weight:800;color:var(--tx3)}
.wc-opts .opt:hover:not(:disabled){border-color:var(--act);background:rgba(255,107,31,.06)}
.wc-opts .opt.ok{border-color:rgba(62,213,152,.6);background:rgba(62,213,152,.1);color:var(--ok)}
.wc-opts .opt.bad{border-color:rgba(255,87,87,.6);background:rgba(255,87,87,.1);color:var(--bad)}
.wc-opts .opt:disabled{cursor:default}

.wc-def{font-size:22px;line-height:1.45;font-weight:700;letter-spacing:-.01em}
.wc-r .sents{margin-top:14px;font-size:13px;line-height:1.75;color:var(--tx2);max-height:150px;overflow:auto}
.wc-r .sents .sent+.sent{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line)}
.wc-r .sents .cn{color:var(--tx3);font-size:12px}
.wc-memo{margin-top:14px;font-size:12.5px;line-height:1.7;color:var(--tx3)}
.wc-memo .wc-m+.wc-m{margin-top:5px}
.wc-memo .wc-m:first-child{color:var(--tx2)}

.wc-foot{display:flex;gap:10px;margin-top:18px;flex:none}
.wc-foot .wc-1,.wc-foot .wc-2{flex:1;height:52px;border-radius:12px;font-size:15px;font-weight:700;
  transition:.15s var(--ease)}
.wc-foot .wc-1{background:var(--act);color:var(--onact)}
.wc-foot .wc-1:hover:not(:disabled){filter:brightness(1.08)}
.wc-foot .wc-2{border:1px solid var(--line2);color:var(--tx2);background:transparent}
.wc-foot .wc-2:hover:not(:disabled){border-color:var(--tx3);color:var(--tx)}
.wc-foot .wc-1:disabled,.wc-foot .wc-2:disabled{opacity:.4;cursor:default}
.wc-skip{margin:0 auto;height:38px;padding:0 22px;border-radius:10px;border:0;background:transparent;
  color:var(--tx3);font-size:12.5px;transition:.15s var(--ease)}
.wc-skip:hover{color:var(--tx2)}

/* ---- 侧栏：词表 + 战绩 + 加练 ---- */
.vw-side{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:14px 0 12px;
  display:flex;flex-direction:column;position:sticky;top:10px}
.vw-side-hd{display:flex;align-items:baseline;gap:8px;padding:0 14px 10px;border-bottom:1px solid var(--line)}
.vw-side-hd b{font-size:12.5px;font-weight:700}
.vw-side-hd span{margin-left:auto;font-size:11px;color:var(--tx3)}
.vw-list{max-height:376px;overflow:auto;padding:6px 8px}
.vw-list .wt{display:flex;align-items:center;gap:8px;width:100%;padding:0 6px;height:30px;border-radius:7px;
  text-align:left;font-size:12.5px;color:var(--tx2)}
.vw-list .wt .st{width:5px;height:5px;border-radius:50%;background:var(--line2);flex:none}
.vw-list .wt b{font-weight:600;color:var(--tx2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vw-list .wt.on{background:rgba(255,107,31,.12)}
.vw-list .wt.on b{color:var(--act)}
.vw-list .wt.ok .st{background:var(--ok)}
.vw-list .wt.bad .st{background:var(--bad)}
.vw-list .wt .cn,.vw-list .wt .d{display:none}

.vw-stats{display:flex;gap:12px;flex-wrap:wrap;padding:10px 14px;border-top:1px solid var(--line);
  font-size:11.5px;color:var(--tx3)}
.vw-stats b{color:var(--tx2);font-weight:700;margin-left:3px}
.vw-modes{display:flex;flex-wrap:wrap;gap:6px;padding:10px 14px 0;border-top:1px solid var(--line);margin-top:2px}
.vw-modes:empty{display:none}
.vw-modes button{height:28px;padding:0 10px;border-radius:8px;border:1px solid var(--line);
  font-size:11.5px;font-weight:600;color:var(--tx3)}
.vw-modes button:hover{color:var(--tx2);border-color:var(--line2)}
.vw-modes button.on{background:var(--act);border-color:var(--act);color:var(--onact)}
.vw-modes .endbt{border-style:dashed}

/* ---- 页脚反馈 + 主按钮 ---- */
.vfoot{margin-top:14px;display:flex;align-items:center;gap:14px}
.vfoot-fb{display:none;flex:1;align-items:center;gap:10px;padding:0 14px;height:44px;border-radius:11px;
  border:1px solid var(--line);font-size:13px}
.vfoot-fb.on{display:flex}
.vfoot-fb.ok{border-color:rgba(62,213,152,.5);background:rgba(62,213,152,.08)}
.vfoot-fb.bad{border-color:rgba(255,87,87,.5);background:rgba(255,87,87,.08)}
.vfoot-fb b{font-size:13px}
.vfoot-fb span{color:var(--tx3);font-size:12px}
.vcta{height:44px;min-width:180px;padding:0 28px;border-radius:11px;background:var(--act);color:var(--onact);
  font-size:14px;font-weight:700}
.vcta:hover{filter:brightness(1.08)}

/* 窄屏：卡片单列，侧栏落到下面 */
@media (max-width:900px){
  .vw{grid-template-columns:1fr}
  .wc{grid-template-columns:1fr;gap:14px}
  .vw-side{position:static;order:2}
  .vw-list{max-height:180px}
  .wc-w{font-size:38px}
}


/* ========== 背单词三栏 v2 ========== */
/* ============================================================
   背单词 · 全宽三栏（左 词表 / 中 答题 / 右 战绩）
   —— 版面语言照用户给的参考稿：贴边整栏、左对齐、印刷体标题、
      没有一个居中漂浮的区块，也没有流程解说。
   ============================================================ */
/* 页面本身在 .main / .pages 里是绝对定位的滚动容器，这里只把内部改成一屏三栏。
   尺寸不用 100vh 猜：靠 top/bottom 撑满可视高，左侧栏和右侧栏才会真正贴边。 */
#p-vocab{padding:0!important;overflow:hidden}
#p-vocab.on{display:flex;flex-direction:column;height:100%;min-height:0}

.vx{flex:1;display:grid;grid-template-columns:276px minmax(0,1fr) 264px;
  height:100%;min-height:0;overflow:hidden;position:relative}
.vx.hide-list{grid-template-columns:0 minmax(0,1fr) 264px}
.vx.hide-list .vx-list{opacity:0;pointer-events:none;border:0}

/* ---------------- 左：词表 ---------------- */
.vx-list{background:var(--card);border-right:1px solid var(--line);display:flex;flex-direction:column;
  min-height:0;overflow:hidden;transition:opacity .18s var(--ease)}
.vx-list-hd{padding:16px 16px 12px;border-bottom:1px solid var(--line);flex:none}
.vx-list-t{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.vx-list-t b{font-size:14px;font-weight:700;letter-spacing:.01em}
.vx-list-t span{font-size:11px;color:var(--tx3);font-variant-numeric:tabular-nums}
.vx-bar{height:4px;border-radius:99px;background:var(--card2);overflow:hidden}
.vx-bar>i{display:block;height:100%;width:0;background:var(--act);border-radius:99px;transition:width .4s var(--ease)}
.vx-items{flex:1;min-height:0;overflow-y:auto;padding:8px}
.vx-items::-webkit-scrollbar{width:5px}
.vx-items::-webkit-scrollbar-thumb{background:var(--line2);border-radius:99px}
.vx-items .wt{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:9px;
  text-align:left;border:1px solid transparent;transition:background .14s var(--ease);white-space:nowrap}
.vx-items .wt:hover{background:var(--card2)}
.vx-items .wt .st{width:20px;height:20px;flex:none;border-radius:50%;background:var(--card2);
  color:var(--tx3);font-size:10px;font-weight:700;display:inline-grid;place-items:center}
.vx-items .wt b{flex:none;font-size:13.5px;font-weight:600;color:var(--tx)}
.vx-items .wt .cn{flex:1;min-width:0;font-size:12px;color:var(--tx3);overflow:hidden;text-overflow:ellipsis}
.vx-items .wt .d{flex:none;font-size:10px;color:var(--tx3);background:var(--card2);padding:1px 6px;border-radius:5px}
.vx-items .wt.on{background:rgba(255,107,31,.1);border-color:rgba(255,107,31,.32)}
.vx-items .wt.on b{color:var(--act)}
.vx-items .wt.on .st{background:var(--act);color:var(--onact)}
.vx-items .wt.ok .st{background:rgba(62,213,152,.16);color:var(--ok)}
.vx-items .wt.bad .st{background:rgba(255,87,87,.16);color:var(--bad)}

.vx-score{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);
  border-top:1px solid var(--line)}
.vx-score>div{background:var(--card);padding:9px 12px;display:flex;align-items:baseline;justify-content:space-between}
.vx-score span{font-size:11px;color:var(--tx3)}
.vx-score b{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}

/* ---------------- 中：答题 ---------------- */
.vx-quiz{min-width:0;min-height:0;overflow-y:auto;padding:0 40px 24px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:0}
.vx-quiz>.vx-bar{border-radius:0;margin:0 -40px 0;height:3px;flex:none}
.vx-top{display:flex;align-items:center;gap:12px;height:56px;flex:none}
.vx-ic{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;
  border:1px solid var(--line);color:var(--tx2);background:var(--card);transition:.15s var(--ease)}
.vx-ic .ic{width:16px;height:16px}
.vx-top button#wrongBtn{display:inline-grid!important;place-items:center;padding:0!important;
  width:32px;min-width:32px;height:32px;flex:0 0 32px}
.vx-ic:hover{color:var(--act);border-color:var(--act)}
.vx-unit{flex:none;white-space:nowrap;font-size:12.5px;font-weight:700;color:var(--act);
  background:rgba(255,107,31,.1);border:1px solid rgba(255,107,31,.28);border-radius:99px;
  padding:4px 12px;letter-spacing:.01em}
.vx-goal{flex:none;white-space:nowrap;font-size:12.5px;color:var(--tx3);font-variant-numeric:tabular-nums}
.vx-sp{flex:1;min-width:8px}
.vx-txt{flex:none;white-space:nowrap;height:32px;padding:0 12px;border-radius:9px;border:1px solid var(--line);
  background:var(--card);color:var(--tx2);font-size:12.5px;font-weight:600;transition:.15s var(--ease)}
.vx-txt:hover{color:var(--tx);border-color:var(--line2)}

.vx-stage{flex:1;display:flex;flex-direction:column;justify-content:center;padding:6px 0 0;min-height:0;overflow-y:auto}
/* 反馈条是覆盖在舞台底部的，不是文档流块；否则它横穿卡片。 */
.vx-fb{position:absolute;left:50%;transform:translateX(-50%);bottom:14px;z-index:6;
  display:none;align-items:center;gap:8px;max-width:min(720px,calc(100% - 48px));
  padding:9px 16px;border-radius:11px;font-size:13px;font-weight:700;line-height:1.3;
  background:var(--card2);border:1px solid var(--line);color:var(--tx2);box-shadow:var(--shadow)}
.vx-fb.on{display:flex}
.vx-fb.on.ok{border-color:rgba(64,196,128,.5);color:#7ee2a8}
.vx-fb.on.bad{border-color:rgba(255,107,31,.5);color:var(--act)}
.vx-fb .r{font-weight:500;color:var(--tx3)}
.vx-quiz{position:relative}
.vx-knowacts{flex:none;display:flex;gap:12px;width:100%;max-width:790px;margin-top:14px}
.vx-knowacts button{flex:1;height:46px;border-radius:11px;border:1px solid var(--line);
  background:var(--card2);color:var(--tx2);font-size:14px;font-weight:700;cursor:pointer;transition:.15s var(--ease)}
.vx-knowacts button.b1{background:var(--act);border-color:var(--act);color:#fff}
.vx-knowacts button.b2:hover{color:var(--tx);border-color:var(--line2)}
.vx-knowacts button[disabled]{opacity:.4;cursor:default}
.vx-ex{width:100%;max-width:790px;margin-top:12px;border:1px solid var(--line);border-radius:12px;
  background:var(--card2);padding:10px 14px}
.vx-ex .k{display:block;font-size:11px;letter-spacing:.06em;color:var(--act);font-weight:700;margin-bottom:6px}
.vx-ex .sents{display:flex;flex-direction:column;gap:8px;max-height:132px;overflow-y:auto;font-size:13px;color:var(--tx2)}
.vx-ex .sent p{margin:0;line-height:1.5}
.vx-ex .sent span{display:block;margin-top:2px;font-size:11px;color:var(--tx3)}
/* 例句收藏：星标小按钮，收了就是实心黄，不收是描边灰，不用 emoji */
.vx-ex .sent{position:relative;padding-right:70px}
.sent-fav{position:absolute;right:0;top:0;display:inline-flex;align-items:center;gap:4px;
  padding:3px 7px;border:1px solid var(--line);border-radius:999px;background:transparent;
  color:var(--tx3);font-size:10.5px;font-weight:600;cursor:pointer;transition:.15s}
.sent-fav .ic{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.6}
.sent-fav:hover{border-color:var(--tx3);color:var(--tx2)}
.sent-fav.on{border-color:#d99a2b;color:#d99a2b;background:rgba(217,154,43,.08)}
.sent-fav.on .ic{fill:#d99a2b;stroke:#d99a2b}
/* ---- 例句收藏夹：按词分组的一页纸 ---- */
.wc-fav{padding:18px 22px;max-height:100%;overflow:auto}
.wc-fav-list{margin-top:14px;display:flex;flex-direction:column;gap:16px}
.wc-fav-g{border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.wc-fav-w{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}
.wc-fav-w b{font-size:17px;letter-spacing:-.01em}
.wc-fav-w span{font-size:11px;color:var(--tx3)}
.wc-fav-sent{position:relative;padding:8px 74px 8px 0;border-top:1px dashed var(--line);font-size:13px;line-height:1.7;color:var(--tx2)}
.wc-fav-sent:first-of-type{border-top:none}
.wc-fav-sent p{margin:0}
.wc-fav-sent>span{display:block;margin-top:3px;font-size:10.5px;color:var(--tx3)}
.wc-fav-sent .sent-fav{top:8px}
.vx-memo{width:100%;max-width:790px;margin-top:10px;max-height:96px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--tx2);flex:none}
.vx-memo:empty{display:none}
/* 定位/层级用隔离，避免旧规则把它按文档流顶出卡片 */
.vx-ex,.vx-memo,.vx-knowt{position:static;position:relative}
.vx-memo .wc-m{display:flex;gap:8px;line-height:1.5}
.vx-memo .wc-m b{flex:0 0 auto;color:var(--tx3);font-weight:600}
.vx-memo .wc-m span{min-width:0}

/* ---- 卡片：左对齐，词与图同排，选项 2×2 ---- */
.vx-card{width:100%;max-width:860px;display:flex;flex-direction:column;gap:0}
.vx-card-hd{display:flex;align-items:flex-end;gap:36px;margin-bottom:26px}
.vx-word{min-width:0}
.vx-w{font-size:clamp(34px,4.4vw,54px);line-height:1.05;font-weight:800;letter-spacing:-.035em;
  font-family:"SFMono-Regular",Consolas,"Cascadia Mono",monospace;word-break:break-word}
.vx-wm{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:15px;color:var(--tx2)}
.vx-wm .pos{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.02em;color:var(--act);
  background:rgba(255,107,31,.12);border-radius:6px;padding:3px 9px}
.vx-say{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;
  border:1px solid var(--line2);background:var(--card2);color:var(--tx2);transition:.15s var(--ease)}
.vx-say .ic{width:15px;height:15px}
.vx-say:hover{color:var(--act);border-color:var(--act)}
.vx-pic{flex:none;width:150px;height:150px;border-radius:16px;overflow:hidden;border:1px solid var(--line);
  background:var(--card2);display:flex;flex-direction:column;color:var(--tx3);font-size:11px}
.vx-pic .wc-pic-slot{flex:1;min-height:0;width:100%;display:grid;place-items:center;overflow:hidden}
.vx-pic img{width:100%;height:100%;object-fit:cover;display:block}
/* 图注只在「这张不是本词主图」时才有字；空的时候不占位，不给卡片留一条空框 */
.vx-pic figcaption{display:none}
.vx-pic figcaption:not(:empty){display:block;flex:none;width:100%;padding:3px 5px 4px;text-align:center;
  font-size:10px;line-height:1.25;color:var(--tx3);background:rgba(0,0,0,.28)}

.vx-q{font-size:13px;color:var(--tx3);margin-bottom:14px}
.vx-q b{color:var(--tx2);font-weight:600}
.vx-opts{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:660px}
.vx-opts .opt{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 16px;border-radius:12px;
  background:var(--card);border:1.5px solid var(--line);color:var(--tx);font-size:15px;font-weight:600;
  text-align:left;transition:.15s var(--ease)}
.vx-opts .opt i{flex:none;width:26px;height:26px;border-radius:7px;background:var(--card2);border:1px solid var(--line2);
  color:var(--tx3);font-style:normal;font-size:12px;font-weight:800;display:inline-grid;place-items:center}
.vx-opts .opt:hover:not(:disabled){border-color:var(--line2);background:var(--card2);transform:translateY(-1px)}
.vx-opts .opt.ok{border-color:var(--ok);background:rgba(62,213,152,.1)}
.vx-opts .opt.ok i{background:var(--ok);border-color:var(--ok);color:#08120d}
.vx-opts .opt.bad{border-color:var(--bad);background:rgba(255,87,87,.1)}
.vx-opts .opt.bad i{background:var(--bad);border-color:var(--bad);color:#1a0808}
.vx-opts .opt:disabled{cursor:default}

.vx-ex{margin-top:22px;max-width:660px;background:var(--card);border:1px solid var(--line);
  border-radius:12px;padding:14px 18px;font-size:13.5px;line-height:1.75;color:var(--tx2)}
.vx-ex .k{display:block;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--act);margin-bottom:7px}
.vx-ex b{color:var(--tx)}
.vx-def{font-size:15px;color:var(--tx2);margin-bottom:8px}
.cimg .vx-memo{margin-top:14px;font-size:12.5px;line-height:1.75;color:var(--tx3)}

/* ---- 第二 / 第三轮：词面 + 释义 + 例句 + 记忆 ---- */
.vx-knowt{display:flex;align-items:flex-end;gap:36px;margin-bottom:20px}
.vx-knowdef{font-size:22px;font-weight:700;line-height:1.4;color:var(--tx)}
.vx-knowacts{display:flex;gap:12px;margin-top:26px;max-width:660px}
.vx-knowacts button{flex:1;height:52px;border-radius:12px;font-size:15px;font-weight:700;transition:.15s var(--ease)}
.vx-knowacts .b1{background:var(--act);color:var(--onact)}
.vx-knowacts .b1:hover{filter:brightness(1.08)}
.vx-knowacts .b2{border:1px solid var(--line2);color:var(--tx2);background:var(--card)}
.vx-knowacts .b2:hover{border-color:var(--tx3);color:var(--tx)}
/* 第三档「模糊」：不认识是红边的拒绝，模糊是琥珀色的犹豫 —— 两者不能长一个样 */
.vx-knowacts .b3{border:1px solid rgba(240,178,64,.5);color:#b8862a;background:rgba(240,178,64,.08)}
.vx-knowacts .b3:hover{border-color:rgba(240,178,64,.85);background:rgba(240,178,64,.16)}
.knowend .kp.mid b{color:#d99a2b}
.vx-knowhint{flex:none;max-width:660px;margin-top:16px;font-size:12.5px;line-height:1.7;color:var(--tx3);
  padding:10px 14px;border-radius:10px;border:1px dashed var(--line2);background:var(--card)}
/* ---- 复习段：反馈不再做浮层 ----
   以前把 feedback 挪到 top:10px，结果盖住了复习卡顶部的词形（正是要看的那个词）。
   现在复习时它退回文档流，卡片自己被推上去，一个字都不挡。 */
.vx-quiz.rev .vx-fb{position:static;transform:none;max-width:none;width:auto;
  margin:14px auto 0;box-shadow:none}
.vx-quiz.rev .vx-fb.on{display:flex}
.vx-quiz.rev .vx-fb.on.mid{border-color:rgba(217,154,43,.5);color:#e7bd6e}
/* ---- 排卡条：这一轮背哪些、为什么是这个顺序（顺序是本机记录算的，不是随机的） ---- */
/* ---- 作文页 ---- */
.wlist{display:flex;flex-direction:column}
.witem{display:flex;flex-direction:column;gap:6px;padding:14px 22px;border-top:1px solid var(--line);
  cursor:pointer;text-align:left;background:none;border-left:2px solid transparent}
.witem:first-child{border-top:0}
.witem:hover{background:var(--card2)}
.witem.on{border-left-color:var(--act);background:var(--card2)}
.witem .wh{display:flex;align-items:center;gap:8px}
.witem .wh b{font-size:14px}
.witem .wtag{font-size:11px;padding:2px 7px;border-radius:99px;border:1px solid var(--line);color:var(--tx3)}
.witem .wp{font-size:12.5px;line-height:1.7;color:var(--tx3);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.witem .wm{font-size:11.5px;color:var(--tx3);font-variant-numeric:tabular-nums}
.wr-prompt{font-size:13px;line-height:1.8;color:var(--tx2);white-space:pre-wrap;
  border-left:2px solid var(--line);padding:2px 0 2px 12px;margin-bottom:14px}
.wr-in{width:100%;background:var(--card2);border:1px solid var(--line);border-radius:10px;
  color:var(--tx);font:14px/1.8 inherit;padding:14px 16px;resize:vertical}
.wr-in:focus{outline:none;border-color:var(--act)}
.wr-acts{display:flex;align-items:center;gap:12px;margin-top:12px}
.wr-count{margin-right:auto;font-size:12px;color:var(--tx3);font-variant-numeric:tabular-nums}
/* 批改结果：本机算的与模型算的分开摆，谁没判就写「没判」 */
.wrres{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.wr-dims{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.wr-dim{display:flex;align-items:center;gap:12px}
.wr-dim .dk{width:74px;flex:none;font-size:13px}
.wr-dim .db{flex:1;height:8px;border-radius:99px;background:var(--card2);overflow:hidden}
.wr-dim .db i{display:block;height:100%;background:var(--act)}
.wr-dim .dv{width:76px;flex:none;text-align:right;font-size:12px;color:var(--tx2);font-variant-numeric:tabular-nums}
.wr-dim.off .db i{background:var(--tx3);opacity:.35}
.wr-dim.off .dv{color:var(--tx3)}
.wr-pts{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.wr-pt{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;line-height:1.6}
.wr-pt b{flex:none;font-size:11px;padding:1px 6px;border-radius:99px;margin-top:2px;
  border:1px solid var(--line);color:var(--tx3)}
.wr-pt.hit b{border-color:rgba(90,190,140,.5);color:#6cc79b}
.wr-pt.miss b{border-color:rgba(224,96,96,.45);color:#e08a8a}
.wr-pt.unk b{border-color:var(--line);color:var(--tx3)}
.wr-note{font-size:12.5px;line-height:1.8;color:var(--tx3);border-left:2px solid var(--line);padding-left:12px;margin-top:12px}
.wr-mine{display:flex;flex-direction:column}
.wrm{display:flex;align-items:center;gap:10px;padding:12px 22px;border-top:1px solid var(--line);font-size:12.5px}
.wrm:first-child{border-top:0}
.wrm .wt{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tx2)}
.wrm .ws{flex:none;font-variant-numeric:tabular-nums;color:var(--tx3)}
.planbar{flex:none;margin:0 -40px 10px;padding:12px 40px 14px;border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(122,167,255,.10),rgba(122,167,255,0))}
.pl-hd{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
.pl-hd b{font-size:14px;color:var(--tx)}
.pl-hd span{font-size:12px;color:var(--tx3);font-variant-numeric:tabular-nums}
.pl-tiers{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.pl-t{font-size:12px;padding:3px 9px;border-radius:99px;border:1px solid var(--line);
  color:var(--tx2);background:var(--card2);font-variant-numeric:tabular-nums}
.pl-t b{color:var(--tx);font-weight:700;margin-left:4px}
.pl-t.t-overdue{border-color:rgba(224,96,96,.5);color:#e08a8a}
.pl-t.t-due{border-color:rgba(217,154,43,.5);color:#e0b464}
.pl-t.t-wrong{border-color:rgba(224,96,96,.35);color:#d98f8f}
.pl-t.t-freq{border-color:rgba(122,167,255,.5);color:#8fb7ff}
.pl-t.t-fresh{border-color:var(--line);color:var(--tx3)}
.pl-rule{margin:0;font-size:12px;line-height:1.7;color:var(--tx3)}
/* 卡面上的「排在这的理由」：不藏在 tooltip 里，做题前就能看见 */
.vx-why{display:flex;align-items:baseline;gap:8px;margin:10px 0 12px;font-size:13px;
  line-height:1.6;color:var(--tx2)}
.vx-why i{flex:none;font-style:normal;font-size:11px;padding:2px 7px;border-radius:99px;
  border:1px solid var(--line);color:var(--tx3);background:var(--card2)}

/* ---- 复习卡 ---- */
.vx-review .vx-w{font-size:38px}
/* 复习卡「翻开之前」：整屏只有英文词和发音，别的一个字都不给 */
.vx-card-blank{display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:210px;padding:34px 24px;text-align:center}
.vx-card-blank .vx-w{font-size:46px;letter-spacing:-.5px}
.vx-card-blank .vx-wm{justify-content:center;margin-top:16px}
.vx-q{font-size:15px;color:var(--tx3);margin-bottom:18px;line-height:1.6}
.vx-q b{color:var(--tx)}
/* ---- 打卡日历 ---- */
.wc-cal{width:100%;max-width:790px;padding:6px 2px}
.wc-cal-hd{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:18px}
.wc-cal-hd .kp{flex:1;min-width:140px;padding:14px 16px;border-radius:12px;
  border:1px solid var(--line);background:var(--card);text-align:center}
.wc-cal-hd .kp b{display:block;font-size:28px;line-height:1.1;letter-spacing:-.02em}
.wc-cal-hd .kp span{display:block;margin-top:5px;font-size:12px;color:var(--tx3)}
.wc-cal-hd .kp.ok b{color:var(--ok)}
.wc-cal-grid{display:grid;grid-template-columns:repeat(14,minmax(0,1fr));gap:5px}
.wc-cal-grid .cl{aspect-ratio:1;border-radius:4px;background:var(--line);display:block}
.wc-cal-grid .cl.l1{background:rgba(62,213,152,.28)}
.wc-cal-grid .cl.l2{background:rgba(62,213,152,.55)}
.wc-cal-grid .cl.l3{background:rgba(62,213,152,.95)}
/* ---- 生词本 / 今日复习 入口高亮 ---- */
.vx-ic.on,.vx-txt.on{border-color:var(--act);color:var(--act);background:rgba(90,141,255,.1)}

/* ---- 反馈 / 主按钮 / 加练 ---- */
.vx-fb{display:none;align-items:baseline;gap:12px;margin-top:16px;padding:11px 16px;border-radius:11px;
  border:1px solid var(--line);background:var(--card);font-size:13px;max-width:660px;flex:none}
.vx-fb.on{display:flex}
.vx-fb.ok{border-color:rgba(62,213,152,.45);background:rgba(62,213,152,.08)}
.vx-fb.bad{border-color:rgba(255,87,87,.45);background:rgba(255,87,87,.08)}
.vx-fb b{font-weight:700}
.vx-fb span{color:var(--tx3);font-size:12.5px}
.vx-act{display:flex;justify-content:center;margin-top:18px;min-height:52px;flex:none}
.vx-primary{height:52px;min-width:180px;padding:0 34px;border-radius:99px;background:var(--act);color:var(--onact);
  font-size:15px;font-weight:700;box-shadow:0 4px 20px rgba(255,107,31,.28);transition:.15s var(--ease)}
.vx-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.vx-primary[hidden]{display:none}
.vx-modes{display:flex;flex-wrap:nowrap;gap:8px;justify-content:center;margin-top:14px;flex:none;
  overflow-x:auto;max-width:100%;padding-bottom:2px}
.vx-modes:empty{display:none}
.vx-modes button{flex:none;white-space:nowrap;height:32px;padding:0 12px;border-radius:9px;border:1px solid var(--line);
  font-size:12px;font-weight:600;color:var(--tx3)}
.vx-modes button:hover{color:var(--tx2);border-color:var(--line2)}
.vx-modes button.on{background:var(--act);border-color:var(--act);color:var(--onact)}
.vx-modes .endbt{border-style:dashed;border-color:var(--line2);color:var(--tx2)}

/* ---------------- 右：战绩 ---------------- */
.vx-stats{background:var(--card);border-left:1px solid var(--line);padding:18px 18px 20px;
  display:flex;flex-direction:column;gap:10px;min-height:0;overflow-y:auto}
.vx-stats-hd{display:flex;align-items:baseline;justify-content:space-between}
.vx-stats-hd b{font-size:14px;font-weight:700}
.vx-stats-hd span{font-size:11px;color:var(--tx3)}
.vx-ring{position:relative;display:grid;place-items:center;margin:16px 0 10px}
.vx-ring-v{position:absolute;display:flex;flex-direction:column;align-items:center}
.vx-ring-v b{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
.vx-ring-v span{font-size:11px;color:var(--tx3);margin-top:2px}
.vx-kv{display:flex;align-items:baseline;justify-content:space-between;padding:11px 14px;border-radius:11px;
  background:var(--card2);border:1px solid var(--line)}
.vx-kv span{font-size:12.5px;color:var(--tx2)}
.vx-kv b{font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}

/* ---------------- 词表地图 / 浮动按钮 ---------------- */
.vx-map{position:absolute;left:276px;right:264px;top:0;bottom:0;z-index:30;overflow-y:auto;
  background:var(--bg);border-right:1px solid var(--line);padding:22px 26px}
.vx-map[hidden]{display:none}
.vx-map-hd{display:flex;align-items:baseline;gap:12px;margin-bottom:14px}
.vx-map-hd b{font-size:14px}
.vx-map-hd span{font-size:12px;color:var(--tx3)}
.vmap-body .wmap{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:8px}
.vx-fab{display:none;position:fixed;left:18px;bottom:18px;z-index:40;align-items:center;gap:8px;
  height:38px;padding:0 16px;border-radius:99px;border:1px solid var(--line2);background:var(--card2);
  color:var(--tx2);font-size:12.5px;font-weight:600;box-shadow:0 8px 28px rgba(0,0,0,.45)}
.vx-fab .ic{width:14px;height:14px}
.vx.hide-list ~ .vx-fab{display:inline-flex}
.vx-fab:hover{color:var(--act);border-color:var(--act)}

@media (max-width:1180px){
  .vx,.vx.hide-list{grid-template-columns:minmax(0,1fr) 264px}
  .vx-list{position:absolute;left:0;top:0;bottom:0;width:276px;z-index:35;box-shadow:0 0 40px rgba(0,0,0,.5)}
  .vx-map{left:0}
}
@media (max-width:860px){
  .vx,.vx.hide-list{grid-template-columns:1fr}
  .vx-stats{display:none}
  .vx-opts{grid-template-columns:1fr}
  .vx-w{font-size:38px}
}

/* ---------- AI 讲题：四段卡片（定位/依据/判断/纠错） ---------- */
.exh{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 4px}
.exv{font-weight:640;font-size:13px;padding:3px 10px;border-radius:999px;
  border:1px solid var(--line);color:var(--fg)}
.exv[data-t="good"]{border-color:rgba(86,196,140,.55);color:#5fc48c}
.exv[data-t="part"]{border-color:rgba(226,178,86,.55);color:#e2b256}
.exv[data-t="weak"]{border-color:rgba(214,110,110,.5);color:#d67a7a}
.exc,.exm{font-size:12px;color:var(--dim);font-family:var(--mono,monospace)}
.exparts{display:flex;flex-direction:column;gap:10px;margin:12px 0 4px}
.expart{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:rgba(255,255,255,.015)}
.expart>.pk{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:6px}
.expart>.pt{font-size:13.5px;line-height:1.7;color:var(--fg)}
.expart>.pf{font-size:11.5px;color:var(--dim);margin-top:6px}
.exline{display:flex;gap:8px;align-items:flex-start;margin-top:7px;font-size:13px;line-height:1.65}
.exline>.bd{flex:0 0 auto;font-family:var(--mono,monospace);font-size:10.5px;
  padding:1px 6px;border-radius:5px;border:1px solid var(--line);color:var(--dim)}
.exline>.bd[data-ok="1"]{border-color:rgba(86,196,140,.5);color:#5fc48c}
.exline>.bd[data-ok="0"]{border-color:rgba(214,110,110,.5);color:#d67a7a}
.exline>.tx{flex:1 1 auto}
.exline>.wh{flex:0 0 auto;font-size:11px;color:var(--dim)}
.exopts{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.exopt{display:flex;gap:9px;font-size:13px;line-height:1.6;align-items:baseline}
.exopt>.ok{flex:0 0 auto;width:16px;text-align:center;font-weight:700}
.exopt[data-s="right"]>.ok{color:#5fc48c}
.exopt[data-s="wrong"]>.ok{color:#d67a7a}
.exopt[data-s="unknown"]>.ok{color:var(--dim)}
.exopt>.ol{flex:0 0 auto;font-family:var(--mono,monospace);color:var(--dim);min-width:16px}
.exopt>.ot{flex:1 1 auto}
.exopt>.on{flex:0 0 auto;font-size:11px;color:var(--dim)}
.exvotes{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:12px;border-top:1px dashed var(--line)}
.exok{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#5fc48c}

/* ---------- 动效层（主界面） ----------
   三条规矩：
     1) 只碰 opacity / transform。碰 height / width / padding 会让布局重排，
        长列表滚动位置会跳。
     2) 时长上限 0.24s，步长 0.03s。主界面一天开好几次，动效过头就烦。
     3) 换页不改 display 语义（display:none → block 是即时的），
        入场动画挂在 .on 上做一次性淡入，不影响任何「在第几页」的判断。 */

/* 换页：整块淡进来 + 轻微上浮 */
.page.on{animation:pageIn .22s cubic-bezier(.2,.9,.2,1) both}
@keyframes pageIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* 侧栏选中项：左侧一道竖线滑出来，比整块背景变色更「准」 */
.navitem{position:relative}
.navitem::before{
  content:'';position:absolute;left:0;top:50%;width:2px;height:0;border-radius:2px;
  background:var(--act);transform:translateY(-50%);
  transition:height .18s var(--ease);
}
.navitem.on::before{height:18px}

/* 背单词：换词时卡片翻进来（不是硬切） */
.vx-card{animation:cardFlip .24s cubic-bezier(.2,.9,.2,1) both}
@keyframes cardFlip{
  from{opacity:0;transform:perspective(900px) rotateX(-7deg) translateY(8px)}
  to{opacity:1;transform:none}
}
/* 复习卡翻开答案那一刻：从「只有词」到「全出来」，给它一段展开 */
.vx-card-blank{animation:none}
.vx-knowdef,.vx-sents,.vx-memo{animation:reveal .22s cubic-bezier(.2,.9,.2,1) both}
@keyframes reveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}

/* 选项：逐个落位，答对答错各自有一下「应」 */
.vx-opts .opt{animation:optIn .2s cubic-bezier(.2,.9,.2,1) both}
.vx-opts .opt:nth-child(1){animation-delay:0s}
.vx-opts .opt:nth-child(2){animation-delay:.03s}
.vx-opts .opt:nth-child(3){animation-delay:.06s}
.vx-opts .opt:nth-child(4){animation-delay:.09s}
@keyframes optIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.vx-opts .opt.ok{animation:optOk .26s cubic-bezier(.2,.9,.2,1)}
@keyframes optOk{0%{transform:scale(1)}40%{transform:scale(1.025)}100%{transform:scale(1)}}
.vx-opts .opt.bad{animation:optBad .28s cubic-bezier(.36,.07,.19,.97)}
@keyframes optBad{
  0%,100%{transform:translateX(0)}
  22%{transform:translateX(-3px)}
  55%{transform:translateX(3px)}
  80%{transform:translateX(-1.5px)}
}

/* 反馈条：从下面顶上来，跟卡片同一节奏 */
.vx-fb.on{animation:fbIn .2s cubic-bezier(.2,.9,.2,1) both}
@keyframes fbIn{from{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%,0)}}
.vx-quiz.rev .vx-fb.on{animation:fbInStatic .2s cubic-bezier(.2,.9,.2,1) both}
@keyframes fbInStatic{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* 进度条：宽度变化走缓动（原来就有，这里统一到主缓动） */
.vx-bar>i,.vw-prog>i,.duo-top .bar>i{transition:width .38s cubic-bezier(.2,.9,.2,1)}

/* 打卡格：补上「今天刚点亮」的那一下 */
.wc-cal-grid i.cl{transition:background .2s var(--ease),transform .2s var(--ease)}
.wc-cal-grid i.cl.today{animation:todayPulse .9s var(--ease) 2}
@keyframes todayPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.16)}}

/* 右侧坞把手：展开时箭头转过去（原来就有），这里补一个呼吸让它在暗底上能被注意到 */
.ndock-tab .ic{transition:transform .22s var(--ease)}

/* 页面标题换字：淡一下，说明「你换了页」 */
#ptitle{transition:color .16s var(--ease)}

@media (prefers-reduced-motion: reduce){
  .page.on,.vx-card,.vx-knowdef,.vx-sents,.vx-memo,.vx-opts .opt,
  .vx-fb.on,.vx-quiz.rev .vx-fb.on,.wc-cal-grid i.cl.today{animation:none!important}
}

/* ---------- 用哪家的模型说话 ---------- */
.aiprov{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.aiprov .apr{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:var(--r,10px);
  border:1px solid var(--line);background:var(--card2,#14161B);cursor:pointer}
.aiprov .apr:hover{border-color:var(--line2)}
.aiprov .apr.on{border-color:var(--act)}
.aiprov .apr .dot{width:8px;height:8px;border-radius:50%;flex:none}
.aiprov .apr .dot.ok{background:var(--ok)} .aiprov .apr .dot.bad{background:var(--bad)}
.aiprov .apr .dot.warn{background:var(--warn)}
.aiprov .apr .nm{font-size:14px;font-weight:600;flex:none;min-width:96px}
.aiprov .apr .why{flex:1;font-size:12.5px;color:var(--tx2);line-height:1.5}
.aiprov .apr .sel{font-size:11px;color:var(--act);flex:none}
.airow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.airow textarea{width:100%;padding:12px 14px;border-radius:var(--r,10px);border:1px solid var(--line2);
  background:var(--card);color:var(--tx);font-size:12.5px;resize:vertical}
.airow select{height:38px;padding:0 10px;border-radius:var(--r,10px);border:1px solid var(--line2);
  background:var(--card);color:var(--tx)}
@media(max-width:760px){ .aiprov .apr{flex-wrap:wrap} .aiprov .apr .why{flex:1 1 100%} }
