/* 희로그 디자인 토큰 — 지시서 07: 유리 질감 폐기, 플랫 화이트 카드 + 오프화이트 배경 디자인 시스템.
   기존 --hg-* 접두 토큰들도 이번 전면 교체 대상이라 값 자체를 새 시스템에 맞춰 갱신한다
   (전체 탭 공용 컴포넌트가 이 토큰들을 참조하므로, 값만 바꾸면 전체 화면에 일괄 반영된다). */
:root {
  /* 배경/카드 — 외곽 배경(#F5F5F7) 위에 메인 콘텐츠가 화이트 카드(#FFFFFF)로 뜨는 구조 */
  --hg-bg: #F5F5F7;
  --hg-bg-elevated: #FFFFFF;
  --hg-card: #FFFFFF;
  --hg-border: rgba(0,0,0,0.1);
  --hg-border-strong: rgba(0,0,0,0.16);

  /* 텍스트 */
  --hg-text1: #1D1D1F;
  --hg-text2: #86868B;
  --hg-text3: #AEAEB4;
  --hg-text4: #C3C3C8;

  /* 강조색 (절제된 사용) */
  --hg-accent: #2E7CF6;
  --hg-danger: #E5484D;
  --hg-success: #22C55E;

  /* 신호등 장식 */
  --hg-traffic-red: #FF5F57;
  --hg-traffic-yellow: #FEBC2E;
  --hg-traffic-green: #28C840;

  /* 라운드 (지시서 07 5-5: 이 세 값 외 임의의 라운드 값을 쓰지 않는다) */
  --hg-radius-window: 16px;
  --hg-radius-card: 16px;
  --hg-radius-control: 10px;
  --hg-radius-pill: 8px;

  /* 그림자 — 지시서 07 5-1: 그림자·글로우 금지, 면 구분은 배경색 차이 + 헤어라인 보더로만 */
  --hg-shadow-window: none;
  --hg-shadow-card: none;

  /* 폰트 — Pretendard, 400/500만 사용 */
  --hg-font: 'Pretendard', -apple-system, 'Apple SD Gothic Neo', sans-serif;

  /* 레이아웃 치수 */
  --hg-titlebar-h: 52px;
  --hg-tabbar-h: 50px;

  /* iOS PWA safe-area */
  --hg-safe-top: env(safe-area-inset-top, 0px);
  --hg-safe-bottom: env(safe-area-inset-bottom, 0px);
  --hg-safe-left: env(safe-area-inset-left, 0px);
  --hg-safe-right: env(safe-area-inset-right, 0px);

  /* ── 지시서 07: 디자인 리뉴얼 — 전체 화면 공용 토큰 ── */
  --bg: #F5F5F7;
  --card: #FFFFFF;
  --border: rgba(0,0,0,0.1);
  --text-primary: #1D1D1F;
  --text-secondary: #86868B;
  --text-tertiary: #AEAEB4;
  --inactive: #C3C3C8;
  --accent: #2E7CF6;
  --accent-soft: #EAF2FE;
  --danger: #E5484D;

  /* 타이포 스케일 (지시서 08 3번: 지시서 07 대비 0.9배 축소. 최소 11px. 웨이트는 400/500만) */
  --fs-display: 15px; --fw-display: 500; /* 페이지 제목 */
  --fs-title: 13px;   --fw-title: 500;   /* 섹션 제목 */
  --fs-body: 12px;    --fw-body: 400;    /* 본문 */
  --fs-caption: 11px; --fw-caption: 400; /* 캡션/보조 */

  --radius-card: 16px;
  --radius-input: 10px;
  --radius-chip: 8px;
  --shadow-card: none;

  --space-card-pad: 13px;
  --space-card-gap: 12px;
  --space-section-gap: 20px;
}