/* ═══════════════════════════════════════════════════════════
   A.IN 디자인 토큰 v1 — redesign P0
   무드: 금융정보 단말기 / B2B 대시보드.
   장식 최소 · 데이터 밀도 · 숫자/표 가독 최우선.
   규칙: 모든 페이지·컴포넌트는 이 토큰만 소비한다.
         페이지별 임의 hex/px 값 금지.
   ═══════════════════════════════════════════════════════════ */

@font-face{
  font-family:"Pretendard Variable";
  src:url("/assets/fonts/PretendardVariable.subset.woff2") format("woff2-variations");
  font-weight:45 920;
  font-style:normal;
  font-display:swap;
}

:root{
  /* ── 컬러 · 뉴트럴 (웜그레이) ─────────────────── */
  --c-bg:#F3F2EF;            /* 페이지 배경 — 웜 페이퍼 */
  --c-surface:#FFFFFF;       /* 패널 표면 */
  --c-surface-sub:#F9F8F6;   /* 표면 보조 (행 hover, 서브영역) */
  --c-ink:#1E1D1A;           /* 본문 잉크 */
  --c-ink-sub:#5C5850;       /* 보조 텍스트 */
  --c-ink-faint:#79756B;     /* 캡션·라벨 (흰 배경 AA 4.5:1 이상) */
  --c-line:#E7E4DD;          /* 기본 보더 */
  --c-line-strong:#D8D4CA;   /* 강조 보더 (테이블 헤더 밑선 등) */

  /* ── 컬러 · 포인트 1색 ─────────────────────────
     브랜드 그라데이션(#2D4A9E→#9E2D3D)에서 추출한 딥블루.
     Tailwind 기본 블루 계열 사용 금지. */
  --c-accent:#2D4A9E;
  --c-accent-bg:#EEF1F8;
  --c-accent-line:#C7D0E6;
  /* 브랜드 그라데이션 — 적용처 한정: 워드마크·활성 탭/필터·프라이머리 CTA·섹션 포인트 바.
     본문·테이블·배지 도배 금지 (전문성 보존) */
  --brand-gradient:linear-gradient(135deg,#2D4A9E,#9E2D3D);

  /* ── 컬러 · 시세 방향 (국내 관례: 상승=적 / 하락=청) ── */
  --c-up:#C13438;
  --c-up-bg:#F9ECEC;
  --c-down:#2159C8;
  --c-down-bg:#EBF1FB;

  /* ── 타이포 · 4단 스케일 (이외 크기 금지) ────── */
  --font-sans:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,
              "Apple SD Gothic Neo","Noto Sans KR","Segoe UI",sans-serif;
  --fs-1:20px;  --lh-1:1.3;   /* 페이지 제목 */
  --fs-2:15px;  --lh-2:1.4;   /* 섹션 제목 · 강조 수치 */
  --fs-3:13px;  --lh-3:1.55;  /* 본문 · 데이터 */
  --fs-4:11.5px;--lh-4:1.45;  /* 캡션 · 라벨 · 배지 */
  --fw-bold:760;
  --fw-semi:640;
  --fw-reg:460;

  /* ── 간격 · 4px 그리드 ─────────────────────── */
  --sp-1:4px;  --sp-2:8px;  --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-7:32px; --sp-8:40px; --sp-9:56px;

  /* ── radius · 그림자 (이 3+2개 외 금지) ──────── */
  --r-1:6px;
  --r-2:10px;
  --r-3:14px;
  --sh-1:0 1px 2px rgba(30,29,26,.04);
  --sh-2:0 6px 20px -12px rgba(30,29,26,.14);

  /* ── 레이아웃 ─────────────────────────────── */
  --w-max:1200px;
}

/* 모바일 가독: 본문·캡션만 승격 (스케일 4단 유지) */
@media (max-width:640px){
  :root{
    --fs-3:14.5px;
    --fs-4:12px;
  }
}