/* brunch.heal7.com — Plan B 토큰 (라이트 기본 + 다크 오버라이드) */
:root {
  /* Brand — 진파랑 단일 테마 (copper 사용처는 토큰 alias로 자동 전환) */
  --brand-indigo:      #1F3A8A;
  --brand-indigo-soft: #2E50B5;
  --brand-indigo-deep: #16275E;
  --brand-copper:      #1F3A8A;       /* alias: 모든 보조색 사용처를 인디고로 흡수 */
  --brand-copper-soft: #2E50B5;

  /* Semantic — LIGHT (라이트 모드 = 순백색 배경, 글래스는 헤일로로 가시화) */
  --bg:              #FFFFFF;             /* 화이트 토글에서는 배경 = 순백 */
  --bg-elev:         #FFFFFF;
  --surface:         #FFFFFF;
  --surface-glass:   rgba(255,255,255,0.55);   /* 0.62 → 0.55 (blur 가시화) */
  --surface-glass-2: rgba(255,255,255,0.74);
  --ink:             #0A1530;             /* 본문 강화 — 안개 제거 */
  --ink-strong:      #050B1C;
  --ink-soft:        #25324C;             /* desc/lede에 mute 대신 사용 */
  --ink-mute:        #4A5874;             /* mute도 더 진하게 */
  --ink-faint:       #7585A2;
  --accent:          var(--brand-indigo);
  --accent-soft:     var(--brand-indigo-soft);  /* 동(銅) 제거, 인디고 soft로 통일 */
  --accent-on:       #FFFFFF;
  --line:            rgba(31,58,138,0.28);     /* 12% → 28% — 윤곽 또렷 */
  --line-strong:     rgba(31,58,138,0.45);     /* 22% → 45% */
  --ring:            rgba(31,58,138,0.45);

  --ok:              #1E7A5A;
  --warn:            #C9821F;
  --err:             #B6303F;

  /* Shadows — 부각 강화 */
  --shadow-glass:        0 10px 32px rgba(14,28,64,0.18), 0 1px 0 rgba(255,255,255,0.85) inset;
  --shadow-glass-strong: 0 22px 56px rgba(14,28,64,0.26), 0 1px 0 rgba(255,255,255,0.92) inset;
  --shadow-glow:         0 0 0 1.5px rgba(31,58,138,0.32), 0 10px 28px rgba(31,58,138,0.26);
  --shadow-card:         0 4px 12px rgba(14,28,64,0.12), 0 18px 40px rgba(14,28,64,0.16);

  /* Radii */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 56px;
  --space-16: 72px;

  /* Typography */
  --font-sans:  "Pretendard Variable","Pretendard","Noto Sans KR",
                ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-serif: "Source Serif 4","Source Serif Pro","Lora",
                "Noto Serif KR","Nanum Myeongjo",ui-serif,Georgia,serif;
  --font-mono:  "JetBrains Mono","Fira Code",ui-monospace,SFMono-Regular,Menlo,monospace;

  --fz-12: 12px; --fz-13: 13px; --fz-14: 14px; --fz-15: 15px;
  --fz-16: 16px; --fz-18: 18px; --fz-20: 20px; --fz-24: 24px;
  --fz-28: 28px; --fz-32: 32px; --fz-40: 40px; --fz-48: 48px; --fz-56: 56px;

  --lh-tight: 1.18;
  --lh-snug:  1.35;
  --lh-base:  1.6;
  --lh-loose: 1.85;

  /* Motion */
  --easing-standard: cubic-bezier(.2,.8,.2,1);
  --easing-emphasis: cubic-bezier(.25,1,.3,1);
  --easing-enter:    cubic-bezier(0,.0,.2,1);
  --easing-exit:     cubic-bezier(.4,0,1,1);
  --dur-1: 120ms;
  --dur-2: 180ms;
  --dur-3: 240ms;
  --dur-4: 360ms;
  --dur-5: 520ms;

  /* Z */
  --z-nav: 50;
  --z-popover: 80;
  --z-modal: 100;
  --z-toast: 120;

  /* Container */
  --container: 1200px;
  --container-narrow: 880px;
}

:root[data-theme="dark"] {
  --bg:              #050912;
  --bg-elev:         #0A1226;
  --surface:         #0E1730;
  --surface-glass:   rgba(18,28,54,0.50);
  --surface-glass-2: rgba(22,34,64,0.70);
  --ink:             #F2F6FF;             /* 또렷한 흰 */
  --ink-strong:      #FFFFFF;
  --ink-soft:        #C9D5EE;
  --ink-mute:        #B0C2DF;             /* 9DB0CD → B0C2DF */
  --ink-faint:       #6E809E;
  --accent:          #8AB4F8;
  --accent-soft:     #5478D9;        /* 다크에서도 인디고 라이트 톤 */
  --accent-on:       #0A1226;
  --line:            rgba(180,200,235,0.32);   /* 14% → 32% */
  --line-strong:     rgba(180,200,235,0.55);   /* 28% → 55% */
  --ring:            rgba(138,180,248,0.55);

  --ok:   #6FD7AE;
  --warn: #F0B879;
  --err:  #F58591;

  --shadow-glass:        0 10px 36px rgba(0,0,0,0.65), 0 1px 0 rgba(255,255,255,0.08) inset, 0 0 0 1px rgba(138,180,248,0.10) inset;
  --shadow-glass-strong: 0 24px 64px rgba(0,0,0,0.75), 0 1px 0 rgba(255,255,255,0.10) inset, 0 0 0 1px rgba(138,180,248,0.16) inset;
  --shadow-glow:         0 0 0 1.5px rgba(138,180,248,0.45), 0 12px 32px rgba(138,180,248,0.28);
  --shadow-card:         0 4px 12px rgba(0,0,0,0.5),   0 22px 48px rgba(0,0,0,0.65);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 0ms; --dur-2: 0ms; --dur-3: 0ms; --dur-4: 0ms; --dur-5: 0ms;
  }
}