/* ════════════════════════════════════════════════════════════════
   팔레트 — 먹과 인주 (readbefore.kr 디자인 체계 계승)
   강조색은 인장의 붉은색 하나뿐. 값의 정의는 여기 한 곳.
   밝은 면이 기본, 다크는 사용자가 고른다(장문 독해는 밝은 면이 유리).
   ════════════════════════════════════════════════════════════════ */
:root{
  --paper:#fcfbf9; --raise:#fff; --ink:#191512; --soft:#443b36; --muted:#6b615c;
  --rule:#e9e3dd; --seal:#c4342a; --sealbg:#f8ebe8; --chip:#f1ece6;
  --onseal:#fff; --line:#8f857f; /* 인주 위 글자 · 입력 테두리(3:1↑, WCAG 1.4.11) */
  color-scheme:light;
  --serif:"Gowun Batang",serif;
}
/* 영문 페이지 표제 — 영문 세리프 우선, 한글 섞이면 고운바탕으로 */
:root[lang=en]{--serif:"Newsreader","Gowun Batang",Georgia,serif}
:root.dark{
  --paper:#131010; --raise:#1c1817; --ink:#ede7e2; --soft:#bfb4ae; --muted:#968981;
  --rule:#2b2320; --seal:#e8604f; --sealbg:#2e1d1a; --chip:#241e1c;
  --onseal:#131010; --line:#766a63;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",Pretendard,"Noto Sans KR","Malgun Gothic",system-ui,sans-serif;
  line-height:1.7;word-break:keep-all;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;padding-bottom:calc(3.5rem + env(safe-area-inset-bottom))}
@media(min-width:1000px){body{padding-bottom:0}}
::selection{background:var(--seal);color:var(--onseal)}
:focus-visible{outline:2px solid var(--seal);outline-offset:2px;border-radius:4px}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.display{font-family:var(--serif);font-weight:700;letter-spacing:-.02em}
.mono{font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500}
.wrap{max-width:68rem;margin:0 auto;padding:0 16px}
.col{max-width:38rem;margin:0 auto}

/* 머리 — 데스크톱 상단 */
.top{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--paper) 90%,transparent);
  backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;height:56px;gap:16px}
.brand{display:flex;align-items:baseline;gap:8px}
.brand b{font-family:var(--serif);font-size:20px;letter-spacing:-.02em}
.brand b i{font-style:normal;color:var(--seal)}
.brand b,.brand span,.topnav a{white-space:nowrap}
.brand span{font-size:12.5px;color:var(--muted)}
@media(max-width:560px),(min-width:1000px) and (max-width:1180px){.brand span{display:none}}
.topnav{margin-left:auto;display:none;gap:2px}
.topnav a{font-size:14.5px;color:var(--muted);padding:8px 12px;border-radius:999px}
.topnav a:hover,.topnav a[aria-current]{color:var(--ink);background:var(--chip)}
.themebtn{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:var(--muted);margin-left:auto}
.themebtn:hover{background:var(--chip);color:var(--ink)}
/* 언어 전환 키 — 반대 언어의 같은 페이지로 이동 */
.langbtn{min-height:44px;display:inline-flex;align-items:center;gap:6px;padding:0 12px;border-radius:999px;
  border:1px solid var(--rule);font-size:13.5px;color:var(--soft);margin-left:auto;white-space:nowrap}
.langbtn:hover{border-color:var(--seal);color:var(--seal)}
.langbtn svg{width:16px;height:16px}
.langbtn+.themebtn{margin-left:2px}
@media(min-width:1000px){.topnav{display:flex}.langbtn{margin-left:4px}.themebtn{margin-left:4px}}

/* 하단 탭바 — 모바일 엄지 영역 */
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;background:var(--raise);
  border-top:1px solid var(--rule);padding-bottom:env(safe-area-inset-bottom)}
.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:3.5rem;font-size:11.5px;color:var(--muted);gap:2px}
.tabbar a svg{width:21px;height:21px}
.tabbar a[aria-current]{color:var(--seal)}
@media(min-width:1000px){.tabbar{display:none}}

main{padding:28px 0 72px}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:500;letter-spacing:.12em;color:var(--seal);text-transform:uppercase}

/* 홈 */
.hero{padding:40px 0 36px}
.hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,6.4vw,54px);line-height:1.28;letter-spacing:-.035em;margin-top:14px;text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--seal)}
.hero p{margin-top:18px;font-size:17.5px;color:var(--soft);max-width:36rem;line-height:1.8}
.figs{display:flex;gap:28px;margin-top:28px;flex-wrap:wrap}
.figs div{display:flex;flex-direction:column}
.figs b{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:26px;letter-spacing:-.02em}
.figs span{font-size:13px;color:var(--muted)}
.chapters{display:grid;grid-template-columns:1fr;gap:12px;margin-top:8px}
@media(min-width:640px){.chapters{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.chapters{grid-template-columns:1fr 1fr 1fr}}
.chcard{display:flex;flex-direction:column;background:var(--raise);border:1px solid var(--rule);border-radius:18px;
  padding:20px 20px 18px;transition:transform .2s cubic-bezier(.22,1,.36,1),border-color .2s;min-height:168px}
.chcard:hover{transform:translateY(-3px);border-color:var(--seal)}
.chcard .q{font-family:var(--serif);font-weight:700;font-size:19.5px;line-height:1.45;letter-spacing:-.02em;margin:10px 0 auto;text-wrap:balance}
.chcard .meta{display:flex;justify-content:space-between;margin-top:16px;font-size:13px;color:var(--muted)}
.chcard .meta b{color:var(--ink);font-weight:600}
.sect{margin-top:56px}
.sect h2{font-family:var(--serif);font-weight:700;font-size:26px;letter-spacing:-.025em;margin:6px 0 16px}
.sect .lead{color:var(--soft);margin-bottom:18px;max-width:38rem}
.notice{margin-top:40px;border-radius:16px;background:var(--sealbg);padding:18px 20px;font-size:14.5px;color:var(--soft);line-height:1.75}
.notice b{color:var(--ink)}

/* 본문 조판 — 해설 읽는 면 (본문 17px · 행간 1.85 · 38rem) */
.prose{font-size:17px;line-height:1.85;letter-spacing:-.003em;color:var(--soft)}
.prose :where(h2){font-family:var(--serif);color:var(--ink);font-size:23px;font-weight:700;line-height:1.45;letter-spacing:-.02em;margin:2.1em 0 .4em;text-wrap:balance}
.prose :where(h2):first-child{margin-top:0}
.prose :where(p){margin-bottom:1.05em}
.prose :where(strong){color:var(--ink);font-weight:600}
.prose :where(blockquote){background:var(--sealbg);color:var(--ink);border-radius:16px;margin:1.9em 0;padding:18px 20px;font-size:16px;line-height:1.75}
.prose :where(blockquote p){margin:0}
.prose :where(ul){margin:1.05em 0;padding-left:1.15em}
.prose :where(li){margin-bottom:.5em}
.prose :where(li)::marker{color:var(--seal)}
.ref{display:inline-flex;align-items:center;font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:11.5px;line-height:1;
  padding:3px 6px;margin:0 1px;border-radius:6px;background:var(--chip);color:var(--seal);vertical-align:2px;transition:background .15s}
.ref:hover{background:var(--seal);color:var(--onseal)}
.pagehead{padding:20px 0 28px}
.pagehead h1{font-family:var(--serif);font-weight:700;font-size:clamp(28px,5.4vw,40px);line-height:1.3;letter-spacing:-.03em;margin-top:10px;text-wrap:balance}
.pagehead .sub{margin-top:10px;color:var(--muted);font-size:15.5px}
.progress{position:fixed;top:0;left:0;height:2px;background:var(--seal);width:0;z-index:40}

/* 논문 목록·카드 */
.plist{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.pitem{display:block;padding:16px 4px;border-bottom:1px solid var(--rule)}
.pitem:hover .pt{color:var(--seal)}
.pitem .ps{font-family:var(--serif);font-weight:700;font-size:17.5px;line-height:1.55;color:var(--ink);letter-spacing:-.015em}
.pitem .pt{font-size:14px;color:var(--soft);margin-top:4px;transition:color .15s}
.pitem .pm{font-size:12.5px;color:var(--muted);margin-top:4px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.badge{font-family:"IBM Plex Mono",monospace;font-size:11px;padding:2px 7px;border-radius:999px;background:var(--chip);color:var(--muted)}
.badge.core{background:var(--sealbg);color:var(--seal)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 18px}
.filters input,.filters select{min-height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--raise);color:var(--ink);font:inherit;font-size:15px}
.filters input{flex:1 1 240px}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips a,.chips button{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 13px;border-radius:999px;border:1px solid var(--rule);background:var(--raise);font-size:14px}
.chips a:hover,.chips button:hover,.chips .on{border-color:var(--seal);color:var(--seal)}
.chips small{font-family:"IBM Plex Mono",monospace;color:var(--muted);font-size:11.5px}

/* 논문 상세 */
.paper .bib{font-size:14px;color:var(--muted);margin-top:10px}
.paper h3{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:12px;letter-spacing:.1em;color:var(--seal);margin:30px 0 10px}
.finding{padding:14px 0;border-bottom:1px solid var(--rule)}
.finding:last-child{border-bottom:0}
.finding p{font-size:16.5px;color:var(--ink);line-height:1.75}
.finding .kind{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--muted);margin-right:6px}
.finding q{display:block;margin-top:8px;font-size:13.5px;color:var(--muted);border-left:2px solid var(--rule);padding-left:10px;quotes:"“" "”"}
.caveat{margin-top:28px;font-size:13.5px;color:var(--muted);background:var(--chip);border-radius:12px;padding:12px 14px;line-height:1.7}
.pager{display:flex;justify-content:space-between;gap:12px;margin-top:40px;font-size:14px;color:var(--muted)}
.pager a:hover{color:var(--seal)}

/* 지도 */
.mapfig{background:var(--raise);border:1px solid var(--rule);border-radius:18px;padding:12px;margin:8px 0 6px;overflow:hidden}
.mapfig svg{display:block;width:100%;height:auto}
.mapfig .node{cursor:pointer}
.mapfig .node:hover circle{fill:var(--seal)}
.mapfig .node:hover text.lbl{fill:var(--onseal)}
.figcap{font-size:13px;color:var(--muted);margin-bottom:18px}
.table{width:100%;border-collapse:collapse;font-size:14.5px}
.tablewrap{overflow-x:auto;border:1px solid var(--rule);border-radius:14px;background:var(--raise)}
.table th,.table td{padding:10px 12px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.table th{background:var(--sealbg);color:var(--ink);font-weight:600;font-size:13px;white-space:nowrap}
.table tr:last-child td{border-bottom:0}
.use{background:var(--raise);border:1px solid var(--rule);border-radius:16px;padding:18px 20px;margin-bottom:12px}
.use h4{font-family:var(--serif);font-size:19px;letter-spacing:-.02em}
.use ul{margin:10px 0 0 1.1em;font-size:15.5px;color:var(--soft)}
.use li{margin-bottom:6px}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none}*{transition-duration:.001ms!important}}
footer{border-top:1px solid var(--rule);padding:28px 0 36px;font-size:13px;color:var(--muted);line-height:1.8}
footer a{text-decoration:underline;text-underline-offset:3px}

/* ════════════════════════════════════════════════════════════════
   전광판 (10-06) — 뉴욕 빌딩의 한글 광고처럼.
   첫 화면·장 머리만 검은 화면 위 거대 한글. 읽는 면(본문)은 종이 그대로.
   붓·한지·도장 장식은 쓰지 않는다 — 현대 도시의 광고판으로.
   ════════════════════════════════════════════════════════════════ */
:root{--screen:#0b0a0c;--led:#fff4ea;--glow:#ff5a43;--amber:#ffb547;--display:"Black Han Sans","Noto Sans KR",sans-serif}
.board{position:relative;overflow:hidden;background:var(--screen);color:var(--led);isolation:isolate}
.board::before{content:"";position:absolute;inset:-20%;z-index:-2;
  background:radial-gradient(40% 50% at 78% 38%,color-mix(in srgb,var(--glow) 55%,transparent),transparent 70%),
             radial-gradient(35% 45% at 18% 85%,color-mix(in srgb,var(--amber) 28%,transparent),transparent 70%);
  filter:blur(30px);animation:drift 18s ease-in-out infinite alternate}
.board::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px)}
@keyframes drift{to{transform:translate3d(-6%,4%,0) scale(1.08)}}
.board .wrap{position:relative}
.board .eyebrow{color:var(--amber)}

/* 홈 — 빌딩 외벽: 크기가 다른 화면들, 사이는 창틀(검은 줄) */
main.flush{padding-top:0}
.wall{padding:14px 0 14px}
.wall::before{opacity:.55}
.panes{display:grid;gap:6px;grid-template-columns:1fr 1fr 1fr}
.pane{position:relative;background:#111014;border:1px solid #232027;padding:20px 20px 22px;overflow:hidden}
.pane::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 30%)}
.p-word{grid-column:1/-1;min-height:clamp(300px,58vw,520px);display:flex;flex-direction:column;justify-content:center;align-items:center;background:#0d0b0e}
.p-head{grid-column:1/-1;padding:26px 22px 28px}
.p-head h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,5.4vw,58px);line-height:1.12;letter-spacing:-.03em;margin-top:12px;color:#fff;text-wrap:balance}
.p-head h1 em{font-style:normal;color:var(--glow);text-shadow:0 0 26px color-mix(in srgb,var(--glow) 60%,transparent)}
.p-head .ph{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.18);color:rgba(255,244,234,.72)}
.p-head .ph b{color:var(--amber)}
.p-num{display:flex;flex-direction:column;justify-content:flex-end;min-height:110px;padding:16px 14px 16px}
.p-num span{font-size:12.5px;color:rgba(255,244,234,.6);margin-top:4px}
@media(min-width:1000px){
  .panes{grid-template-columns:1.25fr 1fr 1fr 1fr;grid-template-rows:auto auto}
  .p-word{grid-column:1;grid-row:1/3;min-height:600px}
  .p-head{grid-column:2/5;grid-row:1}
  .p-num{grid-row:2}
  /* 좁고 긴 화면 = 세로 간판: 한 줄에 한 음절 */
  .p-word .led b{word-break:break-all;max-width:1.05em;text-align:center;font-size:min(1em,calc(1.6em / var(--len,1)))}
}
.tag{position:absolute;top:14px;left:16px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.2em;color:var(--glow)}
.tag::first-letter{animation:blink 1.4s steps(2) infinite}
@keyframes blink{50%{opacity:0}}

/* LED 점 글자 — 글자를 점 격자로 오려 실제 전광판처럼 */
.led{position:relative;display:grid;place-items:center;min-height:1em;font-family:var(--display);line-height:.95;
  font-size:clamp(150px,34vw,300px);color:var(--led)}
.led b,.ledn{font-weight:400;-webkit-mask:radial-gradient(circle,#000 58%,transparent 64%) 0 0/var(--dot,7px) var(--dot,7px);
  mask:radial-gradient(circle,#000 58%,transparent 64%) 0 0/var(--dot,7px) var(--dot,7px)}
.led b:lang(ko){letter-spacing:-.04em}
.ledn{font-family:var(--display);white-space:nowrap;font-size:clamp(30px,8.5vw,72px);line-height:1;color:var(--amber);--dot:4px;
}
.lw{display:inline-block;filter:drop-shadow(0 0 8px color-mix(in srgb,var(--amber) 70%,transparent))}
/* 자모 조립 — 흩어진 자모가 모여 한 글자로. 매 회 요소를 새로 그려 애니메이션이 처음부터 돈다(4.2s 한 바퀴) */
.led{filter:drop-shadow(0 0 10px var(--glow)) drop-shadow(0 0 36px color-mix(in srgb,var(--glow) 55%,transparent))}
.led .parts{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:.06em;font-size:min(.42em,calc(1.15em / var(--n,3)));color:var(--amber)}
.led b{font-size:min(1em,calc(1.12em / var(--len,1)))}
.led .parts i{font-style:normal;opacity:0;animation:jseq 4.2s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--k) * .18s)}
.led.anim b{animation:bseq 4.2s cubic-bezier(.22,1,.36,1) both}
@keyframes jseq{0%{opacity:0;transform:translateY(.7em) scale(.7)}12%,30%{opacity:1;transform:none;filter:none}42%,100%{opacity:0;transform:scale(1.7);filter:blur(6px)}}
@keyframes bseq{0%,34%{opacity:0;transform:scale(.6);filter:blur(10px)}48%,90%{opacity:1;transform:none;filter:none}100%{opacity:0;filter:blur(4px)}}
.jamo{margin-top:16px;font-size:12.5px;letter-spacing:.06em;color:rgba(255,244,234,.62);text-align:center;min-height:1.4em}

/* 한국어 단어 타일 — 홈 */
.wordrow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
@media(min-width:1000px){.wordrow{grid-template-columns:repeat(8,minmax(0,1fr))}}
.wtile{aspect-ratio:1/1.1;display:flex;flex-direction:column;justify-content:space-between;padding:12px;background:var(--screen);color:var(--led);
  transition:transform .25s cubic-bezier(.22,1,.36,1)}
.wtile b{font-family:var(--display);font-weight:400;white-space:nowrap;font-size:clamp(28px,4.2vw,46px);line-height:1;transition:text-shadow .25s,color .25s}
.wtile small{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber)}
.wtile:hover{transform:translateY(-4px)}
.wtile:hover b{color:#fff;text-shadow:0 0 12px var(--glow),0 0 34px var(--glow)}

/* 단어 페이지 항목 */
.wentry{background:var(--raise);border:1px solid var(--rule);padding:18px 18px 16px;scroll-margin-top:72px}
.wentry .wh{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.wentry .wh b{font-family:var(--display);font-weight:400;font-size:44px;line-height:1}
.wentry .wh .mono{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--seal)}
.say{margin-left:auto;min-height:40px;padding:0 14px;border:1px solid var(--rule);border-radius:999px;font-size:13px;color:var(--soft)}
.say:hover{border-color:var(--seal);color:var(--seal)}

/* 흐르는 자막 띠 */
.ticker{background:var(--glow);color:#1a0806;overflow:hidden;white-space:nowrap;border-block:1px solid #0003}
.ticker div{display:inline-flex;gap:0;padding:11px 0;animation:tick 40s linear infinite}
.ticker span{font-family:var(--display);font-size:19px;padding:0 18px;display:inline-flex;align-items:baseline;gap:8px}
.ticker span small{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;opacity:.75}
.ticker span::after{content:"●";font-size:7px;margin-left:26px;opacity:.5;align-self:center}
@keyframes tick{to{transform:translateX(-50%)}}

/* 장 카드 — 위는 전광판 띠(장 번호 + 한글), 아래는 종이 */
.chcard{position:relative;overflow:hidden;border-radius:3px;padding-top:0}
.chcard .glyph{display:flex;justify-content:space-between;align-items:flex-end;margin:0 -20px 14px;padding:12px 18px 10px;background:var(--screen);
  font-family:var(--display);font-size:46px;line-height:1;color:var(--led);letter-spacing:-.03em;
  text-shadow:0 0 10px color-mix(in srgb,var(--glow) 70%,transparent),0 0 30px color-mix(in srgb,var(--glow) 35%,transparent);transition:text-shadow .3s,color .3s}
.chcard:hover .glyph{color:#fff;text-shadow:0 0 12px var(--glow),0 0 40px var(--glow)}
.chcard:hover{border-color:var(--seal)}
.aicard,.notice,.mapfig,.use,.ph,.filters input,.filters select,.caveat{border-radius:3px}

/* 장 머리 전광판 */
.ch-board{padding:44px 0 40px;margin-bottom:28px}
.ch-board .wrap{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.ch-board h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,5.4vw,46px);line-height:1.2;letter-spacing:-.03em;margin-top:10px;color:#fff;text-wrap:balance}
.ch-board .sub{margin-top:10px;color:color-mix(in srgb,var(--led) 70%,transparent);font-size:15.5px}
.ch-board .big{font-family:var(--display);font-size:clamp(84px,17vw,190px);line-height:.85;color:var(--led);flex:none;
  text-shadow:0 0 16px color-mix(in srgb,var(--glow) 75%,transparent),0 0 54px color-mix(in srgb,var(--glow) 40%,transparent)}
@media(max-width:620px){.ch-board .wrap{flex-direction:column-reverse;align-items:flex-start}}

/* 언어 제안 띠 — 자동 이동 대신(Google: 언어 추정 리다이렉트 금지) */
.langhint{display:none;align-items:center;gap:10px;justify-content:center;padding:8px 16px;background:var(--ink);color:var(--paper);font-size:14px}
.langhint.on{display:flex}
.langhint a{text-decoration:underline;text-underline-offset:3px}
.langhint button{min-width:44px;min-height:36px;opacity:.7}

/* 영문 읽는 면 — 출발값(조사: 18px · 행간 1.65~1.75) */
:root[lang=en] .prose{font-size:18px;line-height:1.72}

@media(prefers-reduced-motion:reduce){
  .board::before,.ticker div{animation:none}
  .tag::first-letter{animation:none}
}
/* 작은 폰(≤360px) — 영문 사이트명이 길어 머리글이 넘치지 않게 */
@media(max-width:360px){.top .wrap{gap:8px}.brand b{font-size:16px}.langbtn{padding:0 8px;gap:4px}.themebtn{width:36px}}
/* 푸터 언어 전환 — 끝까지 읽은 사람용 두 번째 키 */
.footlang{display:flex;width:max-content;margin:0 0 14px;text-decoration:none!important}
.langhint a{white-space:nowrap}
@media(max-width:600px){.langhint{justify-content:space-between;font-size:13.5px;line-height:1.45}}

/* 근거 배지 — 대중용 쉬운 말 */
.ev{display:inline-block;font-size:11.5px;padding:2px 8px;border-radius:3px;vertical-align:1px;margin-left:6px;font-weight:600}
.ev-ok{background:#e6f2ea;color:#1d6b3a}.ev-mix{background:#fdf1dc;color:#8a5a00}.ev-go{background:var(--sealbg);color:var(--seal)}
:root.dark .ev-ok{background:#16301f;color:#7fd39b}:root.dark .ev-mix{background:#33270f;color:#f2c063}
.grid3{display:grid;gap:10px;grid-template-columns:1fr}@media(min-width:640px){.grid3{grid-template-columns:1fr 1fr}}@media(min-width:1000px){.grid3{grid-template-columns:1fr 1fr 1fr}}
.grid3 .wentry .wh b{font-size:30px}

/* 한글 조립기 — 왼쪽 전광판, 오른쪽 자모 키 */
.builder{display:grid;gap:6px;margin-bottom:14px}
@media(min-width:900px){.builder{grid-template-columns:.9fr 1.1fr}}
.bscreen{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 16px 22px;min-height:340px}
.bscreen .led{font-size:clamp(150px,30vw,230px)}
.bscreen.pop .led b{animation:pop .45s cubic-bezier(.22,1,.36,1)}
@keyframes pop{from{transform:scale(.7);filter:blur(6px);opacity:.3}}
.bscreen .say{margin:14px 0 0;border-color:rgba(255,255,255,.25);color:var(--led)}
.bkeys{background:var(--raise);border:1px solid var(--rule);padding:14px 14px 16px}
.bkeys h4{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--seal);margin:10px 0 8px}
.bkeys h4:first-child{margin-top:0}
.jrow{display:flex;flex-wrap:wrap;gap:4px}
.jk{min-width:40px;min-height:40px;padding:0 8px;border:1px solid var(--line);background:var(--paper);font-size:18px;font-family:"Noto Sans KR",system-ui,sans-serif}
.jk:hover{border-color:var(--seal)}
.jk.on{background:var(--screen);color:var(--led);border-color:var(--screen);box-shadow:0 0 0 2px var(--glow) inset}
@media(prefers-reduced-motion:reduce){.bscreen.pop .led b{animation:none}}

/* 홈 — K-성격유형 전광판 띠 */
.ktcta{display:grid;gap:6px;padding:28px 24px 26px;position:relative;overflow:hidden;color:var(--led)}
.ktcta .ktq{font-family:var(--serif);font-weight:700;font-size:clamp(24px,4vw,34px);line-height:1.25;color:#fff;max-width:30rem;position:relative}
.ktcta .ktl{color:rgba(255,244,234,.72);font-size:15px;position:relative}
.ktcta .ktgo{margin-top:10px;font-weight:700;color:var(--amber);position:relative}
.ktcta .ktbig{position:absolute;right:-10px;bottom:-26px;font-family:var(--display);font-size:clamp(70px,13vw,150px);line-height:1;color:var(--glow);opacity:.22;white-space:nowrap}
.ktcta:hover .ktbig{opacity:.5;text-shadow:0 0 30px var(--glow)}
.ktcta:hover .ktgo{text-decoration:underline;text-underline-offset:4px}
.kt{padding:6px 0 2px}

/* 논문 심층 해설 — 대중용 요약 아래, 경계선으로 구분 */
.deep{margin-top:44px;padding-top:26px;border-top:3px solid var(--ink)}
.deep h2{font-family:var(--serif);font-weight:700;font-size:26px;letter-spacing:-.02em;margin:6px 0 8px}
.deep .lead{color:var(--soft);margin-bottom:14px}
.deep h3{scroll-margin-top:72px}

/* 발음 버튼 재생 중 — 보통 속도 한 번, 천천히 한 번 */
.say.playing{border-color:var(--seal);color:var(--seal);animation:sayp 1s ease-in-out infinite}
@keyframes sayp{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--seal) 18%,transparent)}}
@media(prefers-reduced-motion:reduce){.say.playing{animation:none}}

/* 실제 논문 페이지 */
.paper .psum{font-family:var(--serif);font-weight:700;font-size:clamp(20px,3.2vw,25px);line-height:1.5;letter-spacing:-.015em;color:var(--ink);margin-top:12px;text-wrap:pretty}
.paper .ptitle{font-size:16px!important;font-family:inherit!important;font-weight:600!important;color:var(--soft);margin-top:14px!important;line-height:1.55!important;letter-spacing:0!important}
.paper .porig{font-size:14px;color:var(--muted);margin-top:4px}
.paper .pq{font-size:16.5px;color:var(--ink);line-height:1.75}
.ev-q{margin-top:8px;border-left:2px solid var(--rule);padding-left:10px;font-size:13.5px;color:var(--muted);line-height:1.65}
.ev-q q{display:block;quotes:"“" "”"}
.ev-q .qtr{display:block;margin-top:3px;font-style:italic;color:var(--soft)}
.ev-q .pg{font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--seal);margin-left:2px}
.finding .term{color:var(--seal)}
.finding .meta2{font-size:14.5px;color:var(--soft);margin-top:6px}
/* 모바일 누름 영역 — 권장 44px (10-06 점검: 안내 띠 링크 20px, 이전·다음 24px였음) */
.langhint a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
.pager a{display:inline-flex;align-items:center;min-height:44px}

/* 표기 메모 — 공식 로마자 외 OED·표준 표기 */
.rnote{font-size:13px;color:var(--muted);margin:-4px 0 10px;line-height:1.6}
.rnote b{color:var(--ink);font-weight:600}
.rbox{font-size:14px}

/* 논문 목록·페이지 보강 */
.pitem[hidden]{display:none}
.pitem .pm span:not(.badge){white-space:nowrap}
.paper .eyebrow a{color:inherit}
.paper .doi{color:var(--seal);white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.paper .pager{align-items:center}