:root{color:#fff7fb;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#120711;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,p{margin:0}.love-room{background:radial-gradient(circle at 50% 44%,#7a163e75,#0000 28rem),radial-gradient(circle at 18% 12%,#ffc98f2b,#0000 19rem),linear-gradient(145deg,#110711 0%,#260b20 42%,#080512 100%);place-items:center;min-height:100svh;padding:clamp(18px,4vw,52px);display:grid;position:relative;overflow:hidden}.velvet-sky,.velvet-sky span,.velvet-sky i{pointer-events:none;position:absolute}.velvet-sky{inset:0;overflow:hidden}.moon-haze{aspect-ratio:1;background:radial-gradient(circle,#ffecd242,#0000 64%);border-radius:999px;width:min(62vw,680px);animation:9s ease-in-out infinite alternate glowShift;top:-20%;right:-16%}.rose-haze{aspect-ratio:1;background:radial-gradient(circle,#d62d6940,#0000 66%);border-radius:999px;width:min(72vw,760px);animation:11s ease-in-out infinite alternate-reverse glowShift;bottom:-24%;left:-24%}.gold-haze{aspect-ratio:1;background:radial-gradient(circle,#ffc25e29,#0000 62%);border-radius:999px;width:min(42vw,430px);animation:8s ease-in-out infinite alternate glowShift;top:58%;left:54%}.velvet-sky i{--x:calc((var(--star) * 37) % 100);--y:calc((var(--star) * 61) % 100);left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);width:calc(2px + (var(--star) % 4) * 1px);aspect-ratio:1;opacity:.42;animation:starFloat calc(4s + (var(--star) % 6) * .8s) ease-in-out infinite alternate;animation-delay:calc(var(--star) * -.16s);background:#fff1d6c7;border-radius:50%;box-shadow:0 0 16px #ffd59d9e}.gift-frame{z-index:2;text-align:center;grid-template-rows:minmax(150px,auto) minmax(260px,1fr) auto;place-items:center;gap:clamp(16px,3svh,28px);width:min(100%,940px);min-height:min(88svh,780px);display:grid;position:relative}.scene-copy{justify-items:center;gap:clamp(10px,2vw,16px);width:min(100%,760px);display:grid}.eyebrow{color:#ffe0b4;letter-spacing:.08em;text-transform:uppercase;background:#2b0c1fb8;border:1px solid #ffdab857;border-radius:999px;align-items:center;min-height:34px;padding:0 15px;font-size:clamp(.72rem,1.5vw,.82rem);font-weight:800;display:inline-flex}h1{color:#fff8fb;text-wrap:balance;text-shadow:0 18px 54px #00000080;max-width:13.5em;font-size:clamp(2.25rem,6vw,5.35rem);font-weight:860;line-height:.98}.scene-note{color:#ffe8ef;text-wrap:pretty;max-width:48rem;font-size:clamp(1.02rem,2vw,1.28rem);font-weight:500;line-height:1.68}.heart-stage{--ring-radius:min(35vw, 226px);aspect-ratio:1;width:min(78vw,520px);max-height:min(48svh,520px);color:inherit;cursor:pointer;filter:drop-shadow(0 34px 90px #00000073);background:0 0;border:0;outline:none;place-items:center;display:grid;position:relative}.heart-stage:focus-visible{border-radius:999px;box-shadow:0 0 0 4px #ffddabb8}.light-ring{border-radius:50%;animation:16s linear infinite ringDrift;position:absolute;inset:4%}.light-ring span{--angle:calc(var(--i) * 18deg);aspect-ratio:1;width:clamp(25px,4.6vw,44px);transform:translate(-50%, -50%) rotate(var(--angle)) translateY(calc(var(--ring-radius) * -1)) rotate(calc(var(--angle) * -1));color:#ffefdbb8;background:#5f263ab8;border:1px solid #ffe6bf2e;border-radius:999px;place-items:center;font-size:clamp(.72rem,1.6vw,.9rem);font-weight:850;display:grid;position:absolute;top:50%;left:50%}.light-ring span.is-lit{color:#3b081f;animation:2.4s ease-in-out infinite alternate candleFlicker;animation-delay:calc(var(--i) * -.09s);background:radial-gradient(circle at 32% 24%,#fff6d8 0%,#ffc55f 38%,#e33f82 100%);box-shadow:0 0 16px #ffcf77eb,0 0 34px #e8347773}.heart-glow{aspect-ratio:1;background:radial-gradient(circle,#fff4dab8,#e62f7757 45%,#0000 70%);border-radius:999px;width:48%;animation:3.1s ease-in-out infinite heartBeat;position:absolute}.heart-core{z-index:2;aspect-ratio:1;color:#fff9fb;background:linear-gradient(145deg,#ffefe23d,#ffffff0a),radial-gradient(circle at 38% 24%,#a91f58,#83123f 48%,#4b0d27 100%);border-radius:42% 42% 48% 48%;place-items:center;width:clamp(118px,20vw,190px);display:grid;position:relative;box-shadow:inset 0 0 0 1px #fff3,0 30px 80px #e33f825c}.heart-number{z-index:3;color:#fff8fb;letter-spacing:.02em;text-shadow:0 3px 14px #490926b3;font-size:clamp(1rem,3vw,2rem);font-weight:900;position:absolute;top:50%;left:50%;transform:translate(-50%,-47%)}.letter{color:#4b0d27;text-wrap:pretty;background:linear-gradient(145deg,#fffaf4f5,#ffe7edf0);border:1px solid #761d3e29;border-radius:26px;gap:.72rem;width:min(100%,680px);margin-top:calc(clamp(16px,3vw,28px)/-2);padding:clamp(18px,3vw,30px);font-size:clamp(.98rem,1.8vw,1.18rem);font-weight:600;line-height:1.62;display:grid;box-shadow:0 28px 80px #0000004d}.next-button{color:#3d0a22;cursor:pointer;background:linear-gradient(135deg,#ffe9cef5,#ffb875f0);border:1px solid #ffdeba8f;border-radius:999px;justify-content:center;align-items:center;gap:10px;max-width:min(100%,330px);min-height:52px;padding:0 24px;font-weight:850;display:inline-flex;box-shadow:0 18px 48px #00000047,inset 0 1px #fffc}.next-button:hover{background:linear-gradient(135deg,#fff6e3,#ffc582)}.next-button:focus-visible{outline-offset:4px;outline:3px solid #fff5dad1}.mode-quiet .light-ring span:nth-child(n+8){opacity:0}.mode-letter .heart-stage{--ring-radius:min(27vw, 172px);max-height:min(36svh,400px)}.mode-letter .gift-frame{grid-template-rows:auto minmax(190px,.72fr) auto auto;gap:clamp(10px,2svh,18px)}.mode-letter .scene-note{display:none}.mode-final .heart-glow{width:58%}@keyframes glowShift{0%{opacity:.72;transform:translate(0,0)scale(1)}to{opacity:1;transform:translate(3%,-2%)scale(1.08)}}@keyframes starFloat{0%{opacity:.24;transform:translateY(0)scale(.82)}to{opacity:.72;transform:translateY(-12px)scale(1)}}@keyframes ringDrift{to{transform:rotate(360deg)}}@keyframes candleFlicker{0%{filter:brightness(.9);transform:translate(-50%, -50%) rotate(var(--angle)) translateY(calc(var(--ring-radius) * -1)) rotate(calc(var(--angle) * -1)) scale(.94)}to{filter:brightness(1.18);transform:translate(-50%, -50%) rotate(var(--angle)) translateY(calc(var(--ring-radius) * -1)) rotate(calc(var(--angle) * -1)) scale(1.04)}}@keyframes heartBeat{0%,to{opacity:.82;transform:scale(.98)}50%{opacity:1;transform:scale(1.08)}}@media (width<=680px){.love-room{padding:18px}.gift-frame{grid-template-rows:minmax(172px,auto) minmax(248px,1fr) auto;gap:14px;min-height:calc(100svh - 36px)}h1{max-width:11.5em;font-size:clamp(2rem,11vw,3.35rem);line-height:1.03}.scene-note{font-size:1rem;line-height:1.58}.heart-stage{--ring-radius:min(38vw, 156px);width:min(88vw,360px);max-height:39svh}.mode-letter .heart-stage{--ring-radius:min(30vw, 120px)}.light-ring span{width:clamp(22px,7vw,34px)}.heart-core{width:clamp(104px,31vw,136px)}.letter{border-radius:22px;padding:18px;font-size:.95rem;line-height:1.55}.mode-letter .gift-frame{grid-template-rows:auto minmax(138px,.42fr) auto auto;gap:10px}.mode-letter h1{max-width:12em;font-size:clamp(1.7rem,8.5vw,2.55rem)}.mode-letter .heart-stage{max-height:23svh}.next-button{width:min(100%,300px);min-height:50px;padding:0 18px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}