/* 디자인 토큰. BlogDeployer Theme.cs 와 동일한 라이트톤 + 인디고 액센트.
   여기 값만 바꾸면 전체 톤이 일관되게 바뀜. */

:root {
  /* ── 배경 */
  --c-app-bg: #F6F7FB;
  --c-card-bg: #FFFFFF;
  --c-sidebar-bg: #FFFFFF;
  --c-header-bg: #FFFFFF;
  --c-surface: #F8FAFC;

  /* ── 보더 */
  --c-border: #E5E7EB;
  --c-border-soft: #F1F5F9;
  --c-border-strong: #CBD5E1;

  /* ── 텍스트 */
  --c-text: #0F172A;
  --c-text-secondary: #475569;
  --c-text-muted: #94A3B8;

  /* ── 액센트 (인디고) */
  --c-accent: #6366F1;
  --c-accent-hover: #4F46E5;
  --c-accent-soft: #EEF2FF;
  --c-accent-text: #4338CA;

  /* ── 시맨틱 */
  --c-success: #059669;
  --c-success-soft: #ECFDF5;
  --c-warning: #D97706;
  --c-warning-soft: #FFFBEB;
  --c-danger: #DC2626;
  --c-danger-soft: #FEF2F2;
  --c-danger-text: #B91C1C;

  /* ── 호버 */
  --c-hover: #F1F5F9;

  /* ── 라디우스 */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-pill: 999px;

  /* ── 그림자 */
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-md: 0 4px 12px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-lg: 0 16px 40px rgba(15, 23, 42, .12), 0 2px 6px rgba(15, 23, 42, .06);

  /* ── 타이포 */
  --f-sans: 'Pretendard', 'Segoe UI Variable', 'Segoe UI', '맑은 고딕', system-ui, sans-serif;
  --f-mono: 'JetBrains Mono', 'Consolas', 'D2Coding', monospace;

  --fs-h1: 22px;
  --fs-h2: 17px;
  --fs-h3: 14px;
  --fs-body: 13.5px;
  --fs-small: 12.5px;

  /* ── 레이아웃 */
  --sidebar-w: 248px;
  --topbar-h: 64px;
  --container-pad: 28px;

  /* ── 트랜지션 */
  --t-fast: 120ms cubic-bezier(.4, 0, .2, 1);
  --t-base: 180ms cubic-bezier(.4, 0, .2, 1);
}