/*
Theme Name: 3KDEX
Description: 3KDEX(3kdex.com) 삼국지 도감 — 독립 테마(부모 테마 없음). 쪽 틀 · 디자인(테마 7종 · 스킨 21벌) · 4개국어 화면. 데이터는 3KDEX Core 플러그인.
Version: 0.28.5
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: 3kdex
*/

/*
 * 정식 스킨 1차(0.26.0) — 시안 01 판정(답변 4~5) 반영. 모든 값은 토큰 var(--kx-*)만 쓴다(16진 색·rgb·모서리 직접 기입 없음 — 점검 도구 기준).
 * 순서: 0 바탕 → 1 쪽 틀 → 2 공용 구성요소 → 3 헤더 → 4 푸터 → 5 홈 → 6 목록 → 7 상세 → 8 원전 리딩 → 9 검색·404 → 10 좁은 화면
 * 글자 크기는 7단 토큰(--kx-fs--1 ~ fs-5)만 쓴다. 폭은 --kx-wrap · 일반 글 한 줄은 --kx-measure(리딩 본문은 0.28.1부터 칸 폭 전체) · 오른쪽 칸은 --kx-side.
 * 단추·입력칸·쪽 번호·메뉴는 --kx-tap(44px) 이상. 칩(회차·인물 목록)은 32px(좁은 화면 36px) — WCAG 2.5.8 최소 24px 충족.
 */

/* ===== 0. 바탕 — 초기화 · 폼 · 표 · 선택 상자 (독립 테마 — 부모 테마 CSS 없음) ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background-color: var(--kx-bg); color: var(--kx-ink); font-family: var(--kx-font-sans); font-size: var(--kx-fs-0); line-height: var(--kx-lh); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .5em; font-weight: 700; line-height: 1.3; color: var(--kx-ink); }
p, ul, ol, dl, figure, blockquote, pre, table { margin: 0 0 var(--kx-sp-4); }
ul, ol { padding-left: 1.4em; }
li > ul, li > ol { margin-bottom: 0; }
img, svg, video, iframe { max-width: 100%; height: auto; }
hr { height: 0; margin: var(--kx-sp-5) 0; border: 0; border-top: 1px solid var(--kx-line); }
small { font-size: var(--kx-fs--1); }
table { width: 100%; border-collapse: collapse; }
th { text-align: left; }
button, input, select, textarea { margin: 0; font: inherit; color: inherit; }
button { cursor: pointer; }
input[type=search] { -webkit-appearance: none; appearance: none; }
input[type=search]::-webkit-search-decoration { -webkit-appearance: none; }
select { -webkit-appearance: none; appearance: none; padding-right: 2.2em !important; background-image: linear-gradient(45deg, transparent 50%, var(--kx-ink2) 50%), linear-gradient(135deg, var(--kx-ink2) 50%, transparent 50%); background-position: calc(100% - 17px) 55%, calc(100% - 12px) 55%; background-size: 5px 5px; background-repeat: no-repeat; }
::placeholder { color: var(--kx-ink3); opacity: 1; }
.kdex-site { display: block; min-height: 60vh; }
a { color: var(--kx-link); text-decoration: none; text-underline-offset: 3px; }
a:hover { color: var(--kx-accent); }
/* 글 속 링크만 올리면 밑줄 (카드·칩·메뉴·타일은 제외) */
:where(p, td, dd, .kdex-timeline > li, .kdex-list > li, .kdex-ft__list > li) > a:hover, .entry-content a:hover { text-decoration: underline; }
/* 건너뛰기 링크 — 첫 Tab에서 보인다 */
.skip-link:focus { position: fixed !important; left: var(--kx-sp-2); top: var(--kx-sp-2); z-index: 100001; }
/* 언어별 서체 — lang이 붙은 요소는 그 언어의 서체로. :where()로 우선순위 0 → 리딩 본문(명조 역할) 규칙이 이긴다 (보고 79 §3.1 결함 정정) */
:where(body [lang]) { font-family: var(--kx-font-sans); }
.kdex-reading, .kdex-reading [lang], .kdex-rd-title { font-family: var(--kx-font-read); }
.kdex-rd-bar, .kdex-rd-bar [lang], .kdex-reading > .kdex-rv-legend, .kdex-rd-preview, .kdex-rd-notice { font-family: var(--kx-font-sans); }
/* 키보드 초점 — 모든 화면 공통 */
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, summary:focus-visible, label:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--kx-focus); outline-offset: 2px; }
.kdex-orig-toggle:focus-visible + .kdex-rd-bar .kdex-orig-label { outline: 2px solid var(--kx-focus); outline-offset: 2px; }
/* 고정 헤더 아래로 구역 이동 */
[id] { scroll-margin-top: calc(var(--kx-hd-h) + var(--kx-sp-4)); }
/* 화면 읽기 프로그램 전용 글자 (워드프레스 표준 규칙) */
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { clip: auto !important; clip-path: none; height: auto; width: auto; margin: 0; padding: 12px 20px; z-index: 100000; background: var(--kx-surface); color: var(--kx-ink); }

/* ===== 1. 쪽 틀 ===== */
.kdex-wrap { box-sizing: border-box; width: 100%; max-width: calc(var(--kx-wrap) + 2 * var(--kx-sp-5)); margin: 0 auto; padding: 0 var(--kx-sp-5); }
.kdex-page { padding-top: var(--kx-sp-5); padding-bottom: var(--kx-sp-8); }
.kdex-page h1 { margin: var(--kx-sp-2) 0 var(--kx-sp-3); font-size: var(--kx-fs-5); font-weight: 700; line-height: 1.25; letter-spacing: -.01em; color: var(--kx-ink); }
.kdex-title-sub { font-family: var(--kx-font-serif); font-weight: 400; font-size: .8em; color: var(--kx-ink3); }
.kdex-crumbs { margin: 0; font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-crumbs a { color: var(--kx-ink2); text-decoration: none; }
.kdex-crumbs a:hover { color: var(--kx-accent); text-decoration: underline; }
.kdex-crumbs span[aria-hidden] { margin: 0 var(--kx-sp-1); }
.kdex-page .kdex-kind { margin: var(--kx-sp-3) var(--kx-sp-1) 0 0; }
.kdex-page > .kdex-dim, .kdex-main > .kdex-dim, .kdex-main > .kdex-meta { margin: 0 0 var(--kx-sp-5); color: var(--kx-ink2); }
.kdex-all-back { margin: 0 0 var(--kx-sp-4); }
.kdex-all-back a { font-weight: 600; }

/* 구역 제목 — 목록·상세 본문의 h2 */
.kdex-main h2, .kdex-dt__main h2 { margin: var(--kx-sp-7) 0 var(--kx-sp-4); padding-bottom: var(--kx-sp-2); border-bottom: 2px solid var(--kx-ink); font-size: var(--kx-fs-2); font-weight: 700; line-height: 1.3; color: var(--kx-ink); }
.kdex-dt__main > :first-child, .kdex-dt__main > .kdex-profile-card:first-child > h2:first-child, .kdex-dt__main > section:first-child > h2:first-child { margin-top: 0; }
.kdex-main h2 small, .kdex-dt__main h2 small { font-size: var(--kx-fs-0); font-weight: 400; color: var(--kx-ink3); }

/* 상세 2단: 본문 + 오른쪽 칸(프로필·기본 정보) */
.kdex-dt { display: grid; grid-template-columns: minmax(0, 1fr) var(--kx-side); gap: var(--kx-sp-7); align-items: start; margin-top: var(--kx-sp-5); }
.kdex-dt--solo { grid-template-columns: minmax(0, 1fr); }
.kdex-dt__side { position: sticky; top: calc(var(--kx-hd-h) + var(--kx-sp-4)); }
.kdex-ph { padding-bottom: var(--kx-sp-4); border-bottom: 1px solid var(--kx-line); }
.kdex-ph__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--kx-sp-2) var(--kx-sp-3); margin: 0; font-size: var(--kx-fs--1); color: var(--kx-ink2); }

/* ===== 2. 공용 구성요소 ===== */
/* 단추·입력칸 */
.kdex-btn, .kdex-filter button, .kdex-search button { display: inline-flex; align-items: center; justify-content: center; gap: var(--kx-sp-2); min-height: var(--kx-tap); padding: 0 var(--kx-sp-4); border: 1px solid var(--kx-accent); border-radius: var(--kx-r-s); background: var(--kx-accent); color: var(--kx-on-accent); font: inherit; font-weight: 600; white-space: nowrap; cursor: pointer; }
.kdex-filter button:hover, .kdex-search button:hover { background: var(--kx-ink); border-color: var(--kx-ink); color: var(--kx-bg); }
.kdex-filter select, .kdex-search input[type=search] { box-sizing: border-box; min-height: var(--kx-tap); padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-ink3); border-radius: var(--kx-r-s); background-color: var(--kx-surface); color: var(--kx-ink); font: inherit; }
/* 검색 상자 */
.kdex-search { display: flex; gap: 0; margin: 0; max-width: 100%; }
.kdex-search input[type=search] { flex: 1 1 auto; min-width: 0; width: 16em; border-right: 0; }

/* 배지 — 세력(의미색) · 출처(등장 구분) · 일반 */
.kdex-badges { display: flex; flex-wrap: wrap; gap: var(--kx-sp-1); }
.kdex-badge { display: inline-block; padding: 1px var(--kx-sp-2); border: 1px solid transparent; border-radius: var(--kx-r-s); background: var(--kx-sub); color: var(--kx-ink2); font-size: var(--kx-fs--1); font-weight: 600; line-height: 1.6; white-space: nowrap; }
.kdex-badge[class*=" f-"] { background: var(--kx-fac-qun-soft); color: var(--kx-fac-qun); }
.kdex-badge.f-wei { background: var(--kx-fac-wei-soft); color: var(--kx-fac-wei); }
.kdex-badge.f-shu { background: var(--kx-fac-shu-soft); color: var(--kx-fac-shu); }
.kdex-badge.f-wu  { background: var(--kx-fac-wu-soft); color: var(--kx-fac-wu); }
.kdex-badge.f-han { background: var(--kx-fac-han-soft); color: var(--kx-fac-han); }
.kdex-badge.a-both { background: var(--kx-src-both-soft); color: var(--kx-src-both); }
.kdex-badge.a-sgz-only, .kdex-badge.a-sgz { background: var(--kx-src-sgz-soft); color: var(--kx-src-sgz); }
.kdex-badge.a-yy-only, .kdex-badge.a-yy { background: var(--kx-src-yy-soft); color: var(--kx-src-yy); }
.kdex-badge.a-folk { background: var(--kx-src-folk-soft); color: var(--kx-src-folk); }
.kdex-badge.kdex-badge--inline { vertical-align: middle; font-size: var(--kx-fs--1); }
/* 링크 칩 — 회차·인물·장소 목록 */
.kdex-chapters { display: flex; flex-wrap: wrap; gap: var(--kx-sp-1); }
.kdex-chapters a, a.kdex-badge { display: inline-flex; align-items: center; min-height: 32px; box-sizing: border-box; padding: 0 var(--kx-sp-2); border: 1px solid var(--kx-line); border-radius: var(--kx-r-s); background: var(--kx-surface); color: var(--kx-ink); font-size: var(--kx-fs--1); font-weight: 400; text-decoration: none; }
.kdex-chapters a:hover, a.kdex-badge:hover { border-color: var(--kx-accent); background: var(--kx-accent-soft); color: var(--kx-ink); }
.kdex-chapters a.kdex-strong, a.kdex-badge.kdex-strong { font-weight: 700; border-color: var(--kx-line2); }
.kdex-badge.is-draft, a.kdex-badge.is-draft { background: transparent; border: 1px dashed var(--kx-line2); color: var(--kx-ink2); }
/* 확인 상태(review) — 정의서 06 */
.kdex-rv { display: inline-block; margin-left: var(--kx-sp-1); padding: 0 var(--kx-sp-1); border-radius: var(--kx-r-s); font-size: var(--kx-fs--1); font-weight: 600; line-height: 1.5; vertical-align: 1px; }
.kdex-rv-draft { background: var(--kx-rv-draft-soft); color: var(--kx-rv-draft); border: 1px dashed var(--kx-rv-draft); }
.kdex-rv-disputed { background: var(--kx-rv-disputed-soft); color: var(--kx-rv-disputed); border: 1px solid var(--kx-rv-disputed); }
/* 흐린 글자 = 글자색 토큰 (투명도 없음) */
.kdex-note, .kdex-meta, .kdex-soft, .kdex-dim { color: var(--kx-ink3); }
small.kdex-note, small.kdex-meta, .kdex-note-sm { font-size: var(--kx-fs--1); }
.kdex-note-sm { color: var(--kx-ink3); }
.kdex-rv-legend { margin: var(--kx-sp-2) 0 var(--kx-sp-3); font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-subhead { margin: var(--kx-sp-3) 0 var(--kx-sp-2); font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-strong { font-weight: 700; }
.kdex-kind { display: inline-block; }
.kdex-remark { font-size: var(--kx-fs--1); line-height: 1.6; }
.kdex-after { margin-top: var(--kx-sp-6); }
.kdex-how { margin-left: var(--kx-sp-1); }
/* 목록(줄) — 사건·아이템·저작물·소속 이력 */
.kdex-timeline, .kdex-list { margin: 0; padding: 0; list-style: none; }
.kdex-timeline > li, .kdex-list > li { padding: var(--kx-sp-2) 0; border-bottom: 1px solid var(--kx-line); line-height: 1.6; }
.kdex-timeline > li:first-child, .kdex-list > li:first-child { border-top: 1px solid var(--kx-line); }
ol.kdex-timeline { counter-reset: kx; }
ol.kdex-timeline > li { counter-increment: kx; padding-left: 2.2em; position: relative; }
ol.kdex-timeline > li::before { content: counter(kx); position: absolute; left: 0; width: 1.6em; text-align: right; color: var(--kx-ink3); font-family: var(--kx-font-mono); font-size: var(--kx-fs--1); line-height: 2; }
.kdex-list.kdex-list--tight > li { padding: var(--kx-sp-1) 0; border: 0; }
.kdex-list.kdex-list--tight > li:first-child { border: 0; }
/* 더 보기 · 쪽 이동 */
.kdex-more { margin: var(--kx-sp-2) 0 0; }
.kdex-more a, .kdex-pager a, .kdex-ch-link { display: inline-flex; align-items: center; min-height: var(--kx-tap); font-weight: 600; }
.kdex-pager { display: flex; flex-wrap: wrap; gap: var(--kx-sp-4); align-items: center; margin: var(--kx-sp-3) 0 var(--kx-sp-5); }
.kdex-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 0; }
.kdex-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: var(--kx-tap); min-height: var(--kx-tap); margin: 0 -1px -1px 0; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line); background: var(--kx-surface); color: var(--kx-ink); font-weight: 600; text-decoration: none; }
.kdex-pagination a.page-numbers:hover { border-color: var(--kx-accent); color: var(--kx-accent); position: relative; }
.kdex-pagination .page-numbers.current { background: var(--kx-ink); border-color: var(--kx-ink); color: var(--kx-bg); position: relative; }
.kdex-pagination .page-numbers.dots { border-color: transparent; background: transparent; color: var(--kx-ink3); }
.kdex-pagination .screen-reader-text { position: absolute; }
/* 상자 — 오른쪽 칸의 프로필·기본 정보 */
.kdex-profile-card { margin: 0; }
.kdex-dt__side .kdex-profile-card { border: 1px solid var(--kx-line); background: var(--kx-surface); }
.kdex-dt__side .kdex-profile-card > h2 { margin: 0; padding: var(--kx-sp-3) var(--kx-sp-4); border-bottom: 1px solid var(--kx-line); font-size: var(--kx-fs--1); font-weight: 700; letter-spacing: .08em; color: var(--kx-ink2); }
.kdex-dt__side .kdex-profile-card > .kdex-rv-legend, .kdex-dt__side .kdex-profile-card > .kdex-note-sm, .kdex-dt__side .kdex-profile-card > p { margin: 0; padding: var(--kx-sp-2) var(--kx-sp-4) var(--kx-sp-3); }
/* 표 — 상자 안 이름:값 · 본문의 표 */
.kdex-profile-card table { width: 100%; margin: 0; border-collapse: collapse; border: 0; }
.kdex-profile-card th, .kdex-profile-card td { padding: var(--kx-sp-2) var(--kx-sp-4); border: 0; border-bottom: 1px solid var(--kx-line); text-align: left; vertical-align: top; font-size: var(--kx-fs--1); line-height: 1.6; }
.kdex-profile-card tr:last-child > th, .kdex-profile-card tr:last-child > td { border-bottom: 0; }
.kdex-profile-card th { background: var(--kx-sub); color: var(--kx-ink2); font-weight: 600; }
/* 줄 머리칸(뒤에 값 칸이 오는 th)은 글자 폭만큼만 (0.28.4) — 교전 구도의 가·나 칸은 반씩 */
.kdex-profile-card th:has(+ td) { width: 1%; white-space: nowrap; }
.kdex-profile-card .kdex-vs thead th { width: 50%; }
.kdex-profile-card .kdex-vs thead th:first-child { width: 1%; white-space: nowrap; }   /* 「구분」 칸 (0.28.5) */
html:lang(en) .kdex-dt__side .kdex-profile-card th:has(+ td) { min-width: 7em; white-space: normal; }   /* 영어 긴 머리말(최대 170px)은 오른쪽 칸에서 줄바꿈 */
.kdex-dt__main .kdex-profile-card table { border-top: 1px solid var(--kx-line); border-bottom: 1px solid var(--kx-line); }
.kdex-dt__main .kdex-profile-card th, .kdex-dt__main .kdex-profile-card td { padding: var(--kx-sp-2) var(--kx-sp-3); }
.kdex-dt__main .kdex-profile-card tr:last-child > th, .kdex-dt__main .kdex-profile-card tr:last-child > td { border-bottom: 0; }
.kdex-profile-card td > a, .kdex-profile-card td > strong { font-size: var(--kx-fs-0); }
.kdex-profile-card .kdex-list > li { font-size: var(--kx-fs--1); }
/* 본문(편집기) */
.entry-content { max-width: var(--kx-measure); }
.entry-content:empty { display: none; }

/* ===== 3. 헤더 — 한 줄(PC 64px · 좁은 화면 56px), 스크롤해도 위에 붙음 ===== */
.kdex-hd { position: sticky; top: 0; z-index: 50; background: var(--kx-surface); border-bottom: 1px solid var(--kx-line); }
body.admin-bar .kdex-hd { top: 32px; }
.kdex-hd__bar { display: flex; align-items: center; gap: clamp(12px, 1.6vw, 24px); min-height: var(--kx-hd-h); }
@media (max-width: 1400px) { .kdex-hd-logo span { display: none; } }
@media (max-width: 1600px) { html:lang(en) .kdex-hd-logo span { display: none; } }
.kdex-hd-logo { display: inline-flex; align-items: center; gap: var(--kx-sp-2); min-height: var(--kx-tap); color: var(--kx-ink); text-decoration: none; white-space: nowrap; }
.kdex-hd-logo:hover { color: var(--kx-ink); }
.kdex-hd-logo b { font-size: var(--kx-fs-2); font-weight: 800; letter-spacing: .02em; }
.kdex-hd-logo i { font-style: normal; color: var(--kx-accent); }
.kdex-hd-logo span { font-family: var(--kx-font-serif); font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-hd__nav { align-self: stretch; }
.kdex-hd__nav .kdex-sections { display: flex; height: 100%; margin: 0; padding: 0; list-style: none; }
.kdex-hd__nav .kdex-sections li { display: flex; }
.kdex-hd__nav .kdex-sections a { display: flex; align-items: center; padding: 0 clamp(6px, .9vw, 12px); border-top: 3px solid transparent; border-bottom: 3px solid transparent; color: var(--kx-ink2); font-weight: 600; text-decoration: none; white-space: nowrap; }
.kdex-hd__nav .kdex-sections a:hover { color: var(--kx-ink); border-bottom-color: var(--kx-line2); }
.kdex-hd__nav .kdex-sections a[aria-current] { color: var(--kx-accent); border-bottom-color: var(--kx-accent); }
.kdex-hd__tools { display: flex; align-items: center; gap: var(--kx-sp-2); margin-left: auto; }
.kdex-hd__tools .kdex-search input[type=search] { width: clamp(8em, 12vw, 14em); min-height: 38px; }
.kdex-hd__tools .kdex-search button { min-height: 38px; padding: 0 var(--kx-sp-3); }
.kdex-mode-btn { min-height: 38px; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line2); border-radius: var(--kx-r-s); background: transparent; color: var(--kx-ink2); font: inherit; font-size: var(--kx-fs--1); white-space: nowrap; cursor: pointer; }
.kdex-mode-btn:hover { border-color: var(--kx-accent); color: var(--kx-accent); }
/* 펼침 단추(언어 · 좁은 화면 검색 · 메뉴) — <details>, 스크립트 없이 열리고 닫힘 */
.kdex-pop { position: relative; }
.kdex-pop > summary { display: inline-flex; align-items: center; justify-content: center; gap: var(--kx-sp-1); min-height: 38px; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line2); background: transparent; color: var(--kx-ink2); font-size: var(--kx-fs--1); list-style: none; cursor: pointer; white-space: nowrap; }
.kdex-pop > summary::-webkit-details-marker { display: none; }
.kdex-pop > summary::after { content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); }
.kdex-pop[open] > summary { border-color: var(--kx-ink); color: var(--kx-ink); }
.kdex-pop[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.kdex-pop__panel { position: absolute; right: 0; top: calc(100% + var(--kx-sp-1)); z-index: 60; min-width: 12em; padding: var(--kx-sp-2) 0; border: 1px solid var(--kx-line2); background: var(--kx-surface); box-shadow: var(--kx-shadow-2); }
.kdex-pop__panel .kdex-lang { display: flex; flex-direction: column; }
.kdex-pop__panel .kdex-lang a, .kdex-pop__panel .kdex-lang strong { display: flex; align-items: center; min-height: 40px; padding: 0 var(--kx-sp-4); color: var(--kx-ink); text-decoration: none; }
.kdex-pop__panel .kdex-lang a:hover { background: var(--kx-accent-soft); }
.kdex-pop__panel .kdex-lang strong { box-shadow: inset 3px 0 0 var(--kx-accent); }
.kdex-hd__panel { display: flex; flex: 1 1 auto; align-items: center; align-self: stretch; gap: clamp(12px, 1.6vw, 24px); min-width: 0; }
.kdex-menu-t { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.kdex-menu-btn { display: none; align-items: center; justify-content: center; min-width: var(--kx-tap); min-height: var(--kx-tap); color: var(--kx-ink); cursor: pointer; }
.kdex-menu-btn--find { margin-left: auto; }
.kdex-menu-t:focus-visible ~ .kdex-menu-btn:not(.kdex-menu-btn--find) { outline: 2px solid var(--kx-focus); outline-offset: -2px; }
.kdex-ico { position: relative; display: inline-block; width: 18px; height: 14px; }
.kdex-ico--menu { border-top: 2px solid currentColor; border-bottom: 2px solid currentColor; box-sizing: border-box; }
.kdex-ico--menu::before { content: ""; position: absolute; left: 0; right: 0; top: 4px; border-top: 2px solid currentColor; }
.kdex-menu-t:checked ~ .kdex-menu-btn .kdex-ico--menu { border-color: transparent; }
.kdex-menu-t:checked ~ .kdex-menu-btn .kdex-ico--menu::before { transform: rotate(45deg); }
.kdex-menu-t:checked ~ .kdex-menu-btn .kdex-ico--menu::after { content: ""; position: absolute; left: 0; right: 0; top: 4px; border-top: 2px solid currentColor; transform: rotate(-45deg); }
.kdex-ico--find { width: 16px; height: 16px; }
.kdex-ico--find::before { content: ""; position: absolute; left: 0; top: 0; width: 10px; height: 10px; border: 2px solid currentColor; }
.kdex-ico--find::after { content: ""; position: absolute; left: 11px; top: 11px; width: 6px; border-top: 2px solid currentColor; transform: rotate(45deg); transform-origin: left top; }

/* ===== 4. 푸터 ===== */
.kdex-ft { margin-top: 0; background: var(--kx-surface); border-top: 1px solid var(--kx-line); color: var(--kx-ink2); font-size: var(--kx-fs--1); }
.kdex-ft__cols { display: grid; grid-template-columns: 2fr 1fr 2fr; gap: var(--kx-sp-6); padding-top: var(--kx-sp-6); padding-bottom: var(--kx-sp-6); }
.kdex-ft__brand { order: -1; }
.kdex-ft__brand p { margin: 0 0 var(--kx-sp-2); }
.kdex-ft__name { font-size: var(--kx-fs-1); font-weight: 800; }
.kdex-ft__name a { color: var(--kx-ink); text-decoration: none; }
.kdex-ft__name i { font-style: normal; color: var(--kx-accent); }
.kdex-ft__copy { margin-top: var(--kx-sp-4) !important; color: var(--kx-ink3); }
.kdex-ft__title { margin: 0 0 var(--kx-sp-3); font-size: var(--kx-fs--1); font-weight: 700; letter-spacing: .08em; color: var(--kx-ink3); }
.kdex-ft__list { margin: 0; padding: 0; list-style: none; }
.kdex-ft__list li { margin: 0 0 var(--kx-sp-1); }
.kdex-ft__col:first-child .kdex-ft__list { columns: 2; column-gap: var(--kx-sp-4); }
.kdex-ft__col:first-child .kdex-ft__list a { display: inline-block; padding: 2px 0; }

/* ===== 5. 홈 ===== */
.kdex-home-hero { padding: var(--kx-sp-8) 0 var(--kx-sp-7); border-bottom: 1px solid var(--kx-line); background: var(--kx-surface); }
.kdex-home-hero__k { margin: 0 0 var(--kx-sp-3); font-family: var(--kx-font-serif); font-size: var(--kx-fs-1); letter-spacing: .3em; color: var(--kx-accent); }
.kdex-home-hero h1 { max-width: 18em; margin: 0; font-size: var(--kx-fs-5); font-weight: 700; line-height: 1.25; }
.kdex-home-hero__sub { margin: var(--kx-sp-3) 0 0; font-size: var(--kx-fs-1); color: var(--kx-ink2); }
.kdex-home-hero .kdex-search { max-width: 640px; margin-top: var(--kx-sp-6); }
.kdex-home-hero .kdex-search input[type=search], .kdex-home-hero .kdex-search button { min-height: 52px; font-size: var(--kx-fs-1); }
.kdex-home-hero .kdex-search button { padding: 0 var(--kx-sp-5); }
.kdex-home-hero__stat { margin: var(--kx-sp-4) 0 0; font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-home-dex { padding-top: var(--kx-sp-7); }
.kdex-home-dex h2 { margin: 0 0 var(--kx-sp-4); padding-bottom: var(--kx-sp-2); border-bottom: 2px solid var(--kx-ink); font-size: var(--kx-fs-2); }
.kdex-tiles { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--kx-line); border-left: 1px solid var(--kx-line); }
.kdex-tile { display: flex; flex-direction: column; justify-content: space-between; gap: var(--kx-sp-3); min-height: 132px; box-sizing: border-box; height: 100%; padding: var(--kx-sp-4) var(--kx-sp-5); border-right: 1px solid var(--kx-line); border-bottom: 1px solid var(--kx-line); background: var(--kx-surface); color: var(--kx-ink); text-decoration: none; transition: background var(--kx-dur) var(--kx-ease); }
.kdex-tile:hover { background: var(--kx-accent-soft); color: var(--kx-ink); }
.kdex-tile__h { display: flex; justify-content: space-between; align-items: baseline; gap: var(--kx-sp-2); }
.kdex-tile__h b { font-size: var(--kx-fs-2); }
.kdex-tile__h span { font-family: var(--kx-font-serif); font-size: var(--kx-fs-1); color: var(--kx-ink3); }
.kdex-tile__n { color: var(--kx-ink2); }
.kdex-tile__n strong { margin-right: 2px; font-size: var(--kx-fs-3); font-weight: 700; color: var(--kx-ink); }
.kdex-tile--read { background: var(--kx-accent); color: var(--kx-on-accent); }
.kdex-tile--read:hover { background: var(--kx-accent); color: var(--kx-on-accent); box-shadow: inset 0 0 0 3px var(--kx-ink); }
.kdex-tile--read .kdex-tile__h span, .kdex-tile--read .kdex-tile__n, .kdex-tile--read .kdex-tile__n strong { color: var(--kx-on-accent); }
.kdex-tile__go { align-self: flex-start; border-bottom: 2px solid currentColor; font-weight: 700; }

/* ===== 6. 목록 ===== */
.kdex-filter { display: flex; flex-wrap: wrap; align-items: center; gap: var(--kx-sp-2); margin: 0 0 var(--kx-sp-5); padding: var(--kx-sp-4); background: var(--kx-sub); }
.kdex-filter select { width: auto; flex: 0 1 17em; min-width: 11em; }
.kdex-filter .kdex-count { margin-left: auto; font-size: var(--kx-fs--1); color: var(--kx-ink2); }
/* 카드 칸 한 줄: 5 → 3(≤1180) → 2(≤760) → 1(≤480) — 모두 쪽당 개수(인물 30 · 그 외 60)의 약수라 마지막 줄이 꽉 찬다 (0.28.2) */
.kdex-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--kx-line); border-left: 1px solid var(--kx-line); }
.kdex-card { margin: 0; border-right: 1px solid var(--kx-line); border-bottom: 1px solid var(--kx-line); background: var(--kx-surface); transition: background var(--kx-dur) var(--kx-ease); }
.kdex-card:hover { background: var(--kx-accent-soft); }
.kdex-card > a { display: flex; flex-direction: column; gap: var(--kx-sp-1); box-sizing: border-box; height: 100%; min-height: 116px; padding: var(--kx-sp-4); color: var(--kx-ink); text-decoration: none; }
.kdex-card .kdex-name { margin: 0; font-size: var(--kx-fs-1); font-weight: 700; line-height: 1.35; }
.kdex-card .kdex-hanja { margin: 0; font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-card:hover .kdex-hanja { color: var(--kx-ink2); }
.kdex-card .kdex-badges { margin-top: auto; padding-top: var(--kx-sp-2); }
.kdex-pagination { margin-top: var(--kx-sp-5); }
/* 세력 목록 묶음 · 연표 묶음 */
.kdex-main h2.kdex-fgroup, .kdex-main h2.kdex-year-group { margin-top: var(--kx-sp-7); }
.kdex-main > h2.kdex-fgroup:first-of-type { margin-top: var(--kx-sp-5); }
.kdex-main h2.kdex-year-group + .kdex-chapters a { min-width: 3.4em; justify-content: center; font-family: var(--kx-font-mono); }
/* 리딩 목차 */
.kdex-reading-tabs { display: flex; gap: 0; margin: 0 0 var(--kx-sp-5); border-bottom: 2px solid var(--kx-ink); }
.kdex-reading-tabs a { display: inline-flex; align-items: center; min-height: var(--kx-tap); padding: 0 var(--kx-sp-5); margin-bottom: -2px; border: 1px solid transparent; border-bottom: 0; color: var(--kx-ink2); font-weight: 600; text-decoration: none; }
.kdex-reading-tabs a.active { background: var(--kx-ink); color: var(--kx-bg); }
.kdex-reading-list { margin: 0; padding: 0; list-style: none; }
.kdex-reading-list li { border-bottom: 1px solid var(--kx-line); }
.kdex-reading-list a { display: flex; align-items: baseline; gap: var(--kx-sp-4); min-height: var(--kx-tap); box-sizing: border-box; padding: var(--kx-sp-3) var(--kx-sp-2); color: var(--kx-ink); text-decoration: none; }
.kdex-reading-list a:hover { background: var(--kx-accent-soft); }
.kdex-rl-title { flex: none; min-width: 8em; font-weight: 700; color: var(--kx-link); }
.kdex-rl-sub { flex: 1; font-family: var(--kx-font-serif); color: var(--kx-ink2); }
.kdex-rl-meta { flex: none; font-size: var(--kx-fs--1); color: var(--kx-ink3); white-space: nowrap; }
.kdex-reading-list a:hover .kdex-rl-sub, .kdex-reading-list a:hover .kdex-rl-meta { color: var(--kx-ink2); }   /* 옅은 강조 바탕 위에서는 ink2 */

/* ===== 7. 상세 ===== */
/* 인물 — 구역 바로가기 · 표기 · 연의 등장 회차 띠 */
.kdex-toc { display: flex; flex-wrap: wrap; margin: var(--kx-sp-4) 0 0; padding: 0; list-style: none; border-left: 1px solid var(--kx-line); }
.kdex-toc a { display: inline-flex; align-items: center; min-height: 36px; box-sizing: border-box; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line); border-left: 0; background: var(--kx-surface); color: var(--kx-ink2); font-size: var(--kx-fs--1); text-decoration: none; }
.kdex-toc li + li a { border-left: 0; }
.kdex-toc a:hover { color: var(--kx-accent); border-color: var(--kx-line2); }
.kdex-names-list { display: flex; flex-wrap: wrap; gap: var(--kx-sp-2); }
.kdex-names-list span { padding: var(--kx-sp-1) var(--kx-sp-3); background: var(--kx-sub); font-size: var(--kx-fs--1); }
.kdex-strip { display: grid; grid-template-columns: repeat(40, 1fr); gap: 2px; margin: 0; }
.kdex-strip i { display: block; aspect-ratio: 1; background: var(--kx-sub); }
.kdex-strip i.on { background: var(--kx-accent); }
.kdex-strip-scale { display: flex; justify-content: space-between; margin-top: var(--kx-sp-1); font-family: var(--kx-font-mono); font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-strip-legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--kx-sp-1) var(--kx-sp-4); margin-top: var(--kx-sp-2); font-size: var(--kx-fs--1); color: var(--kx-ink2); }
.kdex-strip-legend i { display: inline-block; width: 10px; height: 10px; margin-right: var(--kx-sp-1); vertical-align: -1px; background: var(--kx-sub); border: 1px solid var(--kx-line2); }
.kdex-strip-legend i.on { background: var(--kx-accent); border-color: var(--kx-accent); }
.kdex-strip-legend .kdex-ch-link { margin-left: auto; min-height: 0; }
/* 연도 이동 */
.kdex-year-nav { display: flex; flex-wrap: wrap; gap: var(--kx-sp-2); margin: var(--kx-sp-3) 0 0; }
.kdex-year-nav a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line); background: var(--kx-surface); font-size: var(--kx-fs--1); text-decoration: none; }
.kdex-year-eras { margin: 0; color: var(--kx-ink2); }

/* ===== 8. 원전 리딩 ===== */
.kdex-rd-head { padding: var(--kx-sp-5) 0 var(--kx-sp-5); border-bottom: 1px solid var(--kx-line); text-align: center; }
.kdex-rd-head .kdex-ch-type { margin: 0; }
.kdex-rd-head h1 { margin: var(--kx-sp-3) 0 0; font-size: var(--kx-fs-4); }
.kdex-ch-couplet { margin: var(--kx-sp-2) auto 0; max-width: 40em; font-family: var(--kx-font-serif); font-size: var(--kx-fs-1); letter-spacing: .06em; color: var(--kx-ink2); }
.kdex-ch-stats { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--kx-sp-1) var(--kx-sp-4); margin: var(--kx-sp-3) 0 0; font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-rd { display: grid; grid-template-columns: minmax(0, 1fr) var(--kx-side); gap: var(--kx-sp-7); align-items: start; margin-top: var(--kx-sp-5); }
.kdex-rd--solo { grid-template-columns: minmax(0, 1fr); }
.kdex-reading { margin: 0; }
.kdex-orig-toggle { position: absolute; opacity: 0; width: 1px; height: 1px; }
.kdex-rd-bar { position: sticky; top: var(--kx-hd-h); z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: var(--kx-sp-2) var(--kx-sp-3); margin: 0 0 var(--kx-sp-5); padding: var(--kx-sp-2) 0; border-bottom: 1px solid var(--kx-line); background: var(--kx-bg); }
.kdex-rd-langs { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.kdex-rd-langs li { display: flex; }
.kdex-rd-langs a, .kdex-rd-langs strong { display: inline-flex; align-items: center; min-height: 36px; margin-right: -1px; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line2); font-size: var(--kx-fs--1); font-weight: 400; color: var(--kx-ink2); text-decoration: none; white-space: nowrap; }
.kdex-rd-langs strong { position: relative; background: var(--kx-ink); border-color: var(--kx-ink); color: var(--kx-bg); font-weight: 600; }
.kdex-rd-langs a:hover { color: var(--kx-accent); border-color: var(--kx-accent); position: relative; }
.kdex-orig-label { display: inline-flex; align-items: center; gap: var(--kx-sp-2); min-height: 36px; margin-left: auto; padding: 0 var(--kx-sp-3); border: 1px solid var(--kx-line2); font-size: var(--kx-fs--1); color: var(--kx-ink); cursor: pointer; user-select: none; }
.kdex-orig-label::before { content: ""; flex: none; width: 26px; height: 12px; border: 1px solid currentColor; background: linear-gradient(currentColor, currentColor) 2px 50% / 8px 8px no-repeat; }
.kdex-orig-toggle:checked ~ .kdex-rd-bar .kdex-orig-label { background: var(--kx-accent-soft); border-color: var(--kx-accent); font-weight: 600; }
.kdex-orig-toggle:checked ~ .kdex-rd-bar .kdex-orig-label::before { background-position: 14px 50%; background-image: linear-gradient(var(--kx-accent), var(--kx-accent)); }
.kdex-rd-preview { margin: 0 0 var(--kx-sp-4); padding: var(--kx-sp-2) var(--kx-sp-3); background: var(--kx-rv-draft-soft); border: 1px solid var(--kx-rv-draft); font-size: var(--kx-fs--1); color: var(--kx-ink); }
.kdex-rd-notice { margin: 0 0 var(--kx-sp-4); font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-rd-body { margin: 0; font-size: var(--kx-fs-1); line-height: var(--kx-lh-read); color: var(--kx-ink); }
.kdex-rd-title { margin: 0 0 var(--kx-sp-5); font-size: var(--kx-fs-3); font-weight: 700; line-height: 1.45; text-align: center; word-break: keep-all; }
.kdex-reading .kdex-s { margin: 0 0 1.1em; text-align: justify; word-break: keep-all; overflow-wrap: break-word; }
.kdex-reading .kdex-s--p { margin-top: 1.6em; }
.kdex-reading .kdex-rd-title + .kdex-s { margin-top: 0; }
.kdex-reading .kdex-s--verse { padding: var(--kx-sp-3) var(--kx-sp-5); border-left: 3px solid var(--kx-accent); background: var(--kx-surface); font-size: var(--kx-fs-0); color: var(--kx-ink2); text-align: left; }
.kdex-reading .kdex-s--own { padding: var(--kx-sp-2) var(--kx-sp-3); border: 1px dashed var(--kx-line2); }
.kdex-reading .kdex-e { color: inherit; text-decoration: underline; text-decoration-color: var(--kx-line2); text-decoration-thickness: 1px; text-underline-offset: 4px; }
.kdex-reading .kdex-e:hover { color: var(--kx-accent); text-decoration-color: var(--kx-accent); }
.kdex-reading .kdex-e.is-missing { text-decoration: none; }
.kdex-orig { display: none; margin: -.5em 0 1.4em; padding: var(--kx-sp-2) var(--kx-sp-4); background: var(--kx-sub); font-family: var(--kx-font-serif); font-size: var(--kx-fs-0); line-height: 1.9; color: var(--kx-ink2); text-align: left; }
.kdex-orig .kdex-e { color: inherit; }
.kdex-orig-toggle:checked ~ .kdex-rd-body .kdex-orig { display: block; }
.kdex-reading > .kdex-rv-legend, .kdex-reading > .kdex-rd-credit { margin: var(--kx-sp-5) 0 0; }
.kdex-reading-placeholder { margin: 0; padding: var(--kx-sp-5); border: 1px dashed var(--kx-line2); color: var(--kx-ink2); text-align: center; }
.kdex-ch-nav { display: grid; grid-template-columns: 1fr 1fr; margin: var(--kx-sp-6) 0 0; border: 1px solid var(--kx-line); }
.kdex-ch-nav a, .kdex-ch-nav > span { display: flex; flex-direction: column; justify-content: center; min-height: 72px; box-sizing: border-box; padding: var(--kx-sp-3) var(--kx-sp-4); background: var(--kx-surface); color: var(--kx-ink); text-decoration: none; }
.kdex-ch-nav a:hover { background: var(--kx-accent-soft); }
.kdex-ch-nav small { font-size: var(--kx-fs--1); color: var(--kx-ink3); }
.kdex-ch-nav a:hover small { color: var(--kx-ink2); }
.kdex-ch-nav b { font-weight: 700; }
.kdex-ch-nav .kdex-next { grid-column: 2; text-align: right; border-left: 1px solid var(--kx-line); }
/* 오른쪽 칸 — 이 회에 나오는 항목 */
.kdex-rd__side { position: sticky; top: calc(var(--kx-hd-h) + var(--kx-sp-4)); max-height: calc(100vh - var(--kx-hd-h) - var(--kx-sp-6)); overflow-y: auto; }
.kdex-rd-box { margin: 0 0 -1px; border: 1px solid var(--kx-line); background: var(--kx-surface); }
.kdex-rd-box > summary { display: flex; align-items: center; gap: var(--kx-sp-2); min-height: var(--kx-tap); padding: 0 var(--kx-sp-4); font-size: var(--kx-fs--1); font-weight: 700; list-style: none; cursor: pointer; }
.kdex-rd-box > summary::-webkit-details-marker { display: none; }
.kdex-rd-box > summary span { margin-right: auto; font-weight: 400; color: var(--kx-ink3); }
.kdex-rd-box > summary::after { content: "+"; font-weight: 400; color: var(--kx-ink3); }
.kdex-rd-box[open] > summary::after { content: "\2212"; }
.kdex-rd-box > .kdex-badges, .kdex-rd-box > .kdex-rv-legend, .kdex-rd-box > .kdex-more { padding: 0 var(--kx-sp-4); }
.kdex-rd-box > .kdex-badges { padding-bottom: var(--kx-sp-4); }
.kdex-rd-box > .kdex-rv-legend { margin: 0 0 var(--kx-sp-2); }
.kdex-rd__side .kdex-rd-box a.kdex-badge { min-height: 28px; }
@media (max-width: 760px) { .kdex-rd__side .kdex-rd-box a.kdex-badge { min-height: 36px; } }
.kdex-rd__side h2.kdex-block-h { margin: var(--kx-sp-5) 0 var(--kx-sp-2); padding-bottom: var(--kx-sp-1); border-bottom: 1px solid var(--kx-ink); font-size: var(--kx-fs--1); letter-spacing: .04em; }
.kdex-rd__side .kdex-timeline > li { font-size: var(--kx-fs--1); padding: var(--kx-sp-1) 0; }

/* ===== 9. 검색 · 404 ===== */
.kdex-search-page .kdex-search, .kdex-404 .kdex-search { max-width: 640px; margin: var(--kx-sp-4) 0 var(--kx-sp-5); }
.kdex-404 .kdex-sections { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--kx-line); }
.kdex-404 .kdex-sections a { display: inline-flex; align-items: center; min-height: var(--kx-tap); padding: 0 var(--kx-sp-4); border: 1px solid var(--kx-line); border-left: 0; background: var(--kx-surface); text-decoration: none; }
.kdex-404 .kdex-sections li + li a { border-left: 0; }

/* ===== 10. 좁은 화면 ===== */
@media (max-width: 1180px) {
	.kdex-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.kdex-hd-logo span { display: none; }
	.kdex-hd__bar { gap: 0; }
	.kdex-menu-btn { display: inline-flex; }
	.kdex-hd__panel { display: none; position: fixed; left: 0; right: 0; top: var(--kx-hd-h); z-index: 55; flex-direction: column; align-items: stretch; gap: 0; max-height: calc(100vh - var(--kx-hd-h)); overflow-y: auto; background: var(--kx-surface); border-top: 1px solid var(--kx-line); border-bottom: 1px solid var(--kx-line2); box-shadow: var(--kx-shadow-2); }
	body.admin-bar .kdex-hd__panel { top: calc(var(--kx-hd-h) + 46px); }
	.kdex-menu-t:checked ~ .kdex-hd__panel { display: flex; }
	.kdex-hd__nav { order: 2; }
	.kdex-hd__nav .kdex-sections { display: grid; grid-template-columns: 1fr 1fr; height: auto; border-top: 1px solid var(--kx-line); }
	.kdex-hd__nav .kdex-sections li:nth-child(odd) { border-right: 1px solid var(--kx-line); }
	.kdex-hd__nav .kdex-sections li { display: block; }
	.kdex-hd__nav .kdex-sections a { min-height: 52px; padding: 0 var(--kx-sp-4); border: 0; border-bottom: 1px solid var(--kx-line); color: var(--kx-ink); }
	.kdex-hd__nav .kdex-sections a[aria-current] { box-shadow: inset 3px 0 0 var(--kx-accent); }
	.kdex-hd__tools { display: contents; }
	.kdex-hd__tools .kdex-search { order: 1; padding: var(--kx-sp-3) var(--kx-sp-4); }
	.kdex-hd__tools .kdex-search input[type=search] { width: auto; min-height: var(--kx-tap); }
	.kdex-hd__tools .kdex-search button { min-height: var(--kx-tap); }
	.kdex-hd__lang { order: 3; margin: var(--kx-sp-3) var(--kx-sp-4) var(--kx-sp-1); }
	.kdex-hd__lang > summary { min-height: var(--kx-tap); width: 100%; justify-content: space-between; box-sizing: border-box; }
	.kdex-hd__lang .kdex-pop__panel { position: static; box-shadow: none; border-top: 0; }
	.kdex-hd__tools .kdex-mode-btn { order: 4; min-height: var(--kx-tap); margin: var(--kx-sp-2) var(--kx-sp-4) var(--kx-sp-4); }
}
@media (max-width: 960px) {
	.kdex-dt, .kdex-rd { grid-template-columns: minmax(0, 1fr); gap: var(--kx-sp-5); }
	.kdex-dt__side { position: static; order: -1; }
	.kdex-rd__side { position: static; max-height: none; overflow: visible; }
	.kdex-tiles { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
	:root { --kx-hd-h: 56px; --kx-fs-5: 1.8rem; --kx-fs-4: 1.6rem; --kx-fs-3: 1.4rem; --kx-fs-2: 1.25rem; --kx-fs-1: 1.1rem; }
	.kdex-wrap { padding: 0 var(--kx-sp-4); }
	.kdex-page { padding-bottom: var(--kx-sp-7); }
	.kdex-ft__cols { grid-template-columns: 1fr; gap: var(--kx-sp-5); }
	.kdex-home-hero { padding: var(--kx-sp-6) 0 var(--kx-sp-5); }
	.kdex-home-hero .kdex-search input[type=search], .kdex-home-hero .kdex-search button { min-height: var(--kx-tap); font-size: var(--kx-fs-0); }
	.kdex-home-hero .kdex-search button { padding: 0 var(--kx-sp-4); }
	.kdex-tile { min-height: 96px; padding: var(--kx-sp-3) var(--kx-sp-4); }
	.kdex-filter { padding: var(--kx-sp-3); }
	.kdex-filter select { flex: 1 1 40%; min-width: 0; }
	.kdex-filter button { flex: 1 1 100%; }
	.kdex-filter .kdex-count { order: -1; flex: 1 1 100%; margin-left: 0; }
	.kdex-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.kdex-card > a { min-height: 96px; padding: var(--kx-sp-3); }
	.kdex-chapters a, a.kdex-badge { min-height: 36px; }
	.kdex-toc { flex-wrap: nowrap; overflow-x: auto; }
	.kdex-toc a { min-height: var(--kx-tap); white-space: nowrap; }
	.kdex-strip { grid-template-columns: repeat(20, 1fr); }
	.kdex-rd-bar { position: static; flex-wrap: nowrap; }
	.kdex-rd-langs { flex-wrap: nowrap; overflow-x: auto; }
	.kdex-rd-langs a, .kdex-rd-langs strong, .kdex-orig-label { min-height: var(--kx-tap); }
	.kdex-orig-label { flex: none; }
	.kdex-rd-body { font-size: var(--kx-fs-0); }
	.kdex-reading .kdex-s { text-align: left; }
	.kdex-rd-title { font-size: var(--kx-fs-2); }
	.kdex-reading-list a { flex-wrap: wrap; gap: 0 var(--kx-sp-3); }
	.kdex-rl-sub { flex: 1 1 100%; order: 3; font-size: var(--kx-fs--1); }
	.kdex-pagination .page-numbers { min-width: 40px; }
}
@media (max-width: 480px) {
	.kdex-grid { grid-template-columns: minmax(0, 1fr); }
	.kdex-card > a { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 0 var(--kx-sp-2); min-height: var(--kx-tap); padding: var(--kx-sp-3) var(--kx-sp-4); }
	.kdex-card .kdex-hanja { flex: 1; }
	.kdex-card .kdex-badges { flex: 1 1 100%; margin-top: var(--kx-sp-1); padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) { .kdex-tile, .kdex-card { transition: none; } }