/* 中学（七 ~ 九年级）模块：模拟试题 · 实验演练 · 听力演练
   与 style.css 共用主题变量，不引入新依赖。
   首页三个栏目区块复用「在线工具」的 .tool-grid / .tool-card（tools.css），
   以保证「模拟试题 / 实验演练 / 听力演练」与「在线工具」视觉同级。 */

/* ── 板块小标题 ── */

.ms-sec{display:flex;align-items:center;gap:8px;margin:20px 0 10px}
.ms-sec .ms-ico{font-size:18px}
.ms-sec .ms-nm{font-size:16px;font-weight:700}
.ms-sec .ms-sub{font-size:12.5px;color:var(--ink-3)}

/* ── 通用列表卡（模拟试题 / 听力演练）── */
.ms-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px}
.ms-item{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px;
}
.ms-item .mi-hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ms-item .mi-t{font-weight:700;font-size:15px;line-height:1.35}
.ms-item .mi-m{font-size:12.5px;color:var(--ink-3);display:flex;gap:10px;flex-wrap:wrap}
.ms-item .mi-ft{margin-top:auto;display:flex;align-items:center;gap:8px}
.ms-item .mi-ft .btn{margin-left:auto}
.ms-item .mi-tags{display:flex;gap:6px;flex-wrap:wrap}

/* ── 实验演练：详情页 ── */
.exp-hd{
  background:linear-gradient(120deg,#0f766e,#0d9488 65%,#14b8a6);color:#fff;
  border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow);
}
.exp-hd .eh-t{font-size:19px;font-weight:700}
.exp-hd .eh-m{font-size:12.5px;opacity:.9;margin-top:6px;display:flex;gap:10px;flex-wrap:wrap}
.exp-hd .eh-m .badge{background:rgba(255,255,255,.2);color:#fff}
.exp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:14px}
.exp-kv{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}
.exp-kv h4{margin:0 0 8px;font-size:14px;display:flex;align-items:center;gap:6px}
.exp-kv ul{margin:0;padding-left:20px}
.exp-kv li{margin:3px 0;line-height:1.6}
.exp-kv p{margin:0;line-height:1.75;color:var(--ink-2)}
.exp-safe{border-left:4px solid var(--warn)}
.exp-safe li{color:#92400e}

/* 步骤时间线 */
.exp-steps{margin-top:14px;position:relative}
.exp-step{
  position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 16px 14px 52px;box-shadow:var(--shadow);margin-bottom:12px;
}
.exp-step .es-no{
  position:absolute;left:14px;top:14px;width:26px;height:26px;border-radius:50%;
  background:var(--bg);border:1px solid var(--line);color:var(--ink-2);
  display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;
}
.exp-step.on .es-no{background:var(--brand);border-color:var(--brand);color:#fff}
.exp-step .es-t{font-weight:700;font-size:15px;margin-bottom:6px}
.exp-step .es-row{display:flex;gap:8px;font-size:13.5px;line-height:1.7;margin-top:4px}
.exp-step .es-k{flex:0 0 auto;color:var(--ink-3);font-weight:600;min-width:44px}
.exp-step .es-v{color:var(--ink-2)}
.exp-step.pending{opacity:.72}
/* 未推进到的步骤：只模糊「现象 / 分析」，操作保持可见（先看操作、先想现象） */
.exp-step .es-blur{transition:filter .2s}
.exp-step.pending .es-blur{filter:blur(3px);user-select:none}
.exp-step .es-lock{font-size:12.5px;color:var(--ink-3);margin-top:6px}
.exp-ctl{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:12px 16px;box-shadow:var(--shadow);margin-top:6px;position:sticky;bottom:10px;z-index:5;
}
.exp-ctl .ec-prog{font-size:13px;color:var(--ink-2);font-weight:600}
.exp-ctl .ec-bar{flex:1;min-width:120px;height:8px;background:var(--bg);border-radius:999px;overflow:hidden}
.exp-ctl .ec-bar i{display:block;height:100%;background:linear-gradient(90deg,#0d9488,#14b8a6);transition:.25s}

/* 空态提示（访客受限） */
.ms-gate{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px 18px;box-shadow:var(--shadow);border-left:4px solid var(--brand);
  font-size:13.5px;line-height:1.75;color:var(--ink-2);
}