.bottle-scene{position:relative;height:460px;max-width:960px;margin:-12px auto 32px;pointer-events:none;isolation:isolate;perspective:1200px}
.bottle-halo{position:absolute;inset:0 0 20px;background:radial-gradient(ellipse at 32% 50%,#3bdfd330,transparent 48%),radial-gradient(ellipse at 70% 45%,#9382ff22,transparent 50%);filter:blur(16px)}
.bottle-float{position:absolute;left:7%;top:-50px;width:330px;height:460px;transform:rotate(-19deg);transition:transform 2.2s cubic-bezier(.2,.7,.2,1);mix-blend-mode:screen}
.message-bottle{width:100%;height:100%;object-fit:contain;animation:message-drift 6s ease-in-out infinite;filter:drop-shadow(0 0 24px #5cded822)}
.bottle-orbit{position:absolute;left:12%;top:65px;width:280px;height:280px;border:1px solid #a6f5ef20;border-radius:50%;transform:rotateX(65deg) rotate(-25deg);box-shadow:0 0 50px #7de5ef10}
.released-letter{position:absolute;left:47%;top:28px;width:350px;min-height:310px;padding:26px 30px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;border:1px solid #c0eeea66;border-radius:4px 25px 4px 25px;background:linear-gradient(135deg,#457b8d55,#192b5077 65%,#7663a333);backdrop-filter:blur(16px);box-shadow:inset 0 1px #fff4,0 24px 70px #05091d77;transform-origin:0 20%;opacity:0;transform:translate(-120px,-35px) rotate(-15deg) scale(.3);transition:transform 1.7s cubic-bezier(.2,.7,.2,1),opacity .8s ease;}
.message-arrived .released-letter{opacity:1;transform:translate(0,0) rotate(3deg) scale(1)}
.message-arrived .bottle-float{transform:translateX(-20px) rotate(-29deg)}
.letter-emblem{font-size:23px;color:#9febdf}.letter-kicker{font:9px/1.5 Arial,sans-serif;letter-spacing:.2em;color:#b8d8e2}.letter-title{font:27px/1.2 Georgia,serif;color:#effffc}.letter-copy{font:13px/1.7 Arial,sans-serif;color:#c2dbe7}.letter-rule{height:1px;width:90px;background:linear-gradient(90deg,transparent,#b8e9eb,transparent)}.letter-seal{font:italic 24px Georgia,serif;border:1px solid #a0ddd280;border-radius:50%;width:42px;height:42px;display:grid;place-items:center;color:#bbefe8;background:#5bd0c011;box-shadow:0 0 22px #89e8df22}
.message-thread{position:absolute;left:32%;top:120px;width:27%;height:100px;border-top:1px solid #a4f4e777;border-radius:50%;filter:drop-shadow(0 0 5px #78ede6);opacity:0;transform:rotate(-20deg);transition:opacity 1s}.message-arrived .message-thread{opacity:.7}
.bottle-caption{position:absolute;bottom:8px;left:0;right:0;text-align:center;font:9px/1.6 Arial,sans-serif;letter-spacing:.23em;color:#a9d5de}.bottle-caption span{display:block;font-size:22px;margin-top:10px;animation:message-drift 3s ease-in-out infinite}
.bottle-bubbles i{position:absolute;left:24%;top:75%;width:6px;height:6px;border:1px solid #b0f6ee80;border-radius:50%;animation:message-bubble 5s linear infinite;opacity:0}.bottle-bubbles i:nth-child(2){left:33%;animation-delay:-1s;width:9px;height:9px}.bottle-bubbles i:nth-child(3){left:18%;animation-delay:-3s}.bottle-bubbles i:nth-child(4){left:78%;animation-delay:-2s}.bottle-bubbles i:nth-child(5){left:67%;animation-delay:-4s;width:4px;height:4px}.bottle-bubbles i:nth-child(6){left:44%;animation-delay:-2.5s}
@keyframes message-drift{50%{translate:0 -12px;rotate:2deg}}@keyframes message-bubble{15%,70%{opacity:.55}to{transform:translate(20px,-270px);opacity:0}}
@media(max-width:680px){.bottle-scene{height:410px;margin:0 -12px 20px}.bottle-float{width:210px;height:300px;left:-25px;top:10px}.bottle-orbit{left:0;width:180px;height:180px;top:100px}.released-letter{left:37%;top:55px;width:60%;min-height:245px;padding:19px 13px;gap:12px}.letter-title{font-size:21px}.letter-kicker{font-size:7px}.letter-copy{font-size:11px}.letter-emblem{font-size:19px}.letter-seal{width:32px;height:32px;font-size:20px}.bottle-caption{font-size:8px;letter-spacing:.14em}.message-thread{left:22%;top:100px}}
@media(prefers-reduced-motion:reduce){.message-bottle,.bottle-bubbles i,.bottle-caption span{animation:none}.released-letter,.bottle-float{transition:none}.released-letter{opacity:1;transform:rotate(3deg)}}
.reduced .message-bottle,.reduced .bottle-bubbles i,.reduced .bottle-caption span{animation:none}.reduced .released-letter{opacity:1;transform:rotate(3deg);transition:none}
@media(max-width:680px){.bottle-float{left:-5px;width:180px;transform:rotate(-12deg)}.message-arrived .bottle-float{transform:translateX(8px) rotate(-14deg)}}