/* Public beta mobile containment, 2026-11-11.
   Load after existing styles. No geometry, data, or interaction logic changes. */
@media (max-width: 700px) {
  html, body { min-width: 0; width: 100%; }
  body { padding: 6px; }
  #delta-editor {
    width: 100%; min-width: 0; max-width: 100%;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #delta-editor > *,
  #delta-editor .layout > *,
  #delta-editor #unified-tools,
  #delta-editor .inline-preview-body,
  #delta-editor .inline-controls { min-width: 0; max-width: 100%; }
  #delta-editor .app-brand { flex-wrap: wrap; }
  #delta-editor .app-brand h2 { white-space: normal; overflow-wrap: anywhere; }
  #delta-editor .app-brand > .tools { flex-wrap: wrap; min-width: 0; max-width: 100%; }
  #delta-editor .layout:has(.inline-preview):has(#unified-tools) {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: max-content minmax(300px, 52dvh) minmax(380px, 65dvh) !important;
    overflow-y: auto;
  }
  #delta-editor #primary-tools { width: 100%; flex-wrap: wrap; }
  #delta-editor #history-tools { flex-wrap: wrap; margin-left: 0; }
  #delta-editor #toolbar-view-tools { min-width: 0 !important; max-width: 100% !important; flex-wrap: wrap !important; }
  #delta-editor .inline-controls > .inline-preview-tools {
    min-width: 0 !important; max-width: 100% !important; flex-wrap: wrap !important;
  }
  #delta-editor .inline-controls > .inline-preview-tools button {
    min-height: 40px !important; white-space: normal !important;
  }
  #delta-editor .inline-controls > .preview-disclosure[open] {
    flex: 1 0 100% !important; width: 100% !important;
    min-width: 0 !important; max-width: 100% !important;
  }
  #delta-editor .inline-controls > .preview-disclosure[open] > .preview-popover {
    position: static !important; width: 100% !important;
    min-width: 0 !important; max-width: 100% !important;
    max-height: 280px !important; margin-top: 6px;
  }
  #delta-editor .inline-controls .preview-popover select {
    width: 100% !important; min-width: 0 !important; max-width: 100% !important;
  }
  #delta-editor .status { white-space: normal; overflow-wrap: anywhere; }
  #delta-editor #near-dimensions,
  #delta-editor #element-editor,
  #direct-note { max-width: calc(100vw - 16px); }
  #delta-editor .settings:has(#unified-tools) > .pane.context-open:not(#drawing-panel):not([hidden]) {
    max-width: calc(100vw - 20px);
  }
  #app-start { padding: 16px; overflow-y: auto; }
  #app-start .start-inner { min-width: 0; max-width: 100%; }
  #app-start .start-options { grid-template-columns: minmax(0, 1fr) !important; }
  #app-start .start-secondary { display: flex; flex-wrap: wrap; gap: 8px; }
}

/* Auto tracks can shrink a min-height:0 flex toolbar inside a fixed-height grid.
   Preserve the complete wrapped toolbar in row one; scrolling belongs to layout. */
@media (max-width: 700px) {
  #delta-editor .layout:has(#unified-tools) > .settings {
    min-height: max-content !important;
    height: max-content !important;
    max-height: none !important;
    align-self: start !important;
    align-content: start !important;
    overflow: visible !important;
  }
  #delta-editor #unified-tools { flex-shrink: 0 !important; }
}
/* Short landscape screens: retain access to start/restore actions below cards. */
@media (max-width: 1000px) and (max-height: 500px) {
  #app-start { height: 100dvh !important; max-height: 100dvh !important; overflow-y: auto !important; overscroll-behavior: contain; }
  #app-start .start-inner { min-height: 0 !important; }
}

#wall-length-box .wall-touch-controls[hidden]{display:none!important}
#wall-length-box.wall-touch>span{display:none}
#wall-length-box.wall-touch input{font-size:16px!important;min-height:44px;touch-action:manipulation}
#wall-length-box .wall-directions{display:flex;gap:6px;margin:8px 0}
#wall-length-box .wall-touch-controls button{min-width:44px;min-height:44px;touch-action:manipulation}
#wall-length-box .wall-directions button[aria-pressed=true]{background:#dfb968;color:#17202e}

/* Hide only mobile header/tools after a canvas tap. Geometry and preview stay put. */
#mobile-chrome-handle { display: none !important; }
@media (max-width: 700px) {
  #delta-editor.mobile-chrome-hidden > .app-brand,
  #delta-editor.mobile-chrome-hidden .layout:has(#unified-tools) > .settings {
    display: none !important;
  }
  #delta-editor.mobile-chrome-hidden #mobile-chrome-handle {
    display: flex !important; position: fixed; top: max(6px, env(safe-area-inset-top));
    left: 50%; transform: translateX(-50%); z-index: 100;
    align-items: center; justify-content: center;
    width: 64px; min-height: 44px; padding: 0 !important;
    border: 1px solid #dfb968; border-radius: 0 0 12px 12px;
    background: #263346; color: #dfb968; font-size: 24px;
    box-shadow: 0 2px 8px #0005; touch-action: manipulation;
  }
}

#wall-length-box.wall-touch{z-index:10010!important;pointer-events:auto!important}
#wall-length-box .wall-keypad{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-top:8px}
#wall-length-box .wall-keypad button{font-size:18px;min-height:40px;padding:4px}

/* R07: full-width top touch strip, expanded canvas while chrome is hidden. */
@media (max-width:700px), (pointer:coarse) and (max-width:1000px){
 #delta-editor.mobile-chrome-hidden>.app-brand,#delta-editor.mobile-chrome-hidden .layout:has(#unified-tools)>.settings{display:none!important}
 #delta-editor.mobile-chrome-hidden #mobile-chrome-handle{display:flex!important;position:fixed;top:0;left:0;transform:none;width:100%;min-height:28px;height:28px;z-index:100;background:#263346e8;color:#dfb968;justify-content:center;align-items:center;padding:0!important;border:0;border-bottom:1px solid #dfb968;border-radius:0;font-size:22px;touch-action:manipulation}
}

/* R09 double tap: hide both upper chrome and lower preview, not input keypad. */
@media (max-width:700px), (pointer:coarse) and (max-width:1000px){
 #delta-editor.mobile-chrome-hidden .inline-preview,#delta-editor.mobile-chrome-hidden .preview-splitter{display:none!important}
 #delta-editor.mobile-chrome-hidden .layout:has(#unified-tools){grid-template-columns:minmax(0,1fr)!important;grid-template-rows:minmax(0,1fr)!important}
 #delta-editor.mobile-chrome-hidden .layout>div:first-child{grid-column:1!important;grid-row:1!important}
}

.wall-panel-title,.wall-panel-reopen{display:none!important}
@media(max-width:700px),(pointer:coarse) and (max-width:1000px){
 #wall-length-box .wall-panel-title{display:block!important;min-height:32px;line-height:32px;font-weight:600;touch-action:manipulation}
 #wall-length-box.wall-panel-collapsed{top:auto!important;bottom:8px!important;width:auto!important;max-height:none!important;padding:4px!important}
 #wall-length-box.wall-panel-collapsed>label,#wall-length-box.wall-panel-collapsed>span,#wall-length-box.wall-panel-collapsed>.wall-touch-controls,#wall-length-box.wall-panel-collapsed>.wall-panel-title{display:none!important}
 #wall-length-box.wall-panel-collapsed>.wall-panel-reopen{display:block!important;min-height:44px;min-width:72px;touch-action:manipulation}
}