/* tokens/index.css — 토스 페이먼츠 디자인시스템 합본.
   값=페이먼츠 실측(runtime-tok.css), 구조=3단계 시맨틱 토큰. 라이트만(다크 TODO).
   import 순서: 폰트 → scale·motion(foundation) → primitive → semantic → component. */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css");
@import "./tossface.css";        /* 토스 이모지 폰트(로컬) — 이모지엔 .tf/--font-emoji로 명시 적용 */
@import "./00-scale.css";
@import "./04-motion.css";
@import "./01-primitive.css";
@import "./02-semantic.css";
@import "./05-typography.css";  /* 타이포 역할(text-style) */
@import "./03-component.css";

/* 전역 리셋 + 기본 (토스 글로벌 설정) */
* { box-sizing: border-box; }
html { line-height: 1.15; }
html, body {
  margin: 0;
  /* 한글 타이포 — 단어 단위 줄바꿈 */
  word-break: keep-all;
  overflow-wrap: break-word;
  -webkit-text-size-adjust: 100%;
  -webkit-locale: "ko";
  /* 가는 회색 스크롤바 */
  scrollbar-width: thin;
  scrollbar-color: var(--c-grey-a300) transparent;
}
body {
  background: var(--bg-default);
  color: var(--text-primary);            /* ⭐ 기본 = soft grey-800 (페이먼츠 시그니처) */
  font-family: var(--font-sans);
  font-size: var(--fs-15);
  line-height: var(--lh-15);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background .2s ease, color .2s ease;
}
button, input, textarea, select { font-family: inherit; }

/* 이모지 유틸 — 이모지/아이콘 글자에만 Tossface 명시 적용.
   기본 스택엔 Tossface 없음(숫자 깨짐 방지) → 이모지는 .tf로 감싸거나 요소에 직접. */
.tf { font-family: var(--font-emoji); }