*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body,#root{color:#fff;background:#0d0612;width:100%;margin:0;padding:0;font-family:Cormorant Garamond,Georgia,serif;overflow-x:hidden}body{background-color:#0000;background-image:radial-gradient(at top,#3a0a3a 0%,#0d0612 60%),radial-gradient(at bottom,#5a1a3a 0%,#0d0612 60%);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box;background-clip:border-box,border-box;min-height:100vh}button{cursor:pointer;font-family:inherit}img{display:block}.start-gate{z-index:1000;text-align:center;background:radial-gradient(circle,#5a1a3a 0%,#0d0612 100%);flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.start-gate h1{letter-spacing:1px;color:#ffd1dc;text-shadow:0 0 30px #ff96c880;margin-bottom:18px;font-size:clamp(2.2rem,9vw,4rem);font-weight:400}.start-gate p{color:#ffb6c1;max-width:90%;margin-bottom:40px;font-size:clamp(1rem,4vw,1.3rem);font-style:italic;line-height:1.5}.start-gate button{color:#fff;letter-spacing:1px;background:linear-gradient(135deg,#ff6b9d 0%,#c44569 100%);border:none;border-radius:999px;padding:18px 50px;font-size:clamp(1.05rem,4vw,1.3rem);box-shadow:0 12px 40px #ff6b9d73}.hero{text-align:center;scroll-snap-align:start;flex-direction:column;justify-content:center;align-items:center;height:100vh;padding:24px;display:flex}.hero .ribbon{margin-bottom:8px;font-size:clamp(2rem,8vw,3rem)}.hero h1{background:linear-gradient(90deg,#ffe4ec,#ff6b9d,#ffd1dc);color:#0000;-webkit-background-clip:text;background-clip:text;margin-bottom:18px;font-size:clamp(2.5rem,11vw,5.5rem);font-weight:400;line-height:1.1}.hero .sub{color:#ffb6c1;margin-bottom:8px;font-size:clamp(1rem,4.5vw,1.4rem);font-style:italic}.hero .age{color:#ffd1dc;letter-spacing:4px;margin-top:30px;font-size:clamp(.9rem,3.5vw,1.1rem)}.scroll-cue{letter-spacing:3px;color:#ffd1dc;opacity:.7;font-size:.85rem;position:absolute;bottom:30px}.scroller{scroll-snap-type:y mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;height:100vh;overflow-y:scroll}.scroller::-webkit-scrollbar{display:none}.slide{scroll-snap-align:start;scroll-snap-stop:always;justify-content:center;align-items:center;width:100%;height:100vh;padding:20px;display:flex;position:relative;overflow:hidden}.frame{background:#1a0a1f;border-radius:22px;width:100%;max-width:520px;height:78vh;position:relative;overflow:hidden;box-shadow:0 30px 80px #000000b3,0 0 0 1px #ffb6c140,0 0 60px #ff6b9d26}.frame img{object-fit:contain;background:#1a0a1f;width:100%;height:100%}.caption{text-align:center;z-index:3;pointer-events:none;padding:0 24px;position:absolute;bottom:4vh;left:0;right:0}.caption .nick{letter-spacing:6px;text-transform:uppercase;color:#ffb6c1;text-shadow:0 2px 12px #000000e6;margin-bottom:8px;font-size:clamp(.75rem,3vw,.95rem);display:block}.caption .line{color:#fff;text-shadow:0 2px 14px #000000f2;font-size:clamp(1.1rem,5vw,1.6rem);font-style:italic;line-height:1.4}.index{letter-spacing:4px;color:#ffd1dc;opacity:.6;z-index:3;font-size:.8rem;position:absolute;top:24px;left:24px}.final{scroll-snap-align:start;text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100vh;padding:30px 24px;display:flex}.heart{filter:drop-shadow(0 0 40px #ff6496d9);margin-bottom:24px;font-size:clamp(5rem,22vw,10rem)}.final h2{color:#ffd1dc;text-shadow:0 0 24px #ff96c88c;margin-bottom:22px;font-size:clamp(1.8rem,7vw,3rem);font-weight:400}.final .msg{color:#ffe4ec;max-width:600px;font-size:clamp(1.05rem,4.5vw,1.35rem);font-style:italic;line-height:1.75}.final .sig{color:#ffb6c1;letter-spacing:2px;margin-top:28px;font-size:clamp(.9rem,3.5vw,1.1rem)}.floaters{pointer-events:none;z-index:1;position:fixed;inset:0;overflow:hidden}.floaters span{opacity:.55;font-size:18px;position:absolute;bottom:-40px}.dots{z-index:50;flex-direction:column;gap:7px;display:flex;position:fixed;top:50%;right:14px;transform:translateY(-50%)}.dots span{background:#ffb6c14d;border-radius:50%;width:5px;height:5px;transition:all .4s}.dots span.active{background:#ff6b9d;border-radius:3px;height:18px}.audio-toggle{z-index:60;color:#ffd1dc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ff6b9d2e;border:1px solid #ffb6c166;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-size:1rem;display:flex;position:fixed;top:16px;right:16px}
