:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{min-height:100%;margin:0}button{font:inherit}button:focus-visible,[tabindex]:focus-visible,video:focus-visible{outline-offset:4px;outline:2px solid #4f8fc7}body{font-family:Georgia,Times New Roman,Songti SC,Noto Serif SC,serif}.birthday-stage{--deep:#326a9c;--ink:#7daed7;--paper:#fffefa;color:var(--deep);background:radial-gradient(circle at 17% 12%,#fffffff0 0 1px,#0000 2px),radial-gradient(circle at 85% 31%,#ffffffe0 0 1.5px,#0000 2.5px),linear-gradient(145deg,#fbfeff 0%,#e5f3fd 42%,#9ac4e8 100%);place-items:center;transition:background 1s cubic-bezier(.4,0,.2,1),color .8s;display:grid;position:fixed;inset:0;overflow:hidden}.birthday-stage.scene-0.is-open{background:radial-gradient(circle at 12% 13%,#fff 0 1px,#0000 2px),linear-gradient(145deg,#fafdff 0%,#dcebfa 48%,#91bce2 100%)}.birthday-stage.scene-1.is-open{background:radial-gradient(circle at 78% 12%,#fffffff2 0 1px,#0000 2px),linear-gradient(140deg,#fff 0%,#e1f7f8 35%,#a9d4ec 70%,#7da9d2 100%)}.birthday-stage.scene-2.is-open{background:radial-gradient(circle at 50% 0,#fffffffa,#0000 33%),linear-gradient(150deg,#eef9ff 0%,#c6e2f4 45%,#85b2dc 100%)}.birthday-stage:before{content:"";opacity:.25;pointer-events:none;background-image:linear-gradient(#ffffff2e 1px,#0000 1px),linear-gradient(90deg,#ffffff2e 1px,#0000 1px);background-size:78px 78px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 84%);mask-image:linear-gradient(#000,#0000 84%)}.ambient-stars{opacity:.72;pointer-events:none;background-image:radial-gradient(circle,#fff 0 1px,#0000 1.6px),radial-gradient(circle,#ffffffb8 0 1px,#0000 1.5px);background-position:0 0,23px 28px;background-size:67px 67px,91px 91px;animation:5s ease-in-out infinite alternate starBreath;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 88%);mask-image:linear-gradient(#000,#0000 88%)}.glow-orb{pointer-events:none;filter:blur(3px);border-radius:50%;transition:transform 1.4s,background 1s;position:absolute}.orb-one{aspect-ratio:1;background:#ffffffd9;width:min(48vw,620px);animation:10s ease-in-out infinite alternate drift;bottom:-35vh;left:-20vw}.orb-two{aspect-ratio:1;background:#b1daf88c;width:min(33vw,430px);animation:12s ease-in-out -4s infinite alternate-reverse drift;top:-20vh;right:-13vw}.scene-1 .orb-one{background:#dcfdf8b8;transform:translate(7vw,-4vh)}.scene-2 .orb-two{background:#ffffffbd;transform:translate(-8vw,8vh)}.floating-spark{--size:calc(8px + (var(--i) % 4) * 2px);z-index:1;left:calc(5% + (var(--i) * 6.4%));top:calc(8% + (var(--i) % 6) * 14%);color:#ffffffa8;font-style:normal;font-size:var(--size);pointer-events:none;animation:floatSpark calc(5s + (var(--i) % 5) * 1s) calc(var(--i) * -.7s) ease-in-out infinite alternate;position:absolute}.opening{z-index:4;justify-items:center;padding:2rem;animation:.9s cubic-bezier(.22,.8,.3,1) both arrive;display:grid;position:relative}.opening-kicker{letter-spacing:.34em;color:#346493ad;margin:0 0 3.8rem;font:600 .67rem/1 Arial,sans-serif}.envelope{aspect-ratio:1.55;cursor:pointer;filter:drop-shadow(0 24px 25px #2a568140);background:0 0;border:0;width:min(72vw,390px);padding:0;transition:transform .35s;position:relative}.envelope:hover{transform:translateY(-7px)rotate(-.8deg)}.envelope-back{background:linear-gradient(145deg,#e7f4ff,#b9d9f4);border:1px solid #5f94c440;border-radius:5px 5px 14px 14px;position:absolute;inset:0}.letter-peek{color:#83add3;letter-spacing:.28em;background:#fffef9;place-content:center;gap:.8rem;height:77%;font:600 .72rem Arial,sans-serif;transition:transform .4s;display:grid;position:absolute;top:-17%;left:7%;right:7%;box-shadow:0 5px 15px #2d5d8917}.letter-peek i{text-align:center;font:1.3rem Georgia}.envelope:hover .letter-peek{transform:translateY(-8px)}.envelope-front{background:linear-gradient(28deg,#b8d9f5 0 49.5%,#0000 50%),linear-gradient(-28deg,#cbe5fa 0 49.5%,#0000 50%);border-radius:5px 5px 14px 14px;position:absolute;inset:0;overflow:hidden}.envelope-flap{clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;background:linear-gradient(#eaf6ff,#c1def5);height:60%;position:absolute;inset:0 0 auto}.wax-seal{color:#eaf6ff;background:linear-gradient(145deg,#7aaad5,#4f87bd);border-radius:50%;place-items:center;width:58px;height:58px;font-style:italic;display:grid;position:absolute;top:51%;left:50%;transform:translate(-50%,-50%);box-shadow:0 5px 11px #28527b40,inset 0 0 0 4px #ffffff26}.open-invite{color:#3c73a6;cursor:pointer;background:0 0;border:0;justify-items:center;gap:.5rem;margin-top:2.5rem;display:grid}.open-invite span{letter-spacing:.18em;border-bottom:1px solid #3c73a673;padding:0 .35rem .38rem;font-size:1.2rem}.open-invite small{color:#3b6a95a6;letter-spacing:.12em}.letter-room{z-index:5;grid-template-rows:46px minmax(0,1fr) 26px;width:min(94vw,1000px);height:min(94vh,910px);animation:.9s cubic-bezier(.2,.8,.3,1) both roomEnter;display:grid;position:relative}.letter-toolbar{color:#245887c7;letter-spacing:.14em;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 .45rem;font:600 .62rem/1 Arial,sans-serif;display:grid}.tiny-mark{align-items:center;gap:.55rem;display:flex}.tiny-mark span{font:.9rem Georgia}.page-dots{align-items:center;gap:.5rem;display:flex}.page-dots button{cursor:pointer;background:#32689a47;border:0;border-radius:50%;width:6px;height:6px;padding:0;transition:width .25s,background .25s,border-radius .25s}.page-dots button.active{background:#4e88bb;border-radius:10px;width:24px}.music-toggle{color:inherit;cursor:pointer;letter-spacing:.08em;background:#ffffff5c;border:0;border-radius:999px;justify-self:end;align-items:center;gap:.55rem;padding:.55rem .8rem;transition:background .2s;display:flex}.music-toggle:hover{background:#ffffffa6}.equalizer{justify-content:center;align-items:end;gap:2px;width:14px;height:12px;display:flex}.equalizer i{background:currentColor;border-radius:2px;width:2px;height:4px}.equalizer.playing i{animation:.8s ease-in-out infinite alternate eq}.equalizer.playing i:nth-child(2){height:10px;animation-delay:-.35s}.equalizer.playing i:nth-child(3){height:7px;animation-delay:-.6s}.paper-shell{perspective:1800px;min-height:0;position:relative}.paper-shell:before{content:"";z-index:-1;filter:blur(18px);background:#254e7540;border-radius:50%;height:45px;position:absolute;bottom:-14px;left:4%;right:4%}.paper{height:100%;transform-style:preserve-3d;transform-origin:0;color:var(--ink);background:linear-gradient(130deg,#fffffffc,#f7fcfffa);border:1px solid #84b4dd4d;border-radius:4px 16px 16px 4px;padding:clamp(3rem,5.5vw,5rem) clamp(3rem,7vw,6.8rem) clamp(3.6rem,5.5vw,5rem);position:relative;overflow:hidden;box-shadow:0 26px 66px #254d7338,inset 38px 0 60px #6da6d80e,inset -1px 0 #fffc}.paper:after{content:"";opacity:.23;pointer-events:none;mix-blend-mode:multiply;background-image:radial-gradient(#4174a138 .5px,#0000 .7px);background-size:7px 7px;position:absolute;inset:0}.paper-border{z-index:1;pointer-events:none;border:1px solid #6da4d22b;position:absolute;inset:17px}.paper-border:before,.paper-border:after{content:"✦";color:#9bc2e2;background:#fbfdff;padding:.35rem;font-size:.62rem;position:absolute}.paper-border:before{top:-.7rem;left:-.7rem}.paper-border:after{bottom:-.7rem;right:-.7rem}.turning-next .paper{animation:.64s cubic-bezier(.55,.05,.35,1) both turnNext}.turning-prev .paper{transform-origin:100%;animation:.64s cubic-bezier(.55,.05,.35,1) both turnPrev}.paper-number{z-index:2;color:#83b0d5;letter-spacing:.19em;font:600 .58rem Arial,sans-serif;position:absolute;top:2.15rem;right:clamp(2.5rem,5vw,4.2rem)}.letter-heading{z-index:2;border-bottom:1px solid #75abd82e;padding-bottom:1.25rem;position:relative}.paper-eyebrow{letter-spacing:.24em;color:#75a7d1;margin:0 0 .75rem;font:600 .62rem Arial,sans-serif}.letter-heading h1,.final-heading h1{letter-spacing:.075em;color:#5f99ca;margin:0;font-size:clamp(1.65rem,3.2vw,2.75rem);font-style:italic;font-weight:400;line-height:1.35}.title-star{font-size:1rem;position:absolute;bottom:1.15rem;right:0}.letter-scroll{z-index:2;scrollbar-width:thin;scrollbar-color:#74abd957 transparent;height:calc(100% - 105px);margin:1.1rem -.9rem 0 0;padding:0 .9rem 2.8rem 0;position:relative;overflow:auto}.letter-scroll::-webkit-scrollbar{width:4px}.letter-scroll::-webkit-scrollbar-thumb{background:#74abd957;border-radius:4px}.typed-letter{white-space:pre-wrap;color:#82afd4;letter-spacing:.075em;text-align:justify;margin:0;font-size:clamp(.88rem,1.35vw,1.03rem);font-style:italic;line-height:2.05}.typing-caret{vertical-align:-.18em;background:#6ea0cb;width:1px;height:1.15em;margin-left:3px;animation:.75s step-end infinite blink;display:inline-block}.previous-page{z-index:4;color:#6296c3b8;cursor:pointer;background:0 0;border:0;align-items:center;gap:.35rem;font-size:1.25rem;display:flex;position:absolute;bottom:1.75rem;left:2.2rem}.previous-page span{letter-spacing:.13em;font:600 .58rem Arial,sans-serif}.page-corner{z-index:5;cursor:pointer;color:#669ac7;filter:drop-shadow(-5px -5px 8px #548bb90f);background:linear-gradient(135deg,#0000 49%,#dbeefa 50%);border:0;justify-content:flex-end;align-items:flex-end;gap:.35rem;width:126px;height:126px;padding:0 1.05rem 1.05rem 0;transition:background .3s;display:flex;position:absolute;bottom:0;right:0}.page-corner:hover{background:linear-gradient(135deg,#0000 41%,#c9e4f7 42%)}.page-corner span{letter-spacing:.12em;font:600 .57rem Arial,sans-serif}.page-corner b{font-size:1.45rem;font-weight:400;line-height:.7}.turn-tip{color:#ffffffd9;letter-spacing:.16em;place-self:end center;margin:0;font-size:.68rem;font-style:italic}.final-paper{padding-top:clamp(2.7rem,4vw,3.7rem)}.final-content{z-index:2;flex-direction:column;height:100%;display:flex;position:relative}.final-heading{text-align:center;margin-bottom:clamp(1.1rem,2.2vh,1.8rem)}.final-heading .paper-eyebrow{margin-bottom:.48rem}.final-heading h1{font-size:clamp(1.55rem,3vw,2.45rem)}.final-heading>p:last-child{color:#8bb3d4;letter-spacing:.08em;margin:.5rem auto 0;font-size:.75rem;font-style:italic}.video-grid{flex:1;grid-template-columns:1fr 1fr;gap:clamp(1rem,2.2vw,1.7rem);min-height:0;display:grid}.video-card{background:#e5f2fb8f;border:1px solid #72a9d63b;border-radius:12px;flex-direction:column;min-width:0;padding:clamp(.8rem,1.7vw,1.25rem);display:flex}.video-title{grid-template-columns:auto 1fr auto;align-items:center;gap:.65rem;margin-bottom:.75rem;display:grid}.video-title span{color:#fff;background:#8bb9dc;border-radius:50%;place-items:center;width:27px;height:27px;font:600 .52rem Arial,sans-serif;display:grid}.video-title h2{color:#659ccb;letter-spacing:.12em;text-align:center;margin:0;font-size:clamp(1rem,1.75vw,1.35rem);font-style:italic;font-weight:400}.video-title i{color:#93b7d4;white-space:nowrap;font-size:.53rem}.video-frame{background:radial-gradient(circle at 50% 35%,#fff6,#0000 36%),linear-gradient(145deg,#bddcf1,#74a6d1);border-radius:8px;flex:1;place-items:center;min-height:145px;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff45}.video-frame:before{content:"✦";color:#ffffff8a;font-size:3rem;position:absolute}.video-frame video{z-index:2;object-fit:contain;background:0 0;width:100%;height:100%;position:absolute;inset:0}.video-hint{z-index:1;color:#ffffffe0;letter-spacing:.12em;white-space:nowrap;font:600 .55rem Arial,sans-serif;position:absolute;bottom:16%;left:50%;transform:translate(-50%)}.wish-ribbon{color:#7facd1;letter-spacing:.08em;flex-wrap:wrap;justify-content:center;gap:.6rem 1.35rem;padding:1rem 0 0;font-size:.65rem;font-style:italic;display:flex}.brand-note{z-index:2;color:#ffffffba;letter-spacing:.12em;margin:0;font-size:.61rem;font-style:italic;position:absolute;bottom:.65rem}@keyframes arrive{0%{opacity:0;transform:translateY(18px)scale(.97)}to{opacity:1;transform:none}}@keyframes roomEnter{0%{opacity:0;transform:translateY(34px)scale(.96)}to{opacity:1;transform:none}}@keyframes drift{to{transform:translate(45px,-30px)scale(1.08)}}@keyframes starBreath{0%{opacity:.45}to{opacity:.85}}@keyframes floatSpark{0%{opacity:.25;transform:translateY(-8px)rotate(0)}to{opacity:.85;transform:translateY(18px)rotate(45deg)}}@keyframes blink{50%{opacity:0}}@keyframes eq{0%{height:3px}to{height:11px}}@keyframes turnNext{0%{filter:brightness();transform:rotateY(0)}48%{filter:brightness(.92);transform:rotateY(-82deg)scale(.98)}52%{filter:brightness(.92);transform:rotateY(82deg)scale(.98)}to{filter:brightness();transform:rotateY(0)}}@keyframes turnPrev{0%{filter:brightness();transform:rotateY(0)}48%{filter:brightness(.92);transform:rotateY(82deg)scale(.98)}52%{filter:brightness(.92);transform:rotateY(-82deg)scale(.98)}to{filter:brightness();transform:rotateY(0)}}@media (width<=700px){.letter-room{grid-template-rows:42px minmax(0,1fr) 22px;width:94vw;height:94dvh}.letter-toolbar{grid-template-columns:1fr auto}.tiny-mark{font-size:.53rem}.page-dots{display:none}.music-toggle{padding:.5rem .65rem;font-size:.52rem}.paper{border-radius:3px 12px 12px 3px;padding:3.6rem 2.15rem 3.8rem}.paper-number{top:2.05rem;right:2.25rem}.paper-eyebrow{letter-spacing:.17em;padding-right:4rem;font-size:.53rem}.letter-heading h1{padding-right:0;font-size:1.55rem}.title-star{display:none}.letter-scroll{height:calc(100% - 102px);margin-top:.9rem}.typed-letter{letter-spacing:.055em;font-size:.87rem;line-height:1.95}.page-corner{width:100px;height:100px}.page-corner span{display:none}.previous-page{bottom:1.45rem;left:1.75rem}.final-paper{padding:3.2rem 1.65rem 3.4rem;overflow:auto}.final-heading{margin-bottom:1rem}.final-heading .paper-eyebrow{padding:0}.final-heading>p:last-child{display:none}.video-grid{flex-direction:column;gap:.75rem;min-height:0;padding-right:.2rem;display:flex;overflow:auto}.video-card{flex:none;height:230px;padding:.7rem}.video-title{margin-bottom:.5rem}.video-title i{display:none}.video-frame{min-height:150px}.wish-ribbon{display:none}.turn-tip{font-size:.58rem}.brand-note{display:none}}@media (height<=670px) and (width>=701px){.letter-room{height:96vh}.paper{padding-top:3.3rem;padding-bottom:3.7rem}.letter-heading h1{font-size:1.7rem}.letter-scroll{height:calc(100% - 88px)}.final-heading>p:last-child,.wish-ribbon{display:none}.video-title{margin-bottom:.45rem}}@media (prefers-reduced-motion:reduce){.ambient-stars,.glow-orb,.floating-spark,.equalizer i{animation:none!important}.opening,.letter-room{animation-duration:.2s!important}.turning-next .paper,.turning-prev .paper{animation-duration:.64s!important}}