/* mathhub.io — 스위스 그리드
   여백·괘선·타이포 위계로만 구분. 크림/세리프 display/테라코타 없음.
   중성색은 순수 회색이 아니라 미세하게 한랭 편향. */
:root{
  --ink:#15171c;          /* 거의 검정, 아주 옅은 청색 편향 */
  --ink-2:#3d424c;
  --ink-3:#6b7280;
  --line:#d9dce2;
  --line-2:#eceef1;
  --paper:#fdfdfe;
  --paper-2:#f5f6f8;
  --accent:#1f4fd8;       /* 링크 전용. 면적으로 쓰지 않음 */
  --mark:#eef1f6;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --ink:#eceef2; --ink-2:#b8bec9; --ink-3:#868d99;
    --line:#2b2f37; --line-2:#1f232a;
    --paper:#0f1115; --paper-2:#171a20;
    --accent:#8fabff; --mark:#1b1f27;
  }
}
:root[data-theme="dark"]{
  --ink:#eceef2; --ink-2:#b8bec9; --ink-3:#868d99;
  --line:#2b2f37; --line-2:#1f232a;
  --paper:#0f1115; --paper-2:#171a20;
  --accent:#8fabff; --mark:#1b1f27;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:'Inter','Pretendard Variable','Pretendard',-apple-system,
              BlinkMacSystemFont,'Apple SD Gothic Neo','Helvetica Neue',sans-serif;
  font-size:18px; line-height:1.75; letter-spacing:-.003em;
  -webkit-font-smoothing:antialiased; font-variant-numeric:tabular-nums;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px}

/* ── 그리드 ── */
.grid{max-width:1080px; margin:0 auto; padding:0 32px}
@media (max-width:640px){.grid{padding:0 20px}}

/* ── 상단 네비: 국가별 사이트 헤더 ── */
.site-nav{border-bottom:1px solid var(--line)}
.site-nav .grid{
  display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 30px; padding-top:20px; padding-bottom:20px;
}
.site-mark{
  font-size:15px; font-weight:600; color:var(--ink);
  letter-spacing:.09em; text-transform:uppercase; white-space:nowrap;
}
.site-mark .region{color:var(--ink-3); font-weight:400}
.site-nav ul{
  display:flex; flex-wrap:wrap; gap:8px 26px; list-style:none; margin:0; padding:0; flex:1;
}
.site-nav a{font-size:16px; color:var(--ink-2)}
.site-nav a:hover,.site-nav a[aria-current]{color:var(--ink); text-decoration:none}
.site-nav a[aria-current]{border-bottom:1px solid var(--ink); padding-bottom:2px}
.site-nav .switch{font-size:15px; color:var(--ink-3); white-space:nowrap}
.site-nav .switch a{font-size:15px; color:var(--ink-3)}

/* ── 글 머리 ── */
.post-head{
  border-bottom:1px solid var(--line);
  max-width:1080px; margin:0 auto; padding:72px 32px 36px;
}
.post-head .grid{padding:0; max-width:none}
@media (max-width:640px){.post-head{padding:48px 20px 28px}}
.post-kicker{
  font-size:14px; font-weight:600; letter-spacing:.11em; text-transform:uppercase;
  color:var(--ink-3); margin-bottom:20px;
}
.post-head h1{
  font-size:clamp(32px,5.2vw,54px); line-height:1.08; letter-spacing:-.028em;
  font-weight:600; margin:0 0 20px; max-width:20ch;
}
.post-lede{font-size:20px; line-height:1.6; color:var(--ink-2); margin:0 0 26px; max-width:54ch}
.post-meta{font-size:15px; color:var(--ink-3); letter-spacing:.01em}

/* ── 본문 ── */
article{max-width:1080px; margin:0 auto; padding:8px 32px 24px}
@media (max-width:640px){article{padding:8px 20px 24px}}
article > *{max-width:68ch}
article h2{
  font-size:clamp(22px,2.6vw,28px); font-weight:600; letter-spacing:-.018em; line-height:1.25;
  margin:64px 0 20px; padding:18px 0 0;
  border-top:1px solid var(--line); border-bottom:none; max-width:none; color:var(--ink);
}
article h2:first-child{margin-top:44px}
article h3{border-bottom:none; color:var(--ink); font-size:20px; font-weight:600; letter-spacing:-.01em; margin:38px 0 10px}
article p{margin:0 0 20px}
article ul,article ol{margin:0 0 20px; padding-left:1.3em}
article li{margin-bottom:8px}
article li::marker{color:var(--ink-3)}
strong{font-weight:600}
mark{background:var(--mark); color:inherit; padding:.1em .25em}

/* 강조 블록 — 배경/그림자 없이 위아래 괘선 + 라벨 */
.block{
  margin:32px 0; padding:22px 0 22px;
  border-top:1px solid var(--ink); border-bottom:1px solid var(--line);
}
.block > .label{
  display:block; font-size:14px; font-weight:600; letter-spacing:.13em;
  text-transform:uppercase; color:var(--ink-3); margin-bottom:12px;
}
.block > :last-child{margin-bottom:0}

/* ── 표 ── */
.table-scroll{overflow-x:auto; margin:32px 0; max-width:none}
table{border-collapse:collapse; width:100%; font-size:16.5px; min-width:min(100%,540px)}
th,td{padding:12px 20px 12px 0; text-align:left; border-bottom:1px solid var(--line-2); vertical-align:top}
th{font-weight:600; font-size:14px; letter-spacing:.09em; text-transform:uppercase;
   color:var(--ink-3); border-bottom:1px solid var(--ink); padding-bottom:10px}
tr:last-child td{border-bottom:1px solid var(--line)}

/* ── 목록형 인덱스 (허브 페이지용) ── */
.index-list{list-style:none; margin:0; padding:0; max-width:none}
.index-list li{border-bottom:1px solid var(--line-2)}
.index-list li:first-child{border-top:1px solid var(--ink)}
.index-list a{
  display:grid; grid-template-columns:1fr auto; gap:4px 32px; align-items:baseline;
  padding:20px 0; color:var(--ink);
}
.index-list a:hover{text-decoration:none}
.index-list a:hover .il-t{text-decoration:underline; text-underline-offset:4px}
.il-t{font-size:19px; font-weight:600; letter-spacing:-.012em}
.il-d{grid-column:1; font-size:16px; color:var(--ink-3); max-width:62ch}
.il-n{font-size:15px; color:var(--ink-3); white-space:nowrap; font-variant-numeric:tabular-nums}

/* ── 수식 ── */
mjx-container[display="true"]{overflow-x:auto; overflow-y:hidden; padding:6px 0}

/* ── 코드 ── */
code{font-family:'SF Mono',ui-monospace,Menlo,monospace; font-size:.9em;
     background:var(--mark); padding:.12em .34em}
pre{overflow-x:auto; background:var(--paper-2); border:1px solid var(--line-2);
    padding:18px 20px; margin:32px 0; max-width:none}
pre code{background:none; padding:0; font-size:15.5px}

/* ── 꼬리 ── */
.post-foot{
  border-top:1px solid var(--line); margin-top:72px;
  max-width:1080px; margin-left:auto; margin-right:auto;
  padding:28px 32px 80px; font-size:16px; color:var(--ink-3);
}
.post-foot .grid{padding:0; max-width:none}
.post-foot p{margin:0 0 6px}

@media print{
  .site-nav,.no-print{display:none}
  body{background:#fff; color:#000; font-size:11pt}
  article h2,.block,table,figure{break-inside:avoid}
  @page{size:A4 portrait; margin:18mm 16mm}
}
