/* 적로 — 한 권의 책 꼴(통합 설계안). 모든 쪽이 같은 틀: 윗줄 → 길 → 머리 → [보기 막대] → 본문(문단 = [글 | 곁]) → 꼬리 → 바닥줄.
   글줄 40rem + 오른쪽 곁 17rem. 동작은 둘: 실선 밑줄 = 다른 쪽으로 감 · 점선/번호 = 그 문단 곁(좁으면 문단 아래)에 펼침.
   색은 tokens.css의 변수만 쓴다. 두 기둥 배치는 page.js(와 머리 스크립트)가 html[data-layout=wide]로 정한다
   (화면 ≥ 1100px 이고 화면 ÷ rem ≥ 62 — 글자를 키우면 한 기둥이 된다). 자바스크립트가 없으면 한 기둥 + 모든 층·곁주를 펼쳐 보인다. */
*{box-sizing:border-box}
html{font-size:calc(100% * var(--scale));background:var(--paper);-webkit-text-size-adjust:100%;scroll-padding-top:1rem}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body-face);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400;
  word-break:keep-all;overflow-wrap:break-word;line-break:strict;font-feature-settings:"halt";text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
[lang|=zh]{font-family:var(--serif);font-feature-settings:normal;word-break:normal;letter-spacing:var(--han-ls)}
[lang|=zh] [lang=ko]{letter-spacing:0}
h1,h2,h3,.sub{font-family:var(--serif)}
:where(b,strong,th){font-weight:600}
[hidden]{display:none!important}
::selection{background:var(--mark)}
a{color:inherit}
:focus-visible{outline:3px solid var(--zhu);outline-offset:3px;border-radius:2px}
[tabindex="-1"]:focus{outline:none}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;background:var(--paper);padding:.5rem 1rem;font-family:var(--sans);z-index:40}.skip:focus{left:1rem}
.dim{color:var(--ink-3)}
html:not(.js) .js-only{display:none!important}

/* ── 두 가지 동작 ── */
.wl{text-decoration:underline;text-decoration-color:var(--zhu);text-decoration-thickness:1.5px;text-underline-offset:.22em}
.wl:hover{color:var(--zhu)}
.ext::after{content:" ↗";font-size:.85em}
.red{color:var(--ink-3)}.red small{font-family:var(--sans);font-size:.8em;margin-left:.2em}
.ent,.anc{text-decoration:underline dotted;text-decoration-thickness:1px;text-decoration-color:var(--dot);text-underline-offset:.3em;cursor:pointer;color:inherit}
.ent:hover,.anc:hover,.ent:focus-visible,.anc:focus-visible,.ent[aria-expanded=true],.anc[aria-expanded=true]{text-decoration-color:var(--zhu);text-decoration-style:solid;text-decoration-thickness:1.5px}
.ent[aria-expanded=true],.anc[aria-expanded=true]{background:var(--zhu-bg)}
.no-ent .ent{text-decoration:none}
@media (max-width:760px){.ent,.anc{text-decoration-thickness:2px}.ent:hover,.anc:hover,.ent:focus-visible,.anc:focus-visible,.ent[aria-expanded=true],.anc[aria-expanded=true]{text-decoration-thickness:2.5px}}   /* 좁은 화면 점선은 2px(2026-10-30 바깥눈) */
.anc.mk{text-decoration:none;font-family:var(--sans);font-size:.8em;color:var(--ink-2);padding:0 .05em;border-radius:.2rem}
.anc.mk:hover,.anc.mk[aria-expanded=true]{color:var(--zhu)}
.fn{font-family:var(--sans);font-size:var(--fs-num);line-height:1.4;border:1px solid var(--rule);border-radius:.2rem;padding:0 .35em;margin-left:.2em;text-decoration:none;color:var(--ink-2);vertical-align:.1em;cursor:pointer;white-space:nowrap}
.fn:hover,.fn[aria-expanded=true]{border-color:var(--zhu);color:var(--zhu)}
/* 작은 장치의 누름 자리 44px(투명하게 넓힘 — 글자·자리는 그대로): 각주 번호 · 문단 번호 · 곁 닫기 · ↑ 본문 자리 */
.fn,.up,html:not([data-layout=wide]) .pnum{position:relative}
.fn::after,.up::after,.pnum::after{content:"";position:absolute;left:50%;top:50%;width:max(100%,var(--hit));height:max(100%,var(--hit));transform:translate(-50%,-50%)}

/* ── 윗줄 ── */
.top{font-family:var(--sans);font-size:var(--fs-ui);border-bottom:1px solid var(--rule);background:var(--paper)}
.top .in{max-width:calc(var(--measure) + var(--gap) + var(--aside) + 2 * var(--gutter));margin:0 auto;padding:0 var(--gutter);display:flex;align-items:center;gap:.125rem;min-height:var(--hit-big);flex-wrap:wrap}
.top a,.top button{min-height:var(--hit);display:inline-flex;align-items:center;padding:0 .625rem;color:var(--ink-2);text-decoration:none;background:none;border:0;font:inherit;cursor:pointer;border-radius:.25rem;white-space:nowrap}
.top a:hover,.top button:hover{color:var(--ink);background:var(--paper-2)}
.top a.site{color:var(--ink);font-weight:500;padding-left:0}
/* 이름 로고 赤爐 한 장(마스크 — 본문색 · 어두운 화면을 따름). 높이만 정하고 폭은 aspect-ratio */
.wm{display:inline-block;height:2.3em;background:currentColor;-webkit-mask:var(--g) left center/contain no-repeat;mask:var(--g) left center/contain no-repeat;vertical-align:middle}   /* 소전 두 자(赤爐 — 崇羲篆體 그림 그대로, 폭:높이 1.52) — 획이 가늘어 글자보다 크게: 윗줄 2.3em · 대문 2.4em · 바닥줄 2.2em · 길 1.9em */
.bottom .wm{height:2.2em}
/* 로고 곁 한글 이름 — 고운바탕 굵게(SIL OFL 1.1)에서 '명심초감' 네 자만 자른 글꼴(build/logo/name-gowun-batang-bold.woff2 · 만들기: fontTools.subset --text=명심초감) */
@font-face{font-family:'SiteName';src:url(data:font/woff2;base64,d09GMgABAAAAAAasAA8AAAAADAgAAAZWAAIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGyAcKgZgAEwRCAqOXIsyATYCJAMUCwwABCAFg0QHIBckGAwbUQlRVG0yAD8SMjc12qMRQ5ksJksZciUX3vkugvqx3967L4pXrZSkDZJpSJRmktqfTguE6vLzuGnvE/DWQ4CKCFUHKiJYbW6wOdx5EroysepErDKTAGcixfk//5fTxrJ7YTa2YMSJjDF/HxsL5Aa1BkZT4GPUO2osOmsRJhrIBMEwcOxt6KS5A8Qk89eOFkCLDz9oXlHRAHxswH9ARxEmAgvNZV+9dD5INdk2V3Iz6wpwQDlntQBYGKPFHsijDAgWmFnaVCkhoOf2kI8t/P8UVE5RgJqkTGJOqQnYRAQ0xQgMgmzpOdLzsbB6bpe23PrmIT8zB3/r5ceSdTkS+T+AUlCg/1rlKgCk/aAcxMtdVY6xmX5pbKEkebz7Mjd3p6Qkd//KfJna5Nc0PBw26m0NHTkbanY4ZkVj58ONIotF3EhJyaFd+C5GSk2AYRwftZsYJoQcbzt0jqAtkssOhyPJIjzEhByaCkGHaIKeJOjDorO2tPMOiUVMXRRTFE6ekDIMozV5DR9ARoQZhyfDaFpiHROPXBSPALkL4Px9iYUSU7vBMC4ctQvBsO+IzuxwpFkdBwkjLTRNMUzyEh806NBUCEkS9OhoLGYjZ8PN58PRVDJpIuhLBEniQ/v2ZWs9M0LTMFHgPMuYmBoRm2dnz0vQJ3lKuEV0VumnRmYLWYZ9R1pMdjsyOhwis812iBlmMBluPYgcZALnwCQIPmhnpw0G21JivWTZ3yixWtPgnL9DCiePSMlx/KEtlDq6G4YuEJPPnj2KYpjWxXEsbh1luNvDcK1kbwthIoVnmOTN8qI7OWJTtqBy9mONXWS32DAupGfsQpMJn4ChiIt3p1NGrh4VU0OHCLu96QrDNJjsXNdelpgtoiLjnmGCpiWWsHspCob2SX3OO8JnHeEWkXlTjWiy/gdATk3h5JzRmXsEbbWKRmw2kXk2nJrAySH8EGOKaJUFOd/2m8zIrD32E1LhXkVQiDy4N+1hgBb3GBWut+TS6nxBIl+ZRxdhzoKTCSXQ1IzKkWHtK8yCfks0u/rsEm2ZWlO1OEYqrClguZ+0MRD0MKG/pJKm81XtSP20Ueg489ovJ6YWt5VlUxsDCuabX1r6OXJvUBAebJa/TzaKoV4uXbjzJ+1vf3k7+3RKLNoPbh9k/E9Z9TOvtYn3iYIVVCqbvFSbGqoGXaqFUNBxFei4ghO1qB4hmHL2TM4Id1M8C8dufbCxbk81JpIIWT8bROqa5VsibrtuXOKxnOvNDnphXQgdxnIiTi6qbUJlyH3+ZhfnX/w9f/J7X5ZZW1n908cfvw4kqPfX7P/809PPit1+rucofFcJmhJFgflhaR5eJhu/cK2/UBubVpOcnF3bG5+bq4/IqspM5R9afXFWmZcKyvIUckElPIFAxxWVoAaUqL+Uoswi8LLMlBRlgTxZkQmKDfjowpE/lsdws2meSqVoyej6FxV1nIt+bumFwM/DH1y577U36OD6uJesnUlvbJL/5Z6oucUOprsTEopXrP9lYDUHzFm3Kz+TTDZ5CcYjT9XlcRdtOt2aUV2UXnItM5Z3g9NTzunzPHUOYPlWJW0V2Fs5CXINJl/c4HIKXzP3AJtfx9uvVqAwZ+mJRe7vdp1grMWhsHxU9nPmovzQ18rzpSatQp3Y+5nLm38WEhFdN3/T8Iu8mwGmRgOpt5bPbd3Qdwtjxs4PchKUGK4uRPnPdU6f3xaIXhj8mdc+w12sZFVA8CrcZw9iP5RwT70WtjOoS3wvOfimYHMBtxCTBmgCf6jlCf49Jy7gKAEggAKG5v6p7nbN/pWf2BeAm+zGB+Pdnz3+9//C/8Xan+wrQLhYlrjK6X8fUO9qiH6xIYCQ5dXcDLp8CfxyIYRkL7jy0AOSogFMs0Pdzjq3ra4NBlUEAK4BmgqRuqBi4XuiwqR6Q8UWFC4qDq9IuA5XQJRBkQUWWmWxAX36LRVALoFcogANna0nKi2wwjLzQbeQ2lJqV98NaiyWlwfpae1BgWVj0G+BrLxEgAi/YKmFMyBTPIV9BrSKy2jEWYIF5kl8q7yaY7r03bVKpz0+tn5sf5FZuQo7dS4duTgJlJilTisVJeewrLz8sVBnrQ4t2ERfHRywQNMRqzH/EQwx+I8cPgYAvfzXyS9wpv8+/p+qhAD8Dc6QpmEMn7ojAAAAAA==) format('woff2');font-weight:700;font-display:block}
.wm-k{font-family:'SiteName',var(--serif);font-weight:700;font-size:1.375em;letter-spacing:.02em;margin-left:.45em;vertical-align:middle;white-space:nowrap}
.top a.site{display:inline-flex;align-items:center}
@media (max-width:760px){.top .wm{height:1.9em}}
.crumbs .wm{height:1.9em}.crumbs li:first-child a{min-width:var(--hit);justify-content:center}
.smark{white-space:nowrap}
.smark .sm{display:inline-flex;gap:.02em;margin-left:.04em;vertical-align:-.34em}
.smark .sm .seal{width:1.45em;height:1.45em;margin:0}   /* 소전 획이 가늘어 한글(500)과 무게를 맞추려 글자보다 크게 */
.smark.big .sm{vertical-align:-.26em}
.smark.big .sm .seal{width:1.3em;height:1.3em}
.top a[aria-current=page]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--zhu)}
.top .sp{flex:1 1 0;min-width:0}
html[data-layout=wide] .top .in{flex-wrap:nowrap}   /* 넓은 배치에서 윗줄이 두 줄로 내려가지 않게 — 빈 칸과 찾기 칸이 먼저 줄어듦 */
html[data-layout=wide] .top .doors{flex-shrink:.01}   /* 문(관리자 '관리' 포함)보다 찾기 칸이 먼저 줄어듦 — 문이 둘째 줄로 내려가는 것은 칸이 최소 폭에 닿은 뒤 */
.top .tools{display:flex;gap:.375rem}
.top .tools a,.top .tools button{border:1px solid var(--ink-3)}   /* 눈 단추와 찾기 칸은 같은 꼴(테두리 --ink-3) */
.top .tools button.eye{width:var(--hit);padding:0;justify-content:center}   /* '글자 크기' = 눈 아이콘 단추(정사각 누름 자리 44px · 선은 currentColor) */
.top .tools button.eye svg{display:block}
html:not([data-layout=wide]) .top .tools button.eye{width:var(--hit-big);min-height:var(--hit-big)}
.top .tools a:hover,.top .tools button:hover{border-color:var(--ink)}
/* 윗줄 찾기 칸(2026-10-29): 칸 + 돋보기. 글자는 16px 이상(iOS 확대 방지), 누름 자리 44px(좁은 화면 48px). 좁으면 칸이 남는 폭만큼 줄어듦(넘치지 않게) */
.top .hs{display:flex;align-items:stretch;flex:0 1 10.5rem;width:10.5rem;min-width:8rem;margin-right:.375rem;border:1px solid var(--ink-3);border-radius:.25rem;background:var(--paper)}
.top .hs:hover{border-color:var(--ink)}
.top .hs:focus-within{outline:3px solid var(--zhu);outline-offset:2px}
.top .hs input{flex:1;min-width:0;height:calc(var(--hit) - 2px);padding:0 0 0 .625rem;border:0;background:none;color:var(--ink);font:inherit;font-family:var(--sans);font-size:max(1.0625rem,16px);outline:none;border-radius:.25rem 0 0 .25rem;-webkit-appearance:none;appearance:none}
.top .hs input::placeholder{color:var(--ink-3);opacity:1}
.top .hs input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.top .hs button{flex:none;width:var(--hit);min-height:0;padding:0;justify-content:center;border-radius:0 .25rem .25rem 0}
.top .hs button svg{display:block}
html:not([data-layout=wide]) .top .hs{flex:1 1 7rem;width:auto;max-width:20rem;margin-left:auto}
html:not([data-layout=wide]) .top .hs input{height:calc(var(--hit-big) - 2px)}
html:not([data-layout=wide]) .top .hs button{width:var(--hit-big)}
html:not([data-layout=wide]) .top .sp{display:none}
/* 아래로 내리면 윗줄은 그냥 위로 사라지고, 위로 조금 올리면 화면 위에 붙어 내려온다(page.js — 맨 위에 오면 원래 자리). 자리를 지키는 빈 칸 .top-sp는 붙는 동안만 */
.top.pin{position:fixed;top:0;left:0;right:0;z-index:20;animation:top-in .18s ease-out}
.top.pin.out{transform:translateY(-100%);transition:transform .16s ease-in}
@keyframes top-in{from{transform:translateY(-100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.top.pin{animation:none}.top.pin.out{transition:none}}
html.has-pin{scroll-padding-top:calc(var(--toph,0px) + 1rem)}
.top .doors{display:flex;flex-wrap:wrap;gap:0 .125rem}
/* 넓은 배치가 아니면(태블릿·휴대폰·큰 글자) 문 다섯을 둘째 줄에 — 숨기지 않고, 넘치면 줄을 바꾼다(가로 스크롤 없음) */
html:not([data-layout=wide]) .top .doors{order:3;flex-basis:100%;border-top:1px solid var(--rule-2);margin:0 calc(-1 * var(--gutter));padding:0 calc(var(--gutter) - .625rem)}
html:not([data-layout=wide]) .top .in{padding-top:.125rem}

/* ── 쪽 ── */
.page{max-width:calc(var(--measure) + var(--gap) + var(--aside) + 2 * var(--gutter));margin:0 auto;padding:1.75rem var(--gutter) 4rem}
.head,.body>*,.foot,.crumbs,.band,.bar{max-width:var(--measure)}
.crumbs{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 1rem}
.crumbs ol{display:flex;flex-wrap:wrap;gap:0 .4rem;padding:0;margin:0;list-style:none}
.crumbs li{margin:0;display:inline-flex;align-items:center}
.crumbs li+li::before{content:"›";margin-right:.4rem}
.crumbs a{text-decoration:none;min-height:var(--hit);display:inline-flex;align-items:center}.crumbs a:hover{text-decoration:underline}
.band{font-family:var(--sans);font-size:var(--fs-ui);border:1px solid var(--rule);border-radius:.375rem;padding:.5rem .875rem;margin:0 0 1.5rem;display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem;background:var(--paper-2)}
.band b{font-weight:500}
.band a{min-height:var(--hit);display:inline-flex;align-items:center;text-decoration:none;color:var(--zhu);font-weight:500;margin-left:auto}
.band a:hover{text-decoration:underline}
.kicker{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 .5rem}
h1{font-size:var(--fs-h1);line-height:1.35;font-weight:500;margin:0 0 .5rem;letter-spacing:-.005em}
.sub{font-size:var(--fs-han);line-height:1.6;color:var(--ink-2);margin:0 0 .5rem}
.meta{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);margin:0 0 2rem;display:flex;flex-wrap:wrap;gap:.25rem 1rem}
.meta a{text-decoration:none}.meta a:hover{text-decoration:underline}
h2{font-size:var(--fs-h2);font-weight:500;line-height:1.4;margin:2.75rem 0 1rem}
h3{font-size:var(--fs-h3);font-weight:600;line-height:1.5;margin:2rem 0 .75rem}
h4{font-family:var(--sans);font-size:var(--fs-label);font-weight:500;color:var(--ink-2);margin:1.5rem 0 .5rem}
h2 .n,h3 .n{font-family:var(--sans);font-size:var(--fs-label);font-weight:400;color:var(--ink-3);margin-left:.5rem}
p{margin:0 0 1.25rem}
ul,ol{padding-left:1.25rem;margin:0 0 1.25rem}li{margin:0 0 .375rem}
blockquote{margin:0 0 1.25rem;padding-left:1rem;border-left:2px solid var(--rule);color:var(--ink-2)}
code{font-family:var(--mono);font-size:.9em;background:var(--paper-2);padding:.05em .3em;border-radius:.2em;word-break:break-all}
pre{font-family:var(--mono);font-size:.9rem;line-height:1.7;background:var(--paper-2);padding:1rem 1.25rem;border-radius:.25rem;overflow:auto;margin:0 0 1.5rem}
pre code{background:none;padding:0;word-break:normal}
.tbl{overflow-x:auto;margin:0 0 1.5rem}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:.5rem .75rem .5rem 0;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-family:var(--sans);font-weight:500;font-size:var(--fs-label);color:var(--ink-2)}
hr{border:0;border-top:1px solid var(--rule);margin:2.5rem 0}
img{max-width:100%;height:auto}
.han-block{font-size:var(--fs-han);line-height:var(--lh-han);text-align:justify}
.btn{font-family:var(--sans);font-size:var(--fs-ui);min-height:var(--hit);padding:0 .875rem;border:1px solid var(--ink-3);border-radius:.375rem;background:var(--paper);color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;text-decoration:none;line-height:1.3}
.btn:hover{border-color:var(--ink)}
.btn.pri{background:var(--paper-2);border-color:var(--ink-2);font-weight:500;min-height:var(--hit-big)}
.btn[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.row{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.5rem}

/* ── 문단 + 곁주 ── */
.para{position:relative;margin:0 0 1.5rem}
.para>.txt{position:relative}
.para>.txt>p:last-child{margin-bottom:0}
.prose>.para{margin-bottom:1.25rem}
.pnum{font-family:var(--sans);font-size:var(--fs-num);color:var(--ink-3);user-select:none;display:inline-flex;align-items:center;min-height:1.5rem;margin-right:.5em;text-decoration:none;background:none;border:0;padding:0 .25rem;cursor:pointer;border-radius:.2rem;vertical-align:.08em;white-space:nowrap}
.pnum:hover,.pnum[aria-expanded=true]{color:var(--zhu);background:var(--zhu-bg)}
.pnum.han{font-family:var(--serif);font-weight:500;font-size:var(--fs-label)}
.ly{margin:0}
.ly+.ly{margin-top:.75rem}
/* 쉽게 읽기 보기의 첫 층은 위 여백 없이(앞의 숨은 층 때문에 넓은 화면에서 문단 번호와 첫 줄이 어긋나던 것) */
article[data-view=easy] .ly-easy,article[data-view=easy][data-easy="0"] .ly-sch{margin-top:0}
article[data-view=easy] .ly.peek~.ly-easy,article[data-view=easy][data-easy="0"] .ly.peek~.ly-sch{margin-top:.75rem}
.ly-lab{display:none;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin-bottom:.125rem;letter-spacing:0}
.ly-han{font-size:var(--fs-han);line-height:var(--lh-han);text-align:justify}
.note,.ly-han,.han-block,.body p{text-wrap:pretty}
article[data-view] .ly{display:none}
article[data-view=easy] .ly-easy,article[data-view=easy][data-easy="0"] .ly-sch,article[data-view=cmp] .ly-han,article[data-view=cmp] .ly-sch{display:block}
[data-view=easy] .only-cmp,[data-view=cmp] .only-easy{display:none}
.ly.peek .ly-lab{display:block}   /* 층 이름표(한문 · 번역 · 쉽게 읽기)는 쉬운 번역과 학술 번역이 함께 보일 때(들여다보기)만 — 깊이 읽기에서는 뺌(2026-10-30 사용자: 한글이면 번역인 줄 안다, 한문은 크기로 가름) */
[data-view=cmp] .ly-han,.ly-han.peek{font-size:calc(var(--fs-body) * 1.125);line-height:var(--lh-han)}   /* 깊이 읽기: 한문은 번역보다 한 단계 크게(2026-10-25 — 이름표 대신 글자 크기로 가름) */
[data-view=cmp] .ly,.ly.peek{padding-left:.875rem;border-left:2px solid var(--rule-2)}
[data-view=cmp] .ly-han,.ly-han.peek{border-left-color:var(--rule)}
.ly.peek{display:block!important;margin-top:.75rem}
/* 깊이 읽기 대조 단위(.units): 한 문단 안에서 [한문 단위][학술 단위]를 번갈아 — 문장마다 상자를 두르지 않는다.
   이름표는 첫 짝에만, 세로줄은 문단에 하나, 짝 안 .5rem · 짝과 짝 사이 1rem(간격으로 묶음) */
.units>.ly{border-left:0!important;padding-left:0!important;margin:0}
.units>.ly-sch.u{margin-top:.25rem}
.units>.ly-han.u:not(.u0){margin-top:1.625rem}
.units>.ly.peek{margin-top:.5rem}.units>.ly-han.peek:not(.u0){margin-top:1rem}
[data-view=cmp] .units,html:not(.js) .units,.units:has(>.peek){padding-left:.875rem;border-left:2px solid var(--rule-2)}
.units+.ly{margin-top:.75rem}
/* 깊이 읽기: 한글 번역이 먼저 눈에 들게 — 한문은 한 단계 흐리게(--ink-2) · 줄간격 촘촘히, 짝 안은 붙이고 짝 사이는 띄움(눈이 짝을 묶어 읽음) */
[data-view=cmp] .ly-han{color:var(--ink-2);line-height:1.75}
[data-view=cmp] .ly-han+.ly-sch{margin-top:.25rem}
/* 금강경 깊이 읽기(책처럼 — build/geumgang.js): 대조 단위(.gu)마다 [구마라집 한문 → 그 번역][현장 한문 → 그 번역], 없는 쪽은 '… 역에 없음' 한 줄.
   역 이름표(.who)는 한문 줄 머리에 장치 글자로. 짝은 여백으로만 가른다(세로줄 · 상자 없음) — 층위가 '짝 안 < 두 역 사이 < 단위 사이 < 문단 사이'로:
   한문→번역 .375rem · 구마라집 짝→현장 짝 1.25rem · 단위 사이 2.5rem · 문단 사이 3rem(넓은 배치) */
.units.gg{padding-left:0!important;border-left:0!important}
.units.gg .ly{border-left:0!important;padding-left:0!important;margin:0}
.units.gg .gu+.gu{margin-top:2.5rem}
html[data-layout=wide] .para:has(>.txt>.units.gg){margin-bottom:3rem}   /* 좁은 화면은 문단 번호 줄이 이미 띄움 */
.units.gg .gu>.ly-han+.ly-sch{margin-top:.375rem}
.units.gg .gu>*+.xz.ly-han,.units.gg .gu>*+.gnone{margin-top:1.25rem}
.units.gg .gu>.ly-han+.ly-han{margin-top:.625rem}
.units.gg .who,.units.gg .gnone{font-family:var(--sans);font-size:var(--fs-label);font-weight:400;color:var(--ink-2);letter-spacing:0}
.units.gg .who{margin-right:.5em}
.units.gg .gnone{margin:0;line-height:1.6}
.units.gg .ly{white-space:pre-line}   /* 偈 시 줄 · 문단에 걸친 단위의 줄바꿈('\n' — geumgang.js) */
/* 쉽게 읽기 긴 문단의 표시 줄바꿈(문답 한 차례마다 — 번호·들여쓰기 없이) */
.ly-easy .turn{display:block}
.ly-easy .turn+.turn{margin-top:.5em}
article[data-view] .hanwhole .ly-han{display:block}
/* 층별 곁주: 교감은 한문 곁, 국역본 대조는 학술 곁 — 둘 다 '깊이 읽기'에서만 */
[data-view=easy] .note[data-ly=han],[data-view=easy] .note[data-ly=sch],[data-view=cmp] .note[data-ly=easy]{display:none}
html.js [data-view=easy] .v-cmp:not(.vnote),html.js [data-view=cmp] .v-easy:not(.vnote){display:none}   /* 한 보기에서만 뜻 있는 장치(깊이 읽기에서 봄) */
[data-view=easy][data-easy="0"] .note[data-ly=sch]{display:block}
.para.all .note{display:block!important}
/* 자바스크립트가 없으면 모든 층·곁주를 이름표와 함께 펼친다 */
html:not(.js) article[data-view] .ly,html:not(.js) .only-cmp,html:not(.js) .only-easy{display:block}
html:not(.js) .ly-lab{display:block}
html:not(.js) article[data-view] .ly{padding-left:.875rem;border-left:2px solid var(--rule-2)}
html:not(.js) .note{display:block!important}
/* 보기 막대 */
.bar{font-family:var(--sans);font-size:var(--fs-ui);display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .5rem;margin:0 0 1.75rem;padding:.25rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.head>.bar{margin-top:1rem}
.bar .grp{display:flex;flex-wrap:wrap;gap:.125rem}
.bar .lab{color:var(--ink-2);font-size:var(--fs-label);margin-right:.25rem}
.bar button{min-height:var(--hit);padding:0 .75rem;border:0;background:none;font:inherit;color:var(--ink-2);cursor:pointer;border-radius:.25rem}
.bar button:hover{background:var(--paper-2);color:var(--ink)}
.bar button[aria-pressed=true]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--zhu);font-weight:500}
html:not(.js) .bar{display:none}
.vnote{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 2rem;max-width:var(--measure)}
html:not(.js) .vnote{margin-top:1rem}
[data-view=easy] .vnote.v-cmp,[data-view=cmp] .vnote.v-easy{display:none}
/* 곁주 */
details.fold{font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2);margin:0 0 1rem;border-top:1px solid var(--rule-2)}
details.fold>summary{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);cursor:pointer;min-height:var(--hit);display:flex;align-items:center;gap:.4rem;list-style:none}
/* 접힘 표시: 갈매기표 + '· 펼치기'(열리면 '· 접기') — display:flex가 기본 삼각표를 지우므로 */
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary::before{content:"";flex:none;width:.45rem;height:.45rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);margin-right:.2rem}
details.fold[open]>summary::before{transform:rotate(45deg)}
details.fold>summary::after{content:"· 펼치기";color:var(--ink-3)}
details.fold[open]>summary::after{content:"· 접기"}
details.notes{font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2);margin:.5rem 0 0}
details.notes summary{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);cursor:pointer;min-height:var(--hit);display:flex;align-items:center;list-style:none;gap:.4rem}
details.notes summary::-webkit-details-marker{display:none}
details.notes summary::before{content:"";width:.45rem;height:.45rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);margin-right:.2rem}
details.notes[open] summary::before{transform:rotate(45deg)}
details.notes{border-top:1px solid var(--rule-2)}
details.notes[open]{padding-bottom:.5rem}
.note{margin:0 0 .875rem;padding-left:.75rem;border-left:2px solid var(--rule);overflow-wrap:anywhere}
.note:last-child{margin-bottom:0}
.note p{margin:0 0 .4rem}.note p:last-child{margin:0}
.nlab{font-family:var(--sans);font-weight:500;font-size:var(--fs-label);color:var(--ink-2);display:block;margin-bottom:.1rem}
.note .v{display:inline-block;font-family:var(--sans);font-size:var(--fs-num);font-weight:500;color:var(--zhu);border:1px solid currentColor;border-radius:.2rem;padding:0 .3rem;line-height:1.45;margin-right:.3rem;vertical-align:1px}
.note .k{font-weight:500;color:var(--ink)}
.note .go{font-family:var(--sans);font-size:var(--fs-label);display:inline-block;margin-top:.25rem}
.note .x{float:right;font-family:var(--sans);font-size:var(--fs-label);background:none;border:0;color:var(--ink-2);cursor:pointer;min-height:var(--hit);min-width:var(--hit);padding:0 .5rem;margin:-.625rem -.5rem -.25rem .25rem;border-radius:.25rem}
.note .x:hover{color:var(--zhu)}
.note.on{border-left-color:var(--zhu);background:var(--zhu-bg);padding-top:.25rem;padding-bottom:.25rem;padding-right:.5rem;border-radius:0 .25rem .25rem 0}   /* 눌린 점선의 곁주 — 점선 구절과 같은 바탕 */
.note:target,.anc:target{background:var(--zhu-bg)}   /* 자바스크립트 없이 점선 ↔ 곁주를 오갈 때 */
.note.gloss,.note.pcard{border-left-color:var(--zhu)}
/* 곁주 머리(2026-10-26 사용자 — 상자 안에는 표제와 풀이 글만): 표제 한 줄(.nh) — 인물·용어 쪽이 있으면 실선 링크(.hd), 누름 자리 44px(좁은 화면 48px) */
.note .nh{display:block;margin:0 0 .125rem}
.note .hd{font-weight:500;color:var(--ink)}
.note a.hd{display:inline-flex;flex-wrap:wrap;align-items:center;gap:0 .3em;min-height:var(--hit);margin:-.5rem 0 -.375rem}
.note .hd .k{font-weight:500}
/* 표제는 낱말 가운데서 줄이 갈리지 않게 — 두 말을 이은 표제(折腳鐺子·茆茨石室)는 '·' 뒤에서만(<wbr>, 2026-10-30 사용자) */
.hd .k,.hd .r{word-break:keep-all}
/* 곁 상자 표제는 늘 두 줄 — 한자 한 줄, 그 아래 한글 읽기(+ 링크면 ›). 길이에 따라 한 줄 · 두 줄이 섞이지 않게(2026-10-30 사용자 '일관성만 맞춰라') */
.note .hd .k,.words .hd .k{display:block;flex-basis:100%}
/* 읽기(.r)가 없는 표제는 한 줄 — 꺾쇠가 혼자 다음 줄로 떨어지지 않게 */
.note .hd .k:last-child,.words .hd .k:last-child{flex-basis:auto}
/* 표제가 인물·용어 쪽 링크임을 알리는 꺾쇠(2026-10-29 — 안내 글 없이): 링크 안에서 함께 눌림 · 밑줄 밖 · 화면 읽기는 건너뜀(대체 글 비움) */
.note a.hd::after{content:"›";content:"›" / "";flex:none;font-family:var(--sans);font-weight:400;font-size:1.25em;line-height:1;color:var(--ink-2);margin-left:-.05em;text-decoration:none}
.note .mk{font-family:var(--sans);font-size:var(--fs-num);color:var(--ink-2);margin-right:.15rem}
/* 낱말 상자에 합친 자리 주석: 이 자리 뜻이 먼저, 일반 뜻은 아래 조금 작게(좁은 화면에서도 본문의 0.9배 이상 · --ink-2) */
.gloss .here{margin:0 0 .5rem}
.gloss .here:last-child{margin-bottom:0}
.gloss .gen{font-size:.9375em;color:var(--ink-2);margin:.5rem 0 0;padding-top:.5rem;border-top:1px solid var(--rule-2)}
/* 역주 편 쪽의 곁주는 모든 보기에서 늘 띄우지 않는다 — 점선 · 각주 번호 · 문단 번호를 누를 때만(.on · 문단 카드 '주석 n개 보기' = .all) */
html.js article[data-view] .para>details.notes>.note:not(.on):not(.gloss):not(.pcard){display:none}
html.js article[data-view] .para .note.on{display:block!important}   /* 누른 점선의 곁주는 그 층이 지금 보기에서 숨는 것이라도(들여다보기로 펼친 한문의 교감 등) 그것 하나만 */
html.js [data-view=easy] .note.wa{display:none!important}   /* 낱말 상자에 합친 자리 주석 — 따로 그리지 않는다 */
/* 해설(오조법연): 단 끝 접힌 덩어리 하나 — 접혀 있어도 눈에 띄게(테두리 · 주색 이름표 · 첫머리 한 줄). 자바스크립트가 없으면 펼친 채 */
details.haeseol{margin:2.5rem 0 0;border:1px solid var(--rule);border-left:3px solid var(--zhu);border-radius:.375rem;background:var(--paper-2);padding:0 1rem}
details.haeseol>summary{list-style:none;cursor:pointer;min-height:var(--hit-big);display:flex;flex-wrap:wrap;align-items:center;gap:.125rem .5rem;padding:.5rem 0}
details.haeseol>summary::-webkit-details-marker{display:none}
details.haeseol>summary::before{content:"";flex:none;width:.5rem;height:.5rem;border-right:1.5px solid var(--zhu);border-bottom:1.5px solid var(--zhu);transform:rotate(-45deg);margin:0 .25rem 0 .125rem}
details.haeseol[open]>summary::before{transform:rotate(45deg)}
details.haeseol .hs-t{font-family:var(--sans);font-weight:500;font-size:var(--fs-ui);color:var(--zhu)}
details.haeseol .hs-t::after{content:" · 펼치기";color:var(--ink-3);font-weight:400}
details.haeseol[open] .hs-t::after{content:" · 접기"}
html:not(.js) details.haeseol .hs-t::after{content:none}
details.haeseol .hs-lead{flex-basis:100%;color:var(--ink-2);font-size:var(--fs-note);line-height:var(--lh-note);padding-left:1.125rem}
details.haeseol[open] .hs-lead{display:none}
details.haeseol .hs-body{padding:0 0 1rem}
details.haeseol .hs-body p:last-child{margin-bottom:0}
.pcard .row{margin:.375rem 0 .25rem;gap:.5rem}
.pcard .btn{min-height:var(--hit);font-size:var(--fs-note);padding:0 1rem}
/* 한자 누르면 풀이(역주 편 한문 줄 — page.js · build/hz.js): 글자마다 표시 없음. 누른 글자 · 덮는 자리(.hzc)는 펼친 동안 점선 구절과 같은 바탕 */
.ly-han.hz-hot,.ly-han .hzc{cursor:pointer}
.hz[aria-expanded=true],.hzc[aria-expanded=true]{background:var(--zhu-bg);border-radius:2px}
.hz:focus:not(:focus-visible),.hzc:focus:not(:focus-visible){outline:none}
/* 상자: 표제(字 + 훈음 ›) · 소전은 매단 칸(글이 그림 밑으로 돌지 않게) · 지금 뜻 · 불교에서(0.9375배 · --ink-2) */
.hz-b{display:flex;align-items:flex-start;gap:.625em}
/* 매단 칸 = 소전 + 바로 아래 같은 글자의 해서(HJ Kai — 서체 견본, 본문 글꼴 설정과 상관없음; 소전이 없으면 해서만) */
.hz-g{flex:none;display:flex;flex-direction:column;align-items:center;width:2.25em;margin:.125em 0 0;color:var(--ink)}
.hz-b .hz-seal{flex:none;width:2.25em;height:2.25em;margin:0}
.hz-kai{display:block;font-family:var(--kai);font-weight:400;font-synthesis:none;font-size:2em;line-height:1.125;margin:.0625em 0 0}
.hz-t{flex:1;min-width:0}
.hz-t p{margin:0 0 .4rem}.hz-t p:last-child{margin:0}
.hz-t .hz-bu{font-size:.9375em;color:var(--ink-2)}
/* 글자 단추 줄(문단 카드 '이 문단 한자 풀이' · 낱말 상자 끝 — 누름 자리 44px · 좁은 화면 48px) + 그 아래 고른 글자 풀이 */
.hzl .row{margin:.5rem 0 .25rem;gap:.25rem}
.hzl .btn.hzk{min-width:var(--hit);min-height:var(--hit);padding:0 .25rem;justify-content:center;font-family:var(--body-face);font-size:1.25rem;line-height:1}
.hzl .btn.hzk[aria-expanded=true]{background:var(--zhu-bg);border-color:var(--zhu)}
.hzl .hzd{margin:.5rem 0 0;padding-top:.5rem;border-top:1px solid var(--rule-2)}
html:not([data-layout=wide]) .hzl .btn.hzk{min-width:var(--hit-big);min-height:var(--hit-big)}
/* 좁은 화면의 곁(page.js mount): 누른 문장 바로 뒤(.inl) · 아래에서 올라오는 판(.sheet — 문장이 아주 길 때). 둘 다 그 하나만 보인다 */
.inl{display:block;clear:both;margin:.625rem 0 .875rem;font-family:var(--body-face);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400;color:var(--ink);text-align:left;text-indent:0;letter-spacing:0;word-break:keep-all}
.inl .note,.sheet .note{display:block!important;margin:0}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:30;max-height:min(60vh,32rem);overflow:auto;overscroll-behavior:contain;background:var(--paper);border-top:1px solid var(--ink-3);padding:1rem var(--gutter) calc(1rem + env(safe-area-inset-bottom));font-family:var(--body-face);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink)}
.sheet .note{max-width:var(--measure);margin:0 auto}
.sheet-bg{position:fixed;inset:0;z-index:29;background:var(--scrim)}   /* 판 바깥 막 — 누르면 닫힘 */
/* 좁은 화면(휴대폰): 펼친 상자의 글은 본문 크기(위 .inl · .sheet), 표제 링크 · 닫기는 누름 자리 48px */
html:not([data-layout=wide]) .note a.hd{min-height:var(--hit-big)}
html:not([data-layout=wide]) .note .x{min-height:var(--hit-big);min-width:var(--hit-big)}
.dlg .def{font-weight:400}
.toast{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%);background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:var(--fs-ui);padding:.625rem 1rem;border-radius:.375rem;z-index:50;max-width:calc(100vw - 2rem);overflow-wrap:anywhere}
/* 시(頌): 한문 한 연 → 번역 한 연 */
.verse p{margin:0}
.verse-han p{font-size:var(--fs-han);line-height:var(--lh-han);letter-spacing:.08em;text-align:left}
[data-view=cmp] .verse-han p,.verse-han.peek p{font-size:calc(var(--fs-body) * 1.125)}
.verse-ko p{padding-left:1em;text-indent:-1em}
.ly-han.verse-han{text-align:left}

/* ── 꼬리 ── */
.foot{margin-top:3.5rem;padding-top:1.5rem;border-top:1px solid var(--rule);font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2)}
.foot h2{font-size:var(--fs-h3);font-weight:600;margin:2rem 0 .75rem;color:var(--ink)}
.foot>h2:first-child,.foot>nav+h2{margin-top:0}
.foot ul,.foot ol{list-style:none;padding:0}
.foot li{margin:0 0 .5rem}
.foot .ctx{color:var(--ink-3)}
.foot .row{margin:0 0 1rem}
/* 머리 영상 단추(원오심요 편) — 보기 막대 오른쪽 끝에 같은 줄로(첫 문단이 밀리지 않게), 누름 자리 44px. 펼친 영상(.yt-stage)은 막대 바로 아래 글줄 안 · 따라오지 않는다(소리는 스크롤해도 난다) */
.bar .yt{display:flex;flex-wrap:wrap;gap:.25rem .5rem;margin-left:auto}
.bar .yt .btn{margin:0;padding:0 .875rem;font-family:var(--sans);font-size:var(--fs-ui);color:var(--ink);background:var(--paper);border:1px solid var(--ink-3);border-radius:.375rem}
.bar .yt .btn:hover{background:var(--paper-2)}
.bar .yt .btn:not(:only-child){padding:0 .625rem}   /* 영상이 둘이면 '영상1' '영상2' — 막대와 한 줄에 들게 */
.yt-stage .btn{margin:0}
.yt-nojs{margin:.5rem 0 0}
.yt-nojs a.wl{display:inline-flex;align-items:center;min-height:var(--hit);margin-right:.75rem;font-family:var(--sans);font-size:var(--fs-ui)}
.yt-stage{width:min(100%,36rem);margin:-1rem 0 1.25rem}
.yt-stage[hidden]{display:none}
.yt-box{position:relative;aspect-ratio:16/9;background:var(--paper-2);border-radius:.25rem;overflow:hidden}
.yt-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.yt-cap{margin:.5rem 0 0;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);display:flex;flex-wrap:wrap;align-items:center;gap:0 .75rem}
.yt-cap span{flex:1 1 12rem}
/* 꼬리: 자리를 못 밝힌 딸린 말(머리 곁과 같은 말을 한 번 더) */
.notes-foot .note{margin:0 0 1rem}
.foot .meta.stats{margin:2rem 0 0}   /* 편 쪽 통계 줄(문단 · 교감 · 낱말 · 저본 — 머리에서 옮김, 2026-10-25) */
.foot .meta.stats+h2{margin-top:.75rem}
.meta .vgo{color:var(--zhu);text-decoration:none}.meta .vgo:hover{text-decoration:underline}
.up{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);text-decoration:none;margin-left:.4rem;white-space:nowrap}
.up:hover{color:var(--zhu)}
.prevnext{display:flex;justify-content:space-between;gap:1rem;font-family:var(--sans);font-size:var(--fs-ui);margin:0 0 1rem}
.prevnext a{text-decoration:none;min-height:var(--hit);display:inline-flex;align-items:center;max-width:48%}
.prevnext a:hover{color:var(--zhu)}
.prevnext .r{text-align:right;margin-left:auto;justify-content:flex-end}
.prevnext.small{font-size:var(--fs-label);color:var(--ink-3);margin:-1.25rem 0 1.5rem;max-width:var(--measure)}
.fnl li{display:flex;gap:.5rem}.fnl .no{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);min-width:1.5rem}
.words li{padding:.5rem 0;border-bottom:1px solid var(--rule-2);margin:0}
.words li:target{background:var(--zhu-bg)}
.words p{margin:.125rem 0 0}
.words .hd{font-weight:500;color:var(--ink)}
.words a.hd{display:inline-flex;flex-wrap:wrap;align-items:center;gap:0 .3em;min-height:var(--hit);margin:-.375rem 0 -.25rem}
/* 꼬리 '이 편의 낱말': 접힌 한 덩어리(본문 점선으로 다 열리므로 — 자바스크립트가 없으면 펼친 채) */
details.words-d{margin:2rem 0 0;border-top:1px solid var(--rule-2)}
details.words-d>summary{list-style:none;cursor:pointer;min-height:var(--hit-big);display:flex;align-items:center;gap:.5rem;font-size:var(--fs-h3);font-weight:600;color:var(--ink)}
details.words-d>summary::-webkit-details-marker{display:none}
details.words-d>summary::before{content:"";flex:none;width:.5rem;height:.5rem;border-right:1.5px solid var(--ink-2);border-bottom:1.5px solid var(--ink-2);transform:rotate(-45deg);margin:0 .25rem 0 .125rem}
details.words-d[open]>summary::before{transform:rotate(45deg)}
details.words-d>summary .n{font-weight:400;font-size:var(--fs-label);color:var(--ink-3)}
.bottom{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);border-top:1px solid var(--rule);margin-top:3rem;padding:1rem var(--gutter);display:flex;flex-wrap:wrap;gap:0 .5rem;justify-content:center}
.bottom a,.bottom button{min-height:var(--hit);display:inline-flex;align-items:center;padding:0 .5rem;text-decoration:none;font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.bottom a:hover,.bottom button:hover{text-decoration:underline}
.bottom .site-desc{flex-basis:100%;text-align:center;margin:0 0 .25rem}

/* ── 목록 · 찾기 · 칩 ── */
.list{list-style:none;padding:0;margin:0 0 1.5rem}
.list li{display:grid;grid-template-columns:1fr auto;gap:1rem;padding:.625rem 0;border-bottom:1px solid var(--rule-2);margin:0;align-items:baseline;min-height:var(--hit)}
.list li>div>a{display:inline}
.list .d{color:var(--ink-2);font-size:var(--fs-note);line-height:var(--lh-note);margin:.125rem 0 0}
.list .d b{font-weight:600;color:var(--ink)}
.list .n{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);white-space:nowrap}
.list .no{display:inline-block;min-width:2.25rem;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3)}
.list .rd{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);white-space:nowrap}
.list .rd.on::before{content:"읽음 ✓"}
.list li.hl{background:var(--zhu-bg)}
details.more{margin:0 0 1.5rem}
details.more>summary{list-style:none;display:inline-flex}
details.more>summary::-webkit-details-marker{display:none}
details.more[open]>summary{display:none}
.search{display:flex;gap:.5rem;margin:0 0 1.5rem}
.search input{flex:1;min-width:0;font:inherit;font-family:var(--sans);font-size:max(1.0625rem,16px);min-height:var(--hit-big);padding:0 .875rem;border:1px solid var(--rule);border-radius:.375rem;background:var(--paper);color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:.375rem;margin:0 0 1.5rem}
.chips a,.chips button{font-family:var(--sans);font-size:var(--fs-label);min-height:var(--hit);display:inline-flex;align-items:center;padding:0 .75rem;border:1px solid var(--ink-3);border-radius:1.5rem;text-decoration:none;background:none;color:var(--ink-2);cursor:pointer;gap:.35rem}
.chips a:hover,.chips button:hover{border-color:var(--ink)}
.chips [aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chips button:disabled{opacity:.5;cursor:default}
.filters .lab{display:block;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 .25rem}
.filters .chips{margin-bottom:1rem}
mark{background:var(--mark);color:inherit;font-weight:600}
/* 책 대문(역주 코너 첫 쪽 — 속표지 · 차례 · 앞머리/개념/법맥 한 줄씩) */
.cover .lead p{margin:0 0 .75rem}
.cover .meta{margin:0 0 1.5rem}
.start{display:grid;gap:.625rem;margin:0 0 1rem}
.start p{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .875rem;font-family:var(--sans);font-size:var(--fs-label)}
.start .btn{min-width:9.5rem;justify-content:center}
.toc li:not(.part)>div>a{font-weight:500}
.toc li.vol{padding-left:1.75rem}   /* 책 아래 권 줄(백운) — 한자 쪽 .part와 겹치지 않는 이름 */
.list.toc li,.list.doors-list li{grid-template-columns:1fr auto}   /* 좁은 화면에서도 편 수는 오른쪽(책 차례처럼) */
.cv-line{font-family:var(--sans);font-size:var(--fs-ui);color:var(--ink-2);margin:0 0 .25rem;line-height:1.6;display:grid;grid-template-columns:5.25rem 1fr;align-items:baseline}   /* 이름표 칸: 가장 긴 '인물·용어'에도 띄움 */
.cv-line .lab{font-size:var(--fs-label);color:var(--ink-3)}
.cv-line a{display:inline-block;padding:.6rem 0}
.cover h1{margin-bottom:1rem}
.doors-list .d{font-size:var(--fs-note)}
.doors-list li{position:relative}
.doors-list li>div>a::after{content:"";position:absolute;inset:0}   /* 줄 전체가 그 코너로(2026-10-25) */
.doors-list li:hover{background:var(--paper-2)}
.doors-list li:hover>div>a{color:var(--zhu)}
.doors-list li:has(>div>a:focus-visible){outline:3px solid var(--zhu);outline-offset:2px;border-radius:2px}
.doors-list li>div>a:focus-visible{outline:none}
/* 대문 '오늘의 글자'(2026-10-29): 칸 전체가 그 글자 쪽 링크. 이름표는 장치 글자(--ink-2) */
.tagline{margin:0 0 1.25rem;font-family:var(--sans);font-size:var(--fs-label);line-height:1.5;color:var(--ink-2)}
.today{display:block;max-width:var(--measure);margin:0 0 1.75rem;padding:.75rem 1rem;border:1px solid var(--rule);border-radius:.375rem;text-decoration:none;color:var(--ink)}
.today:hover{background:var(--paper-2);border-color:var(--ink-3)}
.today .lab{display:block;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 .25rem}
.today .rw{display:flex;align-items:center;gap:1.25rem}
.today .seal{flex:none;width:5rem;height:5rem;margin:0;vertical-align:top}
.today .tx{min-width:0;display:block}
.today .hd{display:block;font-family:var(--serif);font-size:var(--fs-h2);line-height:1.4}
.today .c{font-size:1.25em;margin-right:.25em}
.today .t{text-decoration:underline;text-decoration-color:var(--zhu);text-decoration-thickness:1.5px;text-underline-offset:.22em}
.today:hover .t{color:var(--zhu)}
.today .w{display:block;font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2)}
.today .w[hidden]{display:none}
.cfind{margin:0 0 1rem}
.cfind label{display:block;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 .375rem}
.cfind input{font-family:var(--sans);font-size:max(1.0625rem,16px);width:100%;max-width:24rem;min-height:var(--hit-big);padding:0 .75rem;border:1px solid var(--ink-3);border-radius:.375rem;background:var(--paper);color:var(--ink)}
.cfind p{font-family:var(--sans);font-size:var(--fs-label);min-height:1.4em;margin:.375rem 0 0}
.chips.ga{gap:.25rem}
.chips.ga button{min-width:var(--hit);justify-content:center;padding:0 .5rem}
.list.cl li{grid-template-columns:1fr auto;padding:.375rem 0}
html.js .list.cl:not(.open):not(.q) li.x{display:none}
.cl-more{margin:-.75rem 0 1.5rem}
.jump{align-items:center}
.jump label{font-family:var(--sans);font-size:var(--fs-ui)}
.jump input{width:5.5rem}
.jump select,.jump input{font:inherit;font-family:var(--sans);font-size:max(1.0625rem,16px);min-height:var(--hit);padding:0 .5rem;border:1px solid var(--rule);border-radius:.375rem;background:var(--paper);color:var(--ink)}

/* ── 자전 ── */
.seal{display:inline-block;background:currentColor;-webkit-mask:var(--g) center/contain no-repeat;mask:var(--g) center/contain no-repeat;width:1.25em;height:1.25em;vertical-align:-.28em;margin:0 .05em}
.seal.big{width:2.5em;height:2.5em;vertical-align:middle;margin:0 .2em}
.seal.hj-in{width:1.12em;height:1.12em;vertical-align:-.2em}
.seal-missing{text-decoration:underline wavy var(--zhu);text-underline-offset:.28em}
/* 그림 글자: .hj-kai = 해서 그림(견본 칸, 견본 글꼴에 없을 때) · .hj-ming = 명조 그림(글 속 — 자체 명조에 없는 확장 B 등). 굵은 줄 안에서는 마스크를 좌우로 겹쳐 흉내 굵기 */
.hj-kai,.hj-ming{display:inline-block;width:1.08em;height:1.08em;vertical-align:-.16em;background:currentColor;-webkit-mask:var(--g) center/contain no-repeat;mask:var(--g) center/contain no-repeat}
:is(h1,h2,h3,b,strong,dt) :is(.hj-kai,.hj-ming){-webkit-mask:var(--g) center/contain no-repeat,var(--g) calc(50% + .022em) 50%/contain no-repeat,var(--g) calc(50% - .022em) 50%/contain no-repeat;mask:var(--g) center/contain no-repeat,var(--g) calc(50% + .022em) 50%/contain no-repeat,var(--g) calc(50% - .022em) 50%/contain no-repeat}
.hj-ext{font-family:var(--han-ext)}
/* 해서 견본(글자 쪽 큰 해서 · 짜임 칸 · 차례 카드 · '들어간 글자' 칸) = 서체 견본: 본문 글꼴 설정(명조/고딕)과 상관없이 --kai(全字庫正楷體), 400 하나뿐 */
.zi-head .kai,.part .k,.zi-grid .c,.chipline .c,.pair .pk{font-family:var(--kai);font-weight:400;font-synthesis:none}
.zi-head{--pz:6.5rem;display:flex;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin:0 0 .75rem}
/* 소전+해서 짝(공용 — 한자 쪽 머리 .zi-head · 놀이의 배움 카드 · 문제 · 부품 칸 .pair): 둘을 같은 정사각 칸(--pz)에, 같은 글자 높이(2026-10-21 · 2026-10-23 사용자 지적).
   해서 em = 칸, line-height:1. 全字庫正楷體는 먹이 em 아래쪽에 앉으므로 .18em 올려 먹 중심을 칸 중심에(그림 대체 .hj-kai는 되돌림). 소전 그림은 먹이 칸의 약 87% → 위아래 끝이 1–2px 안에서 맞는다. */
.pair{--pz:3.5rem;display:inline-flex;align-items:flex-start;gap:calc(var(--pz) * .16);vertical-align:middle}
.pair.sm{--pz:2.25rem}.pair.md{--pz:3.5rem}.pair.lg{--pz:5.5rem}.pair.xl{--pz:7.5rem}
.zi-head .seal,.pair .seal{flex:none;width:var(--pz);height:var(--pz);margin:0;vertical-align:top}
.zi-head .kai,.pair .pk{display:block;flex:none;width:var(--pz);height:var(--pz);font-size:var(--pz);line-height:1;text-align:center;position:relative;top:-.18em}
.zi-head .kai .hj-kai,.pair .pk .hj-kai{display:block;width:1em;height:1em;position:relative;top:.18em}
.pair .pk.pk-body{font-family:var(--serif)}
.zi-head .hun{font-family:var(--serif);font-size:var(--fs-h3);color:var(--ink);padding-bottom:.4rem}
.zi-head .noseal{display:inline-flex;align-items:center;justify-content:center;width:6.5rem;height:6.5rem;border:1px dashed var(--rule);border-radius:.375rem;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3)}
.callout{margin:0 0 1.5rem;padding:.25rem 0 .25rem 1rem;border-left:2px solid var(--zhu)}
.callout .nlab{margin-bottom:.25rem}
.callout p:last-child,.callout .pts:last-child{margin:0}
/* 해설의 학자 항목(swx '* ' 줄)과 끝의 '지금 뜻' 줄(now) — 2026-10-31 해설 고치기 */
.pts{margin:0 0 1.25rem}.pts li{margin:0 0 .625rem}.pts li::marker{color:var(--ink-3)}
.now{margin:1.25rem 0 1.5rem;padding-top:.875rem;border-top:1px solid var(--rule-2)}
.now .nlab{margin-bottom:.25rem}
.now p{margin:0}
/* 짜임 칸(2026-10-23 사용자: 한 줄로, 해서는 작게, 훈음은 아래로): 칸 = 세로 — 큰 소전 / 작은 해서(견본 글꼴) / 훈음.
   칸·기호가 늘 한 줄(줄바꿈 없음 — 좁으면 칸이 줄어듦; 한 줄 최대 4칸 = 글자 + 부품 3). 이 칸은 .pair 짝 규칙을 쓰지 않는다. */
.parts{display:flex;flex-wrap:nowrap;align-items:stretch;gap:.5rem;margin:0 0 1.5rem}
.parts>.op{align-self:center;flex:none}
.part{display:flex;flex-direction:column;align-items:center;gap:.25rem;flex:0 1 7.5rem;min-width:0;text-align:center;text-decoration:none;border:1px solid var(--rule);border-radius:.375rem;padding:.625rem .375rem .5rem;min-height:var(--hit)}
a.part:hover{border-color:var(--zhu)}
.part .seal{width:clamp(2.25rem,11vw,4rem);height:clamp(2.25rem,11vw,4rem);margin:0}
.part .k{font-size:clamp(1.25rem,5vw,1.75rem);line-height:1.2}
.part .h{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3)}
.part[aria-current]{border-color:var(--ink-3)}
.op{font-family:var(--sans);color:var(--ink-3);font-size:1.25rem}
.parts.sub-row{margin-top:-.75rem;padding-left:1.5rem}
.alt-lab{font-family:var(--sans);font-size:var(--fs-label);line-height:1.5;color:var(--ink-2);margin:0 0 .375rem;overflow-wrap:anywhere}   /* 짜임의 다른 꼴 줄 이름표(《설문해자》에는 雲으로 실림 등) — 부품 쪼갬이 아님을 밝힘 */
.xiang{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3)}
.gl{margin:0 0 1rem}.gl dt{font-weight:600;margin:0 0 .25rem}.gl dd{margin:0 0 1rem}
.zi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(6.5rem,1fr));gap:.5rem;list-style:none;padding:0;margin:0 0 1.5rem}
.zi-grid li{margin:0}
.zi-grid li[hidden],.zi-mini li[hidden],.zi-grid[hidden],details.zgrp[hidden]{display:none}
/* 한자 어원 대문: 글자 찾기 · 씨앗 글자(급수별로 접음 — 글자 + 훈음 한 줄 칸) */
.zfind{margin:0 0 1.75rem}
.zfind label{display:block;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 .375rem}
.zfind input{font-family:var(--sans);font-size:max(1.0625rem,16px);width:100%;max-width:24rem;min-height:var(--hit-big);padding:0 .75rem;border:1px solid var(--ink-3);border-radius:.375rem;background:var(--paper);color:var(--ink);box-sizing:border-box}
.zfind p{font-family:var(--sans);font-size:var(--fs-label);min-height:1.4em;margin:.375rem 0 0}
.body.zon>:not(#zfind){display:none}   /* 찾는 동안 손글·묶음 감춤 — 결과가 칸 바로 아래 */
.zres{margin:.375rem 0 0}.zres:empty{display:none}.zres .no,.zres .seal{display:none}
.zfind p.zmore{margin:.5rem 0 0}
.zfind p.zall{margin:.5rem 0 0}.zfind p.zall[hidden]{display:none}.zfind .zall a{display:inline-flex;align-items:center;min-height:var(--hit);color:var(--ink)}
@media (max-width:760px){.zfind .zall a{min-height:3rem}}
/* 한자 여럿을 한꺼번에 찾을 때: 글자마다 한 줄(쪽이 있으면 칸 그대로, 없으면 '없음') */
.zi-mini.zmulti{grid-template-columns:minmax(0,26rem)}
.zmulti li{margin:0}
.zmulti li.zno{display:flex;align-items:center;gap:.5rem;min-height:var(--hit);padding:0 .5rem;border:1px solid var(--rule-2);border-radius:.375rem;color:var(--ink)}
.zmulti li.zno .c{font-family:var(--kai);font-weight:400;font-synthesis:none;font-size:1.5rem;line-height:1}
.zmulti li.zno .t{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);line-height:1.3}
/* 글자 쪽: 이 글자가 들어간 낱말 — 넓은 화면 한 줄(뜻은 넘치면 줄임), 좁은 화면은 뜻을 둘째 줄에 다. 뜻 이름표는 .wmean(.wm은 로고 마스크) */
.wlist{list-style:none;padding:0;margin:0 0 .5rem}
.wlist li{display:flex;align-items:baseline;gap:.625rem;margin:0;padding:.375rem 0;border-bottom:1px solid var(--rule-2);min-width:0}
.wlist .ww{flex:none;font-size:1.125em}
.wlist .ww b{font-weight:600;color:var(--zhu)}
.wlist .wk{flex:none;color:var(--ink-2)}
.wlist .wmean{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:var(--fs-note);color:var(--ink-2)}
@media (max-width:760px){.wlist li{flex-wrap:wrap;row-gap:0}.wlist .wmean{flex-basis:100%;white-space:normal}}
details.wmore{margin:.25rem 0 0}
.wsrc{font-family:var(--sans);font-size:.8125rem;color:var(--ink-3);margin:.5rem 0 1.5rem}
.zi-mini{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.375rem;list-style:none;padding:0;margin:.25rem 0 1rem}
.zi-mini a{display:flex;align-items:center;gap:.5rem;min-height:var(--hit);padding:0 .5rem;border:1px solid var(--rule-2);border-radius:.375rem;text-decoration:none;color:var(--ink)}
.zi-mini a:hover{border-color:var(--ink-3);background:var(--paper-2)}
.zi-mini .c{font-family:var(--kai);font-weight:400;font-synthesis:none;font-size:1.5rem;line-height:1}
.zi-mini .t{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);line-height:1.3}
.zi-grid a{display:flex;flex-direction:column;align-items:center;gap:.125rem;padding:.625rem .25rem .5rem;border:1px solid var(--rule-2);border-radius:.375rem;text-decoration:none;position:relative;min-height:100%}
.zi-grid a:hover{border-color:var(--zhu)}
.zi-grid .seal{width:3.25rem;height:3.25rem;margin:0}
.zi-grid .c{font-size:1.5rem;line-height:1.2}
.zi-grid .t{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3);text-align:center;line-height:1.35}
.zi-grid .no{position:absolute;left:.375rem;top:.25rem;font-family:var(--sans);font-size:.75rem;color:var(--ink-3)}
.chipline{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.5rem}
.chipline a{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--rule);border-radius:.375rem;padding:.25rem .625rem;text-decoration:none;min-height:var(--hit)}
.chipline a:hover{border-color:var(--zhu)}
.chipline .seal{width:1.75rem;height:1.75rem;margin:0}
.chipline .c{font-size:1.25rem}
.chipline .t{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-3)}

/* ── 글자 크기와 화면 판(덮개는 이것 하나) ── */
dialog.dlg{border:1px solid var(--rule);border-radius:.5rem;padding:1.25rem 1.5rem;max-width:28rem;width:calc(100% - 2rem);background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:var(--fs-ui);max-height:calc(100vh - 4rem);overflow:auto;margin-top:4rem}
dialog.dlg::backdrop{background:var(--scrim)}
.dlg h2{margin:0 0 1rem;font-size:var(--fs-h3);font-weight:600;display:flex;justify-content:space-between;align-items:center;font-family:var(--sans)}
.dlg .lab{display:block;font-size:var(--fs-label);color:var(--ink-2);margin:1rem 0 .375rem}
.dlg .row{margin:0}
.dlg .sz1{font-size:1rem}.dlg .sz2{font-size:1.125rem}.dlg .sz3{font-size:1.25rem}.dlg .sz4{font-size:1.4rem}
.dlg .sample{font-family:var(--body-face);font-size:var(--fs-body);line-height:var(--lh-body);margin:.75rem 0 .25rem;padding:.75rem;border:1px dashed var(--rule);border-radius:.25rem}

/* ── 넓은 화면(화면 ≥ 1100px 이고 화면 ÷ rem ≥ 65 — 문단 번호 자리 3rem까지): 곁주를 오른쪽 여백 칸에(문단 곁은 글 흐름 밖에 띄움 — 본문을 덮지도 밀지도 않는다) ── */
html[data-layout=wide] .body>.para,html[data-layout=wide] .head{max-width:none;display:grid;grid-template-columns:minmax(0,var(--measure)) var(--aside);column-gap:var(--gap);align-items:start}
html[data-layout=wide] .page,html[data-layout=wide] .top .in{max-width:calc(var(--measure) + var(--gap) + var(--aside) + 3rem + 2 * var(--gutter));padding-left:calc(var(--gutter) + 3rem)}   /* 왼쪽 여백에 문단 번호 자리 */
html[data-layout=wide] [data-view=easy] .body>.only-cmp,html[data-layout=wide] [data-view=cmp] .body>.only-easy{display:none}   /* 위 grid가 보기별 숨김을 덮지 않게(한문 전체 덩어리 · 문단 수 다른 편) */
html[data-layout=wide] .head>*{grid-column:1}
html[data-layout=wide] .head>details.notes{grid-column:2;grid-row:1/span 12;align-self:start;margin:0}
html[data-layout=wide] article[data-view] .head{position:relative}
html[data-layout=wide] article[data-view] .head>details.notes{position:absolute;top:0;left:0;right:0;z-index:2}   /* 역주 편 머리 곁(이 편의 풀이)도 흐름 밖 — 펼쳐도 본문이 내려가지 않는다(page.js headDet) */
html[data-layout=wide] .para>.txt{grid-column:1}
html[data-layout=wide] .para>details.notes{grid-column:2;margin:0;border-top:0;padding-bottom:0;position:absolute;top:0;left:0;right:0;z-index:2}   /* 펼친 곁은 글 흐름 밖(오른쪽 여백 칸) — 글이 움직이지 않는다. 세로 자리는 page.js align()이 top으로 */
html[data-layout=wide] .pnum{position:absolute;right:100%;top:.45em;margin:0 .75rem 0 0}
/* 문단 번호를 첫 줄에 맞춤(넓은 화면 쉽게 읽기: 번호 줄 높이 = 본문 한 줄) · 좁은 화면 쉽게 읽기는 번호가 줄을 차지하지 않게 첫 줄 왼쪽에 띄움(깊이 읽기는 그대로) */
html[data-layout=wide] [data-view=easy] .pnum{top:0;min-height:0;line-height:calc(var(--fs-body) * var(--lh-body))}
html[data-layout=narrow] [data-view=easy] .para>.txt>.pnum{float:left;margin:.3em .5em 0 0;min-height:0}
html[data-layout=wide] .head>details.notes:not(.many):not(.tall)>summary,html[data-layout=wide] .para>details.notes>summary{display:none}

@media (max-width:760px){
  .page{padding-top:1.25rem}
  .zi-head{--pz:5rem}.zi-head .noseal{width:5rem;height:5rem}
  .meta{margin-bottom:1.75rem}
  table{font-size:var(--fs-note)}
  .bar .lab{display:none}
  .bar{padding:0;margin-bottom:1.25rem}
  .list li{grid-template-columns:1fr;gap:.125rem}
}
@media print{
  .top,.top-sp,.bar,.bottom,.band,dialog,.toast,.vnote,.sheet,.js-only,.yt,.yt-stage,.yt-nojs{display:none!important}
  .page{max-width:none}
  details.notes{display:block;position:static!important}details.notes summary{display:none}
  .seal,.hj-kai,.hj-ming{background:var(--print-ink)}
}

/* ── 놀이(코너 — build/game.js · assets/game.js, 2판 2026-10-23): 지금 레벨 한 줄 · 오늘 볼 것 · 배움 카드 · 문제(보기 셋, 세로 한 줄) · 판 끝 · 코스 · 내 기록.
   60–70대 기본값: 보기 누름 자리 4rem(64px) 넘게 · 문제 소전 9rem · 맞음/틀림은 색만으로 보이지 않는다('✓ 정답' · '고른 답' + 테두리 꼴). 새 색 없음(토큰만). 소전+해서 짝은 위 .pair. ── */
html.js .nojs-only{display:none!important}
.gstat{font-family:var(--sans);font-size:var(--fs-ui);color:var(--ink-2);display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem;margin:0 0 1.25rem;min-height:1.6em}
.gstat .glv{font-weight:500;color:var(--ink)}
.gtoday{margin:0 0 1.5rem}
.gtodayl{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;margin:0}
.gstart{min-height:3.5rem;padding:0 1.25rem;font-size:var(--fs-body)}
.game{margin:1rem 0 2rem}
.gprog{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);display:flex;flex-wrap:wrap;gap:.25rem 1rem;margin:0 0 .5rem}
.gprompt{font-size:var(--fs-h3);font-weight:500;line-height:1.5;margin:0 0 1rem}
.gstim{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.75rem;padding:1.25rem .75rem;border:1px solid var(--rule);border-radius:.5rem;background:var(--paper-2);margin:0 0 1rem;min-height:9.5rem}
.gstim .seal.gbig{width:9rem;height:9rem;margin:0}
.gstim-q{justify-content:center;flex-direction:column;align-items:flex-start;min-height:0}
.gbigt{margin:0;font-size:var(--fs-h1);font-weight:500}
.gquote{margin:0;max-width:34rem;font-size:var(--fs-body);line-height:var(--lh-body)}
.gphr{margin:0;font-size:2.5rem;letter-spacing:.12em;line-height:1.4}
.gsrc{margin:0;font-size:var(--fs-label)}
.ghole-in{display:inline-block;min-width:1.2em;text-align:center;border-bottom:2px solid var(--ink-2);line-height:1.2;color:var(--ink-2)}
.gpart{display:inline-flex;flex-direction:column;align-items:center;gap:.25rem;flex:0 1 7.5rem;min-width:0;text-align:center}   /* 부품 칸 = 한자 쪽 .part 꼴: 큰 소전 · 작은 해서 · 아래 한글 */
.gpart .seal.gps{width:clamp(2.25rem,10vw,3.25rem);height:clamp(2.25rem,10vw,3.25rem);margin:0}
.gpk{font-family:var(--kai);font-weight:400;font-synthesis:none;font-size:1.375rem;line-height:1.2}
.gpk.pk-body{font-family:var(--serif)}
.gpart .gt{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);text-align:center;line-height:1.35}
.gop{font-family:var(--sans);font-size:1.5rem;color:var(--ink-2)}
.ghole{display:inline-flex;flex:none;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;border:2px dashed var(--ink-3);border-radius:.375rem;font-family:var(--sans);font-size:1.25rem;color:var(--ink-2)}
.gparts{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:.5rem;margin:0 0 1rem;max-width:100%}
.gparts>.gop{flex:none}
.gopts{display:grid;grid-template-columns:minmax(0,1fr);gap:.75rem;margin:0 0 1rem}
.gopts.six{grid-template-columns:repeat(2,minmax(0,1fr))}
.gopt{position:relative;display:flex;align-items:center;gap:1rem;min-height:4.5rem;padding:.5rem 1rem .5rem 2.5rem;border:1px solid var(--ink-3);border-radius:.5rem;background:var(--paper);color:var(--ink);font:inherit;cursor:pointer;text-align:left;touch-action:manipulation}
.gopt:hover:not(:disabled){border-color:var(--ink);background:var(--paper-2)}
.gopt:disabled{cursor:default;color:var(--ink)}
.gopt .gno{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);font-family:var(--sans);font-size:var(--fs-num);color:var(--ink-3)}
.gopt .gh{font-family:var(--serif);font-size:2.5rem;line-height:1.2}
.gopt .gtt{font-family:var(--serif);font-size:var(--fs-h3);line-height:1.45}
.gopt .seal.gopt-seal{width:4.5rem;height:4.5rem;margin:0}
.gopt .grev{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);line-height:1.35}
.gopt .grev .gh{font-size:1.5rem}
.gopt .gmark{margin-left:auto;font-family:var(--sans);font-size:var(--fs-label);font-weight:500;color:var(--ink);white-space:nowrap}
.gopt .gmark:empty{display:none}
.gopt.sel{border:3px solid var(--ink-2);padding:calc(.5rem - 2px) calc(1rem - 2px) calc(.5rem - 2px) calc(2.5rem - 2px)}
.gopt.ok{border:3px solid var(--zhu);background:var(--zhu-bg);padding:calc(.5rem - 2px) calc(1rem - 2px) calc(.5rem - 2px) calc(2.5rem - 2px)}
.gopt.no{border:2px dashed var(--ink-2);padding:calc(.5rem - 1px) calc(1rem - 1px) calc(.5rem - 1px) calc(2.5rem - 1px)}
.gopt.off{border-color:var(--rule)}
.gopt.off .gh,.gopt.off .gtt,.gopt.off .pk,.gopt.off .seal{color:var(--ink-3)}
.gopts.six .gopt{flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.75rem .5rem;text-align:center}
.gopts.six .gopt.sel,.gopts.six .gopt.ok{padding:calc(.75rem - 2px) calc(.5rem - 2px)}
.gopts.six .gopt .gno{top:.6rem;transform:none}
.gopts.six .gopt .gmark{margin:0}
.grow{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1rem}
.gdk{color:var(--ink-2)}
.gfeed{font-family:var(--sans);font-size:var(--fs-ui);min-height:1.6em;margin:0 0 .75rem}
.gcard{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.75rem 1.25rem;align-items:start;border:1px solid var(--rule);border-left:3px solid var(--zhu);border-radius:.375rem;padding:1rem;margin:0 0 1rem}
.gcard p{margin:0 0 .375rem;font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2)}
.gcard .gct{font-size:var(--fs-body);color:var(--ink)}
.gcard .gct2{color:var(--ink)}
.glearn .gstim{padding:1.5rem .75rem}
.gsk{font-size:var(--fs-body);line-height:var(--lh-body);margin:0 0 .5rem}
.gsw{font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2);margin:0 0 .75rem}
.gnext .btn,.gagain .btn{min-width:10rem;justify-content:center}
.gend .gscore{font-size:var(--fs-h2);margin:0 0 1rem}.gend .gscore b{font-weight:600}
.gend h3{font-size:var(--fs-h3);font-weight:600;margin:1.5rem 0 .5rem}
.gmiss{list-style:none;padding:0;margin:0 0 1.25rem;display:grid;gap:.5rem}
.gmiss li{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;border-bottom:1px solid var(--rule-2);padding:0 0 .5rem}
.gsum{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.375rem 1.25rem;margin:0 0 1.25rem;font-size:var(--fs-note);line-height:var(--lh-note)}
.gsum dt{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2)}
.gsum dd{margin:0}
.gdots{display:inline-flex;flex-wrap:wrap;gap:3px;vertical-align:middle;max-width:16rem;margin-left:.5rem}
.gdots i{display:block;width:.5rem;height:.5rem;border-radius:50%;background:var(--rule)}
.gdots i.on{background:var(--zhu)}
.glevels tr.on td{background:var(--zhu-bg);font-weight:600}
.gfs{border:0;padding:0;margin:0 0 1rem;min-width:0}
.gfs legend{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);padding:0;margin:0 0 .375rem}
.gradio{display:flex;flex-wrap:wrap;gap:.5rem}
.gradio label{display:inline-flex;align-items:center;gap:.4rem;min-height:var(--hit);padding:0 .875rem;border:1px solid var(--rule);border-radius:.375rem;font-family:var(--sans);font-size:var(--fs-ui);cursor:pointer;color:var(--ink)}
.gradio label:has(input:checked){border-color:var(--ink-2);background:var(--paper-2);font-weight:500}
.gradio input,.gchk input{accent-color:var(--zhu);width:1.25rem;height:1.25rem;margin:0}
.gcourse li{display:block}
.gchk{display:flex;align-items:flex-start;gap:.75rem;padding:.5rem 0;min-height:var(--hit);cursor:pointer}
.gchk input{flex:none;margin-top:.35rem}
.gchk .d,.gchk .gcp{display:block;font-size:var(--fs-note);color:var(--ink-2)}
.gchk .gcp{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2)}
.gto{display:flex;align-items:center;gap:.5rem;margin:0 0 .5rem 2rem;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2)}
.gto select{font:inherit;font-size:max(1.0625rem,16px);min-height:var(--hit);padding:0 .5rem;border:1px solid var(--rule);border-radius:.375rem;background:var(--paper);color:var(--ink)}
.grec .row{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 .75rem}
.grec label[for]{display:block;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);margin:0 0 .25rem}
.grec textarea{width:100%;font-family:var(--mono);font-size:max(1rem,16px);line-height:1.4;padding:.5rem;border:1px solid var(--ink-3);border-radius:.375rem;background:var(--paper);color:var(--ink);margin:0 0 .5rem;word-break:break-all}
.gtime input{font-family:var(--sans);font-size:max(1.0625rem,16px);min-height:var(--hit);padding:0 .5rem;border:1px solid var(--ink-3);border-radius:.375rem;background:var(--paper);color:var(--ink)}
.gfile:focus-within{outline:2px solid var(--zhu);outline-offset:2px}
.gpane{margin:0 0 1rem}
.gmsg{font-family:var(--sans);font-size:var(--fs-ui);min-height:1.5em}
.linkish{border:0;background:none;padding:0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:.2em;cursor:pointer;min-height:var(--hit)}
.glic{white-space:pre-wrap;font-family:var(--mono);font-size:.8125rem;line-height:1.5;max-height:24rem;overflow:auto;border:1px solid var(--rule);padding:.75rem;background:var(--paper-2)}
.gcredit{margin-top:1.5rem}
.play-line{margin-top:1.5rem}
/* 놀이 3판(design/game/v3.md): 갈래 고르기 · 진행 막대 · 연속 맞힘 · 끝 도장 · 글자 조립 · 낱말 만들기 · 짝 맞추기 · 60초 도전 · 어린이 꼴(html.gkid). 색은 토큰만, 맞고 틀림은 테두리 꼴 + 글자 */
.gplace{margin:-.25rem 0 1.25rem}
.gbar{display:block;flex:1 1 100%;height:.375rem;margin:.25rem 0 0;border-radius:99px;background:var(--rule-2);overflow:hidden}
.gbar i{display:block;height:100%;background:var(--zhu);border-radius:99px}
.gstreak{font-weight:500;color:var(--ink);border:1px solid var(--zhu);border-radius:99px;padding:0 .5em}
.gsub{font-family:var(--sans);font-size:var(--fs-label);font-weight:400;color:var(--ink-2)}
.gstamp{display:flex;align-items:center;gap:1rem;margin:0 0 1rem}
.gstamp-in{display:inline-flex;flex:none;align-items:center;justify-content:center;width:4.5rem;height:4.5rem;border:3px solid var(--zhu);border-radius:.5rem;color:var(--zhu);transform:rotate(-6deg);font-family:var(--kai);font-size:2.75rem;line-height:1}
.gstamp:not(.top) .gstamp-in{border-width:2px;color:var(--ink-2);border-color:var(--ink-3)}
.gstamp-in .seal{width:3.5rem;height:3.5rem;margin:0}
.gstamp-t{font-size:var(--fs-h3);font-weight:500}
@media (prefers-reduced-motion:no-preference){.gstamp-in{animation:gstamp .32s cubic-bezier(.2,.9,.3,1.2) both}.gbar i{transition:width .3s ease-out}}
@keyframes gstamp{from{opacity:0;transform:rotate(-6deg) scale(1.5)}to{opacity:1;transform:rotate(-6deg) scale(1)}}
.gstim .seal.gmid{width:5.5rem;height:5.5rem;margin:0}
.gbstim{min-height:0;gap:1.25rem}
/* 칸(조립 · 낱말): 빈칸은 점선, 찬 칸은 실선, 다 맞으면 --zhu 굵은 테두리 */
.gslots{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.75rem;margin:0 0 1rem}
.gslots.tb{flex-direction:column}
.gslot{display:inline-flex;align-items:center;justify-content:center;min-width:5.5rem;min-height:5.5rem;padding:.375rem;border:2px dashed var(--ink-3);border-radius:.5rem;background:var(--paper);color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation}
.gslot.on{border:2px solid var(--ink-2)}
.gslot.ok{border:3px solid var(--zhu);background:var(--zhu-bg)}
.gslot:disabled{cursor:default;color:var(--ink)}
.gslot .ghole{border:0;width:auto;height:auto;font-size:var(--fs-h3)}
.gslot .gh,.gwslot .gh{font-family:var(--serif);font-size:2.75rem;line-height:1.15}
.gopts.gtray{grid-template-columns:repeat(auto-fill,minmax(7rem,1fr))}
.gtile{flex-direction:column;justify-content:center;gap:.25rem;padding:1.5rem .5rem .75rem;text-align:center;min-height:5.5rem}
.gtile .gno{top:.6rem;transform:none}
.gtile.used{border-style:dashed;color:var(--ink-3)}
.gtile.used .seal,.gtile.used .gh{color:var(--ink-3)}
.gtile .gmark{margin:0}
.gtile.ok,.gtile.off{padding:1.5rem .5rem .75rem}
.gtile.ok{padding:calc(1.5rem - 2px) calc(.5rem - 2px) calc(.75rem - 2px)}
.gtt2{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);line-height:1.3}
.gstim-w{flex-direction:column;gap:.375rem;min-height:0}
.gword{margin:0;font-size:var(--fs-h1);font-weight:500;line-height:1.2;letter-spacing:.06em}
.gwm{margin:0;max-width:30rem;font-size:var(--fs-note);line-height:var(--lh-note);color:var(--ink-2);text-align:center}
.gwords li{gap:.25rem .75rem}
/* 짝 맞추기: 엎은 카드(빗금) · 뒤집은 카드 · 짝 찾음(--zhu 굵은 테두리 + ✓) · 짝 아님(점선) */
.gboard{display:grid;gap:.5rem;margin:0 0 1rem}
.gboard.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.gboard.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (min-width:36rem){.gboard.c3{grid-template-columns:repeat(4,minmax(0,1fr))}}
.gpc{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.125rem;aspect-ratio:1;min-height:4.5rem;padding:.25rem;border:1px solid var(--ink-3);border-radius:.5rem;background:var(--paper-2);color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation;overflow:hidden}
.gpc:hover{border-color:var(--ink)}
.gpc-back{display:block;width:70%;height:70%;border-radius:.25rem;background:repeating-linear-gradient(45deg,var(--rule) 0 2px,transparent 2px 9px)}
.gpc.up{background:var(--paper)}
.gpc.ok{border:3px solid var(--zhu);background:var(--zhu-bg);cursor:default}
.gpc.no{border:2px dashed var(--ink-2)}
.gpc .seal.gpc-seal{width:62%;height:62%;margin:0}
.gpc-k{font-family:var(--kai);font-weight:400;font-synthesis:none;font-size:clamp(2rem,9vw,3.25rem);line-height:1}
.gpc-t{font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2);line-height:1.2}
.gpc-h{font-family:var(--serif);font-size:clamp(1rem,4.4vw,1.375rem);line-height:1.3;text-align:center;word-break:keep-all}
.gpc-m{position:absolute;top:.2rem;right:.35rem;font-family:var(--sans);font-size:var(--fs-label);font-weight:600}
.gopts-row{display:flex;flex-wrap:wrap;gap:0 1.5rem;margin:1.5rem 0 0}
/* 60초 도전 */
.gbest{font-size:var(--fs-body);margin:0 0 1rem}
.gtime{height:.5rem;margin:0 0 1rem}
.gdash .gstim{min-height:8.5rem}
/* 어린이 꼴: 큰 그림 · 큰 보기 */
html.gkid .gstim .seal.gbig{width:11rem;height:11rem}
html.gkid .gstim .pair.xl{--pz:9rem}
html.gkid .gopt{min-height:5.5rem}
html.gkid .gopt .gh{font-size:3rem}
html.gkid .gopt .gtt{font-size:var(--fs-h2)}
html.gkid .gslot{min-width:6.5rem;min-height:6.5rem}
@media (max-width:30rem){html.gkid .gstim .seal.gbig{width:9.5rem;height:9.5rem}html.gkid .gstim .pair.xl{--pz:7.5rem}.gslot{min-width:4.75rem;min-height:4.75rem}.gslot .gh{font-size:2.25rem}.gopts.gtray{grid-template-columns:repeat(2,minmax(0,1fr))}.gword{font-size:var(--fs-h2)}}
@media (prefers-reduced-motion:no-preference){.gcard,.gend{animation:gin .18s ease-out}}
@keyframes gin{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
/* 모임 — 법회 큰 화면 모둠 놀이(숨은 쪽 <놀이>/모임/ — design/game/moim.md). 크기는 단위 --u 하나: 쪽 안에서는 1rem, 전체 화면(TV · 프로젝터)에서는 화면 높이에 맞춰.
   전체 화면은 [모둠 점수 / 물음 / 문제 | 보기 넷 / 단추] 한 장. 맞힌 모둠 · 정답은 테두리 꼴 + 글자('+1' · '✓ 정답')로, 색만으로 보이지 않게. */
.moim{--u:1rem;margin:1rem 0 2rem}
.moim:fullscreen{--u:min(2.5vh,1.4vw);background:var(--paper);color:var(--ink);overflow:auto;padding:calc(var(--u)*1.5) calc(var(--u)*2.5);box-sizing:border-box}
.moim:-webkit-full-screen{--u:min(2.5vh,1.4vw);background:var(--paper);color:var(--ink);overflow:auto;padding:calc(var(--u)*1.5) calc(var(--u)*2.5);box-sizing:border-box;width:100%;height:100%}
.moim.nofs [data-fs]{display:none}
.moim:fullscreen .mset{max-width:44rem;margin:0 auto;font-size:1.125rem}
.mset .gfs{margin-bottom:1.5rem}
.mnames{display:flex;flex-wrap:wrap;gap:.5rem 1rem;margin:.75rem 0 0}
.mnames label{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2)}
.mnames label[hidden]{display:none}
.mset input[type=text]{font:inherit;font-family:var(--sans);font-size:max(1.0625rem,16px);min-height:var(--hit);padding:0 .625rem;border:1px solid var(--rule);border-radius:.375rem;background:var(--paper);color:var(--ink);min-width:0}
.mnames input{width:8em}
.mweek{display:flex;flex-direction:column;gap:.375rem;margin:.75rem 0 .25rem;font-family:var(--sans);font-size:var(--fs-label);color:var(--ink-2)}
.mweek input[type=text]{font-family:var(--serif);font-size:1.5rem;max-width:20rem}
.mwarn{font-family:var(--sans);font-size:var(--fs-label);min-height:1.4em;margin:0}
.mgo .btn.pri{min-width:10rem;justify-content:center;min-height:3.5rem;font-size:var(--fs-body)}
.mteams{grid-area:teams;display:flex;flex-wrap:wrap;gap:calc(var(--u)*.75);margin:0 0 calc(var(--u)*.75)}
.mteam{position:relative;flex:1 1 0;min-width:7rem;display:flex;align-items:center;justify-content:space-between;gap:calc(var(--u)*.75);min-height:max(var(--hit-big),calc(var(--u)*3.75));padding:0 calc(var(--u)*1);border:1px solid var(--ink-3);border-radius:.5rem;background:var(--paper);color:var(--ink);font-family:var(--sans);cursor:pointer;touch-action:manipulation}
.mteam:disabled{cursor:default;color:var(--ink)}
.mteam[aria-pressed=true]{border:3px solid var(--zhu);background:var(--zhu-bg)}
.mtn{font-size:max(var(--fs-ui),calc(var(--u)*1.35));font-weight:500}
.mts{font-family:var(--serif);font-size:max(1.5rem,calc(var(--u)*2.4));font-weight:600;line-height:1}
.mplus{position:absolute;top:calc(var(--u)*-.6);right:calc(var(--u)*.5);padding:0 .4em;border-radius:.25rem;background:var(--zhu);color:var(--paper);font-size:max(var(--fs-label),calc(var(--u)*.9));font-weight:500}
.mprog{grid-area:prog;font-family:var(--sans);font-size:max(var(--fs-label),calc(var(--u)*1));color:var(--ink-2);margin:0 0 calc(var(--u)*.25)}
.mask{grid-area:ask;font-size:max(var(--fs-h3),calc(var(--u)*1.75));font-weight:500;line-height:1.4;margin:0 0 calc(var(--u)*.75)}
.mstim{grid-area:stim;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*.75);padding:calc(var(--u)*1.25);border:1px solid var(--rule);border-radius:.5rem;background:var(--paper-2);margin:0 0 calc(var(--u)*1);min-height:calc(var(--u)*13)}
.mstim .seal.gbig{width:calc(var(--u)*12);height:calc(var(--u)*12);margin:0}
.mstim .pair.xl{--pz:calc(var(--u)*9)}
.mstim .gparts{margin:0;gap:calc(var(--u)*.75)}
.mstim .gpart{flex-basis:calc(var(--u)*9)}
.mstim .gpart .seal.gps{width:calc(var(--u)*5.5);height:calc(var(--u)*5.5)}
.mstim .gpart .gt{font-size:max(var(--fs-label),calc(var(--u)*1.1))}
.mstim .gop{font-size:calc(var(--u)*2.25)}
.mstim .ghole{width:calc(var(--u)*5.5);height:calc(var(--u)*5.5);font-size:calc(var(--u)*2)}
.mt{margin:0;font-size:max(var(--fs-h2),calc(var(--u)*2.4));font-weight:500;line-height:1.2}
.mopts{grid-area:opts;list-style:none;padding:0;margin:0 0 calc(var(--u)*1);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u)*.75)}
.mopt{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*.25);min-height:calc(var(--u)*6.5);padding:calc(var(--u)*.5) calc(var(--u)*.75);border:1px solid var(--ink-3);border-radius:.5rem;background:var(--paper);text-align:center}
.mopt .gno{position:absolute;left:calc(var(--u)*.6);top:calc(var(--u)*.4);font-family:var(--sans);font-size:max(var(--fs-ui),calc(var(--u)*1.4));font-weight:500;color:var(--ink-2)}
.mopt .gh{font-family:var(--serif);font-size:calc(var(--u)*3.75);line-height:1.15}
.mopt .gtt{font-family:var(--serif);font-size:max(var(--fs-h3),calc(var(--u)*1.9));line-height:1.35}
.mopt .seal.gopt-seal{width:calc(var(--u)*5.5);height:calc(var(--u)*5.5);margin:0}
.mopt .gpart .seal.gps{width:calc(var(--u)*4.5);height:calc(var(--u)*4.5)}
.mopt .grev{font-family:var(--sans);font-size:max(var(--fs-label),calc(var(--u)*1.15));color:var(--ink-2);line-height:1.3}
.mopt .grev .gh{font-size:calc(var(--u)*1.8)}
.mopt .gmark{font-family:var(--sans);font-size:max(var(--fs-label),calc(var(--u)*1.15));font-weight:600;color:var(--ink)}
.mopt.ok{border:3px solid var(--zhu);background:var(--zhu-bg)}
.mopt.off .gh,.mopt.off .gtt,.mopt.off .seal,.mopt.off .pk{color:var(--ink-3)}
.mctl{grid-area:ctl;display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 .5rem}
.mctl .btn.pri{min-width:10rem;justify-content:center;min-height:max(3.5rem,calc(var(--u)*3.25));font-size:max(var(--fs-body),calc(var(--u)*1.25))}
.mhint{grid-area:hint;font-family:var(--sans);font-size:max(var(--fs-label),calc(var(--u)*.95));margin:0}
.moim:fullscreen .mstage:not(.mend){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);grid-template-areas:"teams teams" "prog prog" "ask ask" "stim opts" "ctl ctl" "hint hint";column-gap:calc(var(--u)*1.5);align-items:stretch}
.moim:fullscreen .mopts{margin-bottom:calc(var(--u)*1)}
.mend h2{font-size:max(var(--fs-h2),calc(var(--u)*2));margin:0 0 calc(var(--u)*1)}
.mend h3{font-size:var(--fs-h3);font-weight:600;margin:1.5rem 0 .5rem}
.mres{list-style:none;padding:0;margin:0 0 1rem;display:grid;gap:calc(var(--u)*.5);max-width:36rem}
.mres li{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:calc(var(--u)*3.5);padding:0 calc(var(--u)*1);border:1px solid var(--rule);border-radius:.5rem}
.mres li.on{border:3px solid var(--zhu);background:var(--zhu-bg)}
.mres li.on .mtn::after{content:' — 으뜸';font-weight:400;color:var(--ink-2)}
@media (max-width:30rem){.gcard{grid-template-columns:1fr}.pair.xl{--pz:6.5rem}.pair.lg{--pz:4.75rem}.gstim .seal.gbig{width:8rem;height:8rem}.gphr{font-size:2rem}}
.bottom .legal{flex-basis:100%;text-align:center;margin:.25rem 0 0}
.bottom .legal a{margin:0 -.5rem}   /* 누름 자리(좌우 .5rem · 높이 44px)는 그대로, 글자 사이는 둘레 글과 같게 */
/* 이름 풀이의 소전 대비 줄 — 글자 묶음마다 아래에 한글 음, 묶음 사이에서만 줄바꿈 */
.nmr{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem 1rem}
.nm{display:inline-flex;flex-direction:column;align-items:center;white-space:nowrap}
.nm small{font-size:var(--fs-label);color:var(--ink-2);margin-top:.125rem}
.nmr .to{color:var(--ink-2)}