/* La escala de escritorio amplía componentes reales, sin zoom ni transformaciones globales. */
body.game-screen main { padding-top: 10px; }
body.game-screen main :is(.btn, select, .file-btn), body.game-screen .sound-toggle { min-height: 44px; font-size: 14px; }
body.game-screen :is(.learning-hero, .memo-hero, .hab-hero, .sudoku-hero, .sopa-hero, .ahorcado-hero, .letra-hero, .dado-hero) { padding: 12px 8px 8px; }
body.game-screen :is(.learning-hero, .memo-hero, .hab-hero, .sudoku-hero, .sopa-hero, .ahorcado-hero, .letra-hero, .dado-hero) h2 { font-size: clamp(24px, 3vw, 30px); line-height: 1.2; margin-bottom: 6px; }
body.game-screen :is(.learning-hero, .memo-hero, .hab-hero, .sudoku-hero, .sopa-hero, .ahorcado-hero, .letra-hero, .dado-hero) p { line-height: 1.45; }
body.game-screen :is(.memo-controls, .hab-controls, .sudoku-controls, .sopa-controls, .ahorcado-controls, .dado-controls) { padding: 8px 8px 12px; gap: 10px; }
body.game-screen :is(.memo-page, .hab-page) { padding-bottom: 20px; }
body.game-screen .memo-page { max-width: 1040px; }
body.game-screen .hab-page { max-width: 1120px; }
.memo-page:has(.memo-card) .memo-hero p, .hab-page:has(.pool-animal) .hab-hero p,
.sudoku-page:has(#sdkGrid:not(:empty)) .sudoku-hero p, .sopa-page:has(#wsGrid:not(:empty)) .sopa-hero p { display: none; }
body.game-screen .memo-stats { gap: 18px; padding-bottom: 12px; }
body.game-screen .memo-grid { padding: 0 4px; gap: 8px; }
body.game-screen .memo-grid.cols-4 { max-width: min(680px, max(320px, calc((100svh - 390px) * 4 / 3))); }
body.game-screen .memo-grid.cols-6 { max-width: min(920px, max(384px, calc((100svh - 390px) * 6 / 3))); }
body.game-screen .memo-grid.cols-6:has(> :nth-child(19)) { max-width: min(920px, max(384px, calc((100svh - 390px) * 6 / 4))); }
body.game-screen .memo-card-reveal .card-name { font-size: clamp(10px, 1.1vw, 13px); }
body.game-screen .memo-card:is([data-category="food"],[data-category="clothing"],[data-category="sport"]) .memo-card-reveal img { object-fit: contain; padding: 5px; background: #fff7ec; }
@media (max-width:600px) {
  body[data-learning] .learning-controls:has(:is(#gameTheme,#gameExercise)) label { flex-direction:column; align-items:flex-start; gap:3px; font-size:12px; }
  body[data-learning] .learning-controls:has(:is(#gameTheme,#gameExercise)) { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr) auto; align-items:end; gap:8px; }
  body[data-learning] .learning-controls:has(:is(#gameTheme,#gameExercise)) :is(label,select) { width:100%; min-width:0; }
  body[data-learning] .learning-controls:has(:is(#gameTheme,#gameExercise)) #gameStart { padding:5px 7px; font-size:13px; }
  body[data-learning="series"] .series-grid:has(> :nth-child(10)) { grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; }
  body[data-learning="series"] .series-grid:has(> :nth-child(10)) .series-tile { padding:4px; }
  body[data-learning="series"] .series-grid:has(> :nth-child(10)) img { height:48px; }
  body[data-learning="series"] .series-grid:has(> :nth-child(10)) .question-mark { line-height:48px; font-size:36px; }
}
body.game-screen .memo-theme-help { grid-column: 1 / -1; text-align: center; color: var(--muted); font-size: 13px; line-height: 1.5; margin: 0 8px 12px; }
body.game-screen .pool-animal { width: 96px; }
body.game-screen .pool-animal img { width: 76px; height: 76px; }
.hab-card { min-width:0; display:flex; flex-direction:column; gap:6px; }
.hab-zone { position:relative; isolation:isolate; overflow:hidden; flex:1; }
.hab-zone .hab-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.88; z-index:-1; pointer-events:none; }
.hab-card > .zone-header { color:#f5f7fb; min-height:40px; gap:5px; font-size:clamp(13px,1.7vw,18px); line-height:1.2; padding:0 3px; }
.hab-card > .zone-header .zone-count { color:#b7d5e4; flex-shrink:0; }
.hab-card > .zone-header .zone-icon { font-size:20px; flex-shrink:0; }
.hab-zone .zone-animals { position:relative; }
.hab-zone { --hab-thumb:56px; }
.zone-slot { width:var(--hab-thumb); height:var(--hab-thumb); flex-shrink:0; }
.hab-zone .zone-slot .zone-animal-thumb { width:100%; height:100%; }
@media(max-width:600px) { .hab-zone { --hab-thumb:44px; } }
body.game-screen .pool-animal-name { font-size: 12px; max-width: 84px; }
body.game-screen .zone-animal-thumb { width: 56px; height: 56px; }

body[data-learning] .learning-page { max-width: 1080px; padding: 8px 0 20px; }
body[data-learning] .learning-hero { padding: 4px 0; margin-bottom: 12px; }
body[data-learning] .learning-eyebrow { font-size: 11px; letter-spacing: .08em; margin-bottom: 6px; }
body[data-learning] .learning-page:has(#challengePanel:not([hidden])) .learning-eyebrow,
body[data-learning] .learning-page:has(#challengePanel:not([hidden])) .learning-hero > p:last-child { display: none; }
body[data-learning] .learning-page:has(#challengePanel:not([hidden])) .learning-hero { display: none; }
body[data-learning] .level-help { min-height: 0; margin: 8px auto; font-size: 14px; }
body[data-learning] .game-progress { margin: 8px 0; font-size: 14px; }
body[data-learning] .challenge-panel { padding: 22px; }
body[data-learning] .game-prompt { font-size: clamp(22px, 3vw, 28px); margin-bottom: 16px; }
body[data-learning] .game-board { gap: 14px; }
body[data-learning] .game-choices { margin-top: 16px; }
body[data-learning] .game-feedback { min-height: 36px; padding-top: 12px; }
body[data-learning] .game-feedback:empty { min-height: 0; padding-top: 0; }
body[data-learning] .learning-note { margin-top: 12px; }
body[data-learning] #gameActions > .btn { display: block; margin: 14px auto 0; }
body[data-learning] .target-animal img { width: 56px; height: 56px; }
body[data-learning] .animal-grid { max-width: 620px; }
body[data-learning] .number-answer { font-size: 36px; min-width: 76px; min-height: 64px; }
body[data-learning] .series-tile img { max-width: 100px; height: 88px; }
body[data-learning] .animal-answer { width: 112px; min-height: 120px; }
body[data-learning] .animal-answer img { width: 80px; height: 80px; }
body[data-learning] .word-picture { width: 176px; height: 132px; }
body[data-learning] :is(.word-slot, .letter-tile) { min-width: 56px; min-height: 56px; font-size: 24px; }
body[data-learning] .quantity-group { max-width: 252px; }
body[data-learning] .math-visual:not(.math-visual-sum) .quantity-group { width: min(100%, 216px); }
body[data-learning] .quantity-number { font-size: 42px; }
body[data-learning] .path-grid { width: min(100%, 300px); }
body[data-learning] .market-product > img { height: 136px; }
body[data-learning] .market-product h4 { font-size: 17px; }
body[data-learning] .market-product { padding: 10px; }
body[data-learning] .market-list img { width: 40px; height: 40px; }
body[data-learning="path"] .learning-controls { align-items: flex-end; gap: 10px; }
body[data-learning="path"] .learning-controls label { flex-direction: column; align-items: flex-start; gap: 2px; font-size: 12px; }

@media (min-width: 760px) {
  body[data-learning] .learning-page { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 24px; align-content: start; }
  body[data-learning] .learning-hero { grid-column: 1; grid-row: 1; text-align: left; margin: 0; max-width: none; }
  body[data-learning] .learning-controls { grid-column: 2; grid-row: 1; align-self: center; }
  body[data-learning] :is(.level-help, .game-progress, .game-intro, .challenge-panel, .learning-note) { grid-column: 1 / -1; }
  body[data-learning] .level-help { width: 100%; text-align: left; padding: 0; }
  body[data-learning] .game-progress { text-align: left; }
  body[data-learning="market"] .market-shelf:not(:has(> :nth-child(5))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
  body[data-learning]:where(:not([data-learning="market"])) .challenge-panel { display: grid; grid-template-columns: minmax(0, 1fr) 240px; column-gap: 24px; align-items: center; }
  body[data-learning]:where(:not([data-learning="market"])) .game-prompt { grid-column: 1 / -1; }
  body[data-learning]:where(:not([data-learning="market"])) .game-board { grid-column: 1; grid-row: 2; }
  body[data-learning]:where(:not([data-learning="market"])) .game-choices { grid-column: 2; grid-row: 2; align-content: center; margin: 0; }
  body[data-learning]:where(:not([data-learning="market"])) :is(#gameActions, .game-feedback, .game-next) { grid-column: 1 / -1; }
  body[data-learning="compare"] .game-choices { flex-direction: column; align-items: stretch; }
  body[data-learning="compare"] .relation-answer { flex-direction: row; justify-content: center; gap: 12px; font-size: 15px; }
  body[data-learning="path"] .challenge-panel { grid-template-columns: minmax(0, 1fr) 340px; }
  body[data-learning="path"] .game-board { grid-row: 2 / 4; }
  body[data-learning="path"] .game-choices { align-self: end; }
  body[data-learning="path"] #gameActions { grid-column: 2; grid-row: 3; align-self: start; }
  body[data-learning="path"] .path-grid { width: min(100%, 360px); }
  body[data-learning="market"] .game-board { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 12px 24px; align-items: start; grid-template-areas: 'title shelf' 'list shelf' 'basket shelf'; grid-template-rows: auto auto 1fr; }
  body[data-learning="market"] .game-board.market-checkout { display: flex; align-items: center; }
  body[data-learning="market"] .market-list-title { grid-area: title; }
  body[data-learning="market"] .market-list { grid-area: list; }
  body[data-learning="market"] .market-shelf { grid-area: shelf; }
  body[data-learning="market"] .market-basket { grid-area: basket; text-align: left; }
  body[data-learning="market"] .market-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-learning="market"] .market-product { display: grid; grid-template-columns: 128px minmax(0, 1fr); grid-template-areas: 'image name' 'image price' 'image controls'; gap: 6px 10px; text-align: center; }
  body[data-learning="market"] .market-product > img { grid-area: image; width: 128px; height: 136px; }
  body[data-learning="market"] .market-product h4 { grid-area: name; }
  body[data-learning="market"] .market-price { grid-area: price; }
  body[data-learning="market"] .market-quantity-controls { grid-area: controls; justify-content: center; }
  body.game-screen .hab-zones { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body.game-screen .hab-zone { min-height: 128px; }
  body.game-screen :is(.memo-page, .hab-page) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: start; }
  body.game-screen :is(.memo-hero, .hab-hero) { grid-column: 1; grid-row: 1; text-align: left; }
  body.game-screen :is(.memo-controls, .hab-controls) { grid-column: 2; grid-row: 1; align-self: center; padding-bottom: 8px; }
  body.game-screen :is(.memo-stats, .memo-grid, .memo-win, .hab-stats, .hab-zones, .hab-page > .hint, .hab-instruction, .hab-pool-wrap, .hab-win) { grid-column: 1 / -1; justify-self: center; }
}
@media (max-width: 759px) {
  body[data-learning] .learning-hero h2 { font-size: 24px; }
  body[data-learning] .learning-page:has(#challengePanel:not([hidden])) .learning-hero { margin-bottom: 8px; }
  body[data-learning] .challenge-panel { padding: 16px 10px; }
  body[data-learning] .number-answer { font-size: 32px; min-width: 58px; min-height: 58px; }
  body[data-learning] .animal-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  body[data-learning] .series-tile img { height: 68px; }
  body[data-learning] .animal-answer { width: calc(50% - 8px); min-height: 116px; }
  body[data-learning] .word-picture { width: 144px; height: 108px; }
  body[data-learning] .word-slot { min-width: 48px; padding: 8px; }
  body[data-learning] .market-product { padding: 6px 4px; }
  body[data-learning] .market-product > img { height: 100px; }
  body[data-learning] .market-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  body[data-learning] .market-list li { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 3px 6px; font-size: 13px; }
  body[data-learning] .market-list img { width: 30px; height: 30px; grid-row: span 2; }
  body[data-learning] .market-list-count { grid-column: 2; margin: 0; }
  body.game-screen .memo-grid.cols-4, body.game-screen .memo-grid.cols-6, body.game-screen .memo-grid.cols-6:has(> :nth-child(19)) { max-width: 100%; }
  body.game-screen :is(.memo-controls, .hab-controls) .control-group { flex-shrink: 1; min-width: 0; }
  body.game-screen :is(.memo-controls, .hab-controls) select { max-width: 124px; }
  body.game-screen .hab-zones { padding-inline: 0; }
  body.game-screen .hab-zone { min-height: 120px; padding: 8px; }
  body.game-screen .zone-animal-thumb { width: 44px; height: 44px; }
  body.game-screen .hab-pool-wrap { padding-inline: 0; }
  body.game-screen .hab-pool { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  body.game-screen .pool-animal { width: auto; min-width: 0; padding: 4px; }
  body.game-screen .pool-animal img { width: 100%; max-width: 64px; height: auto; aspect-ratio: 1; }
  body.game-screen .pool-animal-name { font-size: 11px; max-width: 100%; }
}
@media (max-width: 759px) and (max-height: 700px) {
  body[data-learning="path"] .path-grid { width: min(100%, 264px); }
}
/* Los nuevos juegos mantienen las ilustraciones grandes sin alargar las filas. */
body[data-learning="missing"] .challenge-panel { display: flex; flex-direction: column; align-items: stretch; }
body[data-learning="missing"] .game-choices { align-self: center; }
body[data-learning="missing"] .missing-answer-area { border: 2px solid var(--learning-accent); border-radius: 18px; background: var(--learning-soft); padding: 12px; margin-top: 24px; display: flex; flex-direction: column; align-items: stretch; }
body[data-learning="missing"] .missing-answer-area h4 { text-align: center; color: var(--learning-accent); font-size: 20px; line-height: 1.4; }
body[data-learning="missing"] .missing-answer-area .picture-choice { border-color: var(--learning-accent); border-width: 3px; }
body[data-learning="missing"] .missing-scene-title { color: var(--muted); font-size: 14px; font-weight: 600; text-align: center; }
body[data-learning="missing"] .missing-scene[data-phase="answer"] { max-width: 520px; }
body[data-learning="missing"] .missing-scene[data-phase="answer"] .missing-tile { font-size: 11px; background: #e0e5e8; }
body[data-learning="missing"] .missing-scene[data-phase="answer"] img { height: 72px; }
@media (min-width: 1000px) {
  body[data-learning="missing"] .missing-choices { grid-template-columns: repeat(6, minmax(0, 1fr)); margin-top: 16px; }
  body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(5))) { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 760px; }
  body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 600px; }
  body[data-learning="missing"] .missing-scene:has(> :nth-child(7)) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body[data-learning="detective"] .challenge-panel { grid-template-columns: minmax(0, 1fr) minmax(0, 520px); }
  body[data-learning="detective"] .detective-choices:has(> :nth-child(4)):not(:has(> :nth-child(5))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-learning="shadow"] .challenge-panel { grid-template-columns: minmax(0, 1fr) minmax(0, 520px); }
  body[data-learning="shadow"] .shadow-picture { width: 240px; height: 240px; padding: 32px; }
  body[data-learning="shadow"] .shadow-choices:has(> :nth-child(4)):not(:has(> :nth-child(5))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-learning="intruder"] .challenge-panel,
  body[data-learning="share"] .challenge-panel { display: flex; flex-direction: column; align-items: stretch; }
  body[data-learning="intruder"] .game-choices { margin-top: 12px; }
  body[data-learning="intruder"] .picture-choice img { height: 140px; }
  body[data-learning="intruder"] .intruder-choices { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  body[data-learning="intruder"] .intruder-choices:not(:has(> :nth-child(5))) { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 760px; align-self: center; }
  body[data-learning="intruder"] .intruder-choices:not(:has(> :nth-child(4))) { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 600px; }
  body[data-learning="share"] .sharing-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  body[data-learning="share"] .sharing-grid:not(:has(> :nth-child(3))) { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 600px; }
}
@media (max-width: 759px) {
  body:is([data-learning="missing"], [data-learning="detective"]) .game-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:is([data-learning="missing"], [data-learning="detective"]) .game-choices:not(:has(> :nth-child(4))) > :last-child { grid-column: 1 / -1; width: calc(50% - 5px); justify-self: center; }
  body[data-learning="missing"] .missing-tile img { height: 76px; }
  body[data-learning="missing"] .missing-tile { padding: 5px 2px; font-size: 12px; }
  body[data-learning="missing"] .missing-scene[data-phase="answer"] img { height: 56px; }
  body[data-learning="missing"] .missing-answer-area { padding: 10px 8px; }
  body[data-learning="detective"] .detective-clue { padding: 8px 10px; font-size: 16px; }
  body[data-learning="shadow"] .game-prompt { margin-bottom: 8px; }
  body[data-learning="shadow"] .game-board {
    display: grid; grid-template-columns: 112px minmax(0, 1fr);
    justify-items: center; gap: 8px;
  }
  body[data-learning="shadow"] .shadow-clue { grid-column: 1 / -1; }
  body[data-learning="shadow"] .game-choices { margin-top: 10px; }
  body[data-learning="shadow"] .shadow-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  body[data-learning="shadow"] .shadow-choices:has(> :nth-child(4)):not(:has(> :nth-child(5))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-learning="shadow"] .picture-choice { padding: 5px; }
  body[data-learning="shadow"] .picture-choice img { height: 64px; }
  body[data-learning="intruder"] .intruder-choices { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
  body[data-learning="intruder"] .intruder-choices:has(> :nth-child(4)):not(:has(> :nth-child(5))) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-learning="intruder"] .picture-choice { padding: 5px; }
  body[data-learning="intruder"] .picture-choice img { height: 66px; }
  body[data-learning="shadow"] .shadow-picture { width: 112px; height: 112px; padding: 18px; }
  body[data-learning="share"] .sharing-controls { gap: 3px; }
  body[data-learning="share"] .sharing-card { padding-inline: 4px; }
}
@media (max-width: 420px) {
  body[data-learning="share"] .learning-page:has(#challengePanel:not([hidden])) .level-help { display: none; }
  body[data-learning="share"] #gameActions > .btn { margin: 0; }
}
@media (max-width: 360px) {
  body[data-learning="shadow"] .challenge-panel { padding: 12px; }
  body[data-learning="shadow"] .game-board { grid-template-columns: 100px minmax(0, 1fr); }
  body[data-learning="shadow"] .shadow-picture { width: 100px; height: 100px; padding: 15px; }
  body[data-learning="shadow"] .game-prompt { font-size: 20px; margin-bottom: 6px; }
  body[data-learning="shadow"] .picture-choice { font-size: 12px; gap: 4px; }
  body[data-learning="shadow"] .picture-choice img { height: 54px; }
  body[data-learning="share"] .sharing-controls { gap: 2px; }
  body[data-learning="share"] .sharing-count { min-width: 28px; }
}

/* La escena y las respuestas conservan su sitio al pasar de observar a elegir. */
body[data-learning="missing"] .challenge-panel { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; padding:12px; }
body[data-learning="missing"] .game-prompt { grid-column:1 / -1; font-size:22px; margin:0; }
body[data-learning="missing"] .game-board { grid-column:1; grid-row:auto; gap:6px; }
body[data-learning="missing"] .missing-scene { grid-template-columns:repeat(3,minmax(0,1fr)); max-width:520px; gap:6px; }
body[data-learning="missing"] .missing-scene:has(> :nth-child(7)) { grid-template-columns:repeat(4,minmax(0,1fr)); }
body[data-learning="missing"] .missing-scene .missing-tile { height:100px; padding:4px; font-size:12px; gap:2px; background:#fff7ec; }
body[data-learning="missing"] .missing-scene .missing-tile img { height:70px; }
body[data-learning="missing"] .missing-placeholder > span { font-size:40px; color:#426b70; }
body[data-learning="missing"] .missing-scene-title { min-height:22px; margin:0; }
body[data-learning="missing"] .missing-answer-area { grid-column:1; grid-row:auto; margin:0; padding:8px; gap:6px; }
body[data-learning="missing"] .missing-answer-area h4 { margin:0; min-height:24px; line-height:24px; font-size:17px; }
body[data-learning="missing"] .missing-choices,
body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(4))),
body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(5))) { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; max-width:none; margin:0; gap:6px; }
body[data-learning="missing"] .missing-choices > :last-child { grid-column:auto; width:100%; }
body[data-learning="missing"] .missing-choices .picture-choice,
body[data-learning="missing"] .missing-choice-placeholder { height:134px; min-height:134px; box-sizing:border-box; padding:4px; gap:4px; border:3px solid var(--learning-accent); border-radius:14px; font-size:12px; line-height:16px; }
body[data-learning="missing"] .missing-choices .picture-choice img { height:96px; flex-shrink:0; }
body[data-learning="missing"] .missing-choice-placeholder { display:grid; place-items:center; font-size:32px; color:#738797; border-style:dashed; background:#20374a; }
body[data-learning="missing"] #gameActions { grid-row:2; grid-column:1 / -1; display:flex; justify-content:center; }
body[data-learning="missing"] #gameActions > .btn { width:230px; margin:0; }
body[data-learning="missing"] :is(.game-feedback,.game-next) { grid-column:1 / -1; margin:0 auto; }
@media(min-width:760px) {
  body[data-learning="missing"] .challenge-panel { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px 24px; align-items:start; }
  body[data-learning="missing"] .game-board { grid-column:1; grid-row:3; }
  body[data-learning="missing"] .missing-answer-area { grid-column:2; grid-row:3; }
}
@media(max-width:759px) {
  body[data-learning="missing"] .missing-scene .missing-tile { height:72px; font-size:10px; padding:3px 1px; }
  body[data-learning="missing"] .missing-scene .missing-tile img { height:48px; }
  body[data-learning="missing"] .missing-choices .picture-choice,
  body[data-learning="missing"] .missing-choice-placeholder { height:106px; min-height:106px; font-size:11px; }
  body[data-learning="missing"] .missing-choices .picture-choice img { height:68px; }
  body[data-learning="missing"] .missing-answer-area { padding:6px; }
  body[data-learning="missing"] .game-prompt { font-size:20px; }
}
.recognition-picture { width:min(100%,300px); height:200px; object-fit:contain; background:#fff7ec; border-radius:16px; }
/* Los SVG del catálogo son 4:3: el marco sigue la bandera, sin bandas de color
   que puedan confundirse con sus franjas ni esquinas que recorten sus símbolos. */
body[data-learning="flags"] .recognition-picture { width:min(100%,280px); height:auto; aspect-ratio:4/3; background:transparent; border-radius:0; outline:1px solid #aab8ce; outline-offset:0; box-shadow:0 4px 12px #0003; }
.recognition-choices { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; width:100%; }
.recognition-choice { min-width:0; min-height:52px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; }
.recognition-choice img { width:100%; height:84px; object-fit:contain; background:#fff7ec; border-radius:10px; }
body[data-learning="sports"] .challenge-panel:has(.recognition-choice img) { display:flex; flex-direction:column; align-items:stretch; }
body[data-learning="sports"] .recognition-choices:has(img) { grid-template-columns:repeat(3,minmax(0,1fr)); max-width:760px; margin-inline:auto; }
body[data-learning="match"] .challenge-panel { display:block; }
.match-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:72px; width:100%; max-width:720px; position:relative; }
.match-column { display:grid; grid-auto-rows:100px; gap:8px; }
.match-column button { min-width:0; padding:4px; }
.match-pictures { display:flex; flex-wrap:wrap; justify-content:center; align-content:center; gap:2px; width:100%; }
.match-pictures img { width:64px; height:64px; object-fit:contain; border-radius:8px; background:#fff7ec; }
.match-pictures:has(> :nth-child(2)) img { width:32px; height:32px; }
.match-label { font-size:24px; }
.match-name { font-size:20px; }
.match-words .match-name, .match-jobs .match-name { overflow-wrap:anywhere; }
.match-jobs .match-column { grid-auto-rows:100px; }
.match-image[aria-pressed="true"] { outline:3px solid #ffd166; outline-offset:1px; }
.match-column .matched { border-color:#89e3cc; background:#28594e; opacity:.75; }
.match-column button { position:relative; }
.match-column .matched { border-color:var(--pair-color); }
.match-connections { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
.match-badge { position:absolute; top:3px; left:3px; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--pair-color); color:#102438; font-size:12px; font-weight:900; }
body.game-screen:has(#challengePanel:not([hidden])) footer,
body[data-learning] .learning-page:has(#challengePanel:not([hidden])) .learning-note,
body[data-learning="missing"] .learning-page:has(#challengePanel:not([hidden])) .level-help { display:none; }
body[data-learning="missing"] .game-board #gameActions { grid-column:auto; grid-row:auto; width:100%; }
body[data-learning="missing"] .game-board #gameActions > .btn { margin:0; width:100%; max-width:230px; min-height:56px; height:56px; white-space:normal; }
/* El mensaje completo sigue anunciándose; su resumen visible ocupa el título de la escena. */
body[data-learning="missing"] .game-feedback { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); padding:0; margin:0; }
body[data-learning="missing"]:has(.game-feedback.error) .missing-scene-title { color:#ffabab; }
body[data-learning="missing"]:has(.game-feedback.success,.game-feedback.victory) .missing-scene-title { color:var(--learning-accent); }
@media(min-width:760px) {
  body[data-learning="missing"] .game-board, body[data-learning="missing"] .missing-answer-area { grid-row:2; }
}
@media(max-width:759px) {
  body[data-learning="missing"] .challenge-panel { grid-template-columns:minmax(0,.42fr) minmax(0,.58fr); gap:10px; padding:10px 6px; align-items:start; }
  body[data-learning="missing"] .game-prompt { display:none; }
  body[data-learning="missing"] .game-board { grid-column:1; grid-row:1; min-width:0; }
  body[data-learning="missing"] .missing-answer-area { grid-column:2; grid-row:1; min-width:0; padding:6px 4px; }
  body[data-learning="missing"] .missing-answer-area h4 { font-size:14px; line-height:20px; min-height:20px; }
  body[data-learning="missing"] .missing-scene,body[data-learning="missing"] .missing-scene:has(> :nth-child(7)) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
  body[data-learning="missing"] .missing-scene .missing-tile { height:64px; font-size:9px; }
  body[data-learning="missing"] .missing-scene .missing-tile img { height:40px; }
  body[data-learning="missing"] .missing-scene-title { font-size:11px; line-height:16px; min-height:32px; display:grid; place-items:center; }
  body[data-learning="missing"] .missing-choices,
  body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(4))),
  body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(5))) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
  body[data-learning="missing"] .missing-choices .picture-choice,
  body[data-learning="missing"] .missing-choice-placeholder { height:106px; min-height:106px; font-size:10px; line-height:14px; padding:3px; gap:3px; }
  body[data-learning="missing"] .missing-choices .picture-choice img { height:56px; }
  body[data-learning="missing"] .missing-choices:not(:has(> :nth-child(4))) > :last-child { grid-column:auto; width:100%; }
  body[data-learning="missing"] .game-board #gameActions > .btn { font-size:11px; line-height:16px; padding:4px; }
  .recognition-picture { height:140px; }
  body[data-learning="flags"] .recognition-picture { width:min(100%,192px); }
  .recognition-choice { font-size:14px; }
  body[data-learning="sports"] .recognition-choice:has(img) { font-size:12px; padding:5px; }
  body[data-learning="sports"] .recognition-choice img { height:64px; }
  .match-grid { gap:40px; }
  .match-column { grid-auto-rows:72px; gap:6px; }
  .match-words:has(.match-word-copy small) .match-column { grid-auto-rows:minmax(90px,auto); }
  .match-jobs .match-column { grid-auto-rows:94px; }
  .match-jobs :is(.match-image, .match-label) img { width:48px; height:48px; }
  body[data-learning="match"] .learning-page:has(#challengePanel:not([hidden])) .level-help { display:none; }
  .match-pictures img { width:58px; height:58px; }
  .match-pictures:has(> :nth-child(2)) img { width:22px; height:22px; }
  .match-label { font-size:22px; }
  .match-column .match-name { font-size:14px; }
}

.match-label img { width:100%; max-width:110px; height:70px; object-fit:contain; background:#fff7ec; border-radius:8px; }
@media(max-width:600px) { .match-label img { max-width:64px; height:54px; } }
@media (min-width: 1000px) {
  .match-grid.match-jobs {
    --job-row: clamp(110px, calc((100svh - 280px) / 5), 152px);
    max-width: 1140px; gap: clamp(76px, 8vw, 120px);
  }
  .match-jobs .match-column { grid-auto-rows: var(--job-row); }
  .match-jobs .match-column button:has(.match-job-title) {
    grid-template-columns: calc(var(--job-row) - 14px) minmax(0,1fr);
    align-items: center; gap: clamp(10px, 2vw, 24px); padding: 6px 12px;
  }
  .match-jobs .match-column :is(.match-image, .match-label) img {
    display: block; width: calc(var(--job-row) - 14px); height: calc(var(--job-row) - 14px);
    max-width: none; border-radius: 10px;
  }
  .match-jobs .match-job-title {
    justify-self: start; font-size: clamp(18px, 1.7vw, 25px); line-height: 1.2; text-align: left;
  }
}
.puzzle-controls {
  display: grid; gap: 8px; padding: 10px; margin-bottom: 8px;
  border: 1px solid #394961; border-radius: 12px; background: #172339;
}
.puzzle-controls .puzzle-setup { align-items: end; }
.puzzle-controls .control-group { display: grid; }
.puzzle-controls .puzzle-downloads { align-items: center; }
.puzzle-controls .puzzle-downloads .btn { color: #c6d9f5; }
.puzzle-screen header .header-controls { flex: 0 1 auto; width: auto; margin-left: auto; }
.puzzle-help { margin-bottom: 8px; border: 1px solid #394961; border-radius: 12px; }
.puzzle-help summary { min-height: 44px; padding: 11px; font-weight: 700; cursor: pointer; }
.puzzle-help .hint { margin: 0 10px 8px; }
.puzzle-screen #canvas:not(.is-playable) { touch-action: pan-y; }
@media (min-width: 1100px) {
  .puzzle-controls { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; }
}
@media (max-width: 640px) {
  .puzzle-setup { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .puzzle-setup :is(#shuffle, #reset):disabled { display: none; }
  .puzzle-setup select { width: 100%; min-width: 0; }
  .puzzle-setup .file-btn { justify-content: center; padding-inline: 6px; }
  body.puzzle-screen main .puzzle-downloads .btn { font-size: 12px; padding-inline: 7px; }
}