@media (max-width: 1279px) {
  .site-header { grid-template-columns: 1fr auto; }
  .site-header__route { display: none !important; }
  .sw-copy__title { font-size: clamp(2.5rem, 4.8vw, 4.4rem) !important; }
  .express-proof { right: clamp(4.5rem, 6vw, 6rem); width: min(31vw, 25rem); }
}

@media (max-width: 960px) {
  .site-header__controls { gap: .3rem; }
  .utility-button { padding-inline: .6rem; }
  #sound-toggle { display: none; }
}

@media (max-width: 860px), (hover: none) and (pointer: coarse) {
  :root { --header-height: 4.25rem; }
  .site-header { grid-template-columns: auto 1fr; padding: .7rem max(1rem, env(safe-area-inset-left)); }
  .wordmark span:last-child { display: none; }
  .site-header__controls { justify-content: flex-start; width: min(100%, calc(100vw - 4.25rem)); overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; }
  .site-header__controls::-webkit-scrollbar { display: none; }
  /* Pushes the controls to the right edge; an auto margin collapses to 0 when the row overflows, so scrolling still starts at the first button. */
  .site-header__controls > :first-child { margin-left: auto; }
  .utility-button { min-height: 2.75rem; font-size: .58rem; }

  /* Native portrait placeholder composition; Phase 2B replaces it with a separately
     generated 9:16 still. Desktop imagery is never requested on this breakpoint. */
  .sw-scene::before { width: 84vw; height: 58vh; aspect-ratio: auto; right: 8vw; top: 8vh; translate: 0; transform: perspective(900px) rotateX(5deg) rotateY(-3deg); border-radius: 44% 5% 38% 7%; }
  .sw-scene::after { width: 58vw; height: 16vh; right: 12vw; top: 24vh; bottom: auto; }
  .sw-scene__placeholder-label { top: 11vh; right: 11vw; }
  .sw-copylayer::before { width: 100% !important; height: 66% !important; top: auto !important; bottom: 0 !important; background: linear-gradient(0deg, var(--porcelain) 28%, color-mix(in srgb, var(--porcelain) 88%, transparent) 62%, transparent 100%) !important; }
  .sw-copy { inset: auto 1.1rem calc(7.2rem + env(safe-area-inset-bottom)) !important; width: auto !important; max-width: 38rem !important; }
  .sw-copy__title { max-width: 13ch; font-size: clamp(2rem, 9.2vw, 3.25rem) !important; }
  .sw-copy__body { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; font-size: .9rem !important; }
  .sw-copy__tags { display: none !important; }
  .sw-route { top: var(--header-height) !important; right: .5rem !important; left: .5rem !important; transform: none !important; flex-direction: row !important; justify-content: center; gap: .35rem !important; }
  .sw-route::before { left: 2rem !important; right: 2rem !important; top: 50% !important; bottom: auto !important; width: auto !important; height: 1px !important; transform: none !important; }
  .sw-route__label { display: none !important; }
  .sw-hint { display: none !important; }
  .journey-actions { left: 1rem; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom)); }
  .primary-action, .secondary-action { width: 100%; min-height: 3rem; }
  .privacy-note { left: 1rem; right: 1rem; bottom: calc(4.6rem + env(safe-area-inset-bottom)); max-width: none; font-size: .55rem; text-align: left; }
  .express-proof { left: 1rem; right: 1rem; top: auto; bottom: calc(4.8rem + env(safe-area-inset-bottom)); width: auto; max-height: min(28dvh, 14rem); overflow: auto; padding: .75rem .85rem; }
  .express-proof p:last-child { font-size: .72rem; }
  body.has-express-proof .sw-copy { top: calc(var(--header-height) + 3.5rem) !important; bottom: auto !important; max-height: 29dvh; overflow: hidden; }
  body.has-express-proof .sw-copy__title { font-size: clamp(1.8rem, 8vw, 2.7rem) !important; }
  body.has-express-proof .sw-copy__body { -webkit-line-clamp: 2; }
  .hotspot__label { display: none; }
  .hotspot { --x: min(84%, var(--x)); }
  .hotspot__marker { width: 2.4rem; }
  .discovery-panel__backdrop { background: color-mix(in srgb, var(--charcoal) 22%, transparent); }
  .discovery-panel__sheet { top: auto; right: 0; bottom: 0; width: 100%; max-height: 78dvh; border-top-width: .2rem; padding: 1.4rem 1.2rem calc(1.5rem + env(safe-area-inset-bottom)); translate: none; }
}

@media (max-width: 520px) {
  .world-only#motion-toggle { max-width: 7.8rem; overflow: hidden; text-overflow: ellipsis; }
}

@media (max-width: 860px) and (orientation: landscape) {
  body.has-express-proof .sw-copy { top: 23% !important; left: 1rem !important; right: auto !important; width: 45vw !important; max-height: 56vh; }
  .express-proof { left: auto; right: 3.6rem; bottom: 4rem; width: 42vw; max-height: 48vh; }
}

@media (min-width: 861px) and (max-height: 760px) {
  .sw-copy { top: 45% !important; }
  .sw-copy__title { font-size: clamp(2.3rem, 4.4vw, 4.2rem) !important; }
  .sw-copy__body { margin-top: .9rem !important; }
  .sw-copy__tags { margin-top: .8rem !important; }
  .express-proof { bottom: 5.5rem; }
}

@media (min-width: 861px) {
  body.zoom-layout .site-header { position: absolute; }
}