/* Homepage-only letterbox. All selectors are scoped to its section or classes. */
/* Replace the former computer section grid with the letterbox composition. */
#round > .shell{display:block;grid-template-columns:none;grid-template-areas:none}
#round > .shell > .sec-h,#round > .shell > .sec-lede{grid-area:auto;align-self:auto}
#round .lb-side.comp-copy{grid-area:auto;margin-top:0;align-self:center;min-width:0}

.lb-signup{font-family:var(--sans);color:var(--ink);width:100%;min-width:0}
.lb-signup,.lb-signup *,.lb-signup *::before,.lb-signup *::after{box-sizing:border-box}
:where(.lb-signup) :is(button,input){font:inherit}
.lb-signup button{cursor:pointer}
.lb-signup button:focus-visible{outline:3px solid var(--cream);outline-offset:5px}
.lb-signup input:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:0}
.lb-signup .hp,.lb-hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.lb-composition{display:grid;min-width:0;grid-template-columns:minmax(0,1.7fr) minmax(200px,.65fr);gap:clamp(28px,4vw,68px);align-items:center;margin-top:38px}
.lb-stage{container-type:inline-size;position:relative;width:100%;isolation:isolate}
.lb-hardware{position:absolute;inset:0 0 auto;width:100%;height:auto;aspect-ratio:1783/882;display:block;filter:drop-shadow(0 3px 2px rgb(71 25 3 / .22)) drop-shadow(0 12px 12px rgb(71 25 3 / .16));pointer-events:none;user-select:none}
/* The flap's lower lip is y=503px on the original 1783px-wide image. */
.lb-front{z-index:4;clip-path:polygon(0 0,100% 0,100% 57.2%,0 57.2%);filter:none}
.lb-paper-path{position:relative;z-index:3;min-height:49.47cqw;padding:26.9cqw 0 5cqw;clip-path:polygon(0 28.1cqw,100% 28.1cqw,100% 100%,0 100%)}
.lb-letter-rail{position:relative;margin-left:18%;width:64%;transform:rotate(-2deg);transform-origin:50% 0;filter:drop-shadow(.14cqw .4cqw .28cqw rgb(53 23 5 / .20)) drop-shadow(.7cqw 2.3cqw 1.5cqw rgb(53 23 5 / .17))}
.lb-letter{position:relative;color:var(--ink);min-height:35cqw;padding:4.2cqw 4cqw 3.5cqw;border:1px solid #ddcfb4;border-radius:1px;background:linear-gradient(178deg,rgb(255 254 243 / .35),transparent 22%,rgb(188 161 112 / .035) 65%,rgb(255 254 243 / .18)),#f3ead5;box-shadow:inset 0 1px 0 #fff9e9,inset 1px 0 0 rgb(255 251 236 / .75),inset -1px 0 2px rgb(139 109 65 / .12),0 1px 0 #d4c3a5,0 2px 0 #e7d9be,0 3px 0 #baaa8e}
.lb-letter:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='180'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.055 .58' numOctaves='3' seed='9'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.lb-letter-top,.lb-letter-copy,.lb-letter label,.lb-letter input,.lb-paper-foot{position:relative;z-index:1}
.lb-slot-shade{position:absolute;z-index:5;top:28.05cqw;left:17%;width:66%;height:3.5cqw;pointer-events:none;background:linear-gradient(to bottom,rgb(30 20 10 / .48),rgb(30 20 10 / .13) 32%,transparent);clip-path:polygon(1% 0,99% 0,100% 100%,0 100%)}
.lb-letter-top{display:flex;align-items:start;justify-content:space-between;gap:12px}
.lb-letter-mark{font-size:clamp(15px,3.6cqw,27px);font-weight:900;line-height:.95;letter-spacing:-.05em}
.lb-stamp{flex:0 0 auto;width:clamp(44px,8.2cqw,70px);aspect-ratio:.85;background:#246ba1;color:var(--cream);padding:1cqw .5cqw;display:grid;place-items:center;text-align:center;font-weight:750;font-size:clamp(7px,1.25cqw,10px);line-height:1.2;letter-spacing:.025em;border:3px dotted #eee5cf;outline:1px solid #bdaf91;transform:rotate(2.5deg);box-shadow:0 1px 1px rgb(105 84 49 / .12)}
.lb-stamp b{font-family:var(--serif);font-style:italic;font-size:clamp(10px,2.3cqw,18px);font-weight:500}
.lb-letter-copy{font:500 clamp(15px,2.8cqw,22px)/1.2 var(--serif);max-width:17ch;margin:1.8cqw 0 2cqw}
.lb-letter label{display:block;font-size:clamp(11px,1.8cqw,15px);font-weight:650;margin:0 0 .7cqw}
.lb-letter input{display:block;width:100%;min-width:0;border:0;border-bottom:1px solid #b6a88d;padding:8px 0 6px;background:transparent;color:#25261f;font:500 clamp(16px,2.7cqw,22px)/1.2 var(--serif);border-radius:0;min-height:44px;position:relative;z-index:1}
.lb-letter input{caret-color:var(--blue)}
.lb-letter input::placeholder{color:#817765;font-style:italic}
.lb-letter input:focus-visible{outline-offset:3px}
.lb-paper-foot{font:italic 400 clamp(10px,1.6cqw,13px)/1.2 var(--serif);margin:1.8cqw 0 0;color:#7b705b}
.lb-side h2{color:var(--cream);font-size:clamp(25px,2.5vw,34px);font-weight:850;line-height:1.04;letter-spacing:-.035em;margin:0 0 14px}
.lb-side p{font-family:var(--sans);text-shadow:none;color:var(--ink);font-size:17px;line-height:1.5;margin:0 0 22px;max-width:30ch}
.lb-post-button{display:inline-flex;align-items:center;justify-content:center;gap:15px;min-height:52px;padding:13px 24px;border:3px solid var(--blue);border-radius:18px;background:var(--cream);color:var(--ink);font-weight:850;font-size:17px;box-shadow:0 2px 0 rgb(75 25 6 / .13);transition:transform .2s,background .2s}
@media(hover:hover){.lb-post-button:hover{transform:translateY(-2px);background:#fffdf4}}
.lb-post-button:disabled{cursor:default;transform:none;opacity:.72}
.lb-post-button svg{width:22px;height:22px}
.lb-side .lb-fine{color:var(--ink);opacity:1;text-shadow:none;font-size:13px!important;margin-top:14px!important}
.lb-side .lb-status{min-height:2.8em;font-weight:700;font-size:16px;line-height:1.4;margin-top:18px!important}
.lb-reset-space{min-height:44px}
.lb-reset{color:var(--ink);background:none;border:0;padding:8px 0;font-size:14px;text-decoration:underline;text-underline-offset:4px;min-height:44px}
.lb-reset[hidden]{display:none}
.lb-signup-invite{position:relative;z-index:1;font:750 clamp(14px,2cqw,18px)/1.3 var(--sans);text-decoration:underline;text-decoration-thickness:1.4px;text-underline-offset:.2em;margin:2.5cqw 0 .8cqw}
.lb-signup-invite+.lb-letter-copy{margin-top:0}
.lb-email-field{position:relative;z-index:1}
.lb-email-field input{padding-left:12px}
.lb-cursor-cue{position:absolute;left:2px;top:50%;height:1.1em;width:2px;background:var(--blue);transform:translateY(-50%);pointer-events:none;animation:lb-cursor-blink 1.05s steps(1,end) infinite}
.lb-email-field input:focus+.lb-cursor-cue,.lb-email-field input:not(:placeholder-shown)+.lb-cursor-cue,.lb-email-field input[readonly]+.lb-cursor-cue{display:none}
@keyframes lb-cursor-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.lb-cursor-cue{animation:none;opacity:1}}

/* The upper rim stays fixed; a narrow shade binds the sheet to the mouth. */
.lb-letter::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(174deg,transparent 85%,rgb(161 137 91 / .045) 96%,rgb(255 252 238 / .35));}
.lb-stage.posted .lb-cursor-cue{display:none}
/* Only the central hinge/door area changes; never replace the outer frame. */
.lb-closed-flap{z-index:6;opacity:0;clip-path:polygon(10.5% 36.4%,89.8% 36.4%,89.8% 77.5%,10.5% 77.5%);transform-origin:50% 36.4%;transform:perspective(1100px) rotateX(60deg);filter:none}
.lb-stage.closed .lb-closed-flap{opacity:1;transform:perspective(1100px) rotateX(0deg);clip-path:polygon(8.5% 34%,91.8% 34%,91.8% 79%,8.5% 79%)}
.lb-stage.closed .lb-slot-shade{visibility:hidden}
/* A real paper receipt: warm fibre, one fine printed rule, visible edge thickness. */
.lb-delivery-confirmation{position:absolute;left:18%;width:64%;top:21.5cqw;z-index:8;color:#173e57;background:linear-gradient(170deg,rgb(255 253 240 / .6),transparent 58%,rgb(178 150 100 / .08)),#f2e7cf;padding:clamp(11px,2cqw,19px) clamp(9px,2cqw,18px);border:1px solid #d7c5a5;border-radius:1px;text-align:center;box-shadow:inset 0 1px 0 #fff8e8,0 1px 0 #bca98a,0 2px 0 #e7d8b9,1px 4px 3px rgb(54 31 8 / .17),3px 9px 9px rgb(54 31 8 / .12);visibility:hidden;transform:rotate(-3deg);transform-origin:15% 50%;pointer-events:none}
.lb-delivery-confirmation::before{content:"";position:absolute;inset:5px;border:1px solid rgb(36 75 96 / .5);pointer-events:none}
.lb-delivery-confirmation::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.1 .6' numOctaves='3' seed='11'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.lb-delivery-confirmation .lb-thanks{display:block;font:italic 500 clamp(16px,2.6cqw,23px)/1.1 var(--serif);margin-bottom:6px}
.lb-delivery-confirmation strong{display:block;font:850 clamp(13px,2.8cqw,25px)/1.14 var(--sans);letter-spacing:-.025em;overflow-wrap:normal}
.lb-delivery-confirmation small{display:block;font:650 clamp(10px,1.7cqw,14px)/1.3 var(--sans);margin-top:7px;letter-spacing:.01em}
.lb-stage.confirmed .lb-paper-path{height:49.47cqw}
.lb-stage.confirmed .lb-delivery-confirmation{visibility:visible;clip-path:none;transform:translateY(0) rotate(-3deg)}
@media(max-width:760px){
  .lb-composition{grid-template-columns:minmax(0,1fr);margin-top:30px;gap:0}
  .lb-stage{max-width:640px;margin-inline:auto}
  .lb-side{max-width:550px;min-width:0;padding-top:10px}
  .lb-side h2{font-size:27px}
  .lb-side p{max-width:38ch}
  .lb-letter{min-height:34cqw}
  .lb-letter-rail{width:70%;margin-left:15%}
  .lb-slot-shade{left:14%;width:72%}
  .lb-paper-foot{font-size:11px;line-height:1.35}
  .lb-letter-copy{font-size:clamp(15px,3cqw,22px)}
  .lb-letter label{font-size:12px}
  .lb-letter input{font-size:clamp(16px,2.8cqw,22px)}
  .lb-fine{margin-top:12px!important}
}
@media(prefers-reduced-motion:reduce){
  .lb-signup *,.lb-signup *::before,.lb-signup *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .lb-cursor-cue{opacity:1}
}

/* Keep the real signup action immediately beside the letter, not the supporting copy. */
.lb-letter-actions{position:relative;z-index:7;display:flex;justify-content:flex-end;width:64%;margin-left:18%;margin-top:-3cqw;margin-bottom:2cqw;transition:margin-top .35s ease}
.lb-post-button{min-width:128px;box-shadow:0 3px 0 rgb(22 62 98 / .12)}
.lb-signup button.lb-post-button:focus-visible{outline-color:var(--blue);outline-offset:4px}
@media(max-width:760px){.lb-letter-actions{width:70%;margin-left:15%;margin-top:-2cqw;margin-bottom:18px}.lb-post-button{min-height:50px;padding:10px 20px}}
.lb-stage.confirmed .lb-letter-actions{margin-top:1.2cqw}