:root {
  --sans:
    "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", Arial, sans-serif;
  --acid-on-light: #465d00;
  --signal-on-light: #8a211c;
  --editorial-note-ink: #160a07;
  --editorial-note-emphasis: #fff8e8;
  --off-white: #fffaf0;
  --blush: #f1d7d0;
}

.edition-item > span,
.edition-item > a,
.atlas-steps b,
.article-head:before,
.article-visual:after,
.article-content > p:first-of-type::first-letter {
  color: var(--signal-on-light);
}
.atlas-intro em,
.index-heading em,
.section-intro em {
  color: var(--acid-on-light);
}
.editorial-note {
  color: var(--editorial-note-ink);
}
.editorial-note h2 em {
  color: var(--editorial-note-emphasis);
}

.atlas-icons {
  display: flex;
  width: min(100%, 250px);
  gap: 0.7rem;
  align-items: center;
  mix-blend-mode: normal;
}
.atlas-icon {
  position: relative;
  display: block;
  flex: 1;
  aspect-ratio: 1;
  overflow: hidden;
}
.atlas-icon img {
  position: absolute;
  width: 300%;
  height: 200%;
  max-width: none;
  object-fit: fill;
}
.atlas-icon-material img {
  left: 0;
  top: 0;
}
.atlas-icon-silhouette img {
  left: -100%;
  top: 0;
}
.atlas-icon-occasion img {
  left: -200%;
  top: 0;
}

html.js-ready [data-reveal] {
  opacity: 0;
  transform: translateY(24px);
}
html.js-ready [data-reveal].is-visible,
html:not(.js-ready) [data-reveal] {
  opacity: 1;
  transform: none;
}
html.js-ready .art-cover {
  animation: atelier-page-reveal 0.8s cubic-bezier(0.2, 0.75, 0.3, 1) both;
}
@keyframes atelier-page-reveal {
  from {
    clip-path: inset(0 0 100% 0);
    opacity: 0.5;
  }
  to {
    clip-path: inset(0);
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  html.js-ready [data-reveal] {
    opacity: 1;
    transform: none;
  }
  html.js-ready .art-cover {
    animation: none;
    clip-path: none;
    opacity: 1;
  }
}

/* Text, not translucent blocks, carries the editorial emphasis. */
.title-accent {
  position: relative;
  display: inline;
  color: var(--signal-on-light);
  background: transparent;
  font-style: normal;
  padding: 0 0.025em 0.09em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  text-decoration: none;
}
.title-accent::after {
  content: "";
  position: absolute;
  left: 0.04em;
  right: 0.04em;
  bottom: 0.005em;
  height: 2px;
  background: currentColor;
  transform: scaleX(0.82);
  transform-origin: left center;
  opacity: 0.88;
}
.cover-copy .title-accent,
.lead-spread .title-accent,
.editorial-note .title-accent,
.edition-index .title-accent,
.choice-atlas .title-accent,
.ledger-grid .title-accent {
  background: transparent;
  padding: 0 0.025em 0.09em;
}
.cover-copy .title-accent,
.lead-spread .title-accent {
  color: var(--acid);
}
.editorial-note .title-accent {
  color: var(--editorial-note-emphasis);
}
.edition-index .title-accent,
.choice-atlas .title-accent,
.ledger-grid .title-accent {
  color: var(--signal-on-light);
}

/* Magazine scale remains, while Korean glyphs retain a dependable line box. */
.cover-copy h1,
.index-heading h2,
.atlas-intro h2,
.section-intro h2,
.lead-content h2,
.empty-lead-copy h2,
.editorial-note h2,
.article-head h1 {
  hyphens: none;
  line-height: 1.1;
  letter-spacing: -0.055em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.art-cover {
  grid-template-columns: 46px minmax(0, 1.38fr) minmax(340px, 0.85fr) minmax(
      170px,
      0.4fr
    );
}
.cover-copy {
  padding-inline: clamp(2rem, 4.5vw, 4.5rem);
}
.cover-copy h1 {
  max-width: 7.2ch;
  font-size: clamp(3.35rem, 5vw, 5.15rem);
  line-height: 1.08;
  margin-block: 0.34em 0.42em;
}
.index-heading h2,
.atlas-intro h2,
.section-intro h2 {
  max-width: 9.5ch;
  font-size: clamp(3rem, 5vw, 5.7rem);
  line-height: 1.1;
}
.lead-content h2,
.empty-lead-copy h2 {
  max-width: 10ch;
  font-size: clamp(2.6rem, 4.15vw, 4.65rem);
  line-height: 1.1;
}
.editorial-note {
  gap: clamp(2.25rem, 6vw, 6rem);
}
.editorial-note h2 {
  max-width: 8.3ch;
  font-size: clamp(3rem, 5.2vw, 5.45rem);
  line-height: 1.12;
  margin: 0.14em 0 0;
}
.article-head h1 {
  max-width: 12.5ch;
  font-size: clamp(3rem, 6vw, 5.9rem);
  line-height: 1.11;
  margin-block: 0.22em 0.38em;
}

.cover-copy > p:not(.kicker),
.lead-content p,
.spread-meta > p:last-child {
  color: var(--off-white);
}
.edition-item p,
.atlas-steps span {
  color: #353530;
}
.ledger-card p,
.archive-head p,
.not-found p {
  color: #45433e;
}

@media (min-width: 701px) and (max-width: 1100px) {
  .art-cover {
    grid-template-columns: 46px minmax(0, 1fr) minmax(250px, 0.78fr);
  }
  .cover-copy {
    padding-inline: clamp(1.75rem, 4vw, 3.25rem);
  }
  .cover-copy h1 {
    max-width: 6.7ch;
    font-size: clamp(3.25rem, 6.55vw, 4.55rem);
  }
  .cover-note {
    grid-column: 2 / 4;
    min-height: 166px;
  }
  .index-heading h2,
  .atlas-intro h2,
  .section-intro h2 {
    font-size: clamp(2.8rem, 5.65vw, 4.65rem);
  }
  .editorial-note h2 {
    max-width: 9.4ch;
    font-size: clamp(2.9rem, 5.6vw, 4.45rem);
  }
}

@media (max-width: 700px) {
  .cover-copy h1,
  .index-heading h2,
  .atlas-intro h2,
  .section-intro h2,
  .lead-content h2,
  .empty-lead-copy h2,
  .editorial-note h2,
  .article-head h1 {
    line-height: 1.13;
    letter-spacing: -0.045em;
    text-wrap: pretty;
  }
  .cover-copy {
    min-height: 0;
    padding-block: 3.7rem 3.35rem;
  }
  .cover-copy h1 {
    max-width: 6.5ch;
    font-size: clamp(2.95rem, 13.1vw, 3.65rem);
  }
  .index-heading h2,
  .atlas-intro h2,
  .section-intro h2 {
    max-width: 8.6ch;
    font-size: clamp(2.7rem, 12.4vw, 3.7rem);
  }
  .lead-content h2,
  .empty-lead-copy h2 {
    max-width: 8.8ch;
    font-size: clamp(2.6rem, 12vw, 3.45rem);
  }
  .editorial-note h2 {
    max-width: 9.5ch;
    font-size: clamp(2.75rem, 12.8vw, 3.65rem);
  }
  .article-head h1 {
    max-width: 10.5ch;
    font-size: clamp(2.7rem, 12.3vw, 3.65rem);
  }
  .title-accent::after {
    height: 1px;
    bottom: 0.04em;
  }
}

/* 내비게이션과 글 상세의 외곽 프레임을 맞추고 읽기 여백은 글 안쪽에서 유지한다. */
:root{--article-frame:1280px;--article-reading:72ch}
.article-wrap{width:min(var(--article-frame),100%);max-width:none;padding-inline:0}
.ledger-article{width:calc(100% - 56px);margin-inline:auto}
.ledger-article>.article-head,.ledger-article>.partner-note,.ledger-article>.article-content,.ledger-article>.article-foot,.ledger-article~.comments-area{max-width:var(--article-reading);margin-inline:auto}
.article-head h1{max-width:17ch;font-size:clamp(2.45rem,4.2vw,4.65rem);line-height:1.13;letter-spacing:-.065em;text-wrap:balance}
.article-deck{max-width:62ch;font-size:clamp(1rem,1.35vw,1.14rem);line-height:1.75}
.article-content{font-size:clamp(1rem,1.16vw,1.125rem);line-height:1.9}
.article-content h2{margin:3.25rem 0 1rem;font-family:var(--display);font-size:clamp(1.65rem,2.35vw,2.35rem);line-height:1.3;letter-spacing:-.045em}
.article-content h3{margin:2.2rem 0 .7rem;font-family:var(--display);font-size:clamp(1.2rem,1.65vw,1.5rem);line-height:1.45;letter-spacing:-.035em}
.article-content blockquote{margin:2rem 0;padding:1.35rem 0;border-top:3px solid var(--signal);border-bottom:1px solid var(--line);background:transparent;color:var(--ink);font-family:var(--display);font-size:clamp(1.18rem,1.8vw,1.5rem);line-height:1.5}.article-content blockquote p{margin:.2rem 0}.article-content blockquote cite{display:block;margin-top:.9rem;color:#62594f;font-family:var(--sans);font-size:.75rem;font-style:normal;letter-spacing:.04em}
.article-content table{display:block;width:100%;max-width:100%;margin:1.65rem 0;overflow-x:auto;border:1px solid var(--ink);border-collapse:separate;border-spacing:0;background:transparent;font-size:.92em;line-height:1.55;-webkit-overflow-scrolling:touch}
.article-content .fm-table-wrap{max-width:100%;margin:1.65rem 0;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
.article-content .fm-table-wrap table{display:table;width:max-content;min-width:100%;max-width:none;margin:0;overflow:visible}
.article-content caption{padding:.82rem 0;border-bottom:1px solid var(--ink);background:transparent;color:var(--signal-on-light);font-size:.84rem;font-weight:800;text-align:left;caption-side:top}.article-content thead{background:var(--ink);color:var(--cream)}.article-content th,.article-content td{min-width:9.5rem;padding:.78rem .9rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.article-content th:last-child,.article-content td:last-child{border-right:0}.article-content tbody tr:last-child td{border-bottom:0}.article-content tbody tr:nth-child(even){background:transparent}
.partner-note{margin-top:1.1rem!important;margin-bottom:1.8rem!important;padding:0!important;border:0!important;background:transparent!important;color:#6b645b!important;font-size:.78rem!important;line-height:1.65!important}.partner-note p{margin:0!important;color:inherit!important}.partner-note strong,.partner-note>span{display:none!important}

/* 면으로 칠한 강조 대신 포인트 색과 편집선으로 정보 위계를 만든다. */
.article-content .fm-summary,
.article-content .fm-product-card{
  padding:1.5rem 0;
  border:0;
  border-top:3px solid var(--signal-on-light);
  border-bottom:1px solid var(--line);
  background:transparent;
  color:var(--ink);
  box-shadow:none;
}
.article-content .fm-summary::after{display:none}
.article-content .fm-summary h2,
.article-content .fm-product-card h2{color:var(--signal-on-light)}
.article-content .fm-infographic{
  border:0;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  background:transparent;
}
.article-content .fm-infographic figcaption{
  padding:.9rem 0;
  background:transparent;
}

@media(min-width:701px) and (max-width:1095px){.article-visual{margin-inline:0}}
@media(max-width:700px){.article-wrap{width:100%;padding-block:3rem}.ledger-article{width:calc(100% - 44px)}.article-head h1{max-width:100%;font-size:clamp(2rem,9.6vw,3rem);line-height:1.18}.article-content h2{margin-top:2.65rem;font-size:clamp(1.5rem,7.1vw,1.9rem)}.article-content table{font-size:.88rem}.article-content th,.article-content td{min-width:8.2rem;padding:.7rem .75rem}}