:root{--white: rgb(220, 210, 190);--gold: rgb(198, 180, 95);--pink: rgb(244, 178, 204);--red: rgb(235, 90, 65);--black: rgb(31, 33, 32)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;overflow:hidden;scrollbar-width:none;-ms-overflow-style:none}html::-webkit-scrollbar{display:none}body{font-family:Georgia,serif;background:#e0d8c5;height:100vh;height:100dvh;overflow:hidden;position:relative;display:flex;justify-content:center;scrollbar-width:none;-ms-overflow-style:none}body::-webkit-scrollbar{display:none}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0}.invitation{position:relative;width:100%;max-width:800px;margin:0 auto;z-index:1;scroll-snap-type:y mandatory;overflow-y:scroll;overflow-x:hidden;height:100vh;height:100dvh;scrollbar-width:none;-ms-overflow-style:none}.invitation::-webkit-scrollbar{display:none}.screen{height:100%;width:100%;display:flex;align-items:center;justify-content:center;padding:20px;position:relative;scroll-snap-align:start}.screen-hidden{display:none}.screen-visible{display:flex}.decorations{position:fixed;inset:0;z-index:0;pointer-events:none;max-width:800px;margin:0 auto;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s ease}.decorations-visible{opacity:1;visibility:visible}.decorations-hidden{opacity:0;visibility:hidden}.img{filter:sepia(50%)}.disco-ball{position:absolute;object-fit:contain;transform-origin:center}.disco-ball-1{transform:rotate(15deg);top:-130px;left:-150px;z-index:3}.disco-ball-2{top:150px;right:-200px;transform:rotate(-10deg)}.disco-ball-3{bottom:0;right:-100px;transform:rotate(25deg)}.disco-ball-4{bottom:-90px;left:-150px;transform:rotate(-20deg)}.banner-img{position:absolute;top:0;left:50%;transform:translate(-50%);width:100%;z-index:2}.balloon{position:absolute;top:100vh;filter:sepia(80%);z-index:6;opacity:0}.balloon-visible{opacity:1;animation:flyUp 6s ease-out forwards}.balloon-1{right:-20%;z-index:6}.balloon-3{right:40%}@keyframes flyUp{0%{transform:translateY(0) rotate(0);opacity:0}50%{opacity:1}to{transform:translateY(-200vh) rotate(20deg)}}.cocktail{position:absolute;top:250px;left:10px;width:100px;transform:rotate(-15deg);z-index:2;filter:sepia(50%)}.cupcake{position:absolute;top:350px;right:0;width:130px;transform:rotate(25deg);z-index:2;filter:sepia(50%)}.stars{position:absolute;z-index:2}.star{position:absolute;font-size:25px;filter:hue-rotate(280deg)}.star-1{top:150px;right:40px}.star-2{bottom:100px;left:80px}.star-3{bottom:80px;left:50px;font-size:18px}.main-content{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}.photo-frame{position:relative;margin-bottom:20px}.person-image-container{position:absolute;width:300px;height:400px;margin:0 auto;transform:translateY(-100px);z-index:5}.person-image{top:0;left:0;width:100%;height:100%;object-fit:contain;z-index:5}.person-image-hidden{visibility:hidden}.person-image-sway{animation:sway 3s ease-in-out infinite}@keyframes sway{0%,to{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}.start-button{display:block;margin:20px auto 0;padding:15px 40px;font-size:18px;font-family:Georgia,serif;font-weight:700;color:#fff;background:var(--red);border:none;border-radius:30px;cursor:pointer;box-shadow:0 5px 20px #ff69b466;transition:transform .3s ease,box-shadow .3s ease;z-index:10;position:relative}.start-button:hover{transform:translateY(-3px);box-shadow:0 8px 25px #ff69b480}.start-button-hidden{display:none}.person-photo{background-image:none}.hero-video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;z-index:4;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.hero-video-visible{opacity:1;visibility:visible;z-index:6}.hero-video-fade{animation:fadeOutVideo 1s ease-out forwards}@keyframes fadeOutVideo{0%{opacity:1}to{opacity:0}}.party-hat{position:absolute;top:clamp(-20px,-4vh,-30px);right:clamp(-15px,-3vh,-20px);font-size:clamp(40px,8vh,60px);transform:rotate(20deg);filter:hue-rotate(280deg)}.party{position:relative;transform:translateY(100px);z-index:10;opacity:0;visibility:hidden;transition:opacity .6s ease,transform .6s ease,visibility .6s ease}.party-visible{opacity:1;visibility:visible;transform:translateY(-10)}.party-hidden{opacity:0;visibility:hidden;transform:translateY(-50px)}.age-number{position:relative;display:flex;justify-content:center;align-items:center;gap:clamp(5px,2vh,10px);margin-bottom:clamp(10px,3vh,20px)}.digit{font-size:clamp(60px,18vh,200px);font-weight:700;background:var(--pink);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none;filter:drop-shadow(2px 2px 4px rgba(255,20,147,.5));position:relative;-webkit-text-stroke:3px hotpink}.digit:before{content:"✨";position:absolute;font-size:40px;top:10px;right:10px;animation:sparkle 1.5s ease-in-out infinite}@keyframes sparkle{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.title{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(3px,1vh,5px);margin-bottom:clamp(15px,4vh,30px)}.letter{display:inline-block;font-size:2rem;padding:clamp(3px,1vh,5px) clamp(5px,1.5vh,8px);border-radius:5px;animation:bounce 2s ease-in-out infinite;color:#fff;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.letter:nth-child(1),.letter:nth-child(3),.letter:nth-child(4),.letter:nth-child(6),.letter:nth-child(7),.letter:nth-child(10),.letter:nth-child(12),.letter:nth-child(13){animation-name:bounce-rotate}.letter:nth-child(1){background:var(--red);animation-delay:0s;font-weight:900;font-style:normal}.letter:nth-child(2){background:var(--gold);animation-delay:.1s;font-weight:400;font-style:italic}.letter:nth-child(3){background:var(--red);animation-delay:.2s;font-weight:700;font-style:normal}.letter:nth-child(4){background:var(--pink);animation-delay:.3s;font-weight:800;font-style:normal}.letter:nth-child(5){background:#82beae;animation-delay:.4s;font-weight:600;font-style:italic}.letter:nth-child(6){background:var(--gold);animation-delay:.5s;font-weight:700;font-style:normal}.letter:nth-child(7){background:var(--red);animation-delay:.6s;font-weight:900;font-style:normal}.letter:nth-child(8){background:var(--pink);animation-delay:.7s;font-weight:500;font-style:italic}.letter:nth-child(9){background:transparent}.letter:nth-child(10){background:var(--red);animation-delay:.8s;font-weight:600;font-style:normal}.letter:nth-child(11){background:#82beae;animation-delay:.9s;font-weight:400;font-style:italic}.letter:nth-child(12){background:#feca57;animation-delay:1s;font-weight:800;font-style:normal}.letter:nth-child(13){background:var(--pink);animation-delay:1.1s;font-weight:500;font-style:normal}.letter:nth-child(14){background:var(--red);animation-delay:1.2s;font-weight:700;font-style:italic}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes bounce-rotate{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(0)}}.event-details{text-align:center;margin-top:clamp(10px,3vh,20px)}.date{font-size:clamp(16px,4vh,24px);font-weight:700;color:#333;margin-bottom:clamp(5px,1.5vh,10px)}.location{font-size:clamp(12px,3vh,16px);color:#555}.scroll-hint{position:fixed;bottom:30px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:5px;animation:bounce-hint 2s ease-in-out infinite;transition:opacity .3s ease;z-index:20}.scroll-hint.hidden,.scroll-hint-hidden{opacity:0;pointer-events:none}.scroll-hint-visible{opacity:1;pointer-events:auto}.scroll-hint p{font-size:14px;color:#666}@keyframes bounce-hint{0%,to{transform:translate(-50%) translateY(0)}50%{transform:translate(-50%) translateY(10px)}}.screen-title{font-size:2rem;text-align:center;color:#333;margin-bottom:clamp(20px,5vh,30px);display:flex;align-items:center;gap:10px}.letter-icon{font-size:clamp(30px,7vh,40px)}.location-card{background:#fff;border-radius:15px;padding:clamp(15px,4vh,25px);box-shadow:0 10px 30px #00000026;text-align:center;margin-bottom:clamp(20px,4vh,30px);width:100%;max-width:400px}.location-card img{width:100%;object-fit:cover;object-position:bottom}.location-card h3{font-size:clamp(20px,5vh,28px);color:#333;margin-bottom:10px}.location-card .address{font-size:clamp(14px,3.5vh,18px);color:#666;margin-bottom:10px}.location-card .time{font-size:clamp(18px,4.5vh,24px);font-weight:700;color:var(--red)}.map-container{width:100%;max-width:400px;margin-bottom:clamp(20px,4vh,30px)}.map-image{width:100%;height:auto;border-radius:15px;box-shadow:0 10px 30px #00000026;border:4px solid #fff}.transport-options{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;width:100%;max-width:500px;margin-bottom:clamp(20px,4vh,30px)}.transport-item{background:#fff;border-radius:12px;padding:clamp(12px,3vh,18px);display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 5px 15px #0000001a;min-width:120px;flex:1}.transport-icon{font-size:clamp(30px,6vh,40px)}.transport-item p{font-size:clamp(14px,3.5vh,16px);font-weight:700;color:#333}.transport-desc{font-size:clamp(11px,2.5vh,13px);color:#666}.btn{display:inline-block;padding:clamp(12px,3vh,16px) clamp(25px,6vh,35px);background:var(--red);color:#fff;text-decoration:none;border-radius:30px;font-size:clamp(14px,4vh,18px);font-weight:700;box-shadow:0 5px 20px #ff69b466;transition:transform .3s ease,box-shadow .3s ease}.btn:hover{transform:translateY(-3px);box-shadow:0 8px 25px #ff69b480}.dresscode-info{text-align:center;margin-bottom:clamp(20px,4vh,30px)}.dresscode-main{font-size:2rem;font-weight:700;background:var(--red);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px}.dresscode-desc{font-size:clamp(14px,3.5vh,18px);color:#666}.dresscode-examples{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-flow:dense;gap:clamp(10px,3vh,15px);width:100%;max-width:400px;margin-bottom:clamp(20px,4vh,30px)}.dresscode-examples .dresscode-item:last-child{grid-column:span 2;justify-self:center;width:100%}.dresscode-item{background:#fff;border-radius:12px;padding:clamp(15px,4vh,20px);display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 5px 15px #0000001a}.dresscode-emoji{font-size:clamp(35px,8vh,50px)}.dresscode-item p{font-size:clamp(12px,3vh,14px);color:#333;text-align:center}.dresscode-note{font-size:clamp(16px,4vh,20px);color:#333;font-style:italic}@media(max-width:850px){.invitation{padding:0}}@supports (padding: max(0px)){body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}.screen{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));padding-bottom:max(20px,env(safe-area-inset-bottom))}}@media(max-width:425px){.screen-title,.dresscode-main{font-size:1.5rem;text-align:center}p{font-size:14px}.letter{font-size:1.3rem}.person-photo{background-size:200px;background-repeat:no-repeat}.decorations img{scale:.7}.cocktail{top:150px}.cupcake{top:200px}.decorations .banner-img{scale:1}.location-card img{height:150px}}.falling-container{position:absolute;inset:0;pointer-events:none;z-index:100}.falling-item{position:absolute;top:-100px;width:60px;height:60px;object-fit:contain;filter:sepia(50%);animation:fall linear forwards}@keyframes fall{0%{transform:translateY(-200px) rotate(0);opacity:0}10%{opacity:1}to{transform:translateY(400px) rotate(360deg);opacity:1}}.falling-item-debounce{animation:fallDownDebounce .4s ease-in forwards}@keyframes fallDownDebounce{0%{transform:translateY(400px);opacity:1}10%{transform:translateY(300px);opacity:1}to{transform:translateY(100vh);opacity:0}}