:root{--bg-light:#fcfbf9;--text-main-light:#1a1a1a;--text-muted-light:#5c5c5c;--accent-gold:#c5a880;--card-bg-light:#fff;--bg-dark:#0a0a0a;--text-main-dark:#f0f0f0;--text-muted-dark:#a0a0a0;--accent-glow:#e0d0b0;--shadow-light:#0000000a;--shadow-medium:#00000014;--shadow-dark:#0000001f}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow-x:hidden}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-dark);color:var(--text-main-dark);font-family:Inter,sans-serif;transition:background-color 1.5s,color 1.5s}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#333;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.font-serif{font-family:Playfair Display,serif}.font-sans{font-family:Inter,sans-serif}.text-gold{color:var(--accent-gold)}.heading-primary{letter-spacing:-.02em;font-family:Playfair Display,serif;font-size:clamp(2.5rem,5vw,4.5rem);font-weight:600;line-height:1.1}.heading-secondary{font-family:Playfair Display,serif;font-size:clamp(1.8rem,3vw,2.5rem);font-weight:500;line-height:1.3}.page-container{width:100vw;min-height:100vh;position:absolute;top:0;left:0}.dark-page{background-color:var(--bg-dark);color:var(--text-main-dark)}.light-page{background-color:var(--bg-light);color:var(--text-main-light)}.perspective-container{perspective:2000px;transform-style:preserve-3d}.paper-card{background:var(--card-bg-light);box-shadow:0 10px 40px -10px var(--shadow-medium), 0 40px 100px -20px var(--shadow-dark), inset 0 0 0 1px #ffffff80;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E");border-radius:4px;position:relative}.paper-card:before{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 60px #00000003}.app-container{justify-content:center;align-items:center;width:100%;min-height:100vh;padding:4rem 2rem;display:flex;position:relative}.ambient-light{pointer-events:none;z-index:0;background:radial-gradient(circle at 50% 0,#c5a8800d,#0000 70%);width:100vw;height:100vh;position:fixed;top:0;left:0}.main-content-wrapper{perspective:2000px;z-index:1;width:100%;max-width:800px}.card-3d{will-change:transform;transform-style:preserve-3d}@media (width<=480px){.app-container{padding:2rem 1rem}}.dawn-container{color:#2c241b;background-color:#fdfaf6;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.dawn-bg{z-index:1;background:radial-gradient(circle,#d4af3714 0%,#0000 70%),linear-gradient(135deg,#f0e6d266 0%,#0000 100%);width:100vw;height:100vh;transition:all 1.5s ease-in;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.dawn-bg.ignited{background:radial-gradient(circle,#fff 0%,#fff8dc 40%,#fdfaf6 100%)}.dawn-content{z-index:10;flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.intro-text-wrapper{text-align:center;margin-bottom:5rem;padding:0 20px}.dawn-text{letter-spacing:-.02em;color:#2c241b;margin-bottom:1rem;font-family:Playfair Display,serif;font-size:clamp(2.5rem,5vw,4.5rem);line-height:1.2}.dawn-subtext{letter-spacing:.3em;text-transform:uppercase;color:#bfa85a;font-family:Inter,sans-serif;font-size:clamp(1rem,2vw,1.2rem)}.begin-action-wrapper{flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.dawn-button{cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#8b6e4e;letter-spacing:.15em;text-transform:uppercase;background:#ffffffb3;border:1px solid #d4af3766;border-radius:50px;padding:1.2rem 4rem;font-family:Inter,sans-serif;font-size:1rem;font-weight:500;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 10px 30px #0000000d,inset 0 0 0 1px #fff}.dawn-button:hover{color:#5c4f42;border-color:#d4af37cc;box-shadow:0 15px 40px #d4af3726,inset 0 0 0 1px #fff}.button-glow{background:linear-gradient(90deg,#0000,#fffc,#0000);width:50%;height:100%;animation:3s infinite shine;position:absolute;top:0;left:-100%;transform:skew(-20deg)}@keyframes shine{0%{left:-100%}20%{left:200%}to{left:200%}}.dawn-volume{color:#a0958a;position:absolute;bottom:8%}.dawn-volume span{color:#bfa85a}.journey-wrapper{background-color:#fdfaf6;min-height:100vh;position:relative}.dawn-particles{z-index:0;background-image:radial-gradient(1.5px 1.5px at 20px 30px,#d4af3733,#0000),radial-gradient(2px 2px at 80px 100px,#d4af3726,#0000),radial-gradient(1px 1px at 150px 80px,#d4af3740,#0000);background-repeat:repeat;background-size:250px 250px;position:fixed;inset:0}.card-gallery{z-index:10;flex-direction:column;gap:25vh;max-width:900px;margin:0 auto;padding:20vh 2rem 25vh;display:flex;position:relative}.memory-card{width:75%;max-width:500px;position:relative}.left-card{align-self:flex-start}.right-card{align-self:flex-end}.card-inner{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#fff9;border:1px solid #d4af3733;border-radius:12px;padding:3rem 2.5rem;transition:transform .4s,box-shadow .4s;position:relative;box-shadow:0 20px 50px #0000000d,inset 0 0 0 1px #fffc}.card-inner:hover{transform:translateY(-5px);box-shadow:0 30px 60px #d4af371a,inset 0 0 0 1px #fff}.quote-mark{color:#d4af371a;font-family:Playfair Display,serif;font-size:6rem;line-height:1;position:absolute;top:10px;left:20px}.memory-card p{z-index:1;color:#2c241b;text-align:center;font-size:clamp(1.4rem,3vw,2.2rem);font-style:italic;line-height:1.5;position:relative}.final-action-wrapper{align-self:center;margin-top:10vh}.scroll-indicator-dawn{color:#bfa85a;z-index:20;text-transform:uppercase;letter-spacing:.15em;flex-direction:column;align-items:center;gap:.5rem;font-size:.85rem;display:flex;position:fixed;bottom:5vh;left:50%;transform:translate(-50%)}@media (width<=768px){.card-gallery{gap:15vh;padding:15vh 1.5rem 20vh}.memory-card{width:100%;max-width:100%}.left-card,.right-card{align-self:center}.card-inner{padding:2.5rem 1.5rem}.memory-card p{font-size:1.3rem}}.invitation-wrapper{perspective:2500px;cursor:pointer;justify-content:center;align-items:center;width:100%;height:100%;padding:1rem;display:flex}.envelope-3d{aspect-ratio:1.5;width:90vw;max-width:600px;transform-style:preserve-3d;z-index:10;transition:transform 1s;position:relative}.envelope-3d:before{content:"";z-index:5;pointer-events:none;border:1px solid #d4af3740;border-radius:6px;transition:opacity .8s 1s;position:absolute;inset:6px}.envelope-3d.is-open:before{opacity:0}.env-back{z-index:1;background:radial-gradient(at 30% 20%,#781e2866 0%,#0000 60%),linear-gradient(145deg,#3b0a1a,#1a0510,#0d0208);border:1px solid #d4af3726;border-radius:10px;width:100%;height:100%;position:absolute;top:0;left:0;box-shadow:inset 0 0 80px #000000b3,inset 0 0 20px #781e2833,0 20px 60px #000c,0 0 2px #d4af374d}.env-front{z-index:3;pointer-events:none;width:100%;height:100%;transition:opacity .8s 1s;position:absolute;top:0;left:0}.env-front-left{clip-path:polygon(0 0,50% 50%,0 100%);background:linear-gradient(135deg,#2d0812,#1e0610);border-radius:10px;width:100%;height:100%;position:absolute;top:0;left:0;box-shadow:inset 5px 0 30px #781e2826}.env-front-right{clip-path:polygon(100% 0,50% 50%,100% 100%);background:linear-gradient(225deg,#2d0812,#1a0510);border-radius:10px;width:100%;height:100%;position:absolute;top:0;left:0;box-shadow:inset -5px 0 30px #781e2826}.env-front-bottom{clip-path:polygon(0 100%,50% 50%,100% 100%);background:linear-gradient(#25081a,#3b0a1a);border-bottom:2px solid #d4af3766;border-radius:10px;width:100%;height:100%;position:absolute;top:0;left:0;box-shadow:inset 0 -10px 30px #781e2833}.envelope-3d.is-open .env-front,.envelope-3d.is-open .env-back{opacity:0;pointer-events:none}.env-flap-wrapper{z-index:4;transform-origin:top;pointer-events:none;width:100%;height:100%;transition:transform .8s cubic-bezier(.4,0,.2,1) .2s,opacity .8s 1s;position:absolute;top:0;left:0}.env-flap-bg{clip-path:polygon(0 0,100% 0,50% 55%);background:linear-gradient(#4a0e20,#2d0812,#1a0510);border-top:2px solid #d4af3780;border-radius:10px;width:100%;height:100%;position:absolute;top:0;left:0;box-shadow:0 10px 30px #000000b3,inset 0 5px 20px #781e2833}.envelope-3d.is-open .env-flap-wrapper{opacity:0;transition:transform .8s cubic-bezier(.4,0,.2,1),opacity .8s 1s;transform:rotateX(180deg)}.env-seal-position{z-index:5;pointer-events:auto;aspect-ratio:1;width:15%;min-width:60px;position:absolute;top:55%;left:50%;transform:translate(-50%,-50%)}.env-seal{color:#fff;text-shadow:0 1px 3px #00000080;background:radial-gradient(circle at 35% 35%,#ffffff4d,#0000 50%),radial-gradient(circle at 30% 30%,gold,#daa520,#b8860b,#8b6914);border:2.5px solid #ffd70099;border-radius:50%;justify-content:center;align-items:center;width:100%;height:100%;font-family:Playfair Display,serif;font-size:clamp(.8rem,2vw,1.2rem);font-style:italic;font-weight:700;display:flex;box-shadow:0 8px 25px #000000b3,0 0 15px #d4af3766,inset 0 0 12px #ffffff40,inset 0 -3px 6px #0000004d}.letter-paper{z-index:2;box-sizing:border-box;cursor:default;isolation:isolate;background-color:#fffdfa;background-image:radial-gradient(#d4af370d 0%,#0000 90%);border-radius:4px;flex-direction:column;width:90%;height:max-content;min-height:110%;padding:4% 4% 2rem;transition:transform 1s cubic-bezier(.34,1.56,.64,1) .8s,clip-path 1s .8s,z-index 0s .8s,box-shadow 1s .8s;display:flex;position:absolute;top:5%;left:5%;overflow:hidden;box-shadow:inset 0 0 100px #8b73551a,0 15px 40px #0009}.letter-paper:after{content:"";mix-blend-mode:multiply;filter:contrast(1.4)brightness(1.1)saturate(.8);opacity:.8;pointer-events:none;z-index:0;background-image:url(/flower.jpg);background-position:0 100%;background-repeat:no-repeat;background-size:contain;width:180px;height:250px;position:absolute;bottom:-10px;left:-10px}.envelope-3d:not(.is-open) .letter-paper{clip-path:inset(0 0 calc(100% - 150px))}.envelope-3d.is-open .letter-paper{clip-path:inset(0);z-index:15;transform:translateY(-25%)scale(1.02);box-shadow:0 30px 60px #000000b3,0 0 40px #d4af3726}.letter-content-inner{z-index:2;opacity:0;text-align:left;flex-direction:column;align-items:flex-start;height:100%;padding:2% 4%;transition:opacity 1s 1.5s;display:flex;position:relative;overflow-y:hidden}.letter-content-inner::-webkit-scrollbar{width:6px}.letter-content-inner::-webkit-scrollbar-thumb{background:#d4af3766;border-radius:3px}.envelope-3d.is-open .letter-content-inner{opacity:1}.letter-header{justify-content:flex-end;width:100%;margin-bottom:2rem;padding-bottom:.5rem;display:flex}.letter-date,.letter-time{color:#7b6d5c;text-transform:uppercase;letter-spacing:.1em;font-family:Inter,sans-serif;font-size:.8rem;font-weight:500}.letter-salutation{color:#2c241b;text-align:left;width:100%;margin-bottom:1.5rem;font-family:Playfair Display,serif;font-size:2.2rem;font-weight:500}.highlight-name{color:#bfa85a;text-shadow:0 1px 4px #0000000d;font-size:2.5rem;font-style:italic}.letter-body{text-align:left;flex-direction:column;gap:1.2rem;width:100%;margin-bottom:2rem;display:flex}.letter-paragraph{color:#2c221a;letter-spacing:.02em;text-align:left;font-family:Playfair Display,serif;font-size:1.05rem;font-style:normal;line-height:1.7}.dynamic-message{z-index:10;position:relative}.letter-controls-fixed{z-index:9999;opacity:0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#141414b3;border:1px solid #d4af374d;border-radius:30px;align-items:center;gap:8px;padding:6px 12px;animation:1s 1.5s forwards fadeIn;display:flex;position:fixed;top:20px;right:80px;box-shadow:0 4px 15px #00000080}@keyframes fadeIn{to{opacity:1}}.close-timer{color:#e6d5c3;letter-spacing:.5px;margin-right:4px;font-family:Inter,sans-serif;font-size:.75rem;font-weight:600}.close-letter-btn{color:#d4af37;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:4px;transition:all .3s;display:flex}.close-letter-btn:hover{color:#fff;background:#d4af3726;transform:scale(1.1)}.letter-footer{text-align:right;align-self:flex-end;width:100%;margin-top:auto;padding-right:1rem}.signature{color:#bfa85a;text-shadow:0 1px 3px #0000000d;margin-top:1rem;margin-bottom:1rem;font-family:Great Vibes,cursive;font-size:3.5rem;font-weight:400;display:inline-block;transform:rotate(-3deg)}.humour-text{color:#9c8e7e;font-family:Inter,sans-serif;font-size:.85rem;font-style:italic}@media (width<=900px){.envelope-3d{width:95vw}}@media (width<=768px){.envelope-3d{width:95vw}.letter-salutation{font-size:1.6rem}.highlight-name{font-size:1.8rem}.letter-paragraph{font-size:.9rem}.poetic-line{font-size:1rem}.signature{font-size:1.6rem}.letter-content-inner{padding:8% 6%}}@media (width<=480px){.envelope-3d{aspect-ratio:1.4;width:96vw}.letter-paper{height:210%}.envelope-3d:not(.is-open) .letter-paper{clip-path:inset(0 0 60%)}.invitation-wrapper{height:100dvh;padding:0}.letter-content-inner{padding:6% 5%}.letter-header{margin-bottom:.6rem;padding-bottom:.2rem}.letter-date,.letter-time{font-size:.7rem}.letter-salutation{margin-bottom:.3rem;font-size:1.25rem}.highlight-name{font-size:1.35rem}.letter-body{gap:.4rem;margin-bottom:.8rem}.letter-paragraph{font-size:.75rem;line-height:1.4}.poetic-line{font-size:.85rem}.letter-quote-box{margin:.2rem 0;padding:.6rem .8rem}.sign-off{margin-bottom:.1rem;font-size:.75rem}.signature{margin-bottom:.3rem;font-size:1.2rem}.humour-text{font-size:.65rem}}
