/**
 * CSS 변수 정의 — HIVELINK 디자인 토큰
 * 컨셉: "현장 원장(Field Ledger) × 대화형 AI"
 * 브랜드 색상(핑크 #E91E63 / 시안 #00BCD4)을 유지하되,
 * 핑크는 "의미가 부여된 데이터"의 마커로, 시안은 "AI/시스템 응답"의 색으로 역할을 부여합니다.
 */

:root {
    /* 브랜드 */
    --hive: #E91E63;            /* 의미 마커 — 절제해서 사용 */
    --hive-deep: #C2185B;
    --hive-soft: #FCE7EF;       /* 핑크 틴트 배경 */
    --signal: #00BCD4;          /* AI/시스템 응답 */
    --signal-deep: #0097A7;
    --signal-soft: #E0F7FA;

    /* 뉴트럴 */
    --ink: #141A21;             /* 본문/헤드라인 — 블루 블랙 */
    --mute: #5A6472;            /* 보조 텍스트 */
    --faint: #8B95A3;           /* 캡션/메타 */
    --paper: #F7F8FA;           /* 쿨 페이퍼 배경 */
    --white: #FFFFFF;
    --line: #E4E7EC;            /* 헤어라인 */
    --line-dark: #CDD3DC;

    /* 다크 패널 (터미널/AI 블록) */
    --panel: #0D131A;
    --panel-2: #131B24;
    --panel-line: #24303D;
    --panel-text: #C6D0DB;
    --panel-faint: #64748B;

    /* 타이포 */
    --font-sans: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Noto Sans KR', sans-serif;
    --font-mono: 'IBM Plex Mono', 'SF Mono', Consolas, monospace;

    /* 레이아웃 */
    --max-w: 1200px;
    --radius: 12px;
    --radius-sm: 8px;
    --shadow-sm: 0 1px 2px rgba(20, 26, 33, 0.05), 0 2px 8px rgba(20, 26, 33, 0.04);
    --shadow-md: 0 4px 12px rgba(20, 26, 33, 0.06), 0 12px 32px rgba(20, 26, 33, 0.08);
    --shadow-panel: 0 24px 64px rgba(13, 19, 26, 0.35);

    /* 하위 호환 (구 변수명 유지) */
    --primary-color: var(--hive);
    --primary-light: #F06292;
    --primary-dark: var(--hive-deep);
    --secondary-color: #FF4081;
    --accent-color: var(--signal);
    --success-color: #4CAF50;
    --text-dark: var(--ink);
    --text-light: var(--mute);
    --bg-light: var(--paper);
    --bg-white: var(--white);
    --border-light: var(--line);
}