:root{--ink:#3f342b;--ink-soft:#80715f;--letter-ink:#5b4a3b;--line:#d8c7ab;--accent:#c2693a;--polaroid:#fffdf8;--frame-bg:#e9e0d0;--shadow:0 18px 40px #3f342b33;--font-display:"Fraunces", Georgia, serif;--font-hand:"Caveat", cursive;--font-body:"Hanken Grotesk", system-ui, sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}#root{width:100%}body{font-family:var(--font-body);color:var(--ink);background:radial-gradient(1200px 720px at 82% -12%,#faf3e6 0%,#faf3e600 58%),radial-gradient(900px 620px at -12% 112%,#efe1c9 0%,#efe1c900 55%),#f4ece0;margin:0;line-height:1.6;overflow-x:hidden}.grain{z-index:9999;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.vignette{z-index:9998;pointer-events:none;position:fixed;inset:0;box-shadow:inset 0 0 240px #3f342b29}.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 22px}header.hero{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:100svh;padding:72px 22px 56px;display:flex;position:relative}.eyebrow{font-family:var(--font-hand);color:var(--accent);letter-spacing:.5px;white-space:nowrap;margin-bottom:2px;font-size:clamp(1.5rem,3.4vw,2.1rem);display:block;transform:rotate(-3deg)}.hero h1{font-family:var(--font-display);letter-spacing:-.02em;text-wrap:balance;max-width:14ch;margin:.08em 0 .22em;font-size:clamp(2.9rem,9vw,6rem);font-weight:500;line-height:.98}.hero h1 em{color:var(--accent);font-style:italic}.hero .sub{max-width:540px;color:var(--ink-soft);text-wrap:pretty;margin:6px auto 34px;font-size:clamp(1rem,2.2vw,1.16rem)}.hero-polaroid{display:inline-block}.scrolltip{font-family:var(--font-hand);color:var(--ink-soft);flex-direction:column;align-items:center;gap:4px;margin-top:40px;font-size:1.3rem;text-decoration:none;display:flex}.scrolltip .arrow{border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);width:20px;height:20px;animation:1.8s ease-in-out infinite nv-bob;transform:rotate(45deg)}@keyframes nv-bob{0%,to{transform:rotate(45deg)translate(0)}50%{transform:rotate(45deg)translate(4px,4px)}}.polaroid{background:var(--polaroid);border-radius:2px;margin:0;display:block;position:relative}.polaroid .frame{width:100%;aspect-ratio:var(--ar,3 / 4);background:var(--frame-bg);border-radius:1px;position:relative;overflow:hidden}.polaroid .photo{object-fit:cover;filter:saturate(1.03)contrast(1.02);width:100%;height:100%;display:block}.polaroid .placeholder{color:#b6a489;text-align:center;font-family:var(--font-hand);background:repeating-linear-gradient(45deg,#efe6d6,#efe6d6 12px,#eae0cd 12px 24px);justify-content:center;align-items:center;padding:16px;font-size:1.1rem;display:none;position:absolute;inset:0}.polaroid.missing .photo{display:none}.polaroid.missing .placeholder{display:flex}.polaroid figcaption{text-align:center;font-family:var(--font-hand);color:#5a4a3c;position:absolute;bottom:13px;left:0;right:0}.polaroid--hero{width:min(280px,72vw);padding:13px 13px 50px;transition:transform .5s cubic-bezier(.2,.8,.2,1);transform:rotate(-3.5deg);box-shadow:0 18px 42px #3f342b38}.polaroid--hero:hover{transform:rotate(-1deg)scale(1.02)}.polaroid--hero figcaption{font-size:1.5rem}.polaroid--g{transform:rotate(var(--rot,0deg));padding:12px 12px 46px;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;box-shadow:0 14px 34px #3f342b2e}.polaroid--g:hover{transform:rotate(0)scale(1.03);box-shadow:0 26px 50px #3f342b47}.polaroid--g figcaption{font-size:1.45rem}.sec-title{text-align:center;margin:0 0 8px}.sec-title .kicker{font-family:var(--font-hand);color:var(--accent);font-size:1.5rem;display:block;transform:rotate(-2deg)}.sec-title h2{font-family:var(--font-display);letter-spacing:-.01em;margin:.1em 0 0;font-size:clamp(2rem,5vw,3.2rem);font-weight:500}.sec-sub{color:var(--ink-soft);max-width:520px;margin:10px auto 0}section.letter{padding:88px 0 80px}.letter-scene{text-align:center;margin-top:34px}.envelope{cursor:pointer;perspective:1200px;-webkit-tap-highlight-color:transparent;background:0 0;border:none;width:340px;max-width:86vw;height:226px;margin:0 auto;padding:0;position:relative}.env-base{box-shadow:var(--shadow), inset 0 -3px 8px #0000000f;background:linear-gradient(160deg,#ead9bb,#ddc7a0);border-radius:12px;position:absolute;inset:0}.env-front{z-index:4;clip-path:polygon(0 100%,100% 100%,50% 36%);background:linear-gradient(160deg,#e7d3b1,#d7c096);border-radius:12px;position:absolute;inset:0;box-shadow:inset 0 6px 14px #0000000d}.env-side{z-index:3;clip-path:polygon(0 0,0 100%,50% 50%);background:linear-gradient(160deg,#e3cfac,#d3bc92);border-radius:12px;position:absolute;inset:0}.env-side.r{clip-path:polygon(100% 0,100% 100%,50% 50%)}.env-flap{z-index:6;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;backface-visibility:hidden;background:linear-gradient(160deg,#efdcbc,#e2cda4);height:130px;transition:transform .8s cubic-bezier(.6,.05,.2,1),z-index 0s .4s;position:absolute;top:0;left:0;right:0;transform:rotateX(0);box-shadow:0 2px 4px #0000000a}.is-open .env-flap{z-index:1;transform:rotateX(178deg)}.env-seal{z-index:7;color:#fff6ec;width:48px;height:48px;font-family:var(--font-hand);background:radial-gradient(circle at 35% 30%,#d4854f,#b35e2c);border-radius:50%;place-items:center;font-size:1.7rem;font-weight:700;transition:opacity .35s,transform .35s;display:grid;position:absolute;top:90px;left:50%;transform:translate(-50%,-50%)scale(1);box-shadow:0 5px 12px #00000047}.is-open .env-seal{opacity:0;transform:translate(-50%,-50%)scale(.6)}.env-tip{font-family:var(--font-hand);color:var(--ink-soft);margin-top:18px;font-size:1.35rem;transition:opacity .3s;animation:2.2s ease-in-out infinite nv-pulse;display:block}@keyframes nv-pulse{0%,to{opacity:.5}50%{opacity:1}}.is-open .env-tip{opacity:0;pointer-events:none}.paper{text-align:left;opacity:0;max-width:660px;max-height:0;margin:0 auto;transition:max-height 1.1s,opacity .9s .15s,transform .9s .15s,margin-top .9s;overflow:hidden;transform:translateY(16px)}.is-open .paper{opacity:1;max-height:2600px;margin-top:36px;transform:none}.paper-inner{box-shadow:var(--shadow);background:linear-gradient(#0000 27px,#b48b4f1a 28px) 0 0/100% 28px,linear-gradient(#fffdf6,#fbf4e6);border:1px solid #e6d6b8;border-radius:6px;padding:clamp(26px,5vw,52px);position:relative;transform:rotate(-.4deg)}.paper .hi{font-family:var(--font-hand);color:var(--accent);margin:8px 0 10px;font-size:clamp(2rem,5vw,2.6rem)}.paper p{font-family:var(--font-display);color:var(--letter-ink);margin:0 0 1.05em;font-size:clamp(1.02rem,2.2vw,1.16rem)}.paper p strong{color:var(--accent);font-weight:600}.paper .sign{font-family:var(--font-hand);color:var(--ink);margin-top:6px;font-size:clamp(1.7rem,4vw,2.2rem);line-height:1.15}.paper .sign small{font-family:var(--font-display);color:var(--ink-soft);margin-top:10px;font-size:1rem;font-style:italic;display:block}section.gallery{padding:30px 0 90px}.grid{column-width:248px;column-gap:24px;margin-top:42px}.g-item{break-inside:avoid;margin:0 0 24px}footer{text-align:center;border-top:1px solid var(--line);background:linear-gradient(#e7d8bf00,#e1d1b68c);padding:70px 22px 84px}.candle{width:60px;margin:0 auto 8px;position:relative}.flame{transform-origin:50% 90%;background:radial-gradient(circle at 50% 75%,#fff3b0 0%,#ffce54 35%,#ff8a2a 70%,#ff8a2a00 100%);border-radius:50% 50% 45% 45%;width:16px;height:26px;margin:0 auto;animation:1.6s ease-in-out infinite nv-flicker;box-shadow:0 -6px 26px #ffaa3c8c}@keyframes nv-flicker{0%,to{opacity:1;transform:scale(1)rotate(-1deg)}25%{transform:scale(1.08,.92)rotate(2deg)}50%{opacity:.92;transform:scale(.92,1.08)rotate(-2deg)}75%{transform:scale(1.05,.96)rotate(1deg)}}.wick{background:#5a4a3c;width:3px;height:7px;margin:0 auto}.candle-body{background:linear-gradient(90deg,#f0e3c8,#fbf3df 40%,#e6d6b6);border-radius:6px 6px 4px 4px;width:34px;height:54px;margin:0 auto;box-shadow:inset -4px 0 8px #00000014}footer .ftxt{font-family:var(--font-hand);color:var(--accent);margin-top:14px;font-size:1.5rem}footer .sig{color:var(--ink-soft);margin-top:6px;font-size:.95rem}footer .dom{font-family:var(--font-display);color:var(--ink);letter-spacing:.04em;margin-top:18px;font-style:italic}.reveal{opacity:0;transition:opacity .9s,transform .9s;transform:translateY(24px)}.reveal.in{opacity:1;transform:none}@media (prefers-reduced-motion:reduce){*{animation:none!important}.reveal{opacity:1;transform:none}}