/* 技能/反应测试页样式：复用 bigfive.css 的设计令牌（--brand、--ink、--card 等）
   与 tl-* 外壳类，仅追加测试面板自身的样式。 */
.sk-test {
  max-width: 42rem;
  margin: 1.5rem auto 0;
}

.sk-stage {
  width: 100%;
  min-height: clamp(13rem, 44vw, 17rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 1.25rem;
  text-align: center;
  background: #fff;
  border: 2px dashed var(--line);
  border-radius: 1rem;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  font: inherit;
  color: var(--ink);
  transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.sk-stage:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

.sk-stage.is-running {
  border-style: solid;
  border-color: var(--brand);
}

.sk-stage-main {
  font-size: clamp(1.5rem, 7vw, 2.4rem);
  font-weight: 800;
  line-height: 1.1;
}

.sk-stage-sub {
  color: var(--ink-soft);
  font-size: 0.95rem;
  min-height: 1.4em;
}

.sk-stage.is-waiting {
  background: #dc2626;
  border-color: #dc2626;
  color: #fff;
}

.sk-stage.is-waiting .sk-stage-sub,
.sk-stage.is-go .sk-stage-sub {
  color: rgba(255, 255, 255, 0.9);
}

.sk-stage.is-go {
  background: #16a34a;
  border-color: #16a34a;
  color: #fff;
}

.sk-stage.is-foul {
  background: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
}

.sk-start {
  margin: 1rem auto 0;
  display: flex;
}

.sk-duration {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-bottom: 1rem;
}

.sk-duration button {
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.45rem 0.8rem;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--ink-soft);
  cursor: pointer;
}

.sk-duration button:hover {
  border-color: #b9c6f8;
}

.sk-duration button.is-active {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}

.sk-result {
  text-align: center;
  margin-top: 1.25rem;
}

.sk-score {
  margin: 0;
  font-size: clamp(2.2rem, 10vw, 3.2rem);
  font-weight: 800;
  color: var(--brand-dark);
  line-height: 1;
}

.sk-unit {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--ink-soft);
  margin-left: 0.35rem;
}

.sk-grade {
  margin: 0.5rem 0 0;
  font-size: 1.1rem;
  font-weight: 700;
}

.sk-detail {
  margin: 0.35rem 0 0;
  color: var(--ink-soft);
  font-size: 0.95rem;
}

.sk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin-top: 1.1rem;
}

.sk-rounds {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: center;
  padding: 0;
  margin: 1rem 0 0;
}

.sk-rounds li {
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-weight: 600;
  font-size: 0.85rem;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
}

.sk-info {
  max-width: 42rem;
  margin: 2rem auto 0;
  color: var(--ink-soft);
}

.sk-info h2 {
  color: var(--ink);
  margin-bottom: 0.5rem;
}

.sk-info p {
  margin: 0 0 0.75rem;
}

/* 瞄准测试：目标在区域内随机出现，位置由 JS 用 px 设定。 */
.sk-arena {
  position: relative;
  width: 100%;
  min-height: clamp(18rem, 60vw, 24rem);
  overflow: hidden;
  background: #fff;
  border: 2px dashed var(--line);
  border-radius: 1rem;
  cursor: crosshair;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-arena.is-running {
  border-style: solid;
  border-color: var(--brand);
}

.sk-arena.is-miss {
  background: #fee2e2;
}

.sk-arena-hint {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-soft);
  font-size: 1rem;
  cursor: pointer;
}

.sk-target {
  position: absolute;
  width: clamp(48px, 12vw, 64px);
  height: clamp(48px, 12vw, 64px);
  padding: 0;
  border: none;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #818cf8, var(--brand));
  box-shadow: 0 6px 14px rgba(79, 70, 229, 0.35);
  cursor: pointer;
  touch-action: manipulation;
  transition: transform 0.09s ease;
}

.sk-target.is-pop {
  transform: scale(0.78);
}

.sk-target:focus-visible {
  outline: 3px solid var(--brand-dark);
  outline-offset: 2px;
}

/* 打字测试：上方目标文本逐字符着色，下方输入框。 */
.sk-typing {
  max-width: 42rem;
}

.tk-meta {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  margin: 0 0 1rem;
  color: var(--ink-soft);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.tk-text {
  margin: 0;
  padding: 1.25rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem 1rem 0 0;
  border-bottom: none;
  font-size: clamp(1.05rem, 3.6vw, 1.35rem);
  line-height: 1.9;
  letter-spacing: 0.02em;
  word-break: break-word;
}

.tk-text span.is-ok {
  color: var(--brand-dark);
}

.tk-text span.is-bad {
  color: #dc2626;
  background: #fee2e2;
  border-radius: 3px;
}

.tk-input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  min-height: 5.5rem;
  padding: 1rem 1.25rem;
  border: 2px solid var(--line);
  border-radius: 0 0 1rem 1rem;
  font: inherit;
  line-height: 1.9;
  resize: vertical;
}

.tk-input:focus {
  outline: none;
  border-color: var(--brand);
}

.tk-input:disabled {
  background: #f8fafc;
  color: var(--ink-soft);
}

.tk-hint {
  margin: 0.75rem 0 0;
  color: var(--ink-soft);
  font-size: 0.9rem;
  text-align: center;
}

/* 数字记忆测试：大号数字展示与输入表单。 */
.sk-memory {
  max-width: 42rem;
}

.sk-mem-level {
  margin: 0 0 0.75rem;
  text-align: center;
  color: var(--ink-soft);
  font-weight: 700;
}

.sk-mem-number {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.12em;
  word-break: break-all;
}

.sk-mem-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-mem-input {
  flex: 1 1 12rem;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.7rem 1rem;
  border: 2px solid var(--line);
  border-radius: 0.6rem;
  font: inherit;
  font-size: 1.1rem;
  letter-spacing: 0.15em;
  font-variant-numeric: tabular-nums;
}

.sk-mem-input:focus {
  outline: none;
  border-color: var(--brand);
}

/* 语言记忆测试：单词展示 + Seen/New 双按钮。 */
.sk-verbal-stage {
  min-height: clamp(9rem, 30vw, 12rem);
}

.sk-word {
  font-size: clamp(2rem, 9vw, 3rem);
  text-transform: lowercase;
}

.sk-word.is-ok {
  color: #16a34a;
}

.sk-word.is-bad {
  color: #dc2626;
}

.sk-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-choices .tl-button {
  min-width: 7rem;
  margin: 0;
}

.sk-choices .tl-button:disabled {
  opacity: 0.5;
  cursor: default;
}

/* 色相测试：网格色块，点选交换。 */
.sk-hue-grid {
  display: grid;
  grid-template-columns: repeat(var(--hue-cols, 8), minmax(0, 1fr));
  gap: 6px;
  margin-top: 0.5rem;
}

.sk-hue-tile {
  height: clamp(40px, 9vw, 60px);
  padding: 0;
  border: 3px solid transparent;
  border-radius: 0.5rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.08s ease, border-color 0.08s ease;
}

.sk-hue-tile.is-selected {
  border-color: var(--ink);
  transform: scale(0.92);
}

.sk-hue-grid.is-bad {
  animation: sk-shake 0.35s ease;
}

.sk-hue-grid.is-ok .sk-hue-tile {
  border-color: #16a34a;
}

/* 黑猩猩测试：数字网格，数字隐藏后所有格子外观一致。 */
.sk-chimp-grid {
  display: grid;
  grid-template-columns: repeat(var(--chimp-cols, 5), minmax(0, 1fr));
  gap: 6px;
  margin-top: 0.5rem;
}

.sk-chimp-cell {
  min-height: clamp(44px, 14vw, 64px);
  display: flex;
  align-items: center;
  justify-content: center;
  font: inherit;
  font-size: clamp(1.1rem, 4.5vw, 1.5rem);
  font-weight: 700;
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 0.5rem;
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.1s ease, border-color 0.1s ease;
}

.sk-chimp-cell.is-numbered {
  background: var(--brand-soft);
  border-color: #c7d2fe;
  color: var(--brand-dark);
}

.sk-chimp-cell.is-blank {
  background: #f1f5f9;
}

.sk-chimp-grid.is-ok .sk-chimp-cell {
  border-color: #16a34a;
}

@keyframes sk-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-4px); }
  75% { transform: translateX(4px); }
}

/* 多任务测试：两路并排面板，各自随机变绿。 */
.sk-mt {
  max-width: 44rem;
}

.sk-mt-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}

.sk-mt-lane {
  min-height: clamp(10rem, 34vw, 14rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 1.25rem;
  font: inherit;
  color: var(--ink);
  background: #fff;
  border: 2px dashed var(--line);
  border-radius: 1rem;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background 0.1s ease, border-color 0.1s ease, color 0.1s ease;
}

.sk-mt-lane.is-wait {
  background: #f1f5f9;
  border-style: solid;
  border-color: var(--line);
  color: var(--ink-soft);
}

.sk-mt-lane.is-go {
  background: #16a34a;
  border-style: solid;
  border-color: #16a34a;
  color: #fff;
}

.sk-mt-lane:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

.sk-mt-lane-main {
  font-size: clamp(1.4rem, 6vw, 2rem);
  font-weight: 800;
  line-height: 1.1;
}

.sk-mt-lane-sub {
  font-size: 0.85rem;
  min-height: 1.2em;
}

.sk-mt-status {
  margin: 0 0 0.75rem;
  text-align: center;
  color: var(--ink-soft);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* 视觉记忆测试：网格格子短暂高亮后恢复。 */
.sk-visual-grid {
  display: grid;
  grid-template-columns: repeat(var(--visual-cols, 3), minmax(0, 1fr));
  gap: 6px;
  margin-top: 0.5rem;
}

.sk-visual-cell {
  min-height: clamp(44px, 14vw, 64px);
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 0.5rem;
  background: #fff;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.1s ease, border-color 0.1s ease;
}

.sk-visual-cell.is-lit {
  background: var(--brand);
  border-color: var(--brand-dark);
}

.sk-visual-cell.is-found {
  background: var(--brand-soft);
  border-color: #c7d2fe;
}

.sk-visual-grid.is-ok .sk-visual-cell {
  border-color: #16a34a;
}

/* 序列记忆测试：2×2 彩色区块，播放时点亮，点击时按下反馈。 */
.sk-seq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  max-width: 24rem;
  margin: 0 auto;
}

.sk-seq-pad {
  height: clamp(5rem, 22vw, 8rem);
  padding: 0;
  border: none;
  border-radius: 1rem;
  cursor: pointer;
  opacity: 0.55;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: opacity 0.08s ease, transform 0.08s ease, box-shadow 0.08s ease;
}

.sk-seq-pad.is-c0 { background: #4f46e5; }
.sk-seq-pad.is-c1 { background: #0891b2; }
.sk-seq-pad.is-c2 { background: #d97706; }
.sk-seq-pad.is-c3 { background: #dc2626; }

.sk-seq-pad.is-active {
  opacity: 1;
  transform: scale(1.03);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.7) inset, 0 0 18px rgba(0, 0, 0, 0.25);
}

.sk-seq-pad.is-pressed {
  opacity: 1;
  transform: scale(0.96);
}

.sk-seq-pad:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* 听力测试：频率大字展示、安全提示与不支持提示。 */
.sk-hearing {
  max-width: 42rem;
}

.sk-hz-note {
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  background: var(--brand-soft);
  color: var(--brand-dark);
  border-radius: 0.6rem;
  font-size: 0.9rem;
  text-align: center;
}

.sk-hearing-freq {
  margin: 0 0 0.5rem;
  text-align: center;
  font-size: clamp(2rem, 9vw, 3rem);
  font-weight: 800;
  color: var(--brand-dark);
  font-variant-numeric: tabular-nums;
}

.sk-unsupported {
  margin: 1rem 0 0;
  padding: 0.75rem 1rem;
  background: #fef3c7;
  color: #92400e;
  border-radius: 0.6rem;
  font-size: 0.9rem;
}

@media (min-width: 640px) {
  .sk-stage {
    min-height: 17rem;
  }
}

/* 颜色词干扰测试：彩色单词 + 2×2 颜色按钮。 */
.sk-stroop-stage {
  min-height: clamp(9rem, 30vw, 12rem);
}

.sk-stroop-word {
  font-size: clamp(2.2rem, 11vw, 3.4rem);
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.sk-stroop-word.is-ok {
  color: #16a34a !important;
}

.sk-stroop-word.is-bad {
  color: #dc2626 !important;
}

.sk-color-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  max-width: 24rem;
  margin: 1rem auto 0;
}

.sk-color-btn {
  min-height: 56px;
  font: inherit;
  font-weight: 700;
  color: #fff;
  border: 3px solid rgba(0, 0, 0, 0.12);
  border-radius: 0.7rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-color-btn.is-red { background: #dc2626; }
.sk-color-btn.is-green { background: #16a34a; }
.sk-color-btn.is-blue { background: #2563eb; }
.sk-color-btn.is-yellow { background: #eab308; color: #1f2937; }

.sk-color-btn:focus-visible {
  outline: 3px solid var(--ink);
  outline-offset: 2px;
}

/* 心算测试：大号算式展示。 */
.sk-math-question {
  font-size: clamp(1.8rem, 8vw, 2.8rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}

/* 追踪目标测试：可移动的圆形目标，指针停留命中时变绿。 */
.sk-track-arena {
  touch-action: none;
  cursor: crosshair;
}

.sk-track-target {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle at 35% 30%, #818cf8, var(--brand));
  box-shadow: 0 6px 14px rgba(79, 70, 229, 0.35);
  transition: background 0.08s ease;
}

.sk-track-target.is-hit {
  background: radial-gradient(circle at 35% 30%, #4ade80, #16a34a);
  box-shadow: 0 6px 14px rgba(22, 163, 74, 0.4);
}

/* Go / No-Go 测试：绿色圆点（go）与红色叉（no-go）刺激。 */
.sk-gn-stage {
  min-height: clamp(11rem, 38vw, 15rem);
  cursor: pointer;
}

.sk-gn-stim {
  font-size: clamp(4rem, 18vw, 7rem);
  font-weight: 800;
  line-height: 1;
}

.sk-gn-stim.is-go {
  color: #16a34a;
}

.sk-gn-stim.is-no {
  color: #dc2626;
}

.sk-gn-stim.is-ok {
  color: #16a34a;
}

.sk-gn-stim.is-bad {
  color: #dc2626;
}

/* 心理旋转测试：两个并排的方块图形（SVG）。 */
.sk-rotation-figures {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  padding: 0.75rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
}

.sk-rotation-svg {
  flex: 1 1 0;
  min-width: 0;
  max-width: 14rem;
  aspect-ratio: 1 / 1;
  height: auto;
}

.sk-rotation-cell {
  fill: var(--brand);
  stroke: var(--brand-dark);
  stroke-width: 0.06;
}

.sk-rotation-figures.is-ok .sk-rotation-cell {
  fill: #16a34a;
  stroke: #15803d;
}

.sk-rotation-figures.is-bad .sk-rotation-cell {
  fill: #dc2626;
  stroke: #b91c1c;
}

.sk-rotation-choices {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-rotation-choices .tl-button {
  min-width: 8rem;
  margin: 0;
}

/* 数字广度测试：逐位显示的大号数字。 */
.sk-span-stage {
  min-height: clamp(9rem, 30vw, 12rem);
}

.sk-span-digit {
  font-size: clamp(3rem, 16vw, 5rem);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--brand-dark);
}

/* Flanker 测试：一排箭头，作答中央目标箭头方向。 */
.sk-flanker-stage {
  min-height: clamp(9rem, 30vw, 12rem);
}

.sk-flanker-row {
  font-size: clamp(2.4rem, 12vw, 4rem);
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1;
  color: var(--ink);
}

.sk-flanker-row.is-ok {
  color: #16a34a;
}

.sk-flanker-row.is-bad {
  color: #dc2626;
}

.sk-flanker-choices {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-flanker-choices .tl-button {
  min-width: 8rem;
  margin: 0;
}

/* N-Back 测试：3×3 网格中单格亮起，Match 判定。 */
.sk-nback-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 20rem;
  margin: 0 auto;
}

.sk-nback-cell {
  min-height: clamp(52px, 17vw, 76px);
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 0.6rem;
  background: #fff;
  cursor: default;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.08s ease, border-color 0.08s ease;
}

.sk-nback-cell.is-lit {
  background: var(--brand);
  border-color: var(--brand-dark);
}

.sk-nback-actions {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-nback-actions .tl-button {
  min-width: 8rem;
  margin: 0;
}

.sk-nback-actions .sk-start {
  margin: 0;
}

/* Corsi 方块测试：3×3 方块板，依次点亮后按顺序复述。 */
.sk-corsi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 20rem;
  margin: 0 auto;
}

.sk-corsi-block {
  min-height: clamp(52px, 17vw, 76px);
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 0.6rem;
  background: #fff;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.08s ease, border-color 0.08s ease, transform 0.08s ease;
}

.sk-corsi-block.is-active {
  background: var(--brand);
  border-color: var(--brand-dark);
}

.sk-corsi-block.is-pressed {
  transform: scale(0.94);
}

.sk-corsi-block:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* 连线测试：SVG 圆圈按序连接，已连变绿、错点变红。 */
.sk-trail-stage {
  display: block;
  margin-top: 0.5rem;
}

.sk-trail-svg {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 26rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-trail > .sk-stage-sub,
.sk-pattern > .sk-stage-sub {
  display: block;
  text-align: center;
  margin-top: 0.6rem;
}

.sk-trail-node {
  fill: var(--brand);
  stroke: var(--brand-dark);
  stroke-width: 0.5;
  cursor: pointer;
}

.sk-trail-label {
  fill: #fff;
  font-size: 5px;
  font-weight: 700;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
}

.sk-trail-link {
  stroke: #16a34a;
  stroke-width: 1.2;
  stroke-linecap: round;
}

.sk-trail-item.is-done .sk-trail-node {
  fill: #16a34a;
  stroke: #15803d;
}

.sk-trail-item.is-bad .sk-trail-node {
  fill: #dc2626;
  stroke: #b91c1c;
}

/* 语言流畅性测试：目标字母、输入框与已接受词列表。 */
.sk-fluency-stage {
  cursor: default;
}

.sk-fluency-letter {
  font-size: clamp(3rem, 16vw, 5rem);
  font-weight: 800;
  color: var(--brand-dark);
  line-height: 1;
}

.sk-fluency-form {
  margin-top: 1rem;
}

.sk-fluency-input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 0.8rem 1rem;
  border: 2px solid var(--line);
  border-radius: 0.6rem;
  font: inherit;
  font-size: 1.15rem;
}

.sk-fluency-input:focus {
  outline: none;
  border-color: var(--brand);
}

.sk-fluency-input.is-bad {
  border-color: #dc2626;
  background: #fee2e2;
}

.sk-fluency-input.is-dup {
  border-color: #f59e0b;
  background: #fef3c7;
}

.sk-fluency-words {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: center;
  padding: 0;
  margin: 0.9rem 0 0;
}

.sk-fluency-words li {
  background: var(--brand-soft);
  color: var(--brand-dark);
  font-weight: 600;
  font-size: 0.85rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
}

/* 图案再认测试：学习时单个图案，再认时并排两个可选图案。 */
.sk-pattern-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(12rem, 42vw, 16rem);
  padding: 1rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
}

.sk-pattern-svg {
  width: clamp(9rem, 40vw, 13rem);
  aspect-ratio: 1 / 1;
  height: auto;
}

.sk-pattern-pair {
  display: flex;
  gap: 1rem;
  justify-content: center;
  width: 100%;
}

.sk-pattern-pair .sk-pattern-svg {
  width: 100%;
}

.sk-pattern-btn {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 0.8rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-pattern-btn:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

.sk-pattern-line {
  fill: none;
  stroke: var(--brand);
  stroke-width: 5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sk-pattern-pair.is-ok .sk-pattern-line {
  stroke: #16a34a;
}

.sk-pattern-pair.is-bad .sk-pattern-line {
  stroke: #dc2626;
}

/* 选择反应时测试：四象限刺激格，亮起的那格高亮，答对绿、答错红。 */
.sk-choice-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-top: 1rem;
}

.sk-choice-cell {
  min-height: clamp(6rem, 26vw, 9rem);
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 1rem;
  background: #fff;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.06s ease, border-color 0.06s ease, transform 0.06s ease;
}

.sk-choice-cell.is-lit {
  background: var(--brand);
  border-color: var(--brand-dark);
  transform: scale(1.02);
}

.sk-choice-cell.is-hit {
  background: #16a34a;
  border-color: #15803d;
}

.sk-choice-cell.is-miss {
  background: #dc2626;
  border-color: #b91c1c;
}

.sk-choice-cell:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* 词汇测试：单词与 4 个释义选项，正确绿、错误红。 */
.sk-vocab-stage {
  cursor: default;
}

.sk-vocab-word {
  font-size: clamp(2rem, 9vw, 3rem);
  font-weight: 800;
  color: var(--brand-dark);
  text-transform: lowercase;
  word-break: break-word;
}

.sk-vocab-choices {
  display: grid;
  gap: 0.6rem;
  margin-top: 1rem;
}

.sk-vocab-choice {
  margin: 0;
  text-align: left;
  line-height: 1.35;
  white-space: normal;
}

.sk-vocab-choice.is-correct {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-vocab-choice.is-wrong {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

/* 空间推理测试：题目与选项均为栅格图案，正确绿、错误红。 */
.sk-spatial-prompt {
  margin: 0 0 0.75rem;
  text-align: center;
  color: var(--ink);
  font-weight: 700;
}

.sk-spatial-stage {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
}

.sk-spatial-grid {
  display: grid;
  grid-template-columns: repeat(var(--spatial-cols, 3), minmax(0, 1fr));
  gap: 3px;
  width: clamp(6rem, 26vw, 9rem);
}

.sk-spatial-cell {
  aspect-ratio: 1 / 1;
  border-radius: 3px;
  background: #f1f5f9;
  border: 1px solid var(--line);
}

.sk-spatial-cell.is-v1 {
  background: var(--brand);
  border-color: var(--brand-dark);
}

.sk-spatial-cell.is-v2 {
  background: #d97706;
  border-color: #b45309;
}

.sk-spatial-cell.is-v3 {
  background: #16a34a;
  border-color: #15803d;
}

.sk-spatial-cell.is-missing {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-soft);
  font-weight: 800;
  background: #fff;
  border-style: dashed;
}

.sk-spatial-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-spatial-choice {
  padding: 0.5rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 0.8rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-spatial-choice .sk-spatial-grid {
  width: clamp(5rem, 22vw, 7rem);
}

.sk-spatial-choice.is-correct {
  border-color: #16a34a;
  box-shadow: 0 0 0 2px #16a34a inset;
}

.sk-spatial-choice.is-wrong {
  border-color: #dc2626;
  box-shadow: 0 0 0 2px #dc2626 inset;
}

.sk-spatial-choice:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

.sk-spatial > .sk-stage-sub {
  display: block;
  text-align: center;
  margin-top: 0.6rem;
}

/* 处理速度测试：固定符号-数字映射表 + 单个符号刺激 + 数字键盘。 */
.sk-coding-key {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-bottom: 0.75rem;
}

.sk-coding-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  min-width: 3.2rem;
  padding: 0.4rem 0.55rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 0.7rem;
}

.sk-coding-cell-sym {
  font-size: 1.5rem;
  line-height: 1;
  color: var(--brand-dark);
}

.sk-coding-cell-num {
  font-size: 1rem;
  font-weight: 800;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.sk-coding-symbol {
  font-size: clamp(3.4rem, 18vw, 6rem);
  line-height: 1;
  color: var(--ink);
  transition: color 0.06s ease;
}

.sk-coding-symbol.is-correct {
  color: #16a34a;
}

.sk-coding-symbol.is-wrong {
  color: #dc2626;
}

.sk-coding-pad {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  max-width: 15rem;
  margin: 1rem auto 0;
}

.sk-coding-num {
  min-height: clamp(2.75rem, 12vw, 3.5rem);
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 0.7rem;
  background: #fff;
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--ink);
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-coding-num:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* Simon 任务测试：左/右两个区域，蓝/橙方块出现其中一侧。 */
.sk-simon-stage {
  min-height: clamp(9rem, 30vw, 12rem);
}

.sk-simon-lanes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  width: 100%;
}

.sk-simon-side {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(5rem, 22vw, 8rem);
  background: #f8fafc;
  border: 2px dashed var(--line);
  border-radius: 1rem;
}

.sk-simon-square {
  display: block;
  width: clamp(2.6rem, 13vw, 4rem);
  aspect-ratio: 1 / 1;
  border-radius: 0.6rem;
  border: 2px solid transparent;
}

.sk-simon-square.is-blue {
  background: #2563eb;
  border-color: #1d4ed8;
}

.sk-simon-square.is-orange {
  background: #ea580c;
  border-color: #c2410c;
}

.sk-simon-choices {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-simon-choices .tl-button {
  min-width: 8rem;
  margin: 0;
}

/* 数字推理测试：序列提示 + 4 个数字选项。 */
.sk-num-stage {
  cursor: default;
}

.sk-num-seq {
  font-size: clamp(1.5rem, 7vw, 2.4rem);
  font-weight: 800;
  color: var(--brand-dark);
  font-variant-numeric: tabular-nums;
  word-break: break-word;
}

.sk-num-prompt {
  margin-top: 0.4rem;
  color: var(--ink-soft);
  font-weight: 700;
}

.sk-num-choices {
  display: grid;
  gap: 0.6rem;
  margin-top: 1rem;
}

.sk-num-choice {
  margin: 0;
  text-align: left;
  line-height: 1.35;
  white-space: normal;
}

.sk-num-choice.is-correct {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-num-choice.is-wrong {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

/* 逻辑推理测试：前提文字 + 结论提示 + 4 个选项。 */
.sk-logical-stage {
  cursor: default;
  gap: 0.6rem;
}

.sk-logical-premise {
  margin: 0;
  font-size: clamp(1rem, 4vw, 1.25rem);
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink);
}

.sk-logical-prompt {
  color: var(--ink-soft);
  font-weight: 600;
}

.sk-logical-choices {
  display: grid;
  gap: 0.6rem;
  margin-top: 1rem;
}

.sk-logical-choice {
  margin: 0;
  text-align: left;
  line-height: 1.4;
  white-space: normal;
}

.sk-logical-choice.is-correct {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-logical-choice.is-wrong {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

/* 表情识别测试：内联 SVG 人脸 + 六个情绪按钮。 */
.sk-emotion-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
}

.sk-face {
  width: clamp(10rem, 46vw, 15rem);
  aspect-ratio: 1 / 1;
  height: auto;
}

.sk-face-head {
  fill: #fcd9a8;
  stroke: #e0a96d;
  stroke-width: 2;
}

.sk-face-eye {
  fill: #1f2937;
}

.sk-face-brow {
  stroke: #7c4a12;
  stroke-width: 3;
}

.sk-face-mouth {
  fill: none;
  stroke: #b91c1c;
  stroke-width: 3;
  stroke-linecap: round;
}

.sk-face-mouth-solid {
  fill: #7f1d1d;
  stroke: none;
}

.sk-face-tear {
  fill: #60a5fa;
}

.sk-emotion-choices {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  margin-top: 1rem;
}

@media (min-width: 480px) {
  .sk-emotion-choices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.sk-emotion-choice {
  margin: 0;
  min-width: 0;
}

.sk-emotion-choice.is-correct {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-emotion-choice.is-wrong {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

/* 变化盲视测试：闪烁交替的场景 SVG + 提示。 */
.sk-change-stage {
  display: block;
}

.sk-change-svg {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 26rem;
  background: #f8fafc;
  border: 2px solid var(--line);
  border-radius: 1rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-change-shape {
  transition: stroke 0.1s ease;
}

.sk-change-shape.is-found {
  stroke: #16a34a;
  stroke-width: 2.5;
}

.sk-change-shape.is-target {
  stroke: #dc2626;
  stroke-width: 2.5;
}

.sk-change-hint {
  margin: 0.7rem 0 0;
  text-align: center;
  color: var(--ink-soft);
  font-weight: 600;
  min-height: 1.4em;
}

/* 视觉搜索测试：散布场景 SVG，形状描边反馈。 */
.sk-search-stage {
  display: block;
}

.sk-search-svg {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 26rem;
  background: #f8fafc;
  border: 2px solid var(--line);
  border-radius: 1rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-search-shape {
  transition: stroke 0.1s ease;
}

.sk-search-shape.is-found {
  stroke: #16a34a;
  stroke-width: 2.5;
}

.sk-search-shape.is-target {
  stroke: #dc2626;
  stroke-width: 2.5;
}

.sk-search-hint {
  margin: 0.7rem 0 0;
  text-align: center;
  color: var(--ink-soft);
  font-weight: 600;
  min-height: 1.4em;
}

/* 词语联想学习测试：学习词对网格 + 输入作答。 */
.sk-paired-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.6rem;
  list-style: none;
  margin: 0.5rem 0 1rem;
  padding: 0;
}

.sk-paired-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 0.75rem;
  font-weight: 700;
}

.sk-paired-cue {
  color: var(--ink);
}

.sk-paired-arrow {
  color: var(--ink-soft);
}

.sk-paired-target {
  color: var(--brand-dark);
}

.sk-paired-test {
  text-align: center;
}

.sk-paired-prompt {
  margin-bottom: 0.25rem;
  color: var(--ink-soft);
  font-weight: 600;
}

.sk-paired-cue {
  font-size: clamp(1.6rem, 6vw, 2.4rem);
  font-weight: 800;
  margin: 0 0 0.75rem;
}

.sk-paired-form {
  display: flex;
  gap: 0.5rem;
  justify-content: center;
  max-width: 26rem;
  margin: 0 auto;
}

.sk-paired-input {
  flex: 1;
  min-width: 0;
  padding: 0.65rem 0.85rem;
  border: 2px solid var(--line);
  border-radius: 0.6rem;
  font-size: 1.05rem;
}

.sk-paired-feedback {
  margin: 0.75rem 0 0;
  font-weight: 700;
  min-height: 1.4em;
}

/* 汉诺塔测试：三根柱子，圆盘自底向上堆叠。 */
.sk-hanoi-board {
  display: flex;
  gap: 1rem;
  justify-content: center;
  align-items: flex-end;
  padding: 1rem;
  background: #f8fafc;
  border: 2px solid var(--line);
  border-radius: 1rem;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-hanoi-rod {
  position: relative;
  width: clamp(4.5rem, 22vw, 7rem);
  height: clamp(7rem, 34vw, 10rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  border-radius: 0.6rem;
}

.sk-hanoi-rod.is-selected {
  outline: 3px solid var(--brand);
}

.sk-hanoi-post {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 2.5rem;
  width: 10px;
  transform: translateX(-50%);
  background: var(--ink-soft);
  border-radius: 5px;
}

.sk-hanoi-discs {
  position: relative;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 4px;
  width: 100%;
  padding-bottom: 0.25rem;
  border-bottom: 4px solid var(--ink-soft);
}

.sk-hanoi-disc {
  height: 1.35rem;
  border-radius: 0.4rem;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 800;
  text-align: center;
  line-height: 1.35rem;
}

.sk-hanoi-disc.is-size-1 {
  width: 28%;
  background: var(--brand);
}

.sk-hanoi-disc.is-size-2 {
  width: 46%;
  background: var(--brand-dark);
}

.sk-hanoi-disc.is-size-3 {
  width: 64%;
  background: #7c3aed;
}

.sk-hanoi-disc.is-size-4 {
  width: 82%;
  background: #b45309;
}

.sk-hanoi-board.is-solved .sk-hanoi-disc {
  background: #16a34a;
}

.sk-hanoi-moves {
  margin-top: 0.75rem;
}

.sk-hanoi-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-top: 0.9rem;
}

@media (max-width: 560px) {
  .sk-paired-grid {
    grid-template-columns: 1fr;
  }
}

/* 色盲筛查：彩色点阵板块及选项。 */
.sk-cb-plate {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
  padding: 0.75rem;
}

.sk-cb-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-cb-hint {
  margin: 0.7rem 0 0;
  text-align: center;
  color: var(--ink-soft);
  font-weight: 600;
  min-height: 1.4em;
}

/* 阅读速度测试：文章与题目。 */
.sk-read-text {
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
  padding: 1rem 1.2rem;
  line-height: 1.8;
  white-space: pre-wrap;
  word-break: break-word;
}

.sk-quiz {
  margin-top: 1rem;
}

.sk-quiz-item {
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.sk-quiz-choices {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.sk-quiz-choice.is-correct {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-quiz-choice.is-wrong {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

/* 言语类比测试：关系对短语居中显示，复用词汇测试的四选项布局与对错配色。 */
.sk-analogy-stage {
  cursor: default;
}

.sk-analogy-pair {
  font-size: clamp(1.4rem, 6vw, 2.2rem);
  font-weight: 700;
  color: var(--brand-dark);
  line-height: 1.4;
  word-break: break-word;
}

/* 运算广度（OSPAN）：算式居中，True/False 按钮并排，复述表单在下方。 */
.sk-ospan-stage {
  cursor: default;
}

.sk-ospan-item {
  font-size: clamp(1.5rem, 6vw, 2.4rem);
  font-weight: 800;
  color: var(--brand-dark);
  word-break: break-word;
}

.sk-ospan-choices {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 1rem;
}

.sk-ospan-choice.is-correct {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-ospan-choice.is-wrong {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

.sk-ospan-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-ospan-label {
  width: 100%;
  text-align: center;
  font-weight: 700;
  color: var(--ink);
}

.sk-ospan-input {
  border: 2px solid var(--line);
  border-radius: 8px;
  font-size: 1.4rem;
  width: 10ch;
  max-width: 100%;
  text-align: center;
  padding: 0.5rem;
}

.sk-ospan-input:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* 迷宫测试：通行网格，墙与通路对比鲜明，球与终点以圆点标识。 */
.sk-maze-stage {
  cursor: default;
}

.sk-maze-board {
  display: grid;
  margin: 0 auto;
  max-width: 460px;
  background: var(--bg);
  border: 2px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  touch-action: none;
}

.sk-maze-cell.is-wall {
  background: var(--ink);
}

.sk-maze-cell.is-path {
  background: var(--bg);
}

.sk-maze-ball {
  background: var(--brand);
  border-radius: 50%;
  z-index: 2;
  margin: 18%;
  box-shadow: 0 0 0 2px #fff;
}

.sk-maze-goal {
  background: #16a34a;
  border-radius: 50%;
  z-index: 1;
  margin: 20%;
  box-shadow: 0 0 0 2px #fff;
}

.sk-maze-dpad {
  display: grid;
  grid-template-columns: repeat(3, 3rem);
  grid-template-rows: repeat(3, 3rem);
  gap: 0.4rem;
  justify-content: center;
  margin-top: 1rem;
}

.sk-maze-dpad-btn {
  border: 2px solid var(--line);
  border-radius: 10px;
  background: var(--bg-panel, #fff);
  font-size: 1.2rem;
  color: var(--ink);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sk-maze-dpad-btn:active {
  background: var(--line);
}

.sk-maze-dpad-btn[data-dir="up"] { grid-column: 2; grid-row: 1; }
.sk-maze-dpad-btn[data-dir="left"] { grid-column: 1; grid-row: 2; }
.sk-maze-dpad-btn[data-dir="down"] { grid-column: 2; grid-row: 3; }
.sk-maze-dpad-btn[data-dir="right"] { grid-column: 3; grid-row: 2; }


@media (max-width: 480px) {
  .sk-maze-board {
    max-width: 340px;
  }
}

/* 面孔记忆测试：内联 SVG 参数化人脸（复用 .sk-face 尺寸与 .sk-emotion-stage 容器）。 */
.sk-face .sk-emotion-stage {
  min-height: clamp(13rem, 46vw, 17rem);
}

.sk-fm-eye {
  fill: #1f2937;
}

.sk-fm-brow {
  fill: none;
  stroke: #7c4a12;
  stroke-width: 3;
  stroke-linecap: round;
}

.sk-fm-nose {
  fill: none;
  stroke: #c98b52;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sk-fm-mouth {
  fill: none;
  stroke: #b91c1c;
  stroke-width: 3;
  stroke-linecap: round;
}

.sk-fm-glass {
  fill: none;
  stroke: #1f2937;
  stroke-width: 2.5;
}

.sk-fm-ring {
  fill: #eab308;
  stroke: #a16207;
  stroke-width: 1;
}

.sk-face .sk-mem-form.is-ok .tl-button {
  background: #16a34a;
  border-color: #15803d;
  color: #fff;
}

.sk-face .sk-mem-form.is-bad .tl-button {
  background: #dc2626;
  border-color: #b91c1c;
  color: #fff;
}

/* 认知反射测试：题干卡片 + 数字输入 + 单位后缀。 */
.sk-crt-question {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(8rem, 30vw, 11rem);
  padding: 1rem 1.2rem;
  text-align: center;
  font-size: clamp(1.05rem, 3.6vw, 1.4rem);
  font-weight: 600;
  line-height: 1.55;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
}

.sk-crt .sk-mem-input {
  letter-spacing: normal;
}

.sk-mem-unit {
  align-self: center;
  font-weight: 700;
  color: var(--ink-soft);
}

/* 节奏测试：16 步网格 + 大号击拍按钮（移动端友好）。 */
.sk-rhythm-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 0.4rem;
  max-width: 34rem;
  margin: 0 auto 1rem;
}

.sk-rhythm-cell {
  aspect-ratio: 1 / 1;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 8px;
  transition: background 0.08s ease, border-color 0.08s ease;
}

.sk-rhythm-cell.is-active {
  background: var(--brand);
  border-color: var(--brand);
}

.sk-rhythm-tap {
  display: block;
  width: 100%;
  max-width: 34rem;
  margin: 1rem auto 0;
  min-height: clamp(7rem, 26vw, 10rem);
  font: inherit;
  font-size: clamp(1.2rem, 5vw, 1.8rem);
  font-weight: 800;
  color: #fff;
  background: var(--brand);
  border: 2px solid var(--brand-dark);
  border-radius: 1rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-rhythm-tap:active {
  background: var(--brand-dark);
}

.sk-rhythm-replay {
  display: block;
  margin: 0.8rem auto 0;
}

.sk-rhythm-unsupported {
  margin-top: 1rem;
  color: var(--ink-soft);
  text-align: center;
}

/* 折纸打孔测试：折叠纸图 + 展开候选图（内联 SVG）。 */
.sk-fold-label {
  margin: 0 0 0.4rem;
  text-align: center;
  color: var(--ink);
  font-weight: 700;
  min-height: 1.4em;
}

.sk-fold-stage {
  display: flex;
  justify-content: center;
  padding: 0.75rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 1rem;
}

.sk-fold-svg {
  width: min(13rem, 100%);
  aspect-ratio: 1 / 1;
  height: auto;
}

.sk-fold-paper {
  fill: #fff;
  stroke: var(--ink);
  stroke-width: 0.08;
}

.sk-fold-grid {
  stroke: var(--line);
  stroke-width: 0.05;
}

.sk-fold-packet {
  fill: var(--brand-soft);
  stroke: none;
}

.sk-fold-crease {
  stroke: var(--brand-dark);
  stroke-width: 0.14;
  stroke-dasharray: 0.28 0.22;
}

.sk-fold-punch {
  fill: #dc2626;
  stroke: #b91c1c;
  stroke-width: 0.06;
}

.sk-fold-hole {
  fill: var(--brand-dark);
}

.sk-fold-prompt {
  margin: 0.5rem 0 0;
}

.sk-fold-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin-top: 0.5rem;
}

.sk-fold-choice {
  padding: 0.5rem;
  background: #fff;
  border: 2px solid var(--line);
  border-radius: 0.8rem;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-fold-choice .sk-fold-svg {
  width: clamp(4.6rem, 20vw, 6.4rem);
}

.sk-fold-choice.is-correct {
  border-color: #16a34a;
  box-shadow: 0 0 0 2px #16a34a inset;
}

.sk-fold-choice.is-wrong {
  border-color: #dc2626;
  box-shadow: 0 0 0 2px #dc2626 inset;
}

.sk-fold-choice.is-correct .sk-fold-hole {
  fill: #16a34a;
}

.sk-fold-choice.is-wrong .sk-fold-hole {
  fill: #dc2626;
}

.sk-fold-choice:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

/* 反向眼跳测试：中央注视点 + 左右两个大响应区。 */
.sk-anti-stage {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  min-height: clamp(10rem, 36vw, 13rem);
  padding: 0.75rem;
  background: #fff;
  border: 2px dashed var(--line);
  border-radius: 1rem;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.sk-anti-stage.is-running {
  border-style: solid;
  border-color: var(--brand);
}

.sk-anti-fix {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(1.6rem, 8vw, 2.4rem);
  font-weight: 800;
  color: var(--ink);
  z-index: 2;
  pointer-events: none;
}

.sk-anti-lane {
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 0.9rem;
  background: #f8fafc;
  font: inherit;
  font-size: clamp(2rem, 10vw, 3rem);
  font-weight: 800;
  color: var(--ink-soft);
  cursor: pointer;
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
  transition: background 0.08s ease, border-color 0.08s ease,
    transform 0.08s ease;
}

.sk-anti-lane:focus-visible {
  outline: 3px solid var(--brand);
  outline-offset: 2px;
}

.sk-anti-lane.is-cue {
  background: #fee2e2;
  border-color: #dc2626;
  color: #dc2626;
}

.sk-anti-lane.is-target {
  background: var(--brand);
  border-color: var(--brand-dark);
  color: #fff;
}

/* 风险算商测试：题干卡片更高以容纳条件概率题，输入不加字母间距。 */
.sk-risk-question {
  min-height: clamp(9rem, 34vw, 13rem);
}

.sk-risk .sk-mem-input {
  letter-spacing: normal;
}

/* ============ SEO 枢纽页 /brain-tests/：7 组测试卡片网格 ============ */
.bt-group {
  margin-top: clamp(1.5rem, 4vw, 2.5rem);
  scroll-margin-top: 1rem;
}

.bt-group h2 {
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  margin-bottom: 0.75rem;
}

.bt-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.bt-card {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.85rem 1rem;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 0.75rem;
  background: #fff;
  text-decoration: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.bt-card:hover,
.bt-card:focus-visible {
  border-color: var(--brand, #4f46e5);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.bt-card-name {
  font-weight: 600;
  color: var(--ink, #111827);
}

.bt-card-short {
  font-size: 0.85rem;
  color: var(--ink-soft, #6b7280);
  line-height: 1.4;
}