/* Shared reader styles from the existing one-month-in article. */
:root { --paper:#fff; --ink:#0409a6; --reader-size:12.8px; --line:#0409a6; }
    *,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
    html { scrollbar-gutter:stable; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
    body { min-height:100vh; background:var(--paper); color:var(--ink); font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size:var(--reader-size); line-height:1.68; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
    .read-progress { position:fixed; inset:0 auto auto 0; z-index:1000; width:0; height:2px; background:var(--ink); }
    .page { max-width:680px; margin:0 auto; padding:clamp(54px,7vw,80px) 22px 88px; }
    header { margin-bottom:48px; }
    h1 { max-width:620px; margin:0 0 16px; font-size:var(--reader-size); font-weight:500; letter-spacing:-.025em; line-height:1.02; text-transform:uppercase; text-wrap:balance; }
    .article-subtitle { max-width:560px; margin:0 0 14px; color:var(--ink); font-size:var(--reader-size); line-height:1.52; }
    .article-date { color:var(--ink); font-size:var(--reader-size); font-weight:500; letter-spacing:.1em; text-transform:uppercase; }
    .article-body { font-size:var(--reader-size); line-height:1.7; }
    .article-body p { margin:0 0 1.3em; }
    .article-body h2,.article-body h3,.article-body h4 { margin:2.4em 0 .8em; font-size:var(--reader-size); font-weight:500; line-height:1.3; }
    .article-body blockquote { margin:2em 0; padding-left:1em; border-left:1px solid var(--ink); color:var(--ink); }
    .article-body ul,.article-body ol { margin:0 0 1.3em 1.25em; }
    .article-body hr { border:0; border-top:1px solid var(--line); margin:2.6em 0; }
    .article-body figure { margin:2.25em 0; }
    .article-body img { display:block; width:100%; height:auto; }
    .article-body figcaption { margin-top:.65em; color:var(--ink); font-size:var(--reader-size); line-height:1.45; }
    .article-body a,.source-note a { color:var(--ink); text-decoration:underline; text-underline-offset:.16em; }
    .article-body ::selection { color:var(--paper); background:var(--ink); }
    .source-note { margin-top:4rem; color:var(--ink); font-size:var(--reader-size); line-height:1.55; }
    footer { margin-top:4rem; color:var(--ink); font-size:var(--reader-size); font-weight:500; letter-spacing:.1em; text-transform:uppercase; }
    @media (max-width:720px) { .page { padding:48px 18px 64px; } h1 { font-size:var(--reader-size); } }

/* One fixed type size for reading, navigation, headings, and card metadata. */
a { color: var(--ink); }
a:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
h1, h2, h3, button, a, span, p { font-size: var(--reader-size); }
h1 { line-height: 1.5; letter-spacing: .08em; }
.episode-page,
.essay-page { max-width: 680px; }
.episode-page .episode-header,
.essay-page .essay-header { margin-bottom: 48px; }
.episode-page .episode-header h1,
.essay-page .essay-header h1 {
  max-width: 620px;
  margin: 0 0 16px;
  font-size: clamp(1.6rem, 3.2vw, 2.64rem);
  line-height: 1.02;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.episode-page .article-body strong { font-weight: 700; }
.episode-page .article-body em { font-style: italic; }
.episode-page .article-body blockquote {
  margin: 2em 0;
  padding-left: 1em;
  border-left: 1px solid var(--ink);
}
.episode-page .article-body hr {
  border: 0;
  border-top: 1px solid var(--line);
  margin: 2.6em 0;
}
.language-content[lang="ko"] {
  word-break: keep-all;
}
.language-content[lang="ko"] .article-body,
.language-content[lang="ko"] .episode-pagination {
  font-family: "Apple SD Gothic Neo", "Noto Sans KR", "Helvetica Neue", Arial, sans-serif;
}
.language-content[lang="ko"] .article-body {
  line-height: 1.82;
}
.language-content[lang="ko"] .article-body p {
  margin-bottom: 1.45em;
}
.skip-link { position: fixed; top: -60px; left: 16px; z-index: 1001; background: #fff; padding: 8px; }
.skip-link:focus { top: 0; }
.eyebrow, .card-top, .card-meta, .section-heading, .episode-pagination { letter-spacing: .08em; text-transform: uppercase; }
.episode-header .eyebrow { display: block; margin-bottom: 16px; }
.episode-details { display: flex; align-items: baseline; gap: 14px; font-weight: 400; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
.story-language {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  font-size: var(--reader-size);
  letter-spacing: 0;
  text-transform: none;
}
.story-language button {
  appearance: none;
  border: 0;
  padding: 0;
  background: none;
  color: var(--ink);
  font: inherit;
  cursor: pointer;
  opacity: .42;
}
.story-language button[aria-pressed="true"] { opacity: 1; }
.story-language span { opacity: .28; }
.story-language button:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.collection-heading { margin-bottom: 32px; }
.collection-heading h1 { margin-bottom: 12px; }
.collection-description { max-width: 420px; margin: 0 0 12px; line-height: 1.6; }
.series-page { max-width: 1180px; }
.episode-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.episode-card { display: block; height: 100%; min-width: 0; color: inherit; text-decoration: none; transition: transform 160ms cubic-bezier(.23,1,.32,1); }
.episode-card:active { transform: scale(.985); }
.card-cover { display: grid; grid-template-rows: minmax(0, 1fr) auto; width: 100%; height: 100%; aspect-ratio: 3 / 4; min-height: 280px; overflow: hidden; border: 1px solid var(--ink); background: var(--paper); }
.card-media { min-height: 0; overflow: hidden; border-bottom: 1px solid var(--ink); background: var(--ink); }
.card-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.card-copy { display: grid; grid-template-rows: auto minmax(3.2em, auto) 3.2em; gap: 12px; min-height: 164px; padding: 14px 16px 16px; background: var(--paper); color: var(--ink); }
.card-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px; }
.card-title { align-self: start; margin: 0; line-height: 1.5; letter-spacing: .04em; font-weight: 500; text-transform: uppercase; }
.card-description { margin: 0; line-height: 1.6; }
.card-meta { display: flex; align-items: baseline; gap: 10px; min-height: 1.6em; line-height: 1.6; letter-spacing: 0; white-space: nowrap; --reader-size: 11px; }
.card-meta.is-empty { visibility: hidden; }
.card-location { letter-spacing: 0; }
.essay-card .card-cover { display: flex; flex-direction: column; padding: 16px; }
.essay-card .card-title { margin-top: auto; }
.essay-card .card-meta { margin-top: 20px; }
.series-card-copy { grid-template-rows: auto auto minmax(3.2em, auto) 3.2em; }
.read-section .episode-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.read-section + .read-section { margin-top: 48px; }
.section-heading { margin-bottom: 16px; }
.section-heading h2 { font-weight: 500; }
.episode-pagination { display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid var(--ink); margin-top: 4rem; padding-top: 20px; }
.episode-pagination a { text-decoration: none; max-width: 48%; }
.episode-pagination a:last-child { margin-left: auto; text-align: right; }
.next-title { display: block; letter-spacing: 0; text-transform: none; }
@media (hover:hover) and (pointer:fine) {
  .episode-card:hover .card-cover { border-color: var(--ink); }
  .episode-card:hover .card-copy,
  .series-card:hover .card-cover,
  .essay-card:hover .card-cover { background: var(--ink); color: var(--paper); }
}
@media (max-width:1000px) { .episode-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width:720px) {
  :root { --reader-size: 11px; }
  .page { padding: 36px 18px 56px; }
  .episode-page, .essay-page { --reader-size: 14px; }
  .episode-page .article-body, .essay-page .article-body { line-height: 1.75; overflow-wrap: break-word; }
  .episode-details { --reader-size: 12px; font-size: 12px; gap: 12px; letter-spacing: 0; }
  .story-language button { min-height: 36px; }
  .story-language { margin-top: 18px; }
  .collection-heading { margin-bottom: 24px; }
  .collection-description { line-height: 1.5; }
  .episode-grid,
  .read-section .episode-grid { grid-template-columns: minmax(0, 320px); gap: 12px; justify-content: start; }
  .card-cover { min-height: 0; }
  .card-copy { grid-template-rows: auto minmax(2.8em, auto) auto; gap: 8px; min-height: 116px; padding: 10px; }
  .card-title { line-height: 1.35; }
  .card-meta { min-height: 1.45em; gap: 10px; line-height: 1.45; }
  .series-card-copy { grid-template-rows: auto auto minmax(2.8em, auto) auto; }
  .essay-card .card-cover { padding: 10px; }
  .card-title { overflow-wrap: anywhere; }
  .card-meta { letter-spacing: 0; }
  .episode-page .episode-header h1,
  .essay-page .essay-header h1 { font-size: clamp(1.4rem, 7vw, 1.9rem); }
}
