@media (max-width: 699px) {
  .stage {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    aspect-ratio: auto;
    border-radius: 0;
  }

  .scene-header {
    padding-top: calc(var(--safe-top) + 3.5%);
  }
}

@media (min-width: 700px) {
  .stage {
    border: 1px solid rgba(229, 195, 144, 0.14);
    border-radius: 16px;
  }

  body::after {
    content: "记忆照相馆 · 七夕夜";
    position: fixed;
    left: calc(50% + min(100vw, calc(100dvh * 9 / 16)) / 2 + 2rem);
    bottom: 2rem;
    color: rgba(231, 217, 194, 0.28);
    font-family: var(--font-display);
    font-size: 0.72rem;
    letter-spacing: 0.18em;
    writing-mode: vertical-rl;
  }
}

@media (max-width: 430px) {
  .scene-header { padding-inline: 6%; }
  .memory-rolls { width: 91%; }
  .memory-roll { min-height: 146px; }
  .photo-card { width: 76%; }
  .film-strip { width: 92%; }
}

@media (max-width: 390px) {
  .scene-copy { padding-inline: 6%; }
  .memory-rolls { gap: 0.42rem; }
  .memory-roll { padding-inline: 0.28rem; }
  .memory-roll strong { font-size: 0.98rem; }
  .darkroom-workbench { width: 90%; }
  .letter-paper { padding: 0.85rem; }
}

@media (max-height: 760px) and (orientation: portrait) {
  .scene-header { padding-top: calc(var(--safe-top) + 2%); }
  .scene-header p:last-child { margin-top: 0.4rem; }
  .memory-rolls { margin-top: 0.35rem; }
  .memory-roll { min-height: 136px; }
  .photo-card { width: 65%; }
  .gallery-story { margin-top: 0.65rem; max-height: 3.6em; }
  .interaction-note { margin-block: 0.4rem 0.55rem; }
  .clue-source { min-height: 64px; }
  .developing-tray { margin-top: 0.65rem; padding: 0.65rem; }
  .photo-paper { width: 63%; margin-top: 0.65rem; }
  .film-strip { padding-block: 0.75rem; }
  .film-frame { min-height: 44px; }
}

@media (orientation: landscape) and (max-height: 540px) {
  .stage {
    width: min(100vw, calc(100dvh * 16 / 9));
    height: 100dvh;
    aspect-ratio: 16 / 9;
  }

  .scene-header {
    width: 42%;
    align-self: flex-start;
    padding: calc(var(--safe-top) + 4%) 4% 2%;
    text-align: left;
  }

  .scene-header::after { margin-left: 0; }
  .memory-rolls { width: 52%; margin: 5% 4% 0 auto; }
  .confession-entry { width: 44%; margin-left: 45%; }
  .darkroom-workbench { width: 52%; margin: -18% 4% 0 auto; }
  .photo-card { width: 27%; margin: -18% 13% 0 auto; }
  .gallery-story { width: 40%; margin: -22% auto 0 5%; }
  .scene-gallery > .interaction-note,
  .scene-gallery > .primary-button { margin-left: -45%; }
  .film-strip { width: 52%; margin: -16% 4% 0 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .photo-card-inner { transform-style: flat; }
  .photo-card.is-flipped .photo-card-inner { transform: none; }
  .photo-card.is-flipped .photo-front { visibility: hidden; }
  .photo-card.is-flipped .photo-back { transform: none; }
  .film-frame-empty { animation: none; }
  .door-window { animation: none; }
  .scene.is-entering { animation: none; }
}