/* choco 확정판 1.0 · 토큰 · 2026-10-15 · 수정하려면 tokens.json 을 고치고 다시 생성 */
:root {
  --choco-color-primary: #4A2630;
  --choco-color-secondary: #7D5A66;
  --choco-color-accent: #F0907A;
  --choco-color-accent-mark: #D8454F;
  --choco-color-accent-text: #B02E3A;
  --choco-color-bg: #FBF8F6;
  --choco-color-surface: #FFFFFF;
  --choco-color-cream: #F6EBDD;
  --choco-color-n1: #EFE6E8;
  --choco-color-n2: #8A7480;
  --choco-color-n3: #5E4A54;
  --choco-color-n4: #2D2128;
  --choco-color-n5: #1A0F14;
  --choco-color-success: #1F7A45;
  --choco-color-warning: #8A5700;
  --choco-color-error: #B3261E;
  --choco-font-family: "Pretendard", "Pretendard Variable", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;
  --choco-font-weight-medium: 500;
  --choco-font-weight-bold: 700;
  --choco-type-caption-size: 14px;
  --choco-type-caption-line-height: 1.5;
  --choco-type-caption-weight: 500;
  --choco-type-body-size: 16px;
  --choco-type-body-line-height: 1.5;
  --choco-type-body-weight: 500;
  --choco-type-bubble-size: 17px;
  --choco-type-bubble-line-height: 1.45;
  --choco-type-bubble-weight: 500;
  --choco-type-button-size: 19px;
  --choco-type-button-line-height: 1.3;
  --choco-type-button-weight: 700;
  --choco-type-title-size: 22px;
  --choco-type-title-line-height: 1.35;
  --choco-type-title-weight: 700;
  --choco-type-h2-size: 28px;
  --choco-type-h2-line-height: 1.3;
  --choco-type-h2-weight: 700;
  --choco-type-h1-size: 34px;
  --choco-type-h1-line-height: 1.25;
  --choco-type-h1-weight: 700;
  --choco-type-display-size: 40px;
  --choco-type-display-line-height: 1.2;
  --choco-type-display-weight: 700;
  --choco-space-4: 4px;
  --choco-space-8: 8px;
  --choco-space-12: 12px;
  --choco-space-16: 16px;
  --choco-space-20: 20px;
  --choco-space-24: 24px;
  --choco-space-32: 32px;
  --choco-radius-bubble: 20px;
  --choco-radius-bubble-join: 6px;
  --choco-radius-input: 24px;
  --choco-radius-button: 14px;
  --choco-radius-card: 16px;
  --choco-radius-sheet: 24px;
  --choco-radius-icon-ratio: 22%;
  --choco-radius-pill: 9999px;
  --choco-shadow-sm: 0 1px 2px rgba(26,15,20,0.10);
  --choco-shadow-md: 0 6px 16px rgba(26,15,20,0.12);
  --choco-dur-instant: 80ms;
  --choco-dur-fast: 160ms;
  --choco-dur-base: 240ms;
  --choco-dur-splash: 900ms;
  --choco-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --choco-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --choco-color-bg: #1D1418;
    --choco-color-surface: #2B1E24;
    --choco-color-primary: #F0DCE0;
    --choco-color-accent: #F0907A;
    --choco-color-text: #F6EEF0;
    --choco-color-text2: #BFAEB5;
    --choco-color-success: #5CC08A;
    --choco-color-warning: #E5B04A;
    --choco-color-error: #F28B82;
  }
}
[data-theme="dark"] {
  --choco-color-bg: #1D1418;
  --choco-color-surface: #2B1E24;
  --choco-color-primary: #F0DCE0;
  --choco-color-accent: #F0907A;
  --choco-color-text: #F6EEF0;
  --choco-color-text2: #BFAEB5;
  --choco-color-success: #5CC08A;
  --choco-color-warning: #E5B04A;
  --choco-color-error: #F28B82;
}
/* 대안: 크림 대신 쿨 화이트 바탕. <html data-surface="cool-white"> */
[data-surface="cool-white"] {
  --choco-color-bg: #F6F8FA;
  --choco-color-n1: #E8ECF1;
  --choco-color-n2: #7C8794;
  --choco-color-n3: #4F5A66;
  --choco-color-n4: #1F2630;
  --choco-color-n5: #11161C;
}
@media (prefers-reduced-motion: reduce) {
  :root { --choco-dur-instant: 0ms; --choco-dur-fast: 0ms; --choco-dur-base: 0ms; --choco-dur-splash: 0ms; }
}