/* variables.css - CSS 변수 (일본 전통색 기반 디자인 시스템) */
:root {
    /* 메인 컬러 - 藍色 ai-iro (깊은 일본 인디고) */
    --color-primary: #1B4965;
    --color-primary-dark: #0D2B3E;
    --color-primary-light: #2E6E8E;
    --color-primary-50: rgba(27, 73, 101, 0.05);
    --color-primary-100: rgba(27, 73, 101, 0.1);

    /* 액센트 - 紅狐 beni-kitsune (토리이 주홍) */
    --color-accent: #D4613E;
    --color-accent-dark: #B8502F;
    --color-accent-light: #E8896B;

    /* 특수 색상 */
    --color-sakura: #F2B5B5;
    --color-gold: #C4962C;

    /* 배경 - 和紙 와시페이퍼 톤 */
    --color-bg: #FEFCF9;
    --color-bg-light: #F7F4EF;
    --color-bg-dark: #EDE8E1;

    /* 텍스트 - 墨 sumi 먹색 */
    --color-text: #1C1917;
    --color-text-secondary: #78716C;
    --color-text-muted: #A8A29E;
    --color-text-white: #FFFFFF;

    /* 보더 */
    --color-border: #E0DCD5;
    --color-border-light: #EEEAE4;

    /* 상태 */
    --color-success: #10B981;
    --color-warning: #F59E0B;
    --color-danger: #EF4444;
    --color-info: #3B82F6;

    /* 폰트 */
    --font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-size-4xl: 2.25rem;
    --font-size-5xl: 3rem;

    /* 간격 */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;

    /* 둥글기 */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;

    /* 그림자 - 따뜻한 톤 이중 레이어 */
    --shadow-sm: 0 1px 3px rgba(28,25,23,0.06), 0 1px 2px rgba(28,25,23,0.04);
    --shadow-md: 0 4px 8px rgba(28,25,23,0.08), 0 2px 4px rgba(28,25,23,0.04);
    --shadow-lg: 0 12px 28px rgba(28,25,23,0.12), 0 4px 10px rgba(28,25,23,0.06);
    --shadow-xl: 0 20px 40px rgba(28,25,23,0.15), 0 8px 16px rgba(28,25,23,0.08);
    --shadow-accent-glow: 0 4px 14px rgba(212,97,62,0.3);
    --shadow-primary-glow: 0 4px 14px rgba(27,73,101,0.25);

    /* 전환 */
    --transition-fast: 150ms ease;
    --transition-base: 250ms ease;
    --transition-slow: 350ms ease;

    /* 컨테이너 */
    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1200px;

    /* 네비게이션/사이드바 */
    --nav-height: 64px;
    --sidebar-width: 260px;
}