/* Host presentation only: settings and scientific clocks are shared with desktop. */
#sim-canvas { height: 100dvh; }
#sim-links { top: max(8px, env(safe-area-inset-top)); }
#sim-links a { color: #b9cbe3; }
#sim-links a:focus-visible { outline: 2px solid #99e6de; outline-offset: 2px; }
.tour { top: max(12px, env(safe-area-inset-top)); bottom: max(12px, env(safe-area-inset-bottom)); left: max(12px, env(safe-area-inset-left)); }
.tour-settings { margin-block: 12px 16px; }
.tour-settings > summary { display: none; }
.tour-settings-controls { display: flex; flex-wrap: wrap; gap: 8px; }
.tour-slide-choice, .sim-touch-controls { display: none; }
.sim-hud[data-docked="true"] { position: static; max-width: 100% !important; max-height: none; margin-top: 12px; font-size: calc(14px * var(--app-text-scale, 1)); line-height: 1.5; }
.sim-hud[data-docked="true"] .sim-hud-badge { font-size: calc(13px * var(--app-text-scale, 1)); line-height: 1.5; }
.zoo-dialog { max-height: calc(100dvh - max(18px, env(safe-area-inset-top)) - max(18px, env(safe-area-inset-bottom))); }

/* Comfortable targets on phones and touch tablets, with native page magnification. */
@media (max-width: 759px), (pointer: coarse) {
  #sim-links { gap: 4px; padding: 4px; background: #0a162bf2; border: 1px solid #446279; border-radius: 12px; }
  #sim-links a { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 6px 10px; font-size: calc(13px * var(--app-text-scale, 1)); text-align: center; white-space: normal; }
  #sim-links > span { display: none; }
  .wave-controls button, .wave-controls select, .wave-tour-controls .wave-controls button, .wave-tour-controls .wave-controls select { min-height: 44px; padding: 8px 10px; font-size: calc(14px * var(--app-text-scale, 1)); }
  .wave-controls select { font-size: calc(16px * var(--app-text-scale, 1)); }
  .wave-floating { width: max-content; max-width: calc(100% - 24px); }
  .wave-heading strong { font-size: calc(14px * var(--app-text-scale, 1)); }
  .wave-note { font-size: calc(11px * var(--app-text-scale, 1)); }
  .wave-floating .wave-pause { display: none; }
  .sim-touch-controls { display: flex; justify-content: center; gap: 6px; margin-top: 6px; }
  .sim-touch-controls button { min-width: 44px; min-height: 44px; padding: 6px 10px; font: calc(15px * var(--app-text-scale, 1))/1.3 system-ui, sans-serif; border: 1px solid #446279; border-radius: 8px; cursor: pointer; touch-action: manipulation; }
  .sim-touch-controls button:focus-visible { outline: 2px solid #269ba5; outline-offset: 2px; }
  .sim-touch-controls svg { display: block; margin: auto; }
  .tour-settings .sim-touch-controls { margin-top: 0; }
  .tour-settings > summary { display: list-item; min-height: 44px; padding: 10px; cursor: pointer; border: 1px solid var(--tour-rule); border-radius: 8px; font-size: calc(14px * var(--app-text-scale, 1)); }
  .tour-settings[open] > summary { margin-bottom: 10px; }
  .tour button { min-height: 44px; }
  .tour .tour-tab { width: 44px; }
  .tour .tour-slide-choice { display: block; width: 100%; min-width: 0; min-height: 44px; font: calc(16px * var(--app-text-scale, 1)) system-ui, sans-serif; color: var(--tour-ink); background: white; border: 1px solid var(--tour-rule); border-radius: 8px; }
  .tour-dots { display: none; }
  .tour-foot { padding: 8px 12px; gap: 6px; }
  .tour-buttons button { min-width: 0; font-size: calc(13px * var(--app-text-scale, 1)); padding: 6px; }
  .tour-head { padding: 8px 12px; }
  .tour-paused { display: none !important; } /* Play/Pause exposes the same state without a keyboard instruction. */
  .tour-body { font-size: calc(16px * var(--app-text-scale, 1)); padding: 12px; }
  .zoo-dialog button { min-height: 44px; }
  .zoo-dialog .zoo-wording button { font-size: calc(12px * var(--app-text-scale, 1)); padding: 7px 9px; }
  .zoo-source { min-height: 44px; padding-block: 10px; font-size: calc(12px * var(--app-text-scale, 1)); }
  .zoo-chapter p, .zoo-stat, .zoo-cloud-caption p, .experiment-person p, .experiment-stat { font-size: calc(14px * var(--app-text-scale, 1)); }
  .experiment-filters input, .experiment-filters select { min-height: 44px; font-size: calc(16px * var(--app-text-scale, 1)); }
}

@media (max-width: 759px) {
  #sim-links { width: calc(100% - max(8px, env(safe-area-inset-left)) - max(8px, env(safe-area-inset-right))); max-width: none; display: grid; grid-template-columns: 1fr 1fr; }
  .wave-heading { overflow-wrap: anywhere; }
  .wave-heading .wave-note { display: block; }
  .wave-floating { padding: 6px; }
  .tour { top: auto; left: max(8px, env(safe-area-inset-left)); right: max(8px, env(safe-area-inset-right)); bottom: max(8px, env(safe-area-inset-bottom)); width: auto; height: min(62dvh, calc(100dvh - 190px - env(safe-area-inset-top) - env(safe-area-inset-bottom))); }
  .tour.is-collapsed { height: 0; width: auto; }
  .tour .tour-tab { top: -44px; right: 0; left: auto; width: auto; height: 44px; }
  .zoo-dialog, #zoo-card, .experiment-dialog { width: calc(100% - max(8px, env(safe-area-inset-left)) - max(8px, env(safe-area-inset-right))); max-height: calc(100dvh - max(8px, env(safe-area-inset-top)) - max(8px, env(safe-area-inset-bottom))); }
  .zoo-header, .experiment-dialog .zoo-header { flex-direction: column; gap: 8px; padding: 10px 14px; }
  .zoo-header-actions, .experiment-dialog .zoo-header-actions { flex-direction: row; width: 100%; justify-content: space-between; gap: 6px; }
  .zoo-header .zoo-close { margin-left: auto; }
  .zoo-body { padding: 14px; }
  .zoo-heading h2 { font-size: calc(22px * var(--app-text-scale, 1)); }
  .zoo-card-nav { gap: 6px; }
}

/* Landscape phones use a side lesson, preserving a useful simulation beside it. */
@media (min-width: 480px) and (max-width: 959px) and (max-height: 499px) {
  #sim-links { display: flex; flex-wrap: nowrap; width: calc(100% - 24px); max-width: 760px; }
  #sim-links a { flex: 1; min-width: 0; font-size: calc(12px * var(--app-text-scale, 1)); padding: 6px 8px; }
  .tour { top: max(8px, env(safe-area-inset-top)); bottom: max(8px, env(safe-area-inset-bottom)); left: max(8px, env(safe-area-inset-left)); right: auto; width: min(var(--tour-width), 44vw); height: auto; }
  .tour.is-collapsed { width: 0; height: auto; }
  .tour .tour-tab { top: 16px; right: auto; left: 100%; width: 44px; height: auto; min-height: 144px; writing-mode: vertical-rl; border-radius: 0 9px 9px 0; }
  .tour-tab svg { transform: none; }
  .tour.is-collapsed .tour-tab svg { transform: rotate(180deg); }
  .tour-resize { display: none; }
  .wave-floating { display: flex; align-items: flex-start; gap: 6px; }
  .wave-floating[hidden] { display: none; }
  .wave-floating .sim-touch-controls { margin-top: 0; }
  .wave-floating .wave-controls { flex-wrap: nowrap; min-width: 0; }
  .wave-floating .wave-choice { flex: 1; }
  .wave-floating .wave-choice select { width: 100%; max-width: 160px; }
  .wave-floating .wave-mode { font-size: calc(13px * var(--app-text-scale, 1)); padding: 6px 8px; }
  .wave-floating .wave-mode-icon { display: none; }
  .zoo-dialog .zoo-header { flex-direction: row; align-items: center; }
  .zoo-header-actions { width: auto; flex-wrap: nowrap; }
  .zoo-heading h2, .experiment-dialog .zoo-heading h2 { font-size: calc(18px * var(--app-text-scale, 1)); }
  .zoo-eyebrow { display: none; }
}

/* Large type keeps the complete lesson/card reachable through one scroll area. */
html[data-text-enlarged="true"] :is(.tour, .zoo-dialog, .wave-controls) { overflow-wrap: anywhere; }
html[data-text-enlarged="true"] .tour-content { overflow-y: auto; overscroll-behavior: contain; }
html[data-text-enlarged="true"] .tour-body { flex: none; overflow: visible; }
@media (max-width: 479px), (max-width: 759px) and (min-height: 500px) {
  /* Graph lessons need room for enlarged axes/keys above their scrollable reading sheet. */
  html[data-text-enlarged="true"] .tour[data-graph-on-phone="true"]:not(.is-collapsed) { height: clamp(140px, 32dvh, 280px); }
}
html[data-text-enlarged="true"] :is(.tour-tools, .tour-buttons, .tour-title, .zoo-header-actions, .zoo-wording, .zoo-animation-controls, .wave-controls) { flex-wrap: wrap; min-width: 0; }
html[data-text-enlarged="true"] .tour-tools { flex-shrink: 1; }
html[data-text-enlarged="true"] .zoo-dialog { overflow-y: auto; overscroll-behavior: contain; }
html[data-text-enlarged="true"] .zoo-body { flex: none; overflow: visible; }
html[data-text-enlarged="true"] .zoo-header { flex-wrap: wrap; }
html[data-text-enlarged="true"] .zoo-wording button { white-space: normal; }
html[data-text-enlarged="true"] .wave-floating { max-height: 45dvh; overflow-y: auto; }
html[data-text-enlarged="true"] .wave-floating .wave-controls { flex-wrap: wrap; }
html:not([data-mobile-ui="true"])[data-representation="waves"][data-text-enlarged="true"] #sim-links { max-height: 18dvh; overflow-y: auto; }
html[data-representation="waves"][data-text-enlarged="true"] .wave-floating { max-height: 24dvh; }
html[data-text-large="true"] .zoo-narrative { max-width: 100%; }
html[data-text-large="true"] .zoo-visual { grid-template-columns: minmax(0, 1fr); }
html[data-text-large="true"] .zoo-stat { grid-template-columns: minmax(0, 1fr); gap: 4px; }
/* Reserve the exposed tray edges for their persistent launch controls. */
html[data-deck-persistent="true"] { --tray-edge-space: 64px; }
html[data-deck-persistent="true"] .developer-panel[data-side="right"] .developer-panel-tab { top: auto; bottom: 8px; }
html[data-deck-persistent="true"][data-deck-open="false"] .sim-hud[data-docked="false"] { padding-left: var(--tray-edge-space); }
html[data-deck-persistent="true"] .tour-content { padding-left: 48px; }
html[data-deck-persistent="true"] .tour.is-collapsed .tour-tab { left: var(--tray-edge-space); }
/* Keep navigation above expanded controls and side lessons, including wrapped links. */
html[data-deck-persistent="true"] .controller-deck:not(.is-collapsed) { top: calc(var(--sim-navigation-bottom, 38px) + 8px); }
@media (min-width: 760px), (min-width: 480px) and (max-height: 499px) {
  .tour { top: calc(var(--sim-navigation-bottom, 38px) + 8px); }
}
@media (max-width: 759px), (pointer: coarse) and (max-width: 1024px) {
  html[data-deck-persistent="true"] #sim-links,
  html[data-deck-persistent="true"][data-deck-open="false"] :is(.wave-heading, .wave-floating) {
    max-width: calc(100% - var(--tray-edge-space) - 12px) !important;
  }
  html[data-deck-persistent="true"] #sim-links,
  html[data-deck-persistent="true"][data-deck-open="false"] .wave-heading {
    left: calc(50% + (var(--tray-edge-space) - 12px) / 2) !important;
  }
  html[data-deck-persistent="true"][data-deck-open="false"] .wave-floating {
    left: 50% !important;
    max-width: calc(100% - 2 * var(--tray-edge-space)) !important;
  }
  html[data-deck-persistent="true"] #sim-links { max-height: 18dvh; overflow-y: auto; }
}
@media (max-width: 759px) and (min-height: 500px) {
  /* The full-height tab rail needs room beside the opposite folded tab. */
  html[data-deck-persistent="true"] .controller-deck { max-width: calc(100% - 116px); }
  html[data-deck-persistent="true"] .tour-content { padding-right: 48px; }
  html[data-deck-persistent="true"] .tour.is-collapsed .tour-tab { left: auto; right: var(--tray-edge-space); }
}
@media (max-height: 500px) {
  html[data-deck-persistent="true"] .controller-deck { max-width: calc(100% - 172px); }
  html[data-deck-persistent="true"] { --tray-edge-space: 96px; }
  html[data-deck-persistent="true"] .controller-deck .developer-panel-tab { writing-mode: horizontal-tb; width: 72px; min-height: 44px; height: auto; padding: 6px 3px; white-space: normal; overflow-wrap: anywhere; }
  html[data-deck-persistent="true"] .developer-panel[data-side="right"] .developer-panel-tab { left: -72px; bottom: 4px; }
  html[data-deck-persistent="true"] .tour-content { padding-left: 80px; }
}
@media (max-width: 959px) {
  html[data-text-enlarged="true"] #sim-links { flex-wrap: wrap; }
  html[data-text-enlarged="true"] #sim-links a { overflow-wrap: anywhere; }
  html[data-text-enlarged="true"] .zoo-header { flex-direction: column; align-items: stretch; }
  html[data-text-enlarged="true"] .zoo-header-actions { width: 100%; }
}

/* Compact host interface: a clear stage with controls available on demand. */
.sim-mobile-only { display: none; }
html[data-mobile-ui="true"] { --tray-edge-space: 0px; --mobile-dock-height: 70px; --mobile-header-bottom: 62px; }
html[data-mobile-ui="true"] :is(#sim-mobile-header, #sim-mobile-dock, .sim-mobile-sheet:not([hidden]), #sim-mobile-tray-head) { display: flex; }
html[data-mobile-ui="true"] :is(#sim-mobile-header, #sim-mobile-dock, .sim-mobile-sheet, #sim-mobile-tray-head) {
  box-sizing: border-box; color: var(--ui-pane-text-start, #143146); background: var(--ui-column-background, #eef6f5);
  font: calc(14px * var(--app-text-scale, 1))/1.4 system-ui, sans-serif;
}
html[data-mobile-ui="true"] :is(#sim-mobile-header, #sim-mobile-dock, .sim-mobile-sheet, #sim-mobile-tray-head) button {
  box-sizing: border-box; min-width: 44px; min-height: 44px; border: 0; border-radius: 10px;
  color: var(--ui-button-text-start, #143146); background: var(--ui-button-start, #d9eded);
  background-image: var(--ui-button-text-paint), var(--ui-button-paint);
  background-clip: text, padding-box; -webkit-background-clip: text, padding-box; -webkit-text-fill-color: transparent;
  font: inherit; cursor: pointer; touch-action: manipulation;
}
html[data-mobile-ui="true"] :is(#sim-mobile-header, #sim-mobile-dock, .sim-mobile-sheet, #sim-mobile-tray-head) :focus-visible { outline: 2px solid #087b91; outline-offset: -3px; }
html[data-mobile-ui="true"] #sim-mobile-header {
  position: fixed; z-index: 32; top: max(var(--mobile-viewport-top, 0px), env(safe-area-inset-top)); left: 0; right: 0;
  align-items: center; justify-content: space-between; gap: 8px; padding: 4px max(10px, env(safe-area-inset-right)) 4px max(14px, env(safe-area-inset-left));
  border-bottom: 1px solid #59748633;
}
html[data-mobile-ui="true"] #sim-mobile-header strong { font-size: calc(15px * var(--app-text-scale, 1)); }
html[data-mobile-ui="true"] #sim-mobile-menu { padding: 6px 12px; }
html[data-mobile-ui="true"] #sim-mobile-dock {
  position: fixed; z-index: 35; bottom: var(--mobile-keyboard, 0px); left: 0; right: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px;
  padding: 6px max(8px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
  border-top: 1px solid #59748633;
}
html[data-mobile-ui="true"] #sim-mobile-dock button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 4px; min-width: 0; min-height: 52px; font-size: calc(11px * var(--app-text-scale, 1)); overflow-wrap: anywhere; }
html[data-mobile-ui="true"] #sim-mobile-dock button[aria-expanded="true"] { box-shadow: inset 0 -3px 0 currentColor; font-weight: 700; }
html[data-mobile-ui="true"] #sim-mobile-play { font-weight: 700; font-size: calc(13px * var(--app-text-scale, 1)) !important; }
html[data-mobile-ui="true"] #sim-links {
  display: none; position: fixed; z-index: 34; top: calc(var(--mobile-header-bottom) + 8px); bottom: auto;
  left: max(8px, env(safe-area-inset-left)) !important; right: max(8px, env(safe-area-inset-right)); transform: none;
  width: auto; max-width: none !important; max-height: calc(var(--mobile-height, 100dvh) - var(--mobile-header-bottom) - var(--mobile-dock-height) - 24px); overflow: auto;
  padding: 10px; gap: 4px; border-radius: 14px; box-shadow: 0 12px 40px #0004; white-space: normal;
}
html[data-mobile-ui="true"][data-mobile-panel="menu"] #sim-links { display: grid; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 480px) and (max-height: 499px) {
  html[data-mobile-ui="true"][data-mobile-panel="menu"] #sim-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html[data-mobile-ui="true"][data-mobile-panel="menu"][data-text-large="true"] #sim-links { grid-template-columns: minmax(0, 1fr); }
}
html[data-mobile-ui="true"] #sim-links > span { display: none; }
html[data-mobile-ui="true"] #sim-links a { justify-content: flex-start; padding: 10px 12px; text-align: left; min-height: 44px; box-sizing: border-box; font-size: calc(15px * var(--app-text-scale, 1)); border-radius: 8px; }
html[data-mobile-ui="true"] :is(.sim-mobile-sheet, .controller-deck:not(.is-collapsed)) {
  position: fixed; z-index: 33; left: max(8px, env(safe-area-inset-left)); right: max(8px, env(safe-area-inset-right)); top: auto !important;
  bottom: calc(var(--mobile-dock-height) + var(--mobile-keyboard, 0px) + 8px); width: auto; max-width: none !important;
  height: min(58dvh, calc(var(--mobile-height, 100dvh) - var(--mobile-dock-height) - 192px)); min-height: 150px;
  flex-direction: column; border-radius: 16px; border: 1px solid #59748655; box-shadow: 0 8px 35px #0005; overflow: hidden;
}
html[data-mobile-ui="true"] #sim-mobile-view { height: auto; min-height: 0; max-height: min(58dvh, calc(var(--mobile-height, 100dvh) - var(--mobile-header-bottom) - var(--mobile-dock-height) - 24px)); }
html[data-mobile-ui="true"] #sim-mobile-view-body { flex: 0 1 auto; }
html[data-mobile-ui="true"] #wave-toolbar [data-sim-action="pause"] { display: none; }
html[data-mobile-ui="true"] .sim-mobile-sheet[hidden], html[data-mobile-ui="true"] body > #sim-mobile-tray-head { display: none; }
html[data-mobile-ui="true"] .sim-mobile-sheet-head { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border-bottom: 1px solid #59748633; }
html[data-mobile-ui="true"] .sim-mobile-sheet-head h2 { margin: 0; font-size: calc(15px * var(--app-text-scale, 1)); }
html[data-mobile-ui="true"] [data-mobile-close] { font-size: 28px !important; line-height: 1; flex: 0 0 44px; }
html[data-mobile-ui="true"] :is(.sim-mobile-sheet-body, .controller-deck .developer-panel-body) { min-height: 0; flex: 1; overflow: auto; overscroll-behavior: contain; touch-action: pan-x pan-y pinch-zoom; padding: 12px; }
html[data-mobile-ui="true"] .controller-deck:not(.is-collapsed) { display: flex; }
html[data-mobile-ui="true"] .controller-deck.is-collapsed { display: none; }
html[data-mobile-ui="true"] .controller-deck :is(.developer-panel-tabs, .developer-panel-tab, .developer-panel-resize, .deck-heading, .deck-intro, .deck-folder-tabs, .wave-deck-controls) { display: none !important; }
html[data-mobile-ui="true"] .controller-deck .developer-panel-body { height: auto; border: 0; border-radius: 0; box-shadow: none; padding-bottom: 18px; }
html[data-mobile-ui="true"] #sim-mobile-tray-choice { flex: 1; min-width: 0; width: 100%; min-height: 44px; font: calc(16px * var(--app-text-scale, 1))/1.4 system-ui, sans-serif; border-radius: 8px; padding: 4px; color: inherit; background: var(--ui-column-start, #eef6f5); border: 1px solid #59748655; }
html[data-mobile-ui="true"] .controller-deck .deck-mode-tabs { display: grid; grid-template-columns: 1fr 1fr; }
html[data-mobile-ui="true"] .controller-deck .deck-actions { gap: 6px; }
html[data-mobile-ui="true"] .controller-deck :is(button, summary) { min-height: 44px; touch-action: manipulation; }
html[data-mobile-ui="true"] #wave-toolbar {
  position: static; display: block; transform: none; width: 100%; max-width: none !important; max-height: none !important; padding: 0; border: 0; box-shadow: none; background: transparent;
}
html[data-mobile-ui="true"] #wave-toolbar[hidden] { display: none; }
html[data-mobile-ui="true"] #wave-toolbar .wave-controls { display: flex; flex-wrap: wrap; gap: 8px; }
html[data-mobile-ui="true"] #wave-toolbar .wave-mode { flex: 1; }
html[data-mobile-ui="true"] #wave-toolbar .wave-choice { flex: 1 0 100%; }
html[data-mobile-ui="true"] #wave-toolbar .wave-choice select { width: 100%; max-width: none; min-height: 44px; font-size: calc(16px * var(--app-text-scale, 1)); }
html[data-mobile-ui="true"] #wave-toolbar .stage-explainers-toggle { order: 5; flex-basis: 100%; }
html[data-mobile-ui="true"] #wave-toolbar .sim-touch-controls { display: flex; margin: 12px 0 0; flex-wrap: wrap; }
html[data-mobile-ui="true"] #wave-heading { max-width: calc(100% - 24px) !important; }
html[data-mobile-ui="true"] .wave-heading .wave-note { display: none; }
html[data-mobile-ui="true"] .sim-hud[data-docked="mobile"] { position: static; width: 100%; max-width: none !important; max-height: none; padding: 12px; margin: 0 0 12px; font-size: calc(13px * var(--app-text-scale, 1)); }
html[data-mobile-ui="true"] #sim-mobile-readouts-body { display: flex; flex-direction: column; }
html[data-mobile-ui="true"] #wave-readouts { position: static; width: 100%; height: 100%; min-height: 0; flex: 1; display: flex; flex-direction: column; gap: 8px; }
html[data-mobile-ui="true"] #wave-readouts .wave-readout-frame { flex: 1; min-height: 0; overflow: auto; }
html[data-mobile-ui="true"] #wave-readouts[hidden] { display: none; }
html[data-mobile-ui="true"] #wave-readouts .wave-readout-frame[hidden] { display: none; }
html[data-mobile-ui="true"] .tour { bottom: calc(var(--mobile-dock-height) + var(--mobile-keyboard, 0px) + 8px); height: min(55dvh, calc(var(--mobile-height, 100dvh) - var(--mobile-dock-height) - 144px)); }
html[data-mobile-ui="true"] .tour-content { padding: 0; }
html[data-mobile-ui="true"] .tour-buttons { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); }
html[data-mobile-ui="true"] .tour:not(.is-collapsed) .tour-tab { min-height: 44px; }
html[data-mobile-ui="true"] .tour.is-collapsed { height: 0; }
html[data-mobile-ui="true"] :is(.zoo-dialog, #zoo-card, .experiment-dialog, .collapse-dialog) { width: calc(100% - 12px); max-width: none; max-height: calc(var(--mobile-height, 100dvh) - 12px); border-radius: 14px; }
html[data-mobile-ui="true"] :is(.zoo-dialog, .experiment-dialog, .collapse-dialog) .zoo-header { gap: 6px; padding: 8px 12px; flex-direction: row; flex-wrap: wrap; }
html[data-mobile-ui="true"] .zoo-header .zoo-eyebrow { display: none; }
html[data-mobile-ui="true"] .zoo-heading h2, html[data-mobile-ui="true"] .collapse-dialog h2 { font-size: calc(19px * var(--app-text-scale, 1)); }
html[data-mobile-ui="true"] .zoo-header-actions { width: auto; margin-left: auto; flex-wrap: wrap; }
html[data-mobile-ui="true"] .zoo-body { padding: 12px; }
html[data-mobile-ui="true"] :is(.zoo-dialog, .controller-deck) :is(input:not([type="range"]):not([type="checkbox"]):not([type="color"]), textarea, select) { font-size: calc(16px * var(--app-text-scale, 1)); }
@media (min-width: 760px), (min-width: 480px) and (max-height: 499px) {
  html[data-mobile-ui="true"] :is(.sim-mobile-sheet, .controller-deck:not(.is-collapsed)) { left: auto; width: min(480px, 52vw); height: auto; min-height: 0; top: calc(var(--mobile-header-bottom) + 8px) !important; }
  html[data-mobile-ui="true"] #sim-links { left: auto !important; width: min(420px, calc(100% - 16px)); }
  html[data-mobile-ui="true"] .tour { top: calc(var(--mobile-header-bottom) + 8px); width: min(440px, 48vw); height: auto; }
  html[data-mobile-ui="true"] .tour.is-collapsed { height: auto; width: 0; }
}