/* Mobile keeps the desktop's spatial composition inside a native scroll viewport. */
.scene-explorer[hidden] { display: none !important; }
html[data-mobile-scene="true"] #app *,
html[data-mobile-scene="true"] #app *::before,
html[data-mobile-scene="true"] #app *::after {
  animation: none !important;
  transition: none !important;
  will-change: auto !important;
  transform-style: flat !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html[data-mobile-scene="true"] .scene { perspective: none !important; }
html[data-mobile-scene="true"] :is(.surface-scan, .spatial-depth-field, .entry-particles, .entry-orbit, .ambient-orbit, .clock-halo, .sound-switch-pulse, .field-scan, .identity-focus-shade) { display: none !important; }
html[data-mobile-scene="true"] :is(.world-background, .sao-window, .hud-glass, .hud-widget, .identity-composition, .home-workspace, .video-card, .video-gallery-window) { filter: none !important; }
html[data-mobile-scene="true"] :is(.sao-window, .hud-glass)::before { filter: none !important; }
html[data-mobile-scene="true"] :is(.home-depth, .world-vignette)::after,
html[data-mobile-scene="true"] .world-background::after { display: none; }
html[data-mobile-scene="true"] .quality-control { display: none; }
html[data-mobile-scene="true"] .theme-switch { top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); min-height: 44px; }
html[data-mobile-scene="true"] .sound-switch { top: max(12px, env(safe-area-inset-top)); right: max(86px, calc(env(safe-area-inset-right) + 74px)); width: 44px; height: 44px; }
html[data-mobile-scene="true"] .theme-switch-label { display: none; }
html[data-mobile-scene="true"][data-mobile-dialog="true"] :is(.theme-switch, .sound-switch) { visibility: hidden; }
html[data-mobile-scene="true"] .theme-switch-track { width: 52px; height: 26px; }
html[data-mobile-scene="true"] .theme-switch-track i { width: 18px; height: 18px; }
html[data-mobile-scene="true"][data-theme="dark"] .theme-switch-track i { transform: translateX(26px); }
html[data-mobile-scene="true"] .scene.is-gallery-open ~ .scene-explorer { display: none; }
html[data-mobile-scene="true"] .mobile-scene-viewport {
  position: absolute;
  inset: 0 0 calc(148px + env(safe-area-inset-bottom));
  overflow: auto;
  overscroll-behavior: none;
  touch-action: pan-x pan-y pinch-zoom;
  scrollbar-width: none;
  background: var(--scene-base);
}
html[data-mobile-scene="true"] .mobile-scene-viewport::-webkit-scrollbar { display: none; }
html[data-mobile-scene="true"] .mobile-scene-spacer { position: relative; margin-inline: auto; overflow: hidden; }
html[data-mobile-scene="true"] .mobile-scene-stage { position: absolute; left: 0; top: 0; width: 1280px; height: 900px; transform-origin: 0 0; }
html[data-mobile-scene="true"] .mobile-scene-stage .world-background { inset: 0; transform: none; }
html[data-mobile-scene="true"][data-theme="dark"] body.is-dark-world-media-ready .mobile-scene-stage .world-background { background-image: url("./assets/world-background-dark.webp"); }
html[data-mobile-scene="true"] .mobile-scene-stage :is(.home-header, .world-header) {
  position: absolute; left: 260px; top: 60px; width: 760px; min-height: 76px;
  display: grid; grid-template-columns: 1fr auto 1fr; padding: 12px 22px; transform: none;
}
html[data-mobile-scene="true"] :is(.home-title, .world-location) { display: grid; }
html[data-mobile-scene="true"] .world-clock strong { font-size: 20px; }
html[data-mobile-scene="true"] .world-clock span { font-size: 12px; }
html[data-mobile-scene="true"] .user-chip { min-height: 56px; font-size: 20px; }
html[data-mobile-scene="true"] .home-workspace {
  position: absolute; inset: 245px auto auto 220px; width: 950px;
  display: grid; grid-template-columns: 640px 250px; gap: 60px; align-items: center; transform: none; perspective: none;
}
html[data-mobile-scene="true"] .content-window {
  width: 640px; height: 540px; min-height: 0; padding: 88px 80px 32px;
  overflow: visible; transform: none;
}
html[data-mobile-scene="true"] .content-view { max-height: 420px; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; }
html[data-mobile-scene="true"] .view-heading { display: grid; grid-template-columns: 1fr 180px; column-gap: 16px; margin-bottom: 24px; }
html[data-mobile-scene="true"] .view-heading > p:last-child { max-width: 180px; margin: 0; text-align: right; font-size: 18px; line-height: 1.7; }
html[data-mobile-scene="true"] .content-view h1 { font-size: 48px; line-height: 1.15; }
html[data-mobile-scene="true"] .content-view .eyebrow { font-size: 14px; }
html[data-mobile-scene="true"] .memory-list button { min-height: 90px; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; padding: 16px 4px; }
html[data-mobile-scene="true"] .memory-list strong { font-size: 22px; line-height: 1.5; }
html[data-mobile-scene="true"] .memory-list small { font-size: 14px; }
html[data-mobile-scene="true"] .memory-list time { grid-column: auto; font-size: 12px; }
html[data-mobile-scene="true"] .archive-space-link { min-height: 56px; padding-inline: 10px; font-size: 16px; white-space: nowrap; }
html[data-mobile-scene="true"] .profile-window { display: block; align-self: end; margin-bottom: 20px; width: 250px; min-height: 350px; padding: 62px 24px 24px; transform: none; }
html[data-mobile-scene="true"] .profile-window > strong { font-size: 32px; }
html[data-mobile-scene="true"] .profile-window > span { font-size: 14px; }
html[data-mobile-scene="true"] .profile-window dl { font-size: 16px; }
html[data-mobile-scene="true"] .home-node-rail {
  position: absolute; inset: 355px auto auto 92px; display: flex; flex-direction: column;
  padding: 0; background: none; border: 0; box-shadow: none; transform: none;
}
html[data-mobile-scene="true"] .home-node { width: 72px; height: 72px; }
html[data-mobile-scene="true"] .home-node svg { width: 28px; }
html[data-mobile-scene="true"] .home-node > span { display: block; opacity: 1; left: 50%; top: calc(100% + 3px); font-size: 12px; transform: translateX(-50%); border: 0; background: var(--panel-background-strong); }
html[data-mobile-scene="true"] .rail-stem { display: block; height: 48px; }
html[data-mobile-scene="true"] .project-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
html[data-mobile-scene="true"] .project-list article { min-height: 240px; padding: 18px 14px; }
html[data-mobile-scene="true"] .project-list article strong { font-size: 23px; }
html[data-mobile-scene="true"] .project-list article p { font-size: 19px; }
html[data-mobile-scene="true"] .identity-profile { grid-template-columns: 110px minmax(0, 1fr); gap: 24px; }
html[data-mobile-scene="true"] .identity-profile p { font-size: 21px; line-height: 1.75; }
html[data-mobile-scene="true"] .contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html[data-mobile-scene="true"] .contact-link { min-height: 76px; }
html[data-mobile-scene="true"] .contact-link strong { font-size: 19px; }
html[data-mobile-scene="true"] .player-vitals { top: 158px; left: 42px; width: 230px; transform: none; opacity: 0.85; }
html[data-mobile-scene="true"] .ambient-interface { inset: 150px 44px 80px; opacity: 0.7; }
html[data-mobile-scene="true"] .ambient-readout { display: flex; }
html[data-mobile-scene="true"] .ambient-pods { display: none; }
html[data-mobile-scene="true"] :is(.home-footer, .world-footer) { display: flex; left: 38px; right: 38px; bottom: 26px; font-size: 12px; }
html[data-mobile-scene="true"] .world-footer span:last-child { display: none; }
html[data-mobile-scene="true"] .identity-composition { inset: 0; width: 1280px; height: 900px; }
html[data-mobile-scene="true"] .identity-window { top: 265px; left: 390px; width: 500px; min-height: 445px; padding: 84px 40px 46px; transform: none; }
html[data-mobile-scene="true"] .identity-window h1 { font-size: 38px; }
html[data-mobile-scene="true"] .identity-window .window-copy { font-size: 20px; }
html[data-mobile-scene="true"] .identity-window :is(.eyebrow, label) { font-size: 16px; }
html[data-mobile-scene="true"] .identity-window input { font-size: 26px; min-height: 62px; }
html[data-mobile-scene="true"] .identity-window .confirm-button { right: 24px; bottom: 52px; min-height: 66px; font-size: 18px; }
html[data-mobile-scene="true"] .identity-window .window-foot { left: 40px; right: 40px; font-size: 12px; }
html[data-mobile-scene="true"] .identity-seal { display: grid; }
html[data-mobile-scene="true"] .node-rail { display: flex; left: 286px; top: 405px; transform: none; }
html[data-mobile-scene="true"] .world-scene .node-button { width: 58px; height: 58px; }
html[data-mobile-scene="true"] .world-note { display: block; left: 930px; bottom: 120px; width: 280px; padding: 24px; transform: none; }
html[data-mobile-scene="true"] .world-note strong { font-size: 25px; }
html[data-mobile-scene="true"] .world-note p { font-size: 20px; }
html[data-mobile-scene="true"] .world-note dl div { font-size: 16px; }
html[data-mobile-scene="true"] .welcome-window,
html[data-mobile-scene="true"] .identity-composition.is-welcome .welcome-window { top: 270px; left: 390px; width: 500px; padding: 60px 40px 40px; transform: none; }
html[data-mobile-scene="true"] .welcome-window h2 { font-size: 48px; }
html[data-mobile-scene="true"] .enter-world-button { min-height: 68px; font-size: 20px; }
html[data-mobile-scene="true"] .system-hud-desktop { inset: 155px 40px 65px; }
html[data-mobile-scene="true"] .widget-session { display: block; left: 0; top: 0; width: 230px; transform: none; }
html[data-mobile-scene="true"] .widget-performance { display: none; }
html[data-mobile-scene="true"] .widget-rings { display: block; bottom: 0; left: 0; transform: none; }
html[data-mobile-scene="true"] .widget-network { display: block; top: 40px; right: 0; transform: none; }
html[data-mobile-scene="true"] .widget-device { display: none; }
html[data-mobile-scene="true"] .hud-quick-actions { top: 12px; right: 12px; transform: none; }

/* A fixed, unscaled dialog keeps covers, text, and close controls usable. */
html[data-mobile-scene="true"] .video-gallery-overlay { padding: 16px; perspective: none; }
html[data-mobile-scene="true"] .video-gallery-backdrop { background: rgba(3, 12, 28, 0.82); }
html[data-mobile-scene="true"] .video-gallery-window { width: calc(100vw - 32px); min-height: 0; max-height: calc(100dvh - 32px); overflow-y: auto; padding: 72px 22px 26px; transform: none !important; clip-path: none !important; }
html[data-mobile-scene="true"] .video-gallery-heading { display: block; }
html[data-mobile-scene="true"] .video-gallery-heading h2 { font-size: clamp(26px, 7vw, 36px); }
html[data-mobile-scene="true"] .video-gallery-heading > p:last-child { margin-top: 12px; text-align: left; }
html[data-mobile-scene="true"] .video-gallery-grid { grid-template-columns: 1fr; max-height: none; overflow: visible; padding-right: 0; }
html[data-mobile-scene="true"] .video-gallery-close { position: fixed; top: max(24px, env(safe-area-inset-top)); right: 24px; width: 44px; height: 44px; z-index: 10; background: var(--panel-background-strong); }
html[data-mobile-scene="true"] .video-card { transform: none; filter: none; }

.scene-explorer {
  position: fixed; z-index: 45; left: max(12px, env(safe-area-inset-left)); right: max(12px, env(safe-area-inset-right));
  bottom: max(10px, env(safe-area-inset-bottom)); max-width: 480px; margin-inline: auto;
  color: var(--ink); background: var(--panel-background-strong); border: 1px solid var(--panel-inner-edge);
  border-radius: 16px; padding: 10px 12px; box-shadow: 0 6px 24px rgba(2, 24, 46, 0.18);
}
.explorer-heading { display: flex; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 7px; }
.explorer-heading > span { font: 600 10px var(--display); letter-spacing: 0.1em; color: var(--sky-deep); }
.explorer-heading small { font: 11px var(--zh); opacity: 0.7; }
.explorer-row { display: flex; align-items: center; gap: 14px; }
.explorer-map { flex: 0 0 94px; width: 94px; height: 67px; position: relative; padding: 0; overflow: hidden; border: 1px solid var(--panel-inner-edge); border-radius: 5px; background: var(--scene-base); }
.explorer-map i { position: absolute; border: 1px solid var(--prism-cyan); background: color-mix(in srgb, var(--prism-cyan) 12%, transparent); opacity: 0.6; }
.map-header { left: 19px; top: 4px; width: 55px; height: 6px; }
.map-nav { left: 6px; top: 26px; width: 5px; height: 20px; }
.map-main { left: 16px; top: 18px; width: 46px; height: 38px; }
.map-profile { left: 66px; top: 31px; width: 18px; height: 24px; }
.map-viewport { position: absolute; left: 0; top: 0; border: 1px solid var(--ink); background: color-mix(in srgb, var(--ink) 10%, transparent); pointer-events: none; }
.explorer-actions { flex: 1; min-width: 0; }
.explorer-zoom, .explorer-jumps { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.explorer-zoom output { font: 12px var(--display); letter-spacing: 0.08em; }
.scene-explorer button { cursor: pointer; color: inherit; touch-action: manipulation; }
.explorer-actions button { min-width: 44px; min-height: 44px; padding: 3px 6px; border: 0; border-radius: 6px; background: transparent; font: 12px var(--zh); }
.explorer-zoom button { font-size: 24px; line-height: 1; }
.explorer-actions button:active { background: color-mix(in srgb, var(--prism-cyan) 18%, transparent); }
.explorer-actions button:disabled { opacity: 0.3; }
.scene-explorer button:focus-visible { outline: 2px solid var(--prism-cyan); outline-offset: 2px; }
@media (max-height: 500px) {
  html[data-mobile-scene="true"] .mobile-scene-viewport { bottom: calc(76px + env(safe-area-inset-bottom)); }
  .scene-explorer { padding: 6px 12px; }
  .explorer-heading, .explorer-map { display: none; }
  .explorer-actions { display: flex; gap: 16px; justify-content: space-between; }
  .explorer-zoom { gap: 6px; }
  .explorer-jumps { flex: 1; }
}
