/* Sowol's letter scenes. The established homepage and base palette remain intact. */
.site-header{height:auto;min-height:94px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
.site-header nav{margin-left:auto;max-width:100%;flex-wrap:wrap}
.comic-scene{position:relative;isolation:isolate;margin:0 0 30px;border-radius:3px;overflow:hidden;background:var(--night)}
.comic-scene>img{width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:cover}
.comic-speech{position:relative;margin:-34px 24px 20px;padding:18px 22px;border:1px solid #d9cba9;border-radius:3px;background:#fcf9f0;color:var(--ink);box-shadow:0 8px 20px #0002;font-family:var(--serif);font-size:1rem;line-height:1.95}
.comic-speech::before{content:"";position:absolute;right:24px;top:-10px;width:18px;height:18px;transform:rotate(45deg);background:#fcf9f0;border-top:1px solid #d9cba9;border-left:1px solid #d9cba9}
.scene-listen .comic-speech::before{right:auto;left:24px}
.comic-speech>span{display:block;font-family:var(--sans);font-size:.6875rem;letter-spacing:1px;color:#806238;margin-bottom:6px}
.comic-speech p{margin:0;position:relative}
.intake-heading{margin-bottom:20px}
.intake-heading h1{font-size:28px;margin-top:8px}
.intake-progress{display:flex;gap:18px;padding:0 0 16px;font-size:12px;color:var(--muted)}
.intake-progress [aria-current="step"]{color:var(--green);font-weight:600;border-bottom:1px solid var(--gold)}
.comic-form{background:transparent;border:0;box-shadow:none;padding:0;margin:0;scroll-margin-top:18px}
.intake-step[hidden]{display:none}
.intake-step h2{font-size:22px;letter-spacing:-.5px;margin:0 0 22px;outline:none}
.comic-form .comic-scene{margin-bottom:24px}
.comic-form #submit-birth{width:100%}
.comic-form .step-next{width:100%;margin-top:24px}
.step-navigation{display:flex;gap:12px;align-items:center;margin-top:22px}
.step-navigation .step-next{width:auto;flex:1;margin-top:0}
.step-back{flex-shrink:0;font-size:12px}
.comic-form>section>.step-back{margin-top:14px}
.draft-notice{margin-top:28px;border-top:1px solid var(--line);padding-top:14px;font-size:11px}
.letter-invitation{padding:24px 0 12px;border-top:1px solid var(--line)}
.letter-invitation h2{font-size:19px;letter-spacing:-.5px;margin-bottom:16px}
.letter-invitation ol{list-style:decimal-leading-zero;padding-left:28px;margin:0}
.letter-invitation li{padding:0 0 14px 8px;font-size:14px;line-height:1.9}
.letter-invitation li::marker{color:var(--gold);font-size:11px}
.concern-original summary{cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.concern-original blockquote{margin:14px 0 0;padding:12px 16px;background:#edece2;border-left:2px solid var(--gold);white-space:pre-wrap;overflow-wrap:anywhere;word-break:normal}
.comic-order .offer{margin-top:18px;padding:26px}
.comic-order .offer h2{font-size:23px}
.comic-order .offer-price{margin:20px 0}
.offer-contents{margin-top:18px;font-size:12px;text-align:left}
.offer-contents summary{cursor:pointer}
.comic-order .offer-chapters{margin-top:14px;margin-bottom:12px;padding:0;border:0}
.basic-entry{margin:18px 0}
.order-notice{min-height:72px;position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:#f7f4edf5;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:12px;line-height:1.8}
.order-notice a{flex-shrink:0;color:var(--green);text-decoration:underline;text-underline-offset:4px}
.basic-story{scroll-margin-top:70px;padding-top:40px}
.story-heading{margin-bottom:24px}
.story-heading h2{font-size:25px;margin-top:8px}
.comic-order .preview-card{padding:26px;margin-top:24px}
.preview-card h3{font-family:var(--serif);font-size:20px;line-height:1.7;margin-right:42px;margin-bottom:16px}
.comic-order .preview-card>p{font-size:14px;line-height:2;color:var(--ink)}
.study-interlude{margin:32px 0 24px;position:relative;background:var(--night);color:var(--paper)}
.study-interlude img{width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.study-interlude figcaption{padding:16px 20px;font-family:var(--serif);font-size:14px;text-align:center}
.elements-card{padding:24px;border:1px solid var(--line);background:#f0f0e6;margin:24px 0 36px}
.elements-card .chart-heading h3{font-size:14px}
.elements-card .chart-heading small{font-size:10px}
.element-counts{list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:0;margin:22px 0}
.element-counts li{text-align:center}
.element-dot{display:flex;align-items:center;justify-content:center;border:1px solid currentColor;border-radius:50%;width:36px;height:36px;margin:0 auto 8px;font-family:var(--serif);background:#fcfaf4}
.element-counts strong{display:block;font-size:18px;font-weight:400;color:var(--ink)}
.element-counts strong small{font-size:10px;margin-left:3px}
.elements-card>p{font-size:12px;line-height:1.9;color:#58675f}
.arrival-section{scroll-margin-top:80px;padding-top:20px}
.arrival-section>h2{font-size:25px;margin-top:8px}
.arrival-section .status-card{margin-top:20px;padding:26px;background:#fffdf7}
.arrival-art{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;margin-bottom:24px}
.arrival-section .status-card h2{font-size:23px}
.arrival-section .status-card .button{margin-top:22px}
.report-body>.comic-scene{margin-top:34px;margin-bottom:30px}
.report-body .comic-speech>p{font-size:1rem;line-height:1.95;color:var(--ink)}
.report-body .closing-letter{padding-top:4px}
@media(min-width:720px){
  .comic-scene{display:grid;grid-template-columns:46% 54%;align-items:start;min-height:340px}
  .comic-scene>img{grid-area:1/1/2/3}
  .comic-speech{grid-area:1/1;margin:30px 0 30px 24px;padding:18px;z-index:1}
  .comic-speech::before{top:28px;right:-10px;transform:rotate(135deg)}
  .scene-listen .comic-speech{grid-area:1/2;margin:30px 24px 30px 0}
  .scene-listen .comic-speech::before{left:-10px;right:auto;transform:rotate(-45deg)}
}
@media(max-width:420px){
  .site-header{min-height:78px}
  .comic-speech{margin:-18px 14px 14px;padding:14px 16px;font-size:.9375rem}
  .comic-order .offer{padding:22px 18px}
  .order-notice{min-height:64px;font-size:11px;padding:10px 12px;gap:8px}
  .elements-card{padding:20px 16px}
  .element-counts{gap:6px}
  .intake-progress{gap:14px;font-size:11px}
  .intake-step h2{font-size:21px}
}
@media print{
  .comic-scene{display:block;break-inside:avoid;background:transparent;max-width:440px;margin-left:auto!important;margin-right:auto!important}
  .comic-scene>img{max-height:180px;object-fit:cover}
  .comic-speech,.scene-listen .comic-speech{margin:0;padding:12px 16px;box-shadow:none}
  .comic-speech::before{display:none}
  .study-interlude,.order-notice{display:none}
  .elements-card{break-inside:avoid}
}
@media(prefers-reduced-motion:reduce){.comic-form,.basic-story{scroll-behavior:auto}}