.intro-stage{--mono-say:10.5px;--ink-say:#1b1c209e;--vermilion-ink:#c63400;background-color:var(--bg)}.letter-article{--sentence:.55rem;--para:2.4rem;max-width:33rem;margin:0 auto;padding-top:clamp(2.6rem,8vw,5.5rem)}.letter-salutation{margin:0 0 var(--para);font-size:clamp(1.2rem,1.06rem + .7vw,1.44rem)}.letter-line{letter-spacing:-.004em;color:#1b1c20db;text-wrap:pretty;margin:0;font-size:clamp(1.06rem,.99rem + .34vw,1.2rem);line-height:1.68}.letter-p>p+p{margin-top:var(--sentence)}.letter-p+.letter-p{margin-top:var(--para)}.letter-turn{letter-spacing:-.014em;color:#1b1c20f2;text-wrap:pretty;margin:0;font-size:clamp(1.32rem,1.06rem + 1.15vw,1.76rem);font-weight:600;line-height:1.32}.letter-signoff{margin-top:var(--para)}.letter-close{border-top:1px solid #1b1c2026;max-width:33rem;margin:5rem auto 0;padding-top:1.6rem}.letter-close p{color:#1b1c20c7;margin:0 0 1.5rem;font-size:clamp(.94rem,.9rem + .2vw,1.02rem);line-height:1.6}.letter-shelf{color:#1b1c20eb;min-height:44px;box-shadow:inset 0 -2px 0 var(--accent-deep);align-items:center;gap:.55rem;padding:0 .15rem;font-size:1.02rem;line-height:1.2;text-decoration:none;transition:box-shadow .35s cubic-bezier(.3,1.14,.4,1);display:inline-flex}.letter-shelf:hover,.letter-shelf:focus-visible{box-shadow:inset 0 -.34em 0 var(--accent-deep)}.letter-shelf:focus-visible{outline-offset:6px;outline:2px solid #1b1c20bf}.letter-shelf span{font-size:var(--mono-say);color:var(--ink-say)}.envelope{margin:0 0 1.9rem;position:relative}.envelope-body{transform-origin:50% 60%;background:#ffffff57;border:1px solid #1b1c207a;border-radius:10px;flex-direction:column;gap:.5rem;padding:3rem .85rem .85rem;animation:8.4s cubic-bezier(.37,0,.63,1) infinite envelope-breath,11.9s cubic-bezier(.37,0,.63,1) infinite envelope-glow;display:flex;position:relative;overflow:hidden}@media (min-width:640px){.envelope-body{flex-direction:row;align-items:center}}.envelope[data-live="0"] .envelope-body{animation-play-state:paused}.envelope-flap{pointer-events:none;color:#1b1c2057;height:3.1rem;transition:transform .42s cubic-bezier(.3,1.14,.4,1),color .42s ease-out;display:block;position:absolute;top:0;left:0;right:0}@keyframes envelope-breath{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-1.6px)scale(1.006)}}@keyframes envelope-glow{0%,to{border-color:#1b1c207a}50%{border-color:#1b1c2094}}.envelope-field{min-width:0;min-height:44px;color:var(--ink);background:0 0;border:0;flex:auto;padding:0 .15rem;font-size:.95rem;line-height:1.5}.envelope-field::placeholder{color:#1b1c209e}.envelope-field:focus{outline:none}.envelope-body:focus-within{outline:2px solid var(--ink);outline-offset:3px;border-color:#1b1c20db;transition:border-color .22s ease-out;animation-name:envelope-breath}.envelope-body:focus-within .envelope-flap{color:#1b1c2066;transform:translateY(-2px)scaleY(1.06)}.envelope-send{color:#1b1c20db;min-width:7.5rem;min-height:44px;font-size:var(--mono-say);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;box-shadow:inset 0 -2px 0 var(--accent-deep);background:0 0;border:0;flex:none;justify-content:center;align-self:flex-start;align-items:center;padding:0 1.15rem;transition:box-shadow .32s cubic-bezier(.3,1.14,.4,1),transform .32s cubic-bezier(.3,1.14,.4,1);display:inline-flex}@media (min-width:640px){.envelope-send{align-self:center}}.envelope-send:hover{box-shadow:inset 0 -.72em 0 var(--accent-deep)}.envelope-send:active{transform:translateY(1px)}.envelope-send:focus-visible{outline-offset:3px;outline:2px solid #1b1c20bf}.envelope-send[disabled]{cursor:progress}.envelope-working{animation:1.25s ease-in-out infinite envelope-pulse}@keyframes envelope-pulse{0%,to{opacity:1}50%{opacity:.42}}.envelope-sheet{z-index:2;background:#fffdf4;border-radius:9px;align-items:center;padding:0 1.15rem;transition:transform .54s cubic-bezier(.22,1.16,.36,1);display:flex;position:absolute;inset:0;transform:translateY(-104%);box-shadow:0 2px #1b1c2029,0 10px 18px -10px #1b1c2057}.envelope[data-state=in] .envelope-sheet{transform:translateY(0)}.envelope .envelope-sheet p{font-size:var(--mono-say);letter-spacing:.06em;text-transform:uppercase;color:#1b1c20c7;margin:0;line-height:1.6}.envelope .envelope-error{font-size:var(--mono-say);letter-spacing:.06em;text-transform:uppercase;color:var(--vermilion-ink);margin:.7rem 0 0;line-height:1.6}.envelope .envelope-error:empty{margin:0}@media (prefers-reduced-motion:reduce){.envelope-body,.envelope-body:focus-within{animation:none}.envelope-flap,.envelope-sheet,.envelope-send,.letter-shelf{transition:none}}
