:root{--ink:#312b27;--muted:#766c63;--paper:#f2ecdf;--rose:#c36f76;--olive:#747557;--ease-out:cubic-bezier(.23, 1, .32, 1);--ease-in-out:cubic-bezier(.77, 0, .175, 1);--serif:"Iowan Old Style", "Baskerville", "Times New Roman", serif;--hand:"Bradley Hand", "Segoe Print", "Marker Felt", cursive}*{box-sizing:border-box}html{background:#d8d0c0}body{color:var(--ink);font-family:var(--serif);overscroll-behavior:none;background:radial-gradient(circle at 11% 7%,#ffffffbd 0 11%,#0000 31%),radial-gradient(circle at 82% 18%,#b8a18933 0 13%,#0000 36%),radial-gradient(at 45% 110%,#7575572b 0 21%,#0000 49%),repeating-linear-gradient(103deg,#4b3d2d06 0 1px,#0000 1px 6px),#ded7c9;margin:0}button,article{-webkit-tap-highlight-color:transparent}.app-shell{z-index:1;isolation:isolate;min-height:100dvh;padding:max(14px, env(safe-area-inset-top)) 18px max(16px, env(safe-area-inset-bottom));flex-direction:column;display:flex;position:relative;overflow:hidden}.sky-background{z-index:0;pointer-events:none;position:fixed;inset:0}.sky-background canvas{filter:saturate(1.08)contrast(1.025);display:block}.floating-signboard{z-index:2;aspect-ratio:1.15;pointer-events:none;filter:drop-shadow(0 14px 18px #37464e2e);opacity:0;transform-origin:50%;width:clamp(180px,22vw,290px);transition:opacity .42s var(--ease-out), transform .52s var(--ease-out);position:fixed;top:15vh;left:clamp(38px,6.5vw,104px);transform:translate(18px,-12px)scale(.94)}.floating-signboard.is-visible{opacity:1;transform:translate(0,0)scale(1)}.floating-signboard canvas{display:block}.card-entrance{z-index:20;opacity:1;transition:opacity .52s var(--ease-out), filter .52s var(--ease-out);background:#69b1e014;position:fixed;inset:0;overflow:hidden}.card-entrance.is-landing{opacity:0;filter:blur(2px);pointer-events:none}.card-entrance canvas{display:block}.entrance-fallback{background:linear-gradient(#4397dc38,#ffe0bd24)}.skip-entrance{z-index:3;top:max(14px, env(safe-area-inset-top));color:#312b27b8;letter-spacing:.1em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;transition:transform .14s var(--ease-out), background-color .14s var(--ease-out);background:#f7f0e28f;border:1px solid #312b2738;border-radius:999px;padding:9px 12px;font:9px/1 ui-monospace,monospace;position:absolute;right:16px}.skip-entrance:active{transform:scale(.97)}.skip-entrance:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.app-shell .deck-region,.app-shell .controls{transition:opacity .42s var(--ease-out), transform .52s var(--ease-out), filter .42s var(--ease-out)}.app-shell.is-awaiting-intro .deck-region,.app-shell.is-awaiting-intro .controls{opacity:0;filter:blur(2px);pointer-events:none;transform:translateY(8px)scale(.985)}.app-shell.has-photo-search .deck-region{transition-duration:.24s;transform:translateY(-18px)scale(.94)}.app-shell:before{content:"";z-index:-1;opacity:.1;mix-blend-mode:multiply;pointer-events:none;background:repeating-radial-gradient(at 22% 35%,#0000 0 7px,#4837270f 8px,#0000 9px 19px);position:absolute;inset:0}.ambient{display:none}.sound-toggle{z-index:8;top:max(14px, env(safe-area-inset-top));color:#312b2794;letter-spacing:.1em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;min-height:34px;transition:color .16s var(--ease-out), background-color .16s var(--ease-out), transform .14s var(--ease-out);background:#f7f0e27a;border:1px solid #312b272e;border-radius:999px;padding:8px 11px;font:9px/1 ui-monospace,monospace;position:fixed;left:16px}.sound-toggle.is-on{color:#312b27c7;background:#f7f0e2ad}.sound-toggle:disabled{cursor:default;opacity:.62}.sound-toggle:active{transform:scale(.97)}.sound-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.search-toggle{z-index:8;top:max(14px, env(safe-area-inset-top));color:#312b278f;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:.46;cursor:pointer;width:34px;height:34px;transition:opacity .16s ease, color .16s ease, background-color .16s ease, transform .14s var(--ease-out);background:#f7f0e24d;border:1px solid #312b2721;border-radius:50%;place-items:center;padding:0;display:grid;position:fixed;right:16px}.search-toggle svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;width:15px;height:15px}.search-toggle:active{transform:scale(.96)}.search-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:3px;opacity:.9}@media (hover:hover) and (pointer:fine){.search-toggle:hover{color:#312b27c2;opacity:.86;background:#f7f0e280}}.deck-region{flex:auto;place-items:center;min-height:0;padding:6px 0 12px;display:grid;position:relative}.deck{perspective:1500px;width:100%;height:min(78dvh,610px);min-height:390px;position:relative}.deck-shadow{filter:blur(18px);background:#43362c47;border-radius:50%;width:min(72vw,350px);height:32px;position:absolute;bottom:3%;left:50%;transform:translate(-50%)}.card-wrap{touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:grab;will-change:transform;outline:none;width:min(82vw,390px);height:100%;position:absolute;top:0;left:50%}.card-wrap.is-top:active{cursor:grabbing}.card-wrap:focus-visible .card-face{outline-offset:4px;outline:3px solid #312b27b3}.card{width:100%;height:100%;transform-style:preserve-3d;transition:transform .28s var(--ease-in-out);position:relative}.card.is-flipped{transform:rotateY(180deg)}.card:not(.is-flipped) .card-back,.card.is-flipped .card-front{pointer-events:none}.card-wrap.is-summoned .card{animation:summon-card .28s var(--ease-out) both}@keyframes summon-card{0%{opacity:.28;transform:translateY(18vh)scale(.88)rotate(2deg)}to{opacity:1;transform:translate(0,0)scale(1)rotate(0)}}.skip-motion .card,.skip-motion.card-wrap{transition-duration:0s!important}.card-face{-webkit-backface-visibility:hidden;backface-visibility:hidden;border:1px solid #362b2229;border-radius:2px;position:absolute;inset:0;overflow:hidden;box-shadow:0 3px 2px #48372a14,0 16px 34px #48372a26}.stationery-0 .card-face{border-radius:2px}.stationery-1 .card-face{border-radius:18px 4px 14px 6px/7px 16px 6px 13px;box-shadow:0 3px 2px #48372a12,0 18px 38px #48372a29}.stationery-2 .card-face{clip-path:polygon(13px 0,calc(100% - 13px) 0,100% 13px,100% calc(100% - 13px),calc(100% - 13px) 100%,13px 100%,0 calc(100% - 13px),0 13px);border-radius:0}.stationery-3 .card-face{clip-path:polygon(0 1.2%,2% 0,7% .8%,13% 0,20% .7%,27% 0,35% .6%,43% 0,51% .8%,59% 0,67% .6%,75% 0,83% .7%,91% 0,98% .8%,100% 2%,99.2% 9%,100% 17%,99.3% 26%,100% 35%,99.2% 44%,100% 53%,99.2% 62%,100% 71%,99.3% 80%,100% 89%,98.7% 98.5%,96% 100%,89% 99.2%,81% 100%,73% 99.2%,65% 100%,57% 99.3%,49% 100%,41% 99.2%,33% 100%,25% 99.3%,17% 100%,9% 99.2%,1.5% 100%,0 97.5%,.8% 89%,0 80%,.7% 71%,0 62%,.8% 53%,0 44%,.7% 35%,0 26%,.8% 17%);border:0;border-radius:0}.stationery-4 .card-face{border-color:#362b2238;border-radius:28px 28px 6px 6px/18px 18px 5px 5px}.photo-card{background:repeating-linear-gradient(93deg,#3d2f2506 0 1px,#0000 1px 4px),#f4efe5;padding:clamp(12px,4vw,20px) clamp(12px,4vw,20px) 58px}.photo-card.frame-0{background:repeating-linear-gradient(0deg,#0000 0 5px,#51413207 5px 6px),#f5f0e7;padding:14px 14px 64px}.photo-card.frame-1{background:repeating-linear-gradient(0deg,#463b2f06 0 1px,#0000 1px 4px),repeating-linear-gradient(90deg,#463b2f06 0 1px,#0000 1px 5px),#e8e0d2;padding:22px 18px 48px}.photo-card.frame-2{background:radial-gradient(circle at 15% 18%,#b8717214 0 1px,#0000 1.5px) 0 0/19px 19px,radial-gradient(circle at 78% 66%,#62654b12 0 1px,#0000 1.5px) 0 0/23px 23px,#f7f2e8;border-color:#4b3d2d47;padding:10px 10px 70px}.photo-card.frame-3{background:radial-gradient(at 20% 10%,#ffffff5c,#0000 38%),repeating-linear-gradient(96deg,#61443b06 0 1px,#0000 1px 7px),#eadbd4;padding:20px 25px 54px}.photo-card.frame-4{background:linear-gradient(105deg,#ffffff3d,#0000 31%),repeating-linear-gradient(0deg,#44483506 0 1px,#0000 1px 8px),#e3e3d3;padding:16px 12px 52px 21px}.photo-card:after,.card-back:after{content:"";pointer-events:none;opacity:.18;mix-blend-mode:multiply;background:radial-gradient(circle at 25% 18%,#0000 0 1px,#2c231d12 1.5px,#0000 2px) 0 0/5px 5px;position:absolute;inset:0}.photo-window{background:#d5cec1;place-items:center;width:100%;height:100%;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #312b2714}.photo-window img{object-fit:contain;object-position:center;pointer-events:none;width:100%;height:100%;display:block}.photo-window.is-portrait img{object-fit:contain;object-position:center center;width:auto;max-width:100%;height:100%;max-height:100%}.photo-stack{z-index:1;isolation:isolate;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:4px 0 2px;display:flex;position:relative}.photo-stack-item{aspect-ratio:3/2;background:#f7f1e5;border:1px solid #41312524;flex:none;width:88%;padding:clamp(3px,.8vw,5px);position:relative;overflow:hidden;box-shadow:0 5px 14px #362a2233,0 1px 2px #362a2224}.photo-stack-item+.photo-stack-item{margin-top:clamp(-66px,-14vw,-44px)}.photo-stack-item-1{z-index:1;transform:rotate(-1.6deg)translate(-2%)}.photo-stack-item-2{z-index:2;transform:rotate(1.25deg)translate(2.2%)}.photo-stack-item-3{z-index:3;transform:rotate(-.55deg)translate(-.5%)}.photo-stack-item img{object-fit:contain;pointer-events:none;background:#d8d1c5;width:100%;height:100%;display:block}.photo-stack-item .photo-wash{inset:clamp(3px,.8vw,5px)}.frame-0 .photo-window{box-shadow:inset 0 0 0 1px #312b2714,0 1px 2px #312b2714}.frame-1 .photo-window{border:5px double #f7f2e8db;border-radius:8px 2px 7px 3px}.frame-2 .photo-window{box-shadow:inset 0 0 0 1px #312b2724,0 0 0 4px #f2e8d8d1}.frame-3 .photo-window{transform:rotate(-.35deg)}.frame-4 .photo-window{border:1px solid #4b4c3840;border-radius:18px 18px 3px 3px;transform:rotate(.3deg)}.photo-wash{mix-blend-mode:soft-light;pointer-events:none;position:absolute;inset:0}.wash-0{background:#ffd8b929}.wash-1{background:#a7b79326}.wash-2{background:#d9aeb629}.wash-3{background:#ffefc92e}.photo-caption{font-family:var(--hand);align-items:baseline;gap:10px;display:flex;position:absolute;bottom:13px;left:20px;right:20px}.photo-caption span{font-size:24px;line-height:1;transform:rotate(-1deg)}.frame-0 .photo-caption{bottom:17px}.frame-1 .photo-caption{font-family:var(--serif);font-style:italic;bottom:11px}.frame-1 .photo-caption span{font-size:22px}.frame-2 .photo-caption{align-items:flex-end;bottom:19px}.frame-2 .photo-caption span{font-size:27px;transform:rotate(-2deg)}.frame-3 .photo-caption{bottom:12px;left:25px;right:25px}.frame-4 .photo-caption{bottom:11px;left:21px}.tape{z-index:3;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:#e5d5b1b0;width:68px;height:20px;position:absolute;top:4px;left:50%;transform:translate(-50%)rotate(-2deg);box-shadow:inset 0 0 12px #ffffff38}.tape-1{left:20%;transform:rotate(-7deg)}.tape-2{left:auto;right:15%;transform:rotate(5deg)}.frame-0 .tape,.frame-2 .tape{display:none}.frame-1 .tape{opacity:.72;width:52px;height:18px}.frame-3 .tape{width:80px;top:7px;transform:translate(-50%)rotate(3deg)}.frame-4 .tape{background:#cdd5b294;width:58px}.card-back{background:repeating-linear-gradient(0deg,#0000 0 27px,#595c4d1a 27px 28px),#f3eddf;padding:31px 28px 42px;transform:rotateY(180deg)}.card-back.single-note{transform:none}.back-1{background-color:#eee8db}.back-2{background-color:#f1e7dd}.back-3{background-color:#ecebdc}.back-rule{background:#bd5b5b47;width:1px;position:absolute;top:0;bottom:0;left:19px}.message-scroll-shell{z-index:2;grid-template-columns:minmax(0,1fr) 11px;column-gap:12px;height:100%;min-height:0;display:grid;position:relative}.message-scroll{overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch;scrollbar-width:none;-webkit-user-select:text;user-select:text;min-width:0;height:100%;min-height:0;padding:1px 0 10px;overflow-y:scroll}.message-scroll::-webkit-scrollbar{width:0;height:0}.message-scroll-content{min-height:100%}.message-scrollbar{cursor:default;touch-action:none;background:repeating-linear-gradient(0deg,#644c380d 0 1px,#0000 1px 5px),#745b4317;border:1px solid #52403133;border-radius:999px;width:11px;height:100%;position:relative;overflow:hidden;box-shadow:inset 1px 0 #ffffff57,0 1px #fff3}.message-scrollbar.has-overflow{cursor:grab}.message-scrollbar.has-overflow:active{cursor:grabbing}.message-scrollbar-thumb{opacity:.4;will-change:transform;background:repeating-linear-gradient(135deg,#ffffff1f 0 2px,#0000 2px 5px),#4c3d317a;border:1px solid #49372a47;border-radius:999px;min-height:40px;position:absolute;top:0;left:2px;right:2px;box-shadow:0 1px 2px #4531232e,inset 1px 0 #ffffff2e}.message-scrollbar.has-overflow .message-scrollbar-thumb{opacity:.92}.dear{margin:0 0 16px;font-size:24px;font-style:italic}.message{white-space:pre-line;font-family:var(--hand);margin:0;font-size:clamp(14px,4vw,17px);line-height:1.62}.signature{text-align:right;margin:24px 0 10px;font-size:21px;font-style:italic}.controls{flex:none;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:10px;width:min(100%,410px);margin:0 auto;display:grid}.controls button{width:44px;height:44px;color:var(--ink);font:inherit;cursor:pointer;transition:transform .14s var(--ease-out), background-color .14s var(--ease-out);background:#f5f0e652;border:1px solid #312b2757;border-radius:50%;place-items:center;padding:0;font-size:20px;display:grid}.controls button:active{background:#f5f0e6a6;transform:scale(.97)}.controls button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.controls button:disabled{opacity:.34;cursor:default}.controls button:disabled:active{background:#f5f0e652;transform:none}.counter{text-align:center}.counter span{letter-spacing:.16em;font-family:ui-monospace,monospace;font-size:10px;display:block}.counter small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:3px;font-size:10px;font-style:italic;display:block;overflow:hidden}.photo-search{z-index:9;left:50%;bottom:calc(max(16px, env(safe-area-inset-bottom)) + 56px);width:min(100vw - 64px,340px);animation:reveal-photo-search .22s var(--ease-out) both;position:fixed;transform:translate(-50%)}@keyframes reveal-photo-search{0%{opacity:0;transform:translate(-50%,12px)scale(.97)}to{opacity:1;transform:translate(-50%)scale(1)}}.visually-hidden{clip:rect(0, 0, 0, 0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}.photo-search-field{-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:repeating-linear-gradient(94deg,#3d2f2505 0 1px,#0000 1px 5px),#f7f0e2db;border:1px solid #312b273d;border-radius:999px;grid-template-columns:22px minmax(0,1fr);align-items:center;min-height:42px;padding:0 13px;transition:border-color .16s,background-color .16s,box-shadow .16s;display:grid;box-shadow:0 8px 24px #43362c21,inset 0 1px #ffffff85}.photo-search:focus-within .photo-search-field{background-color:#faf6edf0;border-color:#312b277a;box-shadow:0 10px 28px #43362c2b,inset 0 1px #ffffff94}.photo-search-field>span{color:#312b2794;font:20px/1 var(--serif);transform:translateY(-1px)}.photo-search input{min-width:0;height:40px;color:var(--ink);font:15px/1 var(--serif);-webkit-appearance:none;appearance:none;background:0 0;border:0;outline:0;padding:0}.photo-search input::placeholder{color:#574c4494}.photo-search input::-webkit-search-cancel-button{opacity:.58}.photo-search-results{transform-origin:bottom;max-height:min(42vh,300px);animation:reveal-photo-results .18s var(--ease-out) both;scrollbar-color:#4c3d318c #745b4314;scrollbar-width:thin;background:repeating-linear-gradient(0deg,#0000 0 26px,#595c4d0e 26px 27px),#f6efe1f7;border:1px solid #312b2733;border-radius:16px;padding:7px;position:absolute;bottom:calc(100% + 9px);left:0;right:0;overflow-y:auto;box-shadow:0 18px 42px #372d2633,inset 0 1px #ffffff80}@keyframes reveal-photo-results{0%{opacity:0;transform:translateY(7px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.photo-search-result{width:100%;min-height:56px;color:var(--ink);text-align:left;cursor:pointer;transition:transform .14s var(--ease-out), background-color .14s ease;background:0 0;border:0;border-radius:10px;grid-template-columns:46px minmax(0,1fr);align-items:center;gap:11px;padding:5px 8px;display:grid}.photo-search-result img{object-fit:cover;border:3px solid #fffcf4e6;border-radius:3px;width:46px;height:46px;display:block;box-shadow:0 2px 6px #372d262b}.photo-search-result span{min-width:0}.photo-search-result strong,.photo-search-result small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.photo-search-result strong{font:17px/1.2 var(--hand)}.photo-search-result small{color:var(--muted);font:italic 10px/1.2 var(--serif);margin-top:3px}.photo-search-result:active{transform:scale(.985)}.photo-search-result:focus-visible{outline-offset:-2px;outline:2px solid #312b27ad}.photo-search-empty{color:var(--muted);text-align:center;margin:0;padding:16px 12px;font-size:13px;font-style:italic}@media (hover:hover) and (pointer:fine){.photo-search-result:hover{background:#ffffff6b}}@media (min-width:720px){.app-shell{padding-top:22px}.deck-region{padding-top:8px}.deck{height:min(78dvh,620px)}.card-wrap{width:min(66vw,420px)}.controls{width:440px}}@media (max-height:700px){.app-shell{padding-top:10px}.deck-region{padding-top:2px;padding-bottom:8px}.deck{height:76dvh;min-height:350px}}@media (max-width:719px){.floating-signboard{filter:drop-shadow(0 8px 12px #37464e33);width:132px;top:44px;left:auto;right:-3px}.photo-search{bottom:calc(max(14px, env(safe-area-inset-bottom)) + 54px);width:min(100vw - 64px,332px)}.app-shell.has-photo-search .deck-region{transform:translateY(-18px)scale(.93)}}@media (prefers-reduced-motion:reduce){.card-entrance{display:none}.floating-signboard{transition:opacity .16s;transform:none}.app-shell .deck-region,.app-shell .controls{transition:opacity .16s}.app-shell.has-photo-search .deck-region{transform:none}.card-wrap,.card{transition-duration:0s!important}.controls button{transition:background-color .12s var(--ease-out)}.controls button:active{transform:none}.sound-toggle{transition:background-color .12s var(--ease-out), color .12s var(--ease-out)}.sound-toggle:active{transform:none}.search-toggle{transition:opacity .12s,color .12s,background-color .12s}.search-toggle:active{transform:none}.card-wrap.is-summoned .card,.photo-search,.photo-search-results{animation:none}}
