:root{--bg-primary:#ffdee9;--bg-secondary:#b5fffc;--text-dark:#3e2f5b;--accent-pink:#ff6b9e;--accent-yellow:#ffd166;--accent-blue:#4ea8de;--accent-green:#06d6a0}body{background:linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);min-height:100vh;color:var(--text-dark);margin:0;padding:0;font-family:Quicksand,sans-serif;overflow-x:hidden}*{box-sizing:border-box}::-webkit-scrollbar{display:none}*{-ms-overflow-style:none;scrollbar-width:none}.app-container{width:100%;min-height:100vh}.hero-container{background-color:var(--bg-primary);isolation:isolate;width:100%;height:calc(100vh - 120px);position:relative;overflow:hidden}.hero-container:before{content:"";filter:blur(12px);z-index:-1;background-image:linear-gradient(#fff6,#fff6),url(/img2.png);background-position:50%;background-size:cover;position:absolute;inset:-5%}.hero-canvas{z-index:0;pointer-events:auto;cursor:crosshair;position:absolute;inset:0}.hero-content{z-index:10;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.hero-greeting{color:var(--accent-pink);-webkit-user-select:none;user-select:none;background:#ffffffb3;border-radius:50px;margin-bottom:1rem;padding:.5rem 1.5rem;font-family:Fredoka,sans-serif;font-size:1.5rem;font-weight:500;box-shadow:0 4px 15px #ff6b9e33}.hero-title{color:#fff;text-shadow:4px 4px 0px var(--accent-pink), 8px 8px 0px #0000001a;letter-spacing:.05em;-webkit-user-select:none;user-select:none;text-align:center;width:100%;margin:0;font-family:Fredoka,sans-serif;font-size:clamp(4rem,12vw,10rem);font-weight:700;line-height:1.1;animation:3s ease-in-out infinite gentleBounce}.hero-celebration{color:#fff;background:linear-gradient(45deg, var(--accent-pink), var(--accent-yellow));pointer-events:none;text-align:center;border:4px solid #fff;border-radius:50px;margin-top:clamp(1rem,3vw,2rem);padding:.75rem 2rem;font-family:Fredoka,sans-serif;font-size:clamp(1.2rem,4vw,2.5rem);animation:2s ease-in-out infinite alternate floatDeco;box-shadow:0 8px 25px #ff6b9e66}@keyframes gentleBounce{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes floatDeco{0%{transform:translateY(0)rotate(-2deg)}to{transform:translateY(-15px)rotate(2deg)}}.hero-hint{letter-spacing:.1em;color:var(--accent-blue);pointer-events:none;background:#fffc;border-radius:20px;padding:.5rem 1.5rem;font-family:Fredoka,sans-serif;font-size:1rem;font-weight:600;position:absolute;bottom:7.5rem;left:50%;transform:translate(-50%);box-shadow:0 4px 10px #4ea8de33}.console-bar{z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff80;border-top:4px solid #fff;border-bottom:4px solid #fff;flex-direction:column;justify-content:center;align-items:center;width:100%;padding:1.5rem 1rem;display:flex;position:relative;box-shadow:0 10px 30px #0000000d}.console-bar.birthday{background:#ffd16680}.console-time{flex-wrap:wrap;justify-content:center;gap:.75rem;font-family:Fredoka,sans-serif;font-size:clamp(1rem,3vw,1.5rem);font-weight:600;display:flex}.time-block{color:var(--accent-blue);border:2px solid var(--accent-blue);background:#fff;border-radius:15px;align-items:baseline;gap:.25rem;padding:.5rem 1rem;display:flex;box-shadow:0 4px 10px #0000001a}.time-block:nth-child(2n){border-color:var(--accent-pink);color:var(--accent-pink)}.time-block:nth-child(3n){border-color:var(--accent-green);color:var(--accent-green)}.time-label{opacity:.8;font-size:.6em}.console-dob{color:var(--text-dark);background:#fff;border-radius:20px;margin-top:1rem;padding:.5rem 1.5rem;font-family:Quicksand,sans-serif;font-size:1rem;font-weight:700;box-shadow:0 4px 10px #0000000d}.timeline-container{background:linear-gradient(to bottom, var(--bg-secondary), #ffe5f1);width:100%;height:400vh;position:relative}.timeline-sticky{width:100%;height:100vh;position:sticky;top:0;overflow:hidden}.timeline-year{color:#fff;text-shadow:3px 3px 0px var(--accent-pink);font-family:Fredoka,sans-serif;font-weight:700;position:absolute}.year-2023{font-size:clamp(2rem,8vw,4rem);bottom:10%;left:5%}.year-2024{font-size:clamp(2.5rem,10vw,5rem);top:33%;right:5%}.year-2025{font-size:clamp(2.5rem,10vw,5rem);bottom:25%;left:10%}.year-2026{font-size:clamp(2.5rem,10vw,5rem);top:15%;left:8%}.year-story{color:var(--text-dark);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:3px solid var(--accent-pink);background:#ffffffd9;border-radius:20px;max-width:400px;margin-top:1rem;padding:1rem 1.5rem;font-family:Quicksand,sans-serif;font-size:clamp(1.2rem,4vw,1.8rem);font-weight:700;line-height:1.4;box-shadow:0 10px 25px #00000026}.timeline-footer{text-align:center;color:var(--accent-pink);pointer-events:none;background:#ffffffb3;border-radius:20px;max-width:300px;margin:0 auto;padding:.5rem;font-family:Quicksand,sans-serif;font-size:1rem;font-weight:700;position:absolute;bottom:1rem;left:0;right:0}.scroll-indicator-wrapper{z-index:20;pointer-events:auto;position:absolute;bottom:2rem;left:50%;transform:translate(-50%)}.scroll-indicator{color:var(--accent-pink);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer;background:#ffffffb3;border:2px solid #fff;border-radius:30px;flex-direction:column;align-items:center;padding:.5rem 1.5rem;font-family:Fredoka,sans-serif;font-size:1.2rem;font-weight:600;transition:transform .2s;animation:2s ease-in-out infinite bounceScroll;display:flex;box-shadow:0 4px 15px #ff6b9e4d}.scroll-indicator:active{transform:scale(.95)}.scroll-arrow{margin-top:-.2rem;font-size:1.5rem;line-height:1}@keyframes bounceScroll{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}