/* ==========================================================================
   Star Letter — Expansion responsive
   Expansion media queries and reduced-motion overrides.
   ========================================================================== */

/* ---------- Responsive additions ---------- */
@media (max-width: 900px) {
  .progress-rail {
    left: 50%;
    top: auto;
    bottom: calc(env(safe-area-inset-bottom) + 7px);
    transform: translateX(-50%);
    flex-direction: row;
    gap: 7px;
    padding: 5px 9px;
    border-radius: 999px;
    background: rgba(5, 6, 15, 0.16);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
  }

  body[data-scene="dawn"] .progress-rail,
  body[data-scene="finale"] .progress-rail {
    opacity: 0;
    visibility: hidden;
  }

  .progress-rail::before { display: none; }
  .progress-dot { width: 3.5px; height: 3.5px; }
  .progress-dot.is-current { width: 6px; height: 6px; }

  .scene--cover { padding-top: calc(env(safe-area-inset-top) + 92px); }
  .cover-note { font-size: 10.5px; }

  .scene--chronicle { padding-top: calc(env(safe-area-inset-top) + 122px); }
  .chronicle-line { font-size: clamp(22px, 4.8vw, 32px); }
  .scene-advance { bottom: calc(env(safe-area-inset-bottom) + 64px); }

  .scene--wishes {
    align-items: flex-start;
    padding-top: calc(env(safe-area-inset-top) + 132px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 64px);
  }

  body[data-scene="wishes"] .moon-wrap {
    top: 62px;
    right: 10px;
    opacity: 0.26;
  }

  .wish-map { height: clamp(255px, 36vh, 310px); }
  .wish-star { width: 54px; height: 54px; }
  .wish-star__name { font-size: 11px; }
  .wish-detail__text { font-size: 14px; line-height: 1.7; }

  .finale-wrap { padding-top: calc(env(safe-area-inset-top) + 78px); }
  .certificate__frame { padding: 24px 20px 20px; }

  .scene--dawn,
  .scene--finale {
    scroll-padding-top: calc(env(safe-area-inset-top) + 72px);
  }

  .scene--dawn .letter,
  .scene--finale .certificate,
  .scene--dawn .dawn-head,
  .scene--finale .finale-head,
  .scene--dawn .dawn-actions,
  .scene--finale .finale-actions {
    scroll-margin-top: calc(env(safe-area-inset-top) + 72px);
  }
}

@media (max-width: 560px) {
  .cover-title { font-size: clamp(24px, 7vw, 30px); }
  .cover-title { line-height: 1.45; }
  .envelope-cover { width: 86vw; margin-top: 30px; }
  .cover-hint { font-size: 11px; letter-spacing: 0.14em; }
  .cover-note { letter-spacing: 0.1em; }
  .envelope-cover__address { font-size: 17px; bottom: 11%; }

  .skip-poem { bottom: calc(env(safe-area-inset-bottom) + 54px); font-size: 10px; }
  .prologue-foot { max-width: calc(100vw - 110px); }

  .heart-copy { margin-top: clamp(100px, 13.5vh, 128px); }
  .heart-title { font-size: clamp(26px, 6.8vw, 30px); line-height: 1.4; }
  .heart-hold { font-size: 10px; padding: 9px 15px; letter-spacing: 0.12em; }
  .heart-hold-zone { width: 84vw; height: 42vh; }

  .wishes-title { font-size: clamp(22px, 6vw, 27px); line-height: 1.42; }
  .wishes-sub { font-size: 11px; letter-spacing: 0.14em; }
  .wish-map { height: clamp(248px, 35vh, 288px); }
  .wish-star { width: 50px; height: 50px; }
  .wish-star__glyph { font-size: 14px; }
  .wish-star__name { font-size: 11px; letter-spacing: 0.11em; }
  .wish-star__num { font-size: 9px; }
  .wish-detail__text { font-size: 14px; line-height: 1.7; }
  .wish-detail { min-height: 76px; }

  .finale-title { font-size: clamp(27px, 7.6vw, 34px); }
  .finale-sub { letter-spacing: 0.12em; }
  .finale-chapter { flex-wrap: wrap; justify-content: center; }
  .binary { width: 82vw; margin-top: 16px; }
  .certificate__names { flex-direction: column; align-items: center; gap: 2px; text-align: center; }
  .certificate__name { font-size: 30px; }
  .certificate__from { font-size: 17px; }
  .certificate__map { margin-top: 10px; }
  .certificate__meta { flex-direction: column; gap: 6px; align-items: center; }
  .finale-actions { flex-direction: column; width: min(320px, 100%); }
  .btn-cert, .btn-finale-ghost { width: 100%; }
  .scroll-cue { font-size: 10.5px; }
}

@media (min-width: 901px) and (min-height: 760px) {
  /* Keep the dawn reading cue airy on tall desktops. */
  .scene--dawn .scroll-cue { opacity: 0.76; }
}

/* ---------- Reduced motion additions ---------- */
@media (prefers-reduced-motion: reduce) {
  .envelope-cover,
  .envelope-cover__seal,
  .pulse-dot,
  .bpm-dot,
  .binary__pair,
  .binary__dust,
  .scroll-cue i,
  .wishes-continue,
  .cover-seal { animation: none !important; }
  .envelope-cover__paper { transform: none !important; }
  .wish-star.is-lit .wish-star__glyph { animation: none !important; }
  .scene--dawn.is-active .dawn-actions { animation: none !important; opacity: 1; }
}