/* CHEETAHS · Robot Game layout fix / 2026-11-15
   Dedicated overrides loaded AFTER style.css to avoid legacy .mission-row flex rules.
   Only the Robot Game page uses the .game-rebuild scope. */

/* Two comfortable columns, not the old wide timer + narrow missions layout */
body.tools-page .tool-layout.game-rebuild {
  display:grid;
  grid-template-columns:minmax(280px,335px) minmax(0,1fr);
  align-items:start;
  gap:clamp(18px,2.5vw,34px);
}
body.tools-page .game-rebuild .game-left,
body.tools-page .game-rebuild .game-right,
body.tools-page .game-rebuild .game-missions,
body.tools-page .game-rebuild .mission-panel,
body.tools-page .game-rebuild .missions-list {min-width:0;width:100%;}
body.tools-page .game-rebuild .game-right {position:static;}
body.tools-page .game-rebuild .mission-panel {
  background:#fcfaf5;
  border:1px solid #eadfce;
  border-radius:22px;
  padding:clamp(17px,2.3vw,30px);
  color:#2a211a;
  box-shadow:0 18px 60px rgba(0,0,0,.12);
}
body.tools-page .game-rebuild .mission-heading p {font-size:14px;line-height:1.65;}

/* CRITICAL FIX: .mission-row is display:flex in the legacy CSS. Our expandable
   cards need the header and the contents stacked, not side by side. */
body.tools-page .game-rebuild #missionList .mission-row.mission-card {
  display:block !important;
  width:100%;
  max-width:100%;
  min-width:0;
  padding:0 !important;
  margin:0;
  overflow:hidden;
  background:#f3eee2;
  border:1px solid #e5d9c5;
  border-radius:18px;
  box-shadow:0 3px 12px rgba(91,60,28,.045);
}
body.tools-page .game-rebuild #missionList .mission-card.is-expanded {
  border-color:#eab77a;
  box-shadow:0 8px 28px rgba(91,60,28,.09);
}
body.tools-page .game-rebuild #missionList .mission-card .mission-toggle {
  display:flex;
  align-items:center;
  gap:14px;
  width:100%;
  min-width:0;
  min-height:94px;
  padding:14px 20px;
  color:#251b12;
  background:transparent;
  border:0;
  border-radius:0;
  text-align:left;
  cursor:pointer;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-toggle:hover,
body.tools-page .game-rebuild #missionList .mission-card .mission-toggle:focus-visible {
  background:#fdf5e9;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-thumb {
  flex:0 0 78px;
  width:78px;
  height:66px;
  overflow:hidden;
  border:1px solid #d8e7b1;
  border-radius:12px;
  background:#dff0b9;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-thumb img {width:100%;height:100%;object-fit:contain;}
body.tools-page .game-rebuild #missionList .mission-card .mission-code {
  font:800 13px/1.2 Consolas,monospace;
  letter-spacing:.4px;
  color:#9f601f;
  flex:none;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-text {flex:1 1 auto;min-width:0;}
body.tools-page .game-rebuild #missionList .mission-card .mission-text strong {font-size:clamp(15px,1.3vw,18px);line-height:1.32;color:#271b10;}
body.tools-page .game-rebuild #missionList .mission-card .mission-text small {font-size:12px;color:#796b5b;}
body.tools-page .game-rebuild #missionList .mission-card .mission-points {font:800 15px Consolas,monospace;color:#7e4815;white-space:nowrap;}
body.tools-page .game-rebuild #missionList .mission-card .mission-chevron {color:#a56824;flex:none;}

body.tools-page .game-rebuild #missionList .mission-card .mission-details {
  display:block;
  box-sizing:border-box;
  width:100%;
  min-width:0;
  padding:22px clamp(15px,3vw,31px) 26px;
  background:#fffaf1;
  border-top:1px solid #e8d9c2;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-details[hidden] {display:none !important;}
body.tools-page .game-rebuild #missionList .mission-card .mission-figure {
  display:block;
  width:100%;
  max-width:100%;
  margin:0 0 24px;
  overflow:hidden;
  border:1px solid #d5e7a5;
  border-radius:16px;
  background:#dfefba;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-figure img {
  display:block;
  width:100%;
  height:auto;
  max-height:470px;
  margin-inline:auto;
  object-fit:contain;
  background:#dff0bb;
}
body.tools-page .game-rebuild #missionList .mission-card .mission-figure span {
  display:block;
  padding:10px 16px;
  color:#65763a;
  background:#edf3d6;
  letter-spacing:1px;
  font:800 10px/1.4 Consolas,monospace;
  text-align:right;
}

/* Readable full-width questions and well-spaced answer pills */
body.tools-page .game-rebuild #missionList .mission-questions {
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  padding:0;
  counter-reset:mission-question;
}
body.tools-page .game-rebuild #missionList .mission-description {font-size:15px;line-height:1.65;color:#5c4d3c;}
body.tools-page .game-rebuild #missionList fieldset.question-block {
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  margin:0 0 12px;
  padding:19px clamp(14px,2vw,22px) 18px;
  border:1px solid #eadcc8;
  border-radius:14px;
  background:#fffefb;
  box-shadow:0 2px 7px rgba(38,25,8,.025);
  counter-increment:mission-question;
}
body.tools-page .game-rebuild #missionList .question-block legend {
  display:block;
  float:none;
  width:auto;
  max-width:100%;
  margin:0 0 15px;
  padding:0;
  color:#34271b;
  font:750 clamp(15px,1.35vw,17px)/1.5 'Segoe UI',Inter,Arial,sans-serif;
  white-space:normal;
}
body.tools-page .game-rebuild #missionList .question-block legend::before {
  content:counter(mission-question,decimal-leading-zero);
  display:inline-block;
  vertical-align:middle;
  margin-right:11px;
  padding:5px 7px;
  border-radius:6px;
  background:#fff0d9;
  color:#ac6e27;
  font:800 11px/1.2 Consolas,monospace;
}
body.tools-page .game-rebuild #missionList .question-block .choice-group {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
  gap:9px;
  width:100%;
  min-width:0;
  padding:0;
}
body.tools-page .game-rebuild #missionList .question-block .choice-group button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:normal;
  min-width:66px;
  min-height:43px;
  padding:10px 20px;
  border:1px solid #e2d3bd;
  border-radius:999px;
  background:#f8f3eb;
  color:#483a29;
  font:750 14px/1.25 'Segoe UI',Inter,Arial,sans-serif;
  box-shadow:0 2px 5px rgba(38,25,8,.025);
  transition:background .18s,border-color .18s,transform .18s,color .18s,box-shadow .18s;
}
body.tools-page .game-rebuild #missionList .question-block .choice-group button:hover {
  background:#ffead0;
  border-color:#ecaf61;
  transform:translateY(-1px);
}
body.tools-page .game-rebuild #missionList .question-block .choice-group button.selected {
  background:#ffad4d;
  border-color:#ee9835;
  color:#251407;
  box-shadow:0 3px 12px rgba(229,137,42,.19);
}
body.tools-page .game-rebuild #missionList .question-block .choice-group button.selected::before {
  content:'✓';
  font-size:13px;
  font-weight:900;
  margin-right:7px;
}
body.tools-page .game-rebuild #missionList .question-note {
  color:#866a4c;
  font-size:12px;
  line-height:1.55;
  margin:11px 0 0;
}
body.tools-page .game-rebuild #missionList .mission-disclaimer {
  margin:21px 0 0;
  padding:14px 0 0;
  border-top:1px solid #e9ddcc;
  color:#877561;
  font-size:12px;
  line-height:1.6;
}

@media(max-width:1020px) {
  body.tools-page .tool-layout.game-rebuild {display:flex;flex-direction:column;}
  body.tools-page .game-rebuild .game-left,
  body.tools-page .game-rebuild .game-right {width:100%;}
  body.tools-page .game-rebuild .game-left {position:static;}
  body.tools-page .game-rebuild .game-right {position:static;}
}
@media(max-width:650px) {
  body.tools-page .game-rebuild .mission-panel {padding:15px;border-radius:16px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-toggle {padding:12px 11px;gap:8px;min-height:76px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-thumb {width:51px;height:50px;flex-basis:51px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-code {font-size:10px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-text strong {font-size:13px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-text small {display:none;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-points {font-size:12px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-details {padding:13px 12px 20px;}
  body.tools-page .game-rebuild #missionList fieldset.question-block {padding:16px 12px 15px;}
  body.tools-page .game-rebuild #missionList .question-block legend {font-size:15px;}
  body.tools-page .game-rebuild #missionList .question-block .choice-group button {min-height:42px;min-width:57px;padding:9px 15px;font-size:13px;}
  body.tools-page .game-rebuild #missionList .mission-card .mission-figure img {max-height:360px;}
}
@media(prefers-reduced-motion:reduce){
  body.tools-page .game-rebuild #missionList .question-block .choice-group button{transition:none;}
  body.tools-page .game-rebuild #missionList .question-block .choice-group button:hover{transform:none;}
}

/* Question headings are ordinary block elements instead of browser-native fieldset legends.
   This removes the cross-through border and browser-specific legend sizing bugs. */
body.tools-page .game-rebuild #missionList .question-block .question-title {
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:0 0 15px;
  color:#34271b;
  font:750 clamp(15px,1.35vw,17px)/1.45 'Segoe UI',Inter,Arial,sans-serif;
  overflow-wrap:anywhere;
}
body.tools-page .game-rebuild #missionList .question-block .question-number {
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  min-width:30px;
  min-height:26px;
  padding:5px 7px;
  border-radius:7px;
  background:#fff0d9;
  color:#ac6e27;
  font:800 11px/1.2 Consolas,monospace;
}

/* Readable mission text, no raw browser button appearance */
body.tools-page .game-rebuild #missionList .mission-card .mission-figure {margin-bottom:20px;}
body.tools-page .game-rebuild #missionList .mission-card .mission-figure img{max-height:530px;}
body.tools-page .game-rebuild #missionList .question-block {
  display:block!important;min-width:0;max-width:100%;width:100%;
  padding:18px 20px!important;margin:0 0 12px!important;
  border:1px solid #e9dcc9!important;border-radius:14px!important;
  background:#fffdf8!important;box-sizing:border-box;
}
body.tools-page .game-rebuild #missionList .question-block .question-title {
  display:flex;align-items:flex-start;gap:12px;
  margin:0 0 14px;color:#2a2118;
  font-size:16px;font-weight:750;line-height:1.55;
  word-break:normal;overflow-wrap:break-word;
}
body.tools-page .game-rebuild #missionList .choice-group {display:flex!important;flex-flow:row wrap!important;gap:9px!important;}
body.tools-page .game-rebuild #missionList .choice-group button {
  background:#f9f1e7!important;color:#38281b!important;
  min-height:43px;min-width:60px;line-height:1.3;
  border:1px solid #dfcdb5!important;border-radius:999px!important;
  padding:10px 18px!important;white-space:normal!important;
  font-size:14px;font-weight:700;cursor:pointer;
}
body.tools-page .game-rebuild #missionList .choice-group button:hover{background:#ffe4bf!important;border-color:#eb9e47!important;}
body.tools-page .game-rebuild #missionList .choice-group button.selected {
  background:#ffa640!important;color:#261508!important;border-color:#ec8a25!important;
}
body.tools-page .game-rebuild #missionList .mission-questions{padding-top:0;}
@media(max-width:650px){
 body.tools-page .game-rebuild #missionList .question-block{padding:14px 12px!important;}
 body.tools-page .game-rebuild #missionList .question-block .question-title{font-size:15px;line-height:1.5;}
 body.tools-page .game-rebuild #missionList .choice-group button{padding:9px 13px!important;min-height:42px;}
}