/* 入站考试插件 - 前台样式（复用 app.css CSS 变量，与全站风格一致；全站无圆角设计，不写 border-radius） */

/* ---------- 常驻引导横幅（main_area_before 注入） ---------- */

.ks-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding: 10px 16px;
  margin-bottom: 16px;
  background: var(--ac-soft);
  color: var(--ac-2);
  border: 1px solid var(--bd);
  font-size: 13.5px;
}

.ks-banner .btn { margin-left: auto; }

.ks-banner-warn {
  background: var(--soft-2);
  color: var(--tx-2);
}

.ks-banner svg { flex: 0 0 auto; }
.ks-banner span { min-width: 0; }

/* ---------- 注册引导弹窗（layout_body_end 注入） ---------- */

.ks-pop-text { font-size: 14px; line-height: 1.8; color: var(--tx); margin: 0 0 12px; }

.ks-pop-meta {
  margin: 0;
  padding-left: 18px;
  color: var(--tx-2);
  font-size: 13px;
  line-height: 2;
}

/* ---------- 考试页通用 ---------- */

.ks-page { max-width: 860px; margin: 0 auto; }
.ks-page > .card { margin-bottom: 16px; }

.ks-hero { text-align: center; padding: 32px 22px; }
.ks-hero h1 { font-family: var(--serif); font-size: 24px; display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 0 6px; }
.ks-hero-sub { color: var(--tx-3); font-size: 13.5px; margin: 0 0 20px; }

.ks-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.ks-stat {
  background: var(--soft);
  border: 1px solid var(--bd);
  padding: 12px 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  min-width: 0;
}

.ks-stat strong { font-size: 17px; color: var(--tx); word-break: break-all; text-align: center; }
.ks-stat span { font-size: 12px; color: var(--tx-3); }

.ks-score-note { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; }

@media (max-width: 640px) {
  .ks-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- 封禁 / 冷却提示卡 ---------- */

.ks-block-card {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  color: var(--tx-2);
}

.ks-block-card svg { color: var(--warn); flex: 0 0 auto; margin-top: 2px; }
.ks-block-card strong { color: var(--tx); display: block; margin-bottom: 4px; }
.ks-block-card p { margin: 0; font-size: 13.5px; line-height: 1.8; }

/* ---------- 规则与开考 ---------- */

.ks-rules .rich-text { font-size: 14px; }
.ks-agree {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--tx-3);
  font-size: 12.5px;
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px dashed var(--bd);
}

.ks-history-brief p { margin: 0; font-size: 13.5px; color: var(--tx-2); }
.ks-start-form .btn { font-size: 15px; padding: 12px 18px; }

/* ---------- 答卷页 ---------- */

.ks-paper-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  padding: 12px 16px;
  position: sticky;
  top: 0;
  z-index: 20;
}

.ks-bar-left { display: flex; align-items: center; gap: 8px; font-size: 14px; min-width: 0; flex-wrap: wrap; }
.ks-bar-left svg { color: var(--ac); }
.ks-bar-left .muted { font-size: 12.5px; }

.ks-bar-right { display: flex; align-items: center; gap: 14px; }

.ks-timer {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 16px;
  font-weight: 700;
  color: var(--ac-2);
  font-variant-numeric: tabular-nums;
}

.ks-timer-warn { color: var(--err); }

.ks-save-state { font-size: 12px; color: var(--tx-3); display: inline-flex; align-items: center; gap: 4px; }
.ks-save-warn { color: var(--warn); }

.ks-question { padding: 18px 20px; }

.ks-q-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }

.ks-q-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  background: var(--ac-soft);
  color: var(--ac-2);
  font-weight: 700;
  font-size: 13px;
  flex: 0 0 auto;
}

.ks-q-type { font-size: 12px; color: var(--tx-3); border: 1px solid var(--bd); padding: 1px 8px; }
.ks-q-score { margin-left: auto; font-size: 12.5px; color: var(--tx-3); }

.ks-q-title { font-size: 15px; font-weight: 600; color: var(--tx); line-height: 1.7; margin: 0 0 14px; }

.ks-options { display: grid; gap: 8px; }

.ks-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--bd);
  background: var(--card);
  cursor: pointer;
  transition: border-color .12s, background .12s;
  min-width: 0;
}

.ks-option:hover { border-color: var(--bd-2); background: var(--soft); }

.ks-option.is-picked { border-color: var(--ac); background: var(--ac-soft); }

.ks-option input { width: 16px; height: 16px; accent-color: var(--ac); flex: 0 0 auto; }

.ks-opt-letter {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--tx-3);
  border: 1px solid var(--bd);
}

.ks-option.is-picked .ks-opt-letter { color: var(--ac-2); border-color: var(--ac); }

.ks-opt-text { font-size: 14px; color: var(--tx); min-width: 0; }

.ks-submit-bar { display: flex; flex-direction: column; gap: 10px; align-items: center; text-align: center; }
.ks-submit-bar .muted { margin: 0; font-size: 13px; }
.ks-answered-ok { margin: 0; font-size: 13px; color: var(--ok); }

.ks-submit-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }

/* ---------- 结果页 ---------- */

.ks-result-hero { text-align: center; padding: 34px 22px; }
.ks-result-hero.is-pass .ks-result-icon svg { color: var(--ok); }
.ks-result-hero.is-fail .ks-result-icon svg { color: var(--err); }
.ks-result-hero h1 { font-family: var(--serif); font-size: 22px; margin: 10px 0 16px; }

.ks-result-score { font-family: var(--serif); }
.ks-result-score strong { font-size: 44px; color: var(--tx); }
.ks-result-score span { font-size: 16px; color: var(--tx-3); margin-left: 4px; }

.ks-result-meta { color: var(--tx-3); font-size: 13px; margin: 10px 0 0; }
.ks-result-actions { display: flex; gap: 10px; justify-content: center; margin-top: 18px; flex-wrap: wrap; }
.ks-result-note { color: var(--tx-3); font-size: 12.5px; margin: 14px 0 0; }

.ks-review-item { padding: 16px 4px; border-top: 1px dashed var(--bd); }
.ks-review-item:first-child { border-top: none; }

.ks-review-head { display: flex; align-items: center; gap: 10px; }

.ks-review-flag { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; }
.ks-review-item.is-ok .ks-review-flag { color: var(--ok); }
.ks-review-item.is-bad .ks-review-flag { color: var(--err); }

.ks-review-opts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }

.ks-review-opt {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  color: var(--tx-3);
  border: 1px solid var(--bd);
  padding: 4px 10px;
}

.ks-review-opt.is-picked { color: var(--tx); border-color: var(--bd-2); background: var(--soft); }
.ks-review-opt.is-wrong { color: var(--err); border-color: var(--err); }

.ks-review-explain {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  margin: 10px 0 0;
  padding: 10px 12px;
  background: var(--soft);
  border-left: 3px solid var(--warn);
  color: var(--tx-2);
  font-size: 13px;
  line-height: 1.7;
}

.ks-review-explain svg { color: var(--warn); flex: 0 0 auto; margin-top: 3px; }

/* ---------- 我的考试记录 ---------- */

.ks-record-hero .ks-stat .chip { font-size: 12px; }
.ks-record-cta { margin-top: 16px; }