/* glossa — 강의 페이지에 덧붙는 기능(상단 바, 차례, 글자 크기, 단어 카드, 이전·다음 강의)
   강의 원고의 색(--paper, --ink, --rule, --lacquer, --pen, --card)을 그대로 따라가므로 원고 디자인을 바꾸지 않습니다. */
html{scroll-padding-top:calc(72px + env(safe-area-inset-top,0px))!important}
html[data-lfs]{font-size:calc(16px * var(--lfs-r,1))!important}
html[data-lfs] body{font-size:calc(var(--nkl-base,17px) * var(--lfs-r,1))!important}
.nkl-ui{font-family:"Gowun Dodum","IBM Plex Sans KR","Pretendard Variable","Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-style:normal;line-height:1.5;color:var(--ink,#2b2419)}
.nkl-ui button{font:inherit;color:inherit;cursor:pointer}

/* 상단 바 */
.nkl-bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:var(--paper,#ece3c4);background:color-mix(in srgb,var(--paper,#ece3c4) 88%,transparent);-webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--rule,var(--line,#c4b489))}
.nkl-bar::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:env(safe-area-inset-top,0px);background:var(--paper,#ece3c4)}
.nkl-in{max-width:980px;margin:0 auto;height:54px;padding:0 14px;display:flex;align-items:center;gap:6px}
.nkl-home{display:flex;align-items:center;gap:8px;min-width:0;margin-right:auto;text-decoration:none;color:var(--ink,#2b2419)}
.nkl-home svg{flex:none}
.nkl-where{min-width:0;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-where b{color:var(--ink,#2b2419);font-weight:700}
.nkl-btn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 11px;border:0;border-radius:10px;background:transparent;font-size:.86rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-btn:hover,.nkl-btn[aria-expanded="true"]{background:color-mix(in srgb,var(--rule,var(--line,#c4b489)) 35%,transparent);color:var(--ink,#2b2419)}
.nkl-btn svg{width:18px;height:18px}
.nkl-aa{font-family:"Gowun Batang",serif;font-weight:700;font-size:1.02rem}
.nkl-aa small{font-size:.72em;margin-right:1px}
.nkl-prog{position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))))}
@media (max-width:560px){.nkl-where{display:none}.nkl-btn .nkl-t{display:none}}

/* 패널 공통 */
.nkl-pop{position:fixed;z-index:70;top:calc(62px + env(safe-area-inset-top,0px));right:max(12px,calc((100vw - 980px)/2 + 12px));width:300px;padding:16px 16px 8px;background:var(--card,var(--paper,#f1e9cf));border:1px solid var(--rule,var(--line,#c4b489));border-radius:14px;box-shadow:0 18px 40px -18px rgba(60,40,10,.45)}
.nkl-pop[hidden],.nkl-drawer[hidden],.nkl-modal[hidden],.nkl-scrim[hidden],.nkl-toast[hidden]{display:none}
.nkl-pop h2{margin:0 0 4px;font-size:.92rem}
.nkl-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 0;border-top:1px solid var(--rule,var(--line,#c4b489));font-size:.86rem}
.nkl-row:first-of-type{border-top:0}
.nkl-step{display:flex;align-items:center;gap:4px}
.nkl-step button{width:36px;height:34px;border-radius:9px;border:1px solid var(--rule,var(--line,#c4b489));background:var(--paper,#ece3c4);font-family:"Gowun Batang",serif;font-weight:700}
.nkl-step button:disabled{opacity:.35;cursor:default}
.nkl-step output{min-width:3.2em;text-align:center;font-variant-numeric:tabular-nums}
.nkl-seg{display:inline-flex;padding:3px;border-radius:999px;border:1px solid var(--rule,var(--line,#c4b489));background:var(--paper,#ece3c4)}
.nkl-seg button{border:0;background:transparent;border-radius:999px;padding:4px 11px;font-size:.8rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-seg button[aria-pressed="true"]{background:var(--card,var(--paper-2,#f1e9cf));color:var(--ink,#2b2419);box-shadow:0 1px 2px rgba(60,40,10,.18)}

/* 차례 서랍 */
.nkl-scrim{position:fixed;inset:0;z-index:68;background:rgba(40,28,10,.28)}
.nkl-drawer{position:fixed;z-index:70;top:0;bottom:0;left:0;width:min(340px,88vw);padding:calc(18px + env(safe-area-inset-top,0px)) 14px 24px;background:var(--card,var(--paper,#f1e9cf));border-right:1px solid var(--rule,var(--line,#c4b489));overflow:auto;box-shadow:18px 0 40px -24px rgba(60,40,10,.5)}
.nkl-drawer h2{display:flex;justify-content:space-between;align-items:center;margin:0 4px 10px;font-size:1rem}
.nkl-drawer ol{list-style:none;margin:0;padding:0}
.nkl-drawer a{display:flex;gap:10px;align-items:baseline;padding:8px 10px;border-radius:9px;text-decoration:none;color:var(--ink,#2b2419);font-size:.93rem}
.nkl-drawer a:hover{background:color-mix(in srgb,var(--rule,var(--line,#c4b489)) 30%,transparent)}
.nkl-drawer a.on{background:color-mix(in srgb,var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d))))) 10%,transparent);color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))));font-weight:700}
.nkl-drawer .nkl-mk{flex:none;min-width:2.6em;font-family:"EB Garamond",serif;font-style:italic;color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))))}

/* 이어 읽기 알림 */
.nkl-toast{position:fixed;z-index:65;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;align-items:center;gap:12px;padding:10px 10px 10px 16px;background:var(--ink,#2b2419);color:var(--paper,#ece3c4);border-radius:14px;box-shadow:0 14px 30px -14px rgba(0,0,0,.5);font-size:.88rem;max-width:calc(100vw - 24px)}
.nkl-toast button{border:0;border-radius:10px;padding:7px 12px;background:var(--paper,#ece3c4);color:var(--ink,#2b2419);font-weight:700;font-size:.84rem}
.nkl-toast .nkl-tx{background:transparent;color:inherit;opacity:.7;padding:7px}

/* 단어 카드 */
.nkl-cardbtn{display:inline-flex;align-items:center;gap:8px;margin:6px 0 4px;padding:9px 16px;border-radius:999px;border:1px solid var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))));background:transparent;color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))));font-size:.9rem;font-weight:700}
.nkl-cardbtn:hover{background:color-mix(in srgb,var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d))))) 8%,transparent)}
.nkl-modal{position:fixed;inset:0;z-index:75;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(40,28,10,.4)}
.nkl-sheet{width:min(480px,100%);max-height:100%;overflow:auto;padding:16px 16px 18px;background:var(--paper,#ece3c4);border:1px solid var(--rule,var(--line,#c4b489));border-radius:18px;box-shadow:0 24px 60px -24px rgba(0,0,0,.6)}
.nkl-sheet header{display:flex;justify-content:space-between;align-items:center;gap:10px}
.nkl-sheet header b{font-size:.95rem}
.nkl-groups{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.nkl-groups button{padding:4px 10px;border-radius:999px;border:1px solid var(--rule,var(--line,#c4b489));background:transparent;font-size:.78rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-groups button[aria-pressed="true"]{border-color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))));color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))));font-weight:700}
.nkl-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:100%;min-height:250px;padding:26px 20px 22px;border:1px solid var(--rule,var(--line,#c4b489));border-radius:14px;background:var(--card,var(--paper-2,#f1e9cf));cursor:pointer}
.nkl-card::before{content:"";position:absolute;left:-1px;top:22px;bottom:22px;width:3px;background:var(--gilt,var(--brass,#9a7420))}
.nkl-card .nkl-cn{position:absolute;top:10px;right:14px;font-size:.78rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)));font-variant-numeric:tabular-nums}
.nkl-card .nkl-cw{font-family:"EB Garamond",serif;font-style:italic;font-size:2.5rem;line-height:1.15;color:var(--ink,#2b2419)}
.nkl-card .nkl-cr{margin-top:6px;font-family:"Gowun Dodum",sans-serif;color:var(--pen,#2c4f86);font-size:1.1rem}
.nkl-card .nkl-cm{font-family:"Gowun Batang",serif;font-size:1.35rem;font-weight:700;line-height:1.4}
.nkl-card .nkl-cp{margin-top:6px;font-size:.84rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-card .nkl-ce{margin-top:14px;font-family:"EB Garamond",serif;font-style:italic;font-size:1rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-card .nkl-hint{margin-top:16px;font-size:.76rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)));opacity:.8}
.nkl-card .ln{text-decoration:overline;text-decoration-color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))));text-decoration-thickness:1.5px}
.nkl-ctl{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;margin-top:12px}
.nkl-ctl button{height:42px;border-radius:11px;border:1px solid var(--rule,var(--line,#c4b489));background:var(--card,var(--paper-2,#f1e9cf));font-size:.88rem}
.nkl-ctl .nkl-flip{padding:0 18px;background:var(--ink,#2b2419);color:var(--paper,#ece3c4);border-color:transparent;font-weight:700}
.nkl-x{width:36px;height:36px;border-radius:10px;border:0;background:transparent;font-size:1.2rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}

/* 이전·다음 강의 — 원고 CSS의 영향을 받지 않도록 전부 nkl- 이름을 쓰고 기본값을 직접 지정 */
.nkl-nav{max-width:760px;margin:64px auto 0;padding:0 20px;box-sizing:border-box}
.nkl-nav *{box-sizing:border-box}
.nkl-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
.nkl-pn{display:flex;flex-direction:column;gap:3px;min-width:0;margin:0;padding:16px 18px;border:1px solid var(--rule,var(--line,#c4b489));border-radius:12px;background:var(--card,var(--paper-2,#f1e9cf));box-shadow:none;text-decoration:none;color:var(--ink,#2b2419)}
a.nkl-pn:hover{border-color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))))}
.nkl-pn.nkl-next{text-align:right;align-items:flex-end}
.nkl-lab,.nkl-t,.nkl-s{display:block;margin:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}
.nkl-lab{font-size:.78rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
.nkl-t{font-family:"Gowun Batang",serif;font-weight:700;font-size:1.05rem;line-height:1.4;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nkl-s{font-size:.78rem;color:var(--lacquer,var(--lapis,var(--blue,var(--klein,var(--cobalto,#8e2b1d)))))}
.nkl-off{opacity:.6}
.nkl-off .nkl-s{color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)))}
a.nkl-all{display:inline-block;margin:16px auto 0;padding:4px 2px;border:0;background:none;font-size:.9rem;color:var(--soft,var(--ink-2,var(--ink-soft,#5e5240)));text-decoration:underline;text-decoration-color:var(--rule,var(--line,#c4b489));text-underline-offset:4px}
.nkl-nav{text-align:center}
.nkl-grid{text-align:left}
a.nkl-all:hover{color:var(--ink,#2b2419)}
@media (max-width:560px){.nkl-grid{grid-template-columns:1fr}.nkl-pn.nkl-next{text-align:left;align-items:flex-start}}
@media print{.nkl-bar,.nkl-nav,.nkl-cardbtn,.nkl-toast{display:none!important}}

/* 원고에 자체 상단 바가 있는 강의(lite): 상단 바 안의 '강좌 목록' 링크 */
/* 원고의 버튼 모양을 빌린 링크: 버튼(button)은 글자를 저절로 세로 가운데 두지만 링크(a)는 그렇지 않아서 직접 맞춤 */
.nkl-homelink{display:inline-flex!important;align-items:center;justify-content:center;gap:.25em;box-sizing:border-box;flex:none;text-decoration:none;white-space:nowrap;vertical-align:middle}
.nkl-aabtn{display:inline-flex!important;align-items:center;justify-content:center;box-sizing:border-box;vertical-align:middle}
@media print{.nkl-homelink{display:none!important}}

/* 원고 자체 상단 바에 끼워 넣는 글자 크기 버튼 */
.nkl-aabtn{flex:none}
.nkl-aabtn .nkl-aa{font-size:.95rem;line-height:1}
/* 좁은 화면: 원고 상단 바가 넘치지 않도록 목록 링크는 화살표만, 글자 크기 버튼은 아주 좁은 화면에서 숨김 */
@media (max-width:560px){.nkl-homelink .nkl-hl-t{display:none}}
@media (max-width:430px){.nkl-aabtn{display:none!important}}
/* 좁은 화면에서 원고 제목 앞으로 옮겨 붙은 목록 링크 */
.nkl-homelink.nkl-inline{margin-right:.55em;font-style:normal;font-weight:400;vertical-align:.12em}
@media print{.nkl-homebtn{display:none!important}}
