/* 생성 파일 — 직접 수정 금지. 프레임워크 무관 CSS 변수.
 * 원본: @onmate/design-foundation/foundation/tokens.json, <service-root>/design-foundation/tokens.json, <service-root>/design-foundation/themes/*.json
 * 재생성: npm run ds:build (tsx node_modules/@onmate/design-foundation/build/tokens.ts design-foundation) */
:root {
  /* palette */
  --palette-white: #ffffff;
  --palette-black: #000000;
  --palette-neutral-50: #f7f7f8;
  --palette-neutral-100: #f4f4f5;
  --palette-neutral-150: #ececef;
  --palette-neutral-500: #aeb0b6;
  --palette-neutral-650: #70737c;
  --palette-neutral-800: #37383c;
  --palette-neutral-950: #171719;
  /* color */
  --color-bg-page: var(--palette-neutral-50);
  --color-bg-soft: var(--palette-neutral-100);
  --color-bg-card: var(--palette-white);
  --color-bg-skeleton: var(--palette-neutral-150);
  --color-bg-glass: rgb(255 255 255 / 96%);
  --color-bg-overlay: rgb(0 0 0 / 55%);
  --color-bg-skeleton-shine: rgb(255 255 255 / 55%);
  --color-fg-default: var(--palette-neutral-950);
  --color-fg-secondary: var(--palette-neutral-800);
  --color-fg-muted: var(--palette-neutral-650);
  --color-fg-faint: var(--palette-neutral-500);
  --color-fg-inverse: var(--palette-white);
  --color-fg-inverse-muted: rgb(255 255 255 / 70%);
  --color-border-default: rgb(112 115 124 / 22%);
  --color-border-subtle: rgb(112 115 124 / 16%);
  --color-accent-default: var(--palette-neutral-950);
  --color-accent-soft: var(--palette-neutral-100);
  --color-accent-fg: var(--palette-neutral-950);
  --color-accent-border: rgb(23 23 25 / 25%);
  --color-accent-border-strong: rgb(23 23 25 / 38%);
  --color-positive-default: #009c32;
  --color-positive-soft: #e5fbec;
  --color-danger-default: #ff4242;
  --color-danger-soft: #feebeb;
  --color-danger-fg: #c21f1f;
  --color-info-default: #0066ff;
  --color-info-soft: #eaf2fe;
  --color-info-fg: #0040a9;
  --color-info-border: #d6e6fd;
  --color-warning-default: #b07a00;
  --color-warning-soft: #fff4e5;
  --color-warning-fg: #9a5700;
  /* font */
  --font-sans: Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  /* text */
  --text-title-md-size: 22px;
  --text-title-md-weight: 790;
  --text-title-md-tracking: -0.024em;
  --text-title-md-leading: 1.3;
  --text-title-sm-size: 20px;
  --text-title-sm-weight: 700;
  --text-title-sm-tracking: -0.018em;
  --text-title-sm-leading: 1.4;
  --text-heading-size: 16px;
  --text-heading-weight: 700;
  --text-heading-tracking: -0.01em;
  --text-heading-leading: 1.4;
  --text-body-sm-size: 15px;
  --text-body-sm-weight: 500;
  --text-body-sm-tracking: 0.01em;
  --text-body-sm-leading: 1.5;
  --text-body-xs-size: 14px;
  --text-body-xs-weight: 500;
  --text-body-xs-tracking: 0;
  --text-body-xs-leading: 1.5;
  --text-label-sm-size: 13px;
  --text-label-sm-weight: 600;
  --text-label-sm-tracking: 0.02em;
  --text-label-sm-leading: 1.4;
  --text-label-xs-size: 12px;
  --text-label-xs-weight: 600;
  --text-label-xs-tracking: 0.03em;
  --text-label-xs-leading: 1.4;
  --text-caption-size: 11px;
  --text-caption-weight: 700;
  --text-caption-tracking: 0.04em;
  --text-caption-leading: 1.4;
  /* space */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-10: 40px;
  /* radius */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 20px;
  --radius-pill: 999px;
  /* shadow */
  --shadow-sm: 0 1px 3px rgb(23 23 25 / 8%);
  --shadow-popover: 0 14px 40px rgb(23 23 25 / 12%);
  --shadow-dialog: 0 24px 80px rgb(23 23 25 / 18%);
  /* duration */
  --duration-fast: 120ms;
  --duration-base: 160ms;
  --duration-sheet: 240ms;
  /* ease */
  --ease-out: ease-out;
  /* control */
  --control-height-s: 32px;
  --control-height-m: 36px;
  --control-height-l: 40px;
  --control-height-xl: 48px;
  --control-touch-min: 44px;
  /* layout */
  --layout-page-width: 1120px;
  --layout-content-width: 720px;
}
:root {
  /* 참고용. 미디어쿼리에서는 theme(--breakpoint-*) 를 쓴다 */
  /* breakpoint */
  --breakpoint-sm: 600px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1280px;
}