/* 大臣词汇速过 — app.css */
:root{
  --bg:#f6f7f9; --card:#ffffff; --text:#1c1f24; --muted:#6b7280; --line:#e6e8ec;
  --accent:#b42318; --accent-soft:#fdeceb;
  --t-list:#b42318; --t-adv:#b45309; --t-mid:#1d4ed8; --t-new:#5b6470;
  --t-list-bg:#fdeceb; --t-adv-bg:#fdf3e3; --t-mid-bg:#e8effc; --t-new-bg:#eef0f3;
  --shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06);
}
html[data-theme="dark"]{
  --bg:#101318; --card:#171b21; --text:#e8eaed; --muted:#9aa2ac; --line:#262c34;
  --accent:#f0857d; --accent-soft:#2a1917;
  --t-list:#f0857d; --t-adv:#e3a23c; --t-mid:#7fa5f0; --t-new:#9aa2ac;
  --t-list-bg:#2a1917; --t-adv-bg:#2b2213; --t-mid-bg:#18233a; --t-new-bg:#22262d;
  --shadow:none;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font:15px/1.75 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  transition:background .2s,color .2s;
}
code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.92em;background:var(--t-new-bg);padding:1px 5px;border-radius:5px}

/* ---------- 顶栏 ---------- */
.topbar{position:sticky;top:0;z-index:20;background:var(--bg);
  background:color-mix(in srgb,var(--bg) 86%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.topbar-in{max-width:880px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:10px 16px}
.brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--text);text-decoration:none;white-space:nowrap}
.brand small{font-weight:400;color:var(--muted);font-size:12px;margin-left:2px}
.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none}
.spacer{flex:1}
.ghost{color:var(--muted);text-decoration:none;font-size:13px;padding:5px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);white-space:nowrap}
.ghost:hover{color:var(--text);border-color:var(--muted)}
.iconbtn{border:1px solid var(--line);background:var(--card);color:var(--text);width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:15px;line-height:1;flex:none}
.iconbtn:hover{border-color:var(--muted)}

/* ---------- 布局 ---------- */
.wrap{max-width:880px;margin:0 auto;padding:18px 16px 60px}
.hero{padding:14px 2px 6px}
.epcode{display:inline-block;font:600 12px/1 ui-monospace,monospace;letter-spacing:.12em;color:var(--accent);
  background:var(--accent-soft);border-radius:6px;padding:5px 8px;margin-bottom:8px}
.hero h1{font-size:24px;margin:0 0 6px;letter-spacing:-.01em}
.hero p{color:var(--muted);margin:0 0 10px;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px}
.chip{font-size:12px;color:var(--muted);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:2px 10px}
.chip b{color:var(--text);font-weight:600;margin-left:1px}
.chip.t-list b{color:var(--t-list)} .chip.t-adv b{color:var(--t-adv)}
.chip.t-mid b{color:var(--t-mid)} .chip.t-new b{color:var(--t-new)}

.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:14px 0 18px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 6px;text-align:center;box-shadow:var(--shadow)}
.stat b{display:block;font-size:19px;line-height:1.3}
.stat span{font-size:11px;color:var(--muted)}
@media (max-width:640px){.stats{grid-template-columns:repeat(3,1fr)}}

/* ---------- 总纲集列表 ---------- */
.parts{display:flex;flex-direction:column;gap:10px}
.part{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:13px 16px;text-decoration:none;color:var(--text);box-shadow:var(--shadow);
  transition:transform .12s,border-color .12s}
.part:hover{border-color:var(--accent);transform:translateY(-1px)}
.part .pname{flex:1;min-width:0}
.part .pname b{font:700 13px/1 ui-monospace,monospace;color:var(--accent);margin-right:8px}
.part .pmeta{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.part .go{color:var(--muted);font-size:18px;flex:none}

/* ---------- 工具条 ---------- */
.modebar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:14px 0 10px;position:sticky;top:53px;z-index:10;
  background:var(--bg);background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:8px 0}
.tab{border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:999px;
  font-size:13px;padding:5px 12px;cursor:pointer;white-space:nowrap}
.tab b{font-weight:600;margin-left:2px;font-size:12px}
.tab:hover{color:var(--text)}
.tab.on{background:var(--text);border-color:var(--text);color:var(--bg)}
.tab.on b{color:var(--bg);opacity:.75}
.tab.t-list.on{background:var(--t-list);border-color:var(--t-list);color:#fff}
.tab.t-adv.on{background:var(--t-adv);border-color:var(--t-adv);color:#fff}
.tab.t-mid.on{background:var(--t-mid);border-color:var(--t-mid);color:#fff}
.tab.t-new.on{background:var(--t-new);border-color:var(--t-new);color:#fff}
.accseg{margin-left:auto;display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:var(--card);flex:none}
.accseg button{border:0;background:transparent;color:var(--muted);font-size:12px;padding:5px 11px;cursor:pointer}
.accseg button.on{background:var(--text);color:var(--bg)}

.searchbox{margin:2px 0 14px}
.searchbox input{width:100%;border:1px solid var(--line);background:var(--card);color:var(--text);
  border-radius:12px;padding:10px 14px;font-size:14px;outline:none}
.searchbox input:focus{border-color:var(--accent)}
.searchbox input::placeholder{color:var(--muted)}

/* ---------- 分区标题 ---------- */
.sec-title{display:flex;align-items:baseline;gap:8px;margin:22px 0 10px;font-size:13px;font-weight:700;color:var(--muted);letter-spacing:.04em}
.sec-title .n{font-size:12px;font-weight:500;color:var(--muted)}
.sec-title.g-list{color:var(--t-list)} .sec-title.g-adv{color:var(--t-adv)}
.sec-title.g-mid{color:var(--t-mid)} .sec-title.g-new{color:var(--t-new)}

/* ---------- 单词卡 ---------- */
.cards{display:flex;flex-direction:column;gap:10px}
.wcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:13px 16px 11px;box-shadow:var(--shadow)}
.wcard.playing{border-color:var(--accent)}
.wrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wd{font-size:19px;font-weight:700;letter-spacing:-.01em;cursor:pointer;border-radius:6px;padding:1px 4px;margin-left:-4px}
.wd:hover{color:var(--accent);background:var(--accent-soft)}
.tier{font-size:11px;font-weight:600;border-radius:6px;padding:2px 7px;flex:none}
.tier.t-list{color:var(--t-list);background:var(--t-list-bg)}
.tier.t-adv{color:var(--t-adv);background:var(--t-adv-bg)}
.tier.t-mid{color:var(--t-mid);background:var(--t-mid-bg)}
.tier.t-new{color:var(--t-new);background:var(--t-new-bg)}
.eps{display:flex;gap:4px;flex-wrap:wrap}
.epb{font:600 10px/1 ui-monospace,monospace;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:3px 5px;flex:none}
.abtns{margin-left:auto;display:flex;gap:4px;flex:none}
.ab{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:7px;
  font-size:11px;padding:3px 8px;cursor:pointer;line-height:1.4}
.ab:hover{color:var(--accent);border-color:var(--accent)}
.means{margin:7px 0 0;display:flex;flex-direction:column;gap:2px}
.seg{font-size:14px}
.seg i{font-style:normal;color:var(--muted);font:600 11px/1.6 ui-monospace,monospace;margin-right:7px;
  background:var(--t-new-bg);border-radius:4px;padding:2px 5px}
.eg{margin-top:7px;font-size:13.5px;color:var(--muted);border-left:3px solid var(--line);padding-left:10px}
.eg b{color:var(--accent);font-weight:600}
.src{margin-top:7px;font-size:11.5px;color:var(--muted);opacity:.85}

/* ---------- 短语卡 ---------- */
.pcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 16px 10px;box-shadow:var(--shadow)}
.pcard.playing{border-color:var(--accent)}
.prow{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pd{font-size:16.5px;font-weight:700;cursor:pointer;border-radius:6px;padding:1px 4px;margin-left:-4px}
.pd:hover{color:var(--accent);background:var(--accent-soft)}
.pmean{font-size:14px;margin-top:5px}
.ptier{font-size:11px;font-weight:600;border-radius:6px;padding:2px 7px;color:var(--t-mid);background:var(--t-mid-bg)}

/* ---------- 专有名词 ---------- */
.ncards{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media (max-width:640px){.ncards{grid-template-columns:1fr}}
.ncard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 13px;box-shadow:var(--shadow)}
.nrow{display:flex;align-items:center;gap:8px}
.nd{font-weight:700;font-size:14.5px;cursor:pointer;border-radius:6px;padding:1px 4px;margin-left:-4px}
.nd:hover{color:var(--accent);background:var(--accent-soft)}
.nmean{font-size:13px;color:var(--muted);margin-top:3px}

.empty{ text-align:center;color:var(--muted);padding:40px 0;font-size:14px}
.foot{margin-top:34px;padding-top:14px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);text-align:center}