/* A personal letter; one considered question on each sheet. */
.correspondence-page{--letter-ink:#4b1726;--letter-muted:#79594f}
#application{max-width:1440px;margin:auto;padding:32px 6% 70px;min-height:80svh}
.application-heading{display:flex;justify-content:space-between;gap:25px;align-items:center;max-width:1120px;margin:0 auto 32px}
.return-link{font:14px/1.5 Redaction,serif;padding:12px 0}
.application-choices{display:flex;gap:28px;font:12px/1.4 var(--mono)}
.application-choices a{padding:12px 0;border-bottom:1px solid transparent}
.application-choices a[aria-current]{border-color:#eedac3;color:#fff5e9}
.correspondence-layout{display:grid;grid-template-columns:180px minmax(0,790px);gap:48px;justify-content:center;align-items:start}
.letter-contents{padding-top:45px}.letter-contents>.eyebrow{font-size:11px;opacity:.8}
.letter-contents ol{list-style:none;margin:27px 0;padding:0;display:grid;gap:18px}
.letter-contents li{display:flex;gap:15px;font:17px/1.4 Redaction,serif;color:#c3ad9e}
.letter-contents li[aria-current=step]{color:#fff7ec}.letter-contents li span{font:10px/2 var(--mono);opacity:.65}
.draft-note{font:14px/1.5 Redaction,serif;color:#d2bbab;max-width:150px;margin:36px 0 12px}
#clear-draft{background:none;border:0;border-bottom:1px solid #dfc3ae50;padding:9px 0;color:#dfc3ae;font:13px/1.5 Redaction,serif;min-height:44px}
.letter-stage{position:relative;perspective:1600px;min-width:0}
.application-letter{padding:35px 54px 25px;min-height:590px;display:flex;flex-direction:column;position:relative;transform-origin:50% 60%;outline:1px solid #a97c5b42;outline-offset:-12px;isolation:isolate;color-scheme:light}
.application-letter:before{content:'';position:absolute;inset:33.333% 0 auto;height:1px;background:#8d684514;box-shadow:0 1px 1px #fff7df60;pointer-events:none;z-index:-1}
.letter-running-head{display:flex;justify-content:space-between;align-items:baseline;gap:15px;border-bottom:1px solid #885e4a55;padding-bottom:18px;color:var(--letter-ink)}
.letter-running-head>span:first-child{font:30px/1 Redaction,serif;letter-spacing:-.04em}.letter-running-head>span:last-child{font:10px/1.5 var(--mono);text-align:right;max-width:200px}
.letter-progress{display:flex;justify-content:space-between;gap:20px;font:10px/1.5 var(--mono);color:#79594f;padding:18px 0 10px}
.letter-progress-track{height:1px;background:#95705226;margin-bottom:29px}
.letter-progress-track>span{display:block;height:1px;background:#672a37;transform-origin:0 50%;transform:scaleX(0)}
#letter-page{flex:1;min-height:300px;outline:0}
#letter-page h1,#letter-page h2{font:clamp(31px,3.2vw,45px)/1.12 Redaction,serif;letter-spacing:-.035em;margin:8px 0 21px;color:var(--letter-ink);text-wrap:balance}
#letter-page h1 em{display:block;font:74px/1 Ballet,cursive;margin:20px 0 34px 10px;letter-spacing:0}
#letter-page .salutation{font:20px/1.5 Redaction,serif;font-style:italic;margin-bottom:18px}
#letter-page p{font:18px/1.6 Redaction,serif;color:#624438;margin:15px 0;max-width:560px;text-wrap:pretty}
#letter-page .question-note{font-size:17px;margin:0 0 24px}
#letter-page .optional-label{display:block;font:10px/1.6 var(--mono);color:#79594f;margin:0 0 10px}
#letter-page input:not([type=radio]):not([type=checkbox]),#letter-page textarea{width:100%;padding:12px 0;border:0;border-bottom:1px solid #80544270;border-radius:0;background:transparent;color:var(--letter-ink);font:25px/1.5 Redaction,serif;outline:none;box-shadow:none}
#letter-page textarea{font-size:21px;min-height:168px;resize:vertical;background:repeating-linear-gradient(transparent 0,transparent 31px,#79594f18 31px,#79594f18 32px);line-height:32px;padding-top:0}
#letter-page input:focus,#letter-page textarea:focus{border-bottom-color:#4b1726}
#letter-page input:focus-visible,#letter-page textarea:focus-visible{outline:1px solid #815147;outline-offset:7px}
#letter-page input::placeholder,#letter-page textarea::placeholder{color:#7e6255;font-style:italic}
#letter-page .character-count{text-align:right;font:10px/1.5 var(--mono);color:#846252;margin:10px 0 0}
.letter-choices{border:0;padding:0;display:grid;gap:10px;margin:0}
.letter-choice{display:flex;align-items:center;gap:14px;min-height:48px;padding:10px 13px;border:1px solid #9970575c;color:#4b1726;font:19px/1.35 Redaction,serif;cursor:pointer}
.letter-choice:has(input:checked){background:#6425370d;border-color:#6b293b}.letter-choice input{width:17px;height:17px;accent-color:#642537;flex:none}
.letter-error{font:15px/1.5 Redaction,serif;color:#922f36;min-height:23px;margin:16px 0 8px}
.letter-navigation{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:10px}
.letter-navigation button,.receipt-actions button{font:17px/1.4 Redaction,serif;padding:12px 0;min-height:46px;border:0;background:transparent;color:#4b1726;cursor:pointer}
#letter-next{margin-left:auto;background:#4b1726;color:#fff1de;padding:13px 21px;display:flex;gap:30px;align-items:center;transition:background-color .2s,transform .16s}
#letter-next:active{transform:scale(.98)}
.letter-footnote{font:12px/1.5 Redaction,serif;color:#79594f;margin:18px 0 0}
.application-bottom-note{max-width:650px;margin:24px auto 0;font:14px/1.6 Redaction,serif;text-align:center;color:#ddcabc}
.correspondence-page button:focus-visible,.application-letter a:focus-visible{outline:2px solid #95515b;outline-offset:4px}
.letter-review-intro{padding-bottom:18px;border-bottom:1px solid #8a635240}
.letter-review{margin:0}.letter-review>div{padding:18px 0;border-bottom:1px solid #8a635230}
.letter-review dt{display:flex;justify-content:space-between;gap:25px;font:15px/1.4 Redaction,serif;color:#79594f;margin-bottom:8px}
.letter-review dt button{border:0;background:transparent;color:#6f2b3c;font:13px/1.4 Redaction,serif;text-decoration:underline;text-underline-offset:3px;min-width:44px;min-height:44px;margin:-13px -5px;padding:10px}
.letter-review dd{margin:0;font:19px/1.6 Redaction,serif;color:#4b1726;white-space:pre-wrap;overflow-wrap:anywhere}
.letter-consent{display:flex;align-items:flex-start;gap:12px;margin:26px 0 10px;font:16px/1.5 Redaction,serif;color:#4b1726}
.letter-consent input{width:18px;height:18px;margin-top:3px;accent-color:#4b1726;flex:none}
#letter-page .delivery-note{font:14px/1.5 Redaction,serif;color:#79594f;margin-top:22px}
.outgoing-envelope{position:absolute;top:28%;left:14%;width:72%;height:250px;transform-origin:center;perspective:1200px;pointer-events:none}
.outgoing-body{position:absolute;inset:0;border:1px solid #b19775;display:grid;place-items:center;text-align:center;clip-path:polygon(0 0,50% 40%,100% 0,100% 100%,0 100%)}
.outgoing-body>span{padding-top:65px;font:22px/1.5 Redaction,serif}.outgoing-body small{font:10px var(--mono)}
.outgoing-flap{position:absolute;inset:0 0 auto;height:55%;background:#e4d2b5;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:50% 0;transform:rotateX(178deg)}
.outgoing-envelope .wax-seal{top:41%;opacity:0}
.letter-receipt{position:relative;padding:65px 60px;min-height:490px;outline:1px solid #a97c5b42;outline-offset:-12px}
.letter-receipt .eyebrow{color:#79594f;font-size:10px}
.letter-receipt h1{font:49px/1.1 Redaction,serif;letter-spacing:-.04em;margin:30px 0}
.letter-receipt p:not(.eyebrow){font:21px/1.6 Redaction,serif;color:#624438}.letter-receipt>a{display:inline-block;font:16px/1.5 Redaction,serif;border-bottom:1px solid #80544270;padding:12px 0;margin-top:20px}
.receipt-actions{display:flex;gap:25px;flex-wrap:wrap;margin-top:28px}.receipt-actions button{border-bottom:1px solid #80544270}
[hidden]{display:none!important}
@media(hover:hover) and (pointer:fine){#letter-next:hover{background:#752d41}.letter-choice:hover{background:#64253708}.letter-review dt button:hover{color:#a14860}}
@media(max-width:1000px){.correspondence-layout{grid-template-columns:140px minmax(0,1fr);gap:25px}.application-letter{padding:32px 38px 25px}.letter-contents li{font-size:15px}}
@media(max-width:700px){
 #application{padding:15px 4% 45px}.application-heading{gap:15px;align-items:start;margin-bottom:19px}.return-link{font-size:13px}.application-choices{font-size:10px;gap:16px}
 .correspondence-layout{display:block}.letter-contents{padding:0}.letter-contents>.eyebrow,.letter-contents ol{display:none}.draft-note{max-width:none;margin:0 0 14px;font-size:12px}.letter-contents{position:relative}#clear-draft{position:absolute;right:0;top:-14px;font-size:12px}
 .application-letter{padding:27px 25px 25px;outline-offset:-9px;min-height:575px}.letter-running-head>span:first-child{font-size:26px}.letter-running-head>span:last-child{font-size:8px;max-width:130px}.letter-running-head{padding-bottom:16px}
 .letter-progress{font-size:9px}.letter-progress-track{margin-bottom:25px}#letter-page h1,#letter-page h2{font-size:34px}#letter-page h1 em{font-size:63px;margin-bottom:29px}#letter-page p{font-size:17px}.letter-navigation{gap:12px}.letter-navigation button{font-size:16px}#letter-next{padding:12px 15px;gap:15px}
 #letter-page input:not([type=radio]):not([type=checkbox]){font-size:23px}#letter-page textarea{font-size:19px}#letter-page .question-note{font-size:16px}.letter-choice{font-size:17px}.letter-footnote{font-size:11px}.application-bottom-note{font-size:13px;padding:0 8px}
 .letter-receipt{padding:38px 29px;min-height:440px}.letter-receipt h1{font-size:38px}.letter-receipt p:not(.eyebrow){font-size:18px}.receipt-actions{gap:12px}.receipt-actions button{font-size:15px}
 .outgoing-envelope{left:7%;width:86%;height:190px;top:30%}.outgoing-body>span{font-size:18px}.outgoing-envelope .wax-seal{width:54px;height:54px;left:calc(50% - 27px)}
}
@media(max-width:360px){.application-letter{padding:24px 21px}.application-choices{gap:11px;font-size:9px}.return-link{font-size:12px}#letter-page h1,#letter-page h2{font-size:30px}#letter-page h1 em{font-size:56px}.letter-navigation button{font-size:15px}#letter-next{padding:12px;gap:12px}}
@media(prefers-reduced-motion:reduce){#letter-next{transition:none}}
/* Keep the first sheet's invitation and opening action within easy reach. */
#letter-page:has(h1 em) h1{font-size:39px;margin-bottom:20px}
#letter-page:has(h1 em) h1 em{font-size:65px;margin:12px 0 25px 10px}
#letter-page:has(h1 em) p{font-size:17px;line-height:1.5;margin:12px 0}
#letter-page:has(h1 em) .salutation{font-size:18px;margin:9px 0 19px}
@media(min-width:701px){#application{padding-top:23px}.application-heading{margin-bottom:24px}.application-letter{padding-top:29px}}
@media(max-width:700px){#letter-page:has(h1 em) h1{font-size:34px}#letter-page:has(h1 em) h1 em{font-size:59px}}
.application-letter.is-dispatching{height:590px;min-height:0;overflow:hidden;pointer-events:none}
.application-letter.is-dispatching #letter-page{min-height:0;overflow:hidden}
.correspondence-page .letter-receipt .eyebrow{color:#79594f}
@media(max-width:700px){.application-letter.is-dispatching{height:575px}}
.outgoing-body>span{position:absolute;left:12px;right:12px;bottom:20px;padding:0}
@media(max-width:700px){.outgoing-body>span{bottom:17px;font-size:16px;line-height:1.35}}

/* Correspondence refinement; retain the existing paper, type and botanical setting. */
.correspondence-page .visitor-settings{position:static;justify-content:center;margin:24px auto 0;width:fit-content;max-width:100%;}
.correspondence-page .visitor-settings>a{background:transparent}
/* Nicole, 2026-10-27 (membership section): the membership terms are a welcome paragraph below the existing divider; same type as the paragraphs above it. */
#letter-page .membership-pricing{border-top:1px solid #885e4a40;padding-top:18px;margin-top:22px}
#letter-page .question-salutation{font:italic 18px/1.5 Redaction,serif;margin:0 0 15px;color:var(--letter-muted)}
#letter-page .question-salutation{overflow-wrap:anywhere}
.letter-links{border:0;padding:0;margin:28px 0 0;min-width:0}
.letter-link-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px}
.letter-link-row{display:grid;grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:14px}
.letter-link-row.is-fixed{grid-template-columns:minmax(0,1fr)}
.letter-link-row.is-legacy{grid-column:1/-1}
.letter-link-field{display:grid;gap:6px;min-width:0;color:var(--letter-ink);font:16px/1.5 Redaction,serif}
.letter-link-remove{width:44px;height:44px;align-self:end;margin-bottom:3px;border:0;background:transparent;color:var(--letter-muted);font:25px/1 Redaction,serif;cursor:pointer}
.letter-link-remove:hover{color:var(--letter-ink);background:#64253708}
.letter-add-link{display:block;width:fit-content;max-width:100%;margin-top:20px}
#add-letter-link{min-height:46px;max-width:100%;padding:10px 0;border:0;border-bottom:1px solid #80544270;border-radius:0;background:transparent;color:var(--letter-ink);font:18px/1.5 Redaction,serif;cursor:pointer}
#add-letter-link:focus-visible{outline:2px solid #95515b;outline-offset:4px}
#letter-page .letter-links input[type=url]{font:17px/1.5 Redaction,serif;min-height:44px;padding:10px 0}
#letter-page .letter-links textarea{font:17px/1.8 Redaction,serif;min-height:108px;line-height:32px}
#letter-page .letter-links input::placeholder,#letter-page .letter-links textarea::placeholder{font-size:16px;color:#7e6255}
.letter-link-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.letter-link-service{font:11px/1.5 var(--mono);letter-spacing:.04em;color:var(--letter-muted)}
#letter-page .optional-label{min-height:16px;font-size:10px;margin-bottom:12px}
/* Round 14: the sponsor amount; a "$" inside the field, then how often in the existing choice style. */
.letter-amount{display:grid;gap:26px;margin-top:4px}
.letter-amount-field{position:relative;max-width:360px}
.letter-amount-prefix{position:absolute;left:0;top:50%;transform:translateY(-50%);color:var(--letter-ink);font:25px/1 Redaction,serif;pointer-events:none}
#letter-page .letter-amount-field input:not([type=radio]):not([type=checkbox]){padding-left:.72em;font-variant-numeric:lining-nums tabular-nums}
.letter-frequency{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:700px){.letter-amount-prefix{font-size:23px}.letter-frequency{grid-template-columns:minmax(0,1fr)}}
.application-letter[data-stage="question"] #letter-page{padding-top:5px}
.application-letter[data-stage="review"] #letter-page h1{max-width:520px}
.letter-review>div{border-bottom:1px solid #8a635226;padding:17px 0}
.letter-review dt{margin-bottom:7px}
.letter-review dd{line-height:1.65}
.letter-review dd.answer-empty{font-size:16px;font-style:italic;color:var(--letter-muted)}
.review-links{list-style:none;padding:0;margin:0;display:grid;gap:10px;white-space:normal}
.review-links li{display:grid;grid-template-columns:160px minmax(0,1fr);gap:8px 18px;font-size:17px;line-height:1.5}
.review-link-label{color:var(--letter-muted);font-size:15px}
.review-links a,#letter-page .membership-option a,#letter-page .membership-pricing a{width:fit-content;max-width:100%;text-decoration:underline;text-decoration-color:#80544255;text-underline-offset:4px}
.review-links a:hover,#letter-page .membership-option a:hover,#letter-page .membership-pricing a:hover{text-decoration-color:currentColor}
#letter-page .optional-label:empty{display:none}
#letter-page h1:focus,#letter-page h2:focus{outline:none}
#letter-page input[aria-invalid=true],#letter-page textarea[aria-invalid=true]{border-bottom:2px solid #922f36}
.letter-choice:has(input[aria-invalid=true]){border-color:#922f36}
.letter-consent:has(input[aria-invalid=true]){color:#922f36}
@media(min-width:701px){#letter-page h2{font-size:clamp(31px,3vw,40px)}}
.letter-navigation{flex-wrap:wrap}
.letter-navigation button:disabled{cursor:wait;opacity:.65}
@media(max-width:700px){
 .letter-links{margin-top:24px}.letter-link-list{grid-template-columns:minmax(0,1fr)}.letter-link-row{gap:8px}

 .application-letter[data-stage="intro"] #letter-page{min-height:0}
 .application-letter[data-stage="intro"] .letter-navigation{margin-top:22px}
 .application-letter[data-stage="question"]{min-height:560px}
 .application-letter[data-stage="review"] #letter-page h1{font-size:32px}
 .review-links li{grid-template-columns:minmax(0,1fr);gap:2px}
 .correspondence-page #letter-page textarea{background:repeating-linear-gradient(transparent 0,transparent 29px,#79594f18 29px,#79594f18 30px)}
 .correspondence-page #letter-page .letter-links textarea{line-height:30px}
}
@media(max-width:360px){
 #letter-page:has(h1 em) h1 em{font-size:50px}
 .letter-navigation button{font-size:14px}
}
/* Round 8 web change 2 (fit only, no copy): on short phones (375x667) "Begin your letter" sits in the first screen.
   Smaller welcome title, 16 px body, and the rules and spacing around the price halved; questions are unchanged. */
@media(max-width:700px) and (max-height:760px){
 .correspondence-page .letter-contents{margin-bottom:0}
 .correspondence-page .application-letter[data-stage="intro"]{padding-top:18px}
 .application-letter[data-stage="intro"] .letter-running-head{padding-bottom:10px}
 .application-letter[data-stage="intro"] .letter-progress{padding:8px 0 6px}
 .application-letter[data-stage="intro"] .letter-progress-track{margin-bottom:12px}
 .application-letter[data-stage="intro"] #letter-page .salutation{margin:0 0 6px}
 .application-letter[data-stage="intro"] #letter-page h1{font-size:30px;margin:2px 0 8px}
 .application-letter[data-stage="intro"] #letter-page h1 em{font-size:36px;margin-bottom:0}
 .application-letter[data-stage="intro"] #letter-page p{font-size:16px;line-height:1.42;margin:6px 0}
 .application-letter[data-stage="intro"] #letter-page .membership-pricing{font-size:16px;line-height:1.42;padding-top:8px;margin-top:9px}
 .application-letter[data-stage="intro"] .letter-navigation{margin-top:3px}
}

/* Round 13 web director 1: the honeypot is off screen and out of the tab order; people never see it. */
.letter-honeypot{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
/* Round 13 web director 3: focused fields scroll clear of the fixed header (apply.js keeps this in step with the header). */
html{scroll-padding-top:104px}
/* Round 13 web director 2 (observation h): on landscape phones and at 200% zoom the pause and sound pair joins the page flow
   under the letter, as on the homepage's static opening, so it never sits on the paper. */
@media(max-height:500px) and (min-aspect-ratio:1/1){
 .correspondence-page .visitor-settings{position:static!important;inset:auto!important;display:flex!important;justify-content:flex-end;gap:10px;margin:24px 18px calc(24px + env(safe-area-inset-bottom))!important;width:auto!important}}
.application-heading[hidden]{display:none!important}

/* Round 14 (Nicole, 2026-10-22): a visible progress bar. The rule under the step line becomes a 2 px bar in the paper's
   wine ink, full width of the letter, with “Question n of N” beside it in the existing label type. */
.letter-progress-track{height:2px!important;background:#672a3724!important}
.letter-progress-track>span{height:2px!important;background:#672a37!important}
#step-count{white-space:nowrap}

/* Round 14 Codex: Redaction labels and a minimum 24 px outer paper gutter. */
body.correspondence-page #application :is(#step-caption,#step-count,.optional-label,.letter-link-service,.character-count){
 font-family:Redaction,Georgia,serif!important;
 letter-spacing:.08em!important;
 text-transform:uppercase;
}
body.correspondence-page #application .letter-contents li span{font-family:Redaction,Georgia,serif}
@media(max-width:700px){
 body.correspondence-page main#application{
  padding-left:max(24px,env(safe-area-inset-left))!important;
  padding-right:max(24px,env(safe-area-inset-right))!important;
 }
 body.correspondence-page #application .letter-contents{margin-left:0!important;margin-right:0}
 body.correspondence-page #application .letter-running-head{flex-wrap:wrap;gap:8px 14px}
 body.correspondence-page #application .letter-running-head>span:first-child{white-space:nowrap}
 body.correspondence-page #application .letter-running-head>span:last-child{margin-left:auto}
 body.correspondence-page #application .letter-progress{flex-wrap:wrap;gap:6px 14px}
 body.correspondence-page #application #step-count{margin-left:auto}
}

/* Round 14 responsive (Nicole: "why is this not responsive?"): from 701 to 1099 px the chapters sit above the letter in one
   row and the letter takes the whole content column; the page ends with room below the fixed sound controls. */
@media(min-width:701px) and (max-width:1099px){
 body.correspondence-page .correspondence-layout{display:block!important;max-width:820px;margin-left:auto!important;margin-right:auto!important}
 body.correspondence-page #application .letter-contents{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 28px;padding:0 0 20px!important;margin:0!important}
 body.correspondence-page #application .letter-contents>.eyebrow{margin:0}
 body.correspondence-page #application .letter-contents ol{display:flex!important;flex-wrap:wrap;gap:6px 24px;margin:0}
 body.correspondence-page #application .letter-contents li{font-size:15px;white-space:nowrap}
 body.correspondence-page #application .draft-note{flex-basis:100%;margin:0;max-width:none}}
body.correspondence-page main#application{padding-bottom:max(110px,calc(96px + env(safe-area-inset-bottom)))!important}