/* F4.9: one vertical question flow at every width; retain F4.7 diagram viewing. */
.mind-game .game-card { display:block; }
.mind-game .question-interaction { min-width:0; display:block; position:static; max-height:none; }
.mind-game .question-response-content { overflow:visible; max-height:none; }
.mind-game .answers-heading { margin:10px 2px 6px; }
.mind-game .question-panel { position:relative; }
.mind-game .question-panel:has(.diagram-open) .question-meta { padding-right:42px; min-height:34px; }
.mind-game .diagram-open { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:36px; height:36px; padding:7px; border:1px solid var(--world-border); border-radius:10px; background:var(--world-solid); color:var(--world-accent); cursor:pointer; }
.mind-game .diagram-open svg { width:20px; height:20px; }
.mind-game .diagram-open:focus-visible { outline:3px solid var(--world-accent); outline-offset:3px; }
.mind-game .question-panel .puzzle-svg { --diagram-height:clamp(220px,calc(100dvh - 440px),320px); width:min(100%,var(--diagram-native-width,340px),calc(var(--diagram-height) * var(--diagram-ratio,1))); height:auto; max-width:100%; max-height:none; }

@media(min-width:1000px) {
  body.mind-active .shell { max-width:1080px; }
  .mind-active .topbar { max-width:760px; margin-top:8px; padding:8px 12px; }
  .mind-game { max-width:760px; margin-top:6px; }
  .mind-game-header { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:6px 16px; margin-bottom:10px; }
  .mind-game .game-top,.mind-game .game-top:first-child { min-height:44px; margin:0; }
  .mind-game .progress-track { grid-column:1/-1; }
  .mind-game .question-panel { padding:16px; border-radius:20px; }
  .mind-game .question-title { margin-top:10px; font-size:24px; line-height:1.38; }
  .mind-game .question-title.question-long { font-size:21px; line-height:1.42; }
  .mind-game .graphic-puzzle { margin-top:10px; padding:6px; }
  .mind-game .question-panel .puzzle-svg { --diagram-height:clamp(260px,calc(100dvh - 600px),336px); }
  .mind-game .answers-heading { margin:8px 2px 6px; }
  .mind-game .answers { gap:8px; }
  .mind-game .answer { display:grid; grid-template-columns:22px minmax(0,1fr); align-items:center; gap:8px; min-height:60px; padding:8px 10px; font-size:16px; }
  .mind-game .answer-label { position:static; }
  .mind-game .answer.answer-short { font-size:24px; }
  .mind-game .answer.answer-long { font-size:16px; }
  .mind-game .answer.visual-answer { min-height:96px; padding:8px; }
  .mind-game .choice-svg { width:80px; height:auto; margin:auto; }
  .mind-game .hint-card { margin-top:10px; padding:10px 12px; grid-template-columns:28px minmax(0,1fr) minmax(180px,220px); align-items:center; gap:8px; }
  .mind-game .hint-action { grid-column:3; grid-row:1; }
  .mind-game .hint-bulb { width:28px; height:28px; }
  .mind-game .hint-bulb .icon { width:20px; height:20px; }
  .mind-game .hint-heading h2 { font-size:13px; }
  .mind-game .hint-copy p { margin-top:3px; }
  .mind-game .hint-card button { min-height:44px; padding:9px 12px; }
  .mind-game .feedback { margin-top:10px; padding:10px 12px; gap:8px; line-height:1.5; }
  .mind-game .feedback strong { margin-bottom:3px; font-size:14px; }
  .mind-game .mind-bottom { position:static; margin-top:10px; gap:6px; }
  .mind-game #next { min-height:48px; padding:10px 14px; }
}
@media(max-width:375px) {
  .mind-game .answers:not(.visual-answers):has(.answer-long) { grid-template-columns:1fr; }
  body[data-platform='telegram'] .mind-game .answers:not(.visual-answers):has(.answer-long) { grid-template-columns:1fr; }
}

/* Tablets get the existing mobile model: one scrollport plus a reserved action row. */
@media(min-width:701px) and (max-width:999px) {
  body[data-platform='telegram'].mind-active .topbar,body[data-platform='telegram'].mind-active .footer { display:none; }
  body[data-platform='telegram'].mind-active .shell { height:min(100dvh,var(--iq-tg-height,100dvh)); min-height:0; padding-top:max(8px,var(--iq-tg-inset-top,0px)); padding-bottom:0; }
  body[data-platform='telegram'].mind-active #app { display:flex; flex-direction:column; min-height:0; }
  body[data-platform='telegram'] .mind-game { --question-bottom-safe:max(8px,env(safe-area-inset-bottom,0px),var(--iq-tg-inset-bottom,0px)); flex:1; min-height:0; margin:0; display:flex; flex-direction:column; }
  body[data-platform='telegram'] .mind-game[data-answered='true'] { padding-bottom:calc(80px + var(--question-bottom-safe)); }
  body[data-platform='telegram'] .mind-game-header { flex:none; margin-bottom:10px; display:grid; grid-template-columns:1fr 1fr; gap:6px; }
  body[data-platform='telegram'] .mind-game .game-top { margin:0; min-height:44px; }
  body[data-platform='telegram'] .mind-game .progress-track { grid-column:1/-1; }
  body[data-platform='telegram'] .mind-game .game-card { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding-bottom:var(--question-bottom-safe); }
  body[data-platform='telegram'] .mind-game .mind-bottom { position:fixed; z-index:30; left:0; right:0; bottom:max(0px,calc(100dvh - var(--iq-tg-height,100dvh))); margin:0; gap:6px; padding:8px 28px var(--question-bottom-safe); background:var(--world-solid); border-top:1px solid var(--world-border); }
  body[data-platform='telegram'] .mind-game #next { min-height:48px; max-width:760px; margin:auto; padding:10px; }
}
@media(max-width:700px) {
  .mind-game .question-panel:has(.diagram-open) .question-meta { min-height:44px; padding-right:44px; }
  .mind-game .diagram-open { width:44px; height:44px; top:8px; right:8px; }
  body[data-platform='telegram'] .mind-game .question-panel .puzzle-svg { --diagram-height:clamp(156px,27dvh,228px); width:min(100%,var(--diagram-native-width,340px),calc(var(--diagram-height) * var(--diagram-ratio,1))); height:auto; max-height:none; }
}

.question-diagram-dialog { box-sizing:border-box; width:min(960px,calc(100% - 24px)); max-height:calc(100dvh - 24px); padding:18px; border:1px solid var(--world-border,#d8deec); border-radius:20px; color:var(--world-text,#17213b); background:var(--world-solid,#fff); box-shadow:0 20px 70px #17213b40; }
.question-diagram-dialog::backdrop { background:#17213b90; }
.diagram-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.diagram-heading h2 { margin:0; font-size:19px; }
.question-diagram-dialog button { min-height:44px; padding:8px 12px; border:1px solid var(--world-border,#d8deec); border-radius:10px; background:var(--world-tint,#eef0fb); color:var(--world-text,#17213b); font:inherit; font-size:13px; cursor:pointer; }
.diagram-caption { font-size:14px; line-height:1.5; }
.diagram-tools { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
.diagram-tools span { font-size:12px; color:var(--world-muted,#60728a); }
.diagram-scroll { max-height:calc(100dvh - 220px); overflow:auto; overscroll-behavior:contain; background:#fff; border:1px solid #dce2f1; border-radius:12px; }
.diagram-scroll .diagram-svg { display:block; width:100%; height:auto; max-width:none; color:#253653; font-family:inherit; }
.question-diagram-dialog.is-enlarged .diagram-svg { width:200%; }
@media(prefers-reduced-motion:reduce) { .question-diagram-dialog { scroll-behavior:auto; } }