/* ============================================================
   Cognitive Inhabitation — v3.4 stylesheet
   v3.1 시안 1b "Journal"(조용한·발표된·도판번호) 디자인 언어를
   v3 전체 페이지 골격에 이식. v3에서 쓰이던 클래스명을 하나도 버리지
   않았으므로 detail_*.html · m1.html 등은 마크업 수정 없이 새 옷을 입는다.
   원본 v3 시트는 styles_v3_원본.css 로 보존.

   1b 문법 — 바탕은 크림, 글은 세리프, 표식만 모노.
     · 암부(어두운 헤더·히어로)를 전부 걷어냈다. 지면은 한 장의 종이다.
     · 위계는 굵기가 아니라 크기·이탤릭·괘선으로 만든다.
     · 모노스페이스는 "본문의 목소리"가 아니라 "도판 번호"의 목소리로만 쓴다.
   국문 조판 — 라틴 세리프(Newsreader)에는 한글 자소가 없다. 그래서
     제목은 한글 세리프(Noto Serif KR), 본문은 한글 산스로 갈아끼운다.
     섞어 쓰면 획 대비가 어긋나 오히려 지저분해진다.
   ============================================================ */

:root{
  /* --- 1b 팔레트 --- */
  --bg:#FBFAF6;          /* 지면 크림 */
  --panel:#FFFEFB;
  --panel2:#F1EEE5;
  --ink:#17191A;
  --dim:#8B8D89;         /* 표식·보조 */
  --body:#4B4E4D;        /* 본문 회색 */
  --accent:#8A2B1B;      /* 벽돌색 — 1b 강조 */
  --accentD:#A8412C;     /* 밝은 바탕 위 보조 강조 */
  --line:#DAD6CB;
  --line2:#C9C5B9;
  --ok:#2f6d43;
  --ease:cubic-bezier(.22,.61,.36,1);
  --mono:'IBM Plex Mono','SF Mono',Consolas,'Courier New',monospace;
  --serif:'Newsreader','Noto Serif KR',Georgia,'Apple SD Gothic Neo',serif;
  --serifKO:'Noto Serif KR','Newsreader','Apple SD Gothic Neo',serif;
  --sans:'Pretendard Variable',Pretendard,-apple-system,'Apple SD Gothic Neo','Malgun Gothic',Helvetica,Arial,sans-serif;
  --rail:110px;          /* 좌측 도판·절 번호 레일 */
  --pad:56px;            /* 좌우 여백 — 1b 지면 */
  /* 하위호환: 옛 암부 변수를 참조하는 규칙이 남아 있어도 지면이 깨지지 않게 밝은 값으로 묶어 둔다 */
  --dark:#FBFAF6; --dark2:#17191A; --onDark:#17191A; --onDarkDim:#4B4E4D;
  --dimd:#8B8D89; --lineDark:#DAD6CB;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--serif);line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--accent);color:#fff}
a{color:inherit;text-decoration:none}
img,video{max-width:100%}
.mono{font-family:var(--mono)}

/* ============ nav — 지면 위 얇은 머리글 ============ */
nav{display:flex;align-items:center;gap:28px;padding:22px var(--pad);
  background:var(--bg);color:var(--ink);border-bottom:1px solid var(--ink);
  position:sticky;top:0;z-index:30}
nav .logo{font-family:var(--mono);font-weight:500;font-size:12.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink)}
/* 상표 표기 — 출원 중이므로 ™ (등록 후에는 ®로 교체) */
nav .logo .tm{font-family:var(--sans);font-size:.78em;letter-spacing:0;
  vertical-align:.45em;margin-left:.2em;opacity:.85;font-weight:500}
nav .navlinks{display:flex;align-items:center;gap:30px;margin-left:8px;flex:1;
  font-family:var(--mono);font-size:12px;letter-spacing:.08em}
nav .navlinks a{color:#6E706C;transition:color .18s var(--ease)}
nav .navlinks a:hover{color:var(--ink)}
nav a.on{color:var(--ink);border-bottom:1px solid var(--accent);padding-bottom:2px}
nav .spacer{margin-left:auto}
nav .cta{border:none;color:var(--accent);background:none;border-radius:0;
  font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:none;
  padding:0;transition:opacity .18s var(--ease)}
nav .cta:hover{opacity:.7;background:none;color:var(--accent)}
nav .langbtn{border:none;background:none;color:#6E706C;cursor:pointer;
  font-family:var(--mono);font-size:12px;letter-spacing:.08em;padding:0;transition:color .18s var(--ease)}
nav .langbtn:hover{color:var(--ink)}
.navtoggle{display:none;margin-left:auto;background:none;border:1px solid var(--line2);
  color:var(--ink);font-size:16px;padding:5px 11px;cursor:pointer}

/* 본문 CTA (nav 밖) — 채움 버튼 */
a.cta:not(nav a),.wrap .cta{display:inline-block;background:var(--accent);color:var(--bg);
  border:none;border-radius:0;font-family:var(--mono);font-size:12.5px;font-weight:400;
  letter-spacing:.1em;text-transform:uppercase;padding:15px 28px;transition:filter .18s var(--ease)}
.wrap .cta:hover{filter:brightness(1.16);background:var(--accent);color:var(--bg)}

/* ============ 레이아웃 ============ */
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--pad) 40px}
.wrap>section{padding-top:88px;margin-top:88px;border-top:1px solid var(--line)}
.wrap>section:first-of-type{border-top:none;margin-top:0}

/* 좌측 절(節) 레일 — .act 구조. 1b의 "§ I" 자리 */
.act{display:flex;gap:44px;align-items:flex-start}
.act>.actno{width:var(--rail);flex:none;padding-top:10px}
.act>.actbody{flex:1;min-width:0}
.actno{font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--dim)}
.actno b{font-weight:400;color:var(--dim)}

/* ============ 히어로 — 지면 첫 장 ============ */
.hero{background:none;color:var(--ink);margin:0 calc(-1 * var(--pad));
  padding:104px var(--pad) 76px;border-bottom:1px solid var(--ink)}
.hero .kicker{color:var(--accent)}
.hero h1{font-family:var(--serif);font-size:clamp(34px,5.4vw,66px);line-height:1.07;
  letter-spacing:-.025em;font-weight:300;text-wrap:pretty;max-width:15em}
.hero h1 em,.hero h1 i{font-style:italic;font-weight:400;color:var(--ink)}
.hero .lede{color:var(--body);max-width:640px;margin-top:30px}

/* 영상 히어로(index) — 1b에서는 암부 영상이 아니라 "도판 01"이 된다 */
.herofilm{position:relative;margin:0 calc(-1 * var(--pad));background:none;
  height:auto;overflow:visible;padding:104px var(--pad) 76px;border-bottom:1px solid var(--ink)}
.herofilm>video{display:none}
.herofilm .veil{display:none}
.herofilm .inner{position:relative;height:auto;display:block;padding:0;max-width:1000px;color:var(--ink)}
.herofilm h1{font-family:var(--serif);font-size:clamp(34px,5.4vw,66px);line-height:1.07;
  letter-spacing:-.025em;font-weight:300;text-wrap:pretty}
.herofilm h1 em,.herofilm h1 i{font-style:italic;font-weight:400}
.herofilm .lede{font-size:20px;color:var(--body);max-width:640px;margin-top:30px}
.herofilm .runline{position:static;display:block;margin-top:34px;font-family:var(--mono);
  font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim)}
.axes{margin-top:26px;padding-top:16px;border-top:1px solid var(--line);
  font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--dim);display:flex;gap:18px;flex-wrap:wrap}
.axes i{color:var(--line2);font-style:normal}

/* 원장 스트립 — 4칸. 1b에서는 밝은 지면 위 괘선 격자다 */
.ledger{display:grid;grid-template-columns:repeat(4,1fr);background:none;
  color:var(--ink);margin:0 calc(-1 * var(--pad));border-bottom:1px solid var(--line)}
.ledger>div{padding:30px 32px;border-right:1px solid var(--line)}
.ledger>div:last-child{border-right:none}
.ledger .l{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dim)}
.ledger p{font-size:16px;font-weight:400;margin-top:8px;text-wrap:balance;color:var(--body)}

/* ============ 타이포 ============ */
.kicker{font-family:var(--mono);font-size:11.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--accent);margin-bottom:32px}
h1{font-family:var(--serif);font-size:clamp(32px,4.6vw,52px);line-height:1.1;
  letter-spacing:-.025em;font-weight:300}
h1 em,h1 i{font-style:italic;font-weight:400}
h2.sec{font-family:var(--serif);font-size:clamp(25px,3vw,34px);font-weight:400;
  letter-spacing:-.02em;margin:0 0 24px;max-width:760px;text-wrap:pretty}
h3{font-family:var(--serif);font-size:19px;font-weight:400;letter-spacing:-.01em;margin-bottom:8px}
p{color:var(--body);font-size:16px;line-height:1.7}
.lede{font-size:19px;line-height:1.62;color:var(--body);max-width:640px}
.claim{font-size:19px;line-height:1.55;color:var(--ink)}
.big{font-family:var(--serif);font-size:28px;line-height:1.5;letter-spacing:-.015em;
  color:var(--ink);max-width:760px;font-weight:300;text-wrap:pretty}
.big b{font-weight:400;font-style:italic}
.dim{color:var(--dim)}
.small{font-size:13px}
.center{text-align:center}
.link{color:var(--accent);border-bottom:1px solid rgba(176,67,44,.35)}
.link:hover{border-bottom-color:var(--accent)}
.arrow{transition:transform .18s var(--ease);display:inline-block}

/* ============ 격자·카드 ============ */
.grid{display:grid;gap:0}
.grid.g2{grid-template-columns:repeat(2,1fr)}
.grid.g3{grid-template-columns:repeat(3,1fr)}
.grid.g2>*,.grid.g3>*{border-right:1px solid var(--line);padding:26px}
.grid.g2>*:first-child,.grid.g3>*:first-child{padding-left:0}
.grid.g2>*:last-child,.grid.g3>*:last-child{border-right:none;padding-right:0}
.grid{border-top:1px solid var(--ink)}
.card{background:none;border:none}
.card h3{font-size:17px;font-weight:600;margin-bottom:8px}
.card p{font-size:15px;line-height:1.7;color:var(--body);margin:0}
.card .ptag,.ptag{font-family:var(--mono);font-size:11px;color:var(--accent);
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.lift{transition:opacity .18s var(--ease)}
.lift:hover{opacity:.86}

/* 통계 */
.stat .v,.statv{font-size:36px;font-weight:600;letter-spacing:-.03em;line-height:1;color:var(--ink)}
.stat .l,.statl{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--dim);margin-top:8px;max-width:180px}
.statbox{flex:none;padding-left:44px;border-left:1px solid var(--line)}

/* ============ 영상·도판 ============ */
.clip{border:1px solid var(--line);background:var(--panel);margin:0 0 18px}
.clip video,.clip img{width:100%;display:block}
.clip .proof{display:flex;align-items:center;gap:12px;padding:12px 18px;
  border-bottom:1px solid var(--line);flex-wrap:wrap}
.clip .proof .n{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);padding:3px 9px}
.clip .proof .t{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--body)}
.clip .cap,.cap{font-size:14px;line-height:1.65;color:var(--body);padding:14px 18px;
  border-top:1px solid var(--line)}
.clip.soon{background:var(--panel2)}
.clip .ph,.ph{aspect-ratio:21/9;display:flex;align-items:center;justify-content:center;
  background:var(--panel2);font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:#A9A69C;text-align:center;padding:20px}
.tag{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--dim);border:1px solid var(--line2);padding:3px 9px}

/* 도판 그리드 */
.figrow{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.figs3{display:grid;grid-template-columns:1.45fr 1fr 1fr;gap:26px;align-items:start}
figure,.fig{margin:0}
.figbox{height:300px;display:flex;align-items:center;justify-content:center;
  border-top:1px solid var(--ink);border-bottom:1px solid var(--line2);padding:20px 0}
.figbox img{max-width:100%;max-height:100%;object-fit:contain}
.fig img{width:100%;display:block;border:1px solid var(--line);background:var(--panel)}
figcaption .fn,.fc{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--accent);margin-top:12px}
figcaption p{font-size:14px;line-height:1.65;color:var(--body);margin-top:8px}
.fc{margin-top:10px}

/* ============ 단계(steps)·연표(tl) ============ */
.steps{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.step{padding:26px;border-right:1px solid var(--line);counter-increment:st}
.step:first-child{padding-left:0}
.step:last-child{border-right:none;padding-right:0}
.step h3{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:.14em;
  text-transform:uppercase;font-weight:500;margin-bottom:10px}
.step p{font-size:15px;line-height:1.65;color:var(--body)}
.steps.s4{grid-template-columns:repeat(4,1fr)}
.tl{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink)}
.tl .node{padding:26px;border-right:1px solid var(--line)}
.tl .node:first-child{padding-left:0}
.tl .node:last-child{border-right:none;padding-right:0}
.tl .when{display:block;font-family:var(--mono);font-size:11px;color:var(--accent);
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:10px}
.tl .node h3{font-size:17px;margin-bottom:8px}
.tl .node p{font-size:15px;line-height:1.7}

/* ============ 논문(paper) ============ */
.paper{display:flex;gap:32px;align-items:flex-start;padding:28px 0;border-top:1px solid var(--line)}
.paper:first-of-type{border-top:1px solid var(--ink)}
.paper .badge{flex:none;font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--accent);border:1px solid var(--accent);
  padding:3px 9px;margin-top:4px}
.paper h3{font-size:19px;line-height:1.4;margin-bottom:6px;max-width:720px}
.paper .meta{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;
  color:var(--dim);margin-bottom:12px}
.paper .links{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;
  color:var(--dim);margin-top:12px}

/* ============ 알림·투명성 ============ */
.notice{border-left:2px solid var(--accent);background:var(--panel2);padding:14px 18px;
  font-size:14px;line-height:1.65;color:var(--body);margin-top:20px}
.transp{border:1px solid var(--ink);padding:26px;background:var(--panel)}
.transp h3{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:12px}

/* ============ 폼 ============ */
.btn{display:inline-block;background:var(--accent);color:var(--bg);border:none;
  font-family:var(--sans);font-size:14px;font-weight:600;padding:14px 28px;cursor:pointer;
  transition:filter .18s var(--ease)}
.btn:hover{filter:brightness(1.12)}
.btn:disabled{background:var(--line);color:var(--dim);cursor:not-allowed;filter:none}
.btn.ghost{background:none;border:1px solid var(--ink);color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--bg);filter:none}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.emailform{display:flex;gap:0;max-width:520px;margin-top:16px;border:1px solid var(--ink)}
.emailform input{flex:1;border:none;background:var(--panel);padding:14px 16px;
  font-family:var(--sans);font-size:14px;color:var(--ink)}
.emailform input:focus{outline:2px solid var(--accent);outline-offset:-2px}
.emailform .btn{border-radius:0}
.formmsg{font-size:13.5px;margin-top:10px;min-height:1em}
.formnote{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--dim);margin-top:10px}
select,input[type=text],input[type=email]{font-family:var(--sans);font-size:14px;
  border:1px solid var(--line);background:var(--panel);padding:10px 12px;color:var(--ink);border-radius:0}
label{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--dim)}
.dropzone{border:1px dashed var(--line2);background:var(--panel2);padding:56px 24px;
  text-align:center}
.dropzone .big{font-size:20px;color:var(--ink);margin-bottom:6px}
.dropzone .small{font-family:var(--mono);font-size:11px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--dim)}

/* ============ 뷰어 ============ */
.viewerwrap{position:relative;aspect-ratio:16/9;background:var(--dark)}
.viewerframe{position:absolute;inset:0;width:100%;height:100%;border:0;opacity:0;
  transition:opacity .4s var(--ease)}
.viewerwrap.loaded .viewerframe{opacity:1}
.viewerwrap.loaded .viewer-holder{opacity:0;pointer-events:none}
.viewer-holder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  transition:opacity .4s var(--ease)}
.viewer-holder .pt{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dimd)}
.viewer-ph{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;
  background:var(--panel2);font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:#A9A69C;text-align:center;padding:20px}

/* 미리보기 카드(pv) */
.pv{display:block;border:1px solid var(--line);background:var(--panel);
  transition:border-color .18s var(--ease)}
.pv:hover{border-color:var(--accent)}
.pv:hover .arrow{transform:translateX(4px)}
.thumb{position:relative;aspect-ratio:16/9;background:var(--dark);display:flex;
  align-items:center;justify-content:center}
.thumb.light{background:var(--panel2)}
.thumb .glyph{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dimd)}
.thumb.light .glyph{color:#A9A69C}
.thumb .play{position:absolute;right:14px;bottom:12px;color:var(--accentD);font-size:15px}
.pvcap{padding:14px 18px;border-top:1px solid var(--line)}
.pvcap b{display:block;font-size:15px;font-weight:600;color:var(--ink);margin-bottom:4px}
.pvcap span{font-size:14px;line-height:1.65;color:var(--body)}
.plan{padding:26px;border-right:1px solid var(--line)}
.plan:last-child{border-right:none}

/* 관찰 목록 */
.obs{list-style:none;border-top:1px solid var(--ink)}
.obs li{display:flex;gap:32px;align-items:flex-start;padding:22px 0;
  border-bottom:1px solid var(--line)}
.obs .k{flex:none;width:var(--rail);font-family:var(--mono);font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--accent);padding-top:3px}
.obs p{flex:1;margin:0}
.backlink{display:inline-block;margin-top:40px;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}

/* ============ 연구자 소개(bio) — v3.6, 2026-09-16 ============ */
.bio{display:flex;gap:56px;align-items:flex-start;
  border-top:1px solid var(--ink);padding-top:30px;
  border-bottom:1px solid var(--ink);padding-bottom:15px}
.bio .who{flex:none;width:290px}
.bio .who .nm{font-family:var(--serif);font-size:32px;line-height:1.14;
  letter-spacing:-.02em;color:var(--ink);font-weight:400}
.bio .who .nm span{display:block;font-family:var(--mono);font-size:11.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--dim);margin-top:12px}
.bio .who .rl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent);margin-top:20px;line-height:1.75}
.bio .cv{flex:1;min-width:0;list-style:none}
.bio .cv li{padding:9px 0;border-bottom:1px solid var(--line)}
.bio .cv li:first-child{padding-top:0}
.bio .cv li:last-child{border-bottom:none}
.bio .cv p{margin:0;font-size:16.5px;line-height:1.45;color:var(--ink)}

/* ============ 마무리 띠·푸터 ============ */
.endcta{margin:88px calc(-1 * var(--pad)) 0;padding:70px var(--pad);
  border-top:1px solid var(--line);display:flex;justify-content:space-between;
  align-items:center;gap:40px;flex-wrap:wrap}
.endcta .t{font-size:28px;font-weight:500;letter-spacing:-.02em;color:var(--ink)}
.endcta .s{font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim);margin-top:10px}
footer{padding:26px var(--pad);border-top:1px solid var(--line);font-family:var(--mono);
  font-size:11px;letter-spacing:.1em;color:var(--dim);display:flex;
  justify-content:space-between;gap:20px;flex-wrap:wrap;max-width:1280px;margin:0 auto}
footer a{color:var(--accent)}

/* ============ 스크롤 등장 ============ */
.reveal{opacity:0;transform:translateY(14px);
  transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* ============ 반응형 ============ */
@media (max-width:1080px){
  .figs3{grid-template-columns:1fr 1fr}
  .figs3>figure:first-child{grid-column:1 / -1}
  .ledger{grid-template-columns:repeat(2,1fr)}
  .ledger>div:nth-child(2){border-right:none}
  .ledger>div:nth-child(-n+2){border-bottom:1px solid var(--lineDark)}
}
@media (max-width:860px){
  :root{--pad:22px;--rail:100%}
  .act{flex-direction:column;gap:20px}
  .act>.actno{width:auto;padding-top:0}
  .wrap>section{padding-top:56px;margin-top:56px}
  .herofilm{height:520px}
  .grid.g2,.grid.g3,.steps,.steps.s4,.tl,.figrow,.figs3{grid-template-columns:1fr}
  .grid.g2>*,.grid.g3>*,.step,.tl .node,.plan{border-right:none;
    border-bottom:1px solid var(--line);padding:22px 0}
  .grid.g2>*:last-child,.grid.g3>*:last-child,.step:last-child,.tl .node:last-child,
  .plan:last-child{border-bottom:none}
  .figs3>figure:first-child{grid-column:auto}
  .paper{flex-direction:column;gap:12px}
  .obs li{flex-direction:column;gap:8px}
  .obs .k{width:auto}
  .bio{flex-direction:column;gap:28px}
  .bio .who{width:auto}
  .bio .who .nm{font-size:28px}
  .statbox{padding-left:0;border-left:none;border-top:1px solid var(--line);
    padding-top:16px;margin-top:16px}
  .endcta{margin-top:56px;padding:44px var(--pad)}
  /* 모바일 내비 */
  .navtoggle{display:block}
  nav{flex-wrap:wrap;gap:0;padding:16px var(--pad)}
  nav .navlinks{display:none;width:100%;flex-direction:column;align-items:flex-start;
    gap:16px;margin:18px 0 4px}
  nav .navlinks.open{display:flex}
  nav .cta{align-self:flex-start}
  nav .spacer{display:none}
}

/* ---- v3.2 보정 (실화면 캡처로 잡은 것) ---- */
/* .big 은 본문 대문장용이라 폭이 묶여 있다 — 드롭존 안에서는 풀어 가운데 정렬 유지 */
.dropzone .big{max-width:none}
/* 샌드박스 방 선택 목록 — .card 에 테두리를 뺀 뒤 눌림 대상이 안 보이던 문제 */
.picklist{display:flex;flex-direction:column;gap:10px}
.picklist button{border:1px solid var(--line);background:var(--panel);padding:16px 18px;
  width:100%;text-align:left;cursor:pointer;font-family:inherit;
  transition:border-color .18s var(--ease)}
.picklist button:hover{border-color:var(--accent)}
.picklist button h3{font-size:15px;margin:0}
.picklist button p{margin-top:4px;font-size:13.5px}


/* ============================================================
   KO 조판 레이어 — 2026-08-20 R1
   문제: (a) 한글이 낱말 한가운데서 잘려 줄바꿈됐다("아/무도", "인/상을")
        (b) mono 라벨의 넓은 자간(.13~.24em)이 한글에 그대로 걸려 자간이 벌어졌다
        (c) 라틴용 음수 자간(-.03em)·좁은 행간(1.06)이 한글 제목을 뭉개고 있었다
   ============================================================ */

/* (a) 어절 단위 줄바꿈 — 언어 무관 전역.
       영문은 원래 공백에서만 끊기므로 손해가 없고, 한글만 낱말이 보존된다. */
h1,h2,h3,h4,h5,p,li,figcaption,blockquote,dd,dt,td,th,
.lede,.big,.claim,.cap,.axes,.ledger p,.pvcap,.pvcap span,.notice,.formnote,
.statl,.fc,.fn,.meta,.small,.dim,.ptag,.tag,.kicker,.actno,.endcta .t,.endcta .s,
label,button,select,option,a{
  word-break:keep-all;
  overflow-wrap:break-word;
}
/* 긴 URL·식별자는 예외적으로 끊는다 */
code,kbd,samp,.mono,.links{overflow-wrap:anywhere}

/* ============ 이하 한국어일 때만 (i18n.js 가 <html lang> 을 갱신한다) ============ */

/* (c) 제목 — 라틴용 음수 자간을 풀고 행간을 한글에 맞춘다 */
html[lang="ko"] h1,
html[lang="ko"] .hero h1,
html[lang="ko"] .herofilm h1{letter-spacing:-.005em;line-height:1.24;font-weight:700}
html[lang="ko"] h2.sec{letter-spacing:-.005em;line-height:1.36;font-weight:600}
html[lang="ko"] h3{letter-spacing:0;line-height:1.45}
html[lang="ko"] .big{letter-spacing:-.005em;line-height:1.56;font-size:26px}
html[lang="ko"] .endcta .t{letter-spacing:-.005em;line-height:1.4}

/* 본문 — 한글은 라틴보다 행간이 넓어야 읽힌다 */
html[lang="ko"] body{line-height:1.75}
html[lang="ko"] p{line-height:1.8;font-size:15.5px}
html[lang="ko"] .lede{line-height:1.78}
html[lang="ko"] .ledger p{line-height:1.65;font-size:15px}

/* (b) mono 라벨 — 한글이 섞이면 넓은 자간이 흉해진다. 자간만 좁히고 서체는 유지 */
html[lang="ko"] .kicker{letter-spacing:.06em}
html[lang="ko"] .actno,
html[lang="ko"] .ptag,
html[lang="ko"] .tag,
html[lang="ko"] .ledger .l,
html[lang="ko"] .axes,
html[lang="ko"] .herofilm .runline,
html[lang="ko"] .statl,
html[lang="ko"] .fc,
html[lang="ko"] figcaption .fn,
html[lang="ko"] .step h3,
html[lang="ko"] .tl .when,
html[lang="ko"] .paper .badge,
html[lang="ko"] .paper .meta,
html[lang="ko"] .paper .links,
html[lang="ko"] .transp h3,
html[lang="ko"] .clip .proof .n,
html[lang="ko"] .clip .proof .t,
html[lang="ko"] label,
html[lang="ko"] .formnote,
html[lang="ko"] .dropzone .small,
html[lang="ko"] .viewer-holder .pt,
html[lang="ko"] .thumb .glyph,
html[lang="ko"] .obs .k,
html[lang="ko"] .backlink,
html[lang="ko"] .endcta .s,
html[lang="ko"] footer,
html[lang="ko"] nav .navlinks,
html[lang="ko"] nav .cta,
html[lang="ko"] .ph{letter-spacing:.03em}

/* 한글은 대문자 변환이 없으므로 라벨이 유난히 작아 보인다 — 반 급 키운다 */
html[lang="ko"] .ledger .l,
html[lang="ko"] .statl,
html[lang="ko"] .fc,
html[lang="ko"] figcaption .fn,
html[lang="ko"] .obs .k{font-size:11.5px}
html[lang="ko"] .axes{font-size:12px;gap:14px}
html[lang="ko"] nav .navlinks{font-size:13px;letter-spacing:.04em}

/* 좌측 번호 레일 — "01 — 문제" 처럼 짧은 한글이라 레일을 줄여 본문을 넓힌다 */
html[lang="ko"] .act{gap:44px}
html[lang="ko"] .act>.actno{width:132px}

/* 한글 굵은 글씨는 합성 굵기가 지저분하다 — 색으로 강조를 대신한다 */
html[lang="ko"] .big b{font-weight:700;color:var(--accent)}

/* ============================================================
   v3.3 레이어 — 2026-08-20
   ① mono 라벨 감량: 화면당 10~20개였던 모노스페이스 라벨을 구조 표식
      (kicker·actno·runline·proof.n·etag)만 남기고 전부 sans 로 내렸다.
      sans 로 내린 라벨은 넓은 자간을 걷고 굵기(600)로 위계를 만든다.
      → 이 조치가 R2 P0(모노 폰트에서 한글 어절 공백이 벌어지던 결함)도 함께 없앤다.
   ② 폰트 웨이트 2종(400·600)으로 제한. 500·700 사용처를 전부 옮겼다.
   ③ 신설 컴포넌트: 검증 스트립(.vstrip) · 연구 연표(.era) · 샌드박스 레버(.lv*)
   ============================================================ */

/* ── ① mono → sans 강등 ───────────────────────────────── */
nav .navlinks a,nav .cta,nav .langbtn,nav .logo,
.ledger .l,.ptag,.card .ptag,.stat .l,.statl,.tag,
figcaption .fn,.fc,.step h3,.tl .when,.transp h3,
.paper .meta,.paper .links,.clip .proof .t,
.ph,.viewer-holder .pt,.viewer-ph,.thumb .glyph,.obs .k,.backlink,
.endcta .s,footer,.formnote,.dropzone .small,label,.axes{
  font-family:var(--sans);
}
.ledger .l,.ptag,.card .ptag,.statl,.stat .l,.tag,figcaption .fn,.fc,
.step h3,.tl .when,.transp h3,.obs .k,label,.dropzone .small{
  letter-spacing:.04em;font-weight:600;font-size:11.5px;text-transform:uppercase;
}
.clip .proof .t,.paper .meta,.paper .links,.formnote,.endcta .s,.backlink,
.viewer-holder .pt,.thumb .glyph,.ph,.viewer-ph{
  letter-spacing:.01em;text-transform:none;font-weight:400;font-size:13px;
}
.endcta .s,.backlink{font-weight:600}
footer{letter-spacing:.01em;font-size:13px;text-transform:none}
nav .navlinks a,nav .cta,nav .langbtn{letter-spacing:.02em;font-size:13.5px;text-transform:none}
nav .logo{letter-spacing:.08em;font-size:13px}
.axes{letter-spacing:.02em;font-size:13px;text-transform:none}
.formnote{color:var(--dim);line-height:1.7}

/* ── ② 웨이트 2종(400·600) ────────────────────────────── */
.actno b,h2.sec,.step h3,.endcta .t,.ledger p{font-weight:600}
.ledger p{font-weight:400}
html[lang="ko"] h1,
html[lang="ko"] .hero h1,
html[lang="ko"] .herofilm h1{font-weight:600}
html[lang="ko"] h2.sec{font-weight:600}
html[lang="ko"] .big b{font-weight:600;color:var(--accent)}

/* ── 히어로 다이어트 ──────────────────────────────────── */
.herofilm{min-height:none}
.herofilm .lede{max-width:520px}
.axes.light{margin-top:22px;padding:14px 0 0;border-top:1px solid var(--line);
  display:flex;gap:18px;flex-wrap:wrap;color:var(--dim)}
.axes.light i{color:var(--line2)}

/* ── 원장 스트립 (히어로 아래) — 방법을 이루는 네 요소 ── */
.ledger.vstrip>div{padding:26px 30px}
.ledger.vstrip .l{color:var(--accent)}
.ledger.vstrip p{font-size:14.5px;line-height:1.6;margin-top:10px;color:var(--onDarkDim);
  font-weight:400}
/* 방법 섹션 안으로 내려온 원장 — 암부가 아니라 밝은 면에 놓인다 */
.ledger.flat{background:none;color:var(--ink);margin:34px 0 0;
  border-top:1px solid var(--ink)}
.ledger.flat>div{padding:22px 24px 0;border-right:1px solid var(--line)}
.ledger.flat>div:first-child{padding-left:0}
.ledger.flat>div:last-child{border-right:none;padding-right:0}
.ledger.flat .l{color:var(--accent)}
.ledger.flat p{color:var(--body);font-size:15px;line-height:1.7}

/* ── ③ 연구 연표 (Research) ───────────────────────────── */
.tlwrap{padding-top:20px}
.era{display:flex;gap:48px;align-items:flex-start;
  padding:44px 0;border-top:1px solid var(--line)}
.era:first-of-type{border-top:1px solid var(--ink)}
.eyear{width:150px;flex:none;font-size:26px;font-weight:600;letter-spacing:-.02em;
  color:var(--ink);padding-top:2px}
.etag{display:block;margin-top:10px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--dim);
  border:1px solid var(--line2);padding:3px 7px;width:max-content;max-width:100%}
.etag.on{color:var(--accent);border-color:var(--accent)}
.etag.prep{color:var(--body);border-color:var(--line2)}
.etag.next{color:var(--dim);border-style:dashed}
.ebody{flex:1;min-width:0}
.ebody>h3{font-size:23px;font-weight:600;line-height:1.35;letter-spacing:-.015em;
  max-width:660px;margin-bottom:12px}
.esrc{font-size:14px;line-height:1.65;color:var(--body);max-width:660px}
.esrc .emeta{color:var(--dim);font-size:13px}
.ecol{display:grid;grid-template-columns:1fr 1fr;gap:38px;margin-top:26px;
  border-top:1px solid var(--line);padding-top:20px}
.ek{font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent);margin-bottom:8px}
.ecol p{font-size:15px;line-height:1.72;color:var(--body);max-width:46em}
.efigs{margin-top:30px}
.efigs .figbox{height:230px}
.schema{margin-top:26px;max-width:660px}
.schema svg{width:100%;height:auto;background:var(--panel);border:1px solid var(--line);
  padding:10px}
.schema figcaption{margin-top:8px}

/* ── ③ 샌드박스 레버 보드 ─────────────────────────────── */
.lvwrap{display:grid;grid-template-columns:300px 1fr;gap:44px;align-items:start;
  border-top:1px solid var(--ink);padding-top:26px}
.lever{padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid var(--line)}
.lever:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.lvk{font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;
  color:var(--accent);margin-bottom:10px}
.lvopts{display:flex;flex-direction:column;gap:0;border:1px solid var(--line)}
.lvo{background:var(--panel);border:none;border-bottom:1px solid var(--line);
  font-family:var(--sans);font-size:14px;color:var(--body);text-align:left;
  padding:10px 13px;cursor:pointer;transition:background .16s var(--ease)}
.lvo:last-child{border-bottom:none}
.lvo:hover{background:var(--panel2)}
.lvo.on{background:var(--ink);color:var(--bg);font-weight:600}
.lvwhy{font-size:13.5px;line-height:1.65;color:var(--dim);margin-top:10px}
.lvout{min-width:0}
.lvgrid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.lvcell{aspect-ratio:1;border:1px solid var(--line);background:var(--panel2);
  color:var(--dim);font-size:12px;cursor:pointer;display:flex;
  align-items:center;justify-content:center;transition:border-color .16s var(--ease)}
.lvcell:hover{border-color:var(--line2)}
.lvcell.on{border-color:var(--accent);background:var(--panel);color:var(--accent);
  font-weight:600}
.lvpanel{margin-top:22px;border-top:1px solid var(--ink);padding-top:20px}
.lvsel{font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.lvstats{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:20px 0 4px}
.lvstats .k{font-size:11.5px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:var(--dim)}
.lvstats .v{font-size:30px;font-weight:600;color:var(--line2);margin-top:6px;line-height:1}
/* ── 한 줄 글자수 상한 (R2 P1) ───────────────────────── */
.ecol p,.esrc,.lvwhy{max-width:44em}
html[lang="ko"] .ecol p,html[lang="ko"] .esrc{max-width:30em}
html[lang="ko"] .ebody>h3{letter-spacing:0;line-height:1.45;font-size:21px}
html[lang="ko"] .lvsel{letter-spacing:0}
html[lang="ko"] .ledger.vstrip p{font-size:14px;line-height:1.7}
html[lang="ko"] .etag{letter-spacing:.03em}
/* sans 로 내린 라벨은 KO 에서 자간 보정이 더 필요없다 — 값을 하나로 정리한다 */
html[lang="ko"] .ledger .l,html[lang="ko"] .ptag,html[lang="ko"] .statl,
html[lang="ko"] .fc,html[lang="ko"] figcaption .fn,html[lang="ko"] .step h3,
html[lang="ko"] .tl .when,html[lang="ko"] .obs .k,html[lang="ko"] label,
html[lang="ko"] .lvk,html[lang="ko"] .ek,html[lang="ko"] .lvstats .k,
html[lang="ko"] .dropzone .small{letter-spacing:0;font-size:12px}
html[lang="ko"] .formnote,html[lang="ko"] .clip .proof .t,
html[lang="ko"] .paper .meta,html[lang="ko"] .endcta .s,
html[lang="ko"] footer,html[lang="ko"] .axes{letter-spacing:0}

@media (max-width:1080px){
  .lvwrap{grid-template-columns:1fr;gap:28px}
  .ecol{grid-template-columns:1fr;gap:22px}
}
@media (max-width:860px){
  .era{flex-direction:column;gap:16px}
  .eyear{width:auto;display:flex;align-items:center;gap:12px}
  .etag{margin-top:0}
  .ledger.vstrip,.ledger.flat{grid-template-columns:repeat(2,1fr)}
  .lvstats{grid-template-columns:1fr}
}


/* ============================================================
   v3.4 — 1b "Journal" 레이어 (2026-08-20)
   v3.3에서 라벨을 전부 산스로 내렸었다. 1b에서는 그 판단을 뒤집는다.
   1b의 문법은 "세리프 본문 + 모노 표식"이고, 모노가 사라지면 지면이
   그냥 밋밋한 산스 문서가 된다. 다만 v3.3에서 잡은 국문 결함
   (모노에서 한글 어절 공백이 벌어지던 것)은 그대로 지켜야 하므로
   ── 영문일 때만 모노, 한국어일 때는 산스 ── 로 갈라 둔다.
   ============================================================ */

/* ── 표식(라벨) : 영문 모노 ─────────────────────────────── */
nav .logo,nav .navlinks a,nav .cta,nav .langbtn,
.ledger .l,.ptag,.card .ptag,.stat .l,.statl,.tag,
figcaption .fn,.fc,.step h3,.tl .when,.transp h3,
.paper .meta,.paper .links,.paper .badge,.clip .proof .t,.clip .proof .n,
.ph,.viewer-holder .pt,.viewer-ph,.thumb .glyph,.obs .k,.backlink,
.endcta .s,footer,.formnote,.dropzone .small,label,.axes,
.ek,.lvk,.lvstats .k,.etag,.plateno,.cap,.clip .cap{
  font-family:var(--mono);
}
.ledger .l,.ptag,.card .ptag,.statl,.stat .l,.tag,figcaption .fn,.fc,
.step h3,.tl .when,.transp h3,.obs .k,label,.dropzone .small,
.ek,.lvk,.lvstats .k,.etag,.plateno{
  letter-spacing:.16em;font-weight:400;font-size:11px;text-transform:uppercase;
}
.clip .proof .t,.paper .meta,.paper .links,.formnote,.endcta .s,.backlink,
.viewer-holder .pt,.thumb .glyph,.ph,.viewer-ph,.cap,.clip .cap{
  letter-spacing:.04em;text-transform:none;font-weight:400;font-size:12.5px;
}
.cap,.clip .cap{font-size:12.5px;line-height:1.7;color:var(--body)}
footer{letter-spacing:.1em;font-size:11px;text-transform:uppercase}
.axes{letter-spacing:.14em;font-size:11px;text-transform:uppercase}
.endcta .s{letter-spacing:.1em;text-transform:uppercase;font-size:11px}
.backlink{letter-spacing:.12em;text-transform:uppercase;font-size:11.5px}

/* ── 본문·제목 : 세리프 ─────────────────────────────────── */
.card h3,.tl .node h3,.paper h3,.step p,.card p,.ecol p,.esrc,.lvwhy,.lvsel,
.pvcap b,.pvcap span,.obs p,.notice,.lede,.big,.claim,figcaption p,
.endcta .t,.transp p,.ebody>h3,.dropzone .big,.lvo{
  font-family:var(--serif);
}
.card h3{font-size:19px;font-weight:400}
.endcta .t{font-family:var(--serif);font-size:30px;font-weight:300;letter-spacing:-.02em}
.pvcap b{font-size:17px;font-weight:400}
.pvcap span{font-size:15px}
.notice{font-size:15px;background:none;border-left:2px solid var(--accent);
  padding:4px 0 4px 18px;color:var(--body)}
.transp{border:none;border-top:1px solid var(--ink);background:none;padding:22px 0 0}
.stat .v,.statv{font-family:var(--serif);font-size:46px;font-weight:300;letter-spacing:-.03em}
.statbox{padding-left:36px;border-left:1px solid var(--line)}
.grid{border-top:1px solid var(--ink)}
.figbox{border-top:1px solid var(--ink)}

/* ── 도판 블록(.plate) — 1b의 "PLATE 01" 구조 ───────────── */
.plate{display:flex;gap:44px;align-items:flex-start;
  padding:34px 0;border-bottom:1px solid var(--line)}
.plate>.plateno{width:var(--rail);flex:none;color:var(--dim);padding-top:3px}
.plate>.platebody{flex:1;min-width:0}
.plate .pcap{font-family:var(--mono);font-size:12.5px;letter-spacing:.05em;
  color:var(--ink);margin-bottom:20px;line-height:1.6}
.plate video,.plate img{width:100%;display:block;border:1px solid var(--line)}

/* ── 버튼 ────────────────────────────────────────────────── */
.btn{font-family:var(--mono);font-size:12.5px;font-weight:400;letter-spacing:.1em;
  text-transform:uppercase;padding:15px 28px}
.btn.ghost{background:none;border:1px solid var(--ink);color:var(--ink)}
.emailform input,select,input[type=text],input[type=email]{font-family:var(--serif);font-size:16px}

/* ── 뷰어 — 암부 바탕을 걷는다 ──────────────────────────── */
.viewerwrap{background:var(--panel2)}
.thumb{background:var(--panel2)}
.thumb .glyph{color:#9B9C97}
.thumb .play{color:var(--accent)}
.viewer-holder .pt{color:#9B9C97}
/* 사례 뷰어 축소판 — 3D 원본 화질이 지면 폭을 감당하지 못한다(v3.4 조치) */
.viewersm .viewerwrap{aspect-ratio:16/9}
/* v3.6 — 뷰어 오른쪽에 남던 빈 여백을 없앤다. 좁은 창(760px)에서는 뷰어 안의
   재생 막대와 층 선택이 서로를 밀어내 개발화면처럼 보였다. 기본은 본문 폭 전체,
   '넓게 보기'를 누르면 좌측 레일까지 먹고 지면 폭 전체로 벌어진다. */
.viewersm{max-width:none}
.viewwide{margin-left:auto;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--dim);border:1px solid var(--line2);
  background:none;padding:4px 10px;cursor:pointer;transition:color .18s var(--ease),border-color .18s var(--ease)}
.viewwide:hover{color:var(--accent);border-color:var(--accent)}
.viewwide .w1{display:none}
.clip.wide .viewwide .w0{display:none}
.clip.wide .viewwide .w1{display:inline}
.clip.wide{margin-left:calc(-1 * (var(--rail) + 44px));margin-top:26px}
/* 레일로 파고들면 그 자리에 있던 절 번호·태그와 겹친다 — 아래로 한 칸 내려 피한다 */
.clip.wide .viewerwrap{aspect-ratio:21/9}
html[lang="ko"] .clip.wide{margin-left:calc(-1 * (132px + 44px))}
@media (max-width:860px){
  .clip.wide,html[lang="ko"] .clip.wide{margin-left:0}
  .clip.wide .viewerwrap{aspect-ratio:16/9}
}

/* ── 연구 연표 — 연도를 걷고 도판번호로 대신한다 ─────────── */
.era{gap:44px;padding:48px 0}
.eyear{width:var(--rail);font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:400;color:var(--dim);padding-top:6px}
.etag{margin-top:12px;border:none;padding:0;color:var(--accent);letter-spacing:.14em}
.etag.on{color:var(--accent);border:none}
.etag.prep{color:var(--body);border:none}
.etag.next{color:var(--dim);border:none;font-style:normal}
.ebody>h3{font-size:27px;font-weight:300;line-height:1.28;letter-spacing:-.02em;
  max-width:16em;margin-bottom:16px}
.esrc{font-size:15px;line-height:1.7}
.ecol p{font-size:16px;line-height:1.72}
.ek{color:var(--accent)}

/* ── 샌드박스 레버 ───────────────────────────────────────── */
.lvo{font-size:16px;background:none}
.lvo.on{background:var(--ink);color:var(--bg);font-weight:400}
.lvsel{font-family:var(--serif);font-size:22px;font-weight:300;letter-spacing:-.015em}
.lvstats .v{font-family:var(--serif);font-size:34px;font-weight:300}
.lvcell{background:none;font-family:var(--mono);font-size:11px}
.lvcell.on{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.lvread{font-family:var(--serif);font-size:16px;line-height:1.75;color:var(--body);
  margin-top:16px;max-width:44em}

/* ── 절 구분 괘선 ────────────────────────────────────────── */
.wrap>section{padding-top:76px;margin-top:0;border-top:none;border-bottom:1px solid var(--line);
  padding-bottom:76px}
.wrap>section:last-of-type{border-bottom:none}
.wrap>section:first-of-type{padding-top:76px}
.endcta{border-top:1px solid var(--ink);margin-top:0;padding:70px var(--pad)}

/* ============================================================
   국문 — 라틴 세리프에는 한글이 없다. 제목만 한글 세리프로 갈고
   본문·표식은 산스로 되돌린다(v3.3에서 잡은 어절 결함 유지).
   ============================================================ */
html[lang="ko"] h1,html[lang="ko"] .hero h1,html[lang="ko"] .herofilm h1,
html[lang="ko"] h2.sec,html[lang="ko"] .ebody>h3,html[lang="ko"] .big,
html[lang="ko"] .endcta .t,html[lang="ko"] .lvsel{
  font-family:var(--serifKO);font-weight:400;letter-spacing:-.01em;
}
html[lang="ko"] h1,html[lang="ko"] .hero h1,html[lang="ko"] .herofilm h1{
  line-height:1.3;font-size:clamp(29px,4.2vw,46px)}
html[lang="ko"] h2.sec{line-height:1.4;font-size:clamp(23px,2.6vw,29px)}
html[lang="ko"] .ebody>h3{line-height:1.45;font-size:23px;font-weight:400}
html[lang="ko"] .big{line-height:1.62;font-size:24px}
html[lang="ko"] .endcta .t{line-height:1.42;font-size:26px}
html[lang="ko"] .big b{font-weight:400;font-style:normal;color:var(--accent)}
html[lang="ko"] h1 em,html[lang="ko"] h1 i,
html[lang="ko"] .hero h1 em,html[lang="ko"] .hero h1 i{font-style:normal;color:var(--accent)}

/* 본문·카드 제목·표식 — 한글 산스 */
html[lang="ko"] body,html[lang="ko"] p,html[lang="ko"] .lede,html[lang="ko"] .claim,
html[lang="ko"] h3,html[lang="ko"] .card h3,html[lang="ko"] .tl .node h3,
html[lang="ko"] .paper h3,html[lang="ko"] .ecol p,html[lang="ko"] .esrc,
html[lang="ko"] .lvwhy,html[lang="ko"] .lvo,html[lang="ko"] .lvread,
html[lang="ko"] .pvcap b,html[lang="ko"] .pvcap span,html[lang="ko"] .obs p,
html[lang="ko"] .notice,html[lang="ko"] figcaption p,html[lang="ko"] .transp p,
html[lang="ko"] .step p,html[lang="ko"] .card p,html[lang="ko"] .dropzone .big,
html[lang="ko"] .emailform input,html[lang="ko"] select,
html[lang="ko"] input[type=text],html[lang="ko"] input[type=email]{
  font-family:var(--sans);
}
html[lang="ko"] p{font-size:15.5px;line-height:1.8}
html[lang="ko"] .lede{font-size:17.5px;line-height:1.78}
html[lang="ko"] .card h3,html[lang="ko"] h3{font-size:17px;font-weight:600;line-height:1.5}
html[lang="ko"] .ebody>h3{letter-spacing:-.005em}

/* 표식 — 한국어는 산스 + 자간 0 (모노에서 한글 어절이 벌어지는 결함 회피) */
html[lang="ko"] .ledger .l,html[lang="ko"] .ptag,html[lang="ko"] .card .ptag,
html[lang="ko"] .statl,html[lang="ko"] .tag,html[lang="ko"] figcaption .fn,
html[lang="ko"] .fc,html[lang="ko"] .step h3,html[lang="ko"] .tl .when,
html[lang="ko"] .transp h3,html[lang="ko"] .obs .k,html[lang="ko"] label,
html[lang="ko"] .dropzone .small,html[lang="ko"] .ek,html[lang="ko"] .lvk,
html[lang="ko"] .lvstats .k,html[lang="ko"] .etag,html[lang="ko"] .eyear,
html[lang="ko"] .plateno,html[lang="ko"] .kicker,html[lang="ko"] .actno,
html[lang="ko"] .axes,html[lang="ko"] .endcta .s,html[lang="ko"] footer,
html[lang="ko"] nav .navlinks a,html[lang="ko"] nav .cta,html[lang="ko"] nav .langbtn,
html[lang="ko"] .clip .proof .t,html[lang="ko"] .clip .proof .n,
html[lang="ko"] .cap,html[lang="ko"] .clip .cap,html[lang="ko"] .plate .pcap,
html[lang="ko"] .formnote,html[lang="ko"] .paper .meta,html[lang="ko"] .paper .links,
html[lang="ko"] .paper .badge,html[lang="ko"] .backlink,html[lang="ko"] .ph,
html[lang="ko"] .viewer-ph,html[lang="ko"] .viewer-holder .pt,html[lang="ko"] .thumb .glyph{
  font-family:var(--sans);letter-spacing:0;
}
html[lang="ko"] .ledger .l,html[lang="ko"] .ptag,html[lang="ko"] .statl,
html[lang="ko"] .fc,html[lang="ko"] figcaption .fn,html[lang="ko"] .step h3,
html[lang="ko"] .tl .when,html[lang="ko"] .obs .k,html[lang="ko"] label,
html[lang="ko"] .ek,html[lang="ko"] .lvk,html[lang="ko"] .lvstats .k,
html[lang="ko"] .eyear,html[lang="ko"] .plateno,html[lang="ko"] .etag,
html[lang="ko"] .transp h3{font-size:12px;font-weight:600;text-transform:none}
html[lang="ko"] .kicker{font-size:12px;font-weight:600;text-transform:none}
html[lang="ko"] .actno{font-size:12px;text-transform:none}
html[lang="ko"] .axes{font-size:13px;text-transform:none}
/* 연구자 소개 — 성명·역할 블록은 국문 화면에서도 영문 조판 그대로 둔다(2026-09-16).
   고유명·직함의 로마자 표기는 그대로 읽히므로 번역하지 않는다. */
html[lang="ko"] .bio .cv p{font-size:16px;line-height:1.5}
html[lang="ko"] footer,html[lang="ko"] .endcta .s{font-size:12.5px;text-transform:none}
html[lang="ko"] nav .navlinks a,html[lang="ko"] nav .cta,html[lang="ko"] nav .langbtn{font-size:13.5px}
html[lang="ko"] nav .logo{letter-spacing:.12em}
html[lang="ko"] .cap,html[lang="ko"] .clip .cap,html[lang="ko"] .plate .pcap{font-size:13.5px;line-height:1.75}
html[lang="ko"] .backlink{font-size:13px;font-weight:600;text-transform:none}
html[lang="ko"] .wrap .cta,html[lang="ko"] a.cta:not(nav a),html[lang="ko"] .btn{
  font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none}

@media (max-width:860px){
  .plate{flex-direction:column;gap:14px}
  .plate>.plateno{width:auto}
  .eyear{width:auto}
  .viewersm{max-width:none}
}

/* ── v3.4 보정 (실화면 캡처로 잡은 것) ─────────────────────
   ① "§ I — THE PROBLEM" 이 레일 폭에서 대시 뒤로 꺾여 읽기 나빴다.
      절 번호와 제목을 층으로 쌓아 꺾임 자체를 없앤다. */
.actno b{display:block;margin-bottom:8px;color:var(--dim);font-weight:400}
.actno>span{display:block}
.actno .tag{display:inline-block;margin-top:10px}
/* ② 연구 연표 첫 행 — 히어로 밑줄과 겹쳐 괘선이 두 줄로 보이던 것 */
.tlwrap{padding-top:0}
.era:first-of-type{border-top:none}


/* ─── 연구 > 성과물 목록 (v3.6) ─────────────────────────────────────────── */
.pubs{max-width:52em;padding-top:56px;border-top:1px solid var(--rule,#e2e0d8);margin-top:56px}
.pubh{font-size:1.05rem;letter-spacing:.14em;text-transform:uppercase;margin:0 0 6px}
.pubnote{max-width:44em;margin:0 0 26px}
.publist{list-style:none;margin:0;padding:0}
.pub{display:grid;grid-template-columns:5.6em 1fr 8em;gap:18px;align-items:baseline;
     padding:16px 0;border-top:1px solid var(--hair,#e8e6de)}
.pub:last-child{border-bottom:1px solid var(--hair,#e8e6de)}
.pubdate{font-family:"IBM Plex Mono",Menlo,monospace;font-size:.78rem;letter-spacing:.06em;opacity:.62}
.pubtitle{font-size:1rem;line-height:1.5}
.pubmeta{font-size:.84rem;line-height:1.6;opacity:.66;margin-top:4px}
.pubstat{font-family:"IBM Plex Mono",Menlo,monospace;font-size:.7rem;letter-spacing:.08em;
         text-transform:uppercase;text-align:right;white-space:nowrap}
.pubstat.s-plan{opacity:.5}
.pubstat.s-work{opacity:.5}
.pubstat.s-done{opacity:.78}
.pubstat.s-ask a{opacity:.95}
@media(max-width:760px){
  .pub{grid-template-columns:1fr;gap:4px}
  .pubstat{text-align:left}
}

/* ─── 연구자 콜로폰 — About 하단, 방법 본문과 분리된 띠 (v3.6, 2026-09-16) ───
   § I~III 은 방법의 논거다. 연구자 정보는 그 논거의 일부가 아니라
   지면을 낸 사람의 표기이므로, 절 번호를 떼고 전폭 띠로 갈라 놓는다. */
.wrap>section.colophon{
  margin:0 calc(-1 * var(--pad));
  padding:58px var(--pad) 64px;
  border-top:1px solid var(--ink);
  border-bottom:none;
}
.colophon .clab{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--accent);margin-bottom:30px}
.colophon .bio{border-top:1px solid var(--line);padding-top:22px;
  border-bottom:1px solid var(--line);padding-bottom:10px}
.colophon .bio .cv li{border-bottom-color:var(--line)}
html[lang="ko"] .colophon .clab{font-family:var(--sans);font-size:12px;
  font-weight:600;letter-spacing:.02em;text-transform:none}
@media (max-width:860px){
  .wrap>section.colophon{padding:44px var(--pad) 48px}
}