@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display:ital@0;1&display=swap";:root{color:#fff8ee;font-synthesis:none;text-rendering:optimizelegibility;--ink:#281348;--cream:#fff8ee;--pink:#ff78ad;--gold:#ffc968;--coral:#ff806d;--violet:#6f42b8;background:#120a24;font-family:DM Sans,system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button,a{font:inherit}button{-webkit-tap-highlight-color:transparent}body:before{content:"";z-index:-2;background:radial-gradient(circle at 17% 15%,#ef6fb43b,#0000 30%),radial-gradient(circle at 84% 24%,#6f42b857,#0000 34%),linear-gradient(145deg,#120a24 0%,#271142 45%,#11091f 100%);position:fixed;inset:0}body:after{content:"";z-index:-1;opacity:.18;pointer-events:none;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='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.4'/%3E%3C/svg%3E");position:fixed;inset:0}.app-shell{flex-direction:column;min-height:100vh;display:flex}.topbar{justify-content:space-between;align-items:center;gap:20px;width:min(1180px,100% - 40px);min-height:86px;margin:0 auto;display:flex}.brand{color:#fff8ee;letter-spacing:-.02em;align-items:center;gap:10px;font-weight:700;text-decoration:none;display:inline-flex}.brand__mark{background:#ffffff12;border:1px solid #ffffff38;border-radius:50%;place-items:center;width:34px;height:34px;display:grid}.install-button{color:var(--cream);cursor:pointer;background:#ffffff14;border:1px solid #ffffff2e;border-radius:999px;padding:10px 16px}.install-button:hover{background:#ffffff24}.hero{grid-template-columns:.82fr 1.18fr;align-items:center;gap:clamp(24px,5vw,82px);width:min(1180px,100% - 40px);margin:auto;padding:42px 0 68px;display:grid}.hero__intro{max-width:430px}.kicker{color:#f9bdcf;letter-spacing:.18em;margin:0 0 18px;font-size:.77rem;font-weight:700}.hero__intro h2{letter-spacing:-.055em;margin:0;font-family:DM Serif Display,Georgia,serif;font-size:clamp(3rem,6vw,5.7rem);font-weight:400;line-height:.91}.hero__intro h2 em{color:#ffc96d;font-weight:400}.hero__intro>p:last-child{color:#fff8eeb3;max-width:360px;margin-top:28px;line-height:1.65}.card-demo{min-width:0}.card-stage{perspective:1800px;width:100%;padding:24px 0 28px 8%}.greeting-card{--turn:0;aspect-ratio:.74;width:min(370px,43vw);transform-style:preserve-3d;margin:0 auto;position:relative}.card-sheet,.card-cover{border-radius:4px 17px 17px 4px;position:absolute;inset:0}.card-sheet--right{z-index:1;background:#fffaf1;box-shadow:0 34px 80px #00000057,inset 0 0 0 1px #4b2e2514}.card-cover{z-index:3;transform-origin:0;transform-style:preserve-3d;transform:rotateY(calc(var(--turn) * -178deg));cursor:grab;touch-action:pan-y;outline:none;transition:transform .92s cubic-bezier(.2,.76,.28,1)}.card-cover:focus-visible{box-shadow:0 0 0 4px #ffc968}.greeting-card.is-dragging .card-cover{cursor:grabbing;transition:none}.card-cover:after{content:"";width:12px;opacity:calc(.18 + var(--turn) * .5);pointer-events:none;background:linear-gradient(90deg,#00000030,#0000);position:absolute;top:1%;bottom:1%;left:0;transform:translateZ(1px)}.card-face{backface-visibility:hidden;border-radius:4px 17px 17px 4px;position:absolute;inset:0;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff1f}.card-face--front{background:linear-gradient(145deg,#8a3e86 0%,#562064 52%,#2e164b 100%)}.card-face--back{color:var(--ink);background:#fffaf1;transform:rotateY(180deg);box-shadow:inset -18px 0 40px #3c20340f,inset 0 0 0 1px #4b2e2514}.cover-glow{background:radial-gradient(circle at 52% 42%,#ffcc7c33,#0000 30%),radial-gradient(circle at 16% 10%,#ff7cae73,#0000 28%);position:absolute;inset:-20%}.front-copy{z-index:2;text-align:center;position:absolute;inset:34% 9% auto}.front-copy h1{letter-spacing:-.05em;margin:6px 0 24px;font-family:DM Serif Display,Georgia,serif;font-size:clamp(2.7rem,6.6vw,5.4rem);font-weight:400;line-height:.79}.front-copy h1 span{color:#ffd27c;font-style:italic}.front-copy>p:last-child{color:#ffffffb8;letter-spacing:.05em;font-size:.78rem}.eyebrow{letter-spacing:.18em;text-transform:uppercase;color:#ab687c;font-size:.68rem;font-weight:700}.eyebrow--light{color:#f9c4d5}.front-stars{text-align:center;color:#ffd27c;letter-spacing:1.15rem;opacity:.82;width:100%;position:absolute;bottom:8%}.balloons{pointer-events:none;position:absolute;inset:0}.balloon{border-radius:51% 49% 46% 54%/58% 56% 44% 42%;width:58px;height:76px;position:absolute;box-shadow:inset -10px -12px 20px #3f143538,inset 10px 12px 22px #ffffff38,0 12px 25px #00000024}.balloon:after{content:"";transform-origin:top;background:linear-gradient(#fff9,#ffffff05);width:1px;height:150px;position:absolute;top:73px;left:50%;transform:rotate(8deg)}.balloon--one{background:linear-gradient(145deg,#ff9cbd,#de4984);top:7%;left:9%;transform:rotate(-10deg)}.balloon--two{background:linear-gradient(145deg,#ffd884,#e6a62e);top:3%;right:7%;transform:rotate(8deg)scale(.9)}.balloon--three{opacity:.82;background:linear-gradient(145deg,#ae83e7,#6b3fb0);bottom:10%;left:2%;transform:rotate(-7deg)scale(.72)}.inside{color:var(--ink);position:absolute;inset:0}.inside--right{background:radial-gradient(circle at 74% 22%,#ffce7440,#0000 24%),linear-gradient(145deg,#fffdf8,#fff5e8);padding:10% 10% 8%}.inside--right h2{letter-spacing:-.04em;margin:6% 0;font-family:DM Serif Display,Georgia,serif;font-size:clamp(2rem,4vw,3.2rem);font-weight:400;line-height:.93}.inside--right h2 em{color:#c84d78;font-weight:400}.inside__copy{color:#604654;max-width:92%;font-family:DM Serif Display,Georgia,serif;font-size:clamp(.82rem,1.6vw,1.05rem);line-height:1.45}.signature{color:#a24b6b;margin-top:7%;font-family:DM Serif Display,Georgia,serif;font-size:.95rem;font-style:italic}.inside__sparkle{color:#e9aa37;font-size:1.6rem;position:absolute;top:7%;right:8%}.inside--left{background:radial-gradient(circle at 45% 42%,#ffc8d738,#0000 35%),#fffaf1;align-content:center;place-items:center;gap:8%;padding:12%;display:grid}.inside-left__ring{color:#a45770;letter-spacing:.18em;border:1px solid #d49b9a;border-radius:50%;align-content:center;place-items:center;gap:4px;width:145px;height:145px;font-size:.62rem;display:grid}.inside-left__ring b{color:#ce5b7f;font-size:1.5rem}.inside--left blockquote{text-align:center;color:#553c49;margin:0;font-family:DM Serif Display,Georgia,serif;font-size:clamp(1rem,2vw,1.3rem);line-height:1.35}.tiny-note{color:#a1848f;letter-spacing:.04em;font-size:.7rem}.cake{filter:drop-shadow(0 16px 16px #582b3a21);width:43%;height:31%;position:absolute;bottom:8%;right:8%}.cake__base,.cake__middle,.cake__top{background:linear-gradient(90deg,#f7b6c9,#ffd5df 45%,#ec96b2);border-radius:8px 8px 4px 4px;position:absolute;left:50%;transform:translate(-50%);box-shadow:inset 0 -10px 18px #ac46681a}.cake__base{width:92%;height:34%;bottom:8%}.cake__middle{background:linear-gradient(90deg,#ffd47f,#ffe6ac 45%,#efb649);width:71%;height:30%;bottom:40%}.cake__top{width:51%;height:25%;bottom:67%}.cake__top span{background:#fff9ef;border-radius:50%;width:13%;height:19%;position:absolute;top:-4%}.cake__top span:first-child{left:18%}.cake__top span:nth-child(2){left:44%}.cake__top span:nth-child(3){right:18%}.cake__plate{background:#dcb4a1;border-radius:50%;height:7%;position:absolute;bottom:2%;left:3%;right:3%}.cake__candles{z-index:2;gap:10px;display:flex;position:absolute;bottom:91%;left:50%;transform:translate(-50%)}.candle{background:repeating-linear-gradient(135deg,#e65f88 0 3px,#fff 3px 6px);width:4px;height:24px;position:relative}.flame{background:#ffc64f;border-radius:70% 30% 60% 40%;width:8px;height:12px;animation:1s ease-in-out infinite alternate flicker;position:absolute;top:-13px;left:-2px;transform:rotate(12deg);box-shadow:0 0 12px #ffbf3f}.card-controls{text-align:center;margin-top:8px}.primary-button{color:#26123d;cursor:pointer;background:#ffd27c;border:0;border-radius:999px;align-items:center;gap:18px;padding:13px 20px 13px 22px;font-weight:700;transition:transform .2s,background .2s;display:inline-flex;box-shadow:0 12px 35px #00000029}.primary-button:hover{background:#ffdc96;transform:translateY(-2px)}.card-controls p{color:#fff8ee80;margin:12px 0 0;font-size:.72rem}footer{color:#fff8ee6b;letter-spacing:.04em;flex-wrap:wrap;justify-content:center;align-items:center;gap:9px;width:min(1180px,100% - 40px);min-height:76px;margin:0 auto;font-size:.72rem;display:flex}.footer-dot{color:#ffc968}.confetti{pointer-events:none;z-index:20;visibility:hidden;position:fixed;inset:0;overflow:hidden}.confetti--active{visibility:visible}.confetti__piece{opacity:0;width:9px;height:15px;animation-name:confettiFall;animation-timing-function:linear;animation-fill-mode:both;position:absolute;top:-5vh}.confetti--active .confetti__piece{opacity:1}.confetti__piece--0{background:#ff7eac}.confetti__piece--1{background:#ffc968}.confetti__piece--2{background:#8f65d0}.confetti__piece--3{background:#ff856f;border-radius:50%}.confetti__piece--4{background:#fff7dc}@keyframes confettiFall{0%{transform:translateY(-8vh)rotate(0)}to{transform:translate(6vw,110vh)rotate(720deg)}}@keyframes flicker{0%{transform:rotate(8deg)scale(.92)}to{transform:rotate(-8deg)scale(1.05)}}@media (width<=860px){.hero{grid-template-columns:1fr;padding-top:22px}.hero__intro{text-align:center;max-width:600px;margin:0 auto}.hero__intro>p:last-child{margin-left:auto;margin-right:auto}.card-stage{padding-left:0}.greeting-card{width:min(360px,75vw)}}@media (width<=520px){.topbar,.hero,footer{width:min(100% - 24px,1180px)}.topbar{min-height:70px}.hero{gap:18px;padding-top:18px}.hero__intro h2{font-size:clamp(2.7rem,14vw,4rem)}.hero__intro>p:last-child{font-size:.9rem}.card-stage{perspective:1200px;overflow:visible}.greeting-card{width:min(74vw,330px)}.inside--right{padding:9%}.inside__copy{font-size:clamp(.7rem,2.7vw,.9rem)}.signature{font-size:.78rem}.inside-left__ring{width:112px;height:112px}footer{padding:20px 0 26px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important}.card-cover{transition-duration:.22s}}
