/* FITMON 웹 디자인 토큰.
 * 원본은 app/src/constants/theme.ts다. 값이 갈리면 앱이 이긴다.
 * hex 색을 쓸 수 있는 파일은 여기 하나뿐이다 (verify.mjs V3). */

/* 본문·숫자 — Pretendard 한글 동적 서브셋
 * @import는 다른 모든 @규칙보다 앞에 와야 한다. 아래 @font-face보다 위에 둘 것 —
 * 순서가 바뀌면 브라우저가 이 import 전체를 무시한다. */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.css');

/* 로고·제목 — 학교안심 사물함체 (눈누 / KERIS, 상업용 무료) */
@font-face {
  font-family: 'HakgyoansimSamulham';
  src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2402_keris@1.0/TTHakgyoansimSamulhamR.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}

:root {
  /* 배경·면 */
  --bg: #FFFFFF;
  --surface: #FFFFFF;
  --surface-sunken: #F1F3F5;
  --border: #D5DAE0;
  --divider: #EDEFF2;

  /* 글자 */
  --text: #16181A;
  --text-secondary: #565D66;
  --text-tertiary: #737C85;
  --on-accent: #FFFFFF;

  /* 포인트 */
  --accent: #3182F6;
  --accent-pressed: #1B64DA;
  --accent-text: #1B64DA;
  --accent-soft: #EAF2FE;
  --accent-soft-pressed: #D9E8FD;
  --logo-accent: #102F3E;

  /* 시맨틱 */
  --success: #2E7D4F;
  --warning: #8A5A00;
  --danger: #C93A2E;

  /* 지표색 — 지표를 가리킬 때만. 글자색으로 쓰지 않는다 */
  --metric-heart: #C74B62;
  --metric-heart-soft: #FAEDF0;
  --metric-oxygen: #3D62C4;
  --metric-oxygen-soft: #EDF1FA;
  --metric-bp: #8C6114;
  --metric-bp-soft: #FBF0E3;
  --metric-steps: #2E7D4F;
  --metric-steps-soft: #EAF3EE;
  --metric-watch: #1B64DA;
  --metric-watch-soft: #EAF2FE;

  /* 글꼴 */
  --font-display: 'HakgyoansimSamulham', 'Pretendard Variable', -apple-system, sans-serif;
  --font-body: 'Pretendard Variable', -apple-system, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;

  /* 크기 */
  --fs-hero: 44px;
  --fs-section: 30px;
  --fs-card-title: 19px;
  --fs-body: 17px;
  --fs-sub: 15px;

  /* 간격·모양 */
  --page-max: 1120px;
  --doc-max: 720px;
  --gutter: 20px;
  --section-gap: 96px;
  --radius-card: 18px;
  --radius-button: 14px;
  --radius-badge: 10px;
  --card-shadow: 3px 4px 8px rgba(22, 24, 26, 0.08);
}

@media (max-width: 760px) {
  :root {
    --fs-hero: 32px;
    --fs-section: 24px;
    --section-gap: 64px;
  }
}