:root{--bg:#f6f0e6;--paper:#fffdf8;--envelope:#e8d8c3;--accent:#a74f4a;--ink:#40352d;--muted:#827363;--border:#ddcbb6;font-family:var(--serif);color:var(--ink);background:var(--bg);font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:280px;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='.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%238b7b6a' opacity='.045' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button{font:inherit;font-size:15px;color:inherit;min-height:44px;border:0;cursor:pointer;background:none;touch-action:manipulation}button:disabled{cursor:default;opacity:.35}button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}h1,h2,p{margin:0}h1,h2,.recipient,.insert,.wax,.ending-mark{font-family:var(--serif);font-weight:400}h1:focus,h2:focus{outline:none}h1{font-size:clamp(32px,7vw,46px);letter-spacing:.28em;padding-left:.28em}h2{font-size:28px;line-height:1.65}p{font-size:15px;line-height:1.9}.eyebrow{display:block;font-size:11px;letter-spacing:.25em;color:var(--muted)}.primary{background:var(--accent);color:var(--paper);padding:13px 32px;min-width:172px;border-radius:3px;letter-spacing:.12em;transition:background .2s,transform .2s}.primary:hover{background:#92443f}.primary:active{transform:translateY(1px)}.text-button{padding:10px 14px;color:var(--muted)}.text-button:hover{color:var(--accent)}.cover{max-width:680px;margin:auto;min-height:100dvh;display:flex;flex-direction:column;align-items:center;text-align:center;padding:clamp(48px,9vh,94px) 24px max(24px,env(safe-area-inset-bottom));overflow:hidden}.cover-top .eyebrow{margin-bottom:20px}.intro{margin-top:17px;color:var(--muted);letter-spacing:.08em}.envelope-wrap{width:min(100%,420px);padding:57px 8px 35px;perspective:1000px;margin:18px 0}.envelope{position:relative;width:100%;aspect-ratio:1.6;background:#dfcbb0;box-shadow:0 8px 18px #66503a12;isolation:isolate;border-radius:3px}.pocket{position:absolute;inset:0;background:#e8d8c3;clip-path:polygon(0 0,50% 48%,100% 0,100% 100%,0 100%);z-index:3;border-radius:3px}.pocket:after{content:"";position:absolute;inset:0;background:#ecdecb;clip-path:polygon(0 100%,50% 44%,100% 100%)}.flap{position:absolute;inset:0;background:#d9c3a4;clip-path:polygon(0 0,100% 0,50% 57%);transform-origin:center top;z-index:4;filter:drop-shadow(0 2px 1px #4f382211)}.flap:after{content:"";position:absolute;inset:0 1px 2px;background:#eee0cd;clip-path:polygon(0 0,100% 0,50% 56%)}.insert{position:absolute;inset:7% 6%;background:var(--paper);z-index:1;display:grid;place-items:start center;padding-top:18px;font-size:18px;letter-spacing:.3em;color:var(--muted)}.wax{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%) rotate(-8deg);width:62px;height:62px;background:#a74f4a;border-radius:46% 53% 45% 51%;box-shadow:inset 0 0 0 4px #b35c55,inset 0 0 0 6px #91453f,0 2px 3px #52332420;z-index:6;color:#eed4c4;font-size:23px}.wax span{display:block;transform:rotate(8deg)}.recipient{position:absolute;bottom:20%;left:9%;font-size:16px;letter-spacing:.1em;z-index:5}.postmark{position:absolute;right:8%;bottom:13%;z-index:5;border:1px solid #a74f4a55;color:#a74f4a88;border-radius:50%;width:46px;height:46px;display:grid;place-content:center;font-size:10px;letter-spacing:.2em;transform:rotate(-16deg)}.cover-actions{display:flex;flex-direction:column;align-items:center;gap:12px;min-height:126px}.quiet{font-size:12px;color:var(--muted);letter-spacing:.1em}.cover-footer{margin-top:auto;padding-top:35px;display:flex;gap:12px;align-items:center;color:#9b8b78;font-size:10px;letter-spacing:.12em}.cover-footer span{width:25px;height:1px;background:var(--border)}.returning{color:var(--muted);font-size:14px}.opened .flap{transform:rotateX(180deg);z-index:0}.opened .wax{opacity:1}.opening .wax{animation:unseal .35s forwards}.opening .flap{animation:unfold .65s .25s forwards}.opening .insert{animation:extract .8s .8s forwards}.opening .envelope-wrap{animation:leave .4s 1.5s forwards}@keyframes unseal{to{opacity:0;transform:translate(-50%,25%) rotate(10deg) scale(.8)}}@keyframes unfold{to{transform:rotateX(180deg);z-index:0}}@keyframes extract{to{transform:translateY(-56%)}}@keyframes leave{to{opacity:0;transform:translateY(-12px)}}.reader{max-width:640px;margin:auto;padding:0 24px max(20px,env(safe-area-inset-bottom))}.reader-header{height:84px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid var(--border);font-family:var(--serif);letter-spacing:.12em}.reader-header button{justify-self:start;font-family:var(--serif);font-size:13px;padding-left:0}.reading-heading{text-align:center;padding:32px 0 24px}.reading-heading h2{font-size:25px;margin-top:6px;letter-spacing:.18em}.small-rule{display:block;width:28px;height:1px;background:var(--accent);margin:15px auto 0}.paper-card{background:var(--paper);padding:12px;box-shadow:0 3px 14px #66503a0a;border:1px solid #e8dfd3;border-radius:7px;animation:arrive .3s ease-out}.paper-trigger{display:block;width:100%;padding:0;cursor:zoom-in}.letter-media{position:relative;width:100%;min-height:180px;display:flex;align-items:center;justify-content:center;background:var(--paper)}.letter-media img{display:block;width:100%;height:auto;object-fit:contain}.blank-paper{aspect-ratio:3/4;min-height:0;background:var(--paper)}.image-hint{text-align:center;font-size:12px;color:var(--muted);margin-top:16px}.zoom-link{display:block;margin:3px auto 14px;font-size:13px;text-decoration:underline;text-underline-offset:5px}.page-nav{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding:12px 0}.page-nav span{font-size:12px;letter-spacing:.12em;color:var(--muted);font-variant-numeric:tabular-nums}.message,.ending{max-width:640px;margin:auto;min-height:100dvh;padding:0 24px max(30px,env(safe-area-inset-bottom))}.message-body{min-height:calc(100dvh - 125px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:45px 0;gap:25px;animation:arrive .45s ease-out}.message-body p{color:var(--muted)}.message-body h2{max-width:100%;text-wrap:balance}.little-seal{font-family:var(--serif);font-size:20px;width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--accent);color:var(--accent);transform:rotate(-7deg);margin-bottom:15px}.surprise-slot{width:100%;max-width:440px}.surprise-placeholder{height:180px;background:var(--paper);border:1px solid var(--border);border-radius:6px}.personal-note{white-space:pre-wrap;overflow-wrap:anywhere;text-align:left;font-family:var(--serif);font-size:18px}.ending-mark{color:var(--accent);font-size:22px;border:1px solid #a74f4a66;width:42px;height:42px;display:grid;place-items:center;margin:7px 0 20px}.ending .message-body{gap:22px}.ending h2{font-size:clamp(25px,5.8vw,32px)}.ending-actions{display:flex;flex-direction:column;gap:9px;margin-top:30px}.signature{font-size:13px}.load-status{position:absolute;inset:0;display:grid;place-content:center;font-size:13px;color:var(--muted)}audio{max-width:100%}.viewer{position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;border:0;margin:0;padding:0;background:#1b1513f7;color:#f6f0e6;overflow:hidden}.viewer[open]{display:grid;grid-template-rows:calc(64px + env(safe-area-inset-top)) minmax(0,1fr) calc(120px + env(safe-area-inset-bottom))}.viewer::backdrop{background:#1b1513}.viewer header{padding:env(safe-area-inset-top) 20px 0;display:flex;justify-content:space-between;align-items:center;font-size:13px}.viewer button{color:#f6f0e6;padding:9px 15px}.viewport{position:relative;overflow:hidden;touch-action:none;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;cursor:grab}.viewport:active{cursor:grabbing}.zoom-content{width:fit-content;max-width:calc(100% - 32px);height:fit-content;max-height:100%;will-change:transform;flex-shrink:0}.zoom-content .letter-media{width:auto;min-height:0;max-height:100%}.zoom-content .blank-paper{height:min(65dvh,700px);width:auto;aspect-ratio:3/4;max-width:calc(100vw - 32px)}.zoom-content img{width:auto;max-width:calc(100vw - 32px);max-height:calc(100dvh - 220px);height:auto;object-fit:contain}.viewer footer{padding-bottom:env(safe-area-inset-bottom);background:#1b1513}.zoom-tools{display:flex;align-items:center;justify-content:center;gap:14px}.zoom-tools output{font-size:12px;min-width:45px;text-align:center}.viewer nav{display:flex;align-items:center;justify-content:space-between;padding:0 12px}.viewer .hint{font-size:10px;color:#b9aaa0}.viewer .reset{font-size:12px}.boot{text-align:center;padding:100px 24px}@keyframes arrive{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@media(max-width:360px){.cover{padding:40px 20px 22px}.envelope-wrap{padding-top:45px;margin:12px 0}.reader,.message,.ending{padding-left:16px;padding-right:16px}.recipient{font-size:14px}.reader-header{height:68px}.reading-heading{padding-top:24px}.viewer .hint{font-size:9px}}@media(min-width:800px){.reader{max-width:600px}.paper-card{padding:18px}.cover{padding-top:70px}.envelope-wrap{margin-top:32px;margin-bottom:28px}.reader .blank-paper{aspect-ratio:3/3.5}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}.zoom-content .letter-media:not(.loaded):not(.blank-paper){width:min(320px,calc(100vw - 32px));min-height:200px}.zoom-content .load-status{white-space:nowrap}.music-button{justify-self:end;font-size:12px;letter-spacing:0}.music-status{position:fixed;bottom:12px;left:50%;transform:translate(-50%);max-width:calc(100vw - 32px);background:var(--paper);border:1px solid var(--border);padding:10px 16px;z-index:10;font-size:12px;color:var(--ink);border-radius:4px}.viewer .load-status button{color:var(--ink)}:root{--serif: "Noto Serif CJK SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", serif;--bg: #f5f2eb;--paper: #fffdf8;--ink: #342f2b;--muted: #7b7369;--accent: #773b36;--border: #d9d2c6;--grain: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='180'%20height='180'%20viewBox='0%200%20180%20180'%3e%3cfilter%20id='g'%20x='0'%20y='0'%20width='100%25'%20height='100%25'%3e%3cfeTurbulence%20type='fractalNoise'%20baseFrequency='.72'%20numOctaves='3'%20stitchTiles='stitch'/%3e%3cfeColorMatrix%20type='saturate'%20values='0'/%3e%3cfeComponentTransfer%3e%3cfeFuncA%20type='linear'%20slope='.14'/%3e%3c/feComponentTransfer%3e%3c/filter%3e%3cpath%20fill='%237c6445'%20opacity='.22'%20filter='url(%23g)'%20d='M0%200h180v180H0z'/%3e%3cg%20stroke='%238b7657'%20stroke-width='.4'%20opacity='.11'%3e%3cpath%20d='m13%2026%207-2m65%2027%202%205m43-37%207%201m-99%2099%204%202m42%2028%208-2m61-47%204%203m-103-8%204-1m76%2038%207%201m-71-67%202%204m80-9%206%202'/%3e%3c/g%3e%3c/svg%3e");font-family:var(--serif)}body{background:#e8e4dc}button,h1,h2,.recipient,.insert,.wax,.reader-header,.reader-header button,.viewer button{font-family:var(--serif)}.cover,.reader,.message,.ending{background:var(--grain),var(--bg);background-size:180px 180px}.cover{max-width:680px;min-height:100dvh;padding:48px 32px 44px;align-items:stretch;text-align:left;overflow:hidden}.cover-top{display:flex;justify-content:space-between;align-items:flex-start;gap:30px}.cover h1{padding:0;font-size:65px;line-height:1.23;letter-spacing:.03em;font-weight:400;text-shadow:none}.title-line{display:block}.cover .intro{margin:8px 0 0;writing-mode:vertical-rl;font-size:14px;line-height:1.8;letter-spacing:.12em;max-height:190px}.envelope-wrap{width:min(100%,360px);margin:10px auto 0;padding:118px 4px 38px;perspective:1000px}.envelope{background:#cebfaa;transform:rotate(-2deg);border-radius:1px;box-shadow:none}.envelope:after{content:"";position:absolute;inset:0;z-index:7;pointer-events:none;background:var(--grain);opacity:.5;border:1px solid #a9987c40}.pocket{background:linear-gradient(115deg,#e6decf,#dcd0bd)}.pocket:after{background:linear-gradient(175deg,#eee7db,#e3d9c8)}.flap{background:#bdaa8d;filter:drop-shadow(0 2px 4px #7b644724)}.flap:after{background:var(--grain),#e9dfce;inset:0 1px 2px}.insert{background:var(--grain),#fffdf8;color:#81786a;font-size:14px}.recipient{left:10%;bottom:18%;font-size:15px;letter-spacing:.03em;color:#50473b}.wax{width:53px;height:51px;font-size:20px;color:#c69b87;border-radius:46% 50% 43% 51%;background:radial-gradient(ellipse at 30% 20%,#aa6a57,#793c35 80%);box-shadow:inset 1px 1px 1px #d6977b80,inset 0 0 0 3px #914d40,inset 0 0 0 4px #6e352e,0 3px 7px #50372b24}.wax span{font-size:20px}.cover-actions{align-items:stretch;width:100%;min-height:0;gap:14px}.primary{align-self:flex-start;min-width:150px;padding:12px 0;background:transparent;color:var(--ink);border:0;border-bottom:1px solid #8c7760;border-radius:0;box-shadow:none;text-shadow:none;font-size:17px;letter-spacing:.06em;text-align:left}.primary:after{content:"";float:right;width:9px;height:9px;border-top:1px solid var(--accent);border-right:1px solid var(--accent);margin:6px 2px 0 32px}.primary:hover{background:transparent;color:var(--accent)}.cover .quiet{text-align:left;font-size:12px;color:var(--muted);letter-spacing:0}.cover-actions .text-button{align-self:flex-start;padding-left:0;font-size:13px}.reader,.message,.ending{min-height:100dvh}.reader-header{border-color:var(--border);font-size:14px;letter-spacing:.04em}.reading-heading{text-align:left;padding:29px 0 23px}.reading-heading h2{font-size:27px;letter-spacing:.03em}.small-rule{margin:13px 0 0;width:20px;background:#9c8065}.paper-card{border-radius:1px;padding:10px;border-color:#d8cebf;box-shadow:none;filter:drop-shadow(0 5px 12px #6e5e4614);background:#fffdf8}.blank-paper{background:var(--grain),var(--paper)}.image-hint{font-size:12px}.page-nav{border-color:var(--border)}.message-body{align-items:flex-start;text-align:left;gap:27px}.message-body h2,.ending h2{font-size:30px;font-weight:400}.message-body .primary{margin-top:10px}.message-body .text-button{padding-left:0}.ending-actions{align-items:flex-start;width:100%}.surprise-placeholder{border-radius:1px;background:#fffdf8}@media(max-width:360px){.cover{padding:36px 26px}.cover h1{font-size:57px}.cover .intro{font-size:13px}.envelope-wrap{padding-top:106px;padding-bottom:30px;margin-top:8px}.recipient{font-size:13px}.wax{width:48px;height:47px}}@media(min-width:800px){.cover{max-width:1000px;min-height:calc(100dvh - 64px);margin:32px auto;padding:64px;display:grid;grid-template-columns:220px minmax(0,1fr);column-gap:64px;align-content:center}.cover-top{grid-column:1;grid-row:1}.cover h1{font-size:78px}.cover .intro{margin-top:5px}.envelope-wrap{grid-column:2;grid-row:1 / 3;width:100%;max-width:430px;padding-top:160px;padding-bottom:45px;align-self:center}.cover-actions{grid-column:1;grid-row:2;margin-top:44px}}@media(min-width:800px){.cover-top{display:block}.cover .intro{writing-mode:horizontal-tb;margin-top:24px;max-height:none;max-width:220px;line-height:1.9;letter-spacing:.03em}}.cover.opened .envelope-wrap{padding-top:145px}@media(prefers-reduced-motion:no-preference){.entering .cover-top{animation:cover-title-enter .85s cubic-bezier(.2,.65,.3,1) both}.entering .envelope-wrap{animation:cover-envelope-enter 1.05s .12s cubic-bezier(.2,.65,.3,1) both}.entering .cover-actions{animation:cover-actions-enter .7s .35s ease-out both}}@keyframes cover-title-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes cover-envelope-enter{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}@keyframes cover-actions-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.cover{position:relative;isolation:isolate}.cover>.cover-top,.cover>.envelope-wrap,.cover>.cover-actions{position:relative;z-index:1}.falling-leaves{position:fixed;inset:0;overflow:hidden;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:3}.leaf-track{position:absolute;top:-48px;height:calc(100% + 96px);width:23px;pointer-events:none}.leaf-track img{display:block;width:23px;height:34px;opacity:.24;pointer-events:none}.leaf-track:nth-child(1){left:7%;--fall-duration: 19s;--fall-delay: -4s}.leaf-track:nth-child(2){left:85%;--fall-duration: 24s;--fall-delay: -13s}.leaf-track:nth-child(3){left:59%;--fall-duration: 27s;--fall-delay: -21s}.leaf-track:nth-child(2) img{width:18px;height:27px;opacity:.2;animation-delay:-2s}.leaf-track:nth-child(3) img{width:15px;height:23px;opacity:.16;animation-delay:-4s}@media(prefers-reduced-motion:no-preference){.leaf-track{animation:leaf-fall var(--fall-duration) var(--fall-delay) linear infinite}.leaf-track img{animation:leaf-sway 6s ease-in-out infinite alternate}}@keyframes leaf-fall{0%{transform:translateY(0);opacity:0}8%,85%{opacity:1}to{transform:translateY(100%);opacity:0}}@keyframes leaf-sway{0%{transform:translate(-9px) rotate(-35deg)}to{transform:translate(16px) rotate(45deg)}}@media(prefers-reduced-motion:reduce){.falling-leaves{display:none}}.viewer>.falling-leaves{opacity:.65}.envelope-wrap:before{content:"";position:absolute;left:8%;right:4%;bottom:24px;height:48px;background:#6f5942;opacity:.18;filter:blur(18px);transform:rotate(-2deg);z-index:-1;pointer-events:none}.viewer{background:#f5f2eb14;color:var(--ink)}.viewer::backdrop{background:#7e73626b;-webkit-backdrop-filter:blur(28px);backdrop-filter:blur(28px)}.viewer button{color:var(--ink)}.viewer footer{background:#f5f2eb47}.viewer .hint{color:#776b5e}.envelope-wrap:before{left:3%;right:0;bottom:16px;height:68px;background:#66503b;opacity:.32;filter:blur(16px)}.viewer .zoom-content{filter:drop-shadow(0 14px 28px rgba(62,47,31,.24))}@media(prefers-reduced-motion:no-preference){.viewer[open]:not(.closing){animation:viewer-fade-in .28s ease-out both}.viewer[open]:not(.closing) .viewport{animation:viewer-paper-in .38s cubic-bezier(.2,.65,.3,1) both}.viewer[open]::backdrop{animation:viewer-fade-in .28s ease-out both}.viewer.closing{animation:viewer-fade-out .22s ease-in both}.viewer.closing .viewport{animation:viewer-paper-out .22s ease-in both}.viewer.closing::backdrop{animation:viewer-fade-out .22s ease-in both}}@keyframes viewer-fade-in{0%{opacity:0}to{opacity:1}}@keyframes viewer-fade-out{0%{opacity:1}to{opacity:0}}@keyframes viewer-paper-in{0%{opacity:0;transform:translateY(14px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes viewer-paper-out{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(8px) scale(.96)}}.cover>.cover-music{position:absolute;right:24px;top:12px;z-index:4}:root{--bg:#f8efdf;--paper:#fffaf0;--ink:#633d32;--accent:#93433d;--muted:#8a6a56;--border:#d9bca0}body{background-color:#e7d5c2;background-image:var(--grain),linear-gradient(#af6f4820 1px,transparent 1px),linear-gradient(90deg,#af6f4820 1px,transparent 1px);background-size:180px 180px,32px 32px,32px 32px}.cover,.reader,.message,.ending{background-color:var(--bg);background-image:var(--grain);border-left:1px solid #e5d1b8;border-right:1px solid #e5d1b8}.cover{display:flex;max-width:720px;min-height:100dvh;margin:0 auto;padding:70px 30px 45px;align-items:center;text-align:center}.cover-top{display:block;position:relative;width:100%}.cover h1{display:inline-block;font-size:43px;line-height:1.4;letter-spacing:.12em;padding:12px 19px 12px 24px;border:2px solid var(--accent);outline:1px dashed #a8614f;outline-offset:6px;color:#873f37;background:var(--grain),#fff6e7;transform:rotate(-3deg)}.title-line{display:inline}.cover .intro{writing-mode:horizontal-tb;max-height:none;max-width:none;margin:27px 0 0;font-size:14px;letter-spacing:.03em;line-height:1.8}.heart-doodle{width:130px;height:41px;display:block;color:#a6534b;margin:12px auto 0}.sticker{position:absolute;pointer-events:none;-webkit-user-select:none;user-select:none;overflow:visible;filter:drop-shadow(0 3px 2px #603a2920)}.envelope-wrap{width:min(100%,450px);padding:146px 8px 54px;margin:8px auto 0}.cover.opened .envelope-wrap{padding-top:174px}.sticker-puppy{width:175px;height:auto;left:-17px;top:0;z-index:8;transform:rotate(-8deg)}.sticker-bouquet{width:112px;right:-15px;bottom:6px;z-index:8;transform:rotate(11deg)}.envelope{background:#c69d79;border-radius:2px;transform:rotate(-3deg);outline:1px solid #9b604750}.envelope:after{border:1px solid #a268474f;opacity:.62}.pocket{background:linear-gradient(115deg,#ebd3ae,#e7cca4)}.pocket:after{background:linear-gradient(175deg,#f6e5c7,#eed7b2)}.flap{background:#b78f66}.flap:after{background:var(--grain),#f4e0bd}.insert{background:var(--grain),#fff9eb;color:#986b4d}.recipient{font-size:16px;bottom:20%;left:9%;color:#794c38;background:#fcf0d6b3;border-bottom:1px dashed #ba8f6b;padding:3px 7px}.wax{background:radial-gradient(ellipse at 30% 20%,#bc6859,#883a36 80%);color:#f4d6b5}.wax span{font-size:26px}.cover-actions{align-items:center;gap:13px;margin-top:0;position:relative}.primary{align-self:center;min-width:185px;padding:12px 26px;border:1px dashed #af6a56;outline:4px solid #f9e7cb;outline-offset:0;border-radius:2px;color:#783d32;background:var(--grain),#efdbb7;font-size:16px;text-align:center;letter-spacing:.09em;transform:rotate(-1deg)}.primary:after{content:none}.primary:hover{background-color:#e9cf9f;color:#77382f}.cover .quiet{text-align:center;font-size:12px}.cover-actions .text-button{align-self:center;padding-left:14px}.cover .returning{font-size:14px}.cover>.cover-music{top:14px;right:22px;color:#89463b}.cover-bottom-note{margin-top:28px;height:18px;width:95px;position:relative}.washi{position:absolute;height:26px;width:110px;pointer-events:none;opacity:.7;z-index:4;background-color:#e8bf9d;background-image:linear-gradient(90deg,transparent 50%,#984b4170 50%),linear-gradient(transparent 50%,#984b4170 50%);background-size:18px 18px;clip-path:polygon(4% 0,98% 2%,96% 25%,100% 48%,96% 75%,99% 100%,2% 98%,4% 72%,0 45%,4% 20%)}.cover-bottom-note .washi{left:0;top:0;width:95px;height:20px;transform:rotate(-4deg)}.reader,.message,.ending{max-width:680px}.reader-header{color:#85483a;border-bottom:1px dashed #cba483}.reading-heading{position:relative;text-align:center;padding:29px 0 38px}.reading-heading h2{display:inline-block;background:#f0dfc0;padding:5px 22px;font-size:24px;transform:rotate(-2deg)}.small-rule{display:none}.paper-card{position:relative;isolation:isolate;border:1px solid #dabd96;padding:13px;background:var(--grain),#fff8e9;filter:drop-shadow(0 7px 10px #6e4e3520);transform:rotate(-.5deg)}.paper-card:before,.paper-card:after{content:"";position:absolute;width:84px;height:25px;top:-12px;z-index:2;opacity:.63;pointer-events:none;background:repeating-linear-gradient(135deg,#a75c4d 0 8px,#efddc2 8px 17px);clip-path:polygon(4% 0,99% 0,96% 50%,100% 100%,2% 100%,5% 50%)}.paper-card:before{left:11px;transform:rotate(-17deg)}.paper-card:after{right:9px;transform:rotate(15deg)}.paper-trigger{background:#fffdf8}.page-nav{border-top:1px dashed #cba483}.message-body{position:relative;align-items:center;text-align:center;padding-top:80px;padding-bottom:200px}.message-body h2{font-size:29px;color:#8b443b}.message-body .text-button{padding-left:14px}.message-body .heart-doodle{width:160px;margin:0 auto}.sticker-companions{width:190px;bottom:35px;left:50%;transform:translate(-50%) rotate(-4deg)}.sticker-home{width:270px;bottom:3px;left:50%;transform:translate(-50%) rotate(-2deg)}.ending .message-body{padding-bottom:255px}.ending-actions{align-items:center}.surprise-placeholder{background:var(--grain),#fff9ec;border:1px dashed #cba483}.viewer{background:#f8efdf14}.viewer::backdrop{background:#87685459}@media(max-width:360px){.cover{padding:62px 23px 38px}.cover h1{font-size:35px;padding-left:20px;padding-right:15px}.cover .intro{font-size:13px}.envelope-wrap{padding-top:132px;padding-bottom:49px}.cover.opened .envelope-wrap{padding-top:155px}.sticker-puppy{width:148px;left:-11px}.sticker-bouquet{width:92px;right:-9px;bottom:6px}.recipient{font-size:13px}}@media(min-width:800px){.cover{margin:30px auto;min-height:calc(100dvh - 60px);padding-top:65px}.cover h1{font-size:50px}.cover .intro{max-width:none;margin-top:27px}.envelope-wrap{max-width:450px}}.reader-header .music-button{justify-self:end;min-width:44px;padding:10px}.wax,.opened .wax{opacity:1;background-color:#883a36}.sticker{height:auto}