/* ============================================================
   mooovinggun · 디자인 토큰
   색·폰트·크기를 바꾸려면 "이 파일만" 고치면 됩니다.
   - :root          = 구조 토큰 (폰트·크기·간격·반경·치수) — 테마 공통
   - [data-theme=…] = 색 토큰만. 다크/라이트가 "같은 이름, 다른 값"
   ============================================================ */

:root {
  /* ---- 폰트 (통째로 교체 가능) ---- */
  --font-title: 'Gowun Batang', serif;                 /* 제목·로고 (명조) */
  --font-body:  'IBM Plex Sans KR', system-ui, sans-serif; /* 본문·요약·UI */
  --font-mono:  'IBM Plex Mono', ui-monospace, monospace;  /* 코드·태그·날짜 */

  /* ---- 글자 크기 스케일 (이 단계만 사용) ---- */
  --text-2xs:  11px;   /* 분류 배지, 목차 라벨, 칩 카운트, 이전/다음 라벨 */
  --text-xs:   12px;   /* 태그, 날짜, 인가 배너, 잠김 배지 */
  --text-sm:   13px;   /* 요약, 목차 항목, 검색창, 부제, Home 버튼, 하위 칩, 인라인 코드 */
  --text-code: 12.5px; /* 코드블록 */
  --text-md:   15px;   /* 네비 링크, 본문 문단 */
  --text-lg:   18px;   /* 글 소제목 h2 */
  --text-xl:   21px;   /* 섹션 제목, 목록 글 제목, 로고 프롬프트(~$) */
  --text-2xl:  30px;   /* 사이트명, 글 제목 h1, 분류 페이지 제목 */

  /* ---- 줄간격 ---- */
  --leading-tight:  1.4;  /* 제목 */
  --leading-snug:   1.5;  /* 목록 제목, UI */
  --leading-normal: 1.6;  /* 목록 요약 */
  --leading-loose:  1.85; /* 한글 본문 (넉넉히) */
  --leading-code:   1.75; /* 코드블록 */

  /* ---- 간격 스케일 (padding·gap·margin은 이 단계만) ---- */
  --space-1:  4px;
  --space-2:  6px;
  --space-3:  8px;
  --space-4:  11px;
  --space-5:  14px;
  --space-6:  16px;
  --space-7:  24px;
  --space-8:  32px;
  --space-9:  40px;
  --space-10: 60px;  /* 섹션 사이 여백 */

  /* ---- 테두리 반경 ---- */
  --radius-xs:   4px;   /* 분류 배지 */
  --radius-sm:   6px;   /* 잠김 배지 */
  --radius-md:   8px;   /* 검색창·코드블록·인가 배너·이전/다음 */
  --radius-pill: 999px; /* Home 버튼·하위 갈래 칩·테마 토글 */

  /* ---- 레이아웃 치수 ---- */
  --container:    1040px; /* 페이지 콘텐츠 최대 폭 */
  --measure:      680px;  /* 글 본문 폭 (코드 많아 넓히지 않음) */
  --toc-width:    200px;  /* 우측 목차 폭 */
  --search-width: 240px;  /* 헤더 검색창 폭 */
  --control-size: 30px;   /* 테마 토글 버튼 크기 */
  --icon-size:    15px;   /* 테마 토글 아이콘 크기 */
}

/* ============================================================
   테마 색 — 같은 변수 이름, 값만 다르게.
   초록을 다른 색으로 바꾸려면 --accent* 만 고치면 전체 반영됩니다.
   분류(Pentest/Writeups/Notes)는 별도 색이 없고 --accent 하나를 공유합니다.
   나중에 분류별 색을 나누려면 여기에 --cat-pentest 등을 정의하세요.
   ============================================================ */

[data-theme="dark"] {
  --bg:            #0c0f0a;              /* 페이지 배경 */
  --surface:       #14180f;              /* 검색창 등 입력 배경 */
  --text:          #e6eae0;              /* 본문 기본 텍스트 */
  --text-strong:   #eff3e9;              /* 제목·주요 텍스트·링크 기본 */
  --text-muted:    #868f80;              /* 요약, 부제 */
  --text-faint:    #565e51;              /* 구분점, 섹션 설명, 보조 */
  --date:          #4d5342;              /* 날짜 (가장 어둡게) */
  --count:         #6b7360;              /* 네비 편수 카운트 */
  --border:        #1a1f16;              /* 목록 구분선 (옅음) */
  --border-strong: #2a3122;              /* 입력·카드·헤더 구분선 */
  --divider:       #262c1e;              /* 로고/네비 세로 구분선 */
  --accent:        #a6d94f;              /* 링크, 기법 태그 (강조색) */
  --accent-underline: rgba(166,217,79,.5);  /* 기법 태그 밑줄 */
  --accent-divider:   rgba(147,189,82,.28); /* 헤더·섹션 아래 얇은 구분선 */
  --prompt:        #5c6b40;              /* 로고 앞 ~$ 프롬프트 */
  --env:           #b2b8a2;              /* 환경 태그 (기법보다 한 단계 아래) */
  --code-bg:       #14180f;              /* 코드블록·인라인 코드 배경 */
  --code-text:     #d6dcc9;              /* 코드 텍스트 */
  --notice-bg:     rgba(147,189,82,.06); /* 인가 고지 배너 배경 */
  --notice-border: #3d4530;              /* 인가 고지 배너 테두리 */
  --notice-text:   #a7bd7e;              /* 인가 고지 배너 글자 */
  --lock-bg:       rgba(176,160,90,.08); /* 잠김 배지 배경 */
  --lock-border:   #4a4327;              /* 잠김 배지 테두리 */
  --lock-text:     #b0a05a;              /* 잠김 배지 글자 */
}

[data-theme="light"] {
  --bg:            #f7f8f3;              /* 페이지 배경 */
  --surface:       #eef1e6;              /* 검색창 등 입력 배경 */
  --text:          #1b1d16;              /* 본문 기본 텍스트 */
  --text-strong:   #14160f;              /* 제목·주요 텍스트·링크 기본 */
  --text-muted:    #6b7060;              /* 요약, 부제 */
  --text-faint:    #9aa08c;              /* 구분점, 섹션 설명, 보조 */
  --date:          #adb2a0;              /* 날짜 (가장 옅게) */
  --count:         #9aa08c;              /* 네비 편수 카운트 */
  --border:        #e4e7da;              /* 목록 구분선 (옅음) */
  --border-strong: #d7dcc9;              /* 입력·카드·헤더 구분선 */
  --divider:       #d3d6c8;              /* 로고/네비 세로 구분선 */
  --accent:        #4f7d1f;              /* 링크, 기법 태그 (강조색) */
  --accent-underline: rgba(79,125,31,.4);   /* 기법 태그 밑줄 */
  --accent-divider:   rgba(95,140,42,.30);  /* 헤더·섹션 아래 얇은 구분선 */
  --prompt:        #7f8a58;              /* 로고 앞 ~$ 프롬프트 */
  --env:           #737a66;              /* 환경 태그 */
  --code-bg:       #f3f1e6;              /* 코드블록·인라인 코드 배경 */
  --code-text:     #2b2e22;              /* 코드 텍스트 */
  --notice-bg:     #eef3e0;              /* 인가 고지 배너 배경 */
  --notice-border: #d3ddb9;              /* 인가 고지 배너 테두리 */
  --notice-text:   #566b28;              /* 인가 고지 배너 글자 */
  --lock-bg:       #f6efdd;              /* 잠김 배지 배경 */
  --lock-border:   #e0d3a8;              /* 잠김 배지 테두리 */
  --lock-text:     #9a6b1a;              /* 잠김 배지 글자 */
}