/* Stable phone layout height is captured once by viewport-stability.js. */
/* Direct, gentle responses belong to their objects rather than a control panel. */
.develop-touch,.water-touch{position:absolute;z-index:5;display:block;min-width:44px;min-height:44px;margin:0;padding:0;border:0;background:transparent;border-radius:12px;touch-action:pan-y;cursor:pointer;-webkit-tap-highlight-color:transparent}
.develop-touch{inset:17% 16% 19%;border-radius:7%}
.develop-touch:focus-visible,.water-touch:focus-visible{outline:2px solid #546a9d;outline-offset:3px;background:#fffae60a}
.water-touch{inset:10% 5% 12%;border-radius:12px}
/* A new memory fades in alone; outgoing words must never overlap its caption. */
.has-scene-motion .develop-print:not(.is-current),.has-scene-motion .developing-captions p:not(.is-current),.has-scene-motion .memory-whispers p:not(.is-current){opacity:0;visibility:hidden;transition:none}
.has-scene-motion .developing-section.is-developing .developing-captions p,.has-scene-motion .developing-section.is-developing .memory-whispers p{opacity:0;visibility:hidden;transform:translateY(6px)}
.development-status{position:absolute;top:38px;left:0;right:0;min-height:48px;padding-left:8%;color:#777f74;font:26px/1.4 var(--hand);pointer-events:none}
.tray-touch-glint{position:absolute;z-index:4;inset:17% 16% 19%;border-radius:7%;pointer-events:none;background:linear-gradient(110deg,transparent 34%,#fffdf58c 43%,#eef9ffb3 47%,transparent 55%);background-size:250% 100%;mix-blend-mode:screen;opacity:0}
.boats-water{overflow:clip}
/* Moving the boats must not invalidate layout or become a scroll anchor. */
.has-scene-motion .boat-wrap{left:0;top:0;transform:translate3d(var(--boat-px,0px),var(--boat-py,0px),0) translate(-50%,-50%) rotate(var(--boat-rotate));will-change:transform;overflow-anchor:none}
.touch-ripple{position:absolute;z-index:4;display:block;max-width:none;border:2px solid #fffef3d9;border-radius:50%;box-shadow:0 0 0 2px #698c9052,0 0 0 11px #f6fffc38,0 0 0 21px #789ca545,inset 0 0 0 8px #fafff32e;pointer-events:none;will-change:transform,opacity}
.paper-boat.has-touch-rock,.swing.has-touch-push{animation-play-state:paused!important}
.swing-invitation{scroll-margin-block:80px 110px}
.water-response{position:absolute;left:12%;right:12%;bottom:1%;z-index:6;min-height:1.5em;margin:0;text-align:center;font:22px/1.35 var(--hand);color:#718a86;pointer-events:none}
body:not(.has-scene-motion) .develop-touch,body:not(.has-scene-motion) .water-touch,body:not(.has-scene-motion) .development-status,body:not(.has-scene-motion) .water-response,.has-long-copy .develop-touch,.has-long-copy .water-touch,.has-long-copy .development-status,.has-long-copy .water-response{display:none}
@media(max-width:800px){.development-status{padding:0 5%;text-align:center;top:37px}.water-response{font-size:20px;bottom:0;left:8%;right:8%}}
@media(max-width:600px) and (max-height:700px){:where(html:not(.archive-stable-viewport)) .development-status{top:28px;font-size:22px}:where(html:not(.archive-stable-viewport)) .water-response{font-size:16px;line-height:1.2;left:5%;right:5%;bottom:0}:where(html:not(.archive-stable-viewport)) .swing-pair{height:calc(var(--archive-svh,1svh) * 40)}:where(html:not(.archive-stable-viewport)) .tomorrow-copy{padding-top:calc(var(--archive-svh,1svh) * 43)}:where(html:not(.archive-stable-viewport)) .tomorrow-copy h2{font-size:34px;margin-top:12px}:where(html:not(.archive-stable-viewport)) .tomorrow-whisper{font-size:22px;margin-top:12px}:where(html:not(.archive-stable-viewport)) .swing-status{font-size:18px;line-height:1.2;margin-top:10px}:where(html:not(.archive-stable-viewport)) .swing-controls{padding-bottom:84px}}
@media(max-width:600px){:where(html.archive-stable-viewport.archive-h-700) .development-status{top:28px;font-size:22px}:where(html.archive-stable-viewport.archive-h-700) .water-response{font-size:16px;line-height:1.2;left:5%;right:5%;bottom:0}:where(html.archive-stable-viewport.archive-h-700) .swing-pair{height:calc(var(--archive-svh,1svh) * 40)}:where(html.archive-stable-viewport.archive-h-700) .tomorrow-copy{padding-top:calc(var(--archive-svh,1svh) * 43)}:where(html.archive-stable-viewport.archive-h-700) .tomorrow-copy h2{font-size:34px;margin-top:12px}:where(html.archive-stable-viewport.archive-h-700) .tomorrow-whisper{font-size:22px;margin-top:12px}:where(html.archive-stable-viewport.archive-h-700) .swing-status{font-size:18px;line-height:1.2;margin-top:10px}:where(html.archive-stable-viewport.archive-h-700) .swing-controls{padding-bottom:84px}}
@media(prefers-reduced-motion:reduce){.touch-ripple,.tray-touch-glint{display:none}}

/* A photograph has two sides: the picture we kept, and what I meant to say. */
.tray-stage{container-type:inline-size}
.print-turn{position:relative}
.print-front{position:relative}
.print-back{padding:20px 12px 12px;background:linear-gradient(155deg,#fbf8ee,#eee8d7);color:#354f83}
.photo-love-note{margin:0;text-align:center;overflow-wrap:anywhere;white-space:pre-line;font:26px/1.24 var(--hand)}
.print-turn-corner,.photo-turn-hint{display:none}
.has-scene-motion .develop-print{perspective:900px;background:transparent;box-shadow:none}
.has-scene-motion .print-turn{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(0deg);transform-origin:50% 50%;will-change:transform}
.has-scene-motion .print-face{position:absolute;inset:0;padding:9px;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#f6f3e8;box-shadow:0 5px 8px #364b433e,0 1px 2px #f6f4e36b}
.has-scene-motion .print-front{transform:rotateY(0deg)}
.has-scene-motion .print-back{display:flex;align-items:center;justify-content:center;padding:8%;transform:rotateY(180deg);background:repeating-linear-gradient(0deg,transparent,transparent 19px,#74785307 20px),linear-gradient(155deg,#fffdf6,#ede8d6)}
.has-scene-motion .photo-love-note{font-size:clamp(12px,5cqw,26px);font-weight:600;line-height:1.14;color:#29467a;text-wrap:pretty}
.has-scene-motion .develop-print.is-turned-over .print-turn{transform:translateY(-3%) rotateY(180deg) scale(1.18)}
.has-scene-motion .print-turn-corner{display:block;position:absolute;right:0;bottom:0;width:22px;height:22px;opacity:0;background:linear-gradient(135deg,transparent 49%,#ccc8b956 50%,#faf7e8 55%,#e0d9c5);box-shadow:-2px -2px 3px #766c451a;clip-path:polygon(100% 0,100% 100%,0 100%);pointer-events:none;transition:opacity .35s}
.has-scene-motion .is-developed:not(.is-turned-over) .print-turn-corner{opacity:1}
.has-scene-motion .photo-turn-hint{display:block;position:absolute;z-index:6;left:12%;right:12%;bottom:6%;margin:0;text-align:center;font:clamp(15px,3.6cqw,24px)/1.25 var(--hand);color:#596e7e;pointer-events:none}
.has-scene-motion .photo-turn-hint[hidden]{display:none}
.has-scene-motion .developing-section.has-long-copy .develop-print{background:#f6f3e8;box-shadow:0 9px 12px #42545624;perspective:none}
.has-scene-motion .developing-section.has-long-copy .print-turn{position:relative;inset:auto;transform:none;transform-style:flat;will-change:auto}
.has-scene-motion .developing-section.has-long-copy .print-face{position:relative;inset:auto;transform:none;box-shadow:none;backface-visibility:visible}
.has-scene-motion .developing-section.has-long-copy .print-front{padding:0}
.has-scene-motion .developing-section.has-long-copy .print-back{display:block;padding:20px 12px 12px}
.has-scene-motion .developing-section.has-long-copy .photo-love-note{font-size:26px;line-height:1.3}
.has-scene-motion .developing-section.has-long-copy .print-turn-corner,.has-scene-motion .developing-section.has-long-copy .photo-turn-hint{display:none}
@media(max-width:800px){.has-scene-motion .print-face{padding:7px}.has-scene-motion .print-back{padding:7%}.has-scene-motion .develop-print.is-turned-over .print-turn{transform:translateY(-3%) rotateY(180deg) scale(1.3)}}
@media(max-width:600px) and (max-height:700px){:where(html:not(.archive-stable-viewport)) .has-scene-motion .develop-print.is-turned-over .print-turn{transform:translateY(-3%) rotateY(180deg) scale(1.5)}:where(html:not(.archive-stable-viewport)) .has-scene-motion .print-back{padding:5%}:where(html:not(.archive-stable-viewport)) .has-scene-motion .photo-turn-hint{bottom:2%;font-size:13px;left:5%;right:5%}:where(html:not(.archive-stable-viewport)) .has-scene-motion .photo-love-note{font-size:12px;line-height:1.12}}
@media(max-width:600px){:where(html.archive-stable-viewport.archive-h-700) .has-scene-motion .develop-print.is-turned-over .print-turn{transform:translateY(-3%) rotateY(180deg) scale(1.5)}:where(html.archive-stable-viewport.archive-h-700) .has-scene-motion .print-back{padding:5%}:where(html.archive-stable-viewport.archive-h-700) .has-scene-motion .photo-turn-hint{bottom:2%;font-size:13px;left:5%;right:5%}:where(html.archive-stable-viewport.archive-h-700) .has-scene-motion .photo-love-note{font-size:12px;line-height:1.12}}
@media(prefers-reduced-motion:reduce){.print-turn{will-change:auto}}