:root{color:#fff7fb;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#130915;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{overflow:hidden}button{font:inherit}h1,h2,p{margin:0}.date-invitation{isolation:isolate;background:radial-gradient(circle at 50% 22%,#ffcaae33,#0000 24rem),radial-gradient(circle at 14% 78%,#8e5cff33,#0000 22rem),linear-gradient(145deg,#170817 0%,#2a1024 48%,#090d1f 100%);place-items:center;width:100%;min-height:100svh;padding:clamp(18px,4vw,44px);display:grid;position:relative;overflow:hidden}.date-invitation:after{z-index:-1;content:"";background-color:#0000;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:52px 52px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle at 50% 48%,#000 0%,#0000 74%);mask-image:radial-gradient(circle at 50% 48%,#000 0%,#0000 74%)}.night-sky{z-index:-1;pointer-events:none;position:absolute;inset:0}.night-sky span{left:var(--star-x);top:var(--star-y);width:var(--star-size);aspect-ratio:1;animation:twinkle var(--star-duration) ease-in-out var(--star-delay) infinite alternate;opacity:.42;background:#fff8e4db;border-radius:999px;position:absolute;box-shadow:0 0 12px #ffdab2b8}.soft-aura{z-index:-1;aspect-ratio:1;filter:blur(8px);opacity:.64;pointer-events:none;border-radius:999px;width:clamp(210px,38vw,540px);animation:9s ease-in-out infinite alternate auraDrift;position:absolute}.aura-one{background:radial-gradient(circle,#ff7a9f52,#0000 66%);top:12%;left:max(-120px,-8vw)}.aura-two{background:radial-gradient(circle,#ffb8633d,#0000 68%);animation-delay:-3s;bottom:4%;right:max(-130px,-9vw)}.invitation-scene{text-align:center;align-content:center;place-items:center;gap:clamp(18px,3.2vw,30px);width:min(100%,920px);min-height:min(88svh,780px);display:grid;position:relative}.eyebrow{color:#ffd7df;letter-spacing:0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#2a10248a;border:1px solid #ffdfe238;border-radius:999px;justify-content:center;align-items:center;min-height:32px;padding:0 14px;font-size:clamp(.78rem,1.8vw,.9rem);font-weight:760;display:inline-flex}.scene-copy{justify-items:center;gap:clamp(10px,2vw,15px);width:min(100%,740px);display:grid}.compact-copy{max-width:650px}.scene-copy h1,.scene-copy h2{color:#fff8f6;letter-spacing:0;text-wrap:balance;max-width:720px;font-size:clamp(2.35rem,7vw,5.7rem);font-weight:820;line-height:.98}.scene-copy h2{font-size:clamp(2rem,5vw,4.1rem)}.scene-copy p:not(.eyebrow){color:#fff0f0d1;text-wrap:pretty;max-width:640px;font-size:clamp(1rem,2.1vw,1.22rem);line-height:1.65}.envelope{aspect-ratio:1.34;color:#6e1e3d;cursor:pointer;filter:drop-shadow(0 34px 70px #0000006b);background:0 0;border:0;place-items:center;width:min(82vw,470px);display:grid;position:relative}.envelope:before{content:"";background:linear-gradient(136deg,#0000 49.2%,#7426462e 50%,#0000 50.8%),linear-gradient(224deg,#0000 49.2%,#74264626 50%,#0000 50.8%),linear-gradient(145deg,#fff8ef 0%,#ffd9e1 100%);border-radius:clamp(20px,4vw,34px);position:absolute;inset:20% 4% 9%;box-shadow:inset 0 0 0 1px #802a4c24,0 30px 80px #59112e52}.envelope-flap{clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;background:linear-gradient(155deg,#fffaf2,#ffcbd7);border-radius:clamp(18px,4vw,30px);transition:transform .58s cubic-bezier(.16,1,.3,1);position:absolute;inset:6% 8% 41%}.envelope-paper{z-index:1;aspect-ratio:1;background:#fffaf5c7;border-radius:999px;place-items:center;width:clamp(72px,15vw,118px);display:grid;position:relative;box-shadow:inset 0 0 0 1px #8122481f}.wax-seal{z-index:2;aspect-ratio:1;color:#fff8f6;background:linear-gradient(145deg,#bd244d,#7f1739);border-radius:999px;place-items:center;width:clamp(52px,10vw,72px);display:grid;position:absolute;bottom:18%;box-shadow:0 18px 36px #86163a61}.envelope:hover .envelope-flap,.envelope:focus-visible .envelope-flap{transform:rotateX(54deg)translateY(-7%)}.primary-action{color:#2a0c1c;cursor:pointer;background:linear-gradient(135deg,#ffe0a3,#ff8eb0);border:0;border-radius:999px;justify-content:center;align-items:center;gap:10px;min-height:54px;padding:0 24px;font-weight:820;transition:transform .2s,filter .2s,box-shadow .2s;display:inline-flex;box-shadow:0 22px 56px #ff8eb040}.primary-action:hover{filter:brightness(1.04);transform:translateY(-2px);box-shadow:0 26px 64px #ff8eb057}.primary-action:focus-visible,.envelope:focus-visible,.route-light:focus-visible{outline-offset:5px;outline:3px solid #ffe0a3}.moon-map{aspect-ratio:1;background:radial-gradient(circle at 50% 42%,#ffedc02e,#0000 18%),radial-gradient(circle at 50% 78%,#ff97b42e,#0000 34%),linear-gradient(160deg,#ffffff14,#ffffff06);border-radius:999px;width:min(82vw,520px);position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #ffe2dd2e,inset 0 -40px 90px #09081e4d,0 34px 90px #00000057}.moon{aspect-ratio:1;background:#ffe9bd;border-radius:999px;width:17%;position:absolute;top:15%;right:18%;box-shadow:0 0 34px #ffe5bcbd}.path-line{border:2px solid #ffe1b82e;border-bottom:0;border-radius:999px 999px 0 0;height:42%;position:absolute;bottom:31%;left:18%;right:18%}.path-line:after{width:var(--path-width,0%);content:"";filter:drop-shadow(0 0 14px #ffc37ac7);border-top:3px solid #ffd386;border-radius:999px 999px 0 0;transition:width .42s;position:absolute;inset:-2px}.path-line.lit-1{--path-width:38%}.path-line.lit-2{--path-width:70%}.path-line.lit-3{--path-width:100%}.route-light{left:var(--x);top:var(--y);color:#fff2e8c7;cursor:pointer;background:0 0;border:0;justify-items:center;gap:9px;width:clamp(70px,16vw,104px);display:grid;position:absolute;transform:translate(-50%,-50%)}.route-light span{aspect-ratio:1;background:#4e2037;border-radius:999px;width:clamp(34px,7vw,50px);transition:background .28s,box-shadow .28s,transform .28s;animation:1.8s ease-in-out infinite alternate lightPulse;box-shadow:inset 0 0 0 1px #ffe1dd40,0 0 #ffcc8500}.route-light b{color:inherit;letter-spacing:0;background:#15091a8a;border-radius:999px;padding:4px 9px;font-size:clamp(.72rem,1.8vw,.88rem);font-weight:760}.route-light.is-lit{color:#fff8f1}.route-light.is-lit span{background:#ffd386;animation:none;transform:scale(1.08);box-shadow:0 0 22px #ffd386d9,0 0 72px #ff8eb073}.final-heart{aspect-ratio:1;color:#7f1739;background:radial-gradient(circle at 50% 48%,#fff8f1e0,#ffe0e8c2 58%),linear-gradient(145deg,#ff8eb066,#ffdb9e47);border-radius:999px;place-items:center;width:clamp(108px,22vw,170px);animation:2.4s ease-in-out infinite heartBeat;display:grid;box-shadow:inset 0 0 0 1px #ffe6e02e,0 0 72px #ff8eb057}.final-copy{max-width:760px}.ghost-action{color:#2a0c1c;background:#fff7fbeb}@keyframes twinkle{0%{opacity:.24;transform:scale(.72)}to{opacity:.94;transform:scale(1.2)}}@keyframes auraDrift{0%{transform:translate(0,0)scale(.96)}to{transform:translate(18px,-24px)scale(1.05)}}@keyframes lightPulse{0%{filter:brightness(.82);transform:scale(.92)}to{filter:brightness(1.1);transform:scale(1.04)}}@keyframes heartBeat{0%,to{transform:scale(1)}45%{transform:scale(1.045)}}@media (width<=680px){.date-invitation{padding:16px}.invitation-scene{gap:17px;min-height:92svh}.scene-copy h1{font-size:clamp(2.15rem,12vw,3.65rem);line-height:1.02}.scene-copy h2{font-size:clamp(1.8rem,9vw,2.9rem);line-height:1.06}.scene-copy p:not(.eyebrow){font-size:1rem;line-height:1.58}.envelope{width:min(86vw,360px)}.moon-map{width:min(88vw,380px)}.route-light{width:78px}.route-light b{font-size:.72rem}.final-heart{width:clamp(96px,26vw,130px)}}@media (height<=640px){.invitation-scene{gap:12px}.envelope{width:min(58vh,360px)}.moon-map{width:min(58vh,390px)}.scene-copy h1{font-size:clamp(2rem,7vh,4rem)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
