/* The letter uses the journal's native fonts, hero position, gutters and greys. */
.letter-editorial { --letter-gap: clamp(2rem,6vw,7rem); padding: var(--s13-section-hero-inset) var(--s13-gutter) 0; color: var(--s13-reading); font-family: var(--s13-body); }
.letter-editorial :is(h1,h2,p) { margin: 0; }
.letter-editorial :is(header,section,div,form,nav) { min-width: 0; }
.letter-hero { padding: 0 0 clamp(3rem,5vw,5.5rem); border-bottom: 0; }
.letter-hero h1 { color: var(--s13-ink); font: var(--s13-display-weight) var(--s13-section-title-size)/1 var(--s13-display); letter-spacing: var(--s13-display-tracking); text-transform: uppercase; }
/* Inherit the collection's bottom alignment and introduction spacing. */
.letter-hero .collection-intro { color: var(--s13-ink); }
.letter-label { display: block; color: var(--s13-muted); font: var(--s13-hero-label-font); letter-spacing: var(--s13-hero-label-tracking); text-transform: uppercase; }
.letter-correspondence { display: grid; grid-template-columns: minmax(0,.6fr) minmax(0,1.4fr); gap: clamp(2.5rem,7vw,8rem); padding: clamp(2.5rem,4vw,4rem) 0; border-block: 1px solid var(--s13-line); }
.letter-sender strong { display: block; margin: 1rem 0; color: var(--s13-ink); font: 600 clamp(1.4rem,2vw,2rem)/1.2 var(--s13-display); }
.letter-sender p { color: var(--s13-muted); max-width: 24ch; font-size: .875rem; line-height: 1.6; }
.letter-form { position: relative; }
.letter-address-row { display: flex; align-items: end; gap: clamp(1.5rem,4vw,4rem); }
.letter-recipient { display: block; flex: 1; min-width: 0; }
.letter-recipient input { display: block; width: 100%; min-width: 0; padding: 1rem 0 .75rem; color: var(--s13-ink); background: transparent; border: 0; border-bottom: 1px solid var(--s13-field-line); border-radius: 0; font: 400 clamp(1.25rem,2.5vw,2.4rem)/1.3 var(--s13-body); }
.letter-recipient input::placeholder { color: var(--s13-muted); opacity: 1; }
.letter-recipient input:focus { outline: 0; border-bottom-color: var(--s13-ink); box-shadow: 0 1px 0 var(--s13-ink); }
.letter-address-row .letter-join { flex-shrink: 0; justify-content: flex-start; gap: .8rem; width: max-content; max-width: 100%; min-width: 0; }
.letter-consent { margin: 1.5rem 0 0; font-size: .75rem; color: var(--s13-secondary); }
.letter-consent a { color: var(--s13-ink); }
.letter-status { margin-bottom: 1rem !important; color: var(--s13-secondary); font-size: .875rem; line-height: 1.6; }
.letter-manifesto { padding: clamp(3.5rem,6vw,7rem) 0 clamp(4rem,7vw,8rem); display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--letter-gap); }
.letter-manifesto h2 { color: var(--s13-ink); font: var(--s13-display-weight) clamp(2.5rem,4.4vw,5rem)/1.08 var(--s13-display); text-transform: uppercase; }
.letter-manifesto p { max-width: 36ch; color: var(--s13-secondary); font-size: clamp(1.1rem,1.5vw,1.4rem); line-height: 1.6; }
.letter-manifesto small { display: block; margin-top: 1.7rem; color: var(--s13-muted); font-size: .8125rem; }
.letter-state .letter-hero h1 { font-size: clamp(3.6rem,7.4vw,9rem); }
.letter-state-copy > p { margin: 1.7rem 0; }
.letter-state-copy > p:first-child { margin-top: 0; }
.letter-receipt { display: flex; align-items: center; gap: 14px; color: var(--s13-muted); font-size: .8125rem; }
.letter-hero .letter-receipt span { font: inherit; letter-spacing: normal; text-transform: none; }
.letter-receipt i { flex: 0 0 5px; height: 5px; background: var(--s13-ink); border-radius: 50%; }
.letter-quiet { align-items: baseline; line-height: 1.6; }
.letter-quiet i { transform: translateY(-.12em); }
.letter-token-form { margin-top: 2rem; }
.letter-token-form .s13-text-action { background: transparent; border-width: 0 0 1px; border-style: solid; cursor: pointer; }
.letter-token-form .s13-text-action:focus-visible { outline: 0; border-bottom-color: var(--s13-accent); box-shadow: 0 1px 0 var(--s13-accent); }
.letter-token-return { color: var(--s13-muted); }
.letter-token .letter-state-links { margin-bottom: 0; }
.letter-state-links { display: flex; gap: var(--letter-gap); flex-wrap: wrap; padding: 1.25rem 0; border-top: 1px solid var(--s13-line); margin-bottom: clamp(4rem,7vw,7rem); }
@media (max-width:1000px) { .letter-correspondence { grid-template-columns: minmax(0,.45fr) minmax(0,1.55fr); gap: 3rem; } .letter-address-row { gap: 2rem; } }
@media (max-width:840px) { .letter-hero { align-items: start; gap: 2rem; padding-bottom: 3rem; } .letter-hero h1 { font-size: var(--s13-section-title-size); } .letter-correspondence { grid-template-columns: 1fr; gap: 2rem; } .letter-sender { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 18px; } .letter-sender strong { font-size: 1.1875rem; margin: 0; } .letter-sender p { display: none; } .letter-recipient input { font-size: 1.5rem; } .letter-manifesto { grid-template-columns: 1fr; gap: 2rem; } .letter-manifesto h2 { font-size: clamp(2.25rem,8vw,3.5rem); } .letter-state .letter-hero h1 { font-size: clamp(2.5rem,11vw,5rem); } }
@media (max-width:480px) { .letter-address-row { flex-direction: column; align-items: stretch; gap: 1rem; } .letter-consent { margin-top: 1rem; } .letter-state-links { flex-direction: column; align-items: flex-start; gap: .5rem; } }