/* 레전드 이야기 전용 CSS (2026-10-18)
 * 기존 게임과 custom.css는 수정하지 않습니다.
 * 01 목록 / 02 본문 / 03 자료·관련 글 / 04 모바일
 */

/* 01 · 목록: 기존 갈색 팔레트와 읽을거리 폭을 따릅니다. */
.legend-index,.legend-article { width:calc(100% - 32px); max-width:880px; margin:28px auto; box-sizing:border-box; }
.legend-index .legend-heading,.legend-article .legend-heading { height:auto; min-height:0; display:block; padding:0 0 25px; border:0; }
.legend-heading h1 { font-size:clamp(25px,3vw,38px); line-height:1.4; letter-spacing:-1px; word-break:keep-all; overflow-wrap:anywhere; }
.legend-heading .intro { max-width:700px; margin:14px 0 0; line-height:1.8; }
.legend-index-note { color:var(--muted); font-size:12px; line-height:1.8; margin-top:14px; }
.legend-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.legend-list-item { position:relative; min-width:0; display:flex; flex-direction:column; padding:23px; border:1px solid #aa865245; border-radius:12px; background:linear-gradient(140deg,#3e2d21b8,#271d17db); }
.legend-meta { display:flex; flex-wrap:wrap; align-items:center; gap:7px 14px; font-size:10px; color:#b49e81; letter-spacing:.2px; }
.legend-meta > span:first-child { color:#d3b77f; }
.legend-list-item h2 { font-size:19px; line-height:1.55; letter-spacing:-.4px; margin:13px 0 10px; word-break:keep-all; overflow-wrap:anywhere; }
.legend-list-item h2 a { text-decoration:none; color:#ead7b6; }
.legend-list-item h2 a:hover { color:#f3ce85; }
.legend-list-item p { font-size:12px; line-height:1.85; color:#bca98f; margin:0 0 22px; word-break:keep-all; overflow-wrap:anywhere; }
.legend-read-link { margin-top:auto; font-size:11px; color:#d0b78c; text-underline-offset:4px; align-self:flex-start; }
.legend-bottom-link { margin:28px 0 0; text-align:center; font-size:13px; color:#d5b580; }

/* 02 · 상세 글: 게임용 header 스타일이 본문에 섞이지 않도록 범위를 지정. */
.legend-breadcrumb { display:flex; flex-wrap:wrap; justify-content:flex-start; gap:9px; margin-bottom:26px; font-size:11px; color:#b49e81; }
.legend-article .legend-heading { border-bottom:1px solid #c19c6240; margin-bottom:28px; }
.legend-article .legend-heading h1 { margin:16px 0 0; }
.legend-body { color:#d5c4aa; }
.legend-article .legend-body p { font-size:15px; line-height:1.95; word-break:keep-all; overflow-wrap:anywhere; margin:0 0 17px; }
.legend-body section { margin-top:36px; }
.legend-article .legend-body h2 { font-size:22px; line-height:1.5; color:#e4c28f; margin:0 0 16px; letter-spacing:-.5px; word-break:keep-all; }
.legend-player-notes { padding-left:24px; }
.legend-player-notes li { padding-left:6px; margin:0 0 22px; }
.legend-player-notes li::marker { color:#b99866; font-size:12px; }
.legend-player-notes h3 { font-size:16px; color:#e4ccaa; margin:0 0 7px; line-height:1.6; }
.legend-player-notes p { font-size:14px; }
.legend-lineup { display:grid; gap:0; border:1px solid #ad875342; border-radius:10px; overflow:hidden; margin:20px 0; }
.legend-lineup > div { display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:6px 12px; align-items:center; padding:15px; background:#251b15a0; }
.legend-lineup > div + div { border-top:1px solid #ad87532b; }
.legend-lineup > div > span { color:#d4af72; font-size:11px; }
.legend-lineup strong { font-size:14px; }
.legend-lineup small { font-size:10px; color:#bba58b; }
.legend-lineup p { grid-column:2/-1; font-size:12px; color:#bda98e; margin:0; line-height:1.8; }
.legend-table-wrap { max-width:100%; overflow-x:auto; margin:22px 0; }
.legend-table-wrap table { width:100%; border-collapse:collapse; font-size:12px; }
.legend-table-wrap caption { text-align:left; color:#c7ae87; margin-bottom:10px; line-height:1.6; }
.legend-table-wrap th,.legend-table-wrap td { padding:11px 9px; text-align:left; border-bottom:1px solid #c29b6336; white-space:nowrap; }
.legend-table-wrap th { color:#d9bd91; }

/* 03 · 출처와 관련 글은 본문보다 한 톤 낮게. */
.legend-sources { margin-top:36px; padding:22px; background:#211812a0; border:1px solid #ba93542b; border-radius:10px; }
.legend-sources h2,.legend-context h2,.legend-related h2 { font-size:15px; line-height:1.6; color:#d4b68b; margin:0 0 12px; }
.legend-sources p,.legend-sources li { font-size:11px; line-height:1.9; color:#b5a087; overflow-wrap:anywhere; }
.legend-sources ul { padding-left:17px; margin-bottom:0; }
.legend-sources li + li { margin-top:9px; }
.legend-sources li span { display:block; color:#a28e76; }
.legend-sources a,.legend-context a { text-underline-offset:3px; }
.legend-context { display:block; margin:28px 0; }
.legend-context ul { display:flex; flex-wrap:wrap; gap:10px 20px; padding:0; list-style:none; font-size:12px; color:#c5ac86; }
.legend-related { margin-top:34px; padding-top:25px; border-top:1px solid #b9945e38; }
.legend-related > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.legend-related a { padding:15px; border:1px solid #b9945e38; border-radius:9px; background:#2b2018; text-decoration:none; }
.legend-related small { display:block; color:#ac9475; font-size:10px; margin-bottom:8px; }
.legend-related strong { display:block; color:#d8c1a0; font-size:12px; line-height:1.7; word-break:keep-all; overflow-wrap:anywhere; }
.legend-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-top:28px; font-size:12px; }
.legend-not-found { min-height:360px; }

/* 04 · 모바일: 제목과 문단 여백은 유지하고 열 수만 줄입니다. */
@media(max-width:760px) {
  .legend-index,.legend-article { width:calc(100% - 24px); margin:18px auto; padding:25px 19px 34px; }
  .legend-heading h1 { font-size:26px; }
  .legend-list { grid-template-columns:1fr; gap:12px; }
  .legend-list-item { padding:20px; }
  .legend-list-item h2 { font-size:18px; }
  .legend-article .legend-body p { font-size:14px; line-height:1.95; }
  .legend-article .legend-body h2 { font-size:20px; }
  .legend-related > div { grid-template-columns:1fr; }
  .legend-sources { padding:18px 15px; }
  .legend-lineup > div { grid-template-columns:25px minmax(0,1fr); padding:13px; }
  .legend-lineup small { grid-column:2; }
  .legend-breadcrumb { margin-bottom:20px; }
}

