/* ============================================================
   late. 英语备考模块 · 样式
   与 learn.css 共用 tokens / 导航 / 页脚；这里只放英语模块特有的部分
   形态刻意区别于知识卡片：四项技能 = 四张「工作台」，每张分四层

   ⚠️ 本文件也定义了 :root 里的 tokens，为了让 english.html 单独打开
      也能正常显示（不依赖 learn.css 的加载顺序）
   ============================================================ */
:root{
  --bg:#F7F8FA; --surface:#FFFFFF; --line:#E5E9F0; --line-2:#EDF0F5;
  --ink:#1C2536; --ink-2:#3E4A5F; --muted:#8A93A6; --faint:#A6AEBD;
  --blue:#2563EB; --blue-soft:#EAF1FE;
  --green:#0B8A63; --green-soft:#E5F4EE;
  --amber:#C2730D; --amber-soft:#FBF0DF;
  --purple:#6D28D9; --purple-soft:#F0EAFE;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  --num:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}

/* ---------- 目标卡 ---------- */
.goal{
  margin:26px 0 0;padding:22px 24px;border-radius:16px;
  background:linear-gradient(150deg,#F0F5FE 0%,#F2F8F6 100%);
  border:1px solid #E1E8F5;
}
.goal .g-top{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.goal .g-band{font-family:var(--num);font-size:2.1rem;font-weight:700;color:var(--blue);letter-spacing:-.02em;line-height:1}
.goal .g-title{font-size:1.05rem;font-weight:700;color:var(--ink)}
.goal .g-why{font-size:.94rem;color:var(--ink-2);line-height:1.85;max-width:52em}
.goal .g-why b{color:var(--ink)}

/* ---------- 模块说明行 ---------- */
.mod-note{margin-top:18px;font-size:.88rem;color:var(--muted);line-height:1.85;max-width:54em}
.mod-note a{color:var(--blue);font-weight:600}
.mod-note a:hover{text-decoration:underline}

/* ---------- 技能工作台 ---------- */
.bench{margin-top:34px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}
.bench-head{display:flex;align-items:flex-start;gap:16px;padding:22px 24px 18px;flex-wrap:wrap}
.bench-no{
  flex:0 0 auto;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
  font-family:var(--num);font-size:1rem;font-weight:700;
}
.bench-no.blue{background:var(--blue-soft);color:var(--blue)}
.bench-no.green{background:var(--green-soft);color:var(--green)}
.bench-no.amber{background:var(--amber-soft);color:var(--amber)}
.bench-no.purple{background:var(--purple-soft);color:var(--purple)}
.bench-title{flex:1;min-width:220px}
.bench-title h2{font-size:1.32rem;font-weight:740;color:var(--ink);letter-spacing:-.015em;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.bench-title h2 .en{font-size:.82rem;font-weight:500;color:var(--muted)}
.bench-title p{font-size:.93rem;color:var(--muted);line-height:1.8;margin-top:7px;max-width:52em}
.bench-title p b{color:var(--ink-2)}

/* 四层（可折叠） */
.layer{border-top:1px solid var(--line-2)}
.layer>summary{
  list-style:none;cursor:pointer;padding:14px 24px;display:flex;align-items:center;gap:10px;
  font-size:.93rem;font-weight:600;color:var(--ink-2);transition:background .15s ease;
}
.layer>summary::-webkit-details-marker{display:none}
.layer>summary:hover{background:#FBFCFE}
.layer>summary .arw{
  display:inline-block;color:#C0C8D6;font-size:.8rem;transition:transform .18s ease;
}
.layer[open]>summary .arw{transform:rotate(90deg)}
.layer>summary .cnt{margin-left:auto;font-size:.8rem;font-weight:500;color:var(--faint);font-family:var(--num)}
.layer>summary .tagv{font-size:.72rem;font-weight:600;padding:2px 8px;border-radius:999px;color:#6B7480;background:#EEF0F4}
.layer .body{padding:2px 24px 22px}

/* 评分标准表 */
.crit-note{font-size:.86rem;color:var(--muted);margin-bottom:14px;line-height:1.75}
.crit-note b{color:var(--ink-2)}
.crit-table{width:100%;border-collapse:collapse;font-size:.9rem}
.crit-table th,.crit-table td{border:1px solid var(--line);padding:11px 13px;text-align:left;vertical-align:top;line-height:1.7}
.crit-table thead th{background:#F7F8FA;font-weight:600;color:var(--ink);font-size:.84rem;white-space:nowrap}
.crit-table tbody th{background:#FBFCFE;font-weight:600;color:var(--ink);white-space:nowrap;font-size:.88rem}
.crit-table td{color:var(--ink-2);font-size:.88rem}
.crit-table td b{color:var(--ink);font-weight:650}
.crit-table td.b7{background:#FBFEFC}

/* 方法条目 */
.methods{display:flex;flex-direction:column;gap:0}
.m-item{padding:14px 0;border-bottom:1px dashed var(--line)}
.m-item:last-child{border-bottom:none;padding-bottom:2px}
.m-item .m-t{font-size:.95rem;font-weight:650;color:var(--ink);margin-bottom:5px;line-height:1.6}
.m-item .m-d{font-size:.9rem;color:var(--muted);line-height:1.8}
.m-item .m-d b{color:var(--ink-2)}

/* 空状态 */
.slot{
  border:1px dashed #D7DEE9;border-radius:12px;padding:18px 20px;
  font-size:.89rem;color:var(--muted);line-height:1.8;
}
.slot b{color:var(--ink-2);font-weight:600}

@media (max-width:720px){
  .crit-table{font-size:.84rem}
  .crit-table th,.crit-table td{padding:9px 10px}
  .bench-head,.layer>summary,.layer .body{padding-left:16px;padding-right:16px}
}