/* Keep classroom controls reachable while preserving readable activity surfaces. */
body[data-app] .mini-item{border:1px solid #d5e2d9;border-radius:12px;background:#fff;padding:5px;font:inherit;color:inherit}
body[data-app] .topbar{flex-shrink:0}
@media(min-width:1100px) and (min-height:680px){
 body[data-app] .app-shell{height:100dvh;min-height:680px;display:flex;flex-direction:column}
 body[data-app] .topbar{min-height:74px;padding:10px 22px}
 body[data-app] .brand h1{font-size:28px}
 body[data-app] .brand-icon{width:48px;height:48px;font-size:30px}
 body[data-app] .workspace{min-height:0;flex:1;display:flex;flex-direction:column;gap:12px;padding:12px 22px;margin:0 auto;width:100%;overflow:auto}
 body[data-app] .instruction-card,body[data-app] .mission-card{flex-shrink:0;padding:12px 18px;margin-bottom:0}
 body[data-app] .mission-copy h2,body[data-app] .mission-row h2{font-size:26px;margin:4px 0}
 body[data-app] .mission-copy p{font-size:16px}
 body[data-app] .mission-copy .eyebrow{display:none}
 body[data-app] .mode-tabs{flex-shrink:0;gap:10px}
 body[data-app] .mode-tab{min-height:54px;padding:9px 15px}
 body[data-app] .mode-tab small{font-size:14px}
 body[data-app] .feedback{flex-shrink:0;margin-top:0;min-height:48px;padding:9px 14px}
 body[data-app] .bottom-dock{flex-shrink:0;padding:9px 22px;gap:16px}
 body[data-app] footer{flex-shrink:0;padding:6px 12px;font-size:14px}
 body[data-app="taman-kelompok-ceria"] .play-zone{min-height:360px;grid-template-columns:minmax(320px,.8fr) minmax(560px,1.4fr);gap:14px}
 body[data-app="taman-kelompok-ceria"] .item-area,body[data-app="taman-kelompok-ceria"] .basket-area{padding:12px;overflow:auto;min-height:0}
 body[data-app="taman-kelompok-ceria"] .item-tray{gap:8px}
 body[data-app="taman-kelompok-ceria"] .item-card{min-height:90px;border-radius:17px}
 body[data-app="taman-kelompok-ceria"] .basket{min-height:280px;padding:10px 5px}
 body[data-app="taman-kelompok-ceria"] .basket-visual{font-size:36px;margin:5px 0}
 body[data-app="taman-kelompok-ceria"] .basket-title{font-size:18px;padding:5px 10px}
 body[data-app="kereta-pola"] .rail-scene{flex:1;min-height:185px;padding:30px 16px 35px}
 body[data-app="kereta-pola"] .wagon-track{gap:8px}
 body[data-app="kereta-pola"] .wagon{width:92px;flex-basis:92px;height:90px}
 body[data-app="kereta-pola"] .engine{flex-basis:94px}
 body[data-app="kereta-pola"] .choices-panel{padding:12px 18px;flex-shrink:0}
 body[data-app="kereta-pola"] .choice-grid{margin-top:9px;gap:10px}
 body[data-app="kereta-pola"] .choice-card{min-height:86px}
 body[data-app="pulau-perasaan"] .island-scene{min-height:180px;padding:14px;flex:1}
 body[data-app="pulau-perasaan"] .story-card{grid-template-columns:100px 1fr;gap:18px;width:94%;padding:14px 20px}
 body[data-app="pulau-perasaan"] .character-avatar{width:82px;height:82px;font-size:52px;border-radius:25px}
 body[data-app="pulau-perasaan"] .activity-panel{padding:12px 18px;flex-shrink:0}
 body[data-app="pulau-perasaan"] .emotion-grid{grid-template-columns:repeat(9,minmax(90px,1fr));gap:9px;margin-top:9px}
 body[data-app="pulau-perasaan"] .emotion-card{min-height:95px;gap:5px}
 body[data-app="pulau-perasaan"] .emotion-emoji{font-size:40px}
 body[data-app="pulau-perasaan"] .emotion-name{font-size:14px}
 body[data-app="pulau-perasaan"] .response-grid{margin-top:9px}
 body[data-app="pulau-perasaan"] .response-card{min-height:100px;padding:11px}
 body[data-app="jam-petualangan"] .activity-panel{min-height:0;padding:16px;flex:1}
 body[data-app="jam-petualangan"] .clock-zone{min-height:280px;gap:20px}
 body[data-app="jam-petualangan"] .analog-clock{width:280px;height:280px;min-width:280px;min-height:280px}
 body[data-app="jam-petualangan"] .control-zone{gap:8px}
 body[data-app="jam-petualangan"] .target-card{padding:10px}
 body[data-app="jam-petualangan"] .target-card strong{font-size:36px}
 body[data-app="jam-petualangan"] .step-controls>div{padding:8px}
 body[data-app="timbangan-misteri"] .workspace{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);grid-template-rows:auto auto minmax(340px,1fr) auto;align-content:stretch;gap:12px}
 body[data-app="timbangan-misteri"] .mission-card,body[data-app="timbangan-misteri"] .mode-tabs,body[data-app="timbangan-misteri"] .feedback{grid-column:1/-1}
 body[data-app="timbangan-misteri"] .scale-stage{grid-column:1;grid-row:3;min-height:340px;padding:12px}
 body[data-app="timbangan-misteri"] .scale-wrap{width:98%;margin:10px auto 0}
 body[data-app="timbangan-misteri"] .interaction-panel{grid-column:2;grid-row:3;padding:18px;overflow:auto;display:flex;flex-direction:column;justify-content:center}
 body[data-app="timbangan-misteri"] .interaction-panel.hidden{display:none}
 body[data-app="timbangan-misteri"] .panel-head{display:block}
 body[data-app="timbangan-misteri"] .panel-head h3{font-size:23px}
 body[data-app="timbangan-misteri"] .panel-head p{font-size:15px;text-align:left}
 body[data-app="timbangan-misteri"] .weight-bank{grid-template-columns:repeat(4,1fr);gap:8px}
 body[data-app="timbangan-misteri"] .bank-weight{min-height:60px;gap:6px;flex-direction:column;padding:7px}
 body[data-app="timbangan-misteri"] .panel-actions{flex-wrap:wrap;margin-top:15px;gap:8px}
 body[data-app="timbangan-misteri"] .panel-actions .primary-button{flex:1;min-width:100%}
 body[data-app="timbangan-misteri"] .mystery-layout{display:block}
 body[data-app="robot-cari-jalan"] .game-layout{min-height:410px;flex:1;gap:14px;grid-template-columns:minmax(0,1fr) minmax(400px,.85fr)}
 body[data-app="robot-cari-jalan"] .board-card,body[data-app="robot-cari-jalan"] .program-card{padding:14px;min-height:0}
 body[data-app="robot-cari-jalan"] .grid-board{width:min(100%,calc(100dvh - 380px));min-width:290px;margin:8px auto;gap:4px;border-radius:18px}
 body[data-app="robot-cari-jalan"] .board-head h3,body[data-app="robot-cari-jalan"] .program-head h3{font-size:21px}
 body[data-app="robot-cari-jalan"] .board-tip{padding:7px 10px;font-size:14px}
 body[data-app="robot-cari-jalan"] .board-tip p{margin:0}
 body[data-app="robot-cari-jalan"] .command-palette{margin:10px 0;gap:7px}
 body[data-app="robot-cari-jalan"] .command-btn{min-height:62px;padding:8px}
 body[data-app="robot-cari-jalan"] .command-btn span{font-size:30px}
 body[data-app="robot-cari-jalan"] .program-sequence{min-height:65px;max-height:100px;overflow:auto;margin-top:8px;gap:6px}
 body[data-app="robot-cari-jalan"] .program-actions{margin:9px 0}
 body[data-app="robot-cari-jalan"] .efficiency{padding:8px;margin-top:9px}
 body[data-app="penjelajah-ekosistem"] .activity-panel{padding:14px;flex:1;min-height:0;overflow:auto}
 body[data-app="penjelajah-ekosistem"] .panel-intro h3{font-size:21px;margin:3px 0}
 body[data-app="penjelajah-ekosistem"] .panel-intro p{font-size:15px;margin:0}
 body[data-app="penjelajah-ekosistem"] .creature-bank,body[data-app="penjelajah-ekosistem"] .chain-bank{margin:10px 0;padding:10px;gap:8px}
 body[data-app="penjelajah-ekosistem"] .creature-card,body[data-app="penjelajah-ekosistem"] .chain-card{min-width:110px;padding:8px 10px;font-size:14px}
 body[data-app="penjelajah-ekosistem"] .creature-card span,body[data-app="penjelajah-ekosistem"] .chain-card span{font-size:28px}
 body[data-app="penjelajah-ekosistem"] .habitat-zone{min-height:160px;padding:10px}
 body[data-app="penjelajah-ekosistem"] .habitat-zones{gap:10px}
 body[data-app="penjelajah-ekosistem"] .panel-actions{margin-top:12px}
 body[data-app="penjelajah-ekosistem"] .chain-slots{padding:14px 8px}
 body[data-app="penjelajah-ekosistem"] .chain-slot{min-height:112px}
 body[data-app="penjelajah-ekosistem"] .scenario-card{padding:15px}
 body[data-app="penjelajah-ekosistem"] .consequence-choice{padding:10px 12px}
}