:root{--ink:#493449;--plum:#6c416b;--gold:#b28c54;--paper:#fffaf5;color-scheme:light}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(ellipse at 0 12%,#e7d5ec88,transparent 55%),radial-gradient(ellipse at 100% 45%,#cce4df88,transparent 55%),radial-gradient(ellipse at 30% 90%,#f3d7d788,transparent 55%),#fffaf5;font:400 15px/1.6 'Plus Jakarta Sans',sans-serif}header{max-width:1160px;margin:auto;padding:20px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px}a{color:var(--plum)}header>a:last-child{font-size:.85rem;text-decoration:none}.brand{font:42px Allura,cursive;text-decoration:none}main{max-width:1160px;margin:auto;padding:35px 26px 50px;text-align:center}.eyebrow{font-size:.65rem;letter-spacing:.22em;color:#8c6378}h1{font:500 clamp(2.8rem,6vw,4.6rem)/1.04 'Cormorant Garamond',Georgia,serif;margin:12px 0 20px}.intro{font-size:.9rem;color:#736371;margin-bottom:34px}.feelings{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin:0 auto 42px}button{font:inherit;cursor:pointer}.feelings button{border:1px solid #b795af77;border-radius:30px;background:#fffaf6cc;color:#63475c;padding:10px 17px;font-size:.8rem}.feelings button[aria-pressed=true]{background:#6d4567;color:#fff;border-color:#6d4567}.collection-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;text-align:left;margin:0 0 18px}.collection-heading h2{font:500 2.4rem 'Cormorant Garamond',Georgia,serif;margin:0}.collection-heading>span{font-size:.72rem;color:#756571}.designs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.design{padding:0;background:#fffdf8;border:1px solid #b591aa44;border-radius:18px;overflow:hidden;color:var(--ink);text-align:left;box-shadow:0 10px 25px #6943660b;transition:transform .2s}.design:hover{transform:translateY(-4px)}.design-art{position:relative;display:block;aspect-ratio:3/4;overflow:hidden}.design-art img{width:100%;height:100%;object-fit:cover;display:block}.design-art::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#25162e55)}.design-art b{position:absolute;z-index:1;left:12%;right:12%;top:32%;color:#442b45;text-align:center;font:500 clamp(1.3rem,2.6vw,2.1rem)/1.15 'Cormorant Garamond',Georgia,serif;text-shadow:0 0 12px #fff,0 1px 8px #fff;background:#fff9edc9;border-radius:50%;padding:15px 5px;white-space:pre-line}.design-label{display:block;padding:13px}.design-label strong{display:block;font-weight:500;font-size:.77rem}.design-label small{display:block;font-size:.68rem;color:#866875;margin-top:5px}.collection-note{font-size:.76rem;color:#756571;max-width:480px;margin:32px auto 0}dialog{border:1px solid #c0a5b7;border-radius:22px;padding:16px;background:#fffaf6;color:var(--ink);width:min(430px,calc(100% - 24px));max-height:96dvh;overflow:auto;box-shadow:0 24px 80px #24152755}dialog::backdrop{background:#25182dbb;backdrop-filter:blur(5px)}.preview-heading{display:flex;align-items:center;justify-content:space-between;font-size:.8rem;margin:0 0 10px;gap:16px}.close{border:0;background:none;color:var(--ink);font-size:30px;line-height:1;padding:2px 5px}.experience{position:relative;isolation:isolate;aspect-ratio:9/14;max-height:69dvh;overflow:hidden;border-radius:12px;background:#fff5eb}.scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:scene-drift 22s ease-in-out both}.scene-shade{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,#fffaf4e8 0%,#fffaf4c9 24%,transparent 64%)}.words{position:absolute;inset:13% 11% 17%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;text-shadow:0 1px 10px #fff9f2;z-index:4}.words p{margin:10px 0;font:500 clamp(1rem,3.8vw,1.25rem)/1.5 'Cormorant Garamond',Georgia,serif;white-space:pre-line}.words .opening{animation:words-in 4s ease 1.5s both}.words .main-message{font:500 clamp(2.5rem,10vw,3.6rem)/1.03 Allura,cursive;margin:20px 0;white-space:pre-line;animation:words-in 4s ease 5s both}.words .closing{animation:words-in 4s ease 9s both}.signature{position:absolute;bottom:9%;width:100%;text-align:center;font:29px Allura,cursive;z-index:5;animation:words-in 3s ease 13s both}.watermark{position:absolute;bottom:3%;width:100%;text-align:center;font-size:7px;letter-spacing:.2em;color:#584351;z-index:5}.motion{position:absolute;inset:0;pointer-events:none;overflow:hidden}.spark{position:absolute;width:5px;height:5px;background:#fff3c0;border-radius:50%;box-shadow:0 0 12px #d5ac6c;opacity:0;animation:float-once 18s ease-in-out both}.ripple{position:absolute;left:10%;bottom:15%;width:80%;height:12%;border:1px solid #e0bc80;border-radius:50%;opacity:0;animation:ripple 15s ease-in-out 1s both}.light-ribbon{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#d6b27c;stroke-width:1.5;stroke-dasharray:1200;stroke-dashoffset:1200;filter:drop-shadow(0 0 6px #ffe1a5);animation:draw-light 16s ease 1s both}.petal{position:absolute;width:12px;height:19px;border-radius:70% 15% 70% 20%;background:#edd3df;box-shadow:0 0 5px #fff5;opacity:0;animation:float-once 20s ease both}.halo{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;left:15%;top:22%;background:radial-gradient(circle,transparent 50%,#fff0bc66 61%,transparent 70%);opacity:0;animation:halo 20s ease both}.experience.paused *{animation-play-state:paused!important}.preview-controls{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0}.preview-controls button{border:1px solid #bfa1b3;border-radius:20px;background:#fffaf5;padding:6px 14px;font-size:.72rem;color:var(--plum)}.play-status{font-size:.65rem;color:#78636e;flex:1;min-width:150px}.sending{width:100%;padding:10px;border:0;border-radius:25px;background:#eadfe8;color:#796571;cursor:default;font-size:.8rem}.preview-note{font-size:.65rem;text-align:center;margin:8px 0 0;color:#78636e}footer{text-align:center;padding:20px 20px 35px;font-size:.74rem;color:#78636e}footer a{display:block;margin-top:10px}:focus-visible{outline:3px solid #8b608a;outline-offset:4px}@keyframes scene-drift{from{transform:scale(1.09) translateY(1%)}to{transform:scale(1.02) translateY(-1%)}}@keyframes words-in{from{opacity:0;transform:translateY(12px);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}@keyframes float-once{0%{opacity:0;transform:translate(0,60px) rotate(0)}20%{opacity:.8}75%{opacity:.6}100%{opacity:0;transform:translate(40px,-180px) rotate(80deg)}}@keyframes ripple{0%{opacity:0;transform:scale(.4)}30%{opacity:.6}100%{opacity:0;transform:scale(1.3)}}@keyframes draw-light{70%,100%{stroke-dashoffset:0;opacity:.5}}@keyframes halo{0%{opacity:0;transform:scale(.5)}40%{opacity:.65}100%{opacity:.2;transform:scale(1.1)}}@media(max-width:800px){.designs{grid-template-columns:repeat(3,minmax(0,1fr))}.design-art b{font-size:1.7rem}.collection-heading h2{font-size:2rem}}@media(max-width:520px){header{padding:14px 20px}.brand{font-size:36px}main{padding:20px 18px 35px}.feelings{gap:7px;margin-bottom:28px}.feelings button{padding:9px 12px;font-size:.72rem}.designs{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.design-art b{font-size:1.7rem}.collection-heading>span{font-size:.65rem}.collection-heading h2{font-size:1.9rem}.design-label strong{font-size:.73rem}.intro{font-size:.8rem}.experience{max-height:67dvh}.words .main-message{font-size:clamp(2rem,10vw,3.4rem)}}@media(prefers-reduced-motion:reduce){.experience *{animation:none!important}.scene{transform:none}.words>*{opacity:1;filter:none}.motion{display:none}.signature{opacity:1}.design{transition:none}}

/* High-contrast lettering remains readable over every illustrated scene. */
.words{color:#3d293d!important;text-shadow:0 1px 1px #fff9f1;background:radial-gradient(ellipse at center,#fffaf4f5 0%,#fffaf4df 48%,#fffaf480 70%,transparent 86%);border-radius:32px}
.words p{font-weight:600;font-size:clamp(1.2rem,4.8vw,1.45rem);line-height:1.45}
.words .main-message{font-weight:600;font-size:clamp(2.75rem,11vw,3.8rem);line-height:1.1;text-shadow:0 1px 1px #fff9f1}
.signature{left:19%;right:19%;width:auto;bottom:8%;padding:3px 10px;border-radius:24px;background:#fffaf2ed;color:#422b43!important;font:600 36px/1.2 Allura,cursive;text-shadow:none;box-shadow:0 1px 10px #fff9f299}
.design-art b{font-weight:600;color:#3d293d;background:#fffaf0eb;text-shadow:none}
.watermark{color:#493545;font-weight:600;background:#fffaf2c9;width:auto;left:23%;right:23%;border-radius:9px;padding:2px 0}
@media(max-width:520px){.words p{font-size:clamp(1.1rem,4.8vw,1.3rem)}.words .main-message{font-size:clamp(2.6rem,11vw,3.5rem)}.signature{font-size:34px}}

.share-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.share-actions a,.share-actions button{flex:1;min-width:95px;text-align:center;text-decoration:none;border:1px solid #bfa1b3;border-radius:22px;padding:10px 12px;font:500 .78rem 'Plus Jakarta Sans',sans-serif;color:#563653;background:#f3e9f3}.share-actions .share-whatsapp{background:#e3f0e8;color:#24523d;border-color:#b1cebd}.share-status{font-size:.72rem;line-height:1.5;text-align:center;margin:10px 0;color:#614a5b}.share-fallback{padding:10px;border:1px solid #d9c7d5;border-radius:12px;font-size:.72rem}.share-fallback[hidden]{display:none}.share-fallback input{display:block;width:100%;margin:6px 0;padding:9px;border:1px solid #cbb2c4;border-radius:8px;background:#fff;color:#493449;font:inherit}.share-fallback p{margin:5px 0}.experience{max-height:58dvh}@media(max-width:520px){.experience{max-height:54dvh}.share-actions a,.share-actions button{padding:10px 8px;min-width:80px;font-size:.73rem}}

/* Clear artwork, a dedicated writing area, and a desktop layout with room to breathe. */
main{max-width:1220px;padding-top:40px}.intro{font-size:1rem;max-width:600px;margin:18px auto 32px}h1{max-width:760px;margin:12px auto 20px}.designs{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.design-art{aspect-ratio:1;overflow:hidden;background:#f3e8ee}.design-art img{object-fit:contain}.design-art::after{display:none}.design-art b{display:none}.design-label{padding:20px}.design-label strong{font:600 1.7rem/1.12 'Cormorant Garamond',Georgia,serif}.design-label small{font-size:.78rem;margin-top:10px}
dialog{width:min(940px,calc(100% - 32px));max-height:94dvh;padding:24px;overflow:auto}.preview-shell{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);gap:24px;align-items:center}.preview-heading{grid-column:1/-1;margin:0}.experience{width:100%;aspect-ratio:4/5;max-height:none;container-type:inline-size;isolation:isolate;background:linear-gradient(145deg,#eee3ee,#fffaf5 50%,#e3eeea)}.scene{inset:3% 0 auto;width:100%;height:43%;object-fit:contain;animation:dedication-art-drift 22s ease both}.scene-shade{display:none}.motion{bottom:53%;z-index:2}.words{inset:49% 4% 12%;padding:4% 7%;gap:3cqw;background:#fffaf5;border:1px solid #b49a7140;border-radius:8px;box-shadow:none;text-shadow:none;justify-content:center}.words p{font:600 4.5cqw/1.25 'Cormorant Garamond',Georgia,serif;margin:0}.words .main-message{font:500 9.5cqw/1.07 Allura,cursive;margin:0;text-shadow:none}.signature{left:0;right:0;bottom:4.5%;font:500 7cqw/1 Allura,cursive;background:none;padding:0;box-shadow:none;animation:none}.watermark{left:0;right:0;bottom:1.8%;font-size:1.6cqw;background:none;padding:0}.share-heading{font:500 clamp(2rem,3.5vw,3rem)/1.08 'Cormorant Garamond',Georgia,serif;margin:12px 0 20px}.share-description{font-size:.9rem;line-height:1.6;color:#736371}.preview-controls{margin:20px 0}.play-status{flex-basis:100%;font-size:.75rem;margin-top:4px}.share-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.share-actions button,.save-card{min-height:48px;font-size:.85rem}.save-card{width:100%;margin-top:12px;border:1px solid #bfa1b3;border-radius:24px;background:#fffaf5;color:#563653}.share-status{font-size:.8rem;min-height:3em;text-align:left}.share-actions button:disabled,.save-card:disabled{opacity:.55;cursor:wait}.animation-link{margin:20px 0;color:#765b72;font-size:.8rem}.animation-link summary{cursor:pointer}.animation-link button{margin-top:12px;border:1px solid #bfa1b3;border-radius:20px;background:#fffaf5;padding:8px 14px;color:#563653}.preview-note{text-align:left;font-size:.72rem;line-height:1.6}.preview-details>.eyebrow{line-height:1.7}.experience.paused *{animation-play-state:paused!important}@keyframes dedication-art-drift{from{transform:scale(.96)}to{transform:scale(1)}}
@media(max-width:700px){.designs{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.design-label{padding:14px}.design-label strong{font-size:1.35rem}.design-label small{font-size:.7rem}.preview-shell{display:block}.preview-heading{margin-bottom:12px}.experience{width:min(100%,400px);margin:auto;max-height:none}.preview-details{margin-top:20px}.share-heading,.share-description,.preview-details>.eyebrow{display:none}dialog{width:min(440px,calc(100% - 20px));padding:14px;max-height:94dvh}.words p{font-size:4.5cqw}.words .main-message{font-size:9.5cqw}.signature{font-size:7cqw}.share-status{min-height:0}.animation-link{margin:14px 0}.collection-heading{align-items:center}.collection-heading h2{font-size:2rem}}
@media(prefers-reduced-motion:reduce){.experience .scene{animation:none;transform:none}}

/* The dedication itself fills the viewer. A closed cover keeps the message a surprise. */
dialog{inset:0;width:100vw;max-width:none;height:100dvh;max-height:100dvh;margin:0;padding:0;border:0;border-radius:0;background:#242535;color:#fff6ea;overflow:hidden}.preview-shell{height:100%;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:0;align-items:stretch;background:radial-gradient(ellipse at 25% 25%,#534257,#232c38 72%)}.preview-heading{position:absolute;z-index:10;top:16px;left:20px;right:20px;color:#fff6ea;font-size:.8rem;pointer-events:none}.preview-heading>span{padding:7px 13px;border-radius:20px;background:#242535b0}.preview-heading .close{pointer-events:auto;width:44px;height:44px;border-radius:50%;background:#242535cc;color:#fff6ea}.experience{grid-column:1;grid-row:1;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;border-radius:0;aspect-ratio:auto;background:transparent;container-type:normal;overflow:hidden}.moment-video{display:block;width:100%;height:100%;object-fit:contain}.preview-details{grid-column:2;grid-row:1;background:#292a3b;padding:80px 24px 24px;height:100dvh;overflow:auto;color:#fff6ea}.preview-details .eyebrow,.preview-details .share-description,.preview-details .play-status,.preview-details .preview-note,.preview-details .share-status,.preview-details .animation-link{color:#e6d7df}.preview-details .share-heading{font-size:2.6rem}.preview-details .share-actions{grid-template-columns:1fr}.preview-details .share-status{min-height:0}.preview-controls button,.save-card{background:#ebe0ed}.share-toggle{display:none}.share-fallback input{color:#493449}.share-fallback{background:#fffaf5;color:#493449}.preview-note{line-height:1.6}.moment-video:focus-visible{outline:3px solid #e6c585}
@media(max-width:700px){dialog{width:100vw;height:100dvh;max-height:100dvh;padding:0}.preview-shell{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 66px}.experience{grid-column:1;grid-row:1;height:100%;width:100%;max-width:none;margin:0;aspect-ratio:auto;max-height:none}.preview-heading{top:10px;left:10px;right:10px}.preview-heading>span{max-width:75%;font-size:.72rem}.share-toggle{display:block;grid-column:1;grid-row:2;border:0;border-top:1px solid #c8ad7c55;background:#292a3b;color:#f5dfb1;font-size:1rem;letter-spacing:.02em}.preview-details{display:none}.sharing-open .preview-details{display:block;position:absolute;z-index:8;left:0;right:0;bottom:66px;height:auto;max-height:75dvh;padding:24px;border-radius:22px 22px 0 0;box-shadow:0 -20px 60px #14132080}.preview-details .share-actions{grid-template-columns:1fr 1fr}.preview-details .share-description{display:block}.preview-details .share-heading{display:none}.preview-details .eyebrow{display:block}.preview-details .preview-controls{margin-top:0}.preview-details .animation-link{margin:16px 0}.preview-details .preview-note{margin-bottom:0}}

html:has(dialog[open]),body:has(dialog[open]){overflow:hidden}