/* ============================================================
   css/panels/panels-exam.css — 「外文 · 试卷 / 题库 / 考试档案」（第 8 窗口）
   ------------------------------------------------------------
   前缀 ex-（试卷那一块）与 pt-（考试档案那一页），**只属于这两块**，
   别占用 ec- / rd- / gr- / pd- / vd- 那几个（谁占谁的类名就等于谁改谁的样子）。
   规矩：零 emoji、细线弱阴影、衬线中文、360~430 都不破版、<370 不横向溢出；
   输入框 / 选择器 / 小窗都自己画（禁系统默认框）；触碰有动画反馈；
   prefers-reduced-motion 要有替代。

   全屏做题层（.ex-run）：挂 #app 内的层容器里，**不是** body 上那种铺满整屏的写法
   —— 那样在电脑上会撑满整屏（设计规范的 iOS 全屏层铁律）。左右沿用
   left:50% + max-width:480px + translateX(-50%)，底部留白算上 --safe-bottom，
   顶栏自己让出顶部安全区。
   ============================================================ */

/* ===== 层容器（做题层 + 自己画的小窗都住这里）===== */
.ex-layers {
    position: absolute;
    inset: 0;
    z-index: 40;
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s var(--ec-ease, ease);
}
.ex-layers.show { opacity: 1; }
.ex-layers > * { pointer-events: auto; }
.ex-layer { position: absolute; inset: 0; }
.ex-layer-run { z-index: 2; }
.ex-layer-drawer { z-index: 5; }

/* ===== 顶部小按钮（返回头右侧）===== */
.ex-head-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 11px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .12));
    border-radius: 999px;
    background: transparent;
    color: var(--ec-ink, #3a3330);
    font-family: var(--font-body, inherit);
    font-size: 12.5px;
    line-height: 1;
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease), color .2s var(--ec-ease, ease);
}
.ex-head-btn:hover { border-color: rgba(182, 112, 124, .4); color: var(--ec-rose-ink, #b6707c); }
.ex-head-btn:active { transform: scale(.96); }
.ex-ico { display: block; flex-shrink: 0; }

/* ===== 主页：接着做 / 最近一次 ===== */
.ex-resume,
.ex-last {
    display: block;
    width: 100%;
    text-align: left;
    margin: 4px 0 14px;
    padding: 15px 16px 14px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .1));
    border-radius: var(--ec-radius, 14px);
    background: var(--surface-solid, #fff);
    box-shadow: var(--shadow-xs, 0 1px 3px rgba(0, 0, 0, .04));
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: transform .2s var(--ec-ease, ease), box-shadow .2s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease);
}
.ex-resume { border-color: rgba(182, 112, 124, .3); }
.ex-resume:hover,
.ex-last:hover { box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, .05)); }
.ex-resume:active,
.ex-last:active { transform: scale(.985); }
.ex-resume-top,
.ex-last-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ex-resume-label { font-size: 12px; color: var(--ec-rose-ink, #b6707c); letter-spacing: .04em; }
.ex-resume-idx { font-size: 11.5px; color: var(--ec-sub, #8a8278); font-variant-numeric: tabular-nums; }
.ex-resume-title { font-size: 15px; font-family: var(--font-display, Georgia, serif); padding: 4px 0 8px; }
.ex-resume-sub { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding-top: 7px; }
.ex-last-label { font-size: 12px; color: var(--ec-gold-ink, #a9895f); letter-spacing: .04em; }
.ex-last-when { font-size: 11.5px; color: var(--ec-sub, #8a8278); }
.ex-last-mid { display: flex; align-items: baseline; gap: 10px; padding: 4px 0 6px; flex-wrap: wrap; }
.ex-last-pct { font-family: var(--font-display, Georgia, serif); font-size: 27px; color: var(--ec-rose-ink, #b6707c); font-variant-numeric: tabular-nums; }
.ex-last-name { font-size: 13.5px; color: var(--ec-ink, #3a3330); }
.ex-last-sub { font-size: 11.5px; color: var(--ec-sub, #8a8278); }

/* ===== 今天 / 一共（四项真数据）===== */
/*  第 11 窗口：这一条与下面那条 `.wr-facts` 同一类问题 —— 它们是**直接挂在 #vocab-content 上的**
   （不在 .ec-block / .ex-block 里面），自己没有水平内边距 → 四格数字从屏幕最左贴到最右。 */
.ex-metrics {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    padding: 2px 0 16px;
    margin-left: var(--ec-gutter); margin-right: var(--ec-gutter);
}
.ex-metric { text-align: center; padding: 8px 2px; }
.ex-metric-val {
    font-family: var(--font-display, Georgia, serif);
    font-size: 19px;
    color: var(--ec-ink, #3a3330);
    font-variant-numeric: tabular-nums;
    line-height: 1.15;
}
.ex-metric-val i { font-size: 10.5px; font-style: normal; color: var(--ec-sub, #8a8278); padding-left: 2px; }
.ex-metric-label { font-size: 10.5px; color: var(--ec-sub, #8a8278); padding-top: 3px; }
.ex-metric.is-dim .ex-metric-val { color: var(--text-muted, #bfb8ae); }
.ex-metric.is-alert .ex-metric-val { color: var(--ec-rose-ink, #b6707c); }

/* ===== 分区小标题与卡片 ===== */
.ex-sec { padding-top: 6px; }
.ex-sec-t {
    font-size: 12px;
    color: var(--ec-sub, #8a8278);
    letter-spacing: .06em;
    padding: 0 2px 8px;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    margin-bottom: 10px;
}
.ex-paper,
.ex-bank {
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 10px;
    padding: 13px 15px 12px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .1));
    border-radius: var(--ec-radius, 14px);
    background: var(--surface-solid, #fff);
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: transform .2s var(--ec-ease, ease), box-shadow .2s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease);
}
.ex-paper:hover,
.ex-bank:hover { border-color: rgba(182, 112, 124, .3); box-shadow: var(--shadow-xs, 0 1px 3px rgba(0, 0, 0, .04)); }
.ex-paper:active,
.ex-bank:active { transform: scale(.985); }
.ex-paper-top,
.ex-bank-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ex-paper-name,
.ex-bank-name { font-size: 14.5px; min-width: 0; word-break: break-word; }
.ex-paper-score { font-size: 13px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; white-space: nowrap; }
.ex-paper-score.is-low { color: var(--ec-rose-ink, #b6707c); }
.ex-paper-new { font-size: 11px; color: var(--ec-sub, #8a8278); border: 1px solid var(--ec-line, rgba(60, 48, 40, .1)); border-radius: 999px; padding: 1px 7px; white-space: nowrap; }
.ex-paper-meta,
.ex-bank-meta { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding-top: 5px; line-height: 1.6; }
.ex-paper-sub { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 4px; opacity: .9; }
.ex-paper-warn { font-size: 11px; color: var(--ec-rose-ink, #b6707c); padding-top: 5px; }
.ex-bank-n { font-family: var(--font-display, Georgia, serif); font-size: 16px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.ex-bank-note { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 4px; }

/* ===== 一排安静的入口 ===== */
.ex-links { padding-top: 12px; border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); margin-top: 8px; }
.ex-link {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 2px;
    border: none;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .06));
    background: none;
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), padding-left .2s var(--ec-ease, ease);
}
.ex-link:hover { background: var(--rose-light, rgba(201, 168, 168, .1)); padding-left: 6px; }
.ex-link:active { transform: scale(.99); }
.ex-link-ic { color: var(--ec-gold-ink, #a9895f); display: flex; }
.ex-link-label { font-size: 13.5px; }
.ex-link-right { margin-left: auto; font-size: 11.5px; color: var(--ec-sub, #8a8278); }
.ex-link-arrow { color: var(--text-muted, #bfb8ae); display: flex; }
.ex-link-inline {
    border: none;
    background: none;
    padding: 0 0 0 6px;
    margin: 0;
    font-family: var(--font-body, inherit);
    font-size: 11.5px;
    color: var(--ec-rose-ink, #b6707c);
    text-decoration: underline;
    cursor: pointer;
}

/* ===== 题库里的题 / 错题本 / 成绩单里的一题 ===== */
.ex-qlist,
.ex-wrong-list { padding: 2px 0; }
.ex-q,
.ex-wrong {
    padding: 12px 2px 13px;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
}
.ex-q-top,
.ex-wrong-top { display: flex; align-items: center; gap: 8px; }
.ex-q-idx,
.ex-wrong-paper { font-size: 11.5px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.ex-wrong-paper { min-width: 0; word-break: break-word; }
.ex-q-tags,
.ex-wrong-tags { font-size: 11px; color: var(--ec-sub, #8a8278); }
.ex-q-del {
    margin-left: auto;
    width: 28px; height: 28px;
    border: none; background: none;
    color: var(--text-muted, #bfb8ae);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: color .2s var(--ec-ease, ease), background .2s var(--ec-ease, ease);
}
.ex-q-del:hover { color: var(--ec-rose-ink, #b6707c); background: var(--rose-light, rgba(201, 168, 168, .12)); }
.ex-wrong-when { margin-left: auto; font-size: 11px; color: var(--ec-sub, #8a8278); }
.ex-q-stem,
.ex-wrong-stem { font-size: 13.5px; line-height: 1.75; color: var(--ec-ink, #3a3330); padding-top: 6px; word-break: break-word; }
.ex-q-opts { display: flex; flex-wrap: wrap; gap: 4px 14px; padding-top: 6px; }
.ex-q-opt { font-size: 12px; color: var(--ec-sub, #8a8278); }
.ex-q-ans { font-size: 12px; color: var(--ec-gold-ink, #a9895f); padding-top: 7px; word-break: break-word; }
.ex-wrong-word { font-size: 11.5px; color: var(--ec-rose-ink, #b6707c); padding-top: 6px; }
.ex-end,
.ex-more { text-align: center; font-size: 11.5px; color: var(--ec-sub, #8a8278); padding: 16px 0 8px; }
.ex-foot { padding-top: 14px; margin-top: 6px; border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); }
.ex-bankbar { padding: 2px 2px 12px; }
.ex-bankbar-meta { font-size: 12px; color: var(--ec-sub, #8a8278); }
.ex-bankbar-note { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding-top: 4px; }

/* ===== 表单：自己画的输入框与选择片（禁系统默认框）===== */
.ex-field { padding: 12px 2px 6px; }
.ex-field-label { font-size: 12.5px; color: var(--ec-ink, #3a3330); padding-bottom: 8px; }
.ex-input {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 13px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .14));
    border-radius: var(--ec-radius-s, 10px);
    background: var(--surface-solid, #fff);
    font-family: var(--font-body, inherit);
    font-size: 14px;
    color: var(--ec-ink, #3a3330);
    outline: none;
    transition: border-color .2s var(--ec-ease, ease), box-shadow .2s var(--ec-ease, ease);
    -webkit-appearance: none;
    appearance: none;
}
.ex-input::placeholder { color: var(--text-muted, #bfb8ae); }
.ex-input:focus { border-color: rgba(182, 112, 124, .5); box-shadow: 0 0 0 3px var(--rose-light, rgba(201, 168, 168, .16)); }
.ex-textarea { resize: vertical; line-height: 1.75; font-size: 14px; }
.ex-input-num { text-align: center; font-family: var(--font-display, Georgia, serif); font-size: 22px; letter-spacing: .04em; }
.ex-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.ex-chip {
    padding: 7px 13px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .14));
    border-radius: 999px;
    background: transparent;
    font-family: var(--font-body, inherit);
    font-size: 12.5px;
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease), color .2s var(--ec-ease, ease), transform .15s var(--ec-ease, ease);
}
.ex-chip:hover { border-color: rgba(182, 112, 124, .4); }
.ex-chip:active { transform: scale(.95); }
.ex-chip.is-on {
    background: var(--rose-light, rgba(201, 168, 168, .16));
    border-color: rgba(182, 112, 124, .45);
    color: var(--ec-rose-ink, #b6707c);
}
.ex-hint,
.ex-note {
    font-size: 11.5px;
    line-height: 1.8;
    color: var(--ec-sub, #8a8278);
    padding: 8px 2px 0;
}
.ex-warn {
    font-size: 11.5px;
    line-height: 1.8;
    color: var(--ec-rose-ink, #b6707c);
    padding: 8px 2px 2px;
}
.ex-actions { display: flex; flex-wrap: wrap; gap: 9px; padding: 16px 2px 4px; }
.ec-danger { color: var(--ec-rose-ink, #b6707c); border-color: rgba(182, 112, 124, .35); }
.ec-danger:hover { background: var(--rose-light, rgba(201, 168, 168, .12)); }

/* ===== 导入 ===== */
.ex-tabs { display: flex; gap: 4px; padding: 2px 0 12px; border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); margin-bottom: 10px; }
.ex-tab {
    flex: 1 1 0;
    padding: 9px 4px;
    border: none;
    border-radius: var(--ec-radius-s, 10px);
    background: transparent;
    font-family: var(--font-body, inherit);
    font-size: 13px;
    color: var(--ec-sub, #8a8278);
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), color .2s var(--ec-ease, ease);
}
.ex-tab.is-on { background: var(--rose-light, rgba(201, 168, 168, .14)); color: var(--ec-ink, #3a3330); }
.ex-drop {
    text-align: center;
    padding: 26px 16px 22px;
    border: 1px dashed var(--ec-line, rgba(60, 48, 40, .18));
    border-radius: var(--ec-radius, 14px);
    color: var(--ec-sub, #8a8278);
    margin-bottom: 8px;
}
.ex-drop .ex-ico { margin: 0 auto 10px; color: var(--ec-gold-ink, #a9895f); }
.ex-drop-t { font-size: 14px; color: var(--ec-ink, #3a3330); padding-bottom: 5px; }
.ex-drop-s { font-size: 11.5px; padding-bottom: 14px; }
.ex-file-btn { display: inline-flex; align-items: center; cursor: pointer; }
.ex-file-btn input { display: none; }

/* 预览：认出几道 → 逐个摆出来 → 没认出来的照抄原文 */
.ex-preview-lead { display: flex; align-items: baseline; gap: 10px; padding: 4px 2px 6px; }
.ex-preview-n { font-family: var(--font-display, Georgia, serif); font-size: 26px; color: var(--ec-rose-ink, #b6707c); }
.ex-preview-sub { font-size: 11.5px; color: var(--ec-sub, #8a8278); }
.ex-preview-meta { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding: 0 2px 10px; }
.ex-pv-list { padding-top: 6px; }
.ex-pv { padding: 11px 2px 12px; border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); }
.ex-pv-top { display: flex; align-items: baseline; gap: 8px; }
.ex-pv-idx { font-size: 12px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.ex-pv-tags { font-size: 11px; color: var(--ec-sub, #8a8278); }
.ex-pv-stem { font-size: 13px; line-height: 1.75; padding-top: 5px; word-break: break-word; }
.ex-pv-opts { display: flex; flex-wrap: wrap; gap: 3px 14px; padding-top: 5px; }
.ex-pv-opt { font-size: 12px; color: var(--ec-sub, #8a8278); }
.ex-pv-ans { font-size: 12px; color: var(--ec-gold-ink, #a9895f); padding-top: 6px; }
.ex-pv-ans.is-missing { color: var(--ec-rose-ink, #b6707c); }
.ex-pv-ex { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding-top: 4px; }
.ex-unparsed { margin-top: 14px; padding: 12px 13px; border-radius: var(--ec-radius-s, 10px); background: rgba(196, 168, 106, .07); }
.ex-unparsed-t { font-size: 12px; color: var(--ec-gold-ink, #a9895f); padding-bottom: 7px; }
.ex-unparsed-row { padding: 5px 0; }
.ex-unparsed-s { font-size: 11.5px; color: var(--ec-ink, #3a3330); line-height: 1.7; word-break: break-word; }
.ex-unparsed-r { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 2px; }

/* ===== 做题（全屏层）===== */
.ex-run {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 480px;
    display: flex;
    flex-direction: column;
    background: var(--bg-primary, #f8f4ef);
    box-shadow: 0 0 0 1px var(--ec-line-soft, rgba(60, 48, 40, .06));
}
.ex-run-head {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: calc(10px + var(--safe-top, 0px)) 14px 10px;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    background: var(--bg-primary, #f8f4ef);
}
.ex-run-back {
    width: 34px; height: 34px;
    flex-shrink: 0;
    border: none; background: none;
    color: var(--ec-ink, #3a3330);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), transform .15s var(--ec-ease, ease);
}
.ex-run-back:hover { background: var(--rose-light, rgba(201, 168, 168, .14)); }
.ex-run-back:active { transform: scale(.92); }
.ex-run-mid { min-width: 0; flex: 1 1 auto; }
.ex-run-title {
    font-size: 14px;
    color: var(--ec-ink, #3a3330);
    font-family: var(--font-display, Georgia, serif);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ex-run-step { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 2px; font-variant-numeric: tabular-nums; }
.ex-run-timer {
    flex-shrink: 0;
    font-family: var(--font-display, Georgia, serif);
    font-size: 17px;
    color: var(--ec-rose-ink, #b6707c);
    font-variant-numeric: tabular-nums;
}
.ex-run-timer.is-plain { font-size: 11.5px; font-family: var(--font-body, inherit); color: var(--ec-sub, #8a8278); }
.ex-run-body {
    flex: 1 1 auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 16px 16px 20px;
    padding-bottom: calc(20px + var(--safe-bottom, 0px));
}
.ex-run-loading { padding-top: 40px; }
.ex-run-tags { padding-bottom: 10px; }
.ex-run-stem {
    font-size: 15px;
    line-height: 1.85;
    color: var(--ec-ink, #3a3330);
    word-break: break-word;
    white-space: pre-wrap;
}
.ex-opts { display: flex; flex-direction: column; gap: 9px; padding-top: 16px; }
.ex-opt {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    width: 100%;
    text-align: left;
    padding: 12px 13px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .13));
    border-radius: var(--ec-radius-s, 10px);
    background: var(--surface-solid, #fff);
    font-family: var(--font-body, inherit);
    font-size: 13.5px;
    line-height: 1.7;
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: border-color .2s var(--ec-ease, ease), background .2s var(--ec-ease, ease), transform .15s var(--ec-ease, ease);
}
.ex-opt:hover { border-color: rgba(182, 112, 124, .35); }
.ex-opt:active { transform: scale(.99); }
.ex-opt.is-on { background: var(--rose-light, rgba(201, 168, 168, .16)); border-color: rgba(182, 112, 124, .5); }
.ex-opt-l {
    flex-shrink: 0;
    width: 22px; height: 22px;
    border-radius: 50%;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .16));
    display: flex; align-items: center; justify-content: center;
    font-size: 11.5px;
    color: var(--ec-sub, #8a8278);
    font-family: var(--font-display, Georgia, serif);
    transition: background .2s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease), color .2s var(--ec-ease, ease);
}
.ex-opt.is-on .ex-opt-l { background: var(--rose, #c9a8a8); border-color: var(--rose, #c9a8a8); color: #fff; }
.ex-opt-t { min-width: 0; word-break: break-word; }
.ex-opts-judge { flex-direction: row; }
.ex-opts-judge .ex-opt { flex: 1 1 0; }
.ex-run-input { padding-top: 14px; }
.ex-run-foot {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 14px calc(10px + var(--safe-bottom, 0px));
    border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    background: var(--bg-primary, #f8f4ef);
}
.ex-run-nav {
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 10px 6px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .13));
    border-radius: var(--ec-radius-s, 10px);
    background: transparent;
    font-family: var(--font-body, inherit);
    font-size: 13px;
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: border-color .2s var(--ec-ease, ease), color .2s var(--ec-ease, ease), transform .15s var(--ec-ease, ease);
}
.ex-run-nav:hover:not(:disabled) { border-color: rgba(182, 112, 124, .4); }
.ex-run-nav:active:not(:disabled) { transform: scale(.97); }
.ex-run-nav:disabled { opacity: .38; cursor: default; }
.ex-run-submit {
    flex: 1.2 1 0;
    padding: 11px 8px;
    border: none;
    border-radius: var(--ec-radius-s, 10px);
    background: var(--rose, #c9a8a8);
    color: #fff;
    font-family: var(--font-body, inherit);
    font-size: 13.5px;
    letter-spacing: .04em;
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), transform .15s var(--ec-ease, ease);
}
.ex-run-submit:hover { background: var(--rose-hover, #ba9696); }
.ex-run-submit:active { transform: scale(.97); }

/* ===== 成绩单 ===== */
.ex-result { padding-bottom: 0; }
.ex-score { text-align: center; padding: 26px 16px 18px; }
.ex-score-pct {
    font-family: var(--font-display, Georgia, serif);
    font-size: 46px;
    line-height: 1.05;
    color: var(--ec-rose-ink, #b6707c);
    font-variant-numeric: tabular-nums;
}
.ex-score-label { font-size: 13px; color: var(--ec-ink, #3a3330); padding-top: 6px; }
.ex-score-sub { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding-top: 5px; }
.ex-score-pending { font-size: 11.5px; color: var(--ec-gold-ink, #a9895f); padding-top: 8px; }
.ex-breakdown { padding: 4px 16px 12px; }
.ex-bd-t { font-size: 12px; color: var(--ec-sub, #8a8278); letter-spacing: .06em; padding-bottom: 10px; }
.ex-bd-row { display: flex; align-items: center; gap: 9px; padding: 5px 0; }
.ex-bd-label { flex: 0 0 46px; font-size: 12.5px; color: var(--ec-ink, #3a3330); }
.ex-bd-bar { flex: 1 1 auto; min-width: 0; }
.ex-bd-val { flex: 0 0 46px; text-align: right; font-size: 11.5px; color: var(--ec-sub, #8a8278); font-variant-numeric: tabular-nums; }
.ex-details { padding: 6px 16px 8px; }
.ex-det { padding: 12px 0 13px; border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); }
.ex-det-top { display: flex; align-items: baseline; gap: 8px; }
.ex-det-idx { font-size: 11.5px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.ex-det-mark { font-size: 11.5px; }
.ex-det.is-ok .ex-det-mark { color: var(--sage, #a8b8a0); }
.ex-det.is-bad .ex-det-mark { color: var(--ec-rose-ink, #b6707c); }
.ex-det.is-soft .ex-det-mark { color: var(--ec-gold-ink, #a9895f); }
.ex-det-meta { margin-left: auto; font-size: 11px; color: var(--ec-sub, #8a8278); }
.ex-det-stem { font-size: 13px; line-height: 1.75; color: var(--ec-ink, #3a3330); padding-top: 6px; word-break: break-word; }
.ex-det-given { font-size: 12px; line-height: 1.75; color: var(--ec-ink, #3a3330); padding-top: 6px; word-break: break-word; }
.ex-det-given span { font-size: 11px; color: var(--ec-sub, #8a8278); padding-right: 7px; }
.ex-det-given.is-blank { color: var(--ec-sub, #8a8278); }
.ex-det-given.is-key { color: var(--ec-gold-ink, #a9895f); }
.ex-det-fb {
    font-size: 12px;
    line-height: 1.8;
    color: var(--ec-ink, #3a3330);
    padding: 8px 10px;
    margin-top: 7px;
    border-left: 2px solid var(--rose, #c9a8a8);
    background: var(--rose-light, rgba(201, 168, 168, .08));
    border-radius: 0 var(--ec-radius-s, 10px) var(--ec-radius-s, 10px) 0;
    word-break: break-word;
}
.ex-det-ex { font-size: 11.5px; line-height: 1.8; color: var(--ec-sub, #8a8278); padding-top: 6px; word-break: break-word; }
.ex-det-btn {
    margin-top: 8px;
    padding: 6px 12px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .13));
    border-radius: 999px;
    background: transparent;
    font-family: var(--font-body, inherit);
    font-size: 11.5px;
    color: var(--ec-gold-ink, #a9895f);
    cursor: pointer;
    transition: border-color .2s var(--ec-ease, ease), background .2s var(--ec-ease, ease);
}
.ex-det-btn:hover { border-color: rgba(169, 137, 95, .45); background: rgba(196, 168, 106, .08); }
.ex-result-foot {
    display: flex;
    gap: 9px;
    justify-content: center;
    padding: 14px 16px calc(14px + var(--safe-bottom, 0px));
    border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
}
.ex-result-foot .ec-btn { flex: 1 1 0; }

/* ===== 历史成绩走势 ===== */
.ex-trend {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 6px;
    height: 92px;
    padding: 8px 2px 0;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .08));
    margin-bottom: 12px;
}
.ex-trend-col { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; }
.ex-trend-bar {
    width: 100%;
    max-width: 22px;
    border-radius: 6px 6px 2px 2px;
    background: linear-gradient(180deg, rgba(201, 168, 168, .85), rgba(201, 168, 168, .45));
}
.ex-trend-x { font-size: 9.5px; color: var(--ec-sub, #8a8278); font-variant-numeric: tabular-nums; }
.ex-history { padding-top: 2px; }
.ex-hist {
    display: block;
    width: 100%;
    text-align: left;
    padding: 12px 2px 13px;
    border: none;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    background: none;
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), padding-left .2s var(--ec-ease, ease);
}
.ex-hist:hover { background: var(--rose-light, rgba(201, 168, 168, .08)); padding-left: 6px; }
.ex-hist-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ex-hist-name { font-size: 13.5px; min-width: 0; word-break: break-word; }
.ex-hist-pct { font-family: var(--font-display, Georgia, serif); font-size: 17px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.ex-hist-pct.is-low { color: var(--ec-rose-ink, #b6707c); }
.ex-hist-meta { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 4px; }
.ex-hist-weak { font-size: 11px; color: var(--ec-rose-ink, #b6707c); padding-top: 3px; }

/* ===== 这一块存了什么 / 怎么用 ===== */
.ex-data-lead { font-size: 12px; line-height: 1.85; color: var(--ec-sub, #8a8278); padding: 6px 2px 14px; }
.ex-data-lead b { color: var(--ec-ink, #3a3330); font-weight: 600; }
.ex-data-rows { padding: 2px 0 8px; }
.ex-data-row { padding: 7px 2px 9px; border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .06)); }
.ex-data-main { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ex-data-label { font-size: 13px; color: var(--ec-ink, #3a3330); }
.ex-data-count { font-size: 12.5px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.ex-data-meta { display: flex; gap: 12px; font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 3px; }
.ex-data-sum { font-size: 12px; color: var(--ec-ink, #3a3330); padding: 10px 2px 4px; }
.ex-clear { padding-top: 16px; margin-top: 10px; border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); }
.ex-clear-t { font-size: 13px; color: var(--ec-rose-ink, #b6707c); padding-bottom: 9px; }
.ex-clear-btn { display: block; width: 100%; text-align: left; margin-bottom: 8px; }
.ex-help { padding: 4px 2px 8px; }
.ex-help-row { padding: 11px 0 12px; border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); }
.ex-help-q { font-size: 13px; color: var(--ec-ink, #3a3330); padding-bottom: 5px; }
.ex-help-a { font-size: 12px; line-height: 1.85; color: var(--ec-sub, #8a8278); }

/* ===== 自己画的小窗（抽屉 / 确认 / 输入）===== */
.ex-sheet-mask,
.ex-ask-mask { position: absolute; inset: 0; background: rgba(40, 32, 30, .3); }
.ex-sheet {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 100%;
    max-width: 480px;
    box-sizing: border-box;
    background: var(--surface-solid, #fff);
    border-radius: 18px 18px 0 0;
    padding: 16px 16px calc(14px + var(--safe-bottom, 0px));
    box-shadow: 0 -10px 30px rgba(60, 40, 40, .14);
    max-height: 78%;
    overflow-y: auto;
}
.ex-sheet-t { font-size: 13px; color: var(--ec-sub, #8a8278); letter-spacing: .04em; padding: 2px 2px 10px; }
.ex-sheet-row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 13px 4px;
    border: none;
    border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    background: none;
    text-align: left;
    font-family: var(--font-body, inherit);
    font-size: 14px;
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: color .2s var(--ec-ease, ease), padding-left .2s var(--ec-ease, ease);
}
.ex-sheet-row:hover { color: var(--ec-rose-ink, #b6707c); padding-left: 8px; }
.ex-sheet-row.is-danger { color: var(--ec-rose-ink, #b6707c); }
.ex-sheet-row.is-quiet { color: var(--ec-sub, #8a8278); }
.ex-sheet-row.is-on { color: var(--ec-rose-ink, #b6707c); }
.ex-sheet-ok { display: block; width: 100%; margin-top: 14px; }
.ex-sheet-tall { max-height: 86%; }
.ex-ask-mask { z-index: 1; }
.ex-sheet-mask { z-index: 1; }
.ex-ask-box {
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(86%, 320px);
    box-sizing: border-box;
    background: #fff;
    border-radius: 16px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .08));
    box-shadow: 0 12px 32px rgba(60, 40, 40, .16);
    padding: 20px 18px 16px;
}
.ex-ask-title { font-size: 15px; color: var(--ec-ink, #3a3330); padding-bottom: 9px; }
.ex-ask-sub { font-size: 12px; line-height: 1.8; color: var(--ec-sub, #8a8278); padding-bottom: 15px; word-break: break-word; }
.ex-ask-hint { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 7px; }
.ex-ask-actions { display: flex; gap: 9px; justify-content: flex-end; padding-top: 14px; }
.ex-detail-stem { font-size: 13.5px; line-height: 1.8; color: var(--ec-ink, #3a3330); padding-bottom: 8px; white-space: pre-wrap; }
.ex-detail-row { font-size: 12.5px; line-height: 1.8; color: var(--ec-ink, #3a3330); padding: 7px 0; border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); word-break: break-word; }
.ex-detail-row span { display: block; font-size: 11px; color: var(--ec-sub, #8a8278); padding-bottom: 3px; }
.ex-detail-row.is-key { color: var(--ec-gold-ink, #a9895f); }

/* ===== 考试档案那一页（pt-）=====
   第 11 窗口修（甲方实报「PTE 这一页所有内容都贴着边」）：
     这一页每一块都是**直接挂在 #vocab-content 上的**，而它自己没有水平外边距 ——
     于是卡片、分栏、按钮全从屏幕最左边贴到最右边（外文别的分区外面都套了 .ec-page / .ec-sec 那 24px）。
   2028w12learn1 统一：三档留白不再各写一遍，改成认全模块那一个 --ec-gutter。 */
.pt-target, .pt-sec-t, .pt-items, .pt-mock, .pt-quiet, .pt-note {
    margin-left: var(--ec-gutter);
    margin-right: var(--ec-gutter);
}
.pt-target {
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .1));
    border-radius: var(--ec-radius, 14px);
    background: var(--surface-solid, #fff);
    padding: 16px 16px 14px;
    margin-top: 4px;
    margin-bottom: 16px;
    box-shadow: var(--shadow-xs, 0 1px 3px rgba(0, 0, 0, .04));
}
.pt-target-row { display: flex; gap: 10px; }
.pt-target-cell {
    flex: 1 1 0;
    text-align: center;
    border: none;
    background: none;
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    padding: 4px 2px;
    border-radius: var(--ec-radius-s, 10px);
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), transform .15s var(--ec-ease, ease);
}
.pt-target-cell:hover { background: var(--rose-light, rgba(201, 168, 168, .1)); }
.pt-target-cell:active { transform: scale(.97); }
.pt-target-cell.is-plain { cursor: default; }
.pt-target-cell.is-plain:hover { background: none; }
.pt-target-k { font-size: 11.5px; color: var(--ec-sub, #8a8278); padding-bottom: 5px; }
.pt-target-v {
    font-family: var(--font-display, Georgia, serif);
    font-size: 30px;
    line-height: 1.1;
    color: var(--ec-rose-ink, #b6707c);
    font-variant-numeric: tabular-nums;
}
.pt-target-none { font-family: var(--font-body, inherit); font-size: 13px; color: var(--text-muted, #bfb8ae); }
.pt-target-bar { padding: 12px 2px 6px; }
.pt-target-sub { font-size: 11.5px; color: var(--ec-sub, #8a8278); line-height: 1.7; }
.pt-target-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 13px; }
.pt-target-actions .ec-btn { flex: 1 1 auto; font-size: 12.5px; padding: 8px 12px; }
.pt-sec-t {
    font-size: 12px;
    color: var(--ec-sub, #8a8278);
    letter-spacing: .06em;
    padding: 0 2px 9px;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    margin-bottom: 4px;
}
.pt-items { padding: 2px 0 8px; }
.pt-item {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    text-align: left;
    padding: 13px 2px;
    border: none;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .06));
    background: none;
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: background .2s var(--ec-ease, ease), padding-left .2s var(--ec-ease, ease);
}
.pt-item:hover { background: var(--rose-light, rgba(201, 168, 168, .08)); padding-left: 6px; }
.pt-item:active { transform: scale(.99); }
.pt-item-l { flex: 0 0 auto; min-width: 62px; }
.pt-item-label { display: block; font-size: 13.5px; }
.pt-item-en { display: block; font-size: 10px; color: var(--text-muted, #bfb8ae); font-family: var(--font-display, Georgia, serif); font-style: italic; padding-top: 1px; }
.pt-item-r { margin-left: auto; text-align: right; min-width: 0; }
.pt-item-right { display: block; font-size: 12px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; }
.pt-item-none { color: var(--text-muted, #bfb8ae); }
.pt-item-note { display: block; font-size: 10.5px; color: var(--ec-sub, #8a8278); padding-top: 2px; }
.pt-item-go { display: block; font-size: 10.5px; color: var(--ec-rose-ink, #b6707c); padding-top: 3px; letter-spacing: .03em; }
.pt-mock {
    margin-top: 14px;
    padding: 16px 16px 14px;
    border: 1px solid rgba(182, 112, 124, .28);
    border-radius: var(--ec-radius, 14px);
    background: linear-gradient(180deg, rgba(201, 168, 168, .09), rgba(255, 255, 255, 0));
}
.pt-mock-t { font-size: 14px; color: var(--ec-ink, #3a3330); }
.pt-mock-s { font-size: 11.5px; line-height: 1.8; color: var(--ec-sub, #8a8278); padding-top: 6px; }
.pt-mock .ec-actions { padding: 14px 0 0; }
.pt-quiet { font-size: 11px; line-height: 1.85; color: var(--ec-sub, #8a8278); padding: 16px 2px 4px; }
.pt-note {
    font-size: 11.5px;
    line-height: 1.8;
    color: var(--ec-ink, #3a3330);
    padding: 10px 12px;
    margin-top: 8px;
    border-left: 2px solid var(--ec-line, rgba(60, 48, 40, .14));
    background: rgba(60, 48, 40, .03);
    border-radius: 0 var(--ec-radius-s, 10px) var(--ec-radius-s, 10px) 0;
}
.pt-pick-en { margin-left: auto; font-size: 10.5px; color: var(--ec-sub, #8a8278); font-family: var(--font-display, Georgia, serif); font-style: italic; }

/* ===== 做题屏上的「说一遍 / 拍下来」（口语与写字题）===== */
.ex-say-bar { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; padding-top: 10px; }
.ex-act {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .12));
    border-radius: 999px;
    background: var(--surface-solid, #fff);
    font-family: var(--font-body, inherit);
    font-size: 12.5px;
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: transform .18s var(--ec-ease, ease), border-color .18s var(--ec-ease, ease), color .18s var(--ec-ease, ease);
}
.ex-act:active { transform: scale(.97); }
.ex-act.is-on { border-color: rgba(198, 140, 150, .5); color: var(--ec-rose-ink, #b6707c); background: rgba(201, 168, 168, .1); }
.ex-act-hint { flex: 1 1 140px; min-width: 120px; font-size: 11px; line-height: 1.7; color: var(--ec-sub, #8a8278); }
.ex-act-ref {
    margin-top: 8px;
    font-size: 11.5px;
    line-height: 1.8;
    color: var(--ec-sub, #8a8278);
    padding: 8px 10px;
    border-left: 2px solid var(--ec-line, rgba(60, 48, 40, .14));
    background: rgba(60, 48, 40, .03);
    border-radius: 0 var(--ec-radius-s, 10px) var(--ec-radius-s, 10px) 0;
    word-break: break-word;
}
/* 拍照片那一版：认出来的字要大一点、好改（她要在手机上逐字对） */
.ex-photo-box { width: min(92%, 420px); }
.ex-photo-hint { font-size: 11.5px; line-height: 1.8; color: var(--ec-sub, #8a8278); padding-bottom: 10px; }
.ex-photo-text { width: 100%; box-sizing: border-box; font-size: 13px; line-height: 1.85; }
.ex-photo-err { font-size: 12px; line-height: 1.8; color: var(--ec-rose-ink, #b6707c); }
.ex-photo-load { padding: 4px 0 2px; }

/* ===== 单题重做（错题本里「再考一次」）===== */
.ex-wrong-act { padding-top: 10px; }
.ex-redo-btn { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; font-size: 12.5px; }
.ex-wrong-gone { font-size: 11px; color: var(--ec-sub, #8a8278); padding-top: 8px; }
.ex-score-redo .ex-score-pct { font-size: 34px; }
.ex-score-note { font-size: 11.5px; line-height: 1.8; color: var(--ec-sub, #8a8278); padding-top: 10px; }

/* ===== 窄屏（<370）：按钮不挤成两行贴在一起，长单词也不许撑破 ===== */
@media (max-width: 369px) {
    .ex-actions { gap: 7px; }
    .ex-actions .ec-btn { font-size: 12px; padding: 7px 10px; }
    .ex-metrics { gap: 2px; }
    .ex-metric-val { font-size: 17px; }
    .ex-metric-val i { font-size: 9.5px; }
    .ex-metric-label { font-size: 9.5px; }
    .ex-score-pct { font-size: 38px; }
    .ex-run-body { padding-left: 13px; padding-right: 13px; }
    .ex-run-stem { font-size: 14.5px; }
    .ex-run-nav { font-size: 12px; padding: 10px 4px; }
    .ex-run-submit { font-size: 12.5px; }
    .ex-act { padding: 8px 11px; font-size: 12px; }
    .ex-act-hint { flex-basis: 100%; min-width: 0; }
    .ex-photo-box { width: 94%; padding: 16px 13px 13px; }
    .ex-bd-label { flex-basis: 40px; font-size: 12px; }
    .ex-bd-val { flex-basis: 40px; }
    .pt-target-v { font-size: 26px; }
    .pt-target-actions .ec-btn { font-size: 12px; padding: 7px 10px; }
    .pt-item-l { min-width: 54px; }
}

/* ===== 大屏（400+）：字与留白稍微放宽，别显得挤 ===== */
@media (min-width: 400px) {
    .ex-run-body { padding-left: 18px; padding-right: 18px; }
    .ex-score-pct { font-size: 50px; }
    .pt-target-v { font-size: 32px; }
}

/* ===== 减少动态效果：所有过渡与动画都去掉 ===== */
@media (prefers-reduced-motion: reduce) {
    .ex-layers,
    .ex-head-btn,
    .ex-resume,
    .ex-last,
    .ex-paper,
    .ex-bank,
    .ex-link,
    .ex-q-del,
    .ex-input,
    .ex-chip,
    .ex-tab,
    .ex-opt,
    .ex-run-back,
    .ex-run-nav,
    .ex-run-submit,
    .ex-det-btn,
    .ex-act,
    .ex-redo-btn,
    .ex-hist,
    .pt-target-cell,
    .pt-item,
    .ex-sheet,
    .ex-ask-box { transition: none !important; }
    .ex-resume:active,
    .ex-last:active,
    .ex-paper:active,
    .ex-bank:active,
    .ex-chip:active,
    .ex-opt:active,
    .ex-run-nav:active,
    .ex-run-submit:active,
    .ex-act:active,
    .ex-redo-btn:active,
    .pt-target-cell:active,
    .pt-item:active,
    .qk-chip:active,
    .qk-row:active,
    .qk-mock:active,
    .qk-off:active { transform: none !important; }
}

/* ============================================================
   第 6 窗口：真题检索 · 快速刷题 · 真模考（前缀 qk-）
   ------------------------------------------------------------
   只有这一块用 qk- 前缀；来源小签 .ex-src 是被好几屏共用的（做题页 / 结果 / 搜题 / 详情）。
   规矩照这一份的抬头：细线弱阴影、衬线中文、零 emoji、<370 收紧、400+ 放宽、
   减少动效有替代、深色跟着 --ec-* 令牌走（令牌本身在深色下会换值，所以这里不写死颜色）。
   ============================================================ */

/* 来源小签（手册【16.9】：真题与仿题一眼分得出来） */
.ex-src {
    display: inline-block;
    flex-shrink: 0;
    padding: 1.5px 7px;
    border-radius: 999px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .12));
    background: rgba(196, 168, 106, .08);
    color: var(--ec-gold-ink, #a9895f);
    font-size: 10.5px;
    line-height: 1.5;
    letter-spacing: .02em;
    white-space: nowrap;
}
/* 官方/授权那一档：颜色更实一点（它才是真题） */
.ex-src.is-real {
    border-color: rgba(182, 112, 124, .42);
    background: rgba(182, 112, 124, .1);
    color: var(--ec-rose-ink, #b6707c);
}

/* 刷题全屏层：与做题层分两格，互不擦掉 */
.ex-layer-drill { z-index: 3; }

/* 搜题：搜索框（自己画，不用系统框） */
.qk-search { padding: 2px 0 10px; }
.qk-search-box {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 4px 3px 13px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .12));
    border-radius: 999px;
    background: var(--surface-solid, #fff);
    transition: border-color .2s var(--ec-ease, ease);
}
.qk-search-box:focus-within { border-color: rgba(182, 112, 124, .45); }
.qk-search-in {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: none;
    padding: 8px 0;
    font-family: var(--font-body, inherit);
    font-size: 13.5px;
    color: var(--ec-ink, #3a3330);
    -webkit-appearance: none;
    appearance: none;
}
.qk-search-in::-webkit-search-cancel-button { display: none; }
.qk-search-in::placeholder { color: var(--ec-sub, #8a8278); }
.qk-search-go {
    flex-shrink: 0;
    min-width: 52px;
    min-height: 34px;
    border: none;
    border-radius: 999px;
    background: rgba(182, 112, 124, .1);
    color: var(--ec-rose-ink, #b6707c);
    font-family: var(--font-body, inherit);
    font-size: 12.5px;
    cursor: pointer;
    transition: transform .16s var(--ec-ease, ease), background .2s var(--ec-ease, ease);
}
.qk-search-go:active { transform: scale(.96); }

/* 一排小筛选项 */
.qk-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0 10px; }
.qk-chip {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 11px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .12));
    border-radius: 999px;
    background: transparent;
    color: var(--ec-sub, #8a8278);
    font-family: var(--font-body, inherit);
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: transform .16s var(--ec-ease, ease), background .2s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease), color .2s var(--ec-ease, ease);
}
.qk-chip:active { transform: scale(.96); }
.qk-chip.is-on {
    border-color: rgba(182, 112, 124, .45);
    background: rgba(182, 112, 124, .1);
    color: var(--ec-rose-ink, #b6707c);
}
.qk-chip.is-more { border-style: dashed; }
.qk-inline {
    border: none; background: none; padding: 0 2px;
    color: var(--ec-rose-ink, #b6707c);
    font-family: var(--font-body, inherit); font-size: inherit;
    text-decoration: underline; cursor: pointer;
}

.qk-count { font-size: 12px; color: var(--ec-sub, #8a8278); padding: 0 2px 8px; }
.qk-count b { font-family: var(--font-display, Georgia, serif); font-size: 15px; color: var(--ec-ink, #3a3330); }
.qk-note {
    font-size: 11.5px;
    line-height: 1.75;
    color: var(--ec-sub, #8a8278);
    padding: 2px 2px 12px;
}
.qk-hint { font-size: 12px; line-height: 1.7; color: var(--ec-sub, #8a8278); padding: 2px 2px 10px; }
.qk-warn {
    font-size: 12px; line-height: 1.7;
    color: var(--ec-rose-ink, #b6707c);
    background: rgba(182, 112, 124, .08);
    border-radius: var(--ec-radius-s, 10px);
    padding: 10px 12px;
    margin-top: 8px;
}

/* 搜题结果一行 */
.qk-list { padding: 2px 0 12px; }
.qk-row {
    display: block;
    width: 100%;
    text-align: left;
    padding: 11px 12px 10px;
    margin-bottom: 1px;
    border: none;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
    background: transparent;
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: background .18s var(--ec-ease, ease), padding-left .18s var(--ec-ease, ease);
}
.qk-row:hover { background: rgba(201, 168, 168, .1); padding-left: 16px; }
.qk-row:active { background: rgba(201, 168, 168, .16); }
.qk-row-top { display: flex; align-items: baseline; gap: 8px; }
.qk-row-idx { font-size: 11.5px; color: var(--ec-gold-ink, #a9895f); font-variant-numeric: tabular-nums; flex-shrink: 0; min-width: 16px; }
.qk-row-stem { flex: 1; min-width: 0; font-size: 13.5px; line-height: 1.55; word-break: break-word; }
.qk-row-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 6px 0 0 24px; }
.qk-row-bits { font-size: 11px; color: var(--ec-sub, #8a8278); }
.qk-tag { font-size: 10.5px; padding: 1px 6px; border-radius: 999px; }
.qk-tag.is-wrong { background: rgba(182, 112, 124, .1); color: var(--ec-rose-ink, #b6707c); }
.qk-tag.is-fav { background: rgba(196, 168, 106, .12); color: var(--ec-gold-ink, #a9895f); }

/* 筛选抽屉 */
.qk-sheet {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 100%;
    max-width: 480px;
    max-height: 78vh;
    display: flex;
    flex-direction: column;
    background: var(--bg-primary, #f8f4ef);
    border-radius: 16px 16px 0 0;
    box-shadow: var(--shadow-lg, 0 -2px 20px rgba(0, 0, 0, .1));
    animation: qkSheetIn .22s cubic-bezier(.22, .61, .36, 1);
}
@keyframes qkSheetIn { from { transform: translate(-50%, 14px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }
.qk-sheet-head {
    flex-shrink: 0;
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 15px 10px;
    border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
}
.qk-sheet-t { font-size: 14.5px; font-family: var(--font-display, Georgia, serif); }
.qk-sheet-x {
    width: 34px; height: 34px;
    display: flex; align-items: center; justify-content: center;
    border: none; background: none; color: var(--ec-sub, #8a8278); cursor: pointer;
    transition: transform .16s var(--ec-ease, ease);
}
.qk-sheet-x:active { transform: scale(.92); }
.qk-sheet-body { flex: 1; overflow-y: auto; padding: 10px 15px; -webkit-overflow-scrolling: touch; }
.qk-sheet-foot {
    flex-shrink: 0;
    display: flex; gap: 8px;
    padding: 10px 15px calc(12px + var(--safe-bottom, 0px));
    border-top: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07));
}
.qk-sheet-foot .ec-btn { flex: 1; }
.qk-group { padding: 2px 0 10px; }
.qk-group-t { font-size: 12px; color: var(--ec-gold-ink, #a9895f); letter-spacing: .04em; padding-bottom: 7px; }

/* 题目详情 */
.qk-d-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; padding: 2px 0 12px; }
.qk-d-stem { font-size: 15px; line-height: 1.85; padding: 2px 2px 14px; word-break: break-word; }
.qk-d-opts { padding-bottom: 10px; }
.qk-d-opt { display: flex; gap: 9px; padding: 8px 11px; border-radius: var(--ec-radius-s, 10px); }
.qk-d-opt.is-ans { background: rgba(201, 168, 168, .12); }
.qk-d-opt-l { flex-shrink: 0; font-size: 12.5px; color: var(--ec-gold-ink, #a9895f); min-width: 14px; }
.qk-d-opt-t { font-size: 13px; line-height: 1.65; word-break: break-word; }
.qk-d-ans { font-size: 13px; color: var(--ec-rose-ink, #b6707c); padding: 2px 2px 10px; word-break: break-word; }
.qk-d-explain { font-size: 12.5px; line-height: 1.8; color: var(--ec-sub, #8a8278); padding: 0 2px 12px; word-break: break-word; }
.qk-d-facts { display: flex; gap: 16px; padding: 6px 2px 14px; }
.qk-fact { font-size: 12px; color: var(--ec-sub, #8a8278); }
.qk-fact b { font-family: var(--font-display, Georgia, serif); font-size: 17px; color: var(--ec-ink, #3a3330); padding: 0 3px; }

/* 刷题结算 */
.qk-res { display: flex; align-items: baseline; gap: 12px; padding: 10px 2px 16px; flex-wrap: wrap; }
.qk-res-pct { font-family: var(--font-display, Georgia, serif); font-size: 40px; color: var(--ec-rose-ink, #b6707c); font-variant-numeric: tabular-nums; line-height: 1; }
.qk-res-pct i { font-size: 16px; font-style: normal; padding-left: 2px; }
.qk-res-sub { font-size: 12px; color: var(--ec-sub, #8a8278); }
.qk-sec { padding: 2px 0 12px; }
.qk-sec-t { font-size: 12px; color: var(--ec-gold-ink, #a9895f); letter-spacing: .04em; padding-bottom: 8px; }
.qk-kinds { display: flex; flex-wrap: wrap; gap: 6px; }
.qk-kind { display: inline-flex; align-items: baseline; gap: 5px; padding: 5px 10px; border-radius: 999px; background: rgba(182, 112, 124, .08); }
.qk-kind-n { font-family: var(--font-display, Georgia, serif); font-size: 15px; color: var(--ec-rose-ink, #b6707c); }
.qk-kind-l { font-size: 11.5px; color: var(--ec-ink, #3a3330); }
.qk-errs { padding-bottom: 8px; }
.qk-err { padding: 10px 0 11px; border-bottom: 1px solid var(--ec-line-soft, rgba(60, 48, 40, .07)); }
.qk-err-top { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.qk-err-kind { font-size: 11.5px; color: var(--ec-rose-ink, #b6707c); }
.qk-err-skill { font-size: 11px; color: var(--ec-sub, #8a8278); font-variant-numeric: tabular-nums; }
.qk-err-stem { font-size: 12.5px; line-height: 1.65; padding: 5px 0 3px; word-break: break-word; }
.qk-err-why { font-size: 11.5px; color: var(--ec-sub, #8a8278); line-height: 1.7; }
.qk-settle-foot .ex-run-nav,
.qk-settle-foot .ex-run-submit { font-size: 12.5px; }

/* 模考两档 */
.qk-mocks { padding: 2px 0 12px; }
.qk-mock {
    display: block;
    width: 100%;
    text-align: left;
    padding: 13px 14px 12px;
    margin-bottom: 8px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .1));
    border-radius: var(--ec-radius, 14px);
    background: var(--surface-solid, #fff);
    font-family: var(--font-body, inherit);
    color: var(--ec-ink, #3a3330);
    cursor: pointer;
    transition: transform .18s var(--ec-ease, ease), border-color .2s var(--ec-ease, ease), box-shadow .2s var(--ec-ease, ease);
}
.qk-mock:hover { box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, .05)); }
.qk-mock:active { transform: scale(.985); }
.qk-mock.is-on { border-color: rgba(182, 112, 124, .45); box-shadow: 0 0 0 1px rgba(182, 112, 124, .18); }
.qk-mock.is-off { opacity: .55; cursor: default; }
.qk-mock-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.qk-mock-t { font-size: 14.5px; font-family: var(--font-display, Georgia, serif); }
.qk-mock-n { font-size: 11.5px; color: var(--ec-sub, #8a8278); }
.qk-mock-desc { font-size: 11.5px; line-height: 1.7; color: var(--ec-sub, #8a8278); padding-top: 5px; }
.qk-mock-why { font-size: 11.5px; line-height: 1.7; color: var(--ec-rose-ink, #b6707c); padding-top: 6px; }

/* 官方资料（外链卡片） */
.qk-off {
    display: block;
    text-decoration: none;
    color: inherit;
    padding: 12px 13px 11px;
    margin-bottom: 8px;
    border: 1px solid var(--ec-line, rgba(60, 48, 40, .1));
    border-radius: var(--ec-radius, 14px);
    background: var(--surface-solid, #fff);
    transition: transform .18s var(--ec-ease, ease), box-shadow .2s var(--ec-ease, ease);
}
.qk-off:hover { box-shadow: var(--shadow-sm, 0 2px 8px rgba(0, 0, 0, .05)); }
.qk-off:active { transform: scale(.985); }
.qk-off-top { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.qk-off-t { font-size: 13.5px; line-height: 1.5; }
.qk-off-org { font-size: 11px; color: var(--ec-gold-ink, #a9895f); padding-top: 4px; }
.qk-off-note { font-size: 11.5px; line-height: 1.7; color: var(--ec-sub, #8a8278); padding-top: 5px; }
.qk-off-when { font-size: 10.5px; color: var(--ec-sub, #8a8278); padding-top: 6px; }

/* 窄屏（<370）：字与内边距收一点，绝不横向溢出 */
@media (max-width: 369px) {
    .qk-row-stem { font-size: 12.5px; }
    .qk-d-stem { font-size: 14px; }
    .qk-res-pct { font-size: 34px; }
    .qk-chip { font-size: 11.5px; padding: 5px 9px; }
    .qk-row-meta { padding-left: 18px; }
    .qk-search-in { font-size: 13px; }
}

/* 大屏（400+）：留白放宽 */
@media (min-width: 400px) {
    .qk-row-stem { font-size: 14.5px; }
    .qk-d-stem { font-size: 16px; }
    .qk-res-pct { font-size: 46px; }
}

/* 减少动效：这一块新加的那些也一起去掉 */
@media (prefers-reduced-motion: reduce) {
    .qk-search-box,
    .qk-search-go,
    .qk-chip,
    .qk-row,
    .qk-sheet,
    .qk-sheet-x,
    .qk-mock,
    .qk-off { transition: none !important; animation: none !important; }
}