/* 照片页正式版：沿用生日情书的暖粉、纸张与手写感。 */
#memories .inner-scene-content {
  padding-bottom:calc(104px + env(safe-area-inset-bottom));
}

#app.nav-hidden #memories .inner-scene-content {
  padding-bottom:calc(30px + env(safe-area-inset-bottom));
}

#memories .chapter-heading {
  margin-top:27px;
}

#memories .chapter-heading h1 {
  color:#f3dfd3;
  letter-spacing:6px;
  margin-top:12px;
}

#memories .chapter-subtitle {
  font-family:var(--serif);
  font-style:normal;
  color:#d8b6b8;
  font-size:12px;
  letter-spacing:1px;
}

#memories .memories-introduction {
  flex:none;
  max-width:31em;
  margin:20px auto 0;
  color:#bca9a5;
  font-size:11px;
  line-height:2;
  letter-spacing:.5px;
  text-align:justify;
}

#memories .album-area {
  flex:none;
  min-height:0;
  padding-top:17px;
}

#memories .album-scribble {
  right:9px;
  font-size:15px;
  color:#c8aa92;
}

#memories .photo-stage {
  width:82%;
  max-width:290px;
  aspect-ratio:.76;
  margin:17px 0 23px;
}

#memories .polaroid {
  padding:10px 10px 0;
  transform:rotate(-2deg);
}

#memories .polaroid:hover {
  transform:rotate(-1deg) translateY(-2px);
}

#memories .photo-stage.is-changing .polaroid {
  opacity:0;
  transform:translateX(-12px) rotate(-4deg);
}

#memories .photo-image-wrap {
  background:#e5ddd3;
}

#memories .photo-image-wrap>img {
  object-fit:contain;
}

#memories .polaroid-note {
  flex:none;
  min-height:52px;
  padding:13px 3px;
  gap:8px;
}

#memories #photo-title {
  font-family:var(--hand);
  font-size:15px;
  line-height:1.6;
  letter-spacing:.5px;
}

#memories #photo-date {
  font-family:var(--sans);
  font-size:9px;
  color:#856e65;
}

#memories .album-controls {
  gap:37px;
}

#memories .round-button,
#photo-dialog .round-button {
  width:44px;
  height:44px;
  flex:none;
}

#memories .photo-dots {
  height:28px;
  margin:7px 0 10px;
  gap:0;
}

#memories .photo-dots button {
  width:28px;
  height:28px;
  padding:12px;
}

#memories .photo-caption {
  width:100%;
  max-width:29em;
  min-height:5.7em;
  font-size:12px;
  line-height:1.9;
  letter-spacing:.4px;
  color:#dec8bc;
  text-align:center;
}

#memories .photo-hint {
  margin-top:9px;
  color:#aa9290;
  font-size:9px;
  letter-spacing:.7px;
}

#memories .memories-closing {
  flex:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  margin:30px auto 0;
  padding-top:25px;
  max-width:30em;
  border-top:1px solid #d2b7a42b;
  color:#d8b2bc;
}

#memories .memories-closing p {
  font-family:var(--serif);
  color:#c7b3a9;
  font-size:12px;
  line-height:2.1;
  letter-spacing:.5px;
  text-align:center;
}

#memories .chapter-next {
  margin-top:18px;
  min-height:44px;
  font-size:10px;
}

#photo-dialog {
  max-height:calc(100svh - 24px);
  padding:16px;
  overscroll-behavior:contain;
}

#photo-dialog .preview-toolbar {
  position:sticky;
  top:-16px;
  z-index:1;
  background:#1c181f;
  padding:4px 0 8px;
  margin-bottom:8px;
}

#photo-dialog>img {
  height:auto;
  max-height:61svh;
  min-height:0;
  background:#17131a;
}

#photo-dialog .preview-photo-heading {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin-top:18px;
}

#preview-photo-title {
  font-family:var(--serif);
  font-size:15px;
  color:#ead2c3;
  line-height:1.7;
}

#preview-meta {
  color:#b49b90;
  font-size:10px;
  white-space:nowrap;
}

#preview-caption {
  font-size:12px;
  line-height:1.9;
  color:#c7b1a7;
  margin-top:8px;
}

#photo-dialog .preview-controls {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:15px;
}

#photo-dialog .preview-note {
  font-size:10px;
  margin:0;
  letter-spacing:.4px;
}

@media(max-height:650px) {
  #memories .chapter-heading { margin-top:18px; }
  #memories .photo-stage { width:80%; max-width:260px; }
  #memories .memories-introduction { margin-top:16px; }
}

@media(prefers-reduced-motion:reduce) {
  #memories .polaroid { transition:none; }
}