/* Vox-informed editorial hierarchy, KUN identity. Print-like light theme retained.
   Scoped to home/articles: directories, forms and safety states are untouched. */
.reader-experience {
  --reader-ink: #161616;
  --reader-muted: #55554f;
  --reader-rule: #d9d9d2;
  --reader-paper: #f5f5f0;
  --reader-yellow: #f5dc3d;
}
.reader-experience [hidden] { display: none !important; }
.reader-experience :is(a, button, summary, [tabindex]):focus-visible { outline: 3px solid var(--reader-ink); outline-offset: 4px; }
.reader-experience :is(h1, h2, h3) { overflow-wrap: anywhere; text-wrap: pretty; }
.reader-experience :is(.reader-card, .reader-prose, .reader-heading) { min-width: 0; }
.reader-experience :is(.reader-card h1, .reader-card h3) a { color: inherit; text-decoration: none; }
.reader-experience :is(.reader-card h1, .reader-card h3) a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; }
.reader-experience .reader-front { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 2.5rem; padding-top: 2rem; }
.reader-experience .reader-card-image { display: block; overflow: hidden; }
.reader-experience .reader-card img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.reader-experience .reader-lead img { aspect-ratio: 16 / 9; }
.reader-experience .reader-card .reader-topic { margin: 1rem 0 .5rem; font-size: .8rem; font-weight: 700; line-height: 1.4; }
.reader-experience .reader-lead h1 { margin: 0; font-size: clamp(2rem, 3.1vw, 3rem); font-weight: 850; line-height: 1.08; letter-spacing: -.035em; }
.reader-experience .reader-deck { color: var(--reader-muted); font-size: 1.1rem; line-height: 1.6; margin-block: .85rem; }
.reader-experience .reader-date { color: var(--reader-muted); font-size: .78rem; line-height: 1.5; margin: .85rem 0 0; }
.reader-experience .reader-support { border-left: 1px solid var(--reader-rule); padding-left: 2rem; }
.reader-experience .reader-support > h2 { margin: 0 0 1.25rem; font-size: 1.1rem; line-height: 1.35; }
.reader-experience .reader-support .reader-card { padding-block: 0 1.5rem; }
.reader-experience .reader-support .reader-card + .reader-card { border-top: 1px solid var(--reader-rule); padding-top: 1.5rem; }
.reader-experience .reader-card h3 { font-size: 1.4rem; line-height: 1.2; font-weight: 800; letter-spacing: -.025em; margin: 0; }
.reader-experience .reader-art-note { font-size: .75rem; color: var(--reader-muted); margin: 1rem 0 2rem; }
.reader-experience .reader-section { border-top: 4px solid var(--reader-ink); padding-block: 1.5rem 2.5rem; }
.reader-experience :is(.reader-section, .reader-related) > h2 { font-size: 1.8rem; line-height: 1.2; font-weight: 800; letter-spacing: -.035em; margin: 0 0 1.5rem; }
.reader-experience .reader-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem; }
.reader-experience .reader-features .reader-card + .reader-card { border-left: 1px solid var(--reader-rule); padding-left: 2.5rem; }
.reader-experience .reader-features h3 { font-size: 1.7rem; }
/* A single house promotion between complete story rows; no extra runtime. */
.reader-experience .reader-jobs-promo { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 2rem; align-items: center; padding: 2.5rem; margin-block: .5rem; background: var(--reader-yellow); color: var(--reader-ink); border-block: 2px solid var(--reader-ink); }
.reader-experience .reader-jobs-promo > div { min-width: 0; }
.reader-experience .reader-jobs-brand { font-size: 1rem; font-weight: 800; margin: 0 0 1rem; }
.reader-experience .reader-jobs-promo h2 { max-width: 23ch; font-size: clamp(1.8rem, 3vw, 2.75rem); line-height: 1.1; letter-spacing: -.035em; font-weight: 850; margin: 0; text-wrap: balance; }
.reader-experience .reader-jobs-description { max-width: 52ch; margin: 1rem 0 0; font-size: 1rem; line-height: 1.65; }
.reader-experience .reader-jobs-action { justify-self: end; }
.reader-experience .reader-jobs-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 48px; padding: 1rem 1.25rem; border: 2px solid var(--reader-ink); border-radius: 0; background: var(--reader-ink); color: var(--reader-yellow); font-size: 1rem; line-height: 1.4; font-weight: 750; text-decoration: none; touch-action: manipulation; }
.reader-experience .reader-jobs-link:hover { color: var(--reader-ink); background: transparent; text-decoration: underline; text-underline-offset: .2em; }
.reader-experience .reader-jobs-link:focus-visible { outline: 3px solid var(--reader-ink); outline-offset: 4px; }
.reader-experience .reader-jobs-link:active { text-decoration: underline; }
.reader-experience .reader-jobs-action p { font-size: .8rem; line-height: 1.5; margin: .75rem 0 0; overflow-wrap: anywhere; }
html[lang="ko"] .reader-jobs-promo { word-break: keep-all; overflow-wrap: anywhere; }
@media (max-width: 767px) {
  .reader-experience .reader-jobs-promo { grid-template-columns: 1fr; gap: 1.5rem; padding: 1.5rem; }
  .reader-experience .reader-jobs-action { justify-self: stretch; }
  .reader-experience .reader-jobs-link { width: 100%; box-sizing: border-box; gap: .75rem; }
}
@media print { .reader-experience .reader-jobs-promo { display: none; } }
.reader-experience .reader-essentials .reader-list { grid-template-columns: 1fr; gap: 1rem; }
.reader-experience .reader-essentials .reader-card { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 1.5rem; border-bottom: 1px solid var(--reader-rule); padding-bottom: 1rem; }
.reader-experience .reader-essentials .reader-card:not(.has-art) { grid-template-columns: 1fr; }
.reader-experience .reader-essentials .reader-topic { margin-top: 0; }
.reader-experience .reader-essentials h3 { max-width: 40ch; }
.reader-experience .reader-heading { max-width: 64rem; padding-block: 2.5rem 1.5rem; }
.reader-experience .reader-topics { font-size: .82rem; font-weight: 700; line-height: 1.6; }
.reader-experience .reader-topics :is(nav, p) { margin: 0; font-size: inherit; }
.reader-experience .reader-heading h1 { font-size: clamp(2.2rem, 4vw, 3.75rem); font-weight: 850; max-width: 29ch; line-height: 1.08; letter-spacing: -.035em; margin: .85rem 0 1rem; }
.reader-experience .reader-heading .reader-deck { max-width: 55rem; font-size: 1.25rem; line-height: 1.55; }
.reader-experience .reader-meta { border-top: 1px solid var(--reader-rule); padding-top: 1rem; margin-top: 1.4rem; }
.reader-experience .reader-meta p { margin: .35rem 0; color: var(--reader-muted); font-size: .82rem; line-height: 1.6; }
.reader-experience .reader-meta .article-byline { border: 0; padding: 0; }
.reader-experience .reader-actions { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: 1rem; align-items: center; }
.reader-experience .reader-actions button { background: #fff; color: var(--reader-ink); font: inherit; font-size: .85rem; font-weight: 650; min-height: 44px; padding: .5rem 1rem; border: 1px solid var(--reader-ink); cursor: pointer; border-radius: 0; }
.reader-experience .reader-actions button:hover { background: var(--reader-yellow); }
.reader-experience .reader-actions [role="status"] { font-size: .85rem; flex-basis: 100%; }
.reader-experience .reader-actions [role="status"]:empty { display: none; }
.reader-experience .reader-art { width: min(calc(100% - 2.5rem), 64rem); margin: 0 auto 2.5rem; }
.reader-experience .reader-art img { display: block; width: 100%; height: auto; max-height: 35rem; object-fit: contain; background: var(--reader-paper); }
.reader-experience .reader-art figcaption { font-size: .75rem; line-height: 1.5; margin-top: .65rem; color: var(--reader-muted); }
.reader-experience .reader-layout { display: grid; grid-template-columns: minmax(9rem, 1fr) minmax(0, 42rem) minmax(0, 1fr); gap: 2.5rem; padding-block: 1rem 3rem; align-items: start; }
.reader-experience .reader-prose { font-size: 1.125rem; line-height: 1.85; color: var(--reader-ink); }
html[lang="ko"] .reader-experience :is(.reader-prose, .reader-heading h1, .reader-card h1, .reader-card h3) { word-break: keep-all; overflow-wrap: anywhere; }
html[lang="en"] .reader-experience .reader-prose { font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; line-height: 1.7; }
.reader-experience .reader-prose :is(p, li) { font-size: inherit; line-height: inherit; font-family: inherit; }
.reader-experience .reader-prose p { margin: 0 0 1.25rem; }
.reader-experience .reader-prose :is(h2, h3) { font-family: var(--font-sans); font-weight: 800; line-height: 1.3; letter-spacing: -.02em; scroll-margin-top: 1.5rem; }
.reader-experience .reader-prose h2 { font-size: 1.65rem; margin: 2.5rem 0 1rem; }
.reader-experience .reader-prose h3 { font-size: 1.3rem; margin: 2rem 0 1rem; }
.reader-experience .reader-prose > section:first-child > h2:first-child { margin-top: 0; }
.reader-experience .reader-prose a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .16em; overflow-wrap: anywhere; }
.reader-experience .reader-prose :is(ul, ol) { padding-left: 1.5rem; }
.reader-experience .reader-prose li { margin-block: .65rem; }
.reader-experience .reader-prose blockquote { border-left: 5px solid var(--reader-yellow); background: var(--reader-paper); margin: 1.5rem 0; padding: 1.5rem; }
.reader-experience .reader-prose blockquote p:last-child { margin-bottom: 0; }
.reader-experience .reader-prose code { font-family: var(--font-sans); font-size: .9em; background: var(--reader-paper); overflow-wrap: anywhere; }
.reader-experience .reader-prose :is(aside, .notice, .audit-next-step) { font-family: var(--font-sans); font-size: 1rem; border: 1px solid var(--reader-rule); border-left: 5px solid var(--reader-yellow); padding: 1.25rem; }
.reader-experience .reader-table { overflow-x: auto; margin-block: 1.5rem .5rem; max-width: 100%; }
.reader-experience .reader-table table { border-collapse: collapse; width: 100%; min-width: 34rem; font-family: var(--font-sans); font-size: .94rem; line-height: 1.6; }
.reader-experience .reader-table :is(th, td) { border-bottom: 1px solid var(--reader-rule); text-align: left; vertical-align: top; padding: .85rem; }
.reader-experience .reader-table th { background: var(--reader-paper); font-weight: 750; }
.reader-experience .reader-prose .reader-table-hint { font-family: var(--font-sans); font-size: .8rem; color: var(--reader-muted); }
.reader-experience .reader-toc { position: sticky; top: 1.5rem; font-size: .85rem; line-height: 1.5; }
.reader-experience .reader-toc details { border: 0; border-top: 4px solid var(--reader-ink); padding: .8rem 0; }
.reader-experience .reader-toc summary { min-height: 44px; display: list-item; cursor: pointer; font-size: 1rem; font-weight: 750; }
.reader-experience .reader-toc ol { list-style: none; padding: 0; margin: .5rem 0 0; max-height: 65vh; overflow-y: auto; }
.reader-experience .reader-toc li { margin: 0; padding-block: .6rem; border-top: 1px solid var(--reader-rule); }
.reader-experience .reader-toc a { color: var(--reader-muted); text-decoration: none; display: block; padding: .2rem; }
.reader-experience .reader-toc a:hover { color: var(--reader-ink); text-decoration: underline; }
.reader-experience .reader-layout .article-aside { font-size: .82rem; margin: 0; }
.reader-experience .reader-related { padding-block: 1.5rem 2.5rem; border-top: 4px solid var(--reader-ink); }
.reader-experience .reader-related .reader-card { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 1rem; }
.reader-experience .reader-related .reader-card:not(.has-art) { grid-template-columns: 1fr; }
.reader-experience .reader-related .reader-topic { margin-top: 0; }
@media (min-width: 768px) and (max-width: 1100px) {
  .reader-experience .reader-layout { grid-template-columns: 11rem minmax(0, 1fr); gap: 2rem; }
  .reader-experience .reader-layout .article-aside { grid-column: 2; }
  .reader-experience .reader-front { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 1.5rem; }
  .reader-experience .reader-support { padding-left: 1.5rem; }
}
@media (max-width: 767px) {
  .reader-experience .reader-front { display: block; padding-top: 1.25rem; }
  .reader-experience .reader-lead h1 { font-size: 2rem; line-height: 1.12; }
  .reader-experience .reader-support { border-left: 0; border-top: 1px solid var(--reader-rule); padding: 1.25rem 0 0; margin-top: 1.5rem; }
  .reader-experience .reader-support .reader-card { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 1rem; }
  .reader-experience .reader-support .reader-card:not(.has-art) { grid-template-columns: 1fr; }
  .reader-experience .reader-support .reader-topic { margin-top: 0; font-size: .75rem; }
  .reader-experience .reader-card h3 { font-size: 1.2rem; }
  .reader-experience .reader-list { grid-template-columns: 1fr; gap: 1.5rem; }
  .reader-experience .reader-features .reader-card + .reader-card { border-left: 0; border-top: 1px solid var(--reader-rule); padding: 1.5rem 0 0; }
  .reader-experience .reader-features h3 { font-size: 1.5rem; }
  .reader-experience .reader-essentials .reader-card { grid-template-columns: 96px minmax(0, 1fr); gap: 1rem; }
  .reader-experience .reader-heading { padding-block: 1.5rem; }
  .reader-experience .reader-heading h1 { font-size: 2.2rem; line-height: 1.12; }
  .reader-experience .reader-heading .reader-deck { font-size: 1.1rem; }
  .reader-experience .reader-art { margin-bottom: 1.5rem; }
  .reader-experience .reader-layout { display: flex; flex-direction: column; gap: 1.5rem; padding-top: 0; }
  .reader-experience .reader-layout > * { width: 100%; }
  .reader-experience .reader-toc { position: static; }
  .reader-experience .reader-toc ol { max-height: none; }
  .reader-experience .reader-prose { font-size: 1.1rem; }
  html[lang="en"] .reader-experience .reader-prose { font-size: 1.15rem; }
  .reader-experience .reader-prose h2 { font-size: 1.45rem; }
}
@media (prefers-reduced-motion: reduce) { .reader-experience * { scroll-behavior: auto; animation: none; transition: none; } }
@media print {
  .reader-experience :is(.editorial-header, .reader-actions, .reader-toc, .reader-related, .site-footer) { display: none !important; }
  .reader-experience .reader-layout { display: block; }
  .reader-experience :is(.reader-layout, .reader-heading) { width: 100%; max-width: none; }
  .reader-experience .reader-prose { font-size: 11pt !important; }
  .reader-experience .reader-table { overflow: visible; }
  .reader-experience .reader-table table { min-width: 0; font-size: 9pt; }
  .reader-experience .reader-art { max-width: 28rem; }
  .reader-experience :is(h1, h2, h3) { break-after: avoid; }
}
