.hidden-postcards { margin-top: 2rem; }
.hidden-postcards .paper-surprise { margin-top: 1rem; }
.hidden-postcards .paper-surprise > summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-block: 1.1rem; line-height: 1.5; }
.airmail-route { padding: 1.5rem 0 .5rem; }
.route-cities { display: flex; justify-content: space-between; gap: 1rem; color: var(--accent); font: 1.6rem var(--serif); }
.route-cities > span:last-child { text-align: right; }
.route-cities small { display: block; color: var(--muted); font: .6rem var(--sans); letter-spacing: .12em; text-transform: uppercase; margin-top: .3rem; }
.flight-map { display: block; width: 100%; overflow: visible; }
.flight-path { stroke: #a58a6c; stroke-width: 1.3; stroke-dasharray: 4 6; }
.route-dot { fill: var(--accent); }
.paper-plane { fill: #faf0db; stroke: #743744; stroke-width: 1.7; transform-box: view-box; transform-origin: 0 0; }
.flight-status { margin: 0; color: var(--muted); text-align: center; font: italic 1.05rem var(--serif); }
.parcel-payload { position: relative; display: grid; justify-items: center; padding-block: 1rem 2rem; isolation: isolate; }
.arrival-halo { position: absolute; z-index: -1; inset: 8% 0 20%; background: radial-gradient(ellipse, #e8bc7045, #edcead1a 55%, transparent 72%); }
.surprise-person { display: block; width: min(90%, 25rem); height: auto; max-height: 40rem; object-fit: contain; margin: 0 auto; }
.arrival-copy { position: relative; z-index: 1; max-width: 27rem; text-align: center; }
.arrival-copy h3 { margin: .7rem 0 1rem; color: var(--accent); font: 2.25rem/1.1 var(--serif); }
.arrival-copy > p:last-child { color: var(--muted); font-size: .9rem; line-height: 1.8; }
.delivered-surprise[data-phase='flight'] .parcel-payload { opacity: 0; max-height: 0; overflow: hidden; padding: 0; }
.delivered-surprise[data-phase='arrived'] .arrival-halo { animation: warm-arrival 1200ms ease-out both; }
.shared-desk-card { padding: 1.3rem 0 2rem; text-align: center; transform-origin: 0 50%; }
.together-art { display: block; width: 100%; height: auto; margin: 0 auto; }
.desk-caption { margin: 1.4rem auto 1rem; color: var(--accent-dark); font: 2rem/1.2 var(--serif); }
.desk-note { max-width: 25rem; margin: 0 auto; color: var(--muted); font-size: .85rem; }
.tiny-cinema { padding: 1.2rem 0 2rem; text-align: center; }
.cinema-note { color: var(--accent-dark); font: italic 1.5rem var(--serif); margin: .5rem 0 1.5rem; }
.reel-player { display: grid; place-items: center; align-content: center; gap: 1rem; width: min(100%, 24rem); min-height: 17rem; margin: auto; padding: 1.5rem; border: 3px double #a78b6c; background: #e9dcc3; }
.play-reel { display: flex; align-items: center; justify-content: center; gap: .8rem; min-height: 44px; padding: .8rem 1rem; border: 1px solid #a78b6c; background: var(--paper-light); color: var(--accent); cursor: pointer; font: .78rem var(--sans); }
.play-reel:hover { background: #fbedd5; }
.play-reel > span { font-size: 1rem; }
.reel-placeholder { margin: 0; color: var(--muted); font: italic 1.1rem/1.5 var(--serif); }
.reel-player:has(iframe) { padding: 0; border: 0; aspect-ratio: 9 / 16; max-height: 36rem; }
.reel-player iframe { display: block; width: 100%; height: 100%; min-height: 32rem; border: 0; }
.reel-credit { margin-top: 1rem; font-size: .65rem; color: var(--muted); line-height: 1.8; }
.reel-source { display: inline-flex; align-items: center; min-height: 44px; color: var(--accent); font-size: .75rem; }
.reel-network-note { max-width: 23rem; margin: .5rem auto 0; font-size: .68rem; line-height: 1.7; color: var(--muted); }
.voyage-film { mask-image: radial-gradient(ellipse 70% 68% at 50% 52%, #000 57%, transparent 96%); }
html[data-motion='off'] { scroll-snap-type: none; }
@keyframes warm-arrival { from { opacity: 0; transform: scale(.8); } to { opacity: 1; transform: scale(1); } }
@media(max-width:700px) {
  .hidden-postcards .paper-surprise > summary { font-size: .63rem; }
  .route-cities { font-size: 1.4rem; }
  .arrival-copy h3 { font-size: 1.8rem; }
  .surprise-person { width: 96%; max-height: 32rem; }
  .desk-caption { font-size: 1.7rem; }
  .reel-player iframe { min-height: 26rem; }
}