/* ═══ A Little Universe — responsive layer ═══ */

@media (max-width: 900px) {
  .doors { gap: 18px; }
  .door-art { width: clamp(84px, 24vw, 120px); }
  .scene { padding-bottom: 150px; }
}

@media (max-width: 600px) {
  .stage, .scene { padding-left: 14px; padding-right: 14px; }

  .gate-card { padding: 34px 18px 28px; }
  .digit { width: 33px; height: 46px; font-size: 1.3rem; }
  .date-input { gap: 5px; }
  .slash { font-size: 1.2rem; }

  .moon { width: 62px; height: 62px; top: 5%; right: 7%; }

  .cat-big { width: 240px; height: 240px; }

  #cat { right: 8px; }
  #cat.pos-hub, #cat.pos-pink { right: 8px; bottom: 130px; }
  #cat.pos-secret { right: 6px; left: auto; bottom: 116px; align-items: flex-end; }
  #cat.pos-secret img { width: 64px; height: 64px; }
  #cat.pos-secret .cat-bubble { right: 4px; left: auto; border-radius: 14px 14px 4px 14px; }
  #cat.pos-secret .cat-bubble::after { right: 26px; left: auto; }
  #cat img { width: 110px; height: 110px; }
  /* gallery: right edge, above guide; smaller frame so the Continue button stays clear */
  #cat.pos-gallery { left: auto; right: 6px; bottom: 118px; align-items: flex-end; }
  #cat.pos-gallery img { width: 84px; height: 84px; }
  #cat.pos-gallery .cat-bubble { left: auto; right: 4px; border-radius: 14px 14px 4px 14px; }
  #cat.pos-gallery .cat-bubble::after { left: auto; right: 26px; }
  #cat.pos-finale { right: 8px; bottom: 116px; }
  #cat.pos-finale img { width: 92px; height: 92px; }
  .cat-bubble { max-width: 195px; font-size: .84rem; padding: 9px 12px; }
  .polaroid img { width: min(52vw, 200px); }
  .btn-primary { padding: 11px 22px; }

  .doors { flex-direction: column; align-items: center; gap: 14px; }
  .door { flex-direction: row; gap: 16px; padding: 6px 14px;
          background: var(--plum-70); border-radius: 16px;
          border: 1px solid rgba(236,121,187,.25); width: min(320px, 88vw); }
  .door-art { width: 56px; }
  .door-label { font-size: .98rem; }

  .mini-player { left: 8px; right: 8px; bottom: 8px; max-width: none; padding: 7px 9px; gap: 5px; }
  .mp-info { min-width: 0; }
  .mp-title { max-width: 34vw; }
  .playlist-panel { left: 8px; right: 8px; width: auto; bottom: 78px; max-height: 55vh; }

  .guide-btn { right: 8px; bottom: 74px; padding: 8px 14px; font-size: .8rem; }
  .guide-panel { right: 8px; bottom: 120px; width: min(300px, calc(100vw - 16px)); }

  .polaroid img { width: min(70vw, 260px); }
  .polaroid { padding: 10px 10px 40px; }
}

@media (max-width: 380px) {
  .digit { width: 29px; height: 42px; font-size: 1.15rem; }
  .btn-primary { padding: 12px 26px; font-size: .95rem; }
  #cat img { width: 88px; height: 88px; }
  .cat-bubble { max-width: 170px; }
}