/* Single mobile embedded-preview layout owner; desktop and standalone unchanged. */
@media (max-width: 900px) {
  html:has(.resource-workspace[data-mobile-view="preview"] .has-browser-preview), body.resource-browser-page:has(.resource-workspace[data-mobile-view="preview"] .has-browser-preview) { height: 100dvh; overflow: hidden; }
  body.resource-browser-page:has(.resource-workspace[data-mobile-view="preview"] .has-browser-preview) { display: flex; flex-direction: column; }
  body.resource-browser-page:has(.resource-workspace[data-mobile-view="preview"] .has-browser-preview) > .site-header { flex: 0 0 auto; }
  body.resource-browser-page main.resource-browser-main:has(.resource-workspace[data-mobile-view="preview"] .has-browser-preview) { display: flex; flex-direction: column; flex: 1; min-height: 0; padding-bottom: 0 !important; overflow: hidden; }
  .resource-browser-main:has(.resource-workspace[data-mobile-view="preview"] .has-browser-preview) .resource-browser-head { flex: 0 0 auto; }
  .resource-workspace:has(.has-browser-preview)[data-mobile-view="preview"] { flex: 1; min-height: 0; }
  .resource-workspace[data-mobile-view="preview"] > .has-browser-preview { height: 100%; }
  .resource-workspace[data-mobile-view="preview"] { display: block; height: auto; min-height: 0; overflow: hidden; }
  .resource-workspace[data-mobile-view="preview"] > .resource-folders,
  .resource-workspace[data-mobile-view="preview"] > .resource-files,
  .resource-workspace[data-mobile-view="preview"] > .resource-resizer { display: none !important; }
  .resource-workspace[data-mobile-view="preview"] > .resource-preview-pane { display: flex; position: relative; width: 100%; min-width: 0; }
  .has-browser-preview .resource-mobile-back { display: inline-flex; }
  .resource-preview-pane.has-browser-preview { min-height: 0; }
  .resource-preview-pane.has-browser-preview > header { min-height: 0; flex: 0 0 auto; padding: 8px 12px; flex-direction: row; }
  .has-browser-preview .workspace-kicker,
  .has-browser-preview .resource-preview-pane__meta { display: none; }
  .has-browser-preview .resource-preview-body {
    flex: 1 1 0; height: auto; min-height: 0; overflow: hidden;
  }
  .browser-preview { display: flex; flex-direction: column; width: 100%; height: 100%; min-height: 0; min-width: 0; background: var(--resource-paper); }
  .browser-preview [hidden] { display: none !important; }
  .browser-preview button, .browser-preview input, .browser-preview select {
    border-radius: 0; min-height: 44px; font: inherit;
  }
  .browser-preview__files { flex: 0 0 auto; width: 100%; min-width: 0; margin: 0; padding: 8px 12px; border: 1px solid var(--resource-border); border-left: 3px solid var(--resource-orange); background: #fff; text-overflow: ellipsis; }
  .browser-preview__stage { flex: 1 1 0; min-height: 0; min-width: 0; display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; }
  .browser-preview__stage > img, .browser-preview__stage > video { display: block; width: 100%; height: 100%; min-height: 0; object-fit: contain; }
  .browser-preview__stage > p { padding: 12px; text-align: center; }
  .browser-preview__thumbs { position: relative; display: flex; flex: 0 0 auto; gap: 8px; overflow-x: auto; padding: 8px 12px; scrollbar-width: none; mask-image: linear-gradient(to right, transparent, #000 12px, #000 calc(100% - 12px), transparent); }
  .browser-preview__thumbs::-webkit-scrollbar { display: none; }
  .browser-preview__thumbs > button { position: relative; flex: 0 0 72px; height: 48px; padding: 0; border: 2px solid var(--resource-border); background: #fff; }
  .browser-preview__thumbs img { width: 100%; height: 100%; object-fit: contain; }
  .browser-preview__thumbs span { position: absolute; bottom: 0; left: 0; padding: 0 4px; font-size: .65rem; background: var(--ink); color: #fff; }
  .browser-preview__thumbs [aria-current="page"] { border-color: var(--resource-orange); transform: translateY(-2px); box-shadow: 0 3px 5px #d65b2f55; }
  .browser-preview__pager { flex: 0 0 auto; display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid var(--resource-border); background: #fff; }
  .browser-preview__pager > *, .browser-preview__pager input, .browser-preview__pager button { min-width: 0; width: 100%; margin: 0; }
  .browser-preview__pager button { padding: 8px 4px; white-space: nowrap; }
  .browser-preview__pager > div > * { height: 100%; text-align: center; background: var(--resource-paper); color: var(--ink); border: 1px solid var(--resource-border); }
}