@media (max-width: 480px) {
  .story-text { font-size: 1.5rem; }
  .layout-quote .story-text { font-size: 1.75rem; }
  .ending-title { font-size: 2rem; }
  .ending-subtitle { font-size: 1.1rem; }
  .ending-credit { font-size: 1.3rem; }
  .opening-line { font-size: 1.35rem; padding: 0 0.5rem; }
  .opening-line.dear { font-size: 2.1rem; }
  .opening-heart { font-size: 2.6rem; }
  .opening-begin-btn { padding: 13px 34px; font-size: 1.05rem; }
  .envelope-wrapper { width: 240px; height: 156px; }
  .letter-paper { height: 300px; padding: 1.6rem 1.3rem; }
  .handwritten { font-size: 1.7rem; }
  .header-title { font-size: 0.95rem; }
  .interactive-item, .heart-icon, .gift-box, .flower-icon, .star-icon { font-size: 64px; }
  .nav-arrow-btn { width: 38px; height: 38px; }
  .nav-prev { left: 8px; }
  .nav-next { right: 8px; }
}

@media (max-height: 640px) {
  .envelope-wrapper { margin-top: 6px; }
  .letter-paper { height: 260px; }
  .ending-credit { margin-bottom: 1.4rem; }
}

@media (min-width: 900px) {
  .story-text { font-size: 2.1rem; }
  .layout-quote .story-text { font-size: 2.4rem; }
  .opening-line { font-size: 2rem; }
  .opening-line.dear { font-size: 3rem; }
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}