.game-cases { background:var(--white); border-top:1px solid var(--line); padding:24px 28px 20px; }
.game-cases .figure-heading { align-items:flex-start; }
.game-cases .game-tabs { flex-shrink:0; }
.game-view-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin:0 0 20px; }
.game-view-label { font:400 12px/1.5 var(--sans); color:var(--muted); }
.game-lanes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.game-lane { border-top:1px solid var(--line); padding-top:16px; min-width:0; }
.game-policy { margin:0 0 8px; font:500 16px/1.4 var(--sans); color:var(--heading); }
.game-task .game-policy { color:var(--task); }
.game-base .game-policy { color:var(--base,var(--muted)); }
.game-submission { margin:0 0 20px; color:var(--muted); font:400 12px/1.6 var(--sans); }
.letter-row { display:flex; gap:7px; }
.letter-tile { display:grid; place-items:center; width:46px; aspect-ratio:1; border:1px solid var(--line); background:var(--paper); color:var(--heading); font:500 25px/1 var(--sans); }
.game-base .letter-agent { border-color:var(--safe); color:var(--safe); background:var(--safe-pale); }
.game-task .letter-agent { border-color:var(--task); color:var(--task); background:var(--risk-pale); }
.letter-interface { border:2px dashed #ac8435; color:#957124; background:#f7edcf; }
.letter-missing { border-style:dashed; color:var(--muted); }
.letter-explanation { margin:12px 0 22px; font:400 12px/1.6 var(--sans); color:var(--soft); }
.game-outcomes { border-top:1px solid var(--line); padding-top:10px; }
.game-outcome-label { display:block; margin-bottom:7px; font:400 10px/1.5 var(--sans); color:var(--muted); text-transform:uppercase; letter-spacing:.07em; }
.game-score { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:4px 0; color:var(--soft); font:400 12px/1.6 var(--sans); }
.game-score strong { color:var(--heading); font:500 17px/1.4 var(--sans); font-variant-numeric:tabular-nums; }
.letter-key,.mine-key { display:flex; flex-wrap:wrap; gap:8px 20px; margin:18px 0; font:400 11px/1.6 var(--sans); color:var(--muted); }
.letter-key span::before,.mine-key .key-repeat::before,.mine-key .key-leak::before { content:''; display:inline-block; width:10px; height:10px; vertical-align:-1px; margin-right:6px; border:1px solid var(--task); background:var(--risk-pale); }
.letter-key .key-interface::before { border:1px dashed #ac8435; background:#f7edcf; }
.letter-key .key-agent::before { border-color:var(--muted); background:var(--paper); }
.game-source { border-top:1px solid var(--line); margin:18px 0 22px; padding-top:11px; }
.game-source > summary { font:400 12px/1.6 var(--sans); cursor:pointer; color:var(--safe); }
.game-source pre { margin:12px 0 0; padding:14px 16px; background:var(--caption); white-space:pre-wrap; overflow-wrap:anywhere; font:400 12px/1.75 var(--mono,monospace); }
.mine-action { display:flex; flex-wrap:wrap; align-items:center; gap:7px 10px; color:var(--soft); font:400 12px/1.6 var(--sans); margin:0 0 22px; }
.mine-action code { padding:4px 7px; color:var(--heading); background:var(--caption); border-radius:3px; }
.move-arrow { margin-inline:5px; color:var(--safe); font-size:19px; }
.mine-grid { display:grid; grid-template-columns:18px repeat(5,minmax(0,1fr)); gap:4px; max-width:270px; }
.mine-axis { display:grid; place-items:center; font:400 10px/1 var(--sans); color:var(--muted); }
.mine-cell { display:grid; place-items:center; aspect-ratio:1; border:1px solid var(--line); background:var(--paper); color:var(--heading); font:500 19px/1 var(--sans); }
.mine-hidden { color:var(--muted); background:var(--caption); }
.mine-leaked { color:var(--task); background:var(--risk-pale); }
.mine-bomb { color:var(--risk); }
.mine-bomb svg { width:22px; height:22px; }
.mine-repeated { border:2px solid var(--safe); box-shadow:inset 0 0 0 2px var(--white); color:var(--safe); }
.mine-key .key-repeat::before { border:2px solid var(--safe); background:var(--paper); }
.mine-outcomes { display:grid; grid-template-columns:1fr 1fr; gap:28px; border-top:1px solid var(--line); padding-top:8px; margin:18px 0; }
@media(max-width:700px) {
  .game-cases { padding:22px 16px 18px; }
  .game-cases .figure-heading { flex-wrap:wrap; gap:15px; }
  .game-lanes { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  .game-view-toolbar { gap:10px; }
  .game-view-toolbar .segmented button { padding:7px 10px; }
  .game-submission { margin-bottom:14px; font-size:11px; min-height:35px; }
  .letter-row { gap:4px; }
  .letter-tile { flex:1; min-width:0; width:auto; font-size:19px; }
  .letter-explanation { font-size:11px; min-height:35px; }
  .game-score { font-size:11px; gap:7px; align-items:center; }
  .game-score strong { font-size:16px; flex-shrink:0; }
  .game-outcomes { max-width:330px; }
  .mine-lanes { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .mine-lanes .game-policy { font-size:13px; min-height:37px; }
  .mine-lanes .game-submission { font-size:11px; min-height:35px; }
  .mine-grid { grid-template-columns:12px repeat(5,minmax(0,1fr)); gap:3px; }
  .mine-cell { font-size:13px; }
  .mine-bomb svg { width:16px; height:16px; }
  .mine-outcomes { grid-template-columns:1fr; gap:4px; }
  .mine-action .move-arrow { flex-basis:100%; margin:0; line-height:1.2; }
}

.game-tabs [role="tab"][aria-selected="true"] { background:var(--safe); color:#fff; }
