/* Mobile adaptation of the saved app. Desktop remains governed by its existing styles. */
.liminal-mobile-actions { display: none !important; }
@media (max-width: 720px) {
  html.liminal-mobile { scroll-padding-block: 12px; }
  html.liminal-mobile body { overflow: auto; }
  html.liminal-mobile :is(.app-shell, .liminal-app, .pf-app) {
    width: 100%; min-width: 0; height: auto; min-height: 100dvh;
    flex-direction: column; overflow: visible;
  }
  html.liminal-mobile :is(.main-shell, .liminal-main, .pf-main) { min-width: 0; min-height: 0; }
  html.liminal-mobile .side-shell {
    display: flex !important; flex: none !important; flex-direction: row !important;
    flex-wrap: wrap !important; width: 100% !important; max-width: none !important;
    min-width: 0 !important; height: auto !important; box-sizing: border-box;
    padding: 8px 12px !important; gap: 6px !important; border-right: 0 !important;
  }
  html.liminal-mobile .side-brand { flex: 1 1 100%; margin: 0 !important; text-align: left; }
  html.liminal-mobile .side-nav {
    display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr));
    flex: 1 1 100% !important; width: 100%; min-width: 0; overflow: visible;
    gap: 4px !important;
  }
  html.liminal-mobile .side-nav .nav-link {
    min-width: 0 !important; min-height: 44px !important; padding: 6px !important;
    font-size: 12px !important; letter-spacing: 0 !important;
    white-space: normal; overflow-wrap: anywhere; justify-content: center;
  }
  html.liminal-mobile .side-user-bar {
    display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
    flex: 1 1 100% !important; width: 100% !important; min-width: 0;
  }
  html.liminal-mobile .side-user-piece { flex: 1 1 130px; min-width: 0; padding: 6px 8px; }
  html.liminal-mobile .side-user-bar :is(.nav-link, button) { min-height: 44px !important; }
  html.liminal-mobile .side-user-resizer { display: none; }
  html.liminal-mobile :is(.page-bar, .page-bar-actions, .activity-head-actions, .cc-index,
    .lib-view-switch, .library-display-group, .build-tools-group, .fab-head-bar) {
    min-width: 0; max-width: 100%; flex-wrap: wrap !important; height: auto;
  }
  html.liminal-mobile :is(.page-bar-actions, .activity-head-actions) { flex: 1 1 100%; }
  html.liminal-mobile :is(button, summary, a.b, .cc-btn, .build-btn, .fab-btn) {
    min-height: 44px; touch-action: manipulation;
  }
  html.liminal-mobile :is(input:not([type=checkbox]):not([type=radio]), textarea, select) {
    min-width: 0; max-width: 100%; box-sizing: border-box; font-size: 16px !important;
  }
  html.liminal-mobile :is(input:not([type=checkbox]):not([type=radio]), select) { min-height: 44px; }
  html.liminal-mobile :is(.page-bar, .cc-actions, .row-tools, .build-dialog-foot) button {
    white-space: normal; overflow-wrap: anywhere;
  }
  html.liminal-mobile :is(dialog, .lim-dialog, .build-dialog, .lim-tutorial-dialog) {
    box-sizing: border-box; max-width: calc(100vw - 24px) !important;
    max-height: calc(100dvh - 24px) !important; overflow: auto;
  }
  html.liminal-mobile :is(.dialoghead, .build-dialog-head, .db-dialog-head) {
    position: sticky; top: 0; z-index: 2; background: var(--paper); flex-wrap: wrap;
  }
  html.liminal-mobile :is(.dialogbody, .db-dialog-body, .build-dialog-body) {
    min-width: 0; max-height: none; overflow: visible; overflow-wrap: anywhere;
  }
  html.liminal-mobile :is(.library-scroll, .control-centre, .activity-main, .account-scroll) {
    min-width: 0; overflow-wrap: anywhere;
  }
  html.liminal-mobile :is(.library-scope, .library-actions, .cc-inline, .cc-status-line) { flex-wrap: wrap; }
  html.liminal-mobile :is(.library-scope button, .cc-index button) { flex: 1 1 100px; }
  html.liminal-mobile :is(.library-split, .library-four, .od-parts-grid, .cc-scope, .fab-api-row) {
    grid-template-columns: minmax(0, 1fr);
  }
  html.liminal-mobile .library-tray {
    inset: 8px 8px auto !important; width: auto !important;
    max-height: calc(100dvh - 16px); overflow: auto; box-sizing: border-box;
  }
  html.liminal-mobile :is(.library-tray, #object-detail) .od-head { flex-wrap: wrap; min-width: 0; }
  html.liminal-mobile .lib-context-menu {
    max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); overflow: auto;
  }
  html.liminal-mobile #dispatch-board .board-canvas { overflow: visible; min-width: 0; }
  html.liminal-mobile #dispatch-board :is(.workspace-split, .toolbar-group, .col-head, .card-foot) { min-width: 0; flex-wrap: wrap; }
  html.liminal-mobile #dispatch-board :is(button, .ctrl-select, .card-move) { min-height: 44px; height: auto; }
  html.liminal-mobile #dispatch-board .detail-panel { height: 100dvh; max-height: 100dvh; }
  html.liminal-mobile #dispatch-board .detail-body { padding-bottom: max(20px, env(safe-area-inset-bottom)); }
  html.liminal-mobile :is(.build-title-input, .fab-name) { max-width: 100%; min-width: 0; }
  html.liminal-mobile :is(.build-toolbar, .fab-head-bar) { overflow: auto; flex: none; }
  html.liminal-mobile :is(.build-zoom, .fab-zoom) button { min-width: 44px; min-height: 44px; }

  /* Workbench keeps its iframe scrollport; the outer shell may scroll when the keyboard opens. */
  html.liminal-mobile body[data-r3-mode] .app-shell { height: auto; min-height: 100dvh; overflow: visible; }
  html.liminal-mobile body[data-r3-mode] .main-shell { overflow: visible; flex: none; }
  html.liminal-mobile body[data-r3-mode] .r3-flow-frame { height: 75dvh; min-height: 320px; flex: none; }
  html.liminal-mobile .r3-context-drawer { padding: 0 12px 16px; max-height: 60dvh; height: 360px; }
  html.liminal-mobile .r3-drawer-bar button { min-height: 44px; }
  html.liminal-mobile .r3-context-drawer.is-collapsed { transform: translateY(calc(100% - 60px)) !important; }
  html.liminal-mobile .r3-drawer-bar { min-height: 60px; flex-wrap: wrap; }
  html.liminal-mobile #liminal { min-height: 100dvh; }
  html.liminal-mobile #liminal :is(.workbench-live-layout, .workbench-live-layout.semantic-open, .workbench-live-layout.semantic-closed) {
    grid-template-columns: minmax(0, 1fr) !important; padding: 12px !important; gap: 12px !important;
  }
  html.liminal-mobile #liminal :is(.canvas, .graph, .stage, .graphrow, .nodebody, .nodehead) { min-width: 0; }
  html.liminal-mobile #liminal .canvas { padding: 0 !important; }
  html.liminal-mobile #liminal .graph { padding-inline: 0 !important; }
  html.liminal-mobile #liminal #surface .graphrow { flex-wrap: wrap !important; gap: 12px !important; padding: 12px 0 !important; }
  html.liminal-mobile #liminal #surface #stage-discovery .node-stack,
  html.liminal-mobile #liminal #surface #stage-routes .node-stack,
  html.liminal-mobile #liminal #surface .node-stack,
  html.liminal-mobile #liminal #surface .node-stack:not(.expanded),
  html.liminal-mobile #liminal #surface .node-stack.expanded {
    min-width: 0 !important; max-width: 100% !important; width: 100% !important; flex: 1 1 100% !important;
  }
  html.liminal-mobile #liminal #surface .node-stack > details.node {
    min-width: 0 !important; max-width: 100% !important; width: 100% !important;
  }
  html.liminal-mobile #liminal #surface :is(.route-tier-row, .basis-node-grid, .basis-level3-grid, .saved-answer-sections) {
    grid-template-columns: minmax(0, 1fr) !important; flex-wrap: wrap !important;
  }
  html.liminal-mobile #liminal :is(.nodehead, .deliv-head-left, .workbench-top-tools, .row-tools) { flex-wrap: wrap !important; }
  html.liminal-mobile #liminal :is(.nodebody, .saved-answer-sections, .deliv-full-answer) { overflow-wrap: anywhere; }
  html.liminal-mobile #liminal #surface :is(.canvas-answer .row-tools button, .node-do > button, .node-more > summary) {
    white-space: normal !important; max-width: 100%; overflow-wrap: anywhere;
  }
  html.liminal-mobile #liminal pre { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; }
  html.liminal-mobile #liminal .stage-rail-auto-desc {
    display: block !important; position: static !important; width: auto; max-width: 100%; box-shadow: none !important;
  }
  html.liminal-mobile #liminal :is(button, .flowbar button, .nodebody button, .node-size-toggle, .node-expand-toggle) {
    min-height: 44px !important;
  }
  html.liminal-mobile #liminal :is(.btn-close-mini, .node-size-toggle, .node-expand-toggle) { min-width: 44px !important; }
  html.liminal-mobile #liminal .orbit-action-hud {
    inset: 12px 12px auto !important; width: auto !important;
    max-width: none !important; max-height: calc(100dvh - 24px) !important; overflow: auto !important;
  }
  html.liminal-mobile #liminal .oah-head { position: sticky; top: 0; z-index: 2; background: var(--paper); }
  html.liminal-mobile .liminal-mobile-actions {
    display: inline-flex !important; align-items: center; justify-content: center;
    min-height: 44px !important; width: auto; padding: 8px 12px !important;
    margin-top: 8px; white-space: normal; font: inherit;
  }
}