/* 치과 검색실 — 디자인 토큰 v2
   폰트: Pretendard Variable woff2를 /static/fonts/ 에 자체 호스팅 (CSP: font-src 'self') */
@font-face {
  font-family: "Pretendard";
  src: url("/static/fonts/PretendardVariable.woff2") format("woff2-variations");
  font-weight: 45 920;
  font-display: swap;
}

:root {
  /* 브랜드 */
  --c-ink: #103e4b; /* 잉크 틸: 본문·주 버튼 */
  --c-ink-hover: #1b5464;
  --c-ink-soft: #2c5966; /* 잉크 배경 위 보조면 */
  --c-signal: #087f8c; /* 시그널 틸: 강조·링크·차트(우리) */
  --c-signal-hover: #066a75;
  --c-signal-text: var(--c-signal-hover); /* AA on mint backgrounds */
  --c-bg: #fbfdfd; /* 에나멜 화이트 */
  --c-surface: #ffffff;
  --c-sunken: #f3f8f8;
  --c-wash: #e6f3f4; /* 민트 워시 */
  --c-lime: #cde98a; /* 형광펜: 우리 치과 하이라이트 */
  --c-lime-strong: #b9dc63;
  --c-muted: #5f747c; /* 보조 텍스트 (대비 4.9:1 on bg) */
  --c-muted-text: #536970; /* AA on mint and highlighted rows */
  --c-faint: #8a9ca2; /* 비활성·축 라벨 — 본문 금지 */
  --c-line: #dde8ea;
  --c-line-strong: #c4d6da;
  --c-on-ink: #ffffff;
  --c-on-ink-muted: #b8d3d9;
  /* 상태: 배경 / 글자 (색 + 아이콘 + 글로 함께 표시) */
  --c-good-bg: #eaf2db;
  --c-good: #45601b;
  --c-warn-bg: #fff0dc;
  --c-warn: #8a5912;
  --c-bad-bg: #fce8e7;
  --c-bad: #ad3b37;
  --c-info-bg: var(--c-wash);
  --c-info: var(--c-signal-text);
  /* 차트: 우리만 강조, 나머지 중립 */
  --chart-ours: var(--c-signal);
  --chart-other: #a9bcc1;
  --chart-other-2: #c9d7da;
  --chart-other-3: #e2eaec;
  --chart-grid: #e8eff0;
  /* 출처 구성 */
  --src-own: var(--c-signal);
  --src-comp: #7f979e;
  --src-plat: #a9bcc1;
  --src-earn: #d3dfe1;

  /* 서체 */
  --font-sans:
    "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-11: 11px;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-15: 15px;
  --fs-17: 17px;
  --fs-20: 20px;
  --fs-24: 24px;
  --fs-30: 30px;
  --fs-40: 40px;
  --fs-56: 56px;
  --lh-tight: 1.25;
  --lh-snug: 1.4;
  --lh-body: 1.6;
  --tr-tight: -0.02em;
  --tr-display: -0.035em;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-heavy: 800;

  /* 간격 (4px 기준) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-14: 56px;
  --sp-20: 80px;
  --sp-30: 120px;

  /* 반경 */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-pill: 999px;

  /* 그림자 (잉크 틸 기반) */
  --sh-1: 0 1px 2px rgba(16, 62, 75, 0.06);
  --sh-2: 0 2px 6px rgba(16, 62, 75, 0.06), 0 8px 24px rgba(16, 62, 75, 0.06);
  --sh-3: 0 24px 64px rgba(16, 62, 75, 0.18);
  --focus-ring: 0 0 0 3px rgba(8, 127, 140, 0.35);

  /* 레이아웃 */
  --sidebar-w: 248px;
  --topbar-h: 60px;
  --content-max: 1344px;
  --landing-max: 1200px;
  --dur-fast: 120ms;
  --dur: 200ms;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* 선택: 다크 모드는 토큰만 교체 */
@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --c-ink: #e3f0f2;
    --c-ink-hover: #ffffff;
    --c-signal: #4fc3cf;
    --c-signal-hover: #7ad5de;
    --c-bg: #0d1d22;
    --c-surface: #132830;
    --c-sunken: #0f2228;
    --c-wash: #163640;
    --c-muted: #9db3ba;
    --c-muted-text: var(--c-muted);
    --c-line: #24414a;
    --c-line-strong: #2f525c;
    --c-on-ink: #0d1d22;
    --c-good-bg: #1f3218;
    --c-good: #b6d98a;
    --c-warn-bg: #3a2b12;
    --c-warn: #f0c37a;
    --c-bad-bg: #3d1c1b;
    --c-bad: #f19c97;
    --chart-other: #4b6770;
    --chart-grid: #1d363e;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

:root {
  --c-bad-line: #f1c9c6;
  --c-warn-line: #f0d6a8;
  --c-nav: #334f58;
  --c-hero-side: #174a58;
  --c-hero-text: #cfe1e5;
  --c-ours-bg: #f1f8e0;
  --c-track: #edf3f4;
  --c-shimmer: #f7fafa;
  --c-topbar: rgba(251, 253, 253, 0.9);
  --c-scrim: rgba(16, 62, 75, 0.45);
  --c-backdrop: rgba(16, 62, 75, 0.5);
  --c-shadow: rgba(16, 62, 75, 0.2);
  --c-shadow-heavy: rgba(16, 62, 75, 0.25);
  --c-shadow-soft: rgba(16, 62, 75, 0.12);
}