/* 디자인 기준 토큰 하나 (2026-10-28, 본보기 Revolut, 형님 4848 「추천대로」).
   IR 덱, 지갑·정보 앱, 서비스 웹, 포트폴리오, 정성이형 책이 모두 이 파일 하나를 읽는다.
   값과 잰 곳은 같은 폴더 DESIGN.md 표. 손으로 색·크기를 적지 말고 var(--...) 만 쓴다. */

@font-face { font-family: "Pretendard"; font-weight: 300; font-display: swap; src: url("fonts/Pretendard-Light.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 400; font-display: swap; src: url("fonts/Pretendard-Regular.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 500; font-display: swap; src: url("fonts/Pretendard-Medium.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 600; font-display: swap; src: url("fonts/Pretendard-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Pretendard"; font-weight: 700; font-display: swap; src: url("fonts/Pretendard-Bold.woff2") format("woff2"); }
/* 손님 화면 글꼴: IBM Plex Sans(영문·숫자) + IBM Plex Sans KR(한글), 2026-10-29 형님 4883 「다로 해」. SIL OFL 1.1, 라이선스 fonts\LICENSE_IBMPlexSans.txt·OFL_IBMPlexSansKR.txt */
@font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-display: swap; src: url("fonts/IBMPlexSans-400.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 500; font-display: swap; src: url("fonts/IBMPlexSans-500.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 600; font-display: swap; src: url("fonts/IBMPlexSans-600.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans"; font-weight: 700; font-display: swap; src: url("fonts/IBMPlexSans-700.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans KR"; font-weight: 400; font-display: swap; src: url("fonts/IBMPlexSansKR-Regular.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans KR"; font-weight: 500; font-display: swap; src: url("fonts/IBMPlexSansKR-Medium.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans KR"; font-weight: 600; font-display: swap; src: url("fonts/IBMPlexSansKR-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "IBM Plex Sans KR"; font-weight: 700; font-display: swap; src: url("fonts/IBMPlexSansKR-Bold.woff2") format("woff2"); }
@font-face { font-family: "Nanum Gothic"; font-weight: 400; font-display: swap; src: url("fonts/NanumGothic-Regular.ttf") format("truetype"); }
@font-face { font-family: "Nanum Gothic"; font-weight: 700; font-display: swap; src: url("fonts/NanumGothic-Bold.ttf") format("truetype"); }
@font-face { font-family: "Nanum Gothic"; font-weight: 800; font-display: swap; src: url("fonts/NanumGothic-ExtraBold.ttf") format("truetype"); }

:root {
  /* 바탕·면 */
  --c-black: #000000;
  --c-card: #161618;
  --c-card-top: #2C2A2B;
  --c-card-bottom: #0A0A0A;
  --c-line-dark: rgba(255, 255, 255, 0.08);
  --c-scrim: rgba(0, 0, 0, 0.72);   /* 입체 그림 위 글자 받침 */
  --c-paper: #F7F7F7;
  --c-panel: #F0F1F4;
  --c-line-light: #D7D7D7;

  /* 글자 색 */
  --c-on-dark: #FFFFFF;
  --c-on-dark-2: #B8BDBF;      /* 검정 위 11.1:1 */
  --c-on-dark-3: #8A8A8E;      /* 검정 6.1:1, 카드 5.3:1, 어두운 면 작은 글 최저선 */
  --c-ink: #000000;
  --c-ink-2: #494949;          /* 8.4:1 */
  --c-ink-3: #6D6D6D;          /* 4.8:1, 밝은 쪽 작은 글 최저선 */

  /* 강조색 하나: 면·단추·아이콘 원·선택 표시에만. 검정 위 작은 글자색 금지(4.1:1). 흰 글자 5.1:1 */
  --c-accent: #5D5AE8;
  --c-on-accent: #FFFFFF;

  /* 그림 속 파랑: 입체 그림과 행성 빛 띠 안에서만 */
  --c-glow-deep: #0F44BD;
  --c-glow-mid: #3D6ADD;
  --c-glow-night: #172566;

  /* 차트: 이번 기간 흰/검정, 지난 기간 회색 */
  --c-chart-now-dark: #FFFFFF;
  --c-chart-prev-dark: #797D80;
  --c-chart-now-light: #151517;
  --c-chart-prev-light: #B8BCBE;

  /* 오름·내림(▲▼ 모양과 같이) */
  --c-up: #1C8356;
  --c-down: #D9534A;

  /* 글꼴 */
  --f-ui: "IBM Plex Sans", "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --f-doc: "Nanum Gothic", "NanumGothic", sans-serif;

  /* 굵기 */
  --w-display: 400;
  --w-head: 500;
  --w-head-doc: 700;
  --w-body: 400;

  /* 크기 */
  --t-hero: 88px;
  --t-display: 64px;
  --t-deck-display: 104px;   /* 덱 1920 표지: Revolut 표지 제목 = 쪽 너비 5.4% */
  --t-h1: 40px;
  --t-h2: 24px;
  --t-h3: 20px;
  --t-body: 16px;
  --t-small: 14px;
  --t-caption: 13px;
  --t-num-xl: 40px;
  --t-deck-h2: 32px;         /* 덱 1920 카드 제목: 보고서 소제목 20pt x 1.61(1920/1191pt) */
  --t-deck-num: 56px;        /* 덱 카드 안 숫자: 보고서 카드 숫자 「68.3M」 */
  --t-deck-num-xl: 144px;    /* 덱 숫자 쪽 큰 숫자: 보고서 「100K+」 */
  --lh-tight: 1.08;
  --lh-head: 1.25;
  --lh-body: 1.6;
  --lh-doc: 1.8;
  --ls-display: -0.01em;

  /* 간격 */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px;
  --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;
  --gutter-phone: 20px;
  --gutter-web: 80px;
  --gutter-a4: 56px;
  --gutter-deck: 96px;

  /* 모서리 */
  --r-doc: 6px;
  --r-card: 20px;
  --r-btn: 999px;

  /* 아이콘 */
  --icon-stroke: 1.75px;
  --icon-size: 24px;
  --icon-circle: 44px;
  --icon-circle-fill: rgba(255, 255, 255, 0.12);

  /* 증감은 알약 모양 없이 글과 색(▲▼)으로(별 결정 10/28) */
}