/* =============================================
   디자인 토큰 — PRD §4.4 매핑
   NH 그린 + 카카오 옐로우 보조 + sinabrog 톤 차용
   ============================================= */

:root {
  /* 브랜드 — NH 농협 (메인) */
  --nh-green: #009A4E;
  --nh-green-deep: #007E40;
  --nh-green-light: #E6F8EE;
  --nh-green-soft: #C7EED9;

  /* 보조 — 카카오 옐로우 (CTA, 보조금) */
  --kp-yellow: #FEE500;
  --kp-yellow-deep: #FADA0A;

  /* 텍스트 (sinabrog #222/#777 → 더 진하게) */
  --txt-h1: #1A1A1A;
  --txt-h2: #3A3A3A;
  --txt-h3: #5C5C5C;
  --txt-mute: #8B8B8B;
  --txt-error: #E11D48;

  /* 배경/라인 */
  --bg-base: #F2F3F5;
  --bg-card: #FFFFFF;
  --bg-soft: #F7F8FA;
  --line: #ECEEF1;
  --line-strong: #DDE0E5;

  /* 정보성 보조 컬러 (sinabrog brand-1 톤) */
  --info-blue: #0058E9;
  --info-blue-soft: #DCEBFF;

  /* 상태 컬러 */
  --status-amber: #F59E0B;
  --status-amber-soft: #FFF3D6;
  --status-red: #EF4444;
  --status-red-soft: #FEE2E2;
  --status-purple: #A855F7;
  --status-purple-soft: #ECE0FF;
  --status-cyan: #06B6D4;
  --status-cyan-soft: #C8F1F8;

  /* 모션 */
  --ease-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* 그림자 */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.06);
  --shadow-fab: 0 6px 18px rgba(0, 154, 78, 0.35);
}

/* 다크 모드 */
.dark {
  --txt-h1: #F0F0F0;
  --txt-h2: #D5D8DE;
  --txt-h3: #A8ADB7;
  --txt-mute: #7B8290;
  --bg-base: #0F1115;
  --bg-card: #1A1D24;
  --bg-soft: #20232B;
  --line: #262A33;
  --line-strong: #2E333D;
  --nh-green-light: rgba(0, 154, 78, 0.18);
  --info-blue-soft: rgba(0, 88, 233, 0.18);
  --status-amber-soft: rgba(245, 158, 11, 0.18);
  --status-red-soft: rgba(239, 68, 68, 0.18);
  --status-purple-soft: rgba(168, 85, 247, 0.18);
  --status-cyan-soft: rgba(6, 182, 212, 0.18);
  --shadow-fab: 0 6px 18px rgba(0, 154, 78, 0.45);
}

html { font-size: 16px; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Noto Sans KR', sans-serif;
  background: var(--bg-base);
  color: var(--txt-h1);
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}

* { -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
::-webkit-scrollbar { width: 0; height: 0; }
::selection { background: rgba(254, 229, 0, 0.4); color: var(--txt-h1); }
[x-cloak] { display: none !important; }