:root{--bg:#ffd3e2;--surface:#ffc0d5;--paper:#fff8fb;--ink:#3b1d2a;--muted:#6d4757;--accent:#c41f5a;--accent-ink:#fff;--butter:#ffe98a;--sky:#a9d8ff;--pink:#ff9cbf;--close:#3b1d2a;--close-ink:#fff8fb;--skin:#f0c39f;--hair:#3a2219;--blush:#ff9cbf;--step-small:clamp(.8125rem, .79rem + .1vw, .875rem);--step-body:clamp(1.0625rem, 1rem + .25vw, 1.1875rem);--step-lead:clamp(1.25rem, 1.1rem + .7vw, 1.625rem);--step-head:clamp(2rem, 1.3rem + 3.2vw, 4rem);--step-display:clamp(3.4rem, 1.6rem + 6.4vw, 7.25rem);--margin:clamp(16px, 2.4vw, 32px);--hand:"Gaegu", "Comic Sans MS", cursive;--text:"Hanken Grotesk", system-ui, sans-serif;--pop:cubic-bezier(.34, 1.56, .64, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html{-webkit-text-size-adjust:100%;scroll-padding-top:16px}body{background:var(--bg);color:var(--ink);font-family:var(--text);font-size:var(--step-body);letter-spacing:-.005em;margin:0;line-height:1.45;overflow-x:hidden}img,svg{max-width:100%;height:auto;display:block}h1,h2,h3,p,ul,figure{margin:0}ul{padding:0;list-style:none}a{color:inherit}button{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}::selection{background:var(--butter);color:var(--ink)}.btn{white-space:nowrap;background:var(--accent);min-height:48px;color:var(--accent-ink);cursor:pointer;transition:transform .18s var(--pop), background-color .18s;border:0;border-radius:999px;justify-content:center;align-items:center;padding:0 24px;font-weight:500;text-decoration:none;display:inline-flex}.btn:hover{transform:translateY(-2px)rotate(-1deg)}.btn:active{transform:scale(.95)}.btn:disabled{cursor:progress;background:var(--muted);transform:none}.again,.sound{text-underline-offset:4px;cursor:pointer;background:0 0;border:0;min-height:44px;padding:0 4px;text-decoration:underline;text-decoration-thickness:2px}.again:hover,.sound:hover{color:var(--accent)}.again:disabled{color:var(--muted);cursor:progress}.bar{padding:18px var(--margin);align-items:center;gap:16px;display:flex}.monogram{font-family:var(--hand);font-weight:700;font-size:var(--step-head);margin-right:auto;line-height:1;text-decoration:none}.card{--scoop:22px;background:var(--paper);max-width:1240px;-webkit-mask:radial-gradient(circle var(--scoop) at 0 0, #0000 98%, #000) top left / 51% 51% no-repeat,  radial-gradient(circle var(--scoop) at 100% 0, #0000 98%, #000) top right / 51% 51% no-repeat,  radial-gradient(circle var(--scoop) at 0 100%, #0000 98%, #000) bottom left / 51% 51% no-repeat,  radial-gradient(circle var(--scoop) at 100% 100%, #0000 98%, #000) bottom right / 51% 51% no-repeat;mask:radial-gradient(circle var(--scoop) at 0 0, #0000 98%, #000) top left / 51% 51% no-repeat,  radial-gradient(circle var(--scoop) at 100% 0, #0000 98%, #000) top right / 51% 51% no-repeat,  radial-gradient(circle var(--scoop) at 0 100%, #0000 98%, #000) bottom left / 51% 51% no-repeat,  radial-gradient(circle var(--scoop) at 100% 100%, #0000 98%, #000) bottom right / 51% 51% no-repeat;margin:0 auto;position:relative}.front{padding:8px var(--margin) 0}.card--front{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);align-items:center;gap:clamp(24px,4vw,64px);padding:clamp(28px,4.5vw,64px);display:grid}h1{font-weight:500;font-size:var(--step-display);letter-spacing:-.05em;line-height:.9}h1 .name-him,h1 .name-her{display:inline-block}h1 .name-her{padding-left:.9em;display:block}.front__route{font-size:var(--step-lead);margin-top:28px;font-weight:500}.front__cities{margin-top:6px}.diamond{background:var(--accent);width:9px;height:9px;margin:0 10px 2px;display:inline-block;transform:rotate(45deg)}.front__picture{padding-bottom:12%;position:relative}.windows{grid-template-columns:1fr 1fr;align-items:start;gap:14px;display:grid}.window{aspect-ratio:4/5;object-fit:cover;width:100%}.window--dc{object-position:46% 50%;transform:rotate(-2deg)}.window--ny{object-position:40% 50%;transform:rotate(2.5deg)translateY(10%)}.couple-slot{width:min(62%,300px);position:absolute;bottom:-4%;left:50%;transform:translate(-50%)}.couple{width:100%;overflow:visible}.blowout{font-family:var(--hand);font-weight:700;font-size:var(--step-lead);color:var(--accent);position:absolute;bottom:2%;right:2%;transform:rotate(-6deg)}.postmark{aspect-ratio:1;border:4px solid var(--accent);width:118px;color:var(--accent);text-align:center;font-weight:500;font-size:var(--step-small);text-transform:none;background:var(--paper);border-radius:50%;place-content:center;line-height:1.2;display:grid;position:absolute;top:-22px;right:-14px;transform:rotate(12deg)}.back{padding:clamp(28px, 5vw, 72px) var(--margin) 0}.card--back{grid-template-columns:1fr;gap:clamp(28px,4vw,64px);padding:clamp(28px,4.5vw,64px);display:grid}h2{font-weight:500;font-size:var(--step-head);letter-spacing:-.05em;line-height:.95}.note__text{max-width:46ch;min-height:6lh;font-family:var(--hand);font-size:var(--step-lead);white-space:pre-line;line-height:1.25}.stamps{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:clamp(16px,2.4vw,32px);display:grid}.slot{justify-items:start;gap:22px;min-width:0;display:grid}.slot__words{justify-items:start;gap:6px;display:grid}h3{font-weight:500;font-size:var(--step-lead);letter-spacing:-.03em;line-height:1}.slot__line{color:var(--muted)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.slot__actions{flex-wrap:wrap;align-items:center;gap:4px 16px;min-height:48px;margin-top:8px;display:flex}.elsewhere{color:var(--accent);font-weight:500}.stamp{--row:60px;width:100%;width:round(down,100%,16px);max-width:368px;height:384px;padding:10px;position:relative;-webkit-mask:radial-gradient(circle at 8px 8px,#0000 5px,#000 5.5px) -8px -8px/16px 16px,linear-gradient(#000 0 0) content-box;mask:radial-gradient(circle at 8px 8px,#0000 5px,#000 5.5px) -8px -8px/16px 16px,linear-gradient(#000 0 0) content-box}.stamp--versus{background:var(--butter);transform:rotate(-2deg)}.stamp--together{background:var(--sky);transform:rotate(1.5deg)}.stamp--bonus{background:var(--pink);transform:rotate(-1deg)}.stamp__face{grid-template-rows:1fr auto;gap:6px;height:100%;padding:14px;display:grid;position:relative}.stamp__value{font-family:var(--hand);font-weight:700;font-size:var(--step-body);justify-self:end;line-height:1}.reel{height:calc(var(--row) * 5);contain:paint;background:var(--paper);align-self:center;position:relative;overflow:hidden}.reel__strip{will-change:transform}.reel__strip li{height:var(--row);color:var(--muted);text-align:center;font-size:var(--step-body);place-items:center;padding:0 12px;line-height:1.05;display:grid}.reel__strip li.is-centre{color:var(--ink);font-weight:500;font-size:var(--step-lead)}.reel:before{content:"";inset:calc(var(--row) * 2) 0;background:var(--butter);opacity:.55;pointer-events:none;position:absolute}.stamp--versus .reel:before{background:var(--bg)}.reel__strip{position:relative}.slot.is-picked .stamp{animation:land .5s var(--pop)}@keyframes land{0%{transform:scale(1) rotate(var(--tilt,0deg))}40%{transform:scale(1.06) rotate(calc(var(--tilt,0deg) + 2deg))}to{transform:scale(1) rotate(var(--tilt,0deg))}}.stamp--versus{--tilt:-2deg}.stamp--together{--tilt:1.5deg}.stamp--bonus{--tilt:-1deg}.wrap{cursor:pointer;background-color:var(--accent);transition:transform .45s var(--pop), opacity .35s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Ccircle cx='7' cy='7' r='3.5' fill='%23ffd3e2'/%3E%3Ccircle cx='21' cy='21' r='3.5' fill='%23ffd3e2'/%3E%3C/svg%3E");border:0;padding:0;position:absolute;inset:0}.wrap__ribbon:before,.wrap__ribbon:after{content:"";background:var(--butter);position:absolute}.wrap__ribbon:before{width:32px;top:0;bottom:0;left:calc(50% - 16px)}.wrap__ribbon:after{height:32px;top:calc(50% - 16px);left:0;right:0}.wrap__bow{width:112px;height:56px;position:absolute;top:50%;left:50%;transform:translate(-50%,-80%)}.wrap__bow:before,.wrap__bow:after{content:"";border:13px solid var(--butter);border-radius:50% 50% 0;width:52px;height:52px;position:absolute;top:0}.wrap__bow:before{left:0;transform:rotate(-20deg)}.wrap__bow:after{right:0;transform:rotate(110deg)}.wrap:hover{transform:rotate(-3deg)scale(1.03)}.slot--bonus:not(.is-open) .reel__strip{visibility:hidden}.slot--bonus.is-open .wrap{opacity:0;pointer-events:none;transform:translateY(-120%)rotate(-18deg)}.every{padding:clamp(120px, 14vw, 200px) var(--margin) clamp(120px, 14vw, 200px);grid-template-columns:minmax(0,1fr) minmax(0,640px) minmax(0,1fr);align-items:start;gap:clamp(20px,3vw,48px);max-width:1300px;margin:0 auto;display:grid}.every__pic{aspect-ratio:4/5;object-fit:cover;width:100%;margin-top:18%}.every__pic--dc{rotate:-3deg}.every__pic--ny{rotate:3deg}.every__list{container-type:inline-size}.giant{letter-spacing:-.06em;text-transform:uppercase;margin-left:-.04em;font-size:34cqw;line-height:.8}.bars{gap:6px;margin-top:20px;display:grid}.bar-row{background:var(--paper)}.bar-row summary{cursor:pointer;justify-content:space-between;align-items:center;min-height:56px;padding:0 18px;font-weight:500;list-style:none;display:flex}.bar-row summary::-webkit-details-marker{display:none}.bar-row summary:after{content:"+";font-size:var(--step-lead);transition:transform .2s var(--pop);line-height:1}.bar-row[open] summary:after{transform:rotate(45deg)}.bar-row summary .count{color:var(--muted);margin-left:auto;margin-right:16px;font-weight:400}.bar-row ul{gap:14px;padding:4px 18px 20px;display:grid}.bar-row li{gap:2px;display:grid}.bar-row a{text-underline-offset:3px}.bar-row .how{color:var(--muted)}.close{padding:0 var(--margin) var(--margin);background:var(--close)}.card--close{--scoop:0px;grid-template-columns:1fr 1fr;gap:32px 48px;padding:clamp(56px,6vw,88px) clamp(28px,4.5vw,64px) 28px;display:grid;-webkit-mask:radial-gradient(52px at 50% 0,#0000 98%,#000) top/104px 100% repeat-x;mask:radial-gradient(52px at 50% 0,#0000 98%,#000) top/104px 100% repeat-x}.close__signoff{font-family:var(--hand);font-weight:700;font-size:var(--step-head);line-height:1}.close__ps{font-family:var(--hand);font-size:var(--step-lead);margin-top:12px}.close__address{align-content:start;justify-items:start;gap:12px;display:grid}.close__stamp{aspect-ratio:3/4;object-fit:cover;border:6px solid var(--paper);outline:0;justify-self:end;width:120px;transform:rotate(4deg)}.close__address .label{min-width:3.2em;color:var(--muted);display:inline-block}.imprint{max-width:75ch;color:var(--muted);grid-column:1/-1}.imprint a{color:var(--ink)}@media (prefers-reduced-motion:no-preference){.couple .him{transform-origin:84px 236px;animation:3.2s ease-in-out infinite bob}.couple .her{transform-origin:168px 236px;animation:3.2s ease-in-out -1.6s infinite bob}.couple .heart{transform-origin:127px 148px;animation:1.4s ease-in-out infinite beat}body.is-spinning .couple .him,body.is-spinning .couple .her{animation-duration:.6s}.js .rise{opacity:0;transition:opacity .6s ease, transform .7s var(--pop);transform:translateY(24px)}.js .rise.is-in{opacity:1;transform:none}}@keyframes bob{50%{transform:translateY(-5px)rotate(-1.5deg)}}@keyframes beat{0%,to{transform:scale(1)}15%{transform:scale(1.22)}30%{transform:scale(.96)}45%{transform:scale(1.12)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.every__lede{margin-top:16px}@media (width<=900px){.card--front{grid-template-columns:1fr}}@media (width<=1000px){.every{grid-template-columns:1fr 1fr;max-width:720px;padding-top:120px;padding-bottom:120px}.every__list{grid-area:1/1/auto/-1}.every__pic{margin-top:0}}@media (width<=860px){.stamps{grid-template-columns:1fr;gap:56px}.slot{justify-items:stretch}.stamp{justify-self:center}}@media (width<=640px){.bar{padding:14px var(--margin);gap:8px}.btn--spin{padding:0 18px}.sound{font-size:var(--step-small)}.front{padding-top:0}.card--front{gap:28px;padding:28px 22px 36px}h1{font-size:15vw}h1 .name-her{padding-left:.5em}.front__route{margin-top:20px}.diamond{margin:0 7px 2px}.postmark{width:96px;top:-16px;right:-6px}.card--back{padding:28px 18px 32px}.stamp{--row:52px;height:336px}.stamp__face{padding:10px}.card--close{grid-template-columns:1fr;padding-top:52px;-webkit-mask:radial-gradient(30px at 50% 0,#0000 98%,#000) top/60px 100% repeat-x;mask:radial-gradient(30px at 50% 0,#0000 98%,#000) top/60px 100% repeat-x}.close__stamp{order:-1;justify-self:start;width:88px}}
