@font-face{font-family:Playfair Display;font-style:normal;font-display:swap;font-weight:400;src:url(./playfair-display-latin-400-normal-CFtfchNt.woff2)format("woff2"),url(./playfair-display-latin-400-normal-DHYHbkg3.woff)format("woff")}@font-face{font-family:Playfair Display;font-style:italic;font-display:swap;font-weight:400;src:url(./playfair-display-latin-400-italic-LeeEXsx5.woff2)format("woff2"),url(./playfair-display-latin-400-italic-hIeePEuE.woff)format("woff")}@font-face{font-family:Playfair Display;font-style:normal;font-display:swap;font-weight:700;src:url(./playfair-display-latin-700-normal-CuDiGg7c.woff2)format("woff2"),url(./playfair-display-latin-700-normal-Bc_1Q1cG.woff)format("woff")}@font-face{font-family:Caveat;font-style:normal;font-display:swap;font-weight:500;src:url(./caveat-latin-500-normal-B9SDL8cy.woff2)format("woff2"),url(./caveat-latin-500-normal-Do9veZfZ.woff)format("woff")}@font-face{font-family:Caveat;font-style:normal;font-display:swap;font-weight:600;src:url(./caveat-latin-600-normal-zlTlWIYU.woff2)format("woff2"),url(./caveat-latin-600-normal-DUjB8dgm.woff)format("woff")}@font-face{font-family:Patrick Hand;font-style:normal;font-display:swap;font-weight:400;src:url(./patrick-hand-latin-400-normal-B7HHA2Vw.woff2)format("woff2"),url(./patrick-hand-latin-400-normal-Df9_VoRQ.woff)format("woff")}:root{--bg-1:#ead6ce;--bg-2:#d3b1a7;--page:#f8f1e4;--ink:#2f2320;--ink-soft:#6b4a44;--accent:#a8323e;--font-serif:"Playfair Display", Georgia, "Times New Roman", serif;--font-hand:"Caveat", "Patrick Hand", cursive;--font-letter:"Patrick Hand", "Caveat", cursive}*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html,body{overscroll-behavior:none;background:var(--bg-2);height:100%;color:var(--ink);font-family:var(--font-serif);-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;touch-action:manipulation;margin:0;overflow:hidden}body{background:radial-gradient(ellipse 80% 70% at 50% 42%, var(--bg-1) 0%, var(--bg-2) 100%)}button{font:inherit;color:inherit}.app{height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;display:flex}.stage{flex:1;min-height:0;position:relative}.stage>.book{-webkit-user-select:none;user-select:none;position:absolute;inset:14px 10px 4px;min-width:0!important;min-height:0!important}.book .stf__wrapper{height:100%;padding-bottom:0!important}.book .page:not(.page--blank){box-shadow:0 22px 40px -14px #46231e8c,0 3px 8px #46231e38}.book .page--blank{background:0 0}.blank-bg{background-image:radial-gradient(ellipse 80% 70% at 50% 42%, var(--bg-1) 0%, var(--bg-2) 100%);background-repeat:no-repeat;position:absolute;inset:0}.spiral{z-index:4;pointer-events:none;filter:drop-shadow(1px 2px 1.5px #28140f59);background-repeat:repeat-y;background-size:100%;position:absolute}.page{background:var(--page);overflow:hidden}.page--inner{background:var(--page) var(--paper) center / 100% 100% no-repeat}.page--inner:before,.page--inner:after{content:"";z-index:30;pointer-events:none;position:absolute;top:0;bottom:0}.page--inner:after{width:13%}.page--inner:before{width:4%}.page--inner.is-left:after,.page--inner.is-right:before{right:0}.page--inner.is-left:before,.page--inner.is-right:after{left:0}.page--inner.is-left:after{background:linear-gradient(270deg,#502d2342,#502d2314 45%,#502d2300)}.page--inner.is-right:after{background:linear-gradient(90deg,#502d2342,#502d2314 45%,#502d2300)}.page--inner.is-left:before{background:linear-gradient(90deg,#502d231f,#502d2300)}.page--inner.is-right:before{background:linear-gradient(270deg,#502d231f,#502d2300)}.stage.is-portrait .page--inner:after{background:linear-gradient(90deg,#502d2342,#502d2314 45%,#502d2300);left:0;right:auto}.stage.is-portrait .page--inner:before{background:linear-gradient(270deg,#502d231f,#502d2300);left:auto;right:0}.page-inner{position:absolute;inset:0;container-type:size}.page--inner.is-left .page-inner{right:var(--gutter)}.page--inner.is-right .page-inner{left:var(--gutter)}.stage.is-portrait .page--inner .page-inner{left:var(--gutter);right:0}.measure{visibility:hidden;pointer-events:none;position:fixed;top:0;left:-10000px}.item{transform:rotate(var(--rot,0deg));position:absolute}[data-tap]{cursor:pointer;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}[data-tap] *{pointer-events:none}.sticker img{pointer-events:none;width:100%;height:auto;display:block}.photo{background:#fffdf8;padding:2.2cqw 2.2cqw 6.5cqw;display:block;box-shadow:0 2px 6px #3c1e1940,0 0 0 1px #3c1e190a}.photo img{width:100%;height:auto;display:block}.photo-frame>img{pointer-events:none;width:100%;height:auto;display:block}.frame-window{background:#eee;position:absolute;overflow:hidden}.frame-window img{object-fit:cover;width:100%;height:100%;display:block}.face img{transform:scale(0)}.page.is-open .face img{animation:.6s cubic-bezier(.34,1.56,.64,1) .2s both pop-in}@keyframes pop-in{0%{transform:scale(0)rotate(-14deg)}to{transform:scale(1)rotate(0)}}.note{display:block}.note-paper{animation:2.8s ease-in-out infinite wiggle;display:block;position:relative}.note-paper img{width:100%;display:block}.note-label{text-align:center;font-family:var(--font-hand);color:var(--ink);font-size:8cqw;font-weight:600;position:absolute;top:54%;left:0;right:0;transform:translateY(-50%)rotate(-3deg)}.note-label:after{content:" ♡";color:var(--accent)}.note.opened .note-paper{animation:none}@keyframes wiggle{0%,80%,to{transform:rotate(0)}84%{transform:rotate(-3deg)}88%{transform:rotate(3deg)}92%{transform:rotate(-2deg)}96%{transform:rotate(1deg)}}.cutouts,.cover-title{flex-direction:column;align-items:center;gap:.28em;display:flex}.cut-line{filter:drop-shadow(0 1px 1.2px #3c231e73);flex-wrap:wrap;justify-content:center;gap:.24em .22em;display:flex}.cut{background:var(--tone,#fbf6ea);color:#2b1d1a;font-family:var(--font-serif);white-space:nowrap;transform:translateY(var(--dy,0)) rotate(var(--r,0deg));clip-path:polygon(0 6%,4% 0,52% 4%,97% 0,100% 8%,99% 94%,95% 100%,48% 96%,3% 100%,0 92%);padding:.06em .3em .1em;font-weight:400;line-height:1.15;display:inline-block}.cut--italic{font-style:italic}.cut--bold{font-weight:700}.cutouts--poem{font-size:5.6cqw}.cutouts--phrase{font-size:6cqw}.cutouts--title{font-size:9.5cqw}.cutouts--title .cut{color:var(--accent)}.letter-card{background:#fdf8ef;padding:10% 8% 9% 10%;box-shadow:0 2px 8px #3c1e192e,0 0 0 1px #3c1e190d}.letter{height:100%;font-family:var(--font-letter);font-size:calc(var(--fs,4.4) * 1cqw);color:var(--ink);line-height:1.5;overflow:hidden}.letter p{margin:0 0 .65em}.letter .signature{text-align:right;font-family:var(--font-hand);color:var(--accent);margin:.4em 0 0;font-size:1.45em;font-weight:600}.letter.scroll{-webkit-overflow-scrolling:touch;overflow-y:auto}.cake-btn{width:100%;display:block;position:relative;container-type:inline-size}.cake-btn img{width:100%;display:block}.flame{transform-origin:50% 100%;background:radial-gradient(at 50% 72%,#fffbe0 0%,#ffe07a 30%,#ff9f2a 68%,#ff821400 100%);border-radius:50%/62% 62% 38% 38%;width:2.6cqw;height:5.6cqw;animation:1.2s ease-in-out infinite flicker;position:absolute;transform:translate(-50%,-100%);box-shadow:0 0 2.4cqw .8cqw #ffc45a8c}@keyframes flicker{0%,to{opacity:1;transform:translate(-50%,-100%)scale(1)rotate(-2deg)}30%{opacity:.95;transform:translate(-50%,-100%)scale(.92,1.08)rotate(2deg)}60%{opacity:1;transform:translate(-50%,-100%)scale(1.04,.95)rotate(-1deg)}}.cake.out .flame{animation:.45s ease-in forwards blow}@keyframes blow{to{opacity:0;box-shadow:none;transform:translate(-50%,-100%)scale(.2,.1)rotate(12deg)}}.cake-hint{max-width:90%;font-family:var(--font-hand);text-align:center;color:var(--ink);margin:2cqw auto 0;font-size:6.4cqw;font-weight:600;line-height:1.15}.page--cover,.page--back{background:#d9b1aa}.cover-paper{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.05 .14' numOctaves='3' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .97 0 0 0 0 .95 1.5 0 0 0 -1.02'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.08 .03' numOctaves='3' seed='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .27 0 0 0 0 .25 1.4 0 0 0 -0.97'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35 0 0 0 0 .2 0 0 0 0 .18 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),radial-gradient(85% 75% at 45% 40%,#e2bdb6 0%,#d8aea7 60%,#c69891 100%);background-size:260px 260px,300px 300px,200px 200px,100% 100%;position:absolute;inset:0}.cover-open{position:absolute;inset:0;container-type:size}.cover-card{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .2 0 0 0 .12 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),radial-gradient(75% 70% at 50% 45%,#f8f3ea 0%,#f2e9dc 65%,#e7d7c1 100%);background-size:200px 200px,100% 100%;flex-direction:column;justify-content:center;align-items:center;gap:9cqh;padding:10% 7% 6%;display:flex;position:absolute;box-shadow:inset 0 0 2.4cqw #966e464d,inset 0 0 .5cqw #8c643c59,0 .6cqw 1.6cqw #50281e52,0 .1cqw .3cqw #50281e40}.cover-title{width:100%;margin:0;font-size:9.6cqw}.cover-title .cut{color:var(--accent)}.cover-hint{font-family:var(--font-hand);text-align:center;color:var(--ink-soft);font-size:7cqw;font-weight:600}.page--back{container-type:size}.back-bow{width:34%;position:absolute;top:30%;left:50%;transform:translate(-50%)rotate(-6deg)}.back-bow img{width:100%;display:block}.reread{color:var(--accent);font-family:var(--font-serif);clip-path:polygon(0 6%,4% 0,52% 4%,97% 0,100% 8%,99% 94%,95% 100%,48% 96%,3% 100%,0 92%);cursor:pointer;white-space:nowrap;background:#fbf6ea;border:0;padding:.35em .9em .45em;font-size:clamp(16px,7cqw,26px);font-style:italic;position:absolute;top:54%;left:50%;transform:translate(-50%)rotate(-2deg);box-shadow:0 2px 5px #3c1e194d}.controls{justify-content:center;gap:28px;padding:8px 0 10px;display:flex}.arrow{width:40px;height:40px;color:var(--ink-soft);cursor:pointer;background:#fffaf399;border:0;border-radius:50%;font-size:26px;line-height:1;box-shadow:0 1px 3px #3c1e1926}.arrow:disabled{opacity:.3;cursor:default}.lightbox,.note-modal{z-index:40;opacity:0;background:#281614db;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:fixed;inset:0}.lightbox.open,.note-modal.open{opacity:1}.lightbox img{border:8px solid #fffdf8;max-width:92vw;max-height:84dvh;box-shadow:0 6px 30px #00000080}.close{top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));color:#fff;cursor:pointer;background:#ffffff2e;border:0;border-radius:50%;width:44px;height:44px;font-size:20px;position:absolute}.note-card{--s:min(86vw, 420px, 72vh);width:var(--s);height:var(--s);padding:calc(var(--s) * .13) calc(var(--s) * .12) calc(var(--s) * .1);font-family:var(--font-hand);font-weight:500;font-size:calc(var(--s) * .082);text-align:center;color:var(--ink);background-size:100% 100%;justify-content:center;align-items:center;line-height:1.2;transition:transform .4s cubic-bezier(.2,.8,.3,1.1);display:flex;transform:perspective(800px)rotateY(75deg)scale(.6)}.note-modal.open .note-card{transform:rotate(-2deg)}.note-card p{margin:0}.book img{height:auto}.book .frame-window img{height:100%}.book .page-inner>.item{opacity:0}.book .page.is-open .page-inner>.item{animation:.5s cubic-bezier(.2,.7,.3,1) both item-in;animation-delay:calc(.12s + var(--i,0) * 60ms)}@keyframes item-in{0%{opacity:0;translate:0 .8cqw;scale:.96}to{opacity:1;translate:0;scale:1}}.book .page.is-open .page-inner>.letter-card{animation-name:fade-in}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.cover-hint{animation:2.6s ease-in-out infinite breathe}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}.turn-hint{z-index:20;color:var(--ink);font-family:var(--font-hand);white-space:nowrap;pointer-events:none;opacity:0;background:#fffaf3eb;border-radius:999px;padding:.25em .75em .3em;font-size:17px;font-weight:600;transition:opacity .4s;position:absolute;translate:0 -50%;box-shadow:0 2px 8px #3c1e1938}.turn-hint:after{content:" →";color:var(--accent);animation:1.4s ease-in-out infinite nudge;display:inline-block}.turn-hint.show{opacity:1;transition-delay:1.2s}@keyframes nudge{0%,to{transform:translate(0)}50%{transform:translate(5px)}}@media (prefers-reduced-motion:reduce){.book .page-inner>.item,.book .page.is-open .page-inner>.item{opacity:1;animation:none}.cover-hint,.turn-hint:after{animation:none}.cover-hint{opacity:1}}.letter-hint{background:var(--accent);color:#fff;font-family:var(--font-hand);white-space:nowrap;border-radius:999px;padding:.2em .8em .25em;font-size:13px;font-weight:600;display:none;position:absolute;top:1.5%;left:50%;translate:-50%;box-shadow:0 2px 6px #3c1e194d}.letter-card.tiny .letter-hint{display:block}.reader{z-index:45;padding:calc(56px + env(safe-area-inset-top)) 14px calc(20px + env(safe-area-inset-bottom));opacity:0;background:#281614db;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:fixed;inset:0}.reader.open{opacity:1}.reader-card{-webkit-overflow-scrolling:touch;overscroll-behavior:contain;width:min(100%,560px);max-height:100%;font-family:var(--font-letter);color:var(--ink);background:#fdf8ef;padding:26px 24px 30px;font-size:18px;line-height:1.55;overflow-y:auto;box-shadow:0 6px 30px #00000073}.reader-card p{margin:0 0 .75em}.reader-card .signature{text-align:right;font-family:var(--font-hand);color:var(--accent);margin:.6em 0 0;font-size:1.5em;font-weight:600}.rotate-hint{top:calc(10px + env(safe-area-inset-top));z-index:30;color:var(--ink);font-family:var(--font-hand);white-space:nowrap;pointer-events:none;opacity:0;background:#fffaf3f0;border-radius:999px;padding:.3em .9em .35em;font-size:16px;font-weight:600;transition:opacity .5s;position:fixed;left:50%;translate:-50%;box-shadow:0 2px 8px #3c1e1940}.rotate-hint.show{opacity:1}.controls{position:relative}.sound-toggle{right:calc(12px + env(safe-area-inset-right));cursor:pointer;filter:drop-shadow(0 2px 2px #3c1e194d);background:0 0;border:0;width:52px;height:34px;padding:0 0 0 12px;font-size:17px;line-height:1;position:absolute;top:50%;translate:0 -50%;rotate:-5deg}.sound-toggle:before{content:"";z-index:-1;background:radial-gradient(circle at 9px 50%, var(--bg-2) 0 3px, #78503c73 3.6px, transparent 4.2px), #fbf3e4;clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%);position:absolute;inset:0}.sound-toggle.is-muted{opacity:.75}.sound-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.still *,.still :before,.still :after{animation-duration:0s!important;animation-delay:0s!important}@media (prefers-reduced-motion:reduce){.note-paper,.flame{animation:none!important}.face img{transform:none}.page.is-open .face img{animation:none}.note-card{transition:none}}
