/* Local responsive layout for the bundled tool; desktop and vendor code stay intact. */
@media (max-width: 900px) {
  html, body { height: auto; min-height: 100%; }
  body { overflow: auto; }
  #content-wrapper { position: relative; height: auto; min-height: 100vh; }
  #banner { position: relative; height: auto; min-height: 30px; align-items: center; row-gap: 4px; padding: 6px 0; }
  #banner > .col, #banner > .col-md-6 { flex: 1 1 100%; max-width: 100%; min-width: 0; text-align: left !important; padding: 0 10px !important; }
  #workspace-wrapper { position: relative; top: auto; height: auto; display: grid; gap: 12px; }
  #workspace-wrapper > .gutter, #IO > .gutter { display: none; }
  #operations, #recipe, #IO { float: none; width: 100% !important; height: auto; min-width: 0; }
  #operations { max-height: 320px; overflow: auto; }
  #operations > .title, #operations > #search { position: sticky; z-index: 1; }
  #operations > .title { top: 0; }
  #operations > #search { top: 48px; }
  #recipe { display: flex; flex-direction: column; }
  #rec-list { position: relative; top: auto; bottom: auto !important; width: 100%; min-height: 200px; max-height: 480px; }
  #controls { position: relative; height: auto; min-height: 67px; }
  #controls-content { transform: none !important; flex-wrap: wrap; gap: 8px; justify-content: center; }
  #controls-content #bake { flex: 0 1 140px; }
  #IO { display: grid; gap: 12px; }
  #input, #output { display: flex; flex-direction: column; height: auto !important; min-width: 0; }
  #recipe > .title, #input > .title, #output > .title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; height: auto; min-height: 48px; }
  #workspace-wrapper .pane-controls { position: static; display: flex; flex-wrap: wrap; margin-left: auto; max-width: 100%; }
  #input-wrapper, #output-wrapper { height: 340px; min-height: 240px; }
  #input-text, #output-text { height: 100%; }
  #save-link-group .save-link-options { float: none; display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 12px; }
  #save-link { display: block; width: 100%; overflow-wrap: anywhere; }
}