/**
 * 10-K 애널리틱스 — 디자인 토큰
 *
 * **라이트 블루(청회·네이비) 테마** (2026-08-17 주인님 확정 · 구 라이트 페이퍼(웜)에서 전환)
 * AI 지형도의 orthomap 팔레트(네이비 #22456e · 청회 잉크 · 헤어라인 #e3e7ec)를 사이트 정본으로 승격.
 * 팔레트가 두 벌이면 사이트가 두 벌이 된다 — 여기가 유일한 정본이다.
 *
 * 규율: 무채(청회) + 네이비 액센트 1색. **색으로 분류·등급을 구분하지 않는다**
 *       (구분은 텍스트 라벨과 선 스타일로 — /landscape 의 .chip[data-r] 어휘).
 * 롤백: assets/css/_variables.css.bak-20260817-blue (웜 페이퍼) · *.bak-20260815-light (다크)
 */

:root {
    /* 배경 — 청회 면 (orthomap surface 계열) */
    --bg-primary: #f6f7f9;                      /* 바탕 */
    --bg-card: #ffffff;                         /* 카드 */
    --bg-elevated: #eef1f5;                     /* 살짝 눌린 면 */
    --bg-hover: #e8edf3;

    /* 액센트 — 네이비 1색 (orthomap navy-700). 지형도와 같은 계열 */
    --accent: #22456e;
    --accent-rgb: 34, 69, 110;
    --accent-dim: rgba(var(--accent-rgb), 0.08);
    --accent-hover: #1a3557;                    /* 밝은 바탕이므로 hover 는 더 진하게 */
    --accent-muted: #64707e;

    /* ⛔ 아래 4색은 **분류·등급 표시에 쓰지 않는다**(색각 이상 배제·주인님 규율).
     *    호출부가 남아 있어 이름만 유지하고 값은 무채(청회)로 눌렀다. 등급은 라벨+선 스타일로. */
    --blue: #64707e;
    --blue-dim: rgba(100, 112, 126, 0.10);
    --green: #3a4654;
    --red: #1b2430;
    --orange: #64707e;

    --legacy-gold: #8a6d3b;

    /* 텍스트 — 청회 잉크 (orthomap ink 계열) */
    --text-primary: #1b2430;
    --text-secondary: #3a4654;
    --text-tertiary: #64707e;
    --text-inverse: #ffffff;

    /* 보더 — 헤어라인 */
    --border: #e3e7ec;
    --border-light: #eef1f5;
    --border-accent: rgba(var(--accent-rgb), 0.35);

    /* 간격 */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;
    --space-3xl: 4rem;

    /* 타이포그래피 — 위계는 이 스케일로만 말한다. 컴포넌트에 px 하드코딩 ❌ (2026-08-17 규율)
       html base 가 16→18px 로 반응형 스케일.
       PC(18px base) 환산: md=18px, lg=20.25px, xl=24.75px, 2xl=31.5px */
    /* ── 읽기 본문 규격 (2026-08-27 주인님 지시: "뉴스상세 기준으로 전 페이지 규정을 맞춰라") ──
     * 기준면 = 뉴스 상세(.news-detail-page). 원래 리브레토 인사이트 계열의 조판이다.
     * ⛔ 2026-08-25 에 이 값들을 "하드코딩"으로 보고 .static-page 에서 걷어냈다가
     *    가이드만 20px Pretendard 로 떠서 이질감이 생겼다 — **하드코딩이 아니라 규격이었다.**
     * 긴 산문을 읽는 면은 전부 이 토큰을 쓴다. 값을 바꾸려면 여기만 고친다.
     * (카드·표·버튼 같은 UI 요소는 해당 없음 — 그쪽은 Pretendard + --fs-* 유지) */
    --reading-font: 'Noto Serif KR', Georgia, serif;
    --reading-fs: 18px;
    --reading-lh: 1.85;
    --reading-ls: -0.01em;
    --reading-h2: 22px;      /* 본문 안 큰 소제목 */
    --reading-h3: 18px;      /* 본문 안 작은 소제목 — 굵기로 가른다 */
    --reading-measure: 74ch; /* 읽기 폭 */

    --fs-3xs: 0.6875rem;         /* 11~12.4px — mono 마이크로 라벨(아이브로·국적 코드) */
    --fs-2xs: 0.75rem;           /* 12~13.5px — mono 보조(칩·배지·날짜) */
    --fs-xs: 0.8125rem;          /* 13~14.6px — meta/caption·메뉴 */
    --fs-sm: 0.9375rem;          /* 15~16.9px — secondary·카드 본문 */
    --fs-md: 1rem;               /* 16~18px — 본문 기본 */
    --fs-lg: 1.125rem;           /* 18~20.25px — 강조 본문·페이지 제목(서브페이지) */
    --fs-xl: 1.375rem;           /* 22~24.75px — h3 섹션 */
    --fs-2xl: 1.75rem;           /* 28~31.5px — h2 대제목 */
    --fs-3xl: 2.25rem;           /* 36~40.5px — h1 hero */
    --lh-tight: 1.35;
    --lh-normal: 1.7;             /* 본문 — 뉴스 표준 */
    --lh-relaxed: 1.85;

    /* 반지름 */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;

    /* 그림자 — 청회 먹 */
    --shadow-sm: 0 1px 2px rgba(27, 36, 48, 0.06);
    --shadow-md: 0 2px 8px rgba(27, 36, 48, 0.08);
    --shadow-lg: 0 6px 20px rgba(27, 36, 48, 0.10);

    /* 레이아웃 */
    --content-width: 1100px;
    --content-width-wide: 1400px;
    --header-height: 56px;

    /* 트랜지션 */
    --transition-fast: 150ms ease;
    --transition-normal: 250ms ease;
}
