.rv{--t:0;--crack:clamp(0, calc((var(--t) - var(--tl-seal-a)) / (var(--tl-seal-b) - var(--tl-seal-a))), 1);--open:clamp(0, calc((var(--t) - var(--tl-flap-a)) / (var(--tl-flap-b) - var(--tl-flap-a))), 1);--open-e:calc(1 - (1 - var(--open)) * (1 - var(--open)) * (1 - var(--open)));--exit:clamp(0, calc((var(--t) - var(--tl-exit-a)) / (var(--tl-exit-b) - var(--tl-exit-a))), 1);--exit-e:calc(var(--exit) * var(--exit));--bloom-p:clamp(0, calc((var(--t) - var(--tl-bloom-a)) / (var(--tl-bloom-b) - var(--tl-bloom-a))), 1);--scene:clamp(0, calc((var(--t) - var(--tl-bloom-a) + .2) / .35), 1);--name:clamp(0, calc((var(--t) - var(--tl-name-a)) / (var(--tl-name-b) - var(--tl-name-a))), 1);--card:clamp(0, calc((var(--t) - var(--tl-card-a)) / (var(--tl-card-b) - var(--tl-card-a))), 1);--card-e:calc(1 - (1 - var(--card)) * (1 - var(--card)) * (1 - var(--card)));--sign:clamp(0, calc((var(--t) - var(--tl-sign-a)) / (var(--tl-sign-b) - var(--tl-sign-a))), 1);--btn:clamp(0, calc((var(--t) - var(--tl-btn-a)) / (var(--tl-btn-b) - var(--tl-btn-a))), 1);--skip:calc(clamp(0, calc((var(--t) - 1) / .3), 1) * (1 - var(--btn)));isolation:isolate;background:radial-gradient(60% 50% at 50% 42%,#fff3ec,#0000 75%),#f8e8e8;min-height:100svh;position:relative;overflow:hidden}.rv[data-look=garden]{background:radial-gradient(60% 50% at 50% 42%,#fffaf0,#0000 75%),#eef0e4}.rv[data-look=ink]{background:radial-gradient(60% 50% at 50% 42%,#fff,#0000 75%),#f4f2ef}.rv-intro{z-index:2;text-align:center;opacity:calc(1 - var(--exit));transform:translate3d(0, calc(var(--exit-e) * 32svh), 0);flex-direction:column;justify-content:center;align-items:center;gap:2rem;padding:1.5rem;display:flex;position:absolute;inset:0}.rv[data-state=playing] .rv-intro,.rv[data-state=done] .rv-intro{pointer-events:none}.rv-from,.rv-hint{opacity:calc(1 - var(--crack));margin:0}.rv-from{font-family:var(--font-fraunces), Georgia, serif;color:var(--ink-soft);font-size:clamp(1.25rem,3.4vw,1.6rem);font-style:italic}.rv-hint{color:var(--ink-soft);font-size:.9rem}.rv-float{animation:4.2s ease-in-out infinite alternate rv-float}.rv[data-state=playing] .rv-float,.rv[data-state=done] .rv-float{animation-play-state:paused}@keyframes rv-float{0%{transform:translateY(-5px)rotate(-.6deg)}to{transform:translateY(5px)rotate(.6deg)}}.rv-envelope{aspect-ratio:1.48;perspective:1400px;cursor:pointer;width:min(26rem,82vw);transition:transform .16s var(--ease-out-soft);background:0 0;border:0;padding:0;display:block;position:relative}.rv-envelope:active{transform:scale(.98)}.rv-envelope:disabled{cursor:progress}.rv-envelope:focus-visible{outline:3px solid var(--accent);outline-offset:6px;border-radius:.6rem}.rv-env-back,.rv-env-front,.rv-env-flap{border-radius:.5rem;position:absolute}.rv-env-back{background:#e6cbc2;inset:0;box-shadow:0 2px 4px #3c141e1f,0 26px 50px -20px #3c141e73}.rv-env-front{z-index:1;clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%);background:#f7e9e3;justify-content:center;align-items:flex-end;padding-bottom:11%;display:flex;inset:0}.rv-env-to{text-overflow:ellipsis;white-space:nowrap;max-width:82%;font-family:var(--font-caveat), cursive;color:var(--ink);font-size:clamp(1.7rem,6vw,2.4rem);overflow:hidden}.rv-env-flap{z-index:2;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;height:58%;transform:rotateX(calc(var(--open-e) * 178deg));background:linear-gradient(#f1ddd5,#e8cec5);inset:0 0 auto}.rv-seal{z-index:3;aspect-ratio:1;place-items:center;width:clamp(3.4rem,12vw,4.4rem);display:grid;position:absolute;top:58%;left:50%;translate:-50% -50%}.rv-seal-half{opacity:calc(1 - var(--crack) * 1.1);background:radial-gradient(circle at 40% 35%,#b3304f,#7c1531 70%);border-radius:50%;position:absolute;inset:0;box-shadow:0 2px 6px #3c0a1966}.rv-seal-half--l{clip-path:polygon(0 0,54% 0,44% 50%,56% 100%,0 100%);transform:translate3d(calc(var(--crack) * -2.6rem), calc(var(--crack) * 3.4rem), 0) rotate(calc(var(--crack) * -34deg))}.rv-seal-half--r{clip-path:polygon(54% 0,100% 0,100% 100%,56% 100%,44% 50%);transform:translate3d(calc(var(--crack) * 2.6rem), calc(var(--crack) * 3.8rem), 0) rotate(calc(var(--crack) * 38deg))}.rv-seal-mark{font-family:var(--font-fraunces), Georgia, serif;color:#f6d9df;opacity:calc(1 - var(--crack) * 2.5);font-size:1.7rem;font-style:italic;position:relative}.rv-scene{z-index:1;opacity:var(--scene);pointer-events:none;position:absolute;inset:0}.rv-name{white-space:nowrap;text-overflow:ellipsis;max-width:92vw;font-family:var(--font-caveat), cursive;color:var(--ink);clip-path:inset(-25% calc((1 - var(--name)) * 110% - 10%) -25% -5%);margin:0;font-size:clamp(2.4rem,7vw,4.2rem);line-height:1.15;position:absolute;top:clamp(1.5rem,6svh,3.5rem);left:50%;overflow:hidden;translate:-50%}.rv-bouquet{aspect-ratio:1000/1200;height:min(68svh,118vw);position:absolute;top:clamp(5.5rem,15svh,9rem);left:50%;translate:-50%}.rv-petals{z-index:2;width:100%;height:100%;position:absolute;inset:0}.rv:before{content:"";z-index:0;pointer-events:none;opacity:0;background:radial-gradient(38% 34%,#ffe2c48c,#0000 70%);transition:opacity 1.6s;position:absolute;inset:-20%}.rv[data-state=done]:before{opacity:1;animation:22s ease-in-out infinite alternate rv-light}@keyframes rv-light{0%{transform:translate(-12%,-6%)}to{transform:translate(12%,8%)}}.rv-card{width:min(17rem,60vw);opacity:var(--card);transform:translate3d(0, calc((1 - var(--card-e)) * 3rem), 0) rotate(-3deg);font-size:clamp(.8rem,3.2vw,.95rem);position:absolute;bottom:12svh;right:4vw}.rv-card .card-from{clip-path:inset(-20% calc((1 - var(--sign)) * 110% - 10%) -20% -5%)}.rv-actions{z-index:3;left:0;right:0;bottom:max(1.25rem, env(safe-area-inset-bottom));opacity:var(--btn);transform:translate3d(0, calc((1 - var(--btn)) * 10px), 0);pointer-events:none;flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;padding-inline:1rem;display:flex;position:absolute}.rv[data-state=done] .rv-actions,.rv[data-state=done] .rv-scene{pointer-events:auto}.rv-skip{z-index:4;right:1rem;bottom:max(1rem, env(safe-area-inset-bottom));opacity:var(--skip);visibility:hidden;position:absolute}.rv[data-state=playing] .rv-skip{visibility:visible}@media (min-width:900px){.rv-bouquet{height:84svh;top:12svh;translate:-62%}.rv-card{width:20rem;font-size:1.05rem;bottom:15svh;left:calc(50% + 1rem);right:auto}.rv-envelope{width:min(30rem,40vw)}}@media (prefers-reduced-motion:reduce){.rv-float,.rv[data-state=done]:before{animation:none}.rv-intro,.rv-scene,.rv-card,.rv-actions{transition:opacity .6s;transform:none}.rv-card{transform:rotate(-3deg)}.rv-env-flap,.rv-seal-half{transform:none}.rv-name,.rv-card .card-from{clip-path:none}}