:root{--ink:#f8edf1;--muted:#bcaab1;--cream:#100c11;--blush:#24151c;--line:rgba(255,255,255,.09);--shadow:0 30px 90px rgba(0,0,0,.38)}
body{background:#100c11;color:var(--ink);cursor:none}.intro{position:fixed;z-index:999;inset:0;display:grid;place-content:center;text-align:center;background:#0c090d;transition:opacity .75s,visibility .75s}.intro.leave{opacity:0;visibility:hidden}.intro-heart{font-size:34px;color:var(--accent);filter:drop-shadow(0 0 25px var(--accent));animation:introBeat 1s infinite}.intro-line{width:160px;height:1px;margin:23px auto 13px;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:introLine 1.5s}.intro p{font-size:9px;letter-spacing:.42em;color:#bba5ad}@keyframes introBeat{50%{transform:scale(1.18)}}@keyframes introLine{from{transform:scaleX(0)}}
.scroll-progress{position:fixed;z-index:101;left:0;top:0;height:2px;width:0;background:linear-gradient(90deg,var(--accent),#ffe3ea);box-shadow:0 0 14px var(--accent)}#ambientCanvas{position:fixed;z-index:0;inset:0;pointer-events:none}.cursor-dot,.cursor-ring{position:fixed;z-index:1000;left:0;top:0;border-radius:50%;pointer-events:none;transform:translate(-100px,-100px)}.cursor-dot{width:5px;height:5px;margin:-2.5px;background:#fff}.cursor-ring{width:34px;height:34px;margin:-17px;border:1px solid rgba(255,205,219,.65);transition:width .2s,height .2s,margin .2s,background .2s}.cursor-ring.hover{width:52px;height:52px;margin:-26px;background:rgba(233,140,165,.1)}
.nav{top:20px;height:68px;width:min(1180px,calc(100% - 38px));padding:0 16px 0 24px;border-color:rgba(255,255,255,.1);background:rgba(15,10,14,.64);box-shadow:0 18px 60px rgba(0,0,0,.28);backdrop-filter:blur(24px) saturate(140%)}.brand{color:#fff;transition:transform .2s}.brand span{filter:drop-shadow(0 0 12px var(--accent))}.nav nav{height:100%;gap:2px}.nav nav a{display:flex;align-items:center;gap:7px;height:100%;padding:0 19px;color:#c8b9be;overflow:hidden;transition:.35s}.nav nav a i{font-style:normal;font-size:8px;color:#806f75}.nav nav a:before{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;background:var(--accent);box-shadow:0 0 14px var(--accent);transition:.35s}.nav nav a:after{display:none}.nav nav a:hover,.nav nav a.active{color:#fff;background:linear-gradient(transparent,rgba(233,140,165,.08))}.nav nav a.active:before{width:70%;left:15%}.music-btn{position:relative;display:grid;place-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);box-shadow:none;overflow:visible}.music-btn.playing{animation:none}.music-btn:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--accent);opacity:0}.music-btn.playing:after{animation:musicPulse 1.7s infinite}.music-bars{height:15px;display:flex;gap:3px;align-items:center}.music-bars i{width:2px;height:5px;background:#fff}.music-btn.playing .music-bars i{animation:bars .75s ease infinite alternate}.music-btn.playing .music-bars i:nth-child(2){animation-delay:.2s}.music-btn.playing .music-bars i:nth-child(3){animation-delay:.4s}@keyframes bars{to{height:15px}}@keyframes musicPulse{50%{transform:scale(1.15);opacity:.55}100%{transform:scale(1.35);opacity:0}}
.hero{background:radial-gradient(circle at 50% 35%,rgba(126,52,78,.28),transparent 27%),radial-gradient(circle at 10% 10%,rgba(90,48,73,.2),transparent 25%),linear-gradient(145deg,#0b090c,#171017 55%,#0c090d);isolation:isolate}.hero:before{width:900px;height:900px;left:-520px;bottom:-600px;border-color:rgba(233,140,165,.1)}.hero:after{width:720px;height:720px;right:-440px;top:-370px;border-color:rgba(255,255,255,.07)}.hero-noise{position:absolute;inset:0;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}.hero-glow{width:480px;height:480px;background:rgba(143,55,84,.11);filter:blur(65px);box-shadow:0 0 180px rgba(233,140,165,.2);animation:glowBreath 5s infinite}.hero-orbit{position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;animation:orbit 24s linear infinite}.hero-orbit:after{content:"";position:absolute;top:50%;left:-4px;width:7px;height:7px;background:var(--accent);border-radius:50%;box-shadow:0 0 18px var(--accent)}.hero-orbit.one{width:560px;height:560px}.hero-orbit.two{width:720px;height:720px;animation-direction:reverse;animation-duration:35s}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes glowBreath{50%{transform:scale(1.13);opacity:.7}}
.avatars{margin-bottom:28px}.avatar{width:66px;height:66px;border:1px solid rgba(255,255,255,.28);background:linear-gradient(145deg,#bb627e,#6f2d48);box-shadow:0 15px 45px rgba(0,0,0,.4);font-size:20px}.avatar.alt{background:linear-gradient(145deg,#65788b,#293846)}.eyebrow{color:#d9a5b5;font-size:9px}.hero h1{margin:17px 0;color:#fff;font-size:clamp(44px,8vw,86px);text-shadow:0 8px 40px rgba(0,0,0,.5)}.hero h1 span{display:inline-block;animation:titleFloat 5s ease-in-out infinite}.hero h1 span:last-child{animation-delay:-2.5s}.hero h1 em{text-shadow:0 0 30px var(--accent)}@keyframes titleFloat{50%{transform:translateY(-5px)}}.hero-copy{color:#c8b5bb;font-size:15px}.love-clock{position:relative;margin-top:42px}.clock-aura{position:absolute;left:50%;top:50%;width:160px;height:80px;transform:translate(-50%,-50%);background:rgba(233,140,165,.13);filter:blur(25px)}.love-clock strong{position:relative;color:#fff;font-size:72px;text-shadow:0 0 35px rgba(233,140,165,.45)}.love-clock span{position:relative;color:#b9a5ab}.live-time{color:#847279}.live-time span{color:#d8bdc5}.scroll-down{position:relative;overflow:hidden;color:#d2bec4;border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:12px 20px;margin-top:38px;transition:.3s}.scroll-down:hover{color:#fff;border-color:rgba(233,140,165,.5)}
.section{z-index:1;background:#100c11}.section.soft,.message-section{background:linear-gradient(145deg,#171016,#100c11)}.section:before{content:"";position:absolute;left:50%;top:0;width:min(900px,80%);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent)}.section-head>p{font-size:9px}.section-head h2{color:#fff;font-size:clamp(32px,4vw,48px);letter-spacing:.07em}.section-head h2:after{content:"";display:block;width:38px;height:1px;margin:17px auto 0;background:var(--accent);box-shadow:0 0 10px var(--accent)}.section-head span{color:#9f8d93}.photo-card{border:1px solid rgba(255,255,255,.12);box-shadow:0 28px 70px rgba(0,0,0,.42);transition:transform .25s,box-shadow .4s}.photo-card:hover{box-shadow:0 35px 100px rgba(0,0,0,.55),0 0 0 1px rgba(233,140,165,.25)}.photo-card:before{content:"VIEW";position:absolute;z-index:3;right:18px;top:18px;padding:7px 9px;border:1px solid rgba(255,255,255,.24);border-radius:999px;color:#fff;font-size:8px;letter-spacing:.2em;opacity:0;transition:.3s}.photo-card:hover:before{opacity:1}.empty-card{border-color:rgba(233,140,165,.25);background:rgba(255,255,255,.025)}
.timeline:before{background:linear-gradient(transparent,var(--accent),transparent)}.timeline-icon{background:#1e141a;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 0 7px #110d11}.timeline-card,.wish-card,.message-form,.note{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.085);box-shadow:0 24px 75px rgba(0,0,0,.28);backdrop-filter:blur(18px)}.timeline-card{transition:.35s}.timeline-card:hover{transform:translateX(8px);border-color:rgba(233,140,165,.28)}.timeline-card h3,.wish-card h3,.note header b{color:#fff}.timeline-card p,.wish-card p,.note p{color:#bba8ae}.wish-card{position:relative;overflow:hidden;transition:.4s}.wish-card:hover{transform:translateY(-9px);border-color:rgba(233,140,165,.35)}.wish-card>span{background:#271820}.message-form label{color:#cdbcc2}.message-form input,.message-form textarea{background:rgba(0,0,0,.18);border-color:rgba(255,255,255,.1);color:#fff}.message-form button{position:relative;overflow:hidden;background:linear-gradient(120deg,#a84868,var(--accent),#bd5a78);background-size:200%;transition:.4s}.message-form button:hover{background-position:100%;transform:translateY(-2px)}.reply{background:rgba(233,140,165,.09)}.anniversary{z-index:1;background:radial-gradient(circle at 50% 40%,rgba(233,140,165,.25),transparent 24%),linear-gradient(145deg,#190e14,#0d090c)}footer{position:relative;z-index:2;background:#0b080b;border-top:1px solid rgba(255,255,255,.07)}
.lightbox{opacity:0;transition:.3s}.lightbox.open{opacity:1}.lightbox img{transform:scale(.92);opacity:0;transition:.45s}.lightbox.open img{transform:none;opacity:1}.reveal{filter:blur(7px);transform:translateY(35px) scale(.985);transition:opacity .85s var(--delay),transform .85s var(--delay),filter .85s var(--delay)}.reveal.visible{filter:none}.ripple{position:absolute!important;width:10px;height:10px;border-radius:50%;pointer-events:none;background:rgba(255,255,255,.45);transform:translate(-50%,-50%);animation:ripple .75s ease-out forwards}@keyframes ripple{to{width:260px;height:260px;opacity:0}}.mobile-dock{display:none}
@media(max-width:800px){body{cursor:auto;padding-bottom:74px}.cursor-dot,.cursor-ring{display:none}.nav{top:10px;height:56px;width:calc(100% - 20px);padding:0 10px 0 16px;border-radius:18px}.nav .brand{max-width:calc(100% - 54px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hero{min-height:100svh;padding:105px 16px 90px}.hero-orbit.one{width:390px;height:390px}.hero-orbit.two{width:520px;height:520px}.hero-glow{width:280px;height:280px}.avatar{width:58px;height:58px}.hero h1{font-size:clamp(37px,11vw,52px);line-height:1.2}.hero-copy{font-size:13px;line-height:1.8;max-width:310px;margin-left:auto;margin-right:auto}.love-clock{margin-top:30px}.love-clock strong{font-size:56px}.live-time{font-size:9px;letter-spacing:.07em}.section{padding:82px 16px}.section-head{margin-bottom:35px}.section-head h2{font-size:31px}.section-head span{font-size:13px;line-height:1.75}.photo-grid{grid-template-columns:1fr 1fr;grid-auto-rows:150px;gap:9px}.photo-card,.photo-card:nth-child(n){border-radius:15px;grid-column:span 1;grid-row:span 1}.photo-card:nth-child(4n+1){grid-column:span 2;grid-row:span 2}.photo-card span{left:13px;bottom:12px}.photo-card:before{display:none}.timeline-item{grid-template-columns:44px 1fr;gap:12px}.timeline:before{left:21px}.timeline-icon{width:44px;height:44px}.timeline-card{padding:18px;border-radius:16px}.timeline-card:hover,.wish-card:hover{transform:none}.wish-grid{gap:11px}.wish-card{padding:19px;border-radius:17px}.message-layout{gap:16px}.message-form{position:static;padding:21px;border-radius:19px}.note{padding:17px;border-radius:16px}.anniversary{padding:85px 18px}.anniversary strong{font-size:68px}.mobile-dock{position:fixed;z-index:90;display:flex;left:10px;right:10px;bottom:max(9px,env(safe-area-inset-bottom));height:62px;padding:5px;border:1px solid rgba(255,255,255,.11);border-radius:20px;background:rgba(15,10,14,.88);backdrop-filter:blur(24px);box-shadow:0 -10px 45px rgba(0,0,0,.36)}.mobile-dock a{position:relative;overflow:hidden;flex:1;display:grid;place-items:center;align-content:center;gap:2px;color:#85747a;border-radius:15px}.mobile-dock a i{font-style:normal;font-size:17px}.mobile-dock a span{font-size:9px}.mobile-dock a.active{color:#fff;background:rgba(233,140,165,.16);text-shadow:0 0 12px var(--accent)}.lightbox{padding:15px}.lightbox img{max-width:94vw;max-height:70vh}}
@media(max-width:380px){.hero h1{font-size:34px}.love-clock strong{font-size:50px}.photo-grid{grid-auto-rows:135px}.section{padding-left:13px;padding-right:13px}.mobile-dock{left:6px;right:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* Mist-blue moonlight theme with drifting sakura */
body{background:#0d1524;background-image:radial-gradient(circle at 12% 8%,rgba(110,154,225,.14),transparent 25%),radial-gradient(circle at 88% 28%,rgba(192,204,241,.08),transparent 23%)}.nav{background:rgba(11,20,36,.68)}.hero{background:radial-gradient(circle at 50% 34%,rgba(98,137,205,.29),transparent 28%),radial-gradient(circle at 12% 12%,rgba(170,192,232,.14),transparent 26%),linear-gradient(145deg,#09111f,#14233b 54%,#0a1322)}.hero-glow{background:rgba(102,148,225,.15);box-shadow:0 0 190px rgba(108,151,224,.24)}.hero-orbit:after{background:#bdd2ff;box-shadow:0 0 20px #8bb2ff}.section{background:#0d1524}.section.soft,.message-section{background:linear-gradient(145deg,#14223a,#0c1525)}
.album-shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.album-folder{position:relative;isolation:isolate;min-height:390px;border:1px solid rgba(255,255,255,.11);border-radius:26px;overflow:hidden;background:linear-gradient(145deg,#182945,#0e1a2d);box-shadow:0 28px 80px rgba(0,0,0,.35);transition:transform .45s,box-shadow .45s}.album-folder:nth-child(3n+2){transform:translateY(22px)}.album-folder:hover{transform:translateY(-10px);box-shadow:0 40px 110px rgba(3,10,24,.55),0 0 0 1px rgba(142,180,241,.25)}.album-folder:nth-child(3n+2):hover{transform:translateY(12px)}.album-folder img,.album-placeholder{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s}.album-placeholder{display:grid;place-items:center;background:radial-gradient(circle at 50% 35%,#28456f,#101d32)}.album-placeholder span{font-size:38px;color:#a8c6f7;filter:drop-shadow(0 0 22px #8fb2eb)}.album-folder:hover img{transform:scale(1.07)}.album-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,13,25,.08),rgba(8,15,27,.2) 35%,rgba(6,12,23,.96))}.album-info{position:absolute;z-index:2;left:25px;right:25px;bottom:25px}.album-info small{font-size:8px;letter-spacing:.24em;color:#a9c5ee}.album-info h3{margin:8px 0;font:600 25px "Noto Serif SC";color:#fff}.album-info p{height:40px;margin:0 0 15px;color:#aab8ca;font-size:12px;line-height:1.6;overflow:hidden}.album-info b{display:flex;justify-content:space-between;font-size:9px;letter-spacing:.17em;color:#8099bb}.album-info i{font-style:normal;font-size:17px;transition:.3s}.album-folder:hover .album-info i{transform:translateX(6px);color:#fff}.collection-link{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;margin-top:3px;padding:17px 19px;border:1px solid rgba(255,255,255,.1);border-radius:15px;color:#c6d5ec;background:rgba(110,152,220,.08);font-size:12px}.collection-link span{font-size:18px}.anniversary{background:radial-gradient(circle at 50% 40%,rgba(110,153,224,.28),transparent 25%),linear-gradient(145deg,#14243d,#08111f)}footer{background:#08101c}.mobile-dock{background:rgba(10,19,34,.9)!important}
.petals i{width:11px;height:8px;border-radius:90% 15% 90% 15%;background:linear-gradient(135deg,rgba(245,211,227,.72),rgba(181,204,242,.45));filter:drop-shadow(0 0 3px rgba(211,225,250,.3));animation-name:sakuraFall}@keyframes sakuraFall{0%{transform:translate3d(0,-20px,0) rotate(0);opacity:0}10%{opacity:.8}50%{transform:translate3d(45px,50vh,0) rotate(220deg)}100%{transform:translate3d(-25px,105vh,0) rotate(520deg);opacity:0}}
.inner-page{min-height:100vh;background:#0d1524;color:#fff}.inner-nav{position:fixed;z-index:50;top:15px;left:50%;transform:translateX(-50%);width:min(1120px,calc(100% - 28px));height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 19px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(10,19,34,.76);backdrop-filter:blur(20px);font-size:12px;color:#b8c9e2}.inner-nav span{font-family:"Noto Serif SC"}.collection-hero{position:relative;z-index:1;min-height:55vh;padding:145px 20px 70px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at 50% 46%,rgba(105,149,223,.23),transparent 28%)}.collection-hero p{font-size:9px;letter-spacing:.35em;color:#91b2e5}.collection-hero h1{font:600 clamp(38px,7vw,72px) "Noto Serif SC";margin:13px 0}.collection-hero span{max-width:560px;color:#9cacc1;line-height:1.8}.collection-hero b{margin-top:25px;padding:8px 13px;border:1px solid rgba(255,255,255,.1);border-radius:99px;font-size:9px;letter-spacing:.18em;color:#9dbbe6}.collection-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:210px;gap:14px;padding:0 max(20px,calc((100vw - 1160px)/2)) 100px}.collection-grid .photo-card{grid-column:span 4;grid-row:span 2}.collection-grid .photo-card:nth-child(7n+1),.collection-grid .photo-card:nth-child(7n+5){grid-column:span 8}.collection-grid .empty-card{grid-column:1/-1}.all-notes{position:relative;z-index:1;max-width:850px;margin:auto;padding:0 20px 100px;display:grid;gap:14px}.all-notes .note{padding:23px 26px}
@media(max-width:800px){.album-shelf{grid-template-columns:1fr 1fr;gap:10px}.album-folder,.album-folder:nth-child(n){min-height:270px;transform:none;border-radius:18px}.album-folder:hover,.album-folder:nth-child(n):hover{transform:none}.album-info{left:16px;right:16px;bottom:16px}.album-info h3{font-size:19px}.collection-hero{min-height:48vh;padding-top:115px}.collection-grid{grid-template-columns:1fr 1fr;grid-auto-rows:160px;padding:0 10px 80px;gap:8px}.collection-grid .photo-card,.collection-grid .photo-card:nth-child(n){grid-column:span 1;grid-row:span 1}.collection-grid .photo-card:nth-child(5n+1){grid-column:span 2;grid-row:span 2}.inner-nav{top:9px}.inner-page{padding-bottom:0}.all-notes{padding-left:13px;padding-right:13px}}
@media(max-width:430px){.album-shelf{grid-template-columns:1fr}.album-folder{min-height:310px}.collection-grid{grid-auto-rows:145px}}

/* Cinematic seaside cover */
.hero{background:#10213a;min-height:100svh}.hero-noise{inset:-4%;z-index:0;opacity:1;background:url('hero-seaside-v1.png') center center/cover no-repeat;animation:cinemaPush 18s ease-in-out infinite alternate;will-change:transform}.hero:after{z-index:0;inset:0;width:auto;height:auto;right:0;top:0;border:0;border-radius:0;background:linear-gradient(180deg,rgba(5,14,29,.28),rgba(5,13,24,.04) 38%,rgba(5,12,23,.6)),linear-gradient(90deg,rgba(4,12,23,.18),transparent 38%,rgba(4,12,23,.12))}.hero-glow{z-index:1;opacity:.45;mix-blend-mode:screen}.hero-orbit{z-index:1;border-color:rgba(255,255,255,.17)}.hero-content{z-index:3;text-shadow:0 3px 25px rgba(3,9,20,.55)}.hero .eyebrow{color:#fff;filter:drop-shadow(0 2px 5px rgba(0,0,0,.5))}.hero h1{filter:drop-shadow(0 8px 25px rgba(0,0,0,.35))}.hero-copy{color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.8)}.hero .live-time{color:rgba(255,255,255,.75)}.hero .live-time span{color:#fff}.hero .scroll-down{background:rgba(6,18,33,.22);border-color:rgba(255,255,255,.32);color:#fff;backdrop-filter:blur(12px)}@keyframes cinemaPush{0%{transform:scale(1.02) translate3d(-.5%,0,0)}100%{transform:scale(1.1) translate3d(1%,-1%,0)}}
@media(max-width:800px){.hero-noise{background-position:42% center;inset:-7%;animation-duration:14s}.hero:after{background:linear-gradient(180deg,rgba(5,14,29,.36),rgba(5,13,24,.08) 32%,rgba(5,12,23,.72))}.hero-content{padding-top:18px}.hero .avatars{transform:scale(.9)}.hero h1{font-size:clamp(38px,12vw,55px)}.hero-copy{max-width:290px}.hero .love-clock{margin-top:25px}}
.petals i{background:linear-gradient(135deg,rgba(255,232,207,.9),rgba(240,190,204,.62));filter:drop-shadow(0 0 4px rgba(255,220,188,.45));scale:var(--petal-scale,1)}.tap-burst{position:fixed;z-index:999;pointer-events:none}.tap-burst:after{content:"";position:absolute;left:0;top:0;width:8px;height:8px;margin:-4px;border:1px solid rgba(255,235,206,.9);border-radius:50%;animation:tapRing .75s ease-out forwards}.tap-burst i{position:absolute;left:-2px;top:-2px;width:4px;height:4px;border-radius:50%;background:#ffe6bc;box-shadow:0 0 8px #fff;animation:tapDot .75s ease-out forwards;transform:rotate(var(--angle)) translateX(0)}@keyframes tapRing{to{width:72px;height:72px;margin:-36px;opacity:0}}@keyframes tapDot{to{transform:rotate(var(--angle)) translateX(45px) scale(0);opacity:0}}