@font-face{font-family:LatDisplay;src:url('/assets/LDI2apCSOBg7S-QT7pbYF_Oreec.woff2') format('woff2');font-display:swap}
:root{color-scheme:dark;--pink:#ff4fbd;--rose:#ff7cc8;--violet:#945cff;--cyan:#67e8f9;--gold:#ffe69a}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;overflow:hidden}
body{min-height:100vh;background:radial-gradient(circle at 50% 42%,#35105d 0,#16092f 38%,#07030f 78%);color:#fff;font-family:LatDisplay,"Microsoft YaHei",sans-serif;perspective:1200px}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(circle,#000 20%,transparent 75%);animation:gridDrift 14s linear infinite}
.stage{position:relative;min-height:100vh;isolation:isolate;transform-style:preserve-3d}
.love-card{position:fixed;left:0;top:0;width:max-content;max-width:88vw;padding:clamp(32px,4vw,58px) clamp(26px,4vw,56px);text-align:center;border:1px solid rgba(255,255,255,.22);border-radius:42px;background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.035));box-shadow:0 40px 100px rgba(0,0,0,.5),inset 0 1px rgba(255,255,255,.35),0 0 80px rgba(183,92,255,.2);backdrop-filter:blur(20px);transform-style:preserve-3d;will-change:transform}
.love-card.impact{filter:brightness(1.45) saturate(1.35);box-shadow:0 0 30px rgba(255,255,255,.8),0 0 100px var(--pink),inset 0 1px rgba(255,255,255,.7)}
.love-card::before{content:"";position:absolute;inset:-2px;border-radius:44px;padding:2px;background:conic-gradient(from var(--spin),transparent 0 12%,var(--pink) 18%,var(--cyan) 28%,transparent 37% 62%,var(--gold) 70%,var(--violet) 82%,transparent 90%);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:borderSpin 5s linear infinite;filter:drop-shadow(0 0 12px var(--pink));pointer-events:none}
.love-card::after{content:"";position:absolute;inset:0;border-radius:42px;overflow:hidden;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.17) 42%,rgba(255,255,255,.02) 55%,transparent 70%);background-size:250% 100%;animation:shine 4s ease-in-out infinite;pointer-events:none}
.halo{position:absolute;left:50%;top:50%;width:min(80vw,720px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) translateZ(-60px);background:repeating-conic-gradient(from 0deg,rgba(255,79,189,.34) 0 2deg,transparent 2deg 12deg);mask-image:radial-gradient(circle,transparent 0 42%,#000 44% 47%,transparent 60%);animation:haloSpin 25s linear infinite}
.eyebrow{margin:0 0 26px;letter-spacing:.55em;font-size:clamp(.63rem,1vw,.88rem);color:#ffd8f1;text-shadow:0 0 16px var(--pink);animation:pulse 2s ease-in-out infinite}
.love-title{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;margin:0;font-size:clamp(2rem,5.1vw,5.2rem);font-weight:900;line-height:1.1;letter-spacing:.015em;transform-style:preserve-3d;white-space:nowrap}
.love-title span:not(.gap){position:relative;display:inline-block;min-width:.72em;color:transparent;background:linear-gradient(145deg,#fff 5%,#ffd0ee 30%,#ff62bd 52%,#b47cff 75%,#8ff5ff 100%);background-size:200% 200%;background-clip:text;-webkit-background-clip:text;-webkit-text-stroke:1px rgba(255,255,255,.32);filter:drop-shadow(0 0 10px rgba(255,86,190,.75)) drop-shadow(0 14px 16px rgba(0,0,0,.35));transform-origin:50% 80%;animation:letterDance 2.8s cubic-bezier(.45,.05,.25,1) infinite,gradientMove 3.6s ease infinite;animation-delay:calc(var(--i)*-.13s)}
.love-title span:not(.gap)::before{content:attr(data-char);position:absolute;inset:0;color:rgba(255,255,255,.22);transform:translateY(88%) scaleY(-1);mask-image:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 68%);filter:blur(1px);opacity:.45}
.love-title span:not(.gap)::after{content:"✦";position:absolute;left:72%;top:-22%;font-size:.18em;color:#fff;text-shadow:0 0 8px #fff,0 0 18px var(--cyan);animation:twinkle 1.2s ease-in-out infinite;animation-delay:calc(var(--i)*.17s)}
.gap{width:.28em}
.love-line{display:flex;align-items:center;gap:18px;width:min(520px,75%);margin:35px auto 18px;color:var(--rose)}
.love-line b{height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--pink),var(--cyan),transparent);box-shadow:0 0 12px var(--pink);animation:lineGlow 1.6s ease-in-out infinite alternate}
.love-line span{font-size:1.45rem;filter:drop-shadow(0 0 12px var(--pink));animation:heartBeat 1.1s ease-in-out infinite}
.subtitle{margin:0;color:rgba(255,255,255,.78);font-size:clamp(.86rem,1.4vw,1.15rem);letter-spacing:.4em;text-indent:.4em;text-shadow:0 0 20px rgba(255,255,255,.45)}
.marquee{position:absolute;left:0;right:0;bottom:16px;overflow:hidden;opacity:.26;font-size:.62rem;letter-spacing:.65em;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 15% 85%,transparent)}
.marquee div{width:max-content;animation:marquee 18s linear infinite}
.aurora{position:fixed;width:72vmax;height:72vmax;border-radius:50%;filter:blur(80px);opacity:.32;mix-blend-mode:screen;pointer-events:none;animation:auroraMove 11s ease-in-out infinite alternate}
.aurora-one{left:-28vmax;top:-38vmax;background:radial-gradient(circle,var(--pink),transparent 66%)}
.aurora-two{right:-34vmax;bottom:-40vmax;background:radial-gradient(circle,var(--cyan),var(--violet) 35%,transparent 66%);animation-delay:-5s}
.star{position:absolute;width:var(--size);height:var(--size);left:var(--x);top:var(--y);border-radius:50%;background:#fff;box-shadow:0 0 8px #fff,0 0 16px var(--pink);animation:starBlink var(--speed) ease-in-out infinite;animation-delay:var(--delay)}
.particle{position:fixed;left:var(--x);bottom:-30px;font-size:var(--size);color:var(--color);text-shadow:0 0 10px currentColor;pointer-events:none;animation:rise var(--duration) linear forwards}
.spark{position:fixed;z-index:20;pointer-events:none;width:7px;height:7px;border-radius:50%;background:#fff;box-shadow:0 0 10px #fff,0 0 20px var(--pink);animation:sparkOut .75s ease-out forwards}
.orbit{position:absolute;left:50%;top:50%;width:min(96vw,1240px);aspect-ratio:1;border:1px solid rgba(255,255,255,.06);border-radius:50%;pointer-events:none;animation:orbitSpin 20s linear infinite}
.orbit-two{width:min(82vw,980px);animation-duration:14s;animation-direction:reverse}
.orbit i{position:absolute;font-style:normal;color:var(--pink);filter:drop-shadow(0 0 12px currentColor);font-size:1.3rem}.orbit i:nth-child(1){left:8%;top:28%}.orbit i:nth-child(2){right:6%;top:52%}.orbit i:nth-child(3){left:55%;bottom:0}
.hint{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);margin:0;font-size:.68rem;letter-spacing:.28em;color:rgba(255,255,255,.38);animation:pulse 2s ease-in-out infinite;white-space:nowrap}
.vignette{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 180px rgba(0,0,0,.72)}
@property --spin{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes borderSpin{to{--spin:360deg}}
@keyframes letterDance{0%,100%{transform:translateY(0) rotateX(0) rotateY(0) scale(1)}18%{transform:translateY(-.24em) rotateX(20deg) rotateY(-16deg) scale(1.08)}38%{transform:translateY(.03em) rotateX(360deg) rotateY(12deg) scale(.96)}56%{transform:translateY(-.12em) rotateX(375deg) rotateY(180deg) scale(1.05)}76%{transform:translateY(0) rotateX(360deg) rotateY(360deg) scale(1)}}
@keyframes gradientMove{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
@keyframes twinkle{0%,100%{opacity:.15;transform:scale(.35) rotate(0)}50%{opacity:1;transform:scale(1.25) rotate(180deg)}}
@keyframes heartBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.4)}30%{transform:scale(1)}45%{transform:scale(1.25)}}
@keyframes lineGlow{from{opacity:.35;transform:scaleX(.82)}to{opacity:1;transform:scaleX(1)}}
@keyframes shine{0%,18%{background-position:220% 0}65%,100%{background-position:-70% 0}}
@keyframes haloSpin{to{transform:translate(-50%,-50%) translateZ(-60px) rotate(360deg)}}
@keyframes orbitSpin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes auroraMove{to{transform:translate(18vw,16vh) scale(1.2) rotate(24deg)}}
@keyframes gridDrift{to{background-position:38px 38px}}
@keyframes pulse{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes starBlink{0%,100%{opacity:.12;transform:scale(.45)}50%{opacity:1;transform:scale(1.4)}}
@keyframes rise{0%{transform:translate3d(0,0,0) rotate(0);opacity:0}12%{opacity:.8}100%{transform:translate3d(var(--drift),-115vh,0) rotate(720deg);opacity:0}}
@keyframes sparkOut{to{transform:translate(var(--dx),var(--dy)) scale(0) rotate(180deg);opacity:0}}
@media(max-width:700px){.love-card{max-width:92vw;border-radius:28px;padding:34px 18px}.love-title{font-size:clamp(1.48rem,7.7vw,3rem)}.eyebrow{margin-bottom:16px;letter-spacing:.25em}.love-line{margin-top:22px}.subtitle{font-size:.72rem;letter-spacing:.18em}.marquee{display:none}.hint{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important}.hint{display:none}}
