:root{--cream:#efe6da;--cream-2:#f6f0e6;--ink:#2e2118;--ink-soft:#5c4d40;--pink:#f1567b;--pink-soft:#ffc9d6;--blue:#b7c9e6;--gold:#f0b429;--shadow:#c9b8a3}*{box-sizing:border-box;margin:0;padding:0}html,body{overscroll-behavior:none;height:100%}body{background:var(--cream);color:var(--ink);font-family:Quicksand,sans-serif;overflow:hidden}h1,h2,.script{font-family:Caveat,cursive}.slider{scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;flex-direction:row;width:100vw;height:100dvh;display:flex;overflow:auto hidden}.slider::-webkit-scrollbar{display:none}.slider{scrollbar-width:none}.section{scroll-snap-align:start;scroll-snap-stop:always;text-align:center;flex-direction:column;flex:0 0 100vw;justify-content:center;align-items:center;width:100vw;height:100dvh;padding:8vh 6vw;display:flex;position:relative;overflow-y:auto}.floaters{pointer-events:none;z-index:1;position:fixed;inset:0;overflow:hidden}.floaters span{opacity:.55;font-size:22px;animation:linear infinite drift;position:absolute}@keyframes drift{0%{transform:translateY(110vh)rotate(0)}to{transform:translateY(-10vh)rotate(30deg)}}.bottom-nav{z-index:50;padding:8px 14px;padding-bottom:calc(8px + env(safe-area-inset-bottom));backdrop-filter:blur(6px);border:1.5px solid var(--ink);box-shadow:4px 4px 0 var(--shadow);background:#f6f0e6d9;border-radius:999px;flex-direction:row;align-items:center;gap:18px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.dots{flex-direction:row;gap:11px;display:flex}.dots button{border:1.5px solid var(--ink);cursor:pointer;opacity:.5;background:0 0;border-radius:50%;flex-shrink:0;width:9px;height:9px;padding:0;transition:all .25s}.dots button.active{background:var(--pink);border-color:var(--pink);opacity:1;transform:scale(1.3)}.arrow-nav{background:var(--cream);border:1.5px solid var(--ink);cursor:pointer;user-select:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;font-size:15px;transition:transform .2s,opacity .2s;display:flex}.arrow-nav:hover{transform:scale(1.1)}.arrow-nav[disabled]{opacity:.25;pointer-events:none}@media (width<=400px){.bottom-nav{gap:12px;padding:6px 10px}.arrow-nav{width:28px;height:28px;font-size:13px}.dots button{width:7px;height:7px}}@media (width<=640px){.arrow-nav{width:36px;height:36px;font-size:15px}}@media (height<=480px){.bottom-nav{padding:6px 12px;bottom:10px}}.countdown-grid{flex-wrap:wrap;justify-content:center;gap:3vw;margin-top:4vh;display:flex}.cd-box{background:var(--cream-2);border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--shadow);border-radius:10px;width:min(110px,20vw);padding:2.2vh 0;transition:transform .3s,opacity .5s}.cd-box .cd-num{color:var(--pink);font-size:clamp(1.8rem,5vw,2.8rem);font-weight:700}.cd-box .cd-label{letter-spacing:1px;text-transform:uppercase;color:var(--ink-soft);margin-top:.4vh;font-size:.75rem}.cd-sub{color:var(--ink-soft);margin-top:3vh;font-family:Caveat,cursive;font-size:1.4rem;transition:all .4s}.countdown-grid.cd-finished .cd-box{border-color:var(--pink);animation:1.1s ease-in-out infinite cdPulse}.countdown-grid.cd-finished .cd-box:nth-child(2){animation-delay:.1s}.countdown-grid.cd-finished .cd-box:nth-child(3){animation-delay:.2s}.countdown-grid.cd-finished .cd-box:nth-child(4){animation-delay:.3s}@keyframes cdPulse{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-8px)scale(1.06)}}.cd-sub.cd-celebrate{color:var(--pink);font-size:1.9rem;font-weight:700;animation:.7s cubic-bezier(.34,1.56,.64,1) cdPopIn}@keyframes cdPopIn{0%{opacity:0;transform:scale(.4)}60%{opacity:1;transform:scale(1.15)}to{transform:scale(1)}}.cd-emoji-burst{opacity:0;justify-content:center;gap:.4em;margin-top:1.4vh;font-size:1.8rem;transition:all .5s .2s;display:flex;transform:translateY(10px)}.cd-emoji-burst.show{opacity:1;transform:translateY(0)}.cd-emoji-burst span{animation:1.4s ease-in-out infinite cdBounce;display:inline-block}.cd-emoji-burst span:nth-child(2){animation-delay:.15s}.cd-emoji-burst span:nth-child(3){animation-delay:.3s}.cd-emoji-burst span:nth-child(4){animation-delay:.45s}.cd-emoji-burst span:nth-child(5){animation-delay:.6s}@keyframes cdBounce{0%,to{transform:translateY(0)}50%{transform:translateY(-14px)}}@media (width<=480px){.countdown-grid{gap:2.4vw}.cd-box{width:min(76px,21vw);padding:1.6vh 0}.cd-sub{font-size:1.15rem}.cd-sub.cd-celebrate{font-size:1.5rem}}.music-bar{z-index:60;align-items:center;gap:10px;display:flex;position:fixed;top:20px;left:20px}.music-btn{background:var(--cream-2);border:1.5px solid var(--ink);cursor:pointer;width:46px;height:46px;box-shadow:3px 3px 0 var(--shadow);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:18px;transition:transform .2s;display:flex}.music-btn:hover{transform:scale(1.08)}.music-btn svg{display:block}.music-btn .reel{transform-origin:50%;transform-box:fill-box}.music-btn.spinning .reel{animation:1.4s linear infinite reelSpin}@keyframes reelSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.music-info{backdrop-filter:blur(8px);border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--shadow);opacity:0;white-space:nowrap;pointer-events:none;background:#f6f0e6e0;border-radius:999px;align-items:center;gap:7px;max-width:0;padding:6px 0;transition:max-width .5s cubic-bezier(.34,1.4,.64,1),opacity .4s,padding .5s;display:flex;overflow:hidden}.music-info.show{opacity:1;pointer-events:auto;max-width:220px;padding:6px 14px 6px 10px}.music-notes{flex-shrink:0;align-items:flex-end;gap:2px;height:20px;display:flex}.note{color:var(--pink);font-size:13px;line-height:1;animation:1s ease-in-out infinite noteBounce;display:inline-block}.note.n1{animation-delay:0s}.note.n2{font-size:15px;animation-delay:.18s}.note.n3{animation-delay:.36s}@keyframes noteBounce{0%,to{opacity:.6;transform:translateY(0)}50%{opacity:1;transform:translateY(-6px)}}.music-ticker-wrap{max-width:140px;overflow:hidden}.music-ticker{white-space:nowrap;animation:8s linear infinite ticker;display:inline-flex}.music-ticker span{color:var(--ink);letter-spacing:.3px;font-family:Quicksand,sans-serif;font-size:.72rem;font-weight:600}@keyframes ticker{0%{transform:translate(0)}to{transform:translate(-50%)}}@media (width<=400px){.music-info.show{max-width:160px}.music-ticker-wrap{max-width:100px}}#s1 h1{font-size:clamp(2.2rem,6vw,4.2rem);font-weight:700;line-height:1.15}.envelope-wrap{margin:5vh 0 2vh}.envelope{background:var(--cream-2);border:2.5px solid var(--ink);width:min(360px,80vw);height:min(240px,55vw);box-shadow:6px 6px 0 var(--shadow);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;display:flex;position:relative}.envelope .flap{background:var(--blue);clip-path:polygon(0 0,100% 0,50% 100%);border-bottom:2.5px solid var(--ink);transform-origin:top;z-index:3;width:100%;height:52%;transition:transform .6s cubic-bezier(.6,-.2,.3,1.4);position:absolute;top:0;left:0}.envelope.open .flap{transform:rotateX(180deg)}.heart-seal{z-index:5;filter:drop-shadow(2px 3px #00000026);font-size:2.6rem;transition:transform .3s;position:absolute;top:38%;left:50%;transform:translate(-50%,-50%)}.envelope:hover .heart-seal{transform:translate(-50%,-50%)scale(1.15)}.caption-hint{color:var(--ink-soft);margin-top:2.2vh;font-family:Caveat,cursive;font-size:1.4rem}.letter-card{background:var(--cream-2);border:2.5px solid var(--ink);width:90vw;max-width:640px;box-shadow:8px 8px 0 var(--shadow);opacity:0;border-radius:6px;padding:6vh 5vw;transition:all .8s cubic-bezier(.2,.9,.3,1.2);transform:translateY(40px)scale(.96)}.letter-card.show{opacity:1;transform:translateY(0)scale(1)}.letter-card .dear{font-family:Caveat,cursive;font-size:1.7rem;font-weight:700}.letter-card p{color:var(--ink-soft);margin-top:2.2vh;font-size:1.05rem;line-height:1.85}.letter-card .sign{text-align:right;margin-top:3vh;font-family:Caveat,cursive;font-size:1.5rem}.memory-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:6vw;max-width:900px;display:flex}.polaroid-frame{background:var(--cream-2);border:2.5px solid var(--ink);width:min(300px,80vw);box-shadow:6px 6px 0 var(--shadow);border-radius:6px;padding:14px 14px 40px;transform:rotate(-3deg)}.polaroid-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.poloroid-slot{aspect-ratio:1;border:1.5px dashed var(--ink-soft);background:repeating-linear-gradient(45deg,#e7dccb,#e7dccb 6px,#ddd0ba 6px 12px);border-radius:3px;justify-content:center;align-items:center;font-size:1.4rem;display:flex;overflow:hidden}.poloroid-slot img{object-fit:cover;width:100%;height:100%;display:block}.polaroid-frame .label{text-align:center;margin-top:14px;font-family:Caveat,cursive;font-size:1.2rem}.memory-text{text-align:left;max-width:340px}.memory-text .tag{color:var(--pink);font-family:Caveat,cursive;font-size:1.5rem;font-weight:700}.memory-text p{color:var(--ink-soft);margin-top:1.2vh;line-height:1.8}.number-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:6vw;display:flex}.big21{color:var(--pink);-webkit-text-stroke:2px var(--ink);text-shadow:6px 6px 0 var(--ink);font-size:clamp(6rem,18vw,11rem);font-weight:700}.number-text{text-align:left;max-width:360px}.number-text h2{font-size:2.4rem}.number-text p{color:var(--ink-soft);margin-top:1.2vh;line-height:1.8}.level-up{letter-spacing:1px;text-transform:uppercase;margin-top:1vh;font-size:.9rem;font-weight:700}.reasons-list{text-align:left;grid-template-columns:1fr 1fr;gap:1.6vh 5vw;max-width:760px;margin-top:3vh;display:grid}.reasons-list div{align-items:center;gap:.6em;font-size:1.05rem;display:flex}.reasons-list .ic{color:var(--pink);font-size:1.2rem}@media (width<=640px){.reasons-list{grid-template-columns:1fr}}#s6{background:var(--cream)}.cake-wrap{cursor:pointer;user-select:none;margin-bottom:2vh}.cake-svg{width:min(220px,55vw);height:auto;transition:transform .3s}.cake-wrap:hover .cake-svg{transform:translateY(-4px)}#s6 h2{margin-top:1vh;font-size:clamp(2.2rem,6vw,3.6rem)}.wish-line{color:var(--ink-soft);margin-top:1vh;font-family:Caveat,cursive;font-size:1.5rem}.blown-msg{color:var(--pink);opacity:0;margin-top:2vh;font-family:Caveat,cursive;font-size:1.7rem;transition:opacity .6s}.blown-msg.show{opacity:1}.confetti{z-index:80;pointer-events:none;border-radius:2px;position:fixed;top:-10px}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media (width<=480px){.section{padding:7vh 5vw 10vh}.countdown-grid{gap:3vw;margin-top:3vh}.cd-box{width:min(72px,20vw);padding:1.4vh 0}.cd-box .cd-num{font-size:clamp(1.5rem,7vw,2rem)}.cd-box .cd-label{font-size:.65rem}.cd-sub{margin-top:2vh;font-size:1rem}.cd-sub.cd-celebrate{font-size:1.35rem}#s1 h1{font-size:clamp(1.8rem,8vw,2.4rem)}.envelope-wrap{margin:3vh 0 1.5vh}.envelope{width:min(300px,84vw);height:min(200px,50vw)}.caption-hint{font-size:1.1rem}.letter-card{padding:4vh 5vw}.letter-card .dear{font-size:1.45rem}.letter-card p{margin-top:1.6vh;font-size:.9rem}.letter-card .sign{margin-top:2vh;font-size:1.3rem}.memory-row{flex-direction:column;align-items:center;gap:3vh}.polaroid-frame{width:min(260px,82vw);padding:10px 10px 32px;transform:rotate(-2deg)}.memory-text{text-align:center;max-width:90vw}.memory-text .tag{font-size:1.3rem}.memory-text p{font-size:.88rem}.number-row{flex-direction:column;gap:1.5vh}.big21{font-size:clamp(5rem,22vw,7rem)}.number-text{text-align:center;max-width:90vw}.number-text h2{font-size:1.8rem}.number-text p{font-size:.9rem}.reasons-list{grid-template-columns:1fr;gap:1.2vh;margin-top:2vh}.reasons-list div{font-size:.92rem}.cake-svg{width:min(160px,42vw)}#s6 h2{font-size:clamp(1.8rem,7vw,2.4rem)}.wish-line{font-size:1.2rem}.blown-msg{font-size:1.35rem}.music-info.show{max-width:150px}.music-ticker-wrap{max-width:90px}}@media (width<=360px){.cd-box{width:min(64px,20vw)}.envelope{width:min(270px,88vw);height:min(180px,48vw)}.polaroid-frame{width:min(230px,86vw)}.reasons-list{padding:0 2vw}.music-info.show{max-width:120px}.music-ticker-wrap{max-width:65px}}@media (height<=500px){.section{padding:3vh 6vw 8vh}h1{font-size:clamp(1.3rem,4vw,1.8rem)!important}.countdown-grid{gap:2vw;margin-top:1.5vh}.cd-box{width:min(64px,16vw);padding:1vh 0}.cd-sub{margin-top:1.2vh;font-size:.95rem}.envelope-wrap{margin:1.5vh 0 1vh}.envelope{width:min(260px,70vw);height:min(130px,34vh)}.memory-row{flex-direction:row;align-items:flex-start;gap:4vw}.polaroid-frame{width:min(200px,40vw);padding:8px 8px 28px}.memory-text{max-width:45vw}.number-row{flex-direction:row;gap:4vw}.big21{font-size:5rem}.reasons-list{grid-template-columns:1fr 1fr;gap:1vh 4vw;margin-top:1.5vh}.cake-svg{width:110px}.cake-wrap{margin-bottom:1vh}}@media (width>=641px) and (width<=1024px){.memory-row{gap:4vw}.polaroid-frame{width:min(280px,42vw)}.number-text{max-width:300px}}