@import "https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500&display=swap";*{box-sizing:border-box}html,body,#root{scrollbar-width:none;min-height:100%}html::-webkit-scrollbar{width:0;height:0;display:none}body::-webkit-scrollbar{width:0;height:0;display:none}#root::-webkit-scrollbar{width:0;height:0;display:none}::-webkit-scrollbar{width:0;height:0;display:none}:root{color:#302e2a;font-synthesis:none;background:#f2eee5;font-family:Noto Serif SC,Songti SC,serif}body{background:radial-gradient(circle at 50% 20%,#faf8f2 0,#f2eee5 48%,#e9e2d6 100%);min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}button,a{font:inherit}.home{grid-template-columns:minmax(0,1fr) minmax(320px,520px);align-items:center;gap:clamp(54px,8vw,120px);width:min(1180px,100% - 48px);min-height:100vh;margin:auto;display:grid}.home-copy{flex-direction:column;align-items:flex-start;display:flex}.home-eyebrow{color:#918777;letter-spacing:.24em;margin-bottom:28px;font:11px/1.4 Georgia,serif}.home h1{letter-spacing:.09em;margin:0;font-size:clamp(38px,5.3vw,72px);font-weight:400;line-height:1.42}.home-copy p{color:#766f65;letter-spacing:.08em;max-width:430px;margin:28px 0 42px;font-size:14px;line-height:2}.home button{color:inherit;cursor:pointer;letter-spacing:.22em;background:0 0;border:0;border-bottom:1px solid #777066;align-items:center;gap:22px;padding:10px 2px;display:flex}.home-visual{height:min(62vh,560px);min-height:440px;position:relative}.home-paper{background:#fffdf8;width:70%;height:76%;padding:38px;position:absolute;top:3%;left:14%;transform:rotate(2.5deg);box-shadow:0 24px 55px #4c3b2424}.home-paper span{color:#9a9081;letter-spacing:.18em;font:10px/1 Georgia,serif}.home-paper i{background:#e1dbd1;width:72%;height:1px;margin-top:32px;display:block}.home-paper i:nth-of-type(2){width:86%}.home-paper i:nth-of-type(3){width:56%}.home-envelope{background:#e8dac3;width:88%;height:48%;position:absolute;bottom:4%;right:2%;overflow:hidden;transform:rotate(-2deg);box-shadow:0 22px 42px #4c3b2429}.home-envelope-flap{z-index:3;clip-path:polygon(0 0,100% 0,50% 70%);background:linear-gradient(160deg,#eadcc5,#ddc9a9);position:absolute;inset:0}.home-envelope-front{z-index:4;clip-path:polygon(0 14%,50% 72%,100% 14%,100% 100%,0 100%);background:linear-gradient(90deg,#decdb1 0 50%,#e6d6bd 50%);position:absolute;inset:0}.home-envelope>span{z-index:5;letter-spacing:.2em;font:12px/1 Georgia,serif;position:absolute;bottom:22px;right:28px}.home-postmark{z-index:6;color:#aa7567;text-align:center;letter-spacing:.14em;border:1px solid #aa7567;border-radius:50%;place-content:center;width:68px;height:68px;font:10px/1.35 Georgia,serif;display:grid;position:absolute;bottom:70px;right:50%;transform:translate(85%)}.home button i{font-style:normal;transition:transform .25s}.home button:hover i{transform:translate(6px)}.letters-page{min-height:100dvh;padding:36px clamp(20px,6vw,90px)}.letters-page>header{letter-spacing:.18em;align-items:center;gap:24px;max-width:1180px;margin:0 auto 70px;display:flex}.letters-page>header a{color:inherit;font-size:22px;text-decoration:none}.envelopes{grid-template-columns:repeat(auto-fill,minmax(300px,380px));justify-content:center;gap:54px 42px;max-width:1220px;margin:auto;display:grid}.empty{text-align:center;color:#8c8579;letter-spacing:.12em;grid-column:1/-1;margin-top:20vh}.envelope-scene{width:100%;max-width:380px;height:235px;position:relative}.envelope-scene:not(.is-active){overflow:clip}.envelope-scene.is-active{z-index:2147483647!important}.envelope-scene.is-disabled{pointer-events:none}.envelope-shell{cursor:pointer;perspective:1200px;width:100%;height:220px;transform-style:preserve-3d;filter:drop-shadow(0 14px 16px #473a271f);background:0 0;border:0;padding:0;position:absolute;inset:0}.envelope-back{background:linear-gradient(145deg,#eee4d2 0%,#e4d5bd 100%);border:1px solid #d2c5b1;position:absolute;inset:0;overflow:hidden;box-shadow:inset 0 1px #ffffffa6,inset 0 -12px 22px #82674414}.postal{z-index:100;letter-spacing:.17em;color:#0006;font:500 18px/1 Georgia,serif;position:absolute;bottom:5px;left:10px}.postmark{z-index:99;color:#9d705f;letter-spacing:.15em;border:1px solid #9d705f;border-radius:50%;place-content:center;width:58px;height:58px;font:10px/1.25 Georgia,serif;display:grid;position:absolute;bottom:10px;right:50%;transform:translate(50%)}.flap{z-index:5;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;filter:drop-shadow(0 5px 4px #6c543424);background:linear-gradient(165deg,#eadcc5 0%,#dfceb2 100%);width:calc(100% + 4px);height:64%;margin-left:-2px;transition:transform .28s,filter .28s;position:absolute;top:0;left:0}@media (hover:hover) and (pointer:fine){.envelope-scene:not(.is-active):not(.is-disabled):hover .flap{filter:drop-shadow(0 8px 6px #6c543433);transform:scaleY(.88)}}.envelope-front{z-index:4;clip-path:polygon(0 3%,7% 7%,18% 18%,31% 34%,50% 59%,69% 34%,82% 18%,93% 7%,100% 3%,100% 100%,0 100%);filter:drop-shadow(0 -2px 2px #6850301a);pointer-events:none;background:linear-gradient(135deg,#ffffff2e 0 49.7%,#0000 50%) 0/50% 100% no-repeat,linear-gradient(225deg,#ffffff1f 0 49.7%,#0000 50%) 100%/50% 100% no-repeat,linear-gradient(90deg,#ddccb0 0 50%,#e5d5bc 50% 100%);position:absolute;inset:0}.paper-slot{z-index:3;clip-path:inset(-200vh 0 0);pointer-events:none;position:absolute;inset:12px 14px 10px;overflow:visible}.letter-paper{z-index:3;visibility:visible;opacity:1;color:#34312d;cursor:default;text-align:left;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;pointer-events:auto;background:#fffdf8;width:100%;height:auto;min-height:300px;max-height:calc(100dvh - 180px);padding:0 clamp(14px,2vw,25px) 100px;position:absolute;top:0;left:0;overflow:hidden auto;box-shadow:0 20px 55px #31271a33}.letter-paper::-webkit-scrollbar{display:none}.paper-header{z-index:10;background:#fffdf8;justify-content:space-between;align-items:center;gap:16px;padding:24px 0 18px;display:flex;position:sticky;top:0}.paper-number{color:#8b8174;letter-spacing:.16em;order:1;margin:0;font:12px/1 Georgia,serif}.paper-content{overflow-wrap:anywhere;letter-spacing:.045em;line-height:1.75}.paper-content p{white-space:pre-wrap;text-indent:2em;margin:0}.paper-content p:first-child{text-indent:0}.letter-paper time{color:#8b8174;text-align:right;letter-spacing:.12em;margin-top:32px;font:12px/1.4 Georgia,serif;display:block}.close{color:#8b8174;cursor:pointer;background:0 0;border:0;order:2;font:25px/1 sans-serif;position:static}@media (width<=600px){.home{grid-template-columns:1fr;align-content:center;gap:42px;width:min(100% - 40px,460px);padding:54px 0}.home-copy{text-align:center;align-items:center}.home h1{font-size:clamp(34px,11vw,48px)}.home-copy p{margin:22px 0 30px}.home-visual{width:82%;height:280px;min-height:280px;margin:auto}.letters-page{padding-top:24px}.letters-page>header{margin-bottom:46px}.envelopes{grid-template-columns:minmax(0,360px);gap:34px}.letter-paper{min-height:280px;max-height:calc(100dvh - 180px);padding:0 24px 100px}.paper-header{padding:24px 0 16px}.envelope-scene{height:215px}.envelope-shell{height:200px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}