/* ==========================================================================
   디자인 설정 — 글꼴, 크기, 간격, 폭, 색상은 이 파일에서만 수정하세요.
   main.css는 여기의 변수만 참조합니다.
   ========================================================================== */

:root {
  /* ── 글꼴 ───────────────────────────────────────────────
     본문은 영문·숫자 글꼴을 먼저, 한글 글꼴을 그다음에 둡니다.
     영문 글꼴에는 한글 글자가 없으므로 한글은 자동으로 다음 글꼴로 넘어갑니다. */
  /* Georgia는 Windows·macOS·iOS에 들어 있는 시스템 글꼴입니다. 없는 기기(Android, Linux 등)에서는
     사이트가 제공하는 Source Serif 4로 대신하며, 이 웹 글꼴은 필요할 때만 내려받습니다. */
  --font-latin: Georgia, "Source Serif 4 Variable", "Source Serif 4";
  --font-hangul: "Noto Serif KR", "Nanum Myeongjo", "AppleMyungjo", "Batang";
  --font-body-fallback: "Times New Roman", serif;

  /* 메뉴·목차·검색·라벨처럼 화면을 구성하는 글자 */
  --font-ui-latin: "Pretendard Variable", "Pretendard";
  --font-ui-hangul: "Pretendard Variable", "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic";
  --font-ui-fallback: system-ui, -apple-system, "Segoe UI", sans-serif;

  --font-mono: ui-monospace, "SFMono-Regular", "D2Coding", "Cascadia Mono", Consolas, monospace;

  --font-body: var(--font-latin), var(--font-hangul), var(--font-body-fallback);
  --font-ui: var(--font-ui-latin), var(--font-ui-hangul), var(--font-ui-fallback);

  /* 글자 굵기: 강조에 굵은 글씨를 쓰지 않으므로 두 단계만 사용합니다. */
  --weight-body: 400;
  --weight-heading: 500;

  /* ── 크기와 줄 간격 ─────────────────────────────────────── */
  --text-size: 1.0625rem;          /* 본문 17px */
  --text-size-mobile: 1rem;        /* 좁은 화면 16px */
  --line-height: 1.8;
  --heading-line-height: 1.35;
  --ui-size: 0.9rem;               /* 메뉴·목차 */
  --small-size: 0.84rem;

  /* 수식 크기 배율. MathJax가 주변 본문 글꼴의 x-높이에 맞춰 크기를 자동으로 맞추므로
     보통은 1로 두고, 더 키우거나 줄이고 싶을 때만 바꿉니다. */
  --math-scale: 1;

  /* ── 간격 ───────────────────────────────────────────── */
  --paragraph-gap: 1em;
  --list-indent: 1.6em;            /* 목록 한 단계 들여쓰기 */
  --list-item-gap: 0.3em;          /* 목록 항목 사이 */
  --block-gap: 1.4em;              /* callout·접이식·표 앞뒤 */

  /* ── 폭 ──────────────────────────────────────────────── */
  --measure: 44rem;                /* 본문 최대 폭 */
  --sidebar-width: 16rem;
  --toc-width: 14rem;
  --page-gutter: clamp(1rem, 4vw, 3rem);

  /* ── 색상 ─────────────────────────────────────────────── */
  --color-bg: #fdfdfb;
  --color-bg-sunken: #f5f5f1;      /* 사이드바, 코드 */
  --color-text: #1c1f23;
  --color-text-muted: #5d636b;
  --color-text-faint: #8a9098;
  --color-border: #e3e3dd;
  --color-border-strong: #c9cac3;
  --color-list-guide: #e6e6e0;     /* 중첩 목록의 세로 안내선 */
  --color-marker: #7c838c;         /* 목록 기호·번호 */

  --color-accent: #1f5d8c;         /* 링크, 현재 위치 */
  --color-accent-hover: #15466b;
  --color-accent-soft: #edf3f8;
  --color-strong: #12324d;         /* **강조** 문구(굵게 하지 않고 색으로만 구분) */
  --color-mark: #fff3bf;
  --color-focus: #2b7bc0;

  /* callout 종류별 색: 테두리 / 배경 / 라벨 */
  --callout-definition: #2f6f9f;  --callout-definition-bg: #f3f7fb;
  --callout-theorem:    #3f6b4f;  --callout-theorem-bg:    #f3f8f4;
  --callout-lemma:      #3f6b4f;  --callout-lemma-bg:      #f3f8f4;
  --callout-example:    #6b5a3a;  --callout-example-bg:    #faf8f2;
  --callout-note:       #5d636b;  --callout-note-bg:       #f6f6f3;
  --callout-warning:    #a3472b;  --callout-warning-bg:    #fdf5f1;
  --fold-border: #d9dad3;
  --fold-bg: #fafaf7;

  --radius: 4px;
}