/* Mobile touch-comfort pass — loaded after game-feedback-v2.css.
   Preserves an unchanging maze frame across RUN results. */
@media (max-width:680px) {
  .board-shell { align-items:center; justify-content:center; }
  .board {
    width:min(88%, 88cqh) !important;
    max-width:88% !important;
    height:auto !important;
    aspect-ratio:var(--size) / var(--rows);
    flex:0 0 auto;
  }
  .program {
    box-sizing:border-box;
    height:100px; min-height:100px; max-height:100px; flex:0 0 100px;
    padding:6px; gap:5px; overflow-y:auto; overflow-x:hidden;
    overscroll-behavior:contain; scrollbar-width:thin; scroll-padding:6px;
  }
  .program::-webkit-scrollbar { width:5px; }
  .program::-webkit-scrollbar-thumb { background:#b3c8cd; border-radius:8px; }
  .cmd {
    font-size:12px; min-height:42px; padding:2px 3px 2px 8px;
    border-radius:8px; gap:5px; white-space:nowrap;
  }
  .cmd .num { font-size:11px; }
  .cmd .remove {
    box-sizing:border-box; width:40px; min-width:40px;
    height:40px; min-height:40px; margin-left:auto; padding:0;
    display:grid; place-items:center; font-size:22px; line-height:1;
    touch-action:manipulation; background:#e7f0f2; color:#304b5b;
  }
  .cmd.loop { padding:4px 5px; white-space:normal; }
  .cmd.loop .loop-top { min-height:40px; }
  .cmd.loop .loop-contents { margin-top:4px; }
  .loop-inner { min-height:28px; padding:5px 6px; }
  .program-empty { min-height:45px; }
  .editor-header { min-height:36px; }
  .text-button { min-height:36px; padding:7px 9px; font-size:11px; }
  .command-grid { margin-top:6px; }
  .action-btn, .action-btn.repeat {
    min-height:50px; max-height:50px; padding:4px 2px;
    font-size:11px; touch-action:manipulation;
  }
  .run-button { min-height:46px; height:46px; }
  .draft { max-height:112px; overflow-y:auto; overscroll-behavior:contain; }
  .draft-ctrl button { min-height:36px; }
  .draft-count select { min-height:36px; }
}
@media (max-width:680px) and (max-height:780px) {
  .program { height:92px; min-height:92px; max-height:92px; flex-basis:92px; }
  .action-btn, .action-btn.repeat { min-height:48px; max-height:48px; }
  .run-button { min-height:44px; height:44px; }
}
@media (max-width:680px) and (max-height:700px) {
  .program { height:86px; min-height:86px; max-height:86px; flex-basis:86px; }
  .editor-header { min-height:32px; }
  .action-btn, .action-btn.repeat { min-height:44px; max-height:44px; }
  .run-button { min-height:44px; height:44px; }
}
@media (max-width:680px) and (max-height:610px) {
  .program { height:76px; min-height:76px; max-height:76px; flex-basis:76px; }
  .editor-header { min-height:30px; }
  .draft { max-height:91px; }
  .cmd { min-height:40px; }
  .cmd .remove { width:38px; min-width:38px; height:38px; min-height:38px; }
}
/* Keep footer height deterministic: RUN status text must not resize the board. */
@media (max-width:680px) {
  .map-footer {
    flex-wrap:nowrap; height:28px; min-height:28px; max-height:28px;
    overflow:hidden;
  }
  .map-footer .hint {
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    flex:1 1 0; min-width:0;
  }
}
/* On compact screens move level picker alongside title, returning space to maze. */
@media (max-width:680px) and (max-height:610px) {
  .program {
    height:72px; min-height:72px; max-height:72px; flex-basis:72px;
  }
  .map-card { position:relative; }
  .map-footer {
    position:absolute; right:5px; top:5px; margin:0; padding:0;
    min-height:26px; height:26px; max-height:26px; z-index:2; width:auto;
  }
  .map-footer .hint { display:none; }
  .map-footer label { flex:0 0 auto; }
  .select-level {
    width:112px; max-width:112px; height:26px; padding:2px 4px; font-size:9px;
  }
  .counter { display:none; }
  .card-heading>div:first-child { padding-right:110px; }
  .direction-readout { font-size:9px; min-height:23px; }
}
/* Mobile loop builder overlays the board briefly rather than shrinking its grid. */
@media (max-width:680px) {
  .controls-card { position:relative; z-index:4; }
  .draft:not([hidden]) {
    position:absolute; left:0; right:0; bottom:calc(100% + 4px);
    z-index:10; margin:0; padding:8px;
    background:#fffaf0; border:1px solid #d9b670; border-radius:12px;
    box-shadow:0 8px 28px rgba(15,37,56,.18);
    max-height:min(160px,32svh);
  }
}