/* === first.css ===  */
/**
 * 플랫폼 CRM 스타일시트
 * Version: 2.0.0
 */

/* CSS Variables */
:root {
    /* Brand Colors - Calm Slate Blue */
    --primary-50: #f0f4f8;
    --primary-100: #d9e2ec;
    --primary-200: #bcccdc;
    --primary-300: #9fb3c8;
    --primary-400: #829ab1;
    --primary-500: #627d98;
    --primary-600: #486581;
    --primary-700: #334e68;
    --primary-800: #243b53;
    --primary-900: #102a43;

    /* Primary shortcuts */
    --primary: #627d98;
    --primary-hover: #486581;
    --primary-light: #829ab1;
    --primary-bg: rgba(98, 125, 152, 0.05);
    --primary-bg-strong: rgba(98, 125, 152, 0.1);
    --primary-ring: rgba(98, 125, 152, 0.15);

    /* Accent Colors - Cyan for highlights */
    --accent-50: #ecfeff;
    --accent-100: #cffafe;
    --accent-200: #a5f3fc;
    --accent-400: #22d3ee;
    --accent-500: #06b6d4;
    --accent-600: #0891b2;

    /* Semantic Colors */
    --success-50: #f0fdf4;
    --success-100: #dcfce7;
    --success-500: #22c55e;
    --success-600: #16a34a;
    --success: #16a34a;
    --success-hover: #15803d;
    --success-bg: rgba(22, 163, 74, 0.08);

    --warning-50: #fffbeb;
    --warning-100: #fef3c7;
    --warning-500: #f59e0b;
    --warning-600: #d97706;
    --warning: #d97706;
    --warning-bg: rgba(217, 119, 6, 0.08);

    --danger-50: #fef2f2;
    --danger-100: #fee2e2;
    --danger-500: #ef4444;
    --danger-600: #dc2626;
    --danger: #dc2626;
    --danger-hover: #b91c1c;
    --danger-bg: rgba(220, 38, 38, 0.08);

    --info-50: #eff6ff;
    --info-100: #dbeafe;
    --info-500: #3b82f6;
    --info-600: #2563eb;
    --info: #2563eb;
    --info-bg: rgba(37, 99, 235, 0.08);

    /* Neutral Palette - Slate for sophistication */
    --slate-50: #f8fafc;
    --slate-100: #f1f5f9;
    --slate-200: #e2e8f0;
    --slate-300: #cbd5e1;
    --slate-400: #94a3b8;
    --slate-500: #64748b;
    --slate-600: #475569;
    --slate-700: #334155;
    --slate-800: #1e293b;
    --slate-900: #0f172a;
    --slate-950: #020617;

    /* Legacy gray mapping */
    --gray-50: var(--slate-50);
    --gray-100: var(--slate-100);
    --gray-200: var(--slate-200);
    --gray-300: var(--slate-300);
    --gray-400: var(--slate-400);
    --gray-500: var(--slate-500);
    --gray-600: var(--slate-600);
    --gray-700: var(--slate-700);
    --gray-800: var(--slate-800);
    --gray-900: var(--slate-900);

    /* Surfaces */
    --bg: #f8fafc;
    --bg-elevated: #ffffff;
    --bg-sunken: #f1f5f9;
    --card: #ffffff;
    --card-hover: #fafafa;
    --text: #1e293b;
    --text-secondary: #374151;
    --text-subtle: #6b7280;
    --text-muted: #9ca3af;
    --text-inverted: #ffffff;
    --border: #e2e8f0;
    --border-strong: #cbd5e1;
    --border-subtle: #f1f5f9;

    /* Aliases for component compatibility */
    --surface-secondary: var(--card);
    --surface-tertiary: var(--bg-sunken);
    --border-color: var(--border);
    --border-light: var(--border);
    --text-primary: var(--text);
    --text-tertiary: var(--text-muted);
    --color-primary: var(--primary);

    /* Spacing Scale (4px base) */
    --sp-px: 1px;
    --sp-0: 0;
    --sp-0-5: 0.125rem;
    --sp-1: 0.25rem;
    --sp-1-5: 0.375rem;
    --sp-2: 0.5rem;
    --sp-2-5: 0.625rem;
    --sp-3: 0.75rem;
    --sp-3-5: 0.875rem;
    --sp-4: 1rem;
    --sp-5: 1.25rem;
    --sp-6: 1.5rem;
    --sp-7: 1.75rem;
    --sp-8: 2rem;
    --sp-9: 2.25rem;
    --sp-10: 2.5rem;
    --sp-11: 2.75rem;
    --sp-12: 3rem;
    --sp-14: 3.5rem;
    --sp-16: 4rem;
    --sp-20: 5rem;
    --sp-24: 6rem;

    /* Typography */
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
    --font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    --font: var(--font-sans);

    /* Font Sizes */
    --text-xs: 0.75rem;      /* 12px */
    --text-sm: 0.8125rem;    /* 13px */
    --text-base: 0.875rem;   /* 14px - main body */
    --text-md: 0.9375rem;    /* 15px */
    --text-lg: 1rem;         /* 16px */
    --text-xl: 1.125rem;     /* 18px */
    --text-2xl: 1.25rem;     /* 20px */
    --text-3xl: 1.5rem;      /* 24px */
    --text-4xl: 1.875rem;    /* 30px */
    --text-5xl: 2.25rem;     /* 36px */

    /* Line Heights */
    --leading-none: 1;
    --leading-tight: 1.25;
    --leading-snug: 1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --leading-loose: 2;

    /* Font Weights */
    --font-thin: 100;
    --font-light: 300;
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    --font-black: 900;

    /* Letter Spacing */
    --tracking-tighter: -0.05em;
    --tracking-tight: -0.025em;
    --tracking-normal: 0;
    --tracking-wide: 0.025em;
    --tracking-wider: 0.05em;

    /* Shadows - Layered depth */
    --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px -1px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.03);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.06), 0 4px 6px -4px rgba(0, 0, 0, 0.04);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
    --shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
    --shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.03);
    --shadow-primary: 0 2px 8px 0 rgba(98, 125, 152, 0.15);
    --shadow-primary-lg: 0 4px 16px 0 rgba(98, 125, 152, 0.2);
    --shadow-card: 0 2px 8px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
    --shadow-card-hover: 0 4px 16px rgba(0,0,0,0.1), 0 2px 6px rgba(0,0,0,0.06);

    /* Border Radius */
    --radius-none: 0;
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;
    --radius-2xl: 16px;
    --radius-3xl: 24px;
    --radius-full: 9999px;

    /* Transitions & Animations */
    --duration-instant: 50ms;
    --duration-fast: 100ms;
    --duration-normal: 150ms;
    --duration-moderate: 200ms;
    --duration-slow: 300ms;
    --duration-slower: 400ms;
    --duration-slowest: 500ms;

    --ease-linear: linear;
    --ease-in: cubic-bezier(0.4, 0, 1, 1);
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
    --ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);

    /* Shorthand transitions */
    --ease-fast: var(--duration-fast) var(--ease-out);
    --ease-normal: var(--duration-normal) var(--ease-out);
    --ease-slow: var(--duration-slow) var(--ease-out);

    /* Z-Index Scale */
    --z-below: -1;
    --z-base: 0;
    --z-dropdown: 50;
    --z-sticky: 100;
    --z-fixed: 200;
    --z-overlay: 300;
    --z-modal: 400;
    --z-popover: 500;
    --z-tooltip: 600;
    --z-toast: 700;
    --z-max: 9999;

    /* Gradients - Calm & Subtle */
    --gradient-primary: linear-gradient(135deg, #627d98 0%, #829ab1 100%);
    --gradient-primary-vivid: linear-gradient(135deg, #486581 0%, #627d98 100%);
    --gradient-accent: linear-gradient(135deg, #06b6d4 0%, #22d3ee 100%);
    --gradient-warm: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
    --gradient-danger: linear-gradient(135deg, #dc2626 0%, #ef4444 100%);
    --gradient-success: linear-gradient(135deg, #16a34a 0%, #22c55e 100%);
    --gradient-dark: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    --gradient-glass: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.85) 100%);
    --gradient-header: linear-gradient(135deg, #334e68 0%, #486581 100%);

    /* Glassmorphism Variables */
    --glass-bg: rgba(255, 255, 255, 0.35);
    --glass-bg-strong: rgba(255, 255, 255, 0.50);
    --glass-bg-subtle: rgba(255, 255, 255, 0.20);
    --glass-border: rgba(0, 0, 0, 0.08);
    --glass-border-strong: rgba(0, 0, 0, 0.12);
    --glass-blur: blur(20px);
    --glass-blur-strong: blur(30px);
    --glass-blur-subtle: blur(12px);
    --glass-shadow: 0 8px 32px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.06);
    --glass-shadow-hover: 0 16px 48px rgba(0,0,0,0.14), 0 6px 16px rgba(0,0,0,0.08);
    --glass-shadow-elevated: 0 24px 64px rgba(0,0,0,0.18), 0 8px 24px rgba(0,0,0,0.10);
    --glass-inner-glow: inset 0 1px 0 rgba(255,255,255,0.8), inset 0 0 20px rgba(255,255,255,0.15);
    --glass-edge-light: inset 0 1px 0 rgba(255,255,255,0.7);
    --accent-glow: 0 0 24px rgba(6,182,212,0.25);
    --accent-glow-strong: 0 0 40px rgba(6,182,212,0.35);
    --app-bg-gradient: linear-gradient(135deg, #f1f5f9 0%, #e8eff5 25%, #f0f4f8 50%, #edf2f7 75%, #f5f7fa 100%);
    --app-bg-mesh: radial-gradient(ellipse at 15% 80%, rgba(99,132,169,0.08) 0%, transparent 55%),
                   radial-gradient(ellipse at 85% 15%, rgba(139,92,246,0.05) 0%, transparent 55%),
                   radial-gradient(ellipse at 50% 50%, rgba(100,116,139,0.04) 0%, transparent 50%),
                   radial-gradient(ellipse at 75% 70%, rgba(59,130,246,0.10) 0%, transparent 45%);
    --glass-transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;

    /* Container Widths */
    --container-xs: 320px;
    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1280px;
    --container-2xl: 1536px;
}


/* Reset & Base */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

body {
    font-family: var(--font);
    background: var(--app-bg-gradient);
    background-size: 400% 400%;
    background-attachment: fixed;
    animation: bgGradientShift 25s ease infinite;
    color: var(--text);
    line-height: 1.7;
    min-height: 100vh;
    overflow-x: hidden;
}

@keyframes bgGradientShift {
    0%, 100% { background-position: 0% 50%; }
    25% { background-position: 50% 0%; }
    50% { background-position: 100% 50%; }
    75% { background-position: 50% 100%; }
}

body::before {
    content: '';
    position: fixed;
    inset: 0;
    background: var(--app-bg-mesh);
    pointer-events: none;
    z-index: -1;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    line-height: 1.3;
    color: var(--text);
}

h2 { font-size: 1.375rem; }
h3 { font-size: 1.125rem; }
h4 { font-size: 1rem; }

img {
    max-width: 100%;
    height: auto;
}

/* 이미지 lazy load 준비 */
img[loading="lazy"] {
    opacity: 0;
    transition: opacity var(--ease-slow);
}
img[loading="lazy"].loaded,
img[loading="lazy"][src] {
    opacity: 1;
}

input, select, textarea, button {
    font-family: inherit;
    font-size: inherit;
}

a {
    color: var(--primary);
    text-decoration: none;
}


/* 로그인 화면 */
.login-screen {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 50%, #f1f5f9 100%);
    padding: var(--sp-4);
    position: relative;
    overflow: hidden;
}

/* Subtle decorative elements */
.login-screen::before {
    content: '';
    position: absolute;
    width: 800px;
    height: 800px;
    background: radial-gradient(circle, rgba(59, 130, 246, 0.08) 0%, transparent 60%);
    top: -300px;
    right: -200px;
    animation: floatOrb1 25s ease-in-out infinite;
    pointer-events: none;
}

.login-screen::after {
    content: '';
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(99, 102, 241, 0.06) 0%, transparent 60%);
    bottom: -200px;
    left: -150px;
    animation: floatOrb2 30s ease-in-out infinite;
    pointer-events: none;
}

@keyframes floatOrb1 {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(30px, 20px) scale(1.05); }
    66% { transform: translate(-20px, 30px) scale(0.95); }
}

@keyframes floatOrb2 {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(-25px, -15px) scale(0.95); }
    66% { transform: translate(20px, -25px) scale(1.05); }
}

.login-box {
    width: 100%;
    max-width: 400px;
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow:
        0 20px 40px -12px rgba(0, 0, 0, 0.12),
        0 8px 16px -8px rgba(0, 0, 0, 0.08);
    padding: 48px 40px 40px;
    text-align: center;
    position: relative;
    z-index: 1;
    animation: loginSlideUp 0.7s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes loginSlideUp {
    from {
        opacity: 0;
        transform: translateY(40px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.login-logo {
    display: block;
    margin: 0 auto 20px;
    height: 56px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.08));
}

.login-box h2 {
    font-size: 22px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 32px;
    letter-spacing: -0.02em;
}

.login-box .form-group {
    margin-bottom: 20px;
    text-align: left;
}

.login-box .form-group label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    margin-bottom: 8px;
    letter-spacing: 0.01em;
}

.login-box .form-group input {
    width: 100%;
    padding: 14px 16px;
    font-size: 15px;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
    color: #1e293b;
    transition: all 0.2s ease;
    min-height: 50px;
}

.login-box .form-group input:hover {
    border-color: #cbd5e1;
    background: #ffffff;
}

.login-box .form-group input:focus {
    outline: none;
    border-color: #3b82f6;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.login-box .form-group input::placeholder {
    color: #94a3b8;
}

.login-box .btn-primary {
    width: 100%;
    padding: 14px 24px;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    border: none;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-top: 8px;
    min-height: 50px;
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.25);
}

.login-box .btn-primary:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.35);
}

.login-box .btn-primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.25);
}

.login-box .btn-primary:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}

.login-box .error-msg {
    margin-top: 20px;
    padding: 12px 16px;
    font-size: 13px;
    font-weight: 500;
    color: #dc2626;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 10px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.login-box .error-msg::before {
    content: '⚠';
    font-size: 14px;
}

.login-credit {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    color: #94a3b8;
    letter-spacing: 0.3px;
    white-space: nowrap;
    user-select: none;
    font-weight: 500;
}


/* 메인 앱 컨테이너 */
.main-app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}


/* 앱 헤더 */
.app-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 var(--sp-6);
    height: 64px;
    background: #ffffff;
    color: var(--text);
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
    border-bottom: 1px solid #f1f5f9;
}

.header-left {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.header-logo {
    height: 36px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    flex-shrink: 0;
    min-width: 0;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.1));
    transition: transform var(--duration-normal) var(--ease-out);
}

.header-logo:hover {
    transform: scale(1.05);
}

.header-title {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text);
    letter-spacing: var(--tracking-tight);
}

.header-right {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
}

.user-info {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    white-space: nowrap;
    font-weight: 500;
    padding: var(--sp-2) var(--sp-3);
    background: #f1f5f9;
    border-radius: var(--radius-full);
}

.header-right .btn-outline {
    color: var(--text-secondary);
    border: 1.5px solid rgba(0, 0, 0, 0.12);
    font-size: var(--text-sm);
    font-weight: 600;
    padding: var(--sp-2) var(--sp-4);
    min-height: 36px;
    border-radius: var(--radius-lg);
    background: #ffffff;
    transition: all var(--duration-normal) var(--ease-out);
}

.header-right .btn-outline:hover {
    color: var(--text);
    border-color: rgba(0, 0, 0, 0.2);
    background: #f8fafc;
    transform: translateY(-1px);
}


/* 3차콜 경고 배너 */
.warning-banner {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-4);
    background: var(--danger);
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 600;
    flex-shrink: 0;
    animation: warningPulse 2s ease-in-out infinite;
}

@keyframes warningPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.88; }
}

.warning-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    background: rgba(255,255,255,0.25);
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    font-weight: 800;
    flex-shrink: 0;
}

.btn-dismiss {
    margin-left: auto;
    background: rgba(255,255,255,0.2);
    border: none;
    color: #ffffff;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background var(--ease-fast);
    min-height: 32px;
}

.btn-dismiss:hover {
    background: rgba(255,255,255,0.35);
}


/* 탭 네비게이션 - Premium Design */
.tab-nav {
    display: flex;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-6);
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--glass-border);
    box-shadow: var(--glass-edge-light);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex-shrink: 0;
    position: relative;
}

.tab-nav::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border), transparent);
}

.tab-nav::-webkit-scrollbar {
    display: none;
}

.tab-btn {
    padding: var(--sp-3) var(--sp-5);
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--text-subtle);
    background: transparent;
    border: none;
    border-radius: var(--radius-xl);
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    white-space: nowrap;
    min-height: 44px;
    position: relative;
    letter-spacing: var(--tracking-wide);
}

.tab-btn:hover {
    color: var(--text);
    background: var(--bg-sunken);
}

.tab-btn.active {
    color: var(--primary-700);
    background: var(--primary-bg-strong);
}

.tab-btn.active::after {
    content: '';
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 2px;
    background: var(--primary);
    border-radius: var(--radius-full);
}


/* 탭 콘텐츠 */
.tab-content {
    display: none;
    flex: 1 1 0;
    min-height: 0;
    padding: var(--sp-6);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    background: #f8fafc;
}

.tab-content.active {
    display: flex;
    flex-direction: column;
    animation: tabFadeIn 0.35s var(--ease-out);
}

@keyframes tabFadeIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* 필터 바 */
.filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
    position: relative;
    z-index: 10;
    flex-wrap: wrap;
    flex-shrink: 0;
    background: var(--glass-bg-subtle);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--radius-xl);
    border: 1px solid var(--glass-border);
}

.filter-buttons {
    display: flex;
    gap: var(--sp-1);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    scrollbar-width: none;
}

.filter-buttons::-webkit-scrollbar {
    display: none;
}

.filter-btn {
    padding: 0.375rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-subtle);
    background: var(--gray-100);
    border: 1px solid transparent;
    border-radius: var(--radius-full);
    cursor: pointer;
    transition: all var(--ease-fast);
    white-space: nowrap;
    min-height: 36px;
}

.filter-btn:hover {
    color: var(--text);
    background: var(--gray-200);
}

.filter-btn.active {
    color: var(--gray-900);
    background: var(--primary);
    border-color: var(--primary);
}

.filter-divider {
    width: 1px;
    height: 20px;
    background: var(--border);
    margin: 0 2px;
    flex-shrink: 0;
}

.filter-btn-meeting.active {
    background: var(--success);
    border-color: var(--success);
}

.filter-btn-payment.active {
    background: var(--accent-600);
    border-color: var(--accent-600);
}

.filter-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    flex-shrink: 0;
}

.search-input {
    padding: 0.5rem 0.875rem;
    font-size: 0.875rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
    color: var(--text);
    width: 200px;
    min-height: 40px;
    transition: border-color var(--ease-fast), box-shadow var(--ease-fast);
}

.search-input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.search-input::placeholder {
    color: var(--text-muted);
}


/* 가망 목록 (무한스크롤) */
.lead-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: var(--sp-4);
}

/* 리드 카드 */
.lead-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    overflow: visible;
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    position: relative;
}

.lead-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    border-color: rgba(59, 130, 246, 0.2);
}

.lead-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.lead-card:active {
    transform: translateY(0);
}

/* 특이사항 있는 카드: 2열 레이아웃 */
/* 특이사항 - 인라인 배치 (카드 중앙) */
.lead-card-notes-inline {
    margin: var(--sp-2) 0;
    padding: var(--sp-3);
    background: linear-gradient(135deg, var(--primary-50) 0%, #f0f4f8 100%);
    border-radius: var(--radius-md);
    border-left: 3px solid var(--primary-400);
}

.lead-card-notes-inline .notes-label {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--primary-600);
    margin-bottom: var(--sp-1);
}

.lead-card-notes-inline .notes-text {
    font-size: 0.85rem;
    color: var(--text-primary);
    line-height: 1.7;
    margin: 0;
    word-break: break-word;
    white-space: pre-line;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
}

/* 모바일에서는 세로 배치 */
@media (max-width: 768px) {
    .lead-card-notes-inline .notes-text {
        -webkit-line-clamp: 4;
    }
}

.lead-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-4) var(--sp-5);
    border-bottom: 1px solid var(--glass-border);
    background: transparent;
}

.lead-card-header strong {
    font-size: var(--text-md);
    font-weight: 700;
    color: var(--text);
    letter-spacing: var(--tracking-tight);
}

.lead-card-header .status-badge {
    font-size: var(--text-xs);
    font-weight: 600;
    padding: var(--sp-1) var(--sp-2-5);
    border-radius: var(--radius-full);
}

.lead-card-body {
    padding: var(--sp-4) var(--sp-5);
    font-size: var(--text-sm);
    color: var(--text-subtle);
    line-height: 1.6;
}

/* 전화번호 + 빠른 액션 행 */
.lead-card-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    flex-wrap: wrap;
    margin-bottom: var(--sp-2);
}

/* 빠른 액션 버튼 그룹 */
.lead-quick-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-left: auto;
}

.lead-quick-actions select,
.lead-quick-actions button {
    font-size: 0.75rem;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

/* 콜 상태 셀렉트 */
.quick-call-select {
    padding: 4px 8px;
    border: 1px solid var(--gray-300);
    background: var(--bg-elevated);
    color: var(--text-secondary);
    font-weight: 500;
}
.quick-call-select:hover {
    border-color: var(--primary-400);
    background: var(--primary-50);
}
.quick-call-select:focus {
    outline: none;
    border-color: var(--primary-500);
    box-shadow: 0 0 0 2px var(--primary-ring);
}

/* 미팅 버튼 */
.quick-meeting-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border: 1px solid var(--gray-300);
    background: var(--bg-elevated);
    color: var(--text-secondary);
    font-weight: 500;
}
.quick-meeting-btn:hover {
    border-color: var(--success);
    background: var(--success-50);
    color: var(--success);
}
.quick-meeting-btn.active {
    border-color: var(--success);
    background: var(--success);
    color: #fff;
}
.quick-meeting-btn .meeting-icon {
    font-size: 0.85rem;
}

/* 보고서 버튼 */
.quick-report-btn {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border: 1px solid var(--gray-300);
    background: var(--bg-elevated);
    color: var(--text-secondary);
    font-weight: 500;
}
.quick-report-btn:hover {
    border-color: var(--info);
    background: var(--info-50);
    color: var(--info);
}
.quick-report-btn .report-icon {
    font-size: 0.85rem;
}

/* 반응형 - 모바일에서 빠른 액션 숨김 또는 축소 */
@media (max-width: 600px) {
    .lead-quick-actions {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }
    .quick-meeting-btn .meeting-text,
    .quick-report-btn .report-text {
        display: none;
    }
}

.lead-card-body p {
    margin-bottom: var(--sp-1-5);
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.lead-card-body p strong {
    color: var(--text);
    font-weight: 500;
}

.lead-card-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1-5);
    padding: 0 var(--sp-5) var(--sp-4);
}

.lead-card-tags span {
    font-size: var(--text-xs);
    font-weight: 500;
    padding: var(--sp-1) var(--sp-2-5);
    background: var(--slate-100);
    color: var(--text-subtle);
    border-radius: var(--radius-full);
    transition: all var(--duration-fast) var(--ease-out);
}

.lead-card:hover .lead-card-tags span {
    background: var(--primary-50);
    color: var(--primary-700);
}

/* 상태 뱃지 색상 */
.status-badge {
    display: inline-flex;
    align-items: center;
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 0.1875rem 0.5rem;
    border-radius: var(--radius-full);
    white-space: nowrap;
}

.status-badge[data-status="1차콜"],
.status-badge.call1 {
    background: #dbeafe;
    color: #1e40af;
}

.status-badge[data-status="2차콜"],
.status-badge.call2 {
    background: #e0e7ff;
    color: #4338ca;
}

.status-badge[data-status="3차콜"],
.status-badge.call3 {
    background: #fee2e2;
    color: #991b1b;
}

.status-badge[data-status="미팅완료"],
.status-badge.meeting {
    background: #d1fae5;
    color: #065f46;
}

.status-badge[data-status="결제완료"],
.status-badge.payment {
    background: var(--primary-bg-strong);
    color: #92400e;
}


/* 리스트 로더 & 빈 상태 */
.list-loader {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-8);
    flex-shrink: 0;
}

.spinner {
    width: 32px;
    height: 32px;
    border: 3px solid var(--gray-200);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.spinner-sm {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
    vertical-align: middle;
    margin-right: 4px;
}

.list-empty {
    text-align: center;
    padding: var(--sp-12) var(--sp-4);
    font-size: 0.9375rem;
    color: var(--text-muted);
    flex-shrink: 0;
}


/* 통계 대시보드 - Premium Design */
.stats-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
    flex-wrap: wrap;
    flex-shrink: 0;
}

.stats-header h3 {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--text);
    letter-spacing: var(--tracking-tight);
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.stats-header h3::before {
    content: '';
    width: 4px;
    height: 24px;
    background: var(--gradient-primary);
    border-radius: var(--radius-full);
}

.stats-controls {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    flex-wrap: wrap;
}

.stats-level-selector {
    display: flex;
    gap: var(--sp-1);
    background: var(--slate-100);
    padding: var(--sp-1);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-inner);
}

.stats-level-btn {
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-subtle);
    background: transparent;
    border: none;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    min-height: 36px;
    letter-spacing: var(--tracking-wide);
}

.stats-level-btn:hover {
    color: var(--text);
    background: rgba(255,255,255,0.5);
}

.stats-level-btn.active {
    color: var(--primary-700);
    background: var(--card);
    box-shadow: var(--shadow-sm);
}

.stats-selector {
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    min-height: 36px;
    min-width: 120px;
    cursor: pointer;
}

.stats-selector:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px var(--primary-bg);
}

/* 통계 그리드 */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-8);
    flex-shrink: 0;
}

.stat-card {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-xl);
    padding: var(--sp-5);
    display: flex;
    flex-direction: column;
    transition: var(--glass-transition);
    position: relative;
    overflow: hidden;
    box-shadow: var(--glass-shadow), var(--glass-edge-light);
}

.stat-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.stat-clickable {
    cursor: pointer;
}

.stat-clickable:hover {
    border-color: var(--primary-300);
    box-shadow: 0 4px 20px rgba(59, 130, 246, 0.15);
}

.stat-label {
    font-size: var(--text-xs);
    font-weight: 700;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    margin-bottom: var(--sp-3);
}

.stat-value {
    font-size: var(--text-4xl);
    font-weight: 800;
    color: var(--text);
    line-height: 1;
    letter-spacing: var(--tracking-tighter);
    font-variant-numeric: tabular-nums;
}

.stat-sub {
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--text-subtle);
    margin-top: var(--sp-2);
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

/* 3차콜 특별 스탯 카드 */
.call3-stat {
    border-color: var(--danger-500);
    border-left: 3px solid var(--danger-500);
    background: var(--card);
}

.call3-stat .stat-value {
    color: var(--danger);
}

.call3-stat .stat-sub {
    color: var(--danger);
}

/* 악센트 스탯 카드 (결제완료) */
.stat-card.accent {
    border-left: 3px solid var(--primary-500);
    background: var(--card);
}

.stat-card.accent .stat-value {
    color: var(--primary-700);
}


/* 전환율 비율 바 - Premium Design */
.stats-rates {
    flex-shrink: 0;
}

.stats-rates h4 {
    font-size: var(--text-lg);
    font-weight: 700;
    margin-bottom: var(--sp-4);
    color: var(--text);
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.rate-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: var(--sp-4);
}

.rate-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-5);
    box-shadow: var(--shadow-card);
    transition: all var(--duration-normal) var(--ease-out);
}

.rate-card:hover {
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-1px);
}

.rate-label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-subtle);
    margin-bottom: 2px;
}

.rate-sublabel {
    font-size: 0.7rem;
    font-weight: 400;
    color: var(--slate-400);
    margin-bottom: var(--sp-2);
}

.rate-value {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--text);
    margin-bottom: var(--sp-2);
}

.rate-detail {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-muted);
    margin-left: 6px;
}

.rate-bar {
    width: 100%;
    height: 8px;
    background: var(--gray-100);
    border-radius: 4px;
    overflow: hidden;
}

.rate-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--primary), var(--primary-light));
    border-radius: 4px;
    transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 0;
}

.rate-fill.meeting-fill {
    background: linear-gradient(90deg, var(--accent-500, #06b6d4), var(--accent-400, #22d3ee));
}

/* 상세 전환 매트릭스 */
.stats-matrix-section {
    margin-top: var(--sp-6);
}

.stats-matrix-section h4 {
    font-size: var(--text-lg);
    font-weight: 700;
    margin-bottom: var(--sp-4);
    color: var(--text);
}

.stats-matrix {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.matrix-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    overflow: hidden;
}

.matrix-table thead th {
    background: var(--primary-50, #f0f4f8);
    color: var(--text-subtle);
    font-weight: 600;
    padding: var(--sp-3) var(--sp-4);
    text-align: center;
    border-bottom: 2px solid var(--border);
    white-space: nowrap;
}

.matrix-table tbody td {
    padding: var(--sp-3) var(--sp-4);
    text-align: center;
    border-bottom: 1px solid var(--border-light, var(--border));
    transition: background 0.15s;
}

.matrix-table tbody tr:hover td {
    background: var(--primary-bg, rgba(98,125,152,0.05));
}

.matrix-stage {
    font-weight: 600;
    text-align: left !important;
    color: var(--text);
}

.matrix-num {
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.matrix-rate {
    color: var(--primary);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.matrix-na {
    color: var(--text-muted, #999);
}

.matrix-meet-col {
    color: var(--accent-600, #0891b2) !important;
}

.matrix-pay-col {
    color: var(--success-600, #16a34a) !important;
}

.matrix-total-row td {
    border-top: 2px solid var(--border);
    background: var(--primary-bg-strong, rgba(98,125,152,0.1)) !important;
    font-weight: 600;
}

/* 팀 가망 탭 */
.team-leads-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-5);
    flex-wrap: wrap;
    gap: var(--sp-4);
    padding-bottom: var(--sp-4);
    border-bottom: 1px solid var(--border);
}
.team-leads-header h3 {
    margin: 0;
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text);
}
.team-leads-stats {
    display: flex;
    gap: var(--sp-4);
    font-size: var(--text-sm);
    color: var(--text-secondary);
}
.team-leads-stats .stat-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-3);
    background: var(--surface-secondary);
    border-radius: var(--radius-md);
}
.team-leads-stats .stat-item strong {
    color: var(--primary);
    font-size: var(--text-lg);
    font-weight: 600;
}

.team-leads-filters {
    background: linear-gradient(135deg, var(--surface-secondary) 0%, var(--card) 100%);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    margin-bottom: var(--sp-4);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
}
.team-leads-filters .filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
    align-items: center;
}
.team-leads-filters .filter-row input,
.team-leads-filters .filter-row select {
    height: 42px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border);
    padding: 0 var(--sp-3);
    font-size: var(--text-sm);
    background: var(--bg);
    transition: all var(--ease-fast);
}
.team-leads-filters .filter-row input:focus,
.team-leads-filters .filter-row select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-bg);
    outline: none;
}
.team-leads-filters .filter-row input::placeholder {
    color: var(--text-muted);
}

.team-leads-quick-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.team-leads-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: var(--sp-4);
}

.team-lead-card {
    cursor: pointer;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.team-lead-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    border-color: #cbd5e1;
}

.team-lead-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-2);
    padding-bottom: var(--sp-2);
    border-bottom: 1px solid var(--gray-50);
}
.team-lead-owner {
    font-size: 0.75rem;
    color: var(--text-secondary);
    background: var(--gray-100);
    padding: 2px 8px;
    border-radius: var(--radius-sm);
}
.team-lead-badges {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
}

.team-lead-card-body { }
.team-lead-name {
    font-weight: 600;
    font-size: var(--text-base);
    color: var(--text);
    margin-bottom: var(--sp-1);
}
.team-lead-info {
    display: flex;
    gap: var(--sp-3);
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-bottom: var(--sp-1);
}
.team-lead-notes {
    font-size: 0.75rem;
    color: var(--text-secondary);
    background: var(--gray-50);
    padding: 4px 8px;
    border-radius: var(--radius-sm);
    margin-top: var(--sp-2);
}

.expiry-badge {
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: var(--radius-sm);
    background: var(--gray-100);
    color: var(--text-secondary);
    font-weight: 600;
}
.expiry-badge.urgent {
    background: var(--warning-bg);
    color: var(--warning);
}
.expiry-badge.expired {
    background: var(--danger-bg);
    color: var(--danger);
}

/* 모니터링 탭 */
.monitor-header {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
    flex-shrink: 0;
}

.monitor-header h3 {
    font-size: 1.125rem;
    font-weight: 700;
}

.monitor-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.monitor-card {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    cursor: pointer;
    transition: var(--glass-transition);
    box-shadow: var(--glass-shadow), var(--glass-edge-light);
}

.monitor-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.monitor-detail-body {
    padding: var(--sp-4);
    overflow-y: auto;
    flex: 1;
    -webkit-overflow-scrolling: touch;
    max-height: 60vh;
}


/* 읽기전용 뱃지 */
.read-only-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.1875rem 0.625rem;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--text-muted);
    background: var(--gray-100);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}


/* 직원관리 탭 - Premium Design */
.staff-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
    flex-shrink: 0;
}

.staff-header h3 {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.staff-header h3::before {
    content: '';
    width: 4px;
    height: 24px;
    background: var(--gradient-primary);
    border-radius: var(--radius-full);
}

.staff-header-actions {
    display: flex;
    gap: var(--sp-3);
}

.staff-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.staff-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
    transition: all var(--duration-normal) var(--ease-out);
    box-shadow: var(--shadow-card);
    position: relative;
    overflow: hidden;
}

.staff-card:hover {
    box-shadow: var(--shadow-card-hover);
    border-color: var(--primary-200);
}

.staff-info {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.staff-info strong {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
}

.staff-info span {
    font-size: var(--text-sm);
    color: var(--text-subtle);
}

.staff-actions {
    display: flex;
    gap: var(--sp-2);
    margin-top: auto;
}

/* 직원 관리 빠른 필터 */
.staff-quick-filters {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) 0;
    flex-wrap: wrap;
}

.staff-quick-filter-btn {
    padding: var(--sp-2) var(--sp-4);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    background: var(--card);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.staff-quick-filter-btn:hover {
    border-color: var(--primary-300);
    color: var(--primary);
    background: var(--primary-50);
}

.staff-quick-filter-btn.active {
    background: var(--primary);
    color: white;
    border-color: var(--primary);
}

.filter-divider {
    width: 1px;
    height: 24px;
    background: var(--border);
    margin: 0 var(--sp-2);
}

/* 직원 관리 지사별 드릴다운 카드 */
.staff-branch-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

.staff-branch-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-4);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    position: relative;
    overflow: hidden;
}

.staff-branch-card:hover {
    border-color: var(--primary-300);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.staff-branch-card.active {
    border-color: var(--primary);
    background: var(--primary-50);
}

.staff-branch-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-2);
}

.staff-branch-card-name {
    font-weight: 600;
    font-size: var(--text-base);
    color: var(--text);
}

.staff-branch-card-count {
    background: var(--primary-100);
    color: var(--primary-700);
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 600;
}

.staff-branch-card-stats {
    display: flex;
    gap: var(--sp-2);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.staff-branch-card-stat {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

.staff-branch-card-expand {
    position: absolute;
    right: var(--sp-3);
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    transition: transform var(--duration-fast) var(--ease-out);
}

.staff-branch-card.active .staff-branch-card-expand {
    transform: translateY(-50%) rotate(180deg);
}


/* 감사 로그 - Premium Design */
.audit-log-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.audit-log-item {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    padding: var(--sp-4) var(--sp-5);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    font-size: var(--text-sm);
    box-shadow: var(--shadow-xs);
    transition: all var(--duration-fast) var(--ease-out);
}

.audit-log-item:hover {
    box-shadow: var(--shadow-sm);
    border-color: var(--primary-200);
}

.audit-log-item time {
    color: var(--text-muted);
    font-size: var(--text-xs);
    white-space: nowrap;
    flex-shrink: 0;
    font-weight: 500;
    background: var(--slate-100);
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-md);
}


/* 모달 - Premium Design */
.modal {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-4);
}

.modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    animation: overlayFadeIn 0.2s ease;
}

@keyframes overlayFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.modal-content {
    position: relative;
    width: 100%;
    max-width: 520px;
    max-height: 90vh;
    max-height: 90dvh;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 20px;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: modalGlassIn 0.3s var(--ease-out);
}

@keyframes modalGlassIn {
    from {
        opacity: 0;
        transform: scale(0.95) translateY(12px);
        backdrop-filter: blur(0);
        -webkit-backdrop-filter: blur(0);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
        backdrop-filter: var(--glass-blur-strong);
        -webkit-backdrop-filter: var(--glass-blur-strong);
    }
}

.modal-large {
    max-width: 720px;
}

.modal-xl {
    max-width: 960px;
}

.modal-content.lead-form-modal {
    max-width: 960px;
}

/* 가망 폼 2단 레이아웃 */
.lead-form-body {
    display: flex;
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
}

.lead-form-left {
    flex: 1;
    min-width: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.lead-form-right {
    width: 380px;
    flex-shrink: 0;
    border-left: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.lead-form-right .form-section {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-bottom: none;
}

.lead-form-right .form-group {
    flex: 1;
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

.lead-form-right textarea {
    flex: 1;
    min-height: 300px;
    resize: none;
    overflow-y: auto;
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-5) var(--sp-6);
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
    gap: var(--sp-3);
    background: var(--slate-50);
}

.modal-header h3 {
    font-size: var(--text-xl);
    font-weight: 700;
    flex: 1;
    min-width: 0;
    letter-spacing: var(--tracking-tight);
    color: var(--text);
}

.modal-header-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    flex-shrink: 0;
}

.modal-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: var(--slate-100);
    border: none;
    border-radius: var(--radius-lg);
    color: var(--text-subtle);
    font-size: var(--text-xl);
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    flex-shrink: 0;
    line-height: 1;
}

.modal-close:hover {
    background: var(--slate-200);
    color: var(--text);
}


/* 가망 폼 - Premium Design */
.lead-form {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.form-section {
    padding: var(--sp-5) var(--sp-6);
    border-bottom: 1px solid var(--border-subtle);
}

.form-section:last-of-type {
    border-bottom: none;
}

.status-section {
    background: var(--slate-50);
}

.form-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--sp-4) var(--sp-5);
}

.form-row.three-col {
    grid-template-columns: repeat(3, 1fr);
}

.form-group {
    margin-bottom: var(--sp-4);
}

.form-group.full {
    grid-column: 1 / -1;
}

.form-group label {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--sp-2);
    letter-spacing: var(--tracking-wide);
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: var(--sp-3) var(--sp-4);
    font-size: var(--text-md);
    color: var(--text);
    background: #f8fafc;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    transition: all 0.2s ease;
    min-height: 46px;
}

.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover {
    border-color: rgba(0, 0, 0, 0.15);
    background: #ffffff;
}

.form-group textarea {
    resize: vertical;
    min-height: 88px;
    line-height: 1.6;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: rgba(59, 130, 246, 0.5);
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    color: var(--text-muted);
}

.form-group input:read-only {
    background: var(--slate-100);
    cursor: not-allowed;
    color: var(--text-subtle);
    border-color: var(--border);
}

.form-group input:read-only:focus {
    box-shadow: none;
    border-color: var(--border);
}

/* Input with button (플레이스 바로가기) */
.input-with-btn {
    display: flex;
    gap: var(--sp-2);
    align-items: stretch;
}

.input-with-btn input {
    flex: 1;
    min-width: 0;
}

.btn-place-link {
    flex-shrink: 0;
    padding: 0 var(--sp-3);
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
    transition: all var(--transition-fast);
    white-space: nowrap;
}

.btn-place-link:hover {
    background: var(--primary-hover);
}

.btn-place-link:disabled {
    background: var(--slate-300);
    cursor: not-allowed;
}

.required {
    color: var(--danger);
    font-weight: 700;
}

.error-msg {
    font-size: var(--text-sm);
    color: var(--danger);
    margin-top: var(--sp-2);
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

.error-msg::before {
    content: '⚠';
    font-size: var(--text-xs);
}

/* Form hint text */
.form-hint {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-top: var(--sp-1);
}


/* 라디오 그룹 (필 버튼 스타일) */
.radio-group {
    display: flex;
    gap: var(--sp-1);
    flex-wrap: wrap;
}

.radio-label {
    cursor: pointer;
    display: inline-flex;
}

.radio-label input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.radio-label span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.375rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-subtle);
    background: var(--gray-100);
    border: 2px solid transparent;
    border-radius: var(--radius-full);
    transition: all var(--ease-fast);
    min-height: 36px;
    cursor: pointer;
}

.radio-label span:hover {
    background: var(--gray-200);
    color: var(--text);
}

.radio-label input[type="radio"]:checked + span {
    color: var(--gray-900);
    background: var(--primary-bg-strong);
    border-color: var(--primary);
}

.radio-label input[type="radio"]:focus-visible + span {
    box-shadow: 0 0 0 3px var(--primary-ring);
}


/* 폼 액션 버튼 */
.form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-5);
    border-top: 1px solid var(--border);
    background: var(--gray-50);
    gap: var(--sp-2);
    flex-shrink: 0;
}

.form-actions-right {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-left: auto;
}


/* 버튼 시스템 - Premium Design */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-2);
    padding: var(--sp-2-5) var(--sp-4);
    font-family: inherit;
    font-size: var(--text-base);
    font-weight: 600;
    line-height: 1.5;
    color: var(--text);
    background: var(--card);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    white-space: nowrap;
    min-height: 44px;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
    letter-spacing: var(--tracking-wide);
}

.btn:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}

.btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.btn:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
    box-shadow: none;
}

/* Primary Button - Modern Gradient */
.btn-primary {
    color: #ffffff;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    border-color: transparent;
    box-shadow: 0 4px 14px rgba(59, 130, 246, 0.35);
}

.btn-primary:hover:not(:disabled) {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4);
    transform: translateY(-1px);
}

.btn-primary:active:not(:disabled) {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
}

/* Danger Button */
.btn-danger {
    color: #ffffff;
    background: var(--gradient-danger);
    border-color: transparent;
    box-shadow: 0 2px 8px rgba(220, 38, 38, 0.25);
}

.btn-danger:hover:not(:disabled) {
    background: linear-gradient(135deg, #b91c1c 0%, #dc2626 100%);
    box-shadow: 0 4px 14px rgba(220, 38, 38, 0.35);
}

/* Success Button */
.btn-success {
    color: #ffffff;
    background: var(--gradient-success);
    border-color: transparent;
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.25);
}

.btn-success:hover:not(:disabled) {
    box-shadow: 0 4px 14px rgba(22, 163, 74, 0.35);
}

/* Warning Button */
.btn-warning {
    color: #ffffff;
    background: linear-gradient(135deg, var(--warning-600) 0%, var(--warning-500) 100%);
    border-color: transparent;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.25);
}

.btn-warning:hover:not(:disabled) {
    box-shadow: 0 4px 14px rgba(245, 158, 11, 0.35);
}

/* Outline Button */
.btn-outline {
    color: var(--text-secondary);
    background: var(--card);
    border-color: var(--border);
}

.btn-outline:hover:not(:disabled) {
    background: var(--bg-sunken);
    border-color: var(--border-strong);
    color: var(--text);
}

/* Ghost Button */
.btn-ghost {
    color: var(--text-subtle);
    background: transparent;
    border-color: transparent;
}

.btn-ghost:hover:not(:disabled) {
    background: var(--bg-sunken);
    color: var(--text);
}

/* Size Variants */
.btn-xs {
    padding: var(--sp-1) var(--sp-2);
    font-size: var(--text-xs);
    min-height: 28px;
    border-radius: var(--radius-md);
}

.btn-sm {
    padding: var(--sp-1-5) var(--sp-3);
    font-size: var(--text-sm);
    min-height: 36px;
}

.btn-lg {
    padding: var(--sp-3) var(--sp-6);
    font-size: var(--text-lg);
    min-height: 52px;
    border-radius: var(--radius-xl);
}

.btn-full {
    width: 100%;
    min-height: 52px;
    font-size: var(--text-md);
    margin-top: var(--sp-4);
    border-radius: var(--radius-xl);
}

/* Icon Button */
.btn-icon {
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: var(--radius-lg);
}

.btn-icon.btn-sm {
    width: 36px;
    height: 36px;
    min-height: 36px;
}


/* 토스트 알림 */
.toast {
    position: fixed;
    bottom: var(--sp-6);
    left: 50%;
    transform: translateX(-50%);
    z-index: 2000;
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-5);
    background: rgba(30,41,59,0.85);
    backdrop-filter: var(--glass-blur);
    -webkit-backdrop-filter: var(--glass-blur);
    color: #ffffff;
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: var(--radius-lg);
    box-shadow: var(--glass-shadow-elevated);
    animation: toastIn 0.3s ease;
    max-width: calc(100vw - var(--sp-8));
}

@keyframes toastIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.toast-success {
    background: var(--success);
}

.toast-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: rgba(255,255,255,0.2);
    border-radius: var(--radius-full);
    font-size: 0.6875rem;
    font-weight: 800;
    flex-shrink: 0;
}


/* 자동저장 인디케이터 */
.auto-save-indicator {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--success);
    padding: 0.25rem 0.5rem;
    background: var(--success-bg);
    border-radius: var(--radius-full);
    animation: autoSaveFadeIn 0.3s ease;
}

@keyframes autoSaveFadeIn {
    from { opacity: 0; transform: scale(0.9); }
    to { opacity: 1; transform: scale(1); }
}


/* 권한별 가시성 헬퍼 */
.superior-only,
.admin-only,
.branch-mgr-only {
    /* 기본적으로 표시, JS에서 display:none 제어 */
}


/* 반응형: 태블릿 (768px) - Premium Mobile */
@media (max-width: 768px) {
    .app-header {
        padding: 0 var(--sp-4);
        height: 56px;
    }

    .header-title {
        font-size: var(--text-md);
    }

    .header-logo {
        height: 32px;
        object-fit: contain;
    }

    .user-info {
        font-size: var(--text-xs);
        padding: var(--sp-1-5) var(--sp-2);
    }

    .tab-nav {
        padding: var(--sp-2) var(--sp-4);
        gap: var(--sp-1);
    }

    .tab-btn {
        padding: var(--sp-2) var(--sp-3);
        font-size: var(--text-sm);
        border-radius: var(--radius-lg);
    }

    .tab-btn.active::after {
        bottom: -8px;
        width: 24px;
    }

    .tab-content {
        padding: var(--sp-4);
    }

    .filter-bar {
        flex-direction: column;
        align-items: stretch;
        gap: var(--sp-3);
    }

    .filter-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .search-input {
        flex: 1;
        width: auto;
        min-width: 200px;
    }

    .stats-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .stats-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: var(--sp-3);
    }

    .stat-card {
        padding: var(--sp-4);
    }

    .stat-value {
        font-size: var(--text-3xl);
    }

    .rate-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--sp-3);
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .form-row.three-col {
        grid-template-columns: repeat(2, 1fr);
    }

    .modal {
        padding: var(--sp-3);
        align-items: flex-end;
    }

    .modal-content {
        max-height: 90vh;
        max-height: 90dvh;
        border-radius: var(--radius-2xl) var(--radius-2xl) 0 0;
        animation: modalSlideUp 0.35s var(--ease-spring);
    }

    @keyframes modalSlideUp {
        from {
            opacity: 0;
            transform: translateY(100%);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .modal-large {
        max-width: 100%;
    }

    .lead-form-modal {
        max-width: 100%;
    }

    .lead-form-body {
        flex-direction: column;
    }

    .lead-form-left {
        overflow-y: visible;
    }

    .lead-form-right {
        width: 100%;
        border-left: none;
        border-top: 1px solid var(--border-subtle);
        overflow-y: visible;
    }

    .lead-form-right textarea {
        min-height: 88px;
        resize: vertical;
    }

    .lead-form {
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .staff-card {
        padding: var(--sp-4);
    }

    .lead-list {
        gap: var(--sp-3);
    }

    .lead-card {
        border-radius: var(--radius-lg);
    }

    .lead-card-header {
        padding: var(--sp-3) var(--sp-4);
    }

    .lead-card-body {
        padding: var(--sp-3) var(--sp-4);
    }

    .lead-card-tags {
        padding: 0 var(--sp-4) var(--sp-3);
    }
}


/* 반응형: 모바일 (480px) - Premium Mobile */
@media (max-width: 480px) {
    :root {
        font-size: 15px;
    }

    .login-screen {
        padding: 0;
        align-items: stretch;
        background: #ffffff;
    }

    .login-screen::before,
    .login-screen::after {
        display: none;
    }

    .login-box {
        max-width: 100%;
        border-radius: 0;
        border: none;
        box-shadow: none;
        padding: 0 24px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 100dvh;
        animation: none;
        background: #ffffff;
    }

    .login-logo {
        height: 44px;
        object-fit: contain;
        margin-bottom: 12px;
    }

    .login-box h2 {
        font-size: 24px;
        margin-bottom: 36px;
    }

    .login-box .form-group {
        margin-bottom: 16px;
    }

    .login-box .form-group label {
        font-size: 14px;
        margin-bottom: 8px;
    }

    .login-box .form-group input {
        padding: 16px;
        font-size: 16px;
        min-height: 52px;
        border-radius: 12px;
        -webkit-appearance: none;
    }

    .login-box .btn-primary {
        padding: 16px;
        font-size: 16px;
        min-height: 52px;
        border-radius: 12px;
        margin-top: 12px;
    }

    .login-box .error-msg {
        margin-top: 16px;
        padding: 14px 16px;
        font-size: 14px;
        border-radius: 12px;
    }

    .login-credit {
        position: relative;
        bottom: auto;
        left: auto;
        transform: none;
        text-align: center;
        margin-top: 40px;
        padding-bottom: 24px;
    }

    .app-header {
        height: 52px;
        padding: 0 var(--sp-3);
    }

    .header-logo {
        height: 28px;
        object-fit: contain;
    }

    .header-title {
        font-size: var(--text-sm);
    }

    .user-info {
        display: none;
    }

    .notification-bell {
        font-size: var(--text-lg);
        width: 36px;
        height: 36px;
    }

    .tab-nav {
        padding: var(--sp-2) var(--sp-3);
    }

    .tab-btn {
        padding: var(--sp-2) var(--sp-2-5);
        font-size: var(--text-xs);
        min-height: 40px;
    }

    .tab-btn.active::after {
        width: 20px;
        height: 2px;
    }

    .tab-content {
        padding: var(--sp-3);
    }

    .filter-bar {
        gap: var(--sp-2);
    }

    .filter-btn {
        font-size: var(--text-xs);
        padding: var(--sp-1-5) var(--sp-2);
        min-height: 32px;
    }

    .stats-header h3 {
        font-size: var(--text-lg);
    }

    .stats-header h3::before {
        height: 20px;
        width: 3px;
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--sp-2);
    }

    .stat-card {
        padding: var(--sp-3);
        border-radius: var(--radius-lg);
    }

    .stat-label {
        font-size: 0.625rem;
    }

    .stat-value {
        font-size: var(--text-2xl);
    }

    .rate-grid {
        grid-template-columns: 1fr;
        gap: var(--sp-2);
    }

    .rate-card {
        padding: var(--sp-4);
    }

    .form-row.three-col {
        grid-template-columns: 1fr;
    }

    .form-section {
        padding: var(--sp-4);
    }

    .form-group input,
    .form-group select,
    .form-group textarea {
        min-height: 44px;
        font-size: var(--text-base);
    }

    .form-actions {
        padding: var(--sp-3) var(--sp-4);
        flex-wrap: wrap;
    }

    .modal {
        padding: 0;
        align-items: flex-end;
    }

    .modal-content {
        max-height: 94vh;
        max-height: 94dvh;
        border-radius: var(--radius-xl) var(--radius-xl) 0 0;
        margin: 0;
    }

    .modal-header {
        padding: var(--sp-4);
    }

    .modal-header h3 {
        font-size: var(--text-lg);
    }

    .lead-card-header strong {
        font-size: var(--text-base);
    }

    .btn {
        min-height: 44px;
        font-size: var(--text-sm);
    }

    .btn-sm {
        min-height: 36px;
        font-size: var(--text-xs);
    }

    .stats-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .stats-level-selector {
        width: 100%;
    }

    .stats-level-btn {
        flex: 1;
        text-align: center;
    }

    .staff-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--sp-2);
    }

    .staff-header .btn {
        width: 100%;
    }

    .monitor-header {
        flex-wrap: wrap;
    }
}


/* 스크롤바 커스텀 */
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--gray-300);
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--gray-400);
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--gray-300) transparent;
}


/* 유틸리티 */
.hidden {
    display: none !important;
}

.text-muted {
    color: var(--text-muted);
}

.text-success {
    color: var(--success);
}

.text-error {
    color: var(--danger);
}

.font-mono {
    font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
}


/* 접근성 & 포커스 */
:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible) {
    outline: none;
}


/* 안전 영역 (노치 대응) */
@supports (padding: env(safe-area-inset-bottom)) {
    .main-app {
        padding-bottom: env(safe-area-inset-bottom);
    }

    .form-actions {
        padding-bottom: calc(var(--sp-3) + env(safe-area-inset-bottom));
    }

    .toast {
        bottom: calc(var(--sp-6) + env(safe-area-inset-bottom));
    }
}


/* 인쇄 */
@media print {
    .app-header,
    .tab-nav,
    .filter-bar,
    .warning-banner,
    .toast,
    .modal-overlay,
    .btn {
        display: none !important;
    }

    body {
        background: #fff;
    }

    .tab-content {
        display: block !important;
        padding: 0;
    }

    .stat-card,
    .rate-card,
    .lead-card {
        break-inside: avoid;
    }
}


/* 0차콜 스탯 카드 */
.call0-stat {
    border-color: var(--gray-400);
    border-width: 2px;
    background: linear-gradient(135deg, var(--gray-50) 0%, var(--gray-100) 100%);
}

.call0-stat .stat-value {
    color: var(--gray-600);
}


/* 0차콜 상태 뱃지 */
.status-badge[data-status="0차콜"],
.status-badge.call0,
.badge-call0 {
    background: #f3f4f6;
    color: #4b5563;
}


/* 일괄 작업 플로팅 바 */
.bulk-action-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--gradient-header);
    color: #ffffff;
    padding: var(--sp-3) var(--sp-4);
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    z-index: 200;
    box-shadow: 0 -4px 12px rgba(0,0,0,0.1);
    animation: slideUp 0.3s ease;
}

@keyframes slideUp {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.select-all-label {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    cursor: pointer;
    font-weight: 600;
}

.select-all-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.selected-count {
    font-weight: 600;
    padding: var(--sp-1) var(--sp-3);
    background: rgba(255,255,255,0.2);
    border-radius: var(--radius-full);
}

.bulk-action-bar .btn-danger {
    margin-left: auto;
}


/* 단축키 힌트 */
.shortcut-hint {
    font-size: 0.6875rem;
    font-weight: 400;
    color: var(--text-muted);
    margin-left: var(--sp-1);
}


/* 결제유형 행 */
.payment-type-row {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.payment-type-row select {
    flex: 1;
}


/* 에러 토스트 */
.toast-error {
    background: var(--danger);
}


/* 세션 만료 모달 */
.modal-alert {
    max-width: 360px;
    text-align: center;
}

.session-alert-body,
.preparing-body {
    padding: var(--sp-6);
    text-align: center;
}

.alert-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto var(--sp-4);
    background: var(--danger-bg);
    color: var(--danger);
    font-size: 2rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.alert-sub {
    font-size: 0.8125rem;
    color: var(--text-muted);
    margin-top: var(--sp-2);
}

.modal-footer {
    padding: var(--sp-4);
    border-top: 1px solid var(--border);
}

.export-format-btn.active {
    border-color: #4f46e5 !important;
    background: #eef2ff !important;
    color: #4338ca !important;
}

#export-settings-modal label:has(input[type="radio"]:checked) {
    background: #f5f3ff;
    border-color: #a78bfa;
}

.modal-body {
    padding: var(--sp-4);
}


/* 준비중 모달 */
.preparing-icon {
    font-size: 3rem;
    margin-bottom: var(--sp-4);
}


/* 삭제된 가망 목록 */
.deleted-leads-list {
    padding: var(--sp-4);
    max-height: 60vh;
    overflow-y: auto;
}

.deleted-lead-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    background: var(--gray-50);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    margin-bottom: var(--sp-2);
    opacity: 0.8;
}

.deleted-lead-card:hover {
    opacity: 1;
    background: var(--card);
}

.deleted-lead-info {
    flex: 1;
}

.deleted-lead-info strong {
    display: block;
    margin-bottom: var(--sp-1);
}

.deleted-lead-info span {
    font-size: 0.8125rem;
    color: var(--text-muted);
}


/* 직원 헤더 액션 */
.staff-header-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}


/* 가망 카드 확장 정보 */
.lead-card-extended {
    padding: var(--sp-2) var(--sp-4) var(--sp-3);
    background: var(--gray-50);
    border-top: 1px solid var(--gray-100);
    font-size: 0.75rem;
    color: var(--text-subtle);
}

.lead-card-extended-row {
    display: flex;
    gap: var(--sp-4);
    flex-wrap: wrap;
}

.lead-card-extended-row span {
    white-space: nowrap;
}

.lead-card-extended .place-url {
    color: var(--primary);
    cursor: pointer;
    text-decoration: underline;
}

.lead-card-extended .place-url:hover {
    color: var(--primary-hover);
}


/* 3주 만료 하이라이트 */
.lead-card.expiring-soon {
    border-color: var(--danger);
    border-width: 2px;
    animation: expiringPulse 2s ease-in-out infinite;
}

@keyframes expiringPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); }
    50% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); }
}

.expiry-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: 0.125rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    background: var(--danger-bg);
    color: var(--danger);
    border-radius: var(--radius-full);
}

.expiry-badge.warning {
    background: #fef3c7;
    color: #92400e;
}

.days-remaining {
    font-size: 0.6875rem;
    color: var(--text-muted);
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.days-remaining.urgent {
    color: var(--danger);
    font-weight: 600;
}


/* 가망 카드 체크박스 */
.lead-card-checkbox {
    position: absolute;
    top: var(--sp-3);
    left: var(--sp-3);
    width: 20px;
    height: 20px;
    cursor: pointer;
    z-index: 10;
    opacity: 0;
    transition: opacity var(--ease-fast);
}

.lead-card:hover .lead-card-checkbox,
.lead-card.selected .lead-card-checkbox,
.bulk-select-mode .lead-card-checkbox {
    opacity: 1;
}

.lead-card.selected {
    border-color: var(--primary);
    background: var(--primary-bg);
}

.lead-card {
    position: relative;
}

.bulk-select-mode .lead-card {
    padding-left: calc(var(--sp-4) + 28px);
}


/* 가망 카드 삭제 버튼 */
.lead-card-delete {
    position: absolute;
    top: var(--sp-2);
    right: var(--sp-2);
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--danger-bg);
    color: var(--danger);
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    opacity: 0;
    transition: opacity var(--ease-fast);
    font-size: 1rem;
    z-index: 10;
}

.lead-card:hover .lead-card-delete {
    opacity: 1;
}

.lead-card-delete:hover {
    background: var(--danger);
    color: #ffffff;
}

/* 업체명 텍스트 truncation */
.lead-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.lead-name-wrap {
    overflow: hidden;
}

/* 선택된 카드 업체명 텍스트 가시성 */
.lead-card.selected .lead-name {
    color: var(--text);
}

/* bulk-select 모드에서 카드 헤더 좌측 패딩 축소로 업체명 공간 확보 */
.bulk-select-mode .lead-card .lead-card-header {
    padding-left: var(--sp-2);
}

/* bulk-select 선택된 카드 배경 및 테두리 강조 */
.bulk-select-mode .lead-card.selected {
    background: rgba(var(--primary-rgb, 59, 130, 246), 0.08);
    border-color: var(--primary);
}


/* 감사 로그 테이블 개선 */
.audit-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.audit-table th,
.audit-table td {
    padding: var(--sp-3);
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.audit-table th {
    background: var(--gray-50);
    font-weight: 600;
    color: var(--text-subtle);
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.audit-table tr:hover td {
    background: var(--gray-50);
}

/* 감사 로그 필터 & 카테고리 */
.audit-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-4);
}

.audit-header h3 {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
}

.audit-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
    padding: var(--sp-3) var(--sp-4);
    background: var(--gray-50, #f9fafb);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border);
}

.audit-category-btns {
    display: flex;
    gap: var(--sp-1);
    flex-wrap: wrap;
}

.audit-cat-btn {
    padding: var(--sp-1) var(--sp-3);
    font-size: var(--text-sm);
    font-weight: 500;
    border: 1px solid var(--border);
    border-radius: var(--radius-full, 9999px);
    background: var(--card);
    color: var(--text-subtle);
    cursor: pointer;
    transition: all 0.15s;
}

.audit-cat-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.audit-cat-btn.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

.audit-date-filters {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-left: auto;
}

.audit-date-input {
    padding: var(--sp-1) var(--sp-2);
    font-size: var(--text-sm);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
    color: var(--text);
}

.audit-date-sep {
    color: var(--text-muted);
    font-size: var(--text-sm);
}

.audit-cat-badge {
    display: inline-block;
    padding: 2px 8px;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: var(--radius-full, 9999px);
    text-align: center;
    white-space: nowrap;
}

.audit-cat-badge.cat-auth {
    background: rgba(59, 130, 246, 0.1);
    color: #2563eb;
}

.audit-cat-badge.cat-staff {
    background: rgba(168, 85, 247, 0.1);
    color: #7c3aed;
}

.audit-cat-badge.cat-business {
    background: rgba(34, 197, 94, 0.1);
    color: #16a34a;
}

.audit-cat-badge.cat-system {
    background: rgba(245, 158, 11, 0.1);
    color: #d97706;
}

.audit-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-3);
    padding: var(--sp-4) 0;
}

.audit-page-info {
    font-size: var(--text-sm);
    color: var(--text-subtle);
}

.audit-page-btn {
    cursor: pointer;
}

@media (max-width: 640px) {
    .audit-filters {
        flex-direction: column;
        align-items: stretch;
    }
    .audit-date-filters {
        margin-left: 0;
    }
}

/* 모니터링 카드 개선 */
.monitor-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-3);
}

.monitor-role {
    font-size: 0.75rem;
    color: var(--text-muted);
}

.monitor-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2) var(--sp-4);
    font-size: 0.8125rem;
}

.monitor-stats span {
    white-space: nowrap;
}

.call3-danger {
    color: var(--danger);
    font-weight: 700;
}

.payment-highlight {
    color: var(--primary);
    font-weight: 700;
}


/* 직원 카드 개선 */
.staff-info {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2) var(--sp-4);
    align-items: center;
}

.staff-info strong {
    font-size: 1rem;
}

.staff-info span {
    font-size: 0.8125rem;
    color: var(--text-subtle);
}

.staff-actions {
    display: flex;
    gap: var(--sp-2);
}


/* ========================================== */
/* ENTERPRISE GRADE ENHANCEMENTS */
/* ========================================== */

/* 스켈레톤 로더 */
.skeleton {
    background: linear-gradient(90deg,
        var(--gray-100) 25%,
        var(--gray-200) 50%,
        var(--gray-100) 75%
    );
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
    border-radius: var(--radius-sm);
}

@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-text {
    height: 1rem;
    margin-bottom: var(--sp-2);
}

.skeleton-text.short {
    width: 60%;
}

.skeleton-title {
    height: 1.5rem;
    width: 40%;
    margin-bottom: var(--sp-3);
}

.skeleton-card {
    height: 120px;
    border-radius: var(--radius-lg);
}

.skeleton-stat {
    height: 80px;
    border-radius: var(--radius-lg);
}


/* 카운트업 애니메이션 */
.count-up {
    transition: transform 0.3s ease;
}

.count-up.counting {
    transform: scale(1.1);
}

@keyframes countPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}


/* KPI 카드 */
.kpi-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: var(--sp-5);
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: all 0.25s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.03);
}

.kpi-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.kpi-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(59, 130, 246, 0.08);
    border-color: rgba(59, 130, 246, 0.15);
}

.kpi-card.kpi-clickable {
    cursor: pointer;
}

.kpi-card.kpi-clickable:active {
    transform: translateY(-1px) scale(0.99);
}

.kpi-card.kpi-clickable::after {
    content: '\2197';
    position: absolute;
    top: var(--sp-2);
    right: var(--sp-2);
    font-size: 12px;
    color: var(--text-muted);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.kpi-card.kpi-clickable:hover::after {
    opacity: 1;
}

.kpi-card:hover::before {
    opacity: 1;
}

.kpi-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-2);
}

.kpi-label {
    font-size: 0.8125rem;
    color: var(--text-subtle);
    font-weight: 500;
}

.kpi-trend {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.125rem 0.5rem;
    border-radius: var(--radius-full);
}

.kpi-trend.up {
    background: var(--success-bg);
    color: var(--success);
}

.kpi-trend.down {
    background: var(--danger-bg);
    color: var(--danger);
}

.kpi-trend.neutral {
    background: var(--gray-100);
    color: var(--text-muted);
}

.kpi-value {
    font-size: 2rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
    margin-bottom: var(--sp-2);
}

.kpi-sub {
    font-size: 0.75rem;
    color: var(--text-muted);
}

.kpi-progress {
    margin-top: var(--sp-3);
}

.kpi-progress-bar {
    height: 6px;
    background: var(--gray-100);
    border-radius: var(--radius-full);
    overflow: hidden;
    margin-bottom: var(--sp-1);
}

.kpi-progress-fill {
    height: 100%;
    background: var(--gradient-primary);
    border-radius: var(--radius-full);
    transition: width 0.8s ease;
}

.kpi-progress-text {
    font-size: 0.6875rem;
    color: var(--text-muted);
}


/* 활동 피드 */
.activity-feed {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    max-height: 400px;
    overflow-y: auto;
}

.activity-feed-header {
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    background: var(--card);
    z-index: 1;
}

.activity-feed-title {
    font-weight: 600;
    font-size: 0.875rem;
}

.activity-item {
    display: flex;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--gray-50);
    transition: background var(--ease-fast);
}

.activity-item:hover {
    background: var(--gray-50);
}

.activity-item:last-child {
    border-bottom: none;
}

.activity-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}

.activity-icon.icon-call {
    background: #dbeafe;
    color: #2563eb;
}

.activity-icon.icon-meeting {
    background: #fef3c7;
    color: #d97706;
}

.activity-icon.icon-payment {
    background: #d1fae5;
    color: #059669;
}

.activity-icon.icon-create {
    background: var(--primary-50);
    color: var(--primary);
}

.activity-icon.icon-delete {
    background: #fee2e2;
    color: #dc2626;
}

.activity-content {
    flex: 1;
    min-width: 0;
}

.activity-content strong {
    color: var(--text);
}

.activity-content .highlight {
    color: var(--primary);
    font-weight: 500;
}

.activity-time {
    display: block;
    font-size: 0.6875rem;
    color: var(--text-muted);
    margin-top: var(--sp-1);
}

.activity-header {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-1);
    align-items: baseline;
}

.activity-user {
    font-size: 0.75rem;
    color: var(--text-secondary);
    padding: 1px 6px;
    background: var(--gray-100);
    border-radius: 4px;
    margin-right: 4px;
}

.activity-changes {
    margin-top: var(--sp-2);
    padding: var(--sp-2);
    background: var(--gray-50);
    border-radius: 6px;
    font-size: 0.75rem;
}

.activity-change-item {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 2px 0;
    align-items: center;
}

.activity-change-item .change-label {
    font-weight: 500;
    color: var(--text-secondary);
    min-width: 60px;
}

.activity-change-item .change-old {
    color: var(--danger);
    text-decoration: line-through;
    opacity: 0.8;
}

.activity-change-item .change-arrow {
    color: var(--text-muted);
    margin: 0 4px;
}

.activity-change-item .change-new {
    color: var(--success);
    font-weight: 500;
}

.activity-icon.icon-update {
    background: #fef3c7;
    color: #d97706;
}


/* 알림 센터 */
.notification-bell {
    position: relative;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    cursor: pointer;
    border-radius: 50%;
    transition: background var(--ease-fast);
    color: var(--slate-600);
    font-size: 1.25rem;
}

.notification-bell:hover {
    background: var(--slate-100);
}

.notification-badge {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 18px;
    height: 18px;
    background: var(--danger);
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    animation: notificationPulse 2s ease-in-out infinite;
}

@keyframes notificationPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

.notification-panel {
    position: absolute;
    top: 100%;
    right: 0;
    width: 320px;
    max-height: 400px;
    background: var(--glass-bg-strong);
    backdrop-filter: var(--glass-blur-strong);
    -webkit-backdrop-filter: var(--glass-blur-strong);
    border: 1px solid var(--glass-border-strong);
    border-radius: var(--radius-lg);
    box-shadow: var(--glass-shadow-elevated), var(--glass-inner-glow);
    overflow: hidden;
    z-index: 1000;
    animation: slideDown 0.2s ease;
}

@keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

.notification-header {
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.notification-title {
    font-weight: 600;
    font-size: 0.875rem;
    color: var(--text);
}

.notification-clear {
    font-size: 0.75rem;
    color: var(--primary);
    cursor: pointer;
}

.notification-list {
    max-height: 300px;
    overflow-y: auto;
}

.notification-item {
    padding: 0.75rem 1rem 0.75rem 1rem;
    border-bottom: 1px solid var(--gray-100);
    cursor: pointer;
    transition: background 0.15s ease;
    position: relative;
}

.notification-item.unread {
    background: var(--primary-50);
    border-left: 4px solid var(--primary);
    padding-left: calc(1rem - 4px);
}

.notification-item.unread .notification-item-title {
    font-weight: 700;
    color: var(--text);
}

.notification-item:not(.unread) {
    opacity: 0.65;
}

.notification-item:not(.unread) .notification-item-title {
    font-weight: 400;
}

.notification-item:hover {
    background: var(--gray-50);
}

.notification-item.unread:hover {
    background: var(--primary-100);
}

.notification-item-title {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--text);
    margin-bottom: var(--sp-1);
}

.notification-item-desc {
    font-size: 0.75rem;
    color: var(--text-muted);
}

.notification-empty {
    padding: var(--sp-6);
    text-align: center;
    color: var(--text-muted);
    font-size: 0.875rem;
}


/* 버튼 Ripple 효과 */
.btn {
    position: relative;
    overflow: hidden;
}

.btn-ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255,255,255,0.4);
    transform: scale(0);
    animation: ripple 0.6s linear;
    pointer-events: none;
}

@keyframes ripple {
    to {
        transform: scale(4);
        opacity: 0;
    }
}


/* 카드 Lift 효과 */
.lead-card,
.stat-card,
.rate-card,
.staff-card,
.monitor-card {
    transition: transform var(--ease-fast), box-shadow var(--ease-fast);
}

.lead-card:hover,
.stat-card:hover,
.rate-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.08);
}


/* 도넛 차트 */
.donut-chart {
    width: 120px;
    height: 120px;
    position: relative;
}

.donut-chart svg {
    transform: rotate(-90deg);
}

.donut-chart circle {
    fill: none;
    stroke-width: 20;
    stroke-linecap: round;
}

.donut-chart .donut-bg {
    stroke: var(--gray-100);
}

.donut-chart .donut-segment {
    transition: stroke-dasharray 0.8s ease;
}

.donut-chart .segment-call0 { stroke: var(--gray-400); }
.donut-chart .segment-call1 { stroke: #3b82f6; }
.donut-chart .segment-call2 { stroke: #f59e0b; }
.donut-chart .segment-call3 { stroke: #ef4444; }
.donut-chart .segment-meeting { stroke: #8b5cf6; }
.donut-chart .segment-payment { stroke: #10b981; }

.donut-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.donut-center-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1;
}

.donut-center-label {
    font-size: 0.6875rem;
    color: var(--text-muted);
}


/* 미니 바 차트 */
.mini-bar-chart {
    display: flex;
    align-items: flex-end;
    gap: 4px;
    height: 40px;
}

.mini-bar {
    flex: 1;
    background: linear-gradient(180deg, var(--primary) 0%, var(--primary-400) 100%);
    border-radius: 2px 2px 0 0;
    min-height: 4px;
    transition: height 0.5s ease;
}

.mini-bar.empty {
    background: var(--gray-200);
}


/* 키보드 단축키 힌트 */
.kbd {
    display: inline-block;
    padding: 0.125rem 0.375rem;
    font-family: ui-monospace, monospace;
    font-size: 0.6875rem;
    font-weight: 500;
    background: var(--gray-100);
    border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm);
    box-shadow: 0 1px 0 var(--gray-300);
    color: var(--text-subtle);
}


/* 고급 검색 패널 */
.advanced-search {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    margin-bottom: var(--sp-4);
}

.search-filters {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

.search-filter-group {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.search-filter-label {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--text-subtle);
}

.date-range-picker {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.date-range-picker input {
    width: 140px;
}

.date-range-separator {
    color: var(--text-muted);
}

.saved-searches {
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--border);
}

.saved-search-tag {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: 0.25rem 0.75rem;
    background: var(--gray-100);
    border-radius: var(--radius-full);
    font-size: 0.75rem;
    cursor: pointer;
    transition: all var(--ease-fast);
}

.saved-search-tag:hover {
    background: var(--primary-bg);
    color: var(--primary);
}


/* 퀵 액션 FAB */
/* 로그인 화면에서 FAB 숨기기 */
.login-screen.visible ~ .fab,
.login-screen.visible ~ .fab-menu {
    display: none !important;
}

.fab {
    position: fixed;
    bottom: var(--sp-6);
    right: var(--sp-6);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--gradient-primary);
    color: #fff;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(98, 125, 152, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    transition: transform var(--ease-fast), box-shadow var(--ease-fast);
    z-index: 100;
}

.fab:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 24px rgba(98, 125, 152, 0.3);
}

.fab:active {
    transform: scale(0.95);
}

.fab-menu {
    position: fixed;
    bottom: calc(var(--sp-6) + 70px);
    right: var(--sp-6);
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    z-index: 99;
}

.fab-menu-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-3);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    cursor: pointer;
    white-space: nowrap;
    font-size: 0.8125rem;
    transition: all var(--ease-fast);
    animation: fabMenuIn 0.2s ease backwards;
}

.fab-menu-item:nth-child(1) { animation-delay: 0s; }
.fab-menu-item:nth-child(2) { animation-delay: 0.05s; }
.fab-menu-item:nth-child(3) { animation-delay: 0.1s; }

@keyframes fabMenuIn {
    from { opacity: 0; transform: translateX(20px); }
    to { opacity: 1; transform: translateX(0); }
}

.fab-menu-item:hover {
    background: var(--primary-bg);
    color: var(--primary);
}


/* 통계 섹션 개선 */
.stats-section {
    margin-bottom: var(--sp-6);
}

.stats-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-4);
}

.stats-section-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text);
}

.stats-grid-kpi {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--sp-4);
}

.stats-charts-row {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--sp-4);
    margin-top: var(--sp-4);
}

@media (max-width: 768px) {
    .stats-charts-row {
        grid-template-columns: 1fr;
    }
}


/* 엑셀 내보내기 버튼 */
.btn-excel {
    background: #217346;
    color: #fff;
}

.btn-excel:hover {
    background: #1a5c38;
}


/* 단축키 목록 */
.shortcuts-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.shortcut-item {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--gray-100);
}

.shortcut-item:last-child {
    border-bottom: none;
}

.shortcut-item span {
    color: var(--text-subtle);
    font-size: 0.875rem;
}


/* 성공 토스트 */
.toast-success {
    background: var(--success);
    color: #fff;
}


/* 반응형 개선 */
@media (max-width: 640px) {
    .kpi-card {
        padding: var(--sp-3);
    }

    .kpi-value {
        font-size: 1.5rem;
    }

    .notification-panel {
        width: calc(100vw - var(--sp-4));
        right: calc(var(--sp-2) * -1);
    }

    .fab {
        bottom: var(--sp-4);
        right: var(--sp-4);
        width: 48px;
        height: 48px;
        font-size: 1.25rem;
    }
}


/* 모니터링 대시보드 - Calm Design */
.monitor-dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    margin-bottom: var(--sp-5);
    flex-wrap: wrap;
}

.monitor-dashboard-header h3 {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--text);
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.monitor-dashboard-header h3::before {
    content: '';
    width: 3px;
    height: 22px;
    background: var(--primary);
    border-radius: var(--radius-full);
}

.monitor-view-selector {
    display: flex;
    gap: var(--sp-1);
    background: var(--slate-100);
    padding: var(--sp-1);
    border-radius: var(--radius-xl);
}

.monitor-view-btn {
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-subtle);
    background: transparent;
    border: none;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    min-height: 36px;
}

.monitor-view-btn:hover {
    color: var(--text);
    background: rgba(255,255,255,0.5);
}

.monitor-view-btn.active {
    color: var(--primary-700);
    background: var(--card);
    box-shadow: var(--shadow-sm);
}

/* 1차/2차 데이터 유형 선택 */
.monitor-data-type-selector,
.stats-data-type-selector {
    display: flex;
    gap: var(--sp-1);
    background: var(--slate-200);
    padding: 3px;
    border-radius: var(--radius-xl);
    margin-right: var(--sp-4);
}

.monitor-data-type-btn,
.stats-data-type-btn {
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-subtle);
    background: transparent;
    border: none;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    min-height: 36px;
    white-space: nowrap;
}

.monitor-data-type-btn:hover,
.stats-data-type-btn:hover {
    color: var(--text);
    background: rgba(255,255,255,0.5);
}

.monitor-data-type-btn.active,
.stats-data-type-btn.active {
    color: #fff;
    background: var(--primary);
    box-shadow: var(--shadow-sm);
}

.monitor-data-type-btn[data-type="primary"].active,
.stats-data-type-btn[data-type="primary"].active {
    background: var(--cyan-600);
}

/* 1차 가망 모니터링 스타일 */
.primary-monitor-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}

.primary-monitor-stat-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-4) var(--sp-5);
    text-align: center;
    transition: transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out);
}

.primary-monitor-stat-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.pm-stat-value {
    font-size: 28px;
    font-weight: 800;
    color: var(--text);
    line-height: 1.2;
}

.pm-stat-label {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-top: var(--sp-1);
}

.primary-monitor-stat-card.status-approved .pm-stat-value {
    color: var(--success);
}

.primary-monitor-stat-card.status-rejected .pm-stat-value {
    color: var(--error);
}

.primary-monitor-stat-card.status-distributed .pm-stat-value {
    color: var(--primary);
}

.primary-monitor-stat-card.status-converted .pm-stat-value {
    color: var(--cyan-600);
}

.primary-monitor-staff-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--sp-4);
}

.primary-monitor-staff-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-4);
    transition: transform var(--duration-normal) var(--ease-out), box-shadow var(--duration-normal) var(--ease-out);
}

.primary-monitor-staff-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}

.pm-staff-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-3);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border);
}

.pm-staff-name {
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--text);
}

.pm-staff-role {
    font-size: var(--text-xs);
    color: var(--text-subtle);
    background: var(--slate-100);
    padding: 2px 8px;
    border-radius: var(--radius-full);
}

.pm-staff-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-2);
}

.pm-staff-stat {
    text-align: center;
    padding: var(--sp-2);
    background: var(--slate-50);
    border-radius: var(--radius);
}

.pm-staff-stat-value {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
}

.pm-staff-stat-label {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

/* 1차 가망 통계 스타일 */
.primary-stats-section .stats-grid {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
}

.stat-card-draft {
    border-left-color: var(--slate-400);
}

.stat-card-submitted {
    border-left-color: var(--warning);
}

.stat-card-approved {
    border-left-color: var(--success);
}

.stat-card-rejected {
    border-left-color: var(--error);
}

.stat-card-distributed {
    border-left-color: var(--primary);
}

.stat-card-converted {
    border-left-color: var(--cyan-600);
}

.stat-icon-draft {
    background: var(--slate-100);
    color: var(--slate-600);
}

.stat-icon-submitted {
    background: var(--warning-light);
    color: var(--warning);
}

.stat-icon-approved {
    background: var(--success-light);
    color: var(--success);
}

.stat-icon-rejected {
    background: var(--error-light);
    color: var(--error);
}

.stat-icon-distributed {
    background: var(--primary-light);
    color: var(--primary);
}

.stat-icon-converted {
    background: rgba(8, 145, 178, 0.1);
    color: var(--cyan-600);
}

/* 1차 가망 통계 레벨 선택 */
.primary-stats-level-selector {
    display: flex;
    gap: var(--sp-1);
    background: var(--slate-100);
    padding: var(--sp-1);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-inner);
    margin-bottom: var(--sp-4);
    width: fit-content;
}

.primary-stats-level-btn {
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 500;
    border-radius: var(--radius-lg);
    border: none;
    background: transparent;
    color: var(--text-subtle);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.primary-stats-level-btn:hover {
    color: var(--text);
    background: var(--slate-50);
}

.primary-stats-level-btn.active {
    background: var(--card);
    color: var(--text);
    box-shadow: var(--shadow-sm);
}

/* 1차 가망 지사별 테이블 */
.primary-branch-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
    background: var(--card);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.primary-branch-table th,
.primary-branch-table td {
    padding: var(--sp-3) var(--sp-4);
    text-align: center;
    border-bottom: 1px solid var(--border);
}

.primary-branch-table th {
    background: var(--slate-100);
    font-weight: 600;
    color: var(--text);
}

.primary-branch-table td:first-child {
    text-align: left;
}

.primary-branch-table tr:hover {
    background: var(--slate-50);
}

.primary-branch-table .text-success {
    color: var(--success);
    font-weight: 600;
}

.primary-branch-table .text-error {
    color: var(--error);
}

.primary-branch-table .text-primary {
    color: var(--primary);
    font-weight: 600;
}

.primary-funnel-section {
    margin-top: var(--sp-6);
    padding: var(--sp-5);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
}

.primary-funnel-section h4 {
    margin-bottom: var(--sp-4);
    font-size: var(--text-base);
    font-weight: 600;
    color: var(--text);
}

.primary-funnel-chart {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.primary-funnel-bar {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.primary-funnel-label {
    width: 80px;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    text-align: right;
}

.primary-funnel-track {
    flex: 1;
    height: 28px;
    background: var(--slate-100);
    border-radius: var(--radius);
    overflow: hidden;
}

.primary-funnel-fill {
    height: 100%;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: var(--sp-2);
    transition: width var(--duration-slow) var(--ease-out);
}

.primary-funnel-fill span {
    font-size: var(--text-xs);
    font-weight: 700;
    color: #fff;
}

.primary-fill {
    background: var(--cyan-600);
}

.primary-fill-success {
    background: var(--success);
}

/* Chip Selection Bar */
.monitor-chips-bar {
    margin-bottom: var(--sp-4);
    flex-shrink: 0;
}

.monitor-branch-chips,
.monitor-team-chips,
.monitor-trainee-chips {
    display: flex;
    gap: var(--sp-2);
    flex-wrap: wrap;
    align-items: center;
}

.chips-bar-label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-subtle);
    margin-right: var(--sp-2);
}

#monitorTraineeChipsBar {
    display: flex;
    align-items: center;
}

.chip {
    padding: var(--sp-1-5) var(--sp-3);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-subtle);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
}

.chip:hover {
    border-color: var(--primary-300);
    color: var(--text);
}

.chip.active {
    background: var(--primary-bg-strong);
    border-color: var(--primary-300);
    color: var(--primary-700);
    font-weight: 600;
}

/* Branch Drilldown List */
.branch-drilldown-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--sp-4);
    padding: var(--sp-4);
    animation: fadeIn var(--duration-normal) var(--ease-out);
}

.branch-drilldown-team {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.branch-drilldown-team:hover {
    border-color: var(--primary-300);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.branch-drilldown-team-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-3);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border-subtle);
}

.branch-drilldown-team-name {
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--text);
}

.branch-drilldown-team-count {
    font-size: var(--text-xs);
    color: var(--text-subtle);
    background: var(--slate-100);
    padding: 2px 8px;
    border-radius: var(--radius-full);
}

.branch-drilldown-team-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-2);
}

.branch-drilldown-stat {
    text-align: center;
    padding: var(--sp-2);
    background: var(--slate-50);
    border-radius: var(--radius);
}

.branch-drilldown-stat-value {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
}

.branch-drilldown-stat-label {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.branch-drilldown-back {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--primary);
    background: var(--primary-bg);
    border: 1px solid var(--primary-200);
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    margin-bottom: var(--sp-4);
}

.branch-drilldown-back:hover {
    background: var(--primary-bg-strong);
    border-color: var(--primary-300);
}

.branch-drilldown-title {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
    margin-bottom: var(--sp-4);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border);
}

/* Stats Trainee Filter */
.stats-trainee-filter {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-left: var(--sp-3);
    padding-left: var(--sp-3);
    border-left: 1px solid var(--border);
}

.stats-trainee-chip {
    padding: var(--sp-1) var(--sp-2-5);
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--text-subtle);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.stats-trainee-chip:hover {
    border-color: var(--primary-300);
    color: var(--text);
}

.stats-trainee-chip.active {
    background: var(--primary-bg-strong);
    border-color: var(--primary-300);
    color: var(--primary-700);
    font-weight: 600;
}

/* Monitor Dashboard Grid */
.monitor-dashboard {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    gap: var(--sp-5);
    flex: 1;
}

.monitor-loading {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-16);
}

/* Comparison Card */
.monitor-comparison-card {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-xl);
    padding: var(--sp-5);
    box-shadow: var(--glass-shadow), var(--glass-edge-light);
    transition: var(--glass-transition);
}

.monitor-comparison-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.monitor-comparison-card.clickable {
    cursor: pointer;
}

.monitor-card-drill {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-left: auto;
    opacity: 0.5;
    transition: opacity 0.2s;
}

.monitor-comparison-card.clickable:hover .monitor-card-drill {
    opacity: 1;
    color: var(--primary);
}

/* Team Drilldown */
.team-drilldown-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.team-drilldown-member {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    background: var(--slate-50);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: background 0.2s;
}

.team-drilldown-member:hover {
    background: var(--slate-100);
}

.team-drilldown-member .member-info {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.team-drilldown-member .member-name {
    font-weight: 600;
    color: var(--text);
}

.team-drilldown-member .member-role {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

.team-drilldown-member .member-stats {
    display: flex;
    gap: var(--sp-4);
}

.team-drilldown-member .stat-item {
    font-size: var(--text-sm);
    color: var(--text-subtle);
}

.team-drilldown-member .stat-item strong {
    color: var(--text);
}

.team-drilldown-member .stat-item.text-error strong {
    color: var(--error);
}

.monitor-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-4);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border-subtle);
}

.monitor-card-title {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
}

.monitor-card-badge {
    font-size: var(--text-xs);
    font-weight: 600;
    color: var(--text-muted);
    background: var(--slate-100);
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-full);
}

.monitor-card-total {
    display: flex;
    align-items: baseline;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.monitor-card-total .total-value {
    font-size: var(--text-3xl);
    font-weight: 800;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.monitor-card-total .total-label {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* Bar Chart Rows */
.monitor-stat-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-2) 0;
}

.monitor-stat-row + .monitor-stat-row {
    border-top: 1px solid var(--border-subtle);
}

.monitor-stat-label {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-subtle);
    min-width: 64px;
    flex-shrink: 0;
}

.monitor-stat-bar {
    flex: 1;
    height: 6px;
    background: var(--slate-100);
    border-radius: var(--radius-full);
    overflow: hidden;
}

.monitor-stat-fill {
    height: 100%;
    border-radius: var(--radius-full);
    transition: width 0.5s var(--ease-out);
    min-width: 0;
}

.monitor-stat-fill.fill-call0 { background: var(--slate-400); }
.monitor-stat-fill.fill-call1 { background: #60a5fa; }
.monitor-stat-fill.fill-call2 { background: var(--primary-400); }
.monitor-stat-fill.fill-call3 { background: #f87171; }
.monitor-stat-fill.fill-meeting { background: #34d399; }
.monitor-stat-fill.fill-payment { background: var(--primary); }

.monitor-stat-value {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    min-width: 48px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.monitor-stat-pct {
    font-size: var(--text-xs);
    color: var(--text-muted);
    min-width: 36px;
    text-align: right;
}

/* Individual Staff Card in Monitor */
.monitor-staff-card {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    cursor: pointer;
    transition: var(--glass-transition);
    box-shadow: var(--glass-shadow), var(--glass-edge-light);
}

.monitor-staff-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.monitor-staff-name {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--text);
    margin-bottom: var(--sp-1);
}

.monitor-staff-role {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-bottom: var(--sp-3);
}

.monitor-staff-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-2);
}

.monitor-staff-stat {
    text-align: center;
}

.monitor-staff-stat-value {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.monitor-staff-stat-label {
    font-size: 0.625rem;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
}

.monitor-staff-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--sp-3);
}

.monitor-staff-info { flex: 1; }

.monitor-staff-name {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.monitor-rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 20px;
    font-size: 11px;
    font-weight: 700;
    border-radius: var(--radius-full);
    padding: 0 6px;
}
.monitor-rank-badge.rank-1 { background: linear-gradient(135deg, #ffd700, #ffb800); color: #7c5800; }
.monitor-rank-badge.rank-2 { background: linear-gradient(135deg, #c0c0c0, #a8a8a8); color: #505050; }
.monitor-rank-badge.rank-3 { background: linear-gradient(135deg, #cd7f32, #a86428); color: #fff; }
.monitor-rank-badge.rank-other { background: var(--slate-100); color: var(--text-muted); }

.monitor-staff-delta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    font-size: 11px;
    font-weight: 600;
}
.monitor-staff-delta .delta-up { color: var(--success); }
.monitor-staff-delta .delta-down { color: var(--error); }
.monitor-staff-delta .delta-same { color: var(--text-muted); }

.monitor-staff-rates {
    display: flex;
    gap: var(--sp-3);
    margin-top: var(--sp-3);
    padding-top: var(--sp-3);
    border-top: 1px solid var(--border-subtle);
}

.monitor-staff-rates .rate-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.monitor-staff-rates .rate-label {
    font-size: 10px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.monitor-staff-rates .rate-value {
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--primary);
}

.monitor-staff-rates .rate-value.text-error { color: var(--error); }

/* 모니터링 개인별 콜 단계 표시 */
.monitor-staff-calls {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--sp-2);
    margin-top: var(--sp-3);
    padding: var(--sp-2) 0;
    background: var(--surface-subtle);
    border-radius: var(--radius-md);
}

.monitor-staff-calls .call-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: var(--sp-1) 0;
}

.monitor-staff-calls .call-label {
    font-size: 10px;
    color: var(--text-muted);
    font-weight: 500;
}

.monitor-staff-calls .call-value {
    font-size: var(--text-md);
    font-weight: 700;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.monitor-staff-calls .call-pct {
    font-size: 10px;
    color: var(--text-subtle);
}

.monitor-staff-calls .call-item.call-warning {
    background: rgba(239, 68, 68, 0.1);
    border-radius: var(--radius-sm);
}

.monitor-staff-calls .call-item.call-warning .call-value,
.monitor-staff-calls .call-item.call-warning .call-pct {
    color: var(--error);
}

/* 직원 생성 - 계열/직급 선택 */
.role-line-selector {
    display: flex;
    gap: var(--sp-2);
    background: var(--slate-100);
    padding: var(--sp-1);
    border-radius: var(--radius-lg);
}

.role-line-btn {
    flex: 1;
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-subtle);
    background: transparent;
    border: none;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.role-line-btn:hover {
    color: var(--text);
}

.role-line-btn.active {
    background: var(--card);
    color: var(--primary-700);
    box-shadow: var(--shadow-sm);
}

.role-type-selector {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.radio-card {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    background: var(--surface-subtle);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.radio-card:hover {
    background: var(--surface);
    border-color: var(--primary-200);
}

.radio-card:has(input:checked) {
    background: var(--primary-bg);
    border-color: var(--primary-300);
}

.radio-card input[type="radio"] {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--primary);
}

.radio-card-label {
    font-weight: 600;
    color: var(--text);
    font-size: var(--text-sm);
}

.radio-card-desc {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-left: auto;
}

/* 파일 가져오기 스타일 */
.import-body {
    padding: var(--sp-5) var(--sp-6);
    overflow-y: auto;
    max-height: 70vh;
}

.import-steps-indicator {
    display: flex;
    gap: var(--sp-3);
    margin-bottom: var(--sp-6);
    padding-bottom: var(--sp-4);
    border-bottom: 1px solid var(--border-subtle);
}

.import-steps-indicator .step {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-muted);
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--radius-full);
    background: var(--slate-100);
}

.import-steps-indicator .step.active {
    color: var(--primary-700);
    background: var(--primary-bg-strong);
    font-weight: 600;
}

.import-steps-indicator .step.done {
    color: var(--success);
    background: var(--success-bg);
}

/* Drop Zone */
.import-dropzone {
    border: 2px dashed var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-10) var(--sp-6);
    text-align: center;
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    background: var(--bg-sunken);
    margin-bottom: var(--sp-5);
}

.import-dropzone:hover {
    border-color: var(--primary-300);
    background: var(--primary-bg);
}

.import-dropzone.dragover {
    border-color: var(--primary);
    background: var(--primary-bg-strong);
    border-style: solid;
}

.dropzone-icon {
    font-size: 2rem;
    margin-bottom: var(--sp-3);
    opacity: 0.6;
}

.dropzone-text {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--sp-1);
}

.dropzone-hint {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* Paste Section */
.import-paste-section {
    margin-bottom: var(--sp-5);
}

.import-paste-section label {
    display: block;
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--sp-2);
}

.import-paste-area {
    width: 100%;
    padding: var(--sp-3) var(--sp-4);
    font-size: var(--text-sm);
    font-family: var(--font-mono);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-lg);
    background: var(--bg);
    color: var(--text);
    resize: vertical;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.import-paste-area:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

/* Preview Table */
.import-preview-header {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-bottom: var(--sp-3);
    font-size: var(--text-sm);
    font-weight: 600;
}

.import-preview-table-wrap {
    overflow-x: auto;
    margin-bottom: var(--sp-4);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
}

.import-preview-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
}

.import-preview-table th {
    background: var(--slate-50);
    padding: var(--sp-2-5) var(--sp-3);
    text-align: left;
    font-weight: 600;
    color: var(--text-subtle);
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.import-preview-table td {
    padding: var(--sp-2) var(--sp-3);
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text);
}

.import-preview-table td[contenteditable="true"] {
    cursor: text;
    outline: none;
    transition: background var(--duration-fast) var(--ease-out);
}

.import-preview-table td[contenteditable="true"]:focus {
    background: var(--primary-bg);
}

.import-preview-table tr:last-child td {
    border-bottom: none;
}

.import-preview-table .row-remove {
    color: var(--text-muted);
    cursor: pointer;
    text-align: center;
    font-size: var(--text-lg);
    padding: 0 var(--sp-2);
}

.import-preview-table .row-remove:hover {
    color: var(--danger);
}

.import-preview-table .notes-cell {
    white-space: pre-wrap;
    word-break: break-word;
    max-width: 250px;
    min-width: 100px;
}

/* Failed Section */
.import-failed-section {
    padding: var(--sp-4);
    background: var(--danger-bg);
    border: 1px solid rgba(220, 38, 38, 0.1);
    border-radius: var(--radius-lg);
    margin-bottom: var(--sp-4);
}

.import-failed-section h4 {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--danger);
    margin-bottom: var(--sp-1);
}

/* Step Actions */
.import-step-actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--sp-3);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--border-subtle);
}

/* Result */
.import-result {
    text-align: center;
    padding: var(--sp-8) var(--sp-4);
}

.import-result-icon {
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--success-bg);
    color: var(--success);
    font-size: var(--text-2xl);
    font-weight: 700;
    border-radius: var(--radius-full);
    margin-bottom: var(--sp-4);
}

.import-result h3 {
    font-size: var(--text-xl);
    margin-bottom: var(--sp-2);
}

.import-result p {
    color: var(--text-subtle);
    font-size: var(--text-md);
}

.import-result-stats {
    display: flex;
    justify-content: center;
    gap: var(--sp-6);
    margin-top: var(--sp-5);
}

.import-result-stats > div {
    text-align: center;
}

.import-result-stats .stat-num {
    font-size: var(--text-3xl);
    font-weight: 800;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.import-result-stats .stat-lbl {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* 실패 항목 상세 */
.import-failed-details {
    margin-top: var(--sp-4);
    padding: var(--sp-4);
    background: var(--bg-sunken);
    border-radius: var(--radius-lg);
    max-height: 200px;
    overflow-y: auto;
    text-align: left;
}

.import-failed-list h4 {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--danger);
    margin-bottom: var(--sp-2);
}

.import-failed-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.import-failed-list li {
    font-size: var(--text-xs);
    color: var(--text-secondary);
    padding: var(--sp-2);
    border-bottom: 1px solid var(--border);
}

.import-failed-list li:last-child {
    border-bottom: none;
}

.import-failed-list .error-reason {
    color: var(--danger);
    font-weight: 500;
}

/* Parse Verify Modal */
.parse-verify-body {
    padding: var(--sp-5) var(--sp-6);
    overflow-y: auto;
    max-height: 60vh;
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
}

.parse-verify-item {
    background: var(--bg-sunken);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
}

.parse-verify-original {
    font-size: var(--text-sm);
    font-family: var(--font-mono);
    color: var(--text-subtle);
    padding: var(--sp-2) var(--sp-3);
    background: var(--card);
    border-radius: var(--radius-md);
    margin-bottom: var(--sp-3);
    word-break: break-all;
}

.parse-verify-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-2);
}

.parse-verify-fields input {
    width: 100%;
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
}

.parse-verify-fields input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px var(--primary-ring);
}


/* UX 개선 스타일 */

/* Input Error State */
.input-error {
    border-color: var(--danger) !important;
    background: var(--danger-bg) !important;
}

.field-error-msg {
    font-size: var(--text-xs);
    color: var(--danger);
    margin-top: var(--sp-1);
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

/* Skeleton Loading */
.skeleton {
    position: relative;
    overflow: hidden;
    background: var(--slate-100) !important;
    color: transparent !important;
    border-color: transparent !important;
    pointer-events: none;
}

.skeleton * {
    visibility: hidden;
}

.skeleton::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.5) 50%, transparent 100%);
    animation: skeletonShimmer 1.5s ease-in-out infinite;
}

@keyframes skeletonShimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* Empty State CTA */
.empty-state-cta {
    text-align: center;
    padding: var(--sp-12) var(--sp-4);
}

.empty-state-cta .empty-icon {
    font-size: 2.5rem;
    opacity: 0.4;
    margin-bottom: var(--sp-4);
}

.empty-state-cta p {
    font-size: var(--text-md);
    color: var(--text-muted);
    margin-bottom: var(--sp-5);
}

/* Skip Link (Accessibility) */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--primary);
    color: var(--text-inverted);
    padding: var(--sp-2) var(--sp-4);
    z-index: var(--z-max);
    border-radius: 0 0 var(--radius-md) 0;
    font-weight: 600;
    transition: top var(--duration-fast) var(--ease-out);
}

.skip-link:focus {
    top: 0;
}


/* 반응형: 모니터링 대시보드 */
@media (max-width: 768px) {
    .monitor-dashboard-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .monitor-view-selector {
        width: 100%;
    }

    .monitor-view-btn {
        flex: 1;
        text-align: center;
    }

    .monitor-dashboard {
        grid-template-columns: 1fr;
        gap: var(--sp-4);
    }

    .monitor-staff-stats {
        grid-template-columns: repeat(3, 1fr);
    }

    .import-body {
        padding: var(--sp-4);
    }

    .import-dropzone {
        padding: var(--sp-6) var(--sp-4);
    }

    .parse-verify-fields {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .monitor-branch-chips,
    .monitor-team-chips {
        gap: var(--sp-1);
    }

    .chip {
        padding: var(--sp-1) var(--sp-2);
        font-size: var(--text-xs);
        min-height: 28px;
    }

    .monitor-comparison-card {
        padding: var(--sp-4);
    }

    .import-preview-table {
        font-size: var(--text-xs);
    }

    .import-preview-table th,
    .import-preview-table td {
        padding: var(--sp-1-5) var(--sp-2);
    }
}


/* 삭제 취소 Undo 토스트 */
.toast-undo {
    background: var(--slate-800);
    color: #fff;
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
}

.btn-undo {
    background: transparent;
    color: var(--primary-200);
    border: 1px solid var(--primary-300);
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    white-space: nowrap;
}

.btn-undo:hover {
    background: rgba(255,255,255,0.15);
    color: #fff;
}


/* 일괄 상태 변경 셀렉트 */
.bulk-status-select {
    padding: var(--sp-1-5) var(--sp-3);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: var(--radius-md);
    background: rgba(255,255,255,0.15);
    color: #fff;
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
}

.bulk-status-select option {
    background: var(--slate-800);
    color: #fff;
}

.bulk-status-btn {
    padding: var(--sp-1-5) var(--sp-3);
    background: rgba(255,255,255,0.2);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: background var(--duration-fast) var(--ease-out);
}

.bulk-status-btn:hover {
    background: rgba(255,255,255,0.3);
}


/* 저장 버튼 비활성화 */
.btn:disabled,
.btn[disabled] {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}


/* ================================================================ */
/* SIDEBAR NAVIGATION SYSTEM                            */
/* ================================================================ */

/* --- Main App layout with sidebar --- */
.main-app {
    display: flex;
    min-height: 100vh;
    flex-direction: row;
}

/* --- Sidebar --- */
.sidebar {
    width: 240px;
    min-width: 240px;
    background: #ffffff;
    border-right: 1px solid #e2e8f0;
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.04);
    color: #334155;
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: var(--z-fixed);
    transition: width var(--duration-slow) var(--ease-in-out), min-width var(--duration-slow) var(--ease-in-out);
    overflow: hidden;
}

.sidebar.collapsed {
    width: 64px;
    min-width: 64px;
}

.sidebar-header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--sp-3);
    border-bottom: 1px solid #f1f5f9;
    height: 64px;
    flex-shrink: 0;
}

.sidebar:not(.collapsed) .sidebar-header {
    justify-content: flex-start;
    padding: var(--sp-3) var(--sp-4);
}

.sidebar-logo-btn {
    position: relative;
    height: 36px;
    min-width: 36px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    border-radius: var(--radius-md);
    transition: background 0.2s ease;
}

.sidebar-logo-btn:hover {
    background: rgba(0, 0, 0, 0.04);
}

.sidebar-logo {
    height: 32px;
    width: auto;
    object-fit: contain;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.sidebar-logo-full {
    opacity: 1;
    transform: scale(1);
}

.sidebar-logo-icon {
    position: absolute;
    left: 4px;
    height: 32px;
    max-height: 32px;
    width: auto;
    opacity: 0;
    transform: scale(0.8);
    object-fit: contain;
}

.sidebar.collapsed .sidebar-logo-btn {
    justify-content: center;
    width: 100%;
    height: 44px;
    padding: 6px;
}

.sidebar.collapsed .sidebar-logo-full {
    opacity: 0;
    transform: scale(0.8);
    position: absolute;
    pointer-events: none;
}

.sidebar.collapsed .sidebar-logo-icon {
    opacity: 1;
    transform: scale(1);
    position: relative;
    left: 0;
    height: 32px;
    max-height: 32px;
}

/* --- Sidebar Navigation --- */
.sidebar-nav {
    flex: 1;
    padding: var(--sp-3) var(--sp-2);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    overflow-y: auto;
    scrollbar-width: none;
}

.sidebar-nav::-webkit-scrollbar {
    display: none;
}

.sidebar-nav-item {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-2-5) var(--sp-3);
    background: transparent;
    border: none;
    color: #64748b;
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
    border-radius: 10px;
    transition: all 0.2s ease;
    white-space: nowrap;
    width: 100%;
    text-align: left;
    min-height: 44px;
    position: relative;
}

.sidebar-nav-item:hover {
    background: #f8fafc;
    color: #334155;
}

.sidebar-nav-item.active {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    color: #2563eb;
    font-weight: 600;
    box-shadow: none;
}

.sidebar-nav-item.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 24px;
    background: #3b82f6;
    border-radius: 0 4px 4px 0;
}

.sidebar-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.sidebar-nav-label {
    opacity: 1;
    transition: opacity var(--duration-normal) var(--ease-out);
    overflow: hidden;
}

.sidebar.collapsed .sidebar-nav-label {
    opacity: 0;
    width: 0;
}

.sidebar.collapsed .sidebar-nav-item {
    justify-content: center;
    padding: var(--sp-2-5) 0;
}

/* --- Sidebar Footer --- */
.sidebar-footer {
    border-top: 1px solid #f1f5f9;
    padding: var(--sp-3) var(--sp-2);
    flex-shrink: 0;
}

.sidebar-footer-btn {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    width: 100%;
    padding: var(--sp-2-5) var(--sp-3);
    background: transparent;
    border: none;
    color: #64748b;
    font-size: var(--text-sm);
    cursor: pointer;
    border-radius: var(--radius-lg);
    transition: background 0.15s ease-out, color 0.15s ease-out;
}

.sidebar-footer-btn:hover {
    background: #f8fafc;
    color: #334155;
}

.sidebar.collapsed .sidebar-footer-btn {
    justify-content: center;
    padding: var(--sp-2-5) 0;
}

/* (Dark mode removed) */


/* ================================================================ */
/* MAIN CONTENT AREA                                    */
/* ================================================================ */

.main-content {
    flex: 1;
    margin-left: 240px;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    transition: margin-left var(--duration-slow) var(--ease-in-out);
    min-width: 0;
}

.sidebar.collapsed ~ .main-content {
    margin-left: 64px;
}

/* --- Page title in header --- */
.page-title {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text);
    letter-spacing: var(--tracking-tight);
}

/* --- Mobile sidebar toggle button --- */
.mobile-sidebar-toggle {
    display: none;
    background: none;
    border: none;
    color: var(--text);
    cursor: pointer;
    padding: var(--sp-1);
    border-radius: var(--radius-md);
    transition: background var(--duration-fast) var(--ease-out);
}

.mobile-sidebar-toggle:hover {
    background: rgba(0, 0, 0, 0.06);
}

/* --- Header Logout Button --- */
.header-logout-btn {
    color: var(--text-secondary);
    border: 1.5px solid rgba(0, 0, 0, 0.12);
    font-size: var(--text-sm);
    font-weight: 600;
    padding: var(--sp-2) var(--sp-4);
    min-height: 36px;
    border-radius: var(--radius-lg);
    background: #ffffff;
    transition: background 0.15s ease-out, border-color 0.15s ease-out, color 0.15s ease-out;
}

.header-logout-btn:hover {
    color: var(--text);
    border-color: rgba(0, 0, 0, 0.2);
    background: #f8fafc;
}


/* ================================================================ */
/* MOBILE BOTTOM TABBAR                                 */
/* ================================================================ */

.mobile-tabbar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: var(--card);
    border-top: 1px solid var(--border);
    z-index: var(--z-fixed);
    justify-content: space-around;
    align-items: center;
    padding: 0 var(--sp-2);
    box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
}

.mobile-tab-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 0.625rem;
    font-weight: 500;
    cursor: pointer;
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-md);
    transition: color var(--duration-fast) var(--ease-out);
    min-width: 56px;
}

.mobile-tab-item svg {
    width: 22px;
    height: 22px;
}

.mobile-tab-item.active {
    color: var(--primary);
    font-weight: 600;
}

.mobile-tab-item:hover {
    color: var(--primary-hover);
}


/* ================================================================ */
/* SIDEBAR OVERLAY (Mobile)                             */
/* ================================================================ */

.sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.5);
    z-index: calc(var(--z-fixed) - 1);
    opacity: 0;
    transition: opacity var(--duration-normal) var(--ease-out);
}

.sidebar-overlay.active {
    display: block;
    opacity: 1;
}


/* ================================================================ */
/* DASHBOARD HOME TAB                                   */
/* ================================================================ */

.dashboard-home {
    display: flex;
    flex-direction: column;
    gap: var(--sp-6);
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--sp-4);
}

.kpi-card.kpi-accent {
    border-left: 3px solid var(--primary);
}

.kpi-card.kpi-accent .kpi-value {
    color: var(--primary-700);
}

/* Dashboard Charts Row */
.dashboard-charts-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--sp-5);
}

.dashboard-chart-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-card);
}

.card-header-simple {
    padding: var(--sp-4) var(--sp-5);
    border-bottom: 1px solid var(--border-subtle);
}

.card-header-simple h3 {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--text);
}

.chart-area {
    padding: var(--sp-5);
    display: flex;
    align-items: center;
    justify-content: center;
}

.donut-chart-wrapper {
    display: flex;
    align-items: center;
    gap: var(--sp-5);
}

.donut-legend {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    font-size: var(--text-sm);
}

.donut-legend-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.donut-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: var(--radius-full);
    flex-shrink: 0;
}

.donut-legend-label {
    color: var(--text-subtle);
    font-size: var(--text-xs);
}

.donut-legend-value {
    font-weight: 600;
    color: var(--text);
    font-size: var(--text-xs);
    margin-left: auto;
    font-variant-numeric: tabular-nums;
}

/* Drilldown clickable legend items */
.donut-legend-item.drilldown-clickable {
    cursor: pointer;
    padding: var(--sp-1) var(--sp-2);
    margin: calc(-1 * var(--sp-1)) calc(-1 * var(--sp-2));
    border-radius: var(--radius-sm);
    transition: background 0.15s ease;
}

.donut-legend-item.drilldown-clickable:hover {
    background: var(--surface-hover);
}

/* Drilldown Modal Styles */
.drilldown-modal-content {
    max-width: 600px;
    width: 95%;
}

.drilldown-total {
    font-size: var(--text-sm);
    color: var(--text-subtle);
    font-weight: 500;
    margin-left: auto;
    margin-right: var(--sp-4);
}

.drilldown-breadcrumb {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-4);
    background: var(--surface);
    border-bottom: 1px solid var(--border);
    font-size: var(--text-sm);
    flex-wrap: wrap;
}

.drilldown-back-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: none;
    background: var(--surface-hover);
    border-radius: var(--radius-sm);
    cursor: pointer;
    color: var(--text);
    margin-right: var(--sp-2);
    transition: background 0.15s ease;
}

.drilldown-back-btn:hover {
    background: var(--border);
}

.breadcrumb-item {
    color: var(--text-subtle);
}

.breadcrumb-item.breadcrumb-clickable {
    color: var(--primary);
    cursor: pointer;
}

.breadcrumb-item.breadcrumb-clickable:hover {
    text-decoration: underline;
}

.breadcrumb-separator {
    color: var(--text-muted);
    margin: 0 var(--sp-1);
}

.drilldown-body {
    padding: 0;
    max-height: 60vh;
    overflow-y: auto;
}

.drilldown-list {
    display: flex;
    flex-direction: column;
}

.drilldown-loading,
.drilldown-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-3);
    padding: var(--sp-8);
    color: var(--text-subtle);
    font-size: var(--text-sm);
}

.drilldown-item {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border-light);
    transition: background 0.15s ease;
}

.drilldown-item:last-child {
    border-bottom: none;
}

.drilldown-item-clickable {
    cursor: pointer;
}

.drilldown-item-clickable:hover {
    background: var(--surface-hover);
}

.drilldown-item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    flex-shrink: 0;
}

.drilldown-branch .drilldown-item-icon {
    background: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

.drilldown-team .drilldown-item-icon {
    background: rgba(139, 92, 246, 0.1);
    color: #8b5cf6;
}

.drilldown-member .drilldown-item-icon {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
}

.drilldown-item-info {
    flex: 1;
    min-width: 0;
}

.drilldown-item-name {
    font-weight: 500;
    color: var(--text);
    font-size: var(--text-sm);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.drilldown-item-count {
    font-size: var(--text-xs);
    color: var(--text-subtle);
    margin-top: 2px;
}

.drilldown-arrow {
    color: var(--text-muted);
    flex-shrink: 0;
}

/* Dashboard Activity Card */
.dashboard-activity-card {
    display: flex;
    flex-direction: column;
}

.activity-feed-time {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* Quick Actions */
.quick-actions {
    display: flex;
    gap: var(--sp-3);
    flex-wrap: wrap;
    position: relative;
    z-index: 10;
}

.quick-action-btn {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-3) var(--sp-5);
    background: var(--card);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-xl);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--duration-normal) var(--ease-out);
    min-height: 48px;
}

.quick-action-btn svg {
    width: 18px;
    height: 18px;
}

.quick-action-btn:hover {
    border-color: var(--primary-300);
    color: var(--primary-700);
    background: var(--primary-bg);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}


/* ================================================================ */
/* KANBAN BOARD                                         */
/* ================================================================ */

.kanban-board {
    display: flex;
    gap: var(--sp-4);
    overflow-x: auto;
    padding-bottom: var(--sp-4);
    min-height: calc(100vh - 200px);
    -webkit-overflow-scrolling: touch;
}

.kanban-column {
    flex: 0 0 280px;
    background: var(--bg-sunken);
    border-radius: var(--radius-xl);
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 180px);
    border: 1px solid var(--border-subtle);
}

.kanban-column-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
    background: var(--card);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}

.kanban-col-title {
    font-size: var(--text-sm);
    font-weight: 700;
    color: var(--text);
}

.kanban-col-count {
    font-size: var(--text-xs);
    font-weight: 700;
    color: var(--text-muted);
    background: var(--slate-100);
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-variant-numeric: tabular-nums;
}

.kanban-column-body {
    flex: 1;
    padding: var(--sp-3);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    min-height: 100px;
}

.kanban-column-body.drag-over {
    background: var(--primary-bg);
    border: 2px dashed var(--primary-300);
    border-radius: 0 0 var(--radius-xl) var(--radius-xl);
}

.kanban-col-done .kanban-column-header {
    background: var(--success-bg);
}

.kanban-col-done .kanban-col-title {
    color: var(--success);
}

/* Kanban Card */
.kanban-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-3);
    cursor: grab;
    transition: all var(--duration-fast) var(--ease-out);
    box-shadow: var(--shadow-xs);
}

.kanban-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-1px);
}

.kanban-card.dragging {
    opacity: 0.5;
    cursor: grabbing;
    box-shadow: var(--shadow-xl);
    transform: rotate(2deg);
}

.kanban-card-name {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    margin-bottom: var(--sp-1);
}

.kanban-card-phone {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-bottom: var(--sp-2);
}

.kanban-card-badges {
    display: flex;
    gap: var(--sp-1);
    flex-wrap: wrap;
}

.kanban-card-date {
    font-size: 0.625rem;
    color: var(--text-muted);
    margin-top: var(--sp-2);
}


/* ================================================================ */
/* STATS BAR CHART SECTION                              */
/* ================================================================ */

.stats-bar-chart-section {
    margin-bottom: var(--sp-6);
    flex-shrink: 0;
}

.stats-bar-chart-section h4 {
    font-size: var(--text-lg);
    font-weight: 700;
    margin-bottom: var(--sp-4);
    color: var(--text);
}

.bar-chart-container {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-5);
    box-shadow: var(--shadow-card);
}

.bar-chart-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-2) 0;
}

.bar-chart-row + .bar-chart-row {
    border-top: 1px solid var(--border-subtle);
}

.bar-chart-label {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-subtle);
    min-width: 56px;
    flex-shrink: 0;
}

.bar-chart-track {
    flex: 1;
    height: 24px;
    background: var(--slate-100);
    border-radius: var(--radius-md);
    overflow: hidden;
    position: relative;
}

.bar-chart-fill {
    height: 100%;
    border-radius: var(--radius-md);
    transition: width 0.6s var(--ease-out);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: var(--sp-2);
    min-width: 0;
}

.bar-chart-fill-text {
    font-size: 0.625rem;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}

.bar-chart-value {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    min-width: 40px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}


/* ================================================================ */
/* SEARCH INPUT WRAPPER                                 */
/* ================================================================ */

.search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.search-input-wrapper .search-icon {
    position: absolute;
    left: var(--sp-3);
    width: 16px;
    height: 16px;
    color: var(--text-muted);
    pointer-events: none;
}

.search-input-wrapper .search-input {
    padding-left: calc(var(--sp-3) + 20px);
}


/* ================================================================ */
/* ADVANCED SEARCH FILTER INPUTS                        */
/* ================================================================ */

.filter-select {
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
    color: var(--text);
    min-height: 36px;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.filter-select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.filter-date-input {
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
    color: var(--text);
    min-height: 36px;
    transition: border-color var(--duration-fast) var(--ease-out);
}

.filter-date-input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}


/* ================================================================ */
/* MONITOR CONTROLS & REFRESH                           */
/* ================================================================ */

.monitor-controls {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    flex-wrap: wrap;
}

.monitor-refresh-info {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.monitor-last-refresh {
    font-weight: 500;
}

.monitor-auto-refresh-label {
    display: flex;
    align-items: center;
    gap: var(--sp-1);
    cursor: pointer;
    font-size: var(--text-xs);
    color: var(--text-subtle);
}

.monitor-auto-refresh-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--primary);
}


/* ================================================================ */
/* STACKED TOAST CONTAINER (Top-Right)                  */
/* ================================================================ */

.toast-container {
    position: fixed;
    top: var(--sp-5);
    right: var(--sp-5);
    z-index: var(--z-toast);
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    max-width: 380px;
    pointer-events: none;
}

.toast-item {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    background: #ffffff;
    background: rgba(255,255,255,0.97);
    border: 1.5px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: 0 8px 32px rgba(0,0,0,0.15), 0 2px 8px rgba(0,0,0,0.08);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text);
    animation: toastSlideIn 0.3s var(--ease-spring);
    pointer-events: auto;
    transition: opacity var(--duration-normal) var(--ease-out), transform var(--duration-normal) var(--ease-out);
}

.toast-item.toast-success {
    border-left: 3px solid var(--success);
}

.toast-item.toast-warning {
    border-left: 3px solid var(--warning);
}

.toast-item.toast-error {
    border-left: 3px solid var(--danger);
}

.toast-item.toast-info {
    border-left: 3px solid var(--info);
}

.toast-item.removing {
    opacity: 0;
    transform: translateX(100%);
}

.toast-item-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.toast-item-close {
    margin-left: auto;
    background: none;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    font-size: var(--text-lg);
    padding: 0;
    line-height: 1;
}

@keyframes toastSlideIn {
    from {
        opacity: 0;
        transform: translateX(100%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}


/* ================================================================ */
/* PREPARING ICON SVG                                   */
/* ================================================================ */

.preparing-icon-svg {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--sp-4);
    color: var(--warning);
}


/* (Dark mode section removed) */


/* ================================================================ */
/* RESPONSIVE: SIDEBAR + TABBAR                         */
/* ================================================================ */

@media (max-width: 1024px) {
    .sidebar {
        width: 64px;
        min-width: 64px;
    }

    .sidebar .sidebar-brand,
    .sidebar .sidebar-nav-label {
        opacity: 0;
        width: 0;
        overflow: hidden;
    }

    .sidebar .sidebar-nav-item {
        justify-content: center;
        padding: var(--sp-2-5) 0;
    }

    .sidebar .sidebar-footer-btn {
        justify-content: center;
        padding: var(--sp-2-5) 0;
    }

    .main-content {
        margin-left: 64px;
    }
}

@media (max-width: 768px) {
    .sidebar {
        transform: translateX(-100%);
        width: 260px;
        min-width: 260px;
        z-index: calc(var(--z-fixed) + 1);
    }

    .sidebar.mobile-open {
        transform: translateX(0);
    }

    .sidebar.mobile-open .sidebar-brand,
    .sidebar.mobile-open .sidebar-nav-label {
        opacity: 1;
        width: auto;
    }

    .sidebar.mobile-open .sidebar-nav-item {
        justify-content: flex-start;
        padding: var(--sp-2-5) var(--sp-3);
    }

    .sidebar.mobile-open .sidebar-footer-btn {
        justify-content: flex-start;
        padding: var(--sp-2-5) var(--sp-3);
    }

    .main-content {
        margin-left: 0;
    }

    .mobile-sidebar-toggle {
        display: flex;
    }

    .mobile-tabbar {
        display: flex;
    }

    .tab-content {
        padding-bottom: calc(var(--sp-6) + 60px);
    }

    .fab {
        bottom: calc(var(--sp-6) + 60px);
    }

    .fab-menu {
        bottom: calc(var(--sp-6) + 130px);
    }

    .bulk-action-bar {
        bottom: 60px;
    }

    .kpi-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--sp-3);
    }

    .dashboard-charts-row {
        grid-template-columns: 1fr;
    }

    .kanban-board {
        min-height: auto;
    }

    .kanban-column {
        flex: 0 0 260px;
    }
}

@media (max-width: 480px) {
    .kpi-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--sp-2);
    }

    .quick-actions {
        flex-direction: column;
    }

    .quick-action-btn {
        width: 100%;
    }

    .kanban-column {
        flex: 0 0 240px;
    }

    .page-title {
        font-size: var(--text-md);
    }

    .mobile-tabbar {
        height: 56px;
    }
}


/* ================================================================ */
/* DONUT CHART WRAPPER (Larger for Dashboard)           */
/* ================================================================ */

#dashboard-donut {
    width: 180px;
    height: 180px;
}

#dashboard-donut svg {
    transform: rotate(-90deg);
}

#dashboard-donut .donut-bg {
    fill: none;
    stroke: var(--slate-100);
    stroke-width: 16;
}

#dashboard-donut .donut-segment {
    fill: none;
    stroke-width: 16;
    stroke-linecap: round;
    transition: stroke-dasharray 0.8s ease;
}

#dashboard-donut .donut-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#dashboard-donut .donut-center-value {
    font-size: var(--text-3xl);
    font-weight: 800;
}

/* Inline Editing */

.inline-editable {
    cursor: text;
    border-bottom: 1px dashed transparent;
    transition: border-color 0.2s ease;
    padding-bottom: 1px;
}

.inline-editable:hover {
    border-bottom-color: var(--color-primary);
}

.inline-edit-input {
    width: 100%;
    padding: 2px 4px;
    border: 1px solid var(--color-primary);
    border-radius: 4px;
    font-size: inherit;
    font-family: inherit;
    background: var(--surface-primary);
    color: var(--text-primary);
    outline: none;
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.2);
}

.inline-edit-input:focus {
    border-color: var(--color-primary-dark);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.3);
}

/* Sort Indicator */

.sort-indicator {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    cursor: pointer;
    user-select: none;
}

.sort-indicator:hover {
    color: var(--color-primary);
}

.sort-indicator .sort-arrow {
    opacity: 0.3;
    font-size: 10px;
    transition: opacity 0.2s;
}

.sort-indicator.active .sort-arrow {
    opacity: 1;
    color: var(--color-primary);
}

/* Advanced Filter Enhancements */

.filter-sort {
    padding: 6px 10px;
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    background: var(--surface-primary);
    color: var(--text-primary);
    font-size: var(--text-sm);
    min-width: 140px;
}

/* Notification Enhancements */

.notification-unread-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--danger);
    flex-shrink: 0;
}

/* Toast Removing Animation */

.toast-item.removing {
    opacity: 0;
    transform: translateX(100%);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

/* Staff Card v2 */

.staff-summary {
    display: flex;
    gap: 1rem;
    padding: 1rem 0 1.25rem;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.staff-summary-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
}

.staff-summary-num {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--text-primary);
}

.staff-summary-num.active {
    color: #10b981;
}

.staff-summary-label {
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin-top: 2px;
}

.staff-card-v2 {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    border-radius: 10px;
    margin-bottom: 0.5rem;
    border: 1px solid var(--glass-border);
    transition: var(--glass-transition);
    box-shadow: var(--glass-shadow), var(--glass-edge-light);
}

.staff-card-v2:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.staff-card-left {
    position: relative;
    flex-shrink: 0;
}

.staff-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    color: #fff;
    background: var(--color-primary);
}

.staff-avatar.role-admin { background: #8b5cf6; }
.staff-avatar.role-branch_manager { background: #3b82f6; }
.staff-avatar.role-manager { background: #10b981; }
.staff-avatar.role-staff { background: #6b7280; }

.staff-status-dot {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid var(--surface-secondary);
}

.staff-status-dot.active { background: #10b981; }
.staff-status-dot.inactive { background: #d1d5db; }

.staff-card-center {
    flex: 1;
    min-width: 0;
}

.staff-card-name {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--text-primary);
    margin-bottom: 4px;
}

.staff-card-meta {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 4px;
}

.staff-role-tag, .staff-branch-tag, .staff-team-tag {
    font-size: 0.6875rem;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 500;
}

.staff-role-tag {
    color: #fff;
}

.staff-role-tag.role-admin { background: #8b5cf6; }
.staff-role-tag.role-branch_manager, .staff-role-tag.role-branch-manager { background: #3b82f6; }
.staff-role-tag.role-manager { background: #10b981; }
.staff-role-tag.role-staff { background: #6b7280; }

/* 상세 역할 스타일 */
.staff-role-tag.role-training-director { background: #ec4899; } /* 교육실장 - 분홍 */
.staff-role-tag.role-primary-manager { background: #f59e0b; } /* 1차 관리자 - 주황 */
.staff-role-tag.role-secondary-manager { background: #10b981; } /* 2차 팀장 - 녹색 */
.staff-role-tag.role-primary-staff { background: #f97316; } /* 1차 직원 - 오렌지 */
.staff-role-tag.role-trainee { background: #a855f7; } /* 2차 교육생 - 보라 */
.staff-role-tag.role-secondary-staff { background: #6b7280; } /* 2차 직원 - 회색 */

.staff-branch-tag {
    background: var(--surface-tertiary);
    color: var(--text-secondary);
}

.staff-team-tag {
    background: #fef3c7;
    color: #92400e;
}

.staff-special-team-tag {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    font-size: 0.6875rem;
    padding: 2px 10px;
    border-radius: 4px;
    font-weight: 600;
}

.staff-avatar.special-team {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
}

.staff-card-details {
    display: flex;
    gap: 12px;
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.staff-card-actions {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
    align-items: center;
}

.staff-self-badge {
    font-size: 0.75rem;
    color: var(--color-primary);
    padding: 4px 10px;
    border: 1px solid var(--color-primary);
    border-radius: 6px;
    font-weight: 500;
}

/* Bulk Delete Modal */

.modal-content.modal-medium {
    max-width: 480px;
}

.bulk-delete-body {
    padding: 0 1.5rem 1.5rem;
}

.bulk-delete-warning {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.875rem;
    color: #991b1b;
}

.bulk-delete-warning svg {
    flex-shrink: 0;
    color: #ef4444;
    margin-top: 1px;
}

.bulk-delete-list {
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    margin-bottom: 1rem;
}

.bulk-delete-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-color);
    font-size: 0.875rem;
    transition: background 0.1s;
}

.bulk-delete-item:last-child {
    border-bottom: none;
}

.bulk-delete-item:hover {
    background: var(--surface-tertiary);
}

.bulk-delete-item-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.bulk-delete-item-info strong {
    font-size: 0.875rem;
}

.bulk-delete-item-info span {
    font-size: 0.75rem;
    color: var(--text-tertiary);
}

.bulk-delete-item-remove {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--text-tertiary);
    font-size: 1.25rem;
    padding: 4px 8px;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
}

.bulk-delete-item-remove:hover {
    color: #ef4444;
    background: #fef2f2;
}

.bulk-delete-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

/* Bulk Action Bar Enhancements */

.bulk-action-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    background: var(--surface-secondary);
    border: 1px solid var(--border-color);
    border-radius: 8px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

#btnBulkExportTxt {
    margin-left: auto;
}

@media (max-width: 640px) {
    .staff-card-v2 {
        flex-wrap: wrap;
    }
    .staff-card-actions {
        width: 100%;
        justify-content: flex-end;
        padding-top: 8px;
        border-top: 1px solid var(--border-color);
    }
    .staff-card-details {
        flex-direction: column;
        gap: 2px;
    }
}

/* Staff Filter Bar */

.staff-filter-bar {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    padding: 0.75rem 1rem;
    background: var(--surface-secondary);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.staff-filter-group {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 120px;
}

.staff-filter-group label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.staff-filter-select {
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: var(--bg-elevated);
    color: var(--text-primary);
    font-size: 0.875rem;
    cursor: pointer;
    transition: border-color 0.15s ease;
}

.staff-filter-select:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.staff-search-group {
    flex: 1;
    min-width: 180px;
}

.staff-search-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

.staff-search-icon {
    position: absolute;
    left: 0.625rem;
    width: 16px;
    height: 16px;
    color: var(--text-muted);
    pointer-events: none;
}

.staff-search-input {
    width: 100%;
    padding: 0.5rem 0.75rem 0.5rem 2rem;
    border: 1px solid var(--border-color);
    border-radius: 6px;
    background: var(--bg-elevated);
    color: var(--text-primary);
    font-size: 0.875rem;
    transition: border-color 0.15s ease;
}

.staff-search-input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.staff-search-input::placeholder {
    color: var(--text-muted);
}

.staff-group-header {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--text-secondary);
    padding: 0.75rem 0.25rem 0.375rem;
    margin-top: 0.5rem;
    border-bottom: 1px solid var(--border-light);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.staff-group-count {
    font-weight: 400;
    color: var(--text-muted);
    font-size: 0.75rem;
}

/* 3차콜 경고 모달 */

.call3-alert-modal {
    border: 2px solid var(--danger-500);
    max-width: 520px;
}

.call3-alert-header {
    text-align: center;
    padding: 1.5rem 1.5rem 1rem;
    background: var(--danger-50);
    border-bottom: 1px solid var(--danger-100);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}

.call3-alert-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--danger-100);
    color: var(--danger-500);
    margin-bottom: 0.75rem;
}

.call3-alert-header h3 {
    margin: 0 0 0.25rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--danger-600);
}

.call3-alert-subtitle {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--danger-500);
}

.call3-alert-list {
    padding: 1rem 1.5rem;
    max-height: 300px;
    overflow-y: auto;
}

.call3-alert-item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 0.75rem;
    background: var(--surface-secondary);
    border-radius: 8px;
    margin-bottom: 0.5rem;
    border-left: 3px solid var(--danger-500);
}

.call3-alert-type-badge {
    font-size: 0.6875rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 4px;
    text-transform: uppercase;
    flex-shrink: 0;
}

.call3-alert-type-badge.team {
    background: #fef3c7;
    color: #92400e;
}

.call3-alert-type-badge.individual {
    background: #dbeafe;
    color: #1e40af;
}

.call3-alert-team {
    font-size: 0.8125rem;
    color: var(--text-secondary);
    min-width: 60px;
}

.call3-alert-name {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text-primary);
    flex: 1;
}

.call3-alert-rate {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--danger-600);
    min-width: 50px;
    text-align: right;
}

.call3-alert-footer {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--border-color);
}

/* 하위 가망 모달 */

.subordinate-leads-filter {
    display: flex;
    gap: 0.375rem;
    padding: 0.75rem 1.5rem;
    border-bottom: 1px solid var(--border-color);
    flex-wrap: wrap;
}

.subordinate-leads-filter .filter-btn {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
}

.subordinate-leads-body {
    overflow-x: auto;
    max-height: 55vh;
    overflow-y: auto;
}

.subordinate-leads-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.subordinate-leads-table thead {
    position: sticky;
    top: 0;
    z-index: 1;
}

.subordinate-leads-table th {
    background: var(--bg-sunken);
    padding: 0.625rem 0.75rem;
    text-align: left;
    font-weight: 600;
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid var(--border-color);
    white-space: nowrap;
}

.subordinate-leads-table td {
    padding: 0.5rem 0.75rem;
    border-bottom: 1px solid var(--border-light);
    color: var(--text-primary);
    vertical-align: middle;
}

.subordinate-lead-row {
    cursor: pointer;
    transition: background 0.1s ease;
}

.subordinate-lead-row:hover {
    background: var(--primary-bg);
}

.subordinate-lead-detail td {
    background: var(--bg-sunken);
    padding: 0;
}

.subordinate-lead-detail-content {
    padding: 0.75rem 1rem;
}

.subordinate-lead-detail-content .detail-row {
    padding: 0.25rem 0;
    font-size: 0.8125rem;
    color: var(--text-secondary);
}

.subordinate-lead-detail-content .detail-row strong {
    color: var(--text-primary);
    margin-right: 0.25rem;
}

.subordinate-lead-detail-content a {
    color: var(--info);
    text-decoration: none;
}

.subordinate-lead-detail-content a:hover {
    text-decoration: underline;
}

.badge-muted {
    background: var(--slate-100);
    color: var(--slate-500);
    font-size: 0.6875rem;
    padding: 2px 8px;
    border-radius: 4px;
    font-weight: 500;
}

.subordinate-leads-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-top: 1px solid var(--border-color);
}

.sub-lead-page-info {
    font-size: 0.8125rem;
    color: var(--text-secondary);
}

.staff-view-leads-btn {
    border-color: var(--info) !important;
    color: var(--info) !important;
}

.staff-view-leads-btn:hover {
    background: var(--info-bg) !important;
}

/* 반응형 추가 */

@media (max-width: 768px) {
    .staff-filter-bar {
        flex-direction: column;
        gap: 0.625rem;
    }

    .staff-filter-group {
        width: 100%;
        min-width: unset;
    }

    .staff-filter-select,
    .staff-search-input {
        width: 100%;
    }

    .call3-alert-modal {
        margin: 1rem;
        max-width: unset;
    }

    .call3-alert-item {
        flex-wrap: wrap;
        gap: 0.375rem;
    }

    .subordinate-leads-filter {
        padding: 0.5rem 1rem;
    }

    .subordinate-leads-filter .filter-btn {
        padding: 0.25rem 0.5rem;
        font-size: 0.75rem;
    }

    .subordinate-leads-table {
        font-size: 0.75rem;
    }

    .subordinate-leads-table th,
    .subordinate-leads-table td {
        padding: 0.375rem 0.5rem;
    }

    .staff-card-actions {
        gap: 4px;
    }

    .staff-card-actions .btn {
        font-size: 0.6875rem;
        padding: 0.25rem 0.5rem;
    }
}

@media (max-width: 480px) {
    .subordinate-leads-table th:nth-child(6),
    .subordinate-leads-table td:nth-child(6),
    .subordinate-leads-table th:nth-child(7),
    .subordinate-leads-table td:nth-child(7) {
        display: none;
    }
}

/* ================================================================ */
/* FILTER COUNT BADGES                                   */
/* ================================================================ */

.filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    font-size: 0.6875rem;
    font-weight: 700;
    background: rgba(0,0,0,0.08);
    margin-left: 4px;
}

.filter-btn.active .filter-count {
    background: rgba(255,255,255,0.25);
    color: inherit;
}

/* ================================================================ */
/* LEAD CARD CALL LEVEL BORDERS                          */
/* ================================================================ */

.lead-card.call-level-1 { border-left: 4px solid #3b82f6; }
.lead-card.call-level-2 { border-left: 4px solid #f59e0b; }
.lead-card.call-level-3 { border-left: 4px solid #ef4444; }
.lead-card.meeting-done { border-left: 4px solid #10b981; }
.lead-card.payment-done { border-left: 4px solid #8b5cf6; }

/* Meeting/Payment done icons */
.lead-card.meeting-done::before,
.lead-card.payment-done::before {
    position: absolute;
    top: 8px;
    left: 8px;
    font-size: 0.75rem;
    z-index: 1;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    line-height: 1;
}

.lead-card.meeting-done::before {
    content: "\2713";
    background: #10b981;
}

.lead-card.payment-done::before {
    content: "\2713";
    background: #8b5cf6;
}

/* ================================================================ */
/* SETTINGS MODAL                                        */
/* ================================================================ */

/* Root-level modal overlays (settingsModal, notifDetailModal, call3AlertModal 등)
   - [id]가 있는 .modal-overlay만 대상: 기존 .modal 내부의 자식 overlay는 영향 없음 */
.modal-overlay[id] {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: var(--z-modal);
}

.settings-body {
    padding: 0 1.5rem 1.5rem;
}

.settings-section {
    margin-bottom: 1.5rem;
}

.settings-section-title {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--text-subtle);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 0.75rem;
}

.settings-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--slate-100);
}

.settings-item:last-child {
    border-bottom: none;
}

.settings-item-info {
    flex: 1;
    min-width: 0;
}

.settings-item-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 2px;
}

.settings-item-desc {
    display: block;
    font-size: 0.75rem;
    color: var(--text-muted);
}

.settings-toggle {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
    margin-left: 1rem;
}

.settings-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
}

.settings-toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: var(--slate-300);
    border-radius: 24px;
    transition: 0.3s;
}

.settings-toggle-slider:before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: 0.3s;
}

.settings-toggle input:checked + .settings-toggle-slider {
    background-color: var(--primary);
}

.settings-toggle input:checked + .settings-toggle-slider:before {
    transform: translateX(20px);
}

.settings-select {
    padding: 0.375rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--card);
    color: var(--text);
    font-size: 0.8125rem;
    cursor: pointer;
    margin-left: 1rem;
}

.settings-actions {
    padding-top: 1rem;
    border-top: 1px solid var(--border);
    display: flex;
    justify-content: flex-end;
}

/* ================================================================ */
/* NOTIFICATION DETAIL MODAL                             */
/* ================================================================ */

.notif-detail-body {
    padding: 1.5rem;
}

.notif-detail-type {
    margin-bottom: 1rem;
}

.notif-detail-message {
    font-size: 0.9375rem;
    color: var(--text);
    line-height: 1.7;
    margin-bottom: 1rem;
    white-space: pre-wrap;
}

.notif-detail-time {
    font-size: 0.8125rem;
    color: var(--text-muted);
    margin-bottom: 1rem;
}

.notif-detail-action {
    padding-top: 1rem;
    border-top: 1px solid var(--border);
}

/* ================================================================ */
/* STATS CARD ICONS & ACCENTS                            */
/* ================================================================ */

.stat-card-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--sp-3);
}

.stat-card-icon svg {
    width: 20px;
    height: 20px;
}

.stat-icon-total {
    background: var(--primary-100);
    color: var(--primary-700);
}

.stat-icon-total svg { stroke: var(--primary-700); }

.stat-icon-call0 {
    background: var(--slate-100);
    color: var(--slate-600);
}

.stat-icon-call0 svg { stroke: var(--slate-500); }

.stat-icon-call1 {
    background: #dbeafe;
    color: #2563eb;
}

.stat-icon-call1 svg { stroke: #3b82f6; }

.stat-icon-call2 {
    background: #fef3c7;
    color: #d97706;
}

.stat-icon-call2 svg { stroke: #f59e0b; }

.stat-icon-call3 {
    background: #fee2e2;
    color: #dc2626;
}

.stat-icon-call3 svg { stroke: #ef4444; }

.stat-icon-meeting {
    background: var(--success-100);
    color: var(--success-600);
}

.stat-icon-meeting svg { stroke: var(--success-600); }

.stat-icon-payment {
    background: var(--accent-100);
    color: var(--accent-600);
}

.stat-icon-payment svg { stroke: var(--accent-600); }

/* Stat card accent borders */
.stat-card-total { border-top: 3px solid var(--primary); }
.stat-card-call0 { border-top: 3px solid var(--slate-300); }
.stat-card-call1 { border-top: 3px solid #3b82f6; }
.stat-card-call2 { border-top: 3px solid #f59e0b; }
.stat-card-call3 { border-top: 3px solid #ef4444; }
.stat-card-meeting { border-top: 3px solid var(--success); }
.stat-card-payment { border-top: 3px solid var(--accent-500); }

/* Rate fill colors by stage */
.rate-fill.payment-fill-0 { background: linear-gradient(90deg, #94a3b8, #cbd5e1); }
.rate-fill.payment-fill-1 { background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.rate-fill.payment-fill-2 { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.rate-fill.payment-fill-3 { background: linear-gradient(90deg, #ef4444, #f87171); }
.rate-fill.meeting-fill-1 { background: linear-gradient(90deg, #3b82f6, #93c5fd); }
.rate-fill.meeting-fill-2 { background: linear-gradient(90deg, #f59e0b, #fde68a); }
.rate-fill.meeting-fill-3 { background: linear-gradient(90deg, #ef4444, #fca5a5); }

/* Matrix heatmap cell colors */
.matrix-table tbody td.matrix-heat-1 { background: rgba(34, 197, 94, 0.06); }
.matrix-table tbody td.matrix-heat-2 { background: rgba(34, 197, 94, 0.12); }
.matrix-table tbody td.matrix-heat-3 { background: rgba(34, 197, 94, 0.20); }
.matrix-table tbody td.matrix-heat-4 { background: rgba(34, 197, 94, 0.30); }
.matrix-table tbody td.matrix-heat-5 { background: rgba(34, 197, 94, 0.42); }

/* 성과 추이 차트 */
.stats-trend-section {
    margin-top: var(--sp-6);
    padding: var(--sp-4);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
}
.stats-trend-section h4 {
    font-size: var(--text-lg);
    font-weight: 700;
    margin-bottom: var(--sp-4);
    color: var(--text);
}
.trend-chart-container {
    height: 200px;
    display: flex;
    align-items: flex-end;
    gap: 2px;
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--border);
}
.trend-chart-loading {
    width: 100%;
    text-align: center;
    color: var(--text-muted);
    font-size: var(--text-sm);
}
.trend-bar-group {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.trend-bars {
    display: flex;
    gap: 2px;
    align-items: flex-end;
    height: 160px;
}
.trend-bar {
    width: 12px;
    border-radius: 3px 3px 0 0;
    transition: height 0.3s ease;
}
.trend-bar.bar-total { background: var(--primary); }
.trend-bar.bar-meeting { background: #34d399; }
.trend-bar.bar-payment { background: #f59e0b; }
.trend-date {
    font-size: 10px;
    color: var(--text-muted);
    white-space: nowrap;
}
.trend-legend {
    display: flex;
    justify-content: center;
    gap: var(--sp-4);
    margin-top: var(--sp-3);
}
.trend-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--text-xs);
    color: var(--text-secondary);
}
.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 2px;
}
.legend-dot.legend-total { background: var(--primary); }
.legend-dot.legend-meeting { background: #34d399; }
.legend-dot.legend-payment { background: #f59e0b; }

/* 목표 대비 실적 */
.stats-target-section {
    margin-top: var(--sp-6);
    padding: var(--sp-4);
    background: linear-gradient(135deg, var(--primary-50, #f0f4f8) 0%, var(--card) 100%);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
}
.target-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-4);
}
.target-header h4 {
    font-size: var(--text-lg);
    font-weight: 700;
    color: var(--text);
    margin: 0;
}
.target-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: var(--sp-4);
}
.target-card {
    background: var(--bg);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    box-shadow: var(--shadow-sm);
}
.target-card-label {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: var(--sp-2);
}
.target-card-progress {
    margin-bottom: var(--sp-2);
}
.target-progress-bar {
    height: 8px;
    background: var(--slate-200);
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 6px;
}
.target-progress-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--primary), var(--primary-400));
    border-radius: 4px;
    transition: width 0.5s ease;
}
.target-progress-fill.target-fill-meeting { background: linear-gradient(90deg, #34d399, #6ee7b7); }
.target-progress-fill.target-fill-payment { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.target-values {
    display: flex;
    justify-content: space-between;
    font-size: var(--text-xs);
    color: var(--text-muted);
}
.target-card-rate {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--primary);
    text-align: right;
}

/* 통계 기간 선택 */

.stats-period-bar {
    padding: 0.75rem 0;
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--border);
}

.stats-period-presets {
    display: flex;
    gap: 0.375rem;
    flex-wrap: wrap;
    margin-bottom: 0.5rem;
}

.stats-period-btn {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--text-subtle);
    background: var(--gray-100);
    border: 1px solid transparent;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.stats-period-btn:hover {
    color: var(--text);
    background: var(--gray-200);
}

.stats-period-btn.active {
    color: #fff;
    background: var(--primary);
    border-color: var(--primary);
}

.stats-date-range {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
    flex-wrap: wrap;
}

.stats-date-input {
    padding: 0.375rem 0.625rem;
    font-size: 0.8125rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--card);
    color: var(--text);
}

.stats-date-input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.stats-date-separator {
    color: var(--text-muted);
    font-size: 0.875rem;
}

.stats-current-period {
    font-size: 0.8125rem;
    color: var(--text-secondary);
    font-weight: 500;
    margin-top: 0.375rem;
}

.stats-current-period span {
    background: var(--primary-50);
    color: var(--primary-700);
    padding: 0.25rem 0.75rem;
    border-radius: 4px;
    display: inline-block;
}

@media (max-width: 768px) {
    .stats-period-presets {
        gap: 0.25rem;
    }
    .stats-period-btn {
        padding: 0.25rem 0.5rem;
        font-size: 0.75rem;
    }
}

/* 승인 관리 탭 스타일 */

.approval-tab-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    background: var(--danger);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    border-radius: 9px;
    padding: 0 5px;
}

/* 승인 관리 탭 스타일 */
.approval-header-section {
    padding: var(--sp-4) 0;
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
}

.approval-header-section h3 {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text);
    margin: 0;
}

.approval-search-bar {
    display: flex;
    gap: var(--sp-3);
    flex-wrap: wrap;
    align-items: center;
    padding: var(--sp-4);
    background: var(--surface-subtle);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-subtle);
}

.approval-search-bar .search-input-group {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 0 var(--sp-3);
    flex: 1;
    min-width: 180px;
    max-width: 280px;
}

.approval-search-bar .search-input-group svg {
    color: var(--text-muted);
    flex-shrink: 0;
}

.approval-search-bar .search-input-group input {
    border: none;
    background: transparent;
    padding: var(--sp-2) 0;
    font-size: var(--text-sm);
    width: 100%;
    outline: none;
}

.approval-select {
    padding: var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    min-width: 100px;
}

.date-range-group {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.approval-date {
    padding: var(--sp-2) var(--sp-2);
    font-size: var(--text-sm);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}

.date-separator {
    color: var(--text-muted);
    font-size: var(--text-sm);
}

.approval-category-bar {
    display: flex;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
    flex-wrap: wrap;
    padding: var(--sp-2);
    background: var(--slate-100);
    border-radius: var(--radius-xl);
}

.approval-cat-btn {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-subtle);
    background: transparent;
    border: none;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
}

.approval-cat-btn:hover {
    color: var(--text);
    background: rgba(255,255,255,0.5);
}

.approval-cat-btn.active {
    color: var(--primary-700);
    background: var(--card);
    box-shadow: var(--shadow-sm);
}

.approval-cat-btn .cat-label {
    font-weight: 600;
}

.approval-cat-btn .cat-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    font-size: 11px;
    font-weight: 700;
    background: var(--slate-200);
    color: var(--text-subtle);
    border-radius: var(--radius-full);
}

.approval-cat-btn.active .cat-count {
    background: var(--primary-100);
    color: var(--primary-700);
}

.approval-cat-btn .cat-count.pending { background: var(--warning-bg); color: var(--warning-text); }
.approval-cat-btn .cat-count.payment { background: var(--success-bg); color: var(--success); }
.approval-cat-btn .cat-count.delete { background: var(--danger-bg); color: var(--danger); }
.approval-cat-btn .cat-count.exchange { background: var(--info-bg); color: var(--info); }
.approval-cat-btn .cat-count.transfer { background: var(--primary-bg); color: var(--primary); }
.approval-cat-btn .cat-count.escalation { background: #fff3e0; color: #e65100; }

/* Legacy support */
.approval-header { padding: var(--sp-4) 0; }
.approval-header h3 { font-size: var(--text-xl); font-weight: 700; color: var(--text); }
.approval-filter-bar { display: flex; gap: var(--sp-2); margin-bottom: var(--sp-4); flex-wrap: wrap; }

.approval-list { display: flex; flex-direction: column; gap: var(--sp-3); }

.approval-card {
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    transition: box-shadow 0.2s;
}
.approval-card:hover { box-shadow: var(--shadow-md); }

.approval-card-header { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-3); }

.approval-type-badge {
    display: inline-flex; align-items: center;
    padding: 2px 10px; border-radius: var(--radius-full);
    font-size: var(--text-xs); font-weight: 600;
}
.approval-type-payment_approval { background: var(--success-bg); color: var(--success); }
.approval-type-delete_approval { background: var(--danger-bg); color: var(--danger); }
.approval-type-exchange_approval { background: var(--info-bg); color: var(--info); }
.approval-type-transfer_to_manager { background: var(--primary-bg); color: var(--primary); }
.approval-type-escalation { background: #fff3e0; color: #e65100; }

.approval-status-pending { color: var(--warning); font-weight: 600; font-size: var(--text-sm); }
.approval-status-partial { color: var(--info); font-weight: 600; font-size: var(--text-sm); }
.approval-status-approved { color: var(--success); font-weight: 600; font-size: var(--text-sm); }
.approval-status-rejected { color: var(--danger); font-weight: 600; font-size: var(--text-sm); }

.approval-card-body { display: flex; flex-direction: column; gap: var(--sp-1); }
.approval-info { font-size: var(--text-sm); color: var(--text-muted); }
.approval-label { font-weight: 600; color: var(--text); }
.approval-actions { display: flex; gap: var(--sp-2); margin-top: var(--sp-3); }
.approval-processed { margin-top: var(--sp-2); padding-top: var(--sp-2); border-top: 1px dashed var(--gray-100); }
.approval-reject-reason { font-size: 0.75rem; color: var(--text-muted); margin-top: 2px; padding-left: 4px; }

/* 승인관리 날짜별 그룹핑 */
.approval-section-header {
    padding: 10px 16px;
    font-weight: 600;
    font-size: 14px;
    color: var(--text);
    background: var(--bg-tertiary, var(--slate-100));
    border-radius: 8px;
    margin: 8px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.approval-pending-header {
    background: linear-gradient(135deg, rgba(234,179,8,0.1), rgba(234,179,8,0.05));
    border-left: 3px solid #eab308;
}
.approval-date-header {
    padding: 8px 16px;
    font-weight: 500;
    font-size: 13px;
    color: var(--text-muted);
    background: var(--bg-secondary, var(--slate-50));
    border-radius: 6px;
    margin: 12px 0 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    user-select: none;
}
.approval-date-header:hover {
    background: var(--bg-tertiary, var(--slate-100));
}
.approval-date-toggle {
    transition: transform 0.2s;
    font-size: 11px;
}
.approval-date-header.collapsed .approval-date-toggle {
    transform: rotate(-90deg);
}
.approval-date-header.collapsed + .approval-date-group {
    display: none;
}
.approval-section-count {
    font-size: 12px;
    color: var(--text-muted);
    font-weight: 400;
}

/* 승인대기/삭제대기 뱃지 */
.badge-approval-pending {
    background: var(--warning-bg); color: var(--warning);
    font-size: 11px; padding: 2px 8px; border-radius: var(--radius-full);
    font-weight: 600;
}
.badge-delete-pending {
    background: var(--danger-bg); color: var(--danger);
    font-size: 11px; padding: 2px 8px; border-radius: var(--radius-full);
    font-weight: 600;
}

/* 이관 버튼 */
.transfer-superior-btn { margin-left: var(--sp-2); }

/* 승인 요청 버튼 */
.approval-request-btn { margin-left: var(--sp-2); }

/* 부드러운 업데이트 애니메이션 */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
.lead-card-fade-in {
    animation: fadeIn 0.2s ease-in;
}

/* sidebar-nav-item에 relative 추가 (뱃지용) */
.sidebar-nav-item { position: relative; }

/* 1차 가망 (Primary Leads) */

/* 서브탭 */
.primary-subtabs {
    display: flex;
    gap: var(--sp-1);
    padding: var(--sp-4) var(--sp-4) 0;
    border-bottom: 1px solid var(--border);
    background: var(--bg-elevated);
}

.primary-subtab {
    padding: var(--sp-2-5) var(--sp-4);
    border: none;
    background: none;
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-subtle);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all 0.15s ease;
    font-family: var(--font);
}

.primary-subtab:hover {
    color: var(--text);
    background: var(--slate-50);
}

.primary-subtab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
    font-weight: 600;
}

/* 서브 콘텐츠 */
.primary-sub-content {
    padding: var(--sp-4);
}

/* 필터 바 */
.primary-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
    flex-wrap: wrap;
}

.primary-status-chips {
    display: flex;
    gap: var(--sp-1-5);
    flex-wrap: wrap;
}

.primary-status-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    padding: var(--sp-1-5) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-full);
    background: var(--bg-elevated);
    font-size: var(--text-xs);
    font-weight: 500;
    color: var(--text-subtle);
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: var(--font);
    white-space: nowrap;
}

.primary-status-chip:hover {
    border-color: var(--primary-300);
    color: var(--primary);
    background: var(--primary-bg);
}

.primary-status-chip.active {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primary-bg-strong);
    font-weight: 600;
}

.primary-status-chip span {
    font-weight: 700;
    font-size: var(--text-xs);
}

.primary-search-bar {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.primary-search-bar input {
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    font-family: var(--font);
    width: 220px;
    transition: border-color 0.15s ease;
}

.primary-search-bar input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

/* 날짜 필터 */
.primary-date-filter select {
    background: var(--card);
    cursor: pointer;
}

.primary-date-filter select:focus {
    outline: none;
    border-color: var(--primary);
}

.primary-date-filter input[type="date"] {
    background: var(--card);
    font-family: var(--font);
}

.primary-date-filter input[type="date"]:focus {
    outline: none;
    border-color: var(--primary);
}

/* 벌크 선택 바 */
.primary-bulk-bar {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    background: var(--primary-bg-strong);
    border-radius: var(--radius-lg);
    margin-bottom: var(--sp-4);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--primary-700);
    border: 1px solid var(--primary-200);
}

/* 액션 버튼 영역 */
.primary-actions {
    display: flex;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

/* 가망 카드 목록 */
.primary-lead-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.primary-lead-card {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-blur-subtle);
    -webkit-backdrop-filter: var(--glass-blur-subtle);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: var(--glass-transition);
    box-shadow: var(--glass-shadow), var(--glass-edge-light);
}

.primary-lead-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    transform: translateY(-2px);
}

.primary-lead-card .card-header {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border-subtle);
    background: var(--slate-50);
}

.primary-lead-checkbox {
    display: flex;
    align-items: center;
}

.primary-lead-checkbox input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--primary);
}

.card-title-area {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    flex: 1;
    min-width: 0;
}

.card-business-name {
    font-weight: 600;
    font-size: var(--text-base);
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.primary-lead-card .card-body {
    padding: var(--sp-3) var(--sp-4);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1-5);
}

.card-info-row {
    display: flex;
    align-items: baseline;
    gap: var(--sp-2);
    font-size: var(--text-sm);
}

.card-label {
    color: var(--text-muted);
    font-weight: 500;
    min-width: 50px;
    flex-shrink: 0;
}

.card-value {
    color: var(--text);
}

.primary-lead-card .card-footer {
    display: flex;
    gap: var(--sp-2);
    padding: var(--sp-2-5) var(--sp-4);
    border-top: 1px solid var(--border-subtle);
    justify-content: flex-end;
}

/* 상태 뱃지 색상 */
.primary-status-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}

.primary-status-badge.draft { background: #f1f5f9; color: #64748b; }
.primary-status-badge.submitted { background: #dbeafe; color: #2563eb; }
.primary-status-badge.approved { background: #dcfce7; color: #16a34a; }
.primary-status-badge.rejected { background: #fef2f2; color: #dc2626; }
.primary-status-badge.distributed { background: #f3e8ff; color: #7c3aed; }
.primary-status-badge.converted { background: #fef3c7; color: #d97706; }
.primary-status-badge.pending { background: #fef3c7; color: #d97706; }

/* D-Day 배지 (발표날짜 카운트다운) */
.d-day-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: var(--radius-full);
    font-size: 10px;
    font-weight: 700;
    margin-left: 6px;
    background: #dbeafe;
    color: #2563eb;
}

.d-day-badge.warning {
    background: #fef3c7;
    color: #d97706;
}

.d-day-badge.urgent {
    background: #fef2f2;
    color: #dc2626;
    animation: pulse-urgent 1.5s ease-in-out infinite;
}

.d-day-badge.overdue {
    background: #7f1d1d;
    color: #fff;
}

@keyframes pulse-urgent {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* 이관 카드 */
.transfer-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.transfer-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.transfer-card:hover {
    box-shadow: var(--shadow-card-hover);
}

.transfer-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border-subtle);
    background: var(--slate-50);
}

.transfer-direction {
    font-weight: 600;
    font-size: var(--text-base);
    color: var(--text);
}

.transfer-card-body {
    padding: var(--sp-3) var(--sp-4);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1-5);
}

.transfer-card-footer {
    display: flex;
    gap: var(--sp-2);
    padding: var(--sp-2-5) var(--sp-4);
    border-top: 1px solid var(--border-subtle);
    justify-content: flex-end;
}

/* 배분 이력 카드 */
.distribution-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.distribution-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: box-shadow 0.15s ease;
}

.distribution-card:hover {
    box-shadow: var(--shadow-card-hover);
}

.distribution-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border-subtle);
    background: var(--slate-50);
}

.distribution-date {
    font-weight: 500;
    font-size: var(--text-sm);
    color: var(--text-subtle);
}

.distribution-count {
    font-weight: 700;
    font-size: var(--text-base);
    color: var(--primary);
}

.distribution-card-body {
    padding: var(--sp-3) var(--sp-4);
    display: flex;
    flex-direction: column;
    gap: var(--sp-1-5);
}

/* 통계 */
.primary-stats-container {
    padding: var(--sp-2) 0;
}

.primary-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--sp-4);
}

.primary-stat-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: var(--sp-5) var(--sp-4);
    text-align: center;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.primary-stat-card:hover {
    box-shadow: var(--shadow-card-hover);
    border-color: var(--border-strong);
}

.primary-stat-card.primary-stat-highlight {
    background: var(--primary-bg-strong);
    border-color: var(--primary-200);
}

.primary-stat-value {
    font-size: var(--text-3xl);
    font-weight: 800;
    color: var(--text);
    line-height: var(--leading-tight);
}

.primary-stat-highlight .primary-stat-value {
    color: var(--primary);
}

.primary-stat-label {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin-top: var(--sp-1);
    font-weight: 500;
}

/* 페이지네이션 바 */
.pagination-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sp-1);
    padding: var(--sp-4) 0;
}

.page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 var(--sp-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: var(--card);
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text);
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: var(--font);
}

.page-btn:hover:not(.disabled):not(.active) {
    border-color: var(--primary-300);
    color: var(--primary);
    background: var(--primary-bg);
}

.page-btn.active {
    background: var(--primary);
    color: var(--text-inverted);
    border-color: var(--primary);
    font-weight: 600;
}

.page-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.page-dots {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    font-size: var(--text-sm);
    color: var(--text-muted);
}

/* btn-secondary (if not already defined) */
.btn-secondary {
    background: var(--slate-100);
    color: var(--text);
    border: 1px solid var(--border);
    padding: var(--sp-2) var(--sp-4);
    border-radius: var(--radius-lg);
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease;
    font-family: var(--font);
}

.btn-secondary:hover:not(:disabled) {
    background: var(--slate-200);
    border-color: var(--border-strong);
}

/* 반응형: 모바일 */
@media (max-width: 768px) {
    .primary-filter-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .primary-status-chips {
        flex-wrap: wrap;
    }

    .primary-search-bar {
        width: 100%;
    }

    .primary-search-bar input {
        width: 100%;
        flex: 1;
    }

    .primary-date-filter {
        width: 100%;
        order: -1;
    }

    .primary-date-filter select {
        flex: 1;
    }

    .primary-subtabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .primary-subtabs::-webkit-scrollbar {
        display: none;
    }

    .primary-subtab {
        white-space: nowrap;
        flex-shrink: 0;
    }

    .primary-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .primary-bulk-bar {
        flex-wrap: wrap;
    }

    .primary-actions {
        flex-wrap: wrap;
    }

    .primary-lead-card .card-header {
        padding: var(--sp-2-5) var(--sp-3);
    }

    .primary-lead-card .card-body {
        padding: var(--sp-2-5) var(--sp-3);
    }

    .primary-lead-card .card-footer {
        padding: var(--sp-2) var(--sp-3);
    }

    .transfer-card-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--sp-1);
    }
}

@media (max-width: 480px) {
    .primary-stats-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--sp-2);
    }

    .primary-stat-card {
        padding: var(--sp-3);
    }

    .primary-stat-value {
        font-size: var(--text-2xl);
    }
}

/* 역할별 UI + 고급 배분 시스템 */

#staffForm {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    flex: 1;
    max-height: calc(90vh - 60px);
}

.btn {
    position: relative;
    overflow: hidden;
}
.btn::after {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle, rgba(255,255,255,0.3) 10%, transparent 10.01%);
    transform: scale(10);
    opacity: 0;
    transition: transform 0.5s, opacity 0.5s;
}
.btn:active::after {
    transform: scale(0);
    opacity: 1;
    transition: 0s;
}
.btn-primary:active {
    box-shadow: 0 0 0 4px rgba(98, 125, 152, 0.3);
}

.hide-for-primary-manager .status-section {
    display: none !important;
}

.primary-perf-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}
.perf-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-5);
    text-align: center;
}
.perf-card .perf-label {
    font-size: var(--text-sm);
    color: var(--text-subtle);
}
.perf-card .perf-value {
    font-size: var(--text-3xl);
    font-weight: var(--font-bold);
    color: var(--primary-700);
}
.primary-perf-list-item {
    display: flex;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    border-bottom: 1px solid var(--border-subtle);
    font-size: var(--text-sm);
}

/* ========================================
   토스트 알림 시스템 (Toast Notifications)
   ======================================== */

#toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: none;
    max-width: 420px;
    width: 100%;
}

.toast-new {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border-radius: var(--radius-lg, 10px);
    background: #ffffff;
    background: rgba(255,255,255,0.97);
    border: 1.5px solid var(--border-default, #e2e8f0);
    box-shadow: 0 8px 32px rgba(0,0,0,0.15), 0 2px 8px rgba(0,0,0,0.08);
    pointer-events: auto;
    animation: toastSlideIn 0.3s ease-out;
    font-size: var(--text-sm, 13px);
    line-height: 1.5;
    max-width: 100%;
    word-break: keep-all;
}

.toast-new.toast-exiting {
    animation: toastSlideOut 0.25s ease-in forwards;
}

.toast-new .toast-icon {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.toast-new .toast-body {
    flex: 1;
    min-width: 0;
}

.toast-new .toast-message {
    color: var(--text-primary, #1e293b);
    font-weight: 500;
}

.toast-new .toast-close {
    flex-shrink: 0;
    background: none;
    border: none;
    color: var(--text-tertiary, #94a3b8);
    cursor: pointer;
    padding: 2px;
    font-size: 18px;
    line-height: 1;
    opacity: 0.6;
    transition: opacity 0.15s;
}

.toast-new .toast-close:hover {
    opacity: 1;
}

.toast-new .toast-undo-btn {
    display: inline-block;
    margin-top: 6px;
    padding: 4px 10px;
    background: var(--color-primary, #4f46e5);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm, 4px);
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
}

.toast-new .toast-undo-btn:hover {
    opacity: 0.9;
}

/* 토스트 타입별 스타일 */
.toast-new.toast-success { border-left: 4px solid var(--color-success, #22c55e); }
.toast-new.toast-success .toast-icon { color: var(--color-success, #22c55e); }

.toast-new.toast-error { border-left: 4px solid var(--color-danger, #ef4444); }
.toast-new.toast-error .toast-icon { color: var(--color-danger, #ef4444); }

.toast-new.toast-warning { border-left: 4px solid var(--color-warning, #f59e0b); }
.toast-new.toast-warning .toast-icon { color: var(--color-warning, #f59e0b); }

.toast-new.toast-info { border-left: 4px solid var(--color-info, #3b82f6); }
.toast-new.toast-info .toast-icon { color: var(--color-info, #3b82f6); }

/* 프로그레스 바 (자동소멸 타이머) */
.toast-new .toast-progress {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 3px;
    border-radius: 0 0 0 var(--radius-lg, 10px);
    background: currentColor;
    opacity: 0.3;
    animation: toastProgress linear forwards;
}

@keyframes toastSlideIn {
    from { transform: translateX(100%); opacity: 0; }
    to   { transform: translateX(0); opacity: 1; }
}

@keyframes toastSlideOut {
    from { transform: translateX(0); opacity: 1; max-height: 120px; margin-bottom: 0; }
    to   { transform: translateX(100%); opacity: 0; max-height: 0; margin-bottom: -8px; }
}

@keyframes toastProgress {
    from { width: 100%; }
    to   { width: 0%; }
}

/* ========================================
   로딩 상태 (Loading States)
   ======================================== */

/* 버튼 로딩 */
.btn-loading {
    position: relative;
    pointer-events: none;
    opacity: 0.75;
}

.btn-loading .btn-text {
    visibility: hidden;
}

.btn-loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

/* 스켈레톤 스크린 */
.skeleton {
    background: linear-gradient(90deg,
        var(--bg-skeleton, #e2e8f0) 25%,
        var(--bg-skeleton-shine, #f1f5f9) 50%,
        var(--bg-skeleton, #e2e8f0) 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s ease-in-out infinite;
    border-radius: var(--radius-md, 6px);
}

.skeleton-text {
    height: 14px;
    margin-bottom: 8px;
    width: 100%;
}

.skeleton-text:last-child {
    width: 70%;
}

.skeleton-card {
    height: 120px;
    margin-bottom: 12px;
}

.skeleton-stat {
    height: 80px;
}

.skeleton-row {
    display: flex;
    gap: 12px;
    margin-bottom: 12px;
}

.skeleton-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    flex-shrink: 0;
}

@keyframes skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* 오버레이 로딩 (모달, 컨테이너용) */
.loading-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
    border-radius: inherit;
}

.loading-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid var(--border-default, #e2e8f0);
    border-top-color: var(--color-primary, #4f46e5);
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* 모바일 토스트 */
@media (max-width: 640px) {
    #toast-container {
        top: auto;
        bottom: 20px;
        left: 16px;
        right: 16px;
        max-width: none;
    }
}

/* ========================================
   접근성 (Accessibility)
   ======================================== */

/* 스크린리더 전용 텍스트 */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* 상태 기호 */
.status-symbol {
    margin-right: 4px;
    font-size: 0.85em;
}

/* ========================================
   모바일 반응형 개선 (Mobile UX)
   ======================================== */

@media (max-width: 768px) {
    /* 칸반: 가로 스크롤 + 스냅 */
    .kanban-board {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 12px;
        padding-bottom: 12px;
    }

    .kanban-column {
        min-width: 280px;
        flex-shrink: 0;
        scroll-snap-align: start;
    }

    .kanban-card {
        padding: 10px;
        font-size: 13px;
    }

    /* 모달: 모바일 전체화면 */
    .modal-content {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100vh !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        margin: 0 !important;
    }

    /* 통계: 2열 그리드 */
    .stats-grid, .stat-cards, .dashboard-stats {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }

    .stat-card {
        padding: 12px !important;
    }

    .stat-card .stat-value {
        font-size: 1.25rem !important;
    }

    /* 테이블: 반응형 카드 레이아웃 */
    .responsive-table thead {
        display: none;
    }

    .responsive-table tbody tr {
        display: block;
        margin-bottom: 12px;
        border: 1px solid var(--border, #e2e8f0);
        border-radius: var(--radius-md, 6px);
        padding: 12px;
    }

    .responsive-table tbody td {
        display: flex;
        justify-content: space-between;
        padding: 4px 0;
        border: none;
    }

    .responsive-table tbody td::before {
        content: attr(data-label);
        font-weight: 600;
        color: var(--text-secondary, #64748b);
        margin-right: 12px;
    }

    /* 사이드바 */
    .sidebar {
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        position: fixed !important;
        z-index: 1000;
    }

    .sidebar.mobile-open,
    .sidebar.active {
        transform: translateX(0);
    }

    .main-content {
        margin-left: 0 !important;
    }

    /* 필터바 */
    .filter-bar, .search-bar {
        flex-direction: column;
        gap: 8px;
    }

    .filter-bar select, .filter-bar input, .search-bar input {
        width: 100%;
    }

    /* 버튼 그룹 */
    .btn-group, .action-buttons {
        flex-wrap: wrap;
        gap: 6px;
    }

    .btn-group .btn, .action-buttons .btn {
        flex: 1;
        min-width: 0;
    }
}

/* 작은 화면 (480px 이하) */
@media (max-width: 480px) {
    .stats-grid, .stat-cards, .dashboard-stats {
        grid-template-columns: 1fr !important;
    }

    .modal-header, .modal-footer {
        padding: 12px !important;
    }

    .modal-body {
        padding: 12px !important;
    }
}

/* ========================================
   애니메이션 다듬기 (Animations)
   ======================================== */

/* 탭 전환 */
.tab-content-enter {
    animation: fadeSlideIn 0.2s ease-out;
}

@keyframes fadeSlideIn {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 모달 열기 */
.modal.show .modal-content,
.modal-content.modal-enter {
    animation: modalSlideUp 0.25s ease-out;
}

@keyframes modalSlideUp {
    from { opacity: 0; transform: translateY(20px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* 버튼 누름 */
.btn:active {
    transform: scale(0.98);
    transition: transform 0.1s;
}

/* 카드 호버 */
.lead-card:hover,
.stat-card:hover,
.kanban-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-md, 0 4px 6px rgba(0,0,0,0.1));
    transition: transform 0.2s, box-shadow 0.2s;
}

/* 긴급 배지 pulse */
.badge-urgent,
.badge-3rd {
    animation: urgentPulse 2s ease-in-out infinite;
}

@keyframes urgentPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* 숫자 카운트업 */
.stat-value {
    transition: color 0.3s;
}

/* ========================================
   툴팁 시스템 (Tooltips)
   ======================================== */

[data-tooltip] {
    position: relative;
    cursor: help;
}

[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    background: var(--bg-tooltip, #1e293b);
    color: #fff;
    padding: 6px 10px;
    border-radius: var(--radius-sm, 4px);
    font-size: 12px;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s, visibility 0.15s;
    z-index: 10001;
    max-width: 250px;
    white-space: normal;
    text-align: center;
    line-height: 1.4;
}

[data-tooltip]::before {
    content: '';
    position: absolute;
    bottom: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: var(--bg-tooltip, #1e293b);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s, visibility 0.15s;
    z-index: 10001;
}

[data-tooltip]:hover::after,
[data-tooltip]:hover::before,
[data-tooltip]:focus::after,
[data-tooltip]:focus::before {
    opacity: 1;
    visibility: visible;
}

/* ========================================
   인쇄 스타일 (Print)
   ======================================== */

@media print {
    /* 숨길 요소 */
    .sidebar,
    .mobile-header,
    .tab-bar,
    .filter-bar,
    .search-bar,
    .modal-overlay,
    .btn,
    button,
    .toast-container,
    #toast-container,
    .loading-overlay,
    .action-buttons,
    .pagination,
    .kanban-controls,
    nav {
        display: none !important;
    }

    /* 메인 영역 전체 표시 */
    .main-content {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    /* 배경색/그림자 제거 */
    * {
        box-shadow: none !important;
        text-shadow: none !important;
    }

    body {
        background: #fff !important;
        color: #000 !important;
        font-size: 12pt;
    }

    /* 카드/통계 페이지 나눔 방지 */
    .stat-card,
    .lead-card,
    .kanban-card,
    tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    /* 테이블 보이기 */
    table {
        border-collapse: collapse;
        width: 100%;
    }

    th, td {
        border: 1px solid #ccc;
        padding: 6px 8px;
        text-align: left;
    }

    /* 인쇄 헤더 */
    .print-header {
        display: block !important;
        text-align: center;
        margin-bottom: 20px;
        font-size: 18pt;
        font-weight: bold;
    }

    /* 인쇄 날짜 */
    .print-date {
        display: block !important;
        text-align: right;
        font-size: 10pt;
        color: #666;
    }

    /* 링크 URL 표시 */
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        color: #666;
    }

    a[href^="#"]::after,
    a[href^="javascript"]::after {
        content: none;
    }
}

/* ========================================
   빈 상태 (Empty States)
   ======================================== */

.empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    color: var(--text-secondary, #64748b);
}

.empty-state-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.4;
}

.empty-state-title {
    font-size: var(--text-lg, 16px);
    font-weight: 600;
    color: var(--text-primary, #1e293b);
    margin-bottom: 8px;
}

.empty-state-desc {
    font-size: var(--text-sm, 13px);
    max-width: 320px;
    line-height: 1.6;
}

/* 트렌드 표시 */
.trend {
    font-size: 12px;
    font-weight: 600;
    margin-left: 6px;
}

.trend-up { color: var(--color-success, #22c55e); }
.trend-down { color: var(--color-danger, #ef4444); }
.trend-flat { color: var(--text-tertiary, #94a3b8); }


/* ========================================
   Glassmorphism Animations & Keyframes
   ======================================== */

@keyframes glassCardIn {
    from {
        opacity: 0;
        transform: translateY(20px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes smoothSlideDown {
    from {
        max-height: 0;
        opacity: 0;
        transform: translateY(-10px);
        overflow: hidden;
    }
    to {
        max-height: 200px;
        opacity: 1;
        transform: translateY(0);
        overflow: hidden;
    }
}

@keyframes smoothSlideUp {
    from {
        max-height: 200px;
        opacity: 1;
        transform: translateY(0);
        overflow: hidden;
    }
    to {
        max-height: 0;
        opacity: 0;
        transform: translateY(-10px);
        overflow: hidden;
    }
}

@keyframes valueFlash {
    0% { background-color: transparent; }
    30% { background-color: rgba(6, 182, 212, 0.12); }
    100% { background-color: transparent; }
}

@keyframes tabSlideIn {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes glassShimmer {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

/* ========================================
   Glass Utility Classes
   ======================================== */

.glass-card-enter {
    animation: glassCardIn 0.4s var(--ease-out) both;
}

.slide-in-item {
    animation: smoothSlideDown 0.35s var(--ease-out) both;
}

.slide-out-item {
    animation: smoothSlideUp 0.3s var(--ease-out) both;
}

.value-updated {
    animation: valueFlash 0.6s ease both;
}

.tab-slide-in {
    animation: tabSlideIn 0.3s var(--ease-out) both;
}

.skeleton-shimmer {
    background: linear-gradient(90deg,
        var(--glass-bg-subtle) 25%,
        rgba(255,255,255,0.6) 50%,
        var(--glass-bg-subtle) 75%);
    background-size: 200% 100%;
    animation: glassShimmer 1.5s ease infinite;
    border-radius: var(--radius-lg);
}

/* Stagger animation delays via data attribute */
[data-stagger-index="0"] { animation-delay: 0ms; }
[data-stagger-index="1"] { animation-delay: 50ms; }
[data-stagger-index="2"] { animation-delay: 100ms; }
[data-stagger-index="3"] { animation-delay: 150ms; }
[data-stagger-index="4"] { animation-delay: 200ms; }
[data-stagger-index="5"] { animation-delay: 250ms; }
[data-stagger-index="6"] { animation-delay: 300ms; }
[data-stagger-index="7"] { animation-delay: 350ms; }
[data-stagger-index="8"] { animation-delay: 400ms; }
[data-stagger-index="9"] { animation-delay: 450ms; }

/* 분배 애니메이션 */
.distribute-animation-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 10001;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.distribute-shuffle-container {
    position: relative;
    width: 300px;
    height: 300px;
}

.shuffle-card {
    position: absolute;
    width: 80px;
    height: 50px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 11px;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    transition: none;
}

@keyframes shuffleSpin {
    0% { transform: translate(0,0) rotate(0deg); }
    25% { transform: translate(100px, -80px) rotate(90deg); }
    50% { transform: translate(200px, 0) rotate(180deg); }
    75% { transform: translate(100px, 80px) rotate(270deg); }
    100% { transform: translate(0,0) rotate(360deg); }
}

@keyframes cardFlyOut {
    0% { transform: scale(1); opacity: 1; }
    100% { transform: scale(0.3) translateY(200px); opacity: 0; }
}

@keyframes confettiDrop {
    0% { transform: translateY(-100px) rotate(0deg); opacity: 1; }
    100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

.distribute-result-title {
    color: white;
    font-size: 28px;
    font-weight: 800;
    text-align: center;
    animation: resultBounce 0.5s ease-out;
}

@keyframes resultBounce {
    0% { transform: scale(0); opacity: 0; }
    60% { transform: scale(1.2); }
    100% { transform: scale(1); opacity: 1; }
}

.confetti-piece {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    animation: confettiDrop 2s ease-in forwards;
}

/* 중요 가망 북마크 스타일 */
.lead-card--important {
    border-left: 4px solid #f59e0b !important;
    background: linear-gradient(90deg, rgba(245,158,11,0.05) 0%, transparent 100%);
}

.lead-card--important::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, #f59e0b, transparent);
}

/* 업체명 + 중요버튼 래퍼 */
.lead-name-wrap {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
}

.important-btn {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    border: none;
    background: transparent;
    color: var(--slate-300);
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    transition: all var(--ease-fast);
    opacity: 0.5;
}

.lead-card:hover .important-btn {
    opacity: 1;
    color: var(--slate-400);
}

.important-btn:hover {
    background: var(--warning-bg);
    color: var(--warning);
    transform: scale(1.1);
}

.important-btn.active,
.lead-card--important .important-btn {
    color: #f59e0b;
    opacity: 1;
}

.important-btn.active:hover {
    color: #d97706;
}

/* 칸반 중요 표시 */
.kanban-card--important {
    border-left: 3px solid #f59e0b;
}

.kanban-card--important .important-btn {
    opacity: 1;
    color: #f59e0b;
}

/* 전화번호 크게 표시 */
.lead-card-phone-large {
    font-size: var(--text-lg) !important;
    font-weight: 600;
    color: var(--primary-700);
    letter-spacing: 0.5px;
}

.lead-phone.lead-card-phone-large {
    font-size: var(--text-lg);
    font-weight: 600;
    color: var(--primary-700);
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
}

.lead-phone.lead-card-phone-large::before {
    content: '\260E';
    font-size: var(--text-sm);
    opacity: 0.7;
}

/* 특이사항 미리보기 */
.lead-card-notes-preview {
    font-size: var(--text-xs);
    color: var(--text-subtle);
    background: var(--slate-50);
    padding: var(--sp-1-5) var(--sp-2);
    border-radius: var(--radius-md);
    border-left: 2px solid var(--info);
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: var(--sp-1);
    display: flex;
    align-items: center;
    gap: var(--sp-1);
}

.lead-card-notes-preview::before {
    content: '\1F4DD';
    font-size: 10px;
    flex-shrink: 0;
}

.lead-card-extended .lead-card-notes-preview {
    max-width: 100%;
    margin-top: var(--sp-2);
}

/* 지역 필터 스타일 */
.region-filter-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.region-filter-select {
    appearance: none;
    background: var(--bg-elevated);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-2) var(--sp-8) var(--sp-2) var(--sp-3);
    font-size: var(--text-sm);
    color: var(--text);
    cursor: pointer;
    transition: all var(--ease-fast);
    min-width: 100px;
}

.region-filter-select:hover {
    border-color: var(--primary-300);
}

.region-filter-select:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.region-filter-wrapper::after {
    content: '\25BC';
    position: absolute;
    right: var(--sp-3);
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: var(--text-muted);
    pointer-events: none;
}

/* 지역 태그 스타일 */
.lead-region-tag {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    font-size: var(--text-xs);
    color: var(--slate-600);
    background: var(--slate-100);
    padding: var(--sp-0-5) var(--sp-2);
    border-radius: var(--radius-full);
}

.lead-region-tag::before {
    content: '\1F4CD';
    font-size: 10px;
}

/* 중요 가망 필터 버튼 */
.filter-btn[data-filter="important"] {
    color: #f59e0b;
}

.filter-btn[data-filter="important"].active {
    background: linear-gradient(135deg, #f59e0b, #d97706);
    color: white;
}

.filter-btn[data-filter="important"]::before {
    content: '\2605';
    margin-right: var(--sp-1);
}

/* 기간만료 필터 버튼 */
.filter-btn-expired {
    color: var(--danger);
}

.filter-btn-expired.active {
    background: linear-gradient(135deg, var(--danger), var(--danger-hover));
    color: white;
}

/* 필터 영역 확장 */
.lead-filters-extended {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    align-items: center;
    margin-top: var(--sp-2);
    padding-top: var(--sp-2);
    border-top: 1px solid var(--border-subtle);
}

/* 반응형: 모바일에서 지역 필터 */
@media (max-width: 768px) {
    .region-filter-select {
        min-width: 80px;
        padding: var(--sp-1-5) var(--sp-6) var(--sp-1-5) var(--sp-2);
        font-size: var(--text-xs);
    }

    .lead-card-notes-preview {
        max-width: 150px;
    }

    .lead-card-phone-large {
        font-size: var(--text-md) !important;
    }
}

/* 전화예약 탭 스타일 */
.reservation-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--sp-4);
    margin-bottom: var(--sp-5);
    padding: var(--sp-4);
    background: var(--card);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
}

.reservation-summary {
    display: flex;
    gap: var(--sp-4);
    flex-wrap: wrap;
}

.reservation-summary-card {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    background: var(--bg-sunken);
    border-radius: var(--radius-md);
    min-width: 140px;
}

.reservation-summary-card.next-call {
    background: linear-gradient(135deg, var(--primary-50) 0%, var(--accent-50) 100%);
    border: 1px solid var(--primary-200);
}

.summary-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-md);
}

.summary-icon svg {
    width: 20px;
    height: 20px;
}

.summary-icon.pending {
    background: var(--warning-bg);
    color: var(--warning);
}

.summary-icon.completed {
    background: var(--success-bg);
    color: var(--success);
}

.summary-icon.next {
    background: var(--primary-bg-strong);
    color: var(--primary);
}

.summary-content {
    display: flex;
    flex-direction: column;
    gap: var(--sp-0-5);
}

.summary-label {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.summary-value {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--text);
}

.summary-sub {
    font-size: var(--text-xs);
    color: var(--text-subtle);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reservation-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    flex-wrap: wrap;
}

.reservation-filter-group {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: var(--text-sm);
}

.reservation-filter-group label {
    color: var(--text-muted);
    white-space: nowrap;
}

.reservation-date-input {
    padding: var(--sp-1-5) var(--sp-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    background: var(--card);
}

.reservation-status-select {
    padding: var(--sp-1-5) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    background: var(--card);
    cursor: pointer;
}

/* 예약 목록 */
.reservation-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.reservation-card {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    padding: var(--sp-4);
    background: var(--card);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    border-left: 4px solid var(--primary);
    transition: all var(--ease-fast);
}

.reservation-card .reservation-time {
    flex-shrink: 0;
    width: 100px;
}

.reservation-card .reservation-info {
    flex: 1;
    min-width: 0;
}

.reservation-card .reservation-status {
    flex-shrink: 0;
}

.reservation-card .reservation-actions {
    flex-shrink: 0;
}

.reservation-card:hover {
    box-shadow: var(--shadow-card-hover);
    transform: translateY(-1px);
}

.reservation-card.completed {
    border-left-color: var(--success);
    opacity: 0.8;
}

.reservation-card.cancelled {
    border-left-color: var(--slate-400);
    opacity: 0.6;
}

.reservation-card.overdue {
    border-left-color: var(--danger);
    background: var(--danger-50);
}

.reservation-time {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--sp-1);
}

.reservation-date {
    font-size: var(--text-sm);
    color: var(--text-muted);
    font-weight: 500;
}

.reservation-hour {
    font-size: var(--text-2xl);
    font-weight: 700;
    color: var(--primary);
}

.overdue-badge {
    font-size: var(--text-xs);
    padding: var(--sp-0-5) var(--sp-1-5);
    background: var(--danger);
    color: white;
    border-radius: var(--radius-sm);
}

.reservation-info {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
    min-width: 0;
}

.reservation-staff {
    margin-bottom: var(--sp-1);
}

.reservation-staff .staff-badge {
    display: inline-block;
    padding: var(--sp-0-5) var(--sp-2);
    background: var(--primary-100);
    color: var(--primary-700);
    font-size: var(--text-xs);
    font-weight: 600;
    border-radius: var(--radius-full);
}

.reservation-view-toggle {
    display: inline-flex;
    gap: 0;
    background: var(--bg-sunken);
    border-radius: var(--radius-lg);
    padding: 3px;
    border: 1px solid var(--border);
}

.reservation-view-toggle .btn {
    border: none;
    background: transparent;
    color: var(--text-secondary);
    border-radius: calc(var(--radius-lg) - 2px);
    min-height: 32px;
    padding: var(--sp-1-5) var(--sp-3);
    font-weight: 500;
    transition: all var(--duration-fast) var(--ease-out);
    position: relative;
}

.reservation-view-toggle .btn:hover:not(.active) {
    color: var(--text);
    background: rgba(0, 0, 0, 0.05);
}

.reservation-view-toggle .btn.active {
    background: var(--primary);
    color: white;
    box-shadow: 0 2px 4px rgba(59, 130, 246, 0.25);
}

.reservation-view-toggle .btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--primary-ring);
}

.reservation-view-toggle .btn:active:not(:disabled) {
    transform: scale(0.97);
}

/* 일괄 알림 설정 바 */
.reservation-bulk-notify-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3) var(--sp-4);
    background: var(--primary-50);
    border: 1px solid var(--primary-200);
    border-radius: var(--radius-lg);
    margin-bottom: var(--sp-4);
}

.bulk-notify-info {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
}

.bulk-notify-info .checkbox-label {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text);
}

.bulk-notify-info .checkbox-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--primary);
}

.bulk-notify-info .selected-count {
    font-size: var(--text-sm);
    color: var(--text-subtle);
}

.bulk-notify-info .selected-count strong {
    color: var(--primary);
    font-weight: 600;
}

.bulk-notify-actions {
    display: flex;
    gap: var(--sp-2);
}

.bulk-notify-actions .btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* 예약 카드 알림 체크박스 */
.reservation-card .notify-checkbox {
    display: flex;
    align-items: center;
    margin-right: var(--sp-3);
}

.reservation-card .notify-checkbox input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--primary);
}

.reservation-card .notify-checkbox .notify-icon {
    margin-left: var(--sp-1);
    color: var(--warning-500);
}

.reservation-card .notify-checkbox .notify-icon.active {
    color: var(--success);
}

.reservation-card.notify-enabled {
    border-left: 3px solid var(--success);
}

.reservation-business {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.reservation-business.clickable-business {
    cursor: pointer;
    color: var(--primary);
    text-decoration: underline;
    text-decoration-color: transparent;
    text-underline-offset: 2px;
}

.reservation-business.clickable-business:hover {
    text-decoration-color: var(--primary);
}

.reservation-phone {
    font-size: var(--text-sm);
    color: var(--text-subtle);
}

.reservation-phone .phone-link {
    color: var(--primary);
    text-decoration: none;
}

.reservation-phone .phone-link:hover {
    text-decoration: underline;
}

.reservation-memo {
    font-size: var(--text-xs);
    color: var(--text-muted);
    background: var(--bg-sunken);
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-sm);
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reservation-status {
    display: flex;
    justify-content: center;
}

.reservation-card .status-badge {
    font-size: var(--text-xs);
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-sm);
    font-weight: 500;
}

.status-badge.pending {
    background: var(--warning-bg);
    color: var(--warning);
}

.status-badge.completed {
    background: var(--success-bg);
    color: var(--success);
}

.status-badge.cancelled {
    background: var(--slate-100);
    color: var(--slate-500);
}

.reservation-card .reservation-actions {
    display: flex;
    gap: var(--sp-2);
}

/* 가망 모달 내 예약 섹션 */
.reservation-section {
    margin-top: var(--sp-4);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--border);
}

.reservation-section .section-title {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    margin-bottom: var(--sp-3);
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.reservation-section .section-title::before {
    content: '';
    width: 4px;
    height: 16px;
    background: var(--primary);
    border-radius: 2px;
}

.lead-reservation-section {
    margin-top: var(--sp-4);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--border);
}

.lead-reservation-section .section-title {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    margin-bottom: var(--sp-3);
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.lead-reservation-section .section-title::before {
    content: '';
    width: 4px;
    height: 16px;
    background: var(--primary);
    border-radius: 2px;
}

.reservation-form-inline {
    display: flex;
    gap: var(--sp-2);
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: var(--sp-3);
}

.reservation-datetime-input {
    flex: 1;
    min-width: 180px;
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.reservation-memo-input {
    flex: 1;
    min-width: 120px;
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.lead-reservation-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
    max-height: 150px;
    overflow-y: auto;
}

.lead-reservation-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2);
    background: var(--bg-sunken);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
}

.lead-reservation-item.completed {
    opacity: 0.6;
}

.lead-reservation-item.cancelled {
    opacity: 0.4;
    text-decoration: line-through;
}

.reservation-item-time {
    font-weight: 600;
    color: var(--primary);
}

.reservation-item-status {
    padding: var(--sp-0-5) var(--sp-1);
    border-radius: var(--radius-xs);
    font-size: 10px;
    font-weight: 500;
}

.lead-reservation-item.pending .reservation-item-status {
    background: var(--warning-bg);
    color: var(--warning);
}

.lead-reservation-item.completed .reservation-item-status {
    background: var(--success-bg);
    color: var(--success);
}

.lead-reservation-item.cancelled .reservation-item-status {
    background: var(--slate-100);
    color: var(--slate-500);
}

.reservation-item-memo {
    color: var(--text-muted);
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.no-reservations {
    font-size: var(--text-xs);
    color: var(--text-muted);
    text-align: center;
    padding: var(--sp-3);
}

/* 반응형 */
@media (max-width: 768px) {
    .reservation-header {
        flex-direction: column;
    }

    .reservation-summary {
        width: 100%;
        justify-content: space-between;
    }

    .reservation-summary-card {
        flex: 1;
        min-width: 100px;
    }

    .reservation-actions {
        width: 100%;
    }

    .reservation-card {
        flex-wrap: wrap;
    }

    .reservation-card .reservation-time {
        width: 80px;
    }

    .reservation-card .reservation-info {
        width: calc(100% - 100px);
    }

    .reservation-card .reservation-status,
    .reservation-card .reservation-actions {
        margin-left: auto;
    }

    .reservation-card .notify-checkbox {
        order: -1;
    }

    .reservation-card .reservation-actions {
        grid-column: 2;
        grid-row: 2;
        justify-content: flex-end;
    }

    .reservation-form-inline {
        flex-direction: column;
        align-items: stretch;
    }

    .reservation-datetime-input,
    .reservation-memo-input {
        min-width: 100%;
    }
}

/* ========================================
   특수팀 스타일
   ======================================== */

/* 특수팀 헤더 */
.special-team-header {
    display: flex;
    align-items: center;
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
    padding-bottom: var(--sp-4);
    border-bottom: 1px solid var(--border);
}

.special-team-header h2 {
    font-size: var(--text-xl);
    font-weight: 600;
    color: var(--text);
    margin: 0;
}

.team-role-badge {
    display: inline-flex;
    align-items: center;
    padding: var(--sp-1) var(--sp-3);
    background: var(--primary-bg);
    color: var(--primary);
    font-size: var(--text-xs);
    font-weight: 500;
    border-radius: var(--radius-full);
}

/* 특수팀 서브탭 */
.admin-team-subtabs,
.risk-team-subtabs {
    display: flex;
    gap: var(--sp-2);
    margin-bottom: var(--sp-6);
    border-bottom: 1px solid var(--border);
    padding-bottom: var(--sp-2);
}

.admin-subtab,
.risk-subtab {
    padding: var(--sp-2) var(--sp-4);
    border: none;
    background: none;
    cursor: pointer;
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text-muted);
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s;
}

.admin-subtab:hover,
.risk-subtab:hover {
    color: var(--primary);
}

.admin-subtab.active,
.risk-subtab.active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}

/* 업무일지 에디터 */
.work-log-editor {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-6);
}

.work-log-date-header {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

.work-log-date-header input[type="date"] {
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.my-categories-display {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.category-badge {
    display: inline-flex;
    align-items: center;
    padding: var(--sp-1) var(--sp-3);
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 500;
    color: #fff;
}

#workLogContent {
    width: 100%;
    min-height: 300px;
    padding: var(--sp-4);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    line-height: 1.6;
    resize: vertical;
}

.work-log-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-top: var(--sp-4);
}

.save-status {
    font-size: var(--text-xs);
    color: var(--success);
}

/* 팀 업무일지 목록 */
.team-logs-filter {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    flex-wrap: wrap;
    margin-bottom: var(--sp-4);
}

.team-logs-filter input,
.team-logs-filter select {
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.team-work-logs-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-4);
}

.team-work-log-item {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
}

.team-work-log-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-3);
    padding-bottom: var(--sp-2);
    border-bottom: 1px solid var(--border-light);
}

.team-work-log-header .staff-name {
    font-weight: 600;
    color: var(--text);
}

.team-work-log-header .log-date {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.team-work-log-content {
    font-size: var(--text-sm);
    color: var(--text);
    line-height: 1.6;
    white-space: pre-wrap;
}

/* 카테고리 관리 */
.category-management {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-6);
}

.category-add-form {
    display: flex;
    gap: var(--sp-3);
    align-items: center;
    margin-bottom: var(--sp-4);
}

.category-add-form input[type="text"] {
    flex: 1;
    max-width: 200px;
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.category-add-form input[type="color"] {
    width: 40px;
    height: 32px;
    padding: 2px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    cursor: pointer;
}

.category-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.category-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-3);
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}

.category-item .category-color {
    width: 16px;
    height: 16px;
    border-radius: 50%;
}

.category-item .delete-category {
    padding: 2px;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--text-muted);
    opacity: 0.6;
}

.category-item .delete-category:hover {
    opacity: 1;
    color: var(--danger);
}

.staff-category-assign {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.staff-assign-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--border-light);
}

.staff-assign-row .staff-name {
    min-width: 100px;
    font-weight: 500;
}

.staff-assign-row .category-checkboxes {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}

/* 특수팀 통계 요약 */
.upsell-stats-summary,
.renewal-stats-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}

.stat-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    text-align: center;
}

.stat-card .stat-label {
    font-size: var(--text-xs);
    color: var(--text-muted);
    margin-bottom: var(--sp-1);
}

.stat-card .stat-value {
    font-size: var(--text-2xl);
    font-weight: 600;
    color: var(--primary);
}

/* 특수팀 액션 버튼 */
.upsell-actions,
.renewal-actions {
    display: flex;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

/* 특수팀 가망 목록 */
.upsell-lead-list,
.renewal-lead-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

/* 리스크팀 보고서 폼 */
.risk-report-form {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-6);
}

.report-date-header {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-bottom: var(--sp-6);
}

.report-date-header input[type="date"] {
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.report-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}

.report-section {
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: var(--sp-4);
}

.report-section.wide {
    grid-column: 1 / -1;
}

.report-section legend {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    padding: 0 var(--sp-2);
}

.report-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--sp-2) 0;
    border-bottom: 1px solid var(--border-light);
}

.report-row:last-child {
    border-bottom: none;
}

.report-row label {
    font-size: var(--text-sm);
    color: var(--text-muted);
}

.report-row input[type="number"] {
    width: 100px;
    padding: var(--sp-1-5) var(--sp-2);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--text-sm);
    text-align: right;
}

.computed-value {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--primary);
}

/* 취소사유 / 솔루션 그리드 */
.cancel-reasons-grid,
.solutions-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: var(--sp-3);
}

.reason-item,
.solution-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--sp-2);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
}

.reason-item label,
.solution-item label {
    font-size: var(--text-xs);
    color: var(--text);
}

.reason-item input,
.solution-item input {
    width: 60px;
    padding: var(--sp-1);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    text-align: right;
}

.report-actions {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-top: var(--sp-4);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--border);
}

/* 민원 처리 */
.complaints-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-4);
}

.complaints-filter {
    display: flex;
    gap: var(--sp-3);
}

.complaints-filter select {
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.complaints-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.complaint-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
}

.complaint-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-3);
}

.complaint-type-badge {
    display: inline-flex;
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    font-weight: 500;
}

.complaint-type-badge.card {
    background: var(--info-bg);
    color: var(--info);
}

.complaint-type-badge.institution {
    background: var(--warning-bg);
    color: var(--warning);
}

.complaint-type-badge.lawsuit {
    background: var(--danger-bg);
    color: var(--danger);
}

.complaint-status-badge {
    display: inline-flex;
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
}

.complaint-status-badge.pending {
    background: var(--slate-100);
    color: var(--slate-600);
}

.complaint-status-badge.in_progress {
    background: var(--info-bg);
    color: var(--info);
}

.complaint-status-badge.completed {
    background: var(--success-bg);
    color: var(--success);
}

.complaint-content {
    font-size: var(--text-sm);
    color: var(--text);
    line-height: 1.5;
}

.complaint-meta {
    display: flex;
    gap: var(--sp-4);
    margin-top: var(--sp-3);
    font-size: var(--text-xs);
    color: var(--text-muted);
}

/* 보고 이력 */
.report-history-filter {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

.report-history-filter input[type="month"] {
    padding: var(--sp-2) var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
}

.report-history-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
}

.report-history-item {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    cursor: pointer;
    transition: border-color 0.2s;
}

.report-history-item:hover {
    border-color: var(--primary);
}

/* 반응형 - 특수팀 */
@media (max-width: 768px) {
    .special-team-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--sp-2);
    }

    .admin-team-subtabs,
    .risk-team-subtabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .report-grid {
        grid-template-columns: 1fr;
    }

    .cancel-reasons-grid,
    .solutions-grid {
        grid-template-columns: 1fr;
    }

    .team-logs-filter {
        flex-direction: column;
        align-items: stretch;
    }

    .complaints-header {
        flex-direction: column;
        gap: var(--sp-3);
    }

    .complaints-filter {
        width: 100%;
    }

    .complaints-filter select {
        flex: 1;
    }
}

/* ===================================
   Activity Feed - View More Button
   =================================== */
.activity-feed-footer {
    padding: var(--sp-3) var(--sp-4);
    border-top: 1px solid var(--border);
    text-align: center;
}

.activity-viewmore-btn {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: var(--text-sm);
}

.activity-viewmore-btn svg {
    flex-shrink: 0;
}

/* ===================================
   Exchange Approval - Dual Manager Status
   =================================== */
.exchange-dual-status {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--sp-1);
}

.exchange-managers-status {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--sp-2);
    margin-top: var(--sp-1);
}

.exchange-mgr-item {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
}

.exchange-mgr-name {
    font-size: var(--text-xs);
    color: var(--text-secondary);
}

.exchange-mgr-separator {
    color: var(--text-muted);
    font-weight: 300;
}

/* Badge variations for exchange status */
.badge-success {
    background: var(--success-bg);
    color: var(--success);
    font-size: var(--text-xs);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

.badge-warning {
    background: var(--warning-bg);
    color: var(--warning);
    font-size: var(--text-xs);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
}

/* Activity Modal Styles */
#activityModal .modal-content {
    max-width: 800px;
}

#activityModalList .activity-item {
    padding: var(--sp-3);
    border-bottom: 1px solid var(--border);
}

#activityModalList .activity-item:last-child {
    border-bottom: none;
}

.activity-pagination {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

/* ===================================
   Mobile CSS Optimization
   =================================== */

/* 모바일 버튼 터치 영역 최소 44px */
@media (max-width: 768px) {
    .btn,
    .filter-btn,
    .modal-close,
    button {
        min-height: 44px;
        min-width: 44px;
    }

    .btn-sm {
        min-height: 36px;
        padding: var(--sp-2) var(--sp-3);
    }

    /* 모달 크기 최적화 */
    .modal-content {
        width: calc(100vw - var(--sp-4));
        max-width: 100%;
        margin: var(--sp-2);
    }

    /* 테이블 가로 스크롤 */
    .table-responsive,
    .data-table-wrapper,
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .table-responsive::-webkit-scrollbar,
    table::-webkit-scrollbar {
        height: 6px;
    }

    .table-responsive::-webkit-scrollbar-thumb,
    table::-webkit-scrollbar-thumb {
        background: var(--slate-300);
        border-radius: 3px;
    }

    /* 카드 레이아웃 최적화 */
    .lead-card {
        margin-bottom: var(--sp-3);
    }

    .lead-card-header {
        flex-wrap: wrap;
        gap: var(--sp-2);
    }

    .lead-badges {
        flex-wrap: wrap;
        gap: var(--sp-1);
    }

    /* 필터 버튼 스크롤 */
    .filter-buttons {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        flex-wrap: nowrap;
        padding-bottom: var(--sp-2);
    }

    .filter-buttons::-webkit-scrollbar {
        display: none;
    }

    .filter-btn {
        flex-shrink: 0;
        white-space: nowrap;
    }

    /* 네비게이션 최적화 */
    .mobile-tabbar .mobile-tab-item {
        min-height: 48px;
        padding: var(--sp-1-5) var(--sp-2);
    }

    /* 에스컬레이션 버튼 스타일 */
    .escalation-btn {
        min-height: 44px;
        padding: var(--sp-2) var(--sp-3);
        display: inline-flex;
        align-items: center;
        gap: var(--sp-2);
    }
}

@media (max-width: 480px) {
    /* 더 작은 화면에서 버튼 크기 조정 */
    .btn {
        padding: var(--sp-2-5) var(--sp-3);
        font-size: var(--text-sm);
    }

    .modal-content {
        margin: 0;
        border-radius: var(--radius-xl) var(--radius-xl) 0 0;
        max-height: 95vh;
        max-height: 95dvh;
    }

    /* 카드 내부 패딩 축소 */
    .lead-card-body {
        padding: var(--sp-2-5) var(--sp-3);
    }

    .lead-card-notes-inline {
        padding: var(--sp-2);
    }

    /* 활동 모달 최적화 */
    #activityModal .modal-content {
        padding: var(--sp-3);
    }

    #activityModalList .activity-item {
        padding: var(--sp-2);
    }

    .activity-filter-row {
        flex-direction: column;
        gap: var(--sp-2);
    }

    .activity-filter-row select,
    .activity-filter-row input {
        width: 100%;
    }
}

/* 에스컬레이션 버튼 스타일 */
.escalation-btn {
    background: var(--warning);
    color: var(--text-inverted);
    border: none;
    border-radius: var(--radius-md);
    padding: var(--sp-1-5) var(--sp-3);
    font-size: var(--text-xs);
    font-weight: 600;
    cursor: pointer;
    transition: all var(--duration-fast) var(--ease-out);
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
}

.escalation-btn:hover {
    background: var(--warning-600);
    transform: translateY(-1px);
}

.escalation-btn svg {
    width: 14px;
    height: 14px;
}

.escalation-badge {
    background: var(--warning-bg);
    color: var(--warning);
    font-size: var(--text-xs);
    padding: 2px 6px;
    border-radius: var(--radius-sm);
    font-weight: 600;
}

/* ========================================
   보안 모니터링 스타일
   ======================================== */

.security-kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}

.security-kpi-card {
    background: var(--card);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    text-align: center;
    border: 1px solid var(--border);
}

.security-kpi-card .kpi-value {
    font-size: var(--text-3xl);
    font-weight: 700;
    color: var(--primary);
}

.security-kpi-card.warning .kpi-value { color: var(--warning); }
.security-kpi-card.danger .kpi-value { color: var(--danger); }

.security-kpi-card .kpi-label {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-top: var(--sp-1);
}

.security-section {
    background: var(--card);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    margin-bottom: var(--sp-4);
    border: 1px solid var(--border);
}

.security-section h4 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-3);
    color: var(--text);
    font-size: var(--text-base);
}

.device-stats, .geo-stats {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-3);
}

.device-stat-item, .geo-stat-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2) var(--sp-3);
    background: var(--bg-alt);
    border-radius: var(--radius-md);
}

.device-icon { font-size: 20px; }
.device-type, .geo-city { color: var(--text); }
.device-count, .geo-count {
    font-weight: 600;
    color: var(--primary);
}

.security-alert-item {
    padding: var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    margin-bottom: var(--sp-2);
    background: var(--card);
}

.security-alert-item.status-pending {
    border-left: 3px solid var(--warning);
}

.security-alert-item.status-reviewed {
    opacity: 0.7;
    border-left: 3px solid var(--success);
}

.security-alert-item.status-dismissed {
    opacity: 0.5;
}

.alert-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-1);
}

.alert-type {
    font-weight: 600;
    color: var(--text);
}

.alert-time {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.alert-user {
    font-size: var(--text-sm);
    color: var(--text-secondary);
    margin-bottom: var(--sp-1);
}

.alert-message {
    font-size: var(--text-sm);
    color: var(--text);
}

.alert-actions {
    display: flex;
    gap: var(--sp-2);
    margin-top: var(--sp-2);
}

.user-badge {
    display: inline-block;
    padding: 2px 8px;
    background: var(--primary-bg);
    color: var(--primary);
    border-radius: var(--radius-sm);
    font-size: var(--text-xs);
    margin-right: var(--sp-1);
}

.security-subtabs {
    display: flex;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
    padding-bottom: var(--sp-3);
    border-bottom: 1px solid var(--border);
    flex-wrap: wrap;
}

.security-subtab {
    padding: var(--sp-2) var(--sp-4);
    background: var(--bg-alt);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    color: var(--text-secondary);
    font-size: var(--text-sm);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.security-subtab:hover {
    background: var(--slate-100);
    color: var(--text);
}

.security-subtab.active {
    background: var(--primary);
    color: white;
    border-color: var(--primary);
}

.security-subtab-content {
    min-height: 200px;
}

.security-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-4);
}

.security-header h3 {
    margin: 0;
    color: var(--text);
    font-size: var(--text-xl);
    font-weight: 600;
}

.security-header-actions {
    display: flex;
    gap: var(--sp-2);
}

.security-alerts-filter {
    display: flex;
    gap: var(--sp-2);
    margin-bottom: var(--sp-4);
}

.backup-actions {
    margin-bottom: var(--sp-4);
}

/* ==========================================
   Performance Optimization Styles
   ========================================== */

/* Virtual Scrolling */
.virtual-spacer-top,
.virtual-spacer-bottom {
    flex-shrink: 0;
    pointer-events: none;
}

.virtual-scroll-status {
    position: sticky;
    top: 0;
    z-index: 5;
    background: var(--bg-subtle);
    padding: var(--sp-1) var(--sp-3);
    font-size: var(--text-xs);
    color: var(--text-muted);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.virtual-scroll-status::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--success);
    animation: pulse-dot 1.5s infinite;
}

@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.8); }
}

/* Lazy Loading */
img[data-src],
[data-bg] {
    opacity: 0;
    transition: opacity 0.3s ease;
}

img.lazy-loaded,
.lazy-loaded {
    opacity: 1;
}

/* GPU Acceleration for animations */
.lead-card,
.monitor-card,
.glass-card,
.toast-item,
.modal-content {
    will-change: transform;
    transform: translateZ(0);
}
/* sidebar GPU 가속은 모바일 translateX(-100%)를 덮어쓰지 않도록 분리 */
@media (min-width: 769px) {
    .sidebar {
        will-change: transform;
        transform: translateZ(0);
    }
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Skeleton loading optimization */
.skeleton {
    background: linear-gradient(90deg,
        var(--slate-100) 25%,
        var(--slate-50) 50%,
        var(--slate-100) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
}

@keyframes skeleton-loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-card {
    height: 120px;
    border-radius: var(--radius-lg);
    margin-bottom: var(--sp-3);
}

.skeleton-text {
    height: 1em;
    border-radius: var(--radius-sm);
    margin-bottom: var(--sp-2);
}

.skeleton-text.short {
    width: 40%;
}

.skeleton-text.medium {
    width: 70%;
}

/* Content visibility optimization for long lists */
/* Containment for performance */
.staff-list,
#monitorDashboard {
    contain: content;
}

/* Optimize rendering for large lists */
.optimized-list {
    contain: strict;
    will-change: scroll-position;
}

.optimized-list > * {
    contain: layout style paint;
}

/* Cached indicator */
.cached-indicator {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1);
    font-size: var(--text-xs);
    color: var(--text-muted);
    padding: var(--sp-1) var(--sp-2);
    background: var(--bg-subtle);
    border-radius: var(--radius-sm);
}

.cached-indicator::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--info);
}

/* Performance metrics display (dev mode) */
.perf-metrics {
    position: fixed;
    bottom: var(--sp-4);
    right: var(--sp-4);
    background: rgba(0, 0, 0, 0.8);
    color: #0f0;
    font-family: monospace;
    font-size: 11px;
    padding: var(--sp-2);
    border-radius: var(--radius-md);
    z-index: 9999;
    pointer-events: none;
}

/* Smooth scroll optimization */
html {
    scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

/* Intersection observer fade-in */
.fade-on-scroll {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.fade-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Debounced input indicator */
.input-debouncing::after {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--warning);
    animation: debounce-pulse 0.3s ease;
}

@keyframes debounce-pulse {
    0% { transform: translateY(-50%) scale(1); opacity: 1; }
    100% { transform: translateY(-50%) scale(1.5); opacity: 0; }
}

/* ==================== 팔로업 시스템 스타일 ==================== */

/* 팔로업 섹션 */
.followup-section {
    padding: var(--sp-4);
}

.followup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--sp-4);
}

.followup-header h4 {
    font-size: var(--text-md);
    font-weight: 600;
    color: var(--text);
    margin: 0;
}

.followup-header-actions {
    display: flex;
    gap: var(--sp-2);
}

/* 팔로업 규칙 그리드 */
.followup-rules-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: var(--sp-4);
}

/* 팔로업 규칙 카드 */
.followup-rule-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.followup-rule-card:hover {
    border-color: var(--primary-light);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.followup-rule-card.inactive {
    opacity: 0.7;
    background: var(--bg-subtle);
}

.followup-rule-card .rule-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: var(--sp-4);
    border-bottom: 1px solid var(--border);
    background: var(--bg-subtle);
}

.followup-rule-card .rule-title {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1);
}

.followup-rule-card .rule-name {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
}

.followup-rule-card .rule-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    font-weight: 500;
}

.followup-rule-card .rule-status.active {
    background: var(--success-bg);
    color: var(--success);
}

.followup-rule-card .rule-status.inactive {
    background: var(--slate-100);
    color: var(--slate-500);
}

.followup-rule-card .rule-actions {
    display: flex;
    gap: var(--sp-1);
}

.followup-rule-card .btn-icon {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    border-radius: var(--radius);
    color: var(--text-muted);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.followup-rule-card .btn-icon:hover {
    background: var(--slate-100);
    color: var(--text);
}

.followup-rule-card .btn-icon.btn-danger:hover {
    background: var(--danger-bg);
    color: var(--danger);
}

.followup-rule-card .rule-body {
    padding: var(--sp-4);
}

.followup-rule-card .rule-info {
    display: flex;
    gap: var(--sp-4);
    margin-bottom: var(--sp-3);
}

.followup-rule-card .rule-info-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.followup-rule-card .rule-info-label {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.followup-rule-card .rule-info-value {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--text);
}

.followup-rule-card .rule-condition {
    font-size: var(--text-xs);
    color: var(--text-subtle);
    background: var(--bg-subtle);
    padding: var(--sp-2) var(--sp-3);
    border-radius: var(--radius);
}

.followup-rule-card .rule-footer {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    border-top: 1px solid var(--border);
    background: var(--bg-subtle);
}

.followup-rule-card .rule-meta {
    font-size: var(--text-xs);
    color: var(--text-muted);
}

.followup-rule-card .rule-footer .btn {
    margin-left: auto;
}

/* 빈 상태 */
.followup-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--sp-8);
    text-align: center;
    color: var(--text-muted);
}

.followup-empty svg {
    margin-bottom: var(--sp-3);
}

.followup-empty p {
    margin-bottom: var(--sp-4);
    font-size: var(--text-sm);
}

/* 팔로업 모달 */
.followup-modal .form-row {
    display: flex;
    gap: var(--sp-4);
    margin-bottom: var(--sp-4);
}

.followup-modal .form-row .form-group {
    margin-bottom: 0;
}

.followup-modal .form-section {
    margin-bottom: var(--sp-5);
    padding-bottom: var(--sp-4);
    border-bottom: 1px solid var(--border);
}

.followup-modal .form-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.followup-modal .form-section-title {
    font-size: var(--text-sm);
    font-weight: 600;
    color: var(--text);
    margin-bottom: var(--sp-3);
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.followup-modal .form-section-title svg {
    width: 16px;
    height: 16px;
    color: var(--primary);
}

.followup-modal .form-textarea {
    width: 100%;
    min-height: 80px;
    padding: var(--sp-3);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    font-size: var(--text-sm);
    font-family: inherit;
    resize: vertical;
}

.followup-modal .form-textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-ring);
}

.followup-modal .template-select-wrapper {
    margin-bottom: var(--sp-4);
    padding: var(--sp-3);
    background: var(--info-bg);
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.followup-modal .template-select-wrapper label {
    font-size: var(--text-sm);
    font-weight: 500;
    color: var(--info);
    white-space: nowrap;
}

.followup-modal .template-select-wrapper select {
    flex: 1;
}

/* 팔로업 로그 테이블 */
.followup-logs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--text-sm);
}

.followup-logs-table th,
.followup-logs-table td {
    padding: var(--sp-3);
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.followup-logs-table th {
    font-weight: 600;
    color: var(--text-muted);
    font-size: var(--text-xs);
    text-transform: uppercase;
    background: var(--bg-subtle);
}

.followup-logs-table tbody tr:hover {
    background: var(--bg-subtle);
}

/* 활성/비활성 토글 */
.followup-toggle-wrapper {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.followup-toggle-wrapper label {
    font-size: var(--text-sm);
    color: var(--text);
}

/* 반응형 */
@media (max-width: 768px) {
    .followup-rules-grid {
        grid-template-columns: 1fr;
    }

    .followup-modal .form-row {
        flex-direction: column;
        gap: var(--sp-3);
    }

    .followup-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--sp-3);
    }

    .followup-rule-card .rule-info {
        flex-direction: column;
        gap: var(--sp-2);
    }
}

/* ==========================================================================
   스마트 배분 시스템 (Distribution System)
   ========================================================================== */

/* 배분 설정 카드 */
.dist-settings-card,
.dist-simulation-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-5);
    margin-bottom: var(--sp-4);
}

.dist-settings-card h3,
.dist-simulation-card h3 {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: 1.125rem;
    font-weight: 700;
    margin: 0 0 var(--sp-4) 0;
    color: var(--text);
}

.dist-settings-card h3 .material-icons,
.dist-simulation-card h3 .material-icons {
    font-size: 1.25rem;
    color: var(--primary);
}

.dist-settings-card h4 {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: 0.9375rem;
    font-weight: 600;
    margin: var(--sp-4) 0 var(--sp-3) 0;
    color: var(--text-subtle);
}

/* 알고리즘 정보 박스 */
.algo-info-box {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3);
    padding: var(--sp-3) var(--sp-4);
    background: var(--gray-50);
    border-radius: var(--radius-md);
    margin-bottom: var(--sp-4);
}

.algo-info-box .material-icons {
    font-size: 1.5rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.algo-info-box strong {
    display: block;
    margin-bottom: var(--sp-1);
}

.algo-info-box p {
    margin: 0;
    font-size: 0.875rem;
    color: var(--text-subtle);
}

/* 알고리즘 설정 옵션 */
.config-options {
    background: var(--gray-50);
    border-radius: var(--radius-md);
    padding: var(--sp-4);
    margin-bottom: var(--sp-4);
}

.config-options .form-group {
    margin-bottom: var(--sp-3);
}

.config-options .form-group:last-child {
    margin-bottom: 0;
}

/* 제외 직원 체크박스 그리드 */
.staff-checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: var(--sp-2);
    max-height: 200px;
    overflow-y: auto;
    padding: var(--sp-3);
    background: var(--gray-50);
    border-radius: var(--radius-md);
}

.staff-checkbox-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    padding: var(--sp-2);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: all var(--ease-fast);
}

.staff-checkbox-item:hover {
    border-color: var(--primary);
    background: var(--primary-bg);
}

.staff-checkbox-item input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--primary);
}

.staff-checkbox-item small {
    color: var(--text-muted);
    font-size: 0.75rem;
}

/* 설정 액션 버튼 */
.settings-actions {
    display: flex;
    gap: var(--sp-3);
    margin-top: var(--sp-4);
    padding-top: var(--sp-4);
    border-top: 1px solid var(--border);
}

/* 시뮬레이션 컨트롤 */
.simulation-controls {
    display: flex;
    align-items: flex-end;
    gap: var(--sp-3);
    margin-bottom: var(--sp-4);
}

.simulation-controls .form-group {
    margin-bottom: 0;
    flex: 1;
    max-width: 200px;
}

/* 시뮬레이션 결과 */
.simulation-summary {
    padding: var(--sp-3);
    background: var(--primary-bg);
    border-radius: var(--radius-md);
    margin-bottom: var(--sp-4);
}

.simulation-summary p {
    margin: 0;
}

.simulation-chart {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.sim-bar-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.sim-staff-name {
    width: 100px;
    font-size: 0.875rem;
    font-weight: 500;
    flex-shrink: 0;
    text-align: right;
}

.sim-bar-container {
    flex: 1;
    height: 28px;
    background: var(--gray-100);
    border-radius: var(--radius-sm);
    overflow: hidden;
}

.sim-bar {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: var(--sp-2);
    border-radius: var(--radius-sm);
    transition: width 0.5s ease;
    min-width: 30px;
}

.sim-bar-value {
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
}

/* 성과 테이블 */
.performance-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.performance-table th,
.performance-table td {
    padding: var(--sp-3);
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.performance-table th {
    background: var(--gray-50);
    font-weight: 600;
    color: var(--text-subtle);
    font-size: 0.75rem;
    text-transform: uppercase;
}

.performance-table tbody tr:hover {
    background: var(--gray-50);
}

/* 순위 뱃지 */
.rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-weight: 700;
    font-size: 0.75rem;
}

.rank-badge.rank-1 {
    background: linear-gradient(135deg, #FFD700, #FFA500);
    color: #fff;
}

.rank-badge.rank-2 {
    background: linear-gradient(135deg, #C0C0C0, #A9A9A9);
    color: #fff;
}

.rank-badge.rank-3 {
    background: linear-gradient(135deg, #CD7F32, #B8860B);
    color: #fff;
}

.rank-badge.rank-other {
    background: var(--gray-100);
    color: var(--text-subtle);
}

/* 전환율 표시 */
.conversion-rate {
    display: inline-block;
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.8125rem;
}

.conversion-rate.rate-high {
    background: var(--success-bg);
    color: var(--success);
}

.conversion-rate.rate-medium {
    background: var(--warning-bg);
    color: var(--warning);
}

.conversion-rate.rate-low {
    background: var(--gray-100);
    color: var(--text-subtle);
}

/* 업무량 뱃지 */
.workload-badge {
    display: inline-block;
    padding: var(--sp-1) var(--sp-2);
    border-radius: var(--radius-sm);
    font-weight: 500;
    font-size: 0.8125rem;
}

.workload-badge.workload-high {
    background: var(--danger-bg);
    color: var(--danger);
}

.workload-badge.workload-medium {
    background: var(--warning-bg);
    color: var(--warning);
}

.workload-badge.workload-low {
    background: var(--success-bg);
    color: var(--success);
}

/* 전문 분야 태그 */
.specialty-tag {
    display: inline-block;
    padding: 2px 6px;
    background: var(--primary-bg);
    color: var(--primary);
    border-radius: var(--radius-sm);
    font-size: 0.6875rem;
    margin-right: 2px;
}

/* 대시보드 통계 그리드 */
.dashboard-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--sp-4);
    margin-bottom: var(--sp-6);
}

.dashboard-stats-grid .stat-card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-4);
    text-align: center;
}

.dashboard-stats-grid .stat-card .material-icons {
    font-size: 1.75rem;
    color: var(--primary);
    margin-bottom: var(--sp-2);
}

.dashboard-stats-grid .stat-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}

.dashboard-stats-grid .stat-label {
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-top: var(--sp-1);
}

/* 대시보드 섹션 */
.dashboard-section {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: var(--sp-5);
    margin-bottom: var(--sp-4);
}

.dashboard-section h4 {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 var(--sp-4) 0;
    color: var(--text);
}

.dashboard-section h4 .material-icons {
    font-size: 1.125rem;
    color: var(--primary);
}

/* 전환율 차트 */
.conversion-chart {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2);
}

.chart-bar-row {
    display: flex;
    align-items: center;
    gap: var(--sp-3);
}

.chart-rank {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gray-100);
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--text-subtle);
    flex-shrink: 0;
}

.chart-name {
    width: 80px;
    font-size: 0.875rem;
    font-weight: 500;
    flex-shrink: 0;
}

.chart-bar-wrapper {
    flex: 1;
    display: flex;
    align-items: center;
    gap: var(--sp-2);
}

.chart-bar {
    height: 20px;
    border-radius: var(--radius-sm);
    transition: width 0.5s ease;
}

.chart-value {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
}

/* 업종별 그리드 */
.specialty-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: var(--sp-3);
}

.specialty-card {
    background: var(--gray-50);
    border-radius: var(--radius-md);
    padding: var(--sp-3);
    text-align: center;
}

.specialty-keyword {
    font-weight: 600;
    color: var(--text);
    margin-bottom: var(--sp-1);
}

.specialty-rate {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--primary);
}

.specialty-range {
    font-size: 0.6875rem;
    color: var(--text-muted);
    margin: var(--sp-1) 0;
}

.specialty-staff {
    font-size: 0.75rem;
    color: var(--text-subtle);
}

/* 알고리즘 뱃지 */
.algo-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: var(--radius-sm);
    font-size: 0.6875rem;
    font-weight: 500;
}

.algo-badge.algo-round_robin {
    background: rgba(76, 175, 80, 0.15);
    color: #4CAF50;
}

.algo-badge.algo-performance {
    background: rgba(33, 150, 243, 0.15);
    color: #2196F3;
}

.algo-badge.algo-workload {
    background: rgba(255, 152, 0, 0.15);
    color: #FF9800;
}

.algo-badge.algo-specialty {
    background: rgba(156, 39, 176, 0.15);
    color: #9C27B0;
}

/* 배분 이력 테이블 */
.distributions-table {
    width: 100%;
    font-size: 0.8125rem;
}

.distributions-table th,
.distributions-table td {
    padding: var(--sp-2) var(--sp-3);
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.distributions-table th {
    font-weight: 600;
    color: var(--text-subtle);
    font-size: 0.75rem;
    background: var(--gray-50);
}

/* 스피닝 아이콘 */
.spin {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 배분 결과 모달 */
#distribution-result-modal .result-summary {
    background: var(--success-bg);
    border: 1px solid var(--success);
    border-radius: var(--radius-md);
    padding: var(--sp-4);
    margin-bottom: var(--sp-4);
}

#distribution-result-modal .error-list {
    background: var(--warning-bg);
    border-radius: var(--radius-md);
    padding: var(--sp-3) var(--sp-4);
    list-style-position: inside;
}

#distribution-result-modal .error-list li {
    padding: var(--sp-1) 0;
    color: var(--warning);
}

/* 반응형 */
@media (max-width: 768px) {
    .dashboard-stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .settings-actions {
        flex-direction: column;
    }

    .simulation-controls {
        flex-direction: column;
        align-items: stretch;
    }

    .simulation-controls .form-group {
        max-width: none;
    }

    .staff-checkbox-grid {
        grid-template-columns: 1fr;
    }

    .sim-staff-name,
    .chart-name {
        width: 70px;
        font-size: 0.75rem;
    }

    .specialty-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ═══ 온라인 인디케이터 ═══ */
.online-indicator {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    margin: 8px 10px;
    border-radius: 8px;
    background: rgba(74, 222, 128, 0.08);
    cursor: pointer;
    font-size: 12px;
    color: var(--text-secondary, #9ca3af);
    transition: background 0.2s;
}
.online-indicator:hover {
    background: rgba(74, 222, 128, 0.15);
}
.online-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #4ade80;
    flex-shrink: 0;
}
.online-indicator.disconnected .online-dot {
    background: #ef4444;
}

/* 별점 드롭다운 */
.star-rating-select {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 2px 20px 2px 6px;
    font-size: 13px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%239ca3af'/%3E%3C/svg%3E") no-repeat right 6px center;
    cursor: pointer;
    color: #f59e0b;
    flex-shrink: 0;
    line-height: 1.4;
}
.star-rating-select:hover {
    border-color: #f59e0b;
}
.star-rating-select:focus {
    outline: none;
    border-color: #f59e0b;
    box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.15);
}
.star-rating-display {
    color: #f59e0b;
    font-size: 13px;
    flex-shrink: 0;
}


/* === branch-panels.css ===  */
:root {
    --bp-primary: #f97316;
    --bp-primary-dark: #ea580c;
    --bp-primary-light: #fed7aa;
    --bp-accent: #0ea5e9;
    --bp-accent-dark: #0284c7;

    --bp-success: #22c55e;
    --bp-warning: #eab308;
    --bp-error: #ef4444;
    --bp-info: #3b82f6;

    --bp-bg: #f8fafc;
    --bp-bg-card: #ffffff;
    --bp-bg-hover: #f1f5f9;

    --bp-text: #1e293b;
    --bp-text-muted: #64748b;
    --bp-text-light: #94a3b8;

    --bp-border: #e2e8f0;
    --bp-border-focus: var(--bp-primary);

    --bp-shadow: 0 1px 3px rgba(0,0,0,0.1);
    --bp-shadow-md: 0 4px 6px -1px rgba(0,0,0,0.1);
    --bp-shadow-lg: 0 10px 15px -3px rgba(0,0,0,0.1);

    --bp-radius: 8px;
    --bp-radius-sm: 4px;
    --bp-radius-lg: 12px;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans KR', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: var(--bp-text);
    background: var(--bp-bg);
}

/* 로그인 화면 */
.login-container {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
    padding: 1rem;
}

.login-card {
    width: 100%;
    max-width: 400px;
    background: var(--bp-bg-card);
    border-radius: var(--bp-radius-lg);
    box-shadow: var(--bp-shadow-lg);
    padding: 2rem;
}

.login-header {
    text-align: center;
    margin-bottom: 2rem;
}

.login-logo {
    height: 48px;
    margin-bottom: 1rem;
}

.login-header h1 {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--bp-text);
    margin-bottom: 0.5rem;
}

.login-subtitle {
    color: var(--bp-primary);
    font-weight: 600;
    font-size: 0.875rem;
}

.login-footer {
    text-align: center;
    margin-top: 2rem;
    font-size: 0.75rem;
    color: var(--bp-text-light);
}

/* 대시보드 레이아웃 */
.dashboard {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* 헤더 - 수정됨 */
.dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
    height: 64px;
    background: var(--bp-bg-card);
    border-bottom: 1px solid var(--bp-border);
    box-shadow: var(--bp-shadow);
    position: sticky;
    top: 0;
    z-index: 100;
}

.header-left {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.header-logo {
    height: 32px;
}

.header-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--bp-primary);
    padding: 0.25rem 0.75rem;
    background: var(--bp-primary-light);
    border-radius: var(--bp-radius-sm);
}

.header-nav {
    display: flex;
    gap: 0.25rem;
}

.nav-tab {
    padding: 0.5rem 1rem;
    border: none;
    background: transparent;
    color: var(--bp-text-muted);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    border-radius: var(--bp-radius);
    transition: all 0.2s;
}

.nav-tab:hover {
    background: var(--bp-bg-hover);
    color: var(--bp-text);
}

.nav-tab.active {
    background: var(--bp-primary-light);
    color: var(--bp-primary-dark);
}

.header-right {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.user-info {
    text-align: right;
}

.user-info span:first-child {
    display: block;
    font-weight: 600;
    color: var(--bp-text);
}

.user-role {
    font-size: 0.75rem;
    color: var(--bp-text-muted);
}

/* 메인 컨텐츠 */
.dashboard-main {
    flex: 1;
    padding: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

/* 탭 컨텐츠 */
.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
}

/* 컨텐츠 그리드 */
.content-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

@media (max-width: 1024px) {
    .content-grid {
        grid-template-columns: 1fr;
    }
}

/* 카드 */
.card {
    background: var(--bp-bg-card);
    border-radius: var(--bp-radius-lg);
    box-shadow: var(--bp-shadow);
    overflow: hidden;
}

.card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--bp-border);
}

.card-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--bp-text);
}

.card-body {
    padding: 1.5rem;
}

.card-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

/* 폼 요소 */
.form-group {
    margin-bottom: 1rem;
}

.form-label {
    display: block;
    margin-bottom: 0.375rem;
    font-weight: 500;
    color: var(--bp-text);
    font-size: 0.875rem;
}

.form-label .required {
    color: var(--error);
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: 0.625rem 0.875rem;
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius);
    font-size: 0.875rem;
    color: var(--bp-text);
    background: var(--bp-bg-card);
    transition: border-color 0.2s, box-shadow 0.2s;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--border-focus);
    box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.1);
}

.form-input::placeholder {
    color: var(--bp-text-light);
}

.form-textarea {
    resize: vertical;
    min-height: 80px;
}

.form-hint {
    font-size: 0.75rem;
    color: var(--bp-text-muted);
    margin-top: 0.25rem;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 640px) {
    .form-row {
        grid-template-columns: 1fr;
    }
}

.form-actions {
    display: flex;
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--bp-border);
}

/* 버튼 */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    border: none;
    border-radius: var(--bp-radius);
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-primary {
    background: var(--bp-primary);
    color: white;
}

.btn-primary:hover:not(:disabled) {
    background: var(--bp-primary-dark);
}

.btn-accent {
    background: var(--bp-accent);
    color: white;
}

.btn-accent:hover:not(:disabled) {
    background: var(--bp-accent-dark);
}

.btn-outline {
    background: transparent;
    border: 1px solid var(--bp-border);
    color: var(--bp-text);
}

.btn-outline:hover:not(:disabled) {
    background: var(--bp-bg-hover);
    border-color: var(--bp-text-muted);
}

.btn-block {
    width: 100%;
}

.btn-sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
}

.btn-xs {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
}

/* 알림 */
.alert {
    padding: 0.875rem 1rem;
    border-radius: var(--bp-radius);
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.alert-warning {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}

.alert-error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.alert-success {
    background: #dcfce7;
    color: #166534;
    border: 1px solid #86efac;
}

/* 검색 */
.search-row {
    display: flex;
    gap: 0.5rem;
}

.search-row .form-input {
    flex: 1;
}

.search-results {
    margin-top: 1rem;
    min-height: 100px;
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius);
    padding: 1rem;
    background: var(--bp-bg);
}

.search-status {
    text-align: center;
    color: var(--bp-text-muted);
    padding: 1rem;
}

.search-result-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.search-result-item {
    padding: 0.75rem;
    border-bottom: 1px solid var(--bp-border);
}

.search-result-item:last-child {
    border-bottom: none;
}

/* 테이블 */
.data-table {
    width: 100%;
    border-collapse: collapse;
}

.data-table th,
.data-table td {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid var(--bp-border);
}

.data-table th {
    font-weight: 600;
    color: var(--bp-text-muted);
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    background: var(--bp-bg);
}

.data-table tbody tr:hover {
    background: var(--bp-bg-hover);
}

/* 상태 배지 */
.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.status-pending {
    background: #fef3c7;
    color: #92400e;
}

.status-confirmed {
    background: #dcfce7;
    color: #166534;
}

.status-rejected {
    background: #fee2e2;
    color: #991b1b;
}

/* 모달 */
.modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
}

.modal-content {
    position: relative;
    width: 100%;
    max-width: 500px;
    max-height: 90vh;
    background: var(--bp-bg-card);
    border-radius: var(--bp-radius-lg);
    box-shadow: var(--bp-shadow-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.modal-lg {
    max-width: 700px;
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--bp-border);
}

.modal-header h3 {
    font-size: 1.125rem;
    font-weight: 600;
}

.modal-close {
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    font-size: 1.5rem;
    color: var(--bp-text-muted);
    cursor: pointer;
    border-radius: var(--bp-radius);
}

.modal-close:hover {
    background: var(--bp-bg-hover);
    color: var(--bp-text);
}

.modal-body {
    flex: 1;
    padding: 1.5rem;
    overflow-y: auto;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--bp-border);
    background: var(--bp-bg);
}

/* 상세 정보 그리드 */
.detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

.detail-section {
    background: var(--bp-bg);
    padding: 1rem;
    border-radius: var(--bp-radius);
}

.detail-section.full-width {
    grid-column: 1 / -1;
}

.detail-section h4 {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--bp-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.025em;
    margin-bottom: 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--bp-border);
}

.detail-list {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.375rem 1rem;
}

.detail-list dt {
    font-weight: 500;
    color: var(--bp-text-muted);
    font-size: 0.8125rem;
}

.detail-list dd {
    color: var(--bp-text);
    font-size: 0.875rem;
    word-break: break-all;
}

.detail-list dd a {
    color: var(--bp-accent);
    text-decoration: none;
}

.detail-list dd a:hover {
    text-decoration: underline;
}

/* 토스트 */
.toast {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    padding: 0.875rem 1.5rem;
    background: var(--bp-text);
    color: white;
    border-radius: var(--bp-radius);
    box-shadow: var(--bp-shadow-lg);
    z-index: 2000;
    font-size: 0.875rem;
    animation: toast-in 0.3s ease;
}

.toast.success {
    background: var(--bp-success);
}

.toast.error {
    background: var(--error);
}

.toast.info {
    background: var(--info);
}

@keyframes toast-in {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(1rem);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

/* 유틸리티 */
.hidden {
    display: none !important;
}

.text-center {
    text-align: center;
}

.text-error {
    color: var(--error);
}

.text-muted {
    color: var(--bp-text-muted);
}

.mb-md {
    margin-bottom: 1rem;
}

/* 반응형 */
@media (max-width: 768px) {
    .dashboard-header {
        flex-wrap: wrap;
        height: auto;
        padding: 1rem;
        gap: 1rem;
    }
    
    .header-nav {
        order: 3;
        width: 100%;
        overflow-x: auto;
        padding-bottom: 0.5rem;
    }
    
    .nav-tab {
        white-space: nowrap;
    }
    
    .detail-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .dashboard-main {
        padding: 1rem;
    }

    .card-body {
        padding: 1rem;
    }

    .data-table th,
    .data-table td {
        padding: 0.5rem;
        font-size: 0.8125rem;
    }
}


/* ================================================================ */
/* ===== BRANCH MONITORING ENHANCEMENTS                       ===== */
/* ================================================================ */

/* Branch Card View */
.branch-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.branch-summary-card {
    background: var(--bp-bg-card);
    border-radius: var(--bp-radius-lg);
    box-shadow: var(--bp-shadow);
    padding: 1.25rem;
    transition: box-shadow 0.2s, transform 0.2s;
    border: 1px solid var(--bp-border);
}

.branch-summary-card:hover {
    box-shadow: var(--bp-shadow-md);
    transform: translateY(-2px);
}

.branch-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--bp-border);
}

.branch-card-name {
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--bp-text);
}

.branch-card-badge {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bp-text-muted);
    background: var(--bp-bg-hover);
    padding: 0.25rem 0.625rem;
    border-radius: 9999px;
}

.branch-card-metrics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.branch-metric {
    text-align: center;
    padding: 0.5rem;
    background: var(--bp-bg);
    border-radius: var(--bp-radius);
}

.branch-metric-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--bp-text);
    font-variant-numeric: tabular-nums;
}

.branch-metric-label {
    font-size: 0.6875rem;
    color: var(--bp-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Team Performance Comparison Bar Chart */
.team-perf-chart {
    margin-top: 1rem;
}

.team-perf-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.team-perf-row + .team-perf-row {
    border-top: 1px solid var(--bp-border);
}

.team-perf-name {
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--bp-text);
    min-width: 80px;
    flex-shrink: 0;
}

.team-perf-bar-track {
    flex: 1;
    height: 20px;
    background: var(--bp-bg);
    border-radius: var(--bp-radius-sm);
    overflow: hidden;
}

.team-perf-bar-fill {
    height: 100%;
    border-radius: var(--bp-radius-sm);
    background: linear-gradient(90deg, var(--bp-primary) 0%, var(--bp-primary-light) 100%);
    transition: width 0.5s ease;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 0.375rem;
}

.team-perf-bar-text {
    font-size: 0.625rem;
    font-weight: 600;
    color: white;
    white-space: nowrap;
}

.team-perf-value {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--bp-text);
    min-width: 36px;
    text-align: right;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

/* Real-time Refresh Display */
.refresh-controls {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.refresh-time-display {
    font-size: 0.75rem;
    color: var(--bp-text-muted);
    font-weight: 500;
}

.refresh-time-display .time-value {
    font-weight: 600;
    color: var(--bp-text);
}

.auto-refresh-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: var(--bp-text-muted);
    cursor: pointer;
}

.auto-refresh-toggle input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--bp-primary);
}

.refresh-btn {
    padding: 0.375rem 0.75rem;
    background: transparent;
    border: 1px solid var(--bp-border);
    border-radius: var(--bp-radius);
    font-size: 0.75rem;
    color: var(--bp-text-muted);
    cursor: pointer;
    transition: all 0.2s;
}

.refresh-btn:hover {
    background: var(--bp-bg-hover);
    border-color: var(--bp-primary);
    color: var(--bp-primary);
}

.refresh-btn.refreshing {
    opacity: 0.6;
    pointer-events: none;
}

/* Refresh Spinner */
@keyframes refresh-spin {
    to { transform: rotate(360deg); }
}

.refresh-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--bp-border);
    border-top-color: var(--bp-primary);
    border-radius: 50%;
    animation: refresh-spin 0.7s linear infinite;
}

@media (max-width: 640px) {
    .branch-card-grid {
        grid-template-columns: 1fr;
    }

    .branch-card-metrics {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }
}

/* === map.css ===  */
/**
 * map.css - 지도 기반 가망 관리 스타일
 */

/* ==================== 지도 탭 레이아웃 ==================== */
.map-view {
    display: flex;
    height: calc(100vh - 120px);
    gap: 0;
    position: relative;
}

/* 지도 컨테이너 */
#map-container {
    flex: 1;
    position: relative;
    min-height: 400px;
    background: var(--bg-subtle, #f8fafc);
}

/* 사이드바 */
.map-sidebar {
    width: 320px;
    background: var(--bg, #fff);
    border-left: 1px solid var(--border, #e2e8f0);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* ==================== 지도 컨트롤 ==================== */
.map-controls {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 100;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.map-control-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #fff;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--text, #1e293b);
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    transition: all 0.2s;
}

.map-control-btn:hover {
    background: var(--bg-subtle, #f8fafc);
    border-color: var(--primary, #3b82f6);
}

.map-control-btn.active {
    background: var(--primary, #3b82f6);
    color: #fff;
    border-color: var(--primary, #3b82f6);
}

.map-control-btn svg {
    width: 16px;
    height: 16px;
}

/* ==================== 필터 바 ==================== */
.map-filter-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    background: var(--bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--border, #e2e8f0);
    flex-wrap: wrap;
}

.map-filter-btn {
    padding: 6px 12px;
    background: #fff;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 16px;
    font-size: 12px;
    font-weight: 500;
    color: var(--text-muted, #64748b);
    cursor: pointer;
    transition: all 0.2s;
}

.map-filter-btn:hover {
    border-color: var(--primary, #3b82f6);
    color: var(--primary, #3b82f6);
}

.map-filter-btn.active {
    background: var(--primary, #3b82f6);
    color: #fff;
    border-color: var(--primary, #3b82f6);
}

.map-filter-btn[data-status="call0"].active { background: #94a3b8; border-color: #94a3b8; }
.map-filter-btn[data-status="call1"].active { background: #3b82f6; border-color: #3b82f6; }
.map-filter-btn[data-status="call2"].active { background: #f59e0b; border-color: #f59e0b; }
.map-filter-btn[data-status="call3"].active { background: #ef4444; border-color: #ef4444; }
.map-filter-btn[data-status="meeting"].active { background: #22c55e; border-color: #22c55e; }
.map-filter-btn[data-status="payment"].active { background: #8b5cf6; border-color: #8b5cf6; }

.map-filter-select {
    padding: 6px 28px 6px 12px;
    border: 1px solid var(--border, #e2e8f0);
    border-radius: 8px;
    font-size: 13px;
    background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e") right 8px center/16px no-repeat;
    cursor: pointer;
}

/* ==================== 통계 바 ==================== */
#map-stats {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    background: #fff;
    border-bottom: 1px solid var(--border, #e2e8f0);
}

.map-stat-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.map-stat-label {
    font-size: 12px;
    color: var(--text-muted, #64748b);
}

.map-stat-value {
    font-size: 16px;
    font-weight: 700;
    color: var(--text, #1e293b);
}

.map-stat-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

/* ==================== 가망 목록 ==================== */
#map-leads-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
}

.map-list-empty {
    padding: 40px 20px;
    text-align: center;
    color: var(--text-muted, #64748b);
    font-size: 14px;
}

.map-list-group {
    margin-bottom: 8px;
}

.map-list-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    font-size: 12px;
    font-weight: 600;
}

.map-list-group-title {
    color: var(--text, #1e293b);
}

.map-list-group-count {
    color: var(--text-muted, #64748b);
}

.map-lead-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    cursor: pointer;
    transition: background 0.15s;
}

.map-lead-item:hover {
    background: var(--bg-subtle, #f8fafc);
}

.map-lead-name {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    color: var(--text, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.map-lead-phone {
    font-size: 12px;
    color: var(--text-muted, #64748b);
}

.map-lead-distance {
    font-size: 11px;
    color: var(--primary, #3b82f6);
    font-weight: 600;
}

/* ==================== 인포윈도우 ==================== */
.map-infowindow {
    min-width: 280px;
    max-width: 320px;
    padding: 0;
    font-family: inherit;
}

.map-info-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: var(--bg-subtle, #f8fafc);
    border-bottom: 1px solid var(--border, #e2e8f0);
}

.map-info-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--text, #1e293b);
}

.map-info-status {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    color: #fff;
}

.map-info-status.status-call0 { background: #94a3b8; }
.map-info-status.status-call1 { background: #3b82f6; }
.map-info-status.status-call2 { background: #f59e0b; }
.map-info-status.status-call3 { background: #ef4444; }
.map-info-status.status-meeting { background: #22c55e; }
.map-info-status.status-payment { background: #8b5cf6; }

.map-info-body {
    padding: 12px 16px;
}

.map-info-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--text, #1e293b);
}

.map-info-row:last-child {
    margin-bottom: 0;
}

.map-info-icon {
    flex-shrink: 0;
    font-size: 14px;
}

.map-info-phone {
    color: var(--primary, #3b82f6);
    text-decoration: none;
    font-weight: 500;
}

.map-info-phone:hover {
    text-decoration: underline;
}

.map-info-address {
    color: var(--text-muted, #64748b);
    line-height: 1.4;
}

.map-info-notes {
    color: var(--text-muted, #64748b);
    font-size: 12px;
    max-height: 40px;
    overflow: hidden;
}

.map-info-meta {
    display: flex;
    gap: 16px;
    font-size: 11px;
    color: var(--text-muted, #64748b);
    padding-top: 8px;
    border-top: 1px solid var(--border, #e2e8f0);
}

.map-info-footer {
    display: flex;
    gap: 8px;
    padding: 12px 16px;
    background: var(--bg-subtle, #f8fafc);
    border-top: 1px solid var(--border, #e2e8f0);
}

.map-info-footer .btn {
    flex: 1;
}

/* ==================== 마커 스타일 ==================== */
.map-marker {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: transform 0.2s;
}

.map-marker:hover {
    transform: rotate(-45deg) scale(1.1);
}

.map-marker-icon {
    transform: rotate(45deg);
    font-size: 12px;
    font-weight: 700;
    color: #fff;
}

/* ==================== 로딩 ==================== */
#map-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.8);
    z-index: 200;
}

#map-loader .spinner {
    width: 40px;
    height: 40px;
    border: 3px solid var(--border, #e2e8f0);
    border-top-color: var(--primary, #3b82f6);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ==================== 설정 화면 ==================== */
.map-setup {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 40px;
    text-align: center;
}

.map-setup-icon {
    color: var(--text-muted, #64748b);
    margin-bottom: 24px;
}

.map-setup-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--text, #1e293b);
    margin-bottom: 12px;
}

.map-setup-desc {
    font-size: 14px;
    color: var(--text-muted, #64748b);
    line-height: 1.6;
    margin-bottom: 24px;
}

.map-setup-desc a {
    color: var(--primary, #3b82f6);
    text-decoration: none;
}

.map-setup-desc a:hover {
    text-decoration: underline;
}

.map-setup-form {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.map-setup-form .form-input {
    min-width: 300px;
}

.map-setup-note {
    font-size: 12px;
    color: var(--text-muted, #94a3b8);
    line-height: 1.6;
}

/* ==================== 에러 화면 ==================== */
.map-error {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 40px;
    text-align: center;
    color: var(--text-muted, #64748b);
}

.map-error svg {
    margin-bottom: 16px;
    color: var(--text-muted, #94a3b8);
}

.map-error p {
    font-size: 14px;
    margin-bottom: 16px;
}

/* ==================== 반응형 ==================== */
@media (max-width: 768px) {
    .map-view {
        flex-direction: column-reverse;
        height: auto;
    }

    .map-sidebar {
        width: 100%;
        height: 300px;
        border-left: none;
        border-top: 1px solid var(--border, #e2e8f0);
    }

    #map-container {
        height: 50vh;
        min-height: 300px;
    }

    .map-controls {
        top: 8px;
        left: 8px;
        right: 8px;
    }

    .map-control-btn {
        padding: 6px 10px;
        font-size: 12px;
    }

    .map-control-btn span {
        display: none;
    }

    .map-filter-bar {
        padding: 8px 12px;
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .map-filter-btn {
        flex-shrink: 0;
    }

    .map-infowindow {
        min-width: 240px;
        max-width: 280px;
    }

    .map-setup-form {
        flex-direction: column;
    }

    .map-setup-form .form-input {
        min-width: auto;
        width: 100%;
    }
}

/* ==================== 풀스크린 모드 ==================== */
.map-fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    height: 100vh !important;
}

.map-fullscreen .map-sidebar {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
}

.map-fullscreen #map-container {
    height: 100vh !important;
}

/* ==================== 클러스터 커스텀 ==================== */
.map-cluster {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.map-cluster-small {
    width: 40px;
    height: 40px;
    font-size: 14px;
    background: rgba(59, 130, 246, 0.9);
}

.map-cluster-medium {
    width: 50px;
    height: 50px;
    font-size: 15px;
    background: rgba(245, 158, 11, 0.9);
}

.map-cluster-large {
    width: 60px;
    height: 60px;
    font-size: 16px;
    background: rgba(239, 68, 68, 0.9);
}

/* ==================== 지역별 통계 카드 ==================== */
.map-region-stats {
    padding: 16px;
    background: #fff;
    border-bottom: 1px solid var(--border, #e2e8f0);
}

.map-region-stats-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text, #1e293b);
    margin-bottom: 12px;
}

.map-region-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.map-region-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: var(--bg-subtle, #f8fafc);
    border-radius: 6px;
    font-size: 12px;
}

.map-region-name {
    color: var(--text, #1e293b);
    font-weight: 500;
}

.map-region-count {
    color: var(--primary, #3b82f6);
    font-weight: 700;
}

/* ==================== 드로잉 모드 ==================== */
.map-drawing-active #map-container {
    cursor: crosshair;
}

.map-drawing-hint {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    border-radius: 20px;
    font-size: 13px;
    z-index: 100;
}

/* === realtime.css ===  */
/**
 * 실시간 통신 (Realtime / SSE) 스타일
 * CRM 실시간 알림 및 협업 기능 스타일시트
 */

/* 연결 상태 표시 */
.connection-status {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1, 4px);
    padding: var(--sp-1, 4px) var(--sp-2, 8px);
    border-radius: var(--radius-full, 9999px);
    font-size: var(--text-xs, 12px);
    font-weight: 500;
    transition: all 0.3s ease;
}

.connection-status::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 50%;
    transition: background 0.3s ease;
}

.connection-status.connected {
    background: var(--success-bg, rgba(22, 163, 74, 0.1));
    color: var(--success, #16a34a);
}

.connection-status.connected::before {
    background: var(--success, #16a34a);
    box-shadow: 0 0 6px var(--success, #16a34a);
    animation: connection-pulse 2s ease-in-out infinite;
}

.connection-status.connecting {
    background: var(--warning-bg, rgba(217, 119, 6, 0.1));
    color: var(--warning, #d97706);
}

.connection-status.connecting::before {
    background: var(--warning, #d97706);
    animation: connection-blink 0.8s ease-in-out infinite;
}

.connection-status.error,
.connection-status.disconnected {
    background: var(--danger-bg, rgba(220, 38, 38, 0.1));
    color: var(--danger, #dc2626);
}

.connection-status.error::before,
.connection-status.disconnected::before {
    background: var(--danger, #dc2626);
}

@keyframes connection-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.2); }
}

@keyframes connection-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* 온라인 사용자 목록 */
.online-users-panel {
    background: var(--card, #fff);
    border-radius: var(--radius-lg, 12px);
    padding: var(--sp-3, 12px);
    box-shadow: var(--shadow-sm, 0 1px 2px rgba(0,0,0,0.05));
}

.online-users-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--sp-3, 12px);
    padding-bottom: var(--sp-2, 8px);
    border-bottom: 1px solid var(--border-light, #e5e7eb);
}

.online-users-title {
    font-size: var(--text-sm, 14px);
    font-weight: 600;
    color: var(--text, #1e293b);
}

.online-users-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: var(--success, #16a34a);
    color: white;
    border-radius: var(--radius-full, 9999px);
    font-size: var(--text-xs, 12px);
    font-weight: 600;
}

#online-users-list {
    display: flex;
    flex-direction: column;
    gap: var(--sp-1, 4px);
    max-height: 200px;
    overflow-y: auto;
}

.online-user-item {
    display: flex;
    align-items: center;
    gap: var(--sp-2, 8px);
    padding: var(--sp-2, 8px);
    border-radius: var(--radius-md, 8px);
    transition: background 0.2s ease;
}

.online-user-item:hover {
    background: var(--bg-subtle, #f8fafc);
}

.online-user-status {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.online-user-item.status-online .online-user-status {
    background: var(--success, #16a34a);
    box-shadow: 0 0 4px var(--success, #16a34a);
}

.online-user-item.status-away .online-user-status {
    background: var(--warning, #d97706);
}

.online-user-item.status-busy .online-user-status {
    background: var(--danger, #dc2626);
}

.online-user-item.status-offline .online-user-status {
    background: var(--gray-400, #94a3b8);
}

.online-user-name {
    font-size: var(--text-sm, 14px);
    color: var(--text, #1e293b);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 타이핑 표시 */
.typing-indicator {
    display: none;
    align-items: center;
    gap: var(--sp-2, 8px);
    padding: var(--sp-2, 8px) var(--sp-3, 12px);
    background: var(--bg-subtle, #f8fafc);
    border-radius: var(--radius-lg, 12px);
    font-size: var(--text-xs, 12px);
    color: var(--text-muted, #6b7280);
    animation: typing-fade-in 0.3s ease;
}

.typing-indicator[style*="display: block"] {
    display: flex;
}

.typing-dots {
    display: flex;
    gap: 3px;
}

.typing-dots span {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--text-muted, #6b7280);
    animation: typing-bounce 1.4s infinite ease-in-out both;
}

.typing-dots span:nth-child(1) { animation-delay: -0.32s; }
.typing-dots span:nth-child(2) { animation-delay: -0.16s; }
.typing-dots span:nth-child(3) { animation-delay: 0s; }

@keyframes typing-bounce {
    0%, 80%, 100% { transform: scale(0.8); opacity: 0.5; }
    40% { transform: scale(1.2); opacity: 1; }
}

@keyframes typing-fade-in {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 실시간 알림 배지 */
.realtime-badge {
    position: relative;
}

.realtime-badge::after {
    content: '';
    position: absolute;
    top: -2px;
    right: -2px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--danger, #dc2626);
    border: 2px solid var(--card, #fff);
    animation: badge-pulse 2s infinite;
}

.realtime-badge.has-updates::after {
    display: block;
}

.realtime-badge:not(.has-updates)::after {
    display: none;
}

@keyframes badge-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

/* 실시간 활동 피드 */
.activity-feed {
    display: flex;
    flex-direction: column;
    gap: var(--sp-2, 8px);
}

.activity-feed-item {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3, 12px);
    padding: var(--sp-3, 12px);
    background: var(--card, #fff);
    border-radius: var(--radius-md, 8px);
    border-left: 3px solid var(--primary, #627d98);
    animation: feed-slide-in 0.3s ease;
}

.activity-feed-item.new {
    background: var(--primary-bg, rgba(98, 125, 152, 0.05));
}

.activity-feed-item.type-lead_assigned {
    border-left-color: var(--success, #16a34a);
}

.activity-feed-item.type-approval_request {
    border-left-color: var(--warning, #d97706);
}

.activity-feed-item.type-approval_processed {
    border-left-color: var(--info, #2563eb);
}

.activity-feed-item.type-call_reservation {
    border-left-color: var(--accent-500, #06b6d4);
}

@keyframes feed-slide-in {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.activity-feed-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-subtle, #f8fafc);
    border-radius: var(--radius-full, 9999px);
    flex-shrink: 0;
}

.activity-feed-content {
    flex: 1;
    min-width: 0;
}

.activity-feed-title {
    font-size: var(--text-sm, 14px);
    font-weight: 500;
    color: var(--text, #1e293b);
    margin-bottom: var(--sp-1, 4px);
}

.activity-feed-desc {
    font-size: var(--text-xs, 12px);
    color: var(--text-muted, #6b7280);
}

.activity-feed-time {
    font-size: var(--text-xs, 12px);
    color: var(--text-muted, #6b7280);
    white-space: nowrap;
}

/* 실시간 카운터 */
.realtime-counter {
    display: inline-flex;
    align-items: center;
    gap: var(--sp-1, 4px);
    font-variant-numeric: tabular-nums;
}

.realtime-counter.updating {
    animation: counter-flash 0.3s ease;
}

@keyframes counter-flash {
    0% { color: var(--text, #1e293b); }
    50% { color: var(--success, #16a34a); transform: scale(1.1); }
    100% { color: var(--text, #1e293b); transform: scale(1); }
}

/* 실시간 업데이트 하이라이트 */
.realtime-highlight {
    animation: realtime-glow 2s ease-out;
}

@keyframes realtime-glow {
    0% {
        box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.4);
        background: rgba(34, 197, 94, 0.1);
    }
    100% {
        box-shadow: 0 0 0 0 transparent;
        background: transparent;
    }
}

/* 알림 패널 (헤더) */
.notification-panel {
    position: absolute;
    top: 100%;
    right: 0;
    width: 360px;
    max-height: 480px;
    background: var(--card, #fff);
    border-radius: var(--radius-lg, 12px);
    box-shadow: var(--shadow-xl, 0 20px 25px -5px rgba(0,0,0,0.1));
    z-index: 1000;
    overflow: hidden;
    display: none;
}

.notification-panel.show {
    display: block;
    animation: panel-slide-down 0.2s ease;
}

@keyframes panel-slide-down {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.notification-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--sp-3, 12px) var(--sp-4, 16px);
    border-bottom: 1px solid var(--border-light, #e5e7eb);
}

.notification-panel-title {
    font-size: var(--text-sm, 14px);
    font-weight: 600;
    color: var(--text, #1e293b);
}

.notification-panel-actions {
    display: flex;
    gap: var(--sp-2, 8px);
}

.notification-panel-body {
    max-height: 380px;
    overflow-y: auto;
}

.notification-item {
    display: flex;
    align-items: flex-start;
    gap: var(--sp-3, 12px);
    padding: var(--sp-3, 12px) var(--sp-4, 16px);
    border-bottom: 1px solid var(--border-light, #e5e7eb);
    cursor: pointer;
    transition: background 0.2s ease;
    position: relative;
}

.notification-item:hover {
    background: var(--bg-subtle, #f8fafc);
}

.notification-item.unread {
    background: var(--primary-bg, rgba(98, 125, 152, 0.05));
}

.notification-item.unread::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--primary, #627d98);
}

.notification-icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-subtle, #f8fafc);
    border-radius: var(--radius-full, 9999px);
    flex-shrink: 0;
    font-size: 16px;
}

.notification-content {
    flex: 1;
    min-width: 0;
}

.notification-title {
    font-size: var(--text-sm, 14px);
    font-weight: 500;
    color: var(--text, #1e293b);
    margin-bottom: var(--sp-1, 4px);
}

.notification-text {
    font-size: var(--text-xs, 12px);
    color: var(--text-muted, #6b7280);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.notification-time {
    font-size: 10px;
    color: var(--text-muted, #6b7280);
    margin-top: var(--sp-1, 4px);
}

.notification-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: var(--sp-8, 32px);
    color: var(--text-muted, #6b7280);
}

.notification-empty-icon {
    font-size: 48px;
    margin-bottom: var(--sp-3, 12px);
    opacity: 0.5;
}

/* 실시간 메모 동기화 표시 */
.memo-sync-status {
    display: flex;
    align-items: center;
    gap: var(--sp-1, 4px);
    font-size: var(--text-xs, 12px);
    color: var(--text-muted, #6b7280);
}

.memo-sync-status.syncing {
    color: var(--warning, #d97706);
}

.memo-sync-status.synced {
    color: var(--success, #16a34a);
}

.memo-sync-status.error {
    color: var(--danger, #dc2626);
}

.memo-sync-icon {
    width: 12px;
    height: 12px;
}

.memo-sync-status.syncing .memo-sync-icon {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* 콜라보레이션 커서 */
.collab-cursor {
    position: absolute;
    pointer-events: none;
    z-index: 100;
    transition: all 0.1s ease;
}

.collab-cursor-caret {
    width: 2px;
    height: 20px;
    background: var(--primary, #627d98);
}

.collab-cursor-label {
    position: absolute;
    top: -20px;
    left: 0;
    padding: 2px 6px;
    background: var(--primary, #627d98);
    color: white;
    font-size: 10px;
    border-radius: var(--radius-sm, 4px);
    white-space: nowrap;
}

/* 실시간 알림 버튼 */
.realtime-notification-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full, 9999px);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background 0.2s ease;
}

.realtime-notification-btn:hover {
    background: var(--bg-subtle, #f8fafc);
}

.realtime-notification-btn .notification-count {
    position: absolute;
    top: 2px;
    right: 2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--danger, #dc2626);
    color: white;
    border-radius: var(--radius-full, 9999px);
    font-size: 10px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
}

.realtime-notification-btn .notification-count:empty,
.realtime-notification-btn .notification-count[data-count="0"] {
    display: none;
}

/* 실시간 통신 모바일 대응 */
@media (max-width: 768px) {
    .notification-panel {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        max-height: 70vh;
        border-radius: var(--radius-xl, 16px) var(--radius-xl, 16px) 0 0;
    }

    .online-users-panel {
        display: none;
    }

    .connection-status .connection-text {
        display: none;
    }

    .connection-status {
        padding: var(--sp-1, 4px);
    }

    .activity-feed-item {
        padding: var(--sp-2, 8px);
    }

    .activity-feed-icon {
        width: 28px;
        height: 28px;
    }
}

/* 다크 모드 지원 */
@media (prefers-color-scheme: dark) {
    .connection-status.connected {
        background: rgba(34, 197, 94, 0.2);
    }

    .connection-status.connecting {
        background: rgba(217, 119, 6, 0.2);
    }

    .connection-status.error,
    .connection-status.disconnected {
        background: rgba(220, 38, 38, 0.2);
    }

    .online-users-panel,
    .notification-panel {
        background: var(--card, #1e293b);
        border: 1px solid var(--border, #334155);
    }

    .notification-item:hover,
    .online-user-item:hover {
        background: var(--bg-subtle, #0f172a);
    }
}

/* === scoring.css ===  */
/**
 * Scoring System Styles
 * 스마트 스코어링 시스템 스타일
 */

/* === Score Badge === */
.score-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    cursor: pointer;
}

.score-badge:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.score-badge--s {
    background: #fef2f2;
    color: #dc2626;
    border: 1px solid rgba(220, 38, 38, 0.2);
}

.score-badge--a {
    background: #fffbeb;
    color: #d97706;
    border: 1px solid rgba(217, 119, 6, 0.2);
}

.score-badge--b {
    background: #eff6ff;
    color: #2563eb;
    border: 1px solid rgba(37, 99, 235, 0.2);
}

.score-badge--c {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid rgba(107, 114, 128, 0.2);
}

/* Compact version */
.score-badge--compact {
    padding: 2px 6px;
    font-size: 11px;
}

/* === Score Stars === */
.score-stars {
    letter-spacing: -2px;
    font-size: 14px;
}

.score-stars--large {
    font-size: 18px;
}

/* === Score Bar === */
.score-bar-container {
    display: flex;
    align-items: center;
    gap: 8px;
}

.score-bar {
    flex: 1;
    height: 8px;
    background: #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

.score-bar--thin {
    height: 4px;
}

.score-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.score-bar-fill--s { background: #dc2626; }
.score-bar-fill--a { background: #d97706; }
.score-bar-fill--b { background: #2563eb; }
.score-bar-fill--c { background: #6b7280; }

.score-bar-label {
    font-size: 12px;
    font-weight: 600;
    min-width: 28px;
    text-align: right;
}

/* === Lead Score Badge (in lead card) === */
.lead-score-badge {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    cursor: pointer;
}

.lead-score-badge .score-badge {
    font-size: 10px;
    padding: 2px 6px;
}

/* High priority highlight */
.lead-card--high-priority {
    border-left: 3px solid #dc2626;
}

.lead-card--high-priority .lead-card-header {
    background: linear-gradient(90deg, rgba(254, 242, 242, 0.5), transparent);
}

/* === Score Detail Modal === */
.score-detail-modal {
    padding: 16px;
}

.score-detail-header {
    text-align: center;
    margin-bottom: 24px;
}

.score-detail-grade {
    font-size: 48px;
    font-weight: 700;
    line-height: 1;
}

.score-detail-stars {
    font-size: 24px;
    margin-top: 8px;
}

.score-detail-points {
    font-size: 14px;
    color: var(--text-muted);
    margin-top: 4px;
}

.score-breakdown-title {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}

.score-breakdown-item {
    margin-bottom: 12px;
}

.score-breakdown-item-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    font-size: 13px;
}

.score-breakdown-item-label {
    font-weight: 500;
    color: var(--text);
}

.score-breakdown-item-value {
    color: var(--text-muted);
}

.score-breakdown-bar {
    height: 8px;
    background: #e5e7eb;
    border-radius: 4px;
    overflow: hidden;
}

.score-breakdown-bar-fill {
    height: 100%;
    border-radius: 4px;
    transition: width 0.3s ease;
}

.score-breakdown-bar-fill--high { background: #10b981; }
.score-breakdown-bar-fill--medium { background: #f59e0b; }
.score-breakdown-bar-fill--low { background: #ef4444; }

.score-factors {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--border-color);
    font-size: 13px;
}

.score-factors-label {
    color: var(--text-muted);
}

.score-industry-rate {
    margin-top: 12px;
    padding: 8px 12px;
    background: var(--bg-subtle);
    border-radius: 6px;
    font-size: 13px;
}

/* === Score Widget (Dashboard) === */
.score-widget {
    padding: 16px;
    background: var(--card);
    border-radius: 12px;
    border: 1px solid var(--border-color);
}

.score-widget-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.score-widget-title {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
}

.score-widget-avg {
    font-size: 12px;
    color: var(--text-muted);
}

.score-distribution {
    display: flex;
    gap: 8px;
}

.score-dist-item {
    flex: 1;
    text-align: center;
    padding: 12px 8px;
    border-radius: 8px;
    transition: transform 0.15s ease;
}

.score-dist-item:hover {
    transform: translateY(-2px);
}

.score-dist-item--s { background: #fef2f2; }
.score-dist-item--a { background: #fffbeb; }
.score-dist-item--b { background: #eff6ff; }
.score-dist-item--c { background: #f3f4f6; }

.score-dist-count {
    font-size: 20px;
    font-weight: 700;
}

.score-dist-grade {
    font-size: 11px;
    font-weight: 600;
    margin-top: 2px;
}

.score-dist-percent {
    font-size: 10px;
    color: var(--text-muted);
    margin-top: 2px;
}

/* === Priority List === */
.priority-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.priority-list-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-bottom: 1px solid var(--border-color);
    transition: background 0.15s ease;
}

.priority-list-item:hover {
    background: var(--bg-subtle);
}

.priority-list-item:last-child {
    border-bottom: none;
}

.priority-list-rank {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-bg);
    color: var(--primary);
    border-radius: 50%;
    font-size: 12px;
    font-weight: 600;
}

.priority-list-rank--top {
    background: #fef2f2;
    color: #dc2626;
}

.priority-list-info {
    flex: 1;
    min-width: 0;
}

.priority-list-name {
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.priority-list-meta {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 2px;
}

/* === Sort Option Highlight === */
.filter-sort option[value="priority_score_desc"],
.filter-sort option[value="priority_score_asc"] {
    font-weight: 500;
}

/* === Animation === */
@keyframes scoreUpdate {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

.score-badge--updated {
    animation: scoreUpdate 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideIn {
    from { transform: translateY(-20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

/* === Responsive === */
@media (max-width: 768px) {
    .score-distribution {
        flex-wrap: wrap;
    }

    .score-dist-item {
        flex: 1 1 45%;
    }

    .score-factors {
        grid-template-columns: 1fr;
    }

    .lead-score-badge {
        order: -1;
        margin-left: 0;
        margin-right: 8px;
    }
}

/* === Dark Mode Support === */
@media (prefers-color-scheme: dark) {
    .score-badge--s {
        background: rgba(220, 38, 38, 0.15);
        border-color: rgba(220, 38, 38, 0.3);
    }

    .score-badge--a {
        background: rgba(217, 119, 6, 0.15);
        border-color: rgba(217, 119, 6, 0.3);
    }

    .score-badge--b {
        background: rgba(37, 99, 235, 0.15);
        border-color: rgba(37, 99, 235, 0.3);
    }

    .score-badge--c {
        background: rgba(107, 114, 128, 0.15);
        border-color: rgba(107, 114, 128, 0.3);
    }

    .score-bar {
        background: #374151;
    }

    .score-dist-item--s { background: rgba(220, 38, 38, 0.1); }
    .score-dist-item--a { background: rgba(217, 119, 6, 0.1); }
    .score-dist-item--b { background: rgba(37, 99, 235, 0.1); }
    .score-dist-item--c { background: rgba(107, 114, 128, 0.1); }
}

/* === Print === */
@media print {
    .score-badge {
        border: 1px solid currentColor !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}

/*** 플랫폼 CRM 스타일시트* Version:2.0.0*/:root{--primary-50:#f0f4f8;--primary-100:#d9e2ec;--primary-200:#bcccdc;--primary-300:#9fb3c8;--primary-400:#829ab1;--primary-500:#627d98;--primary-600:#486581;--primary-700:#334e68;--primary-800:#243b53;--primary-900:#102a43;--primary:#627d98;--primary-hover:#486581;--primary-light:#829ab1;--primary-bg:rgba(98,125,152,0.05);--primary-bg-strong:rgba(98,125,152,0.1);--primary-ring:rgba(98,125,152,0.15);--accent-50:#ecfeff;--accent-100:#cffafe;--accent-200:#a5f3fc;--accent-400:#22d3ee;--accent-500:#06b6d4;--accent-600:#0891b2;--success-50:#f0fdf4;--success-100:#dcfce7;--success-500:#22c55e;--success-600:#16a34a;--success:#16a34a;--success-hover:#15803d;--success-bg:rgba(22,163,74,0.08);--warning-50:#fffbeb;--warning-100:#fef3c7;--warning-500:#f59e0b;--warning-600:#d97706;--warning:#d97706;--warning-bg:rgba(217,119,6,0.08);--danger-50:#fef2f2;--danger-100:#fee2e2;--danger-500:#ef4444;--danger-600:#dc2626;--danger:#dc2626;--danger-hover:#b91c1c;--danger-bg:rgba(220,38,38,0.08);--info-50:#eff6ff;--info-100:#dbeafe;--info-500:#3b82f6;--info-600:#2563eb;--info:#2563eb;--info-bg:rgba(37,99,235,0.08);--slate-50:#f8fafc;--slate-100:#f1f5f9;--slate-200:#e2e8f0;--slate-300:#cbd5e1;--slate-400:#94a3b8;--slate-500:#64748b;--slate-600:#475569;--slate-700:#334155;--slate-800:#1e293b;--slate-900:#0f172a;--slate-950:#020617;--gray-50:var(--slate-50);--gray-100:var(--slate-100);--gray-200:var(--slate-200);--gray-300:var(--slate-300);--gray-400:var(--slate-400);--gray-500:var(--slate-500);--gray-600:var(--slate-600);--gray-700:var(--slate-700);--gray-800:var(--slate-800);--gray-900:var(--slate-900);--bg:#f8fafc;--bg-elevated:#ffffff;--bg-sunken:#f1f5f9;--card:#ffffff;--card-hover:#fafafa;--text:#1e293b;--text-secondary:#374151;--text-subtle:#6b7280;--text-muted:#9ca3af;--text-inverted:#ffffff;--border:#e2e8f0;--border-strong:#cbd5e1;--border-subtle:#f1f5f9;--surface-secondary:var(--card);--surface-tertiary:var(--bg-sunken);--border-color:var(--border);--border-light:var(--border);--text-primary:var(--text);--text-tertiary:var(--text-muted);--color-primary:var(--primary);--sp-px:1px;--sp-0:0;--sp-0-5:0.125rem;--sp-1:0.25rem;--sp-1-5:0.375rem;--sp-2:0.5rem;--sp-2-5:0.625rem;--sp-3:0.75rem;--sp-3-5:0.875rem;--sp-4:1rem;--sp-5:1.25rem;--sp-6:1.5rem;--sp-7:1.75rem;--sp-8:2rem;--sp-9:2.25rem;--sp-10:2.5rem;--sp-11:2.75rem;--sp-12:3rem;--sp-14:3.5rem;--sp-16:4rem;--sp-20:5rem;--sp-24:6rem;--font-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans KR','Apple SD Gothic Neo','Malgun Gothic',sans-serif;--font-mono:'JetBrains Mono','Fira Code',ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--font:var(--font-sans);--text-xs:0.75rem;--text-sm:0.8125rem;--text-base:0.875rem;--text-md:0.9375rem;--text-lg:1rem;--text-xl:1.125rem;--text-2xl:1.25rem;--text-3xl:1.5rem;--text-4xl:1.875rem;--text-5xl:2.25rem;--leading-none:1;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--leading-loose:2;--font-thin:100;--font-light:300;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--font-extrabold:800;--font-black:900;--tracking-tighter:-0.05em;--tracking-tight:-0.025em;--tracking-normal:0;--tracking-wide:0.025em;--tracking-wider:0.05em;--shadow-xs:0 1px 2px 0 rgba(0,0,0,0.03);--shadow-sm:0 1px 3px 0 rgba(0,0,0,0.05),0 1px 2px -1px rgba(0,0,0,0.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.05),0 2px 4px -2px rgba(0,0,0,0.03);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.06),0 4px 6px -4px rgba(0,0,0,0.04);--shadow-xl:0 20px 25px -5px rgba(0,0,0,0.08),0 8px 10px -6px rgba(0,0,0,0.04);--shadow-2xl:0 25px 50px -12px rgba(0,0,0,0.15);--shadow-inner:inset 0 2px 4px 0 rgba(0,0,0,0.03);--shadow-primary:0 2px 8px 0 rgba(98,125,152,0.15);--shadow-primary-lg:0 4px 16px 0 rgba(98,125,152,0.2);--shadow-card:0 2px 8px rgba(0,0,0,0.06),0 1px 3px rgba(0,0,0,0.04);--shadow-card-hover:0 4px 16px rgba(0,0,0,0.1),0 2px 6px rgba(0,0,0,0.06);--radius-none:0;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-2xl:16px;--radius-3xl:24px;--radius-full:9999px;--duration-instant:50ms;--duration-fast:100ms;--duration-normal:150ms;--duration-moderate:200ms;--duration-slow:300ms;--duration-slower:400ms;--duration-slowest:500ms;--ease-linear:linear;--ease-in:cubic-bezier(0.4,0,1,1);--ease-out:cubic-bezier(0,0,0.2,1);--ease-in-out:cubic-bezier(0.4,0,0.2,1);--ease-bounce:cubic-bezier(0.34,1.56,0.64,1);--ease-spring:cubic-bezier(0.175,0.885,0.32,1.275);--ease-fast:var(--duration-fast) var(--ease-out);--ease-normal:var(--duration-normal) var(--ease-out);--ease-slow:var(--duration-slow) var(--ease-out);--z-below:-1;--z-base:0;--z-dropdown:50;--z-sticky:100;--z-fixed:200;--z-overlay:300;--z-modal:400;--z-popover:500;--z-tooltip:600;--z-toast:700;--z-max:9999;--gradient-primary:linear-gradient(135deg,#627d98 0%,#829ab1 100%);--gradient-primary-vivid:linear-gradient(135deg,#486581 0%,#627d98 100%);--gradient-accent:linear-gradient(135deg,#06b6d4 0%,#22d3ee 100%);--gradient-warm:linear-gradient(135deg,#f59e0b 0%,#f97316 100%);--gradient-danger:linear-gradient(135deg,#dc2626 0%,#ef4444 100%);--gradient-success:linear-gradient(135deg,#16a34a 0%,#22c55e 100%);--gradient-dark:linear-gradient(135deg,#1e293b 0%,#334155 100%);--gradient-glass:linear-gradient(135deg,rgba(255,255,255,0.95) 0%,rgba(255,255,255,0.85) 100%);--gradient-header:linear-gradient(135deg,#334e68 0%,#486581 100%);--glass-bg:rgba(255,255,255,0.35);--glass-bg-strong:rgba(255,255,255,0.50);--glass-bg-subtle:rgba(255,255,255,0.20);--glass-border:rgba(0,0,0,0.08);--glass-border-strong:rgba(0,0,0,0.12);--glass-blur:blur(12px);--glass-blur-strong:blur(16px);--glass-blur-subtle:blur(12px);--glass-shadow:0 8px 32px rgba(0,0,0,0.10),0 2px 8px rgba(0,0,0,0.06);--glass-shadow-hover:0 16px 48px rgba(0,0,0,0.14),0 6px 16px rgba(0,0,0,0.08);--glass-shadow-elevated:0 24px 64px rgba(0,0,0,0.18),0 8px 24px rgba(0,0,0,0.10);--glass-inner-glow:inset 0 1px 0 rgba(255,255,255,0.8),inset 0 0 20px rgba(255,255,255,0.15);--glass-edge-light:inset 0 1px 0 rgba(255,255,255,0.7);--accent-glow:0 0 24px rgba(6,182,212,0.25);--accent-glow-strong:0 0 40px rgba(6,182,212,0.35);--app-bg-gradient:linear-gradient(135deg,#f1f5f9 0%,#e8eff5 25%,#f0f4f8 50%,#edf2f7 75%,#f5f7fa 100%);--app-bg-mesh:radial-gradient(ellipse at 15% 80%,rgba(99,132,169,0.08) 0%,transparent 55%),radial-gradient(ellipse at 85% 15%,rgba(139,92,246,0.05) 0%,transparent 55%),radial-gradient(ellipse at 50% 50%,rgba(100,116,139,0.04) 0%,transparent 50%),radial-gradient(ellipse at 75% 70%,rgba(59,130,246,0.10) 0%,transparent 45%);--glass-transition:transform 0.2s ease-out,box-shadow 0.2s ease-out;--container-xs:320px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1280px;--container-2xl:1536px;}*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;}body{font-family:var(--font);background:var(--app-bg-gradient);background-size:400% 400%;background-attachment:fixed;animation:bgGradientShift 25s ease infinite;color:var(--text);line-height:1.7;min-height:100vh;overflow-x:hidden;}@keyframes bgGradientShift{0%,100%{background-position:0% 50%;}25%{background-position:50% 0%;}50%{background-position:100% 50%;}75%{background-position:50% 100%;}}body::before{content:'';position:fixed;inset:0;background:var(--app-bg-mesh);pointer-events:none;z-index:-1;}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.3;color:var(--text);}h2{font-size:1.375rem;}h3{font-size:1.125rem;}h4{font-size:1rem;}img{max-width:100%;height:auto;}img[loading="lazy"]{opacity:0;transition:opacity var(--ease-slow);}img[loading="lazy"].loaded,img[loading="lazy"][src]{opacity:1;}input,select,textarea,button{font-family:inherit;font-size:inherit;}a{color:var(--primary);text-decoration:none;}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8fafc 0%,#e2e8f0 50%,#f1f5f9 100%);padding:var(--sp-4);position:relative;overflow:hidden;}.login-screen::before{content:'';position:absolute;width:800px;height:800px;background:radial-gradient(circle,rgba(59,130,246,0.08) 0%,transparent 60%);top:-300px;right:-200px;animation:floatOrb1 25s ease-in-out infinite;pointer-events:none;}.login-screen::after{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(99,102,241,0.06) 0%,transparent 60%);bottom:-200px;left:-150px;animation:floatOrb2 30s ease-in-out infinite;pointer-events:none;}@keyframes floatOrb1{0%,100%{transform:translate(0,0) scale(1);}33%{transform:translate(30px,20px) scale(1.05);}66%{transform:translate(-20px,30px) scale(0.95);}}@keyframes floatOrb2{0%,100%{transform:translate(0,0) scale(1);}33%{transform:translate(-25px,-15px) scale(0.95);}66%{transform:translate(20px,-25px) scale(1.05);}}.login-box{width:100%;max-width:400px;background:#ffffff;border-radius:20px;border:1px solid rgba(0,0,0,0.06);box-shadow:0 20px 40px -12px rgba(0,0,0,0.12),0 8px 16px -8px rgba(0,0,0,0.08);padding:48px 40px 40px;text-align:center;position:relative;z-index:1;animation:loginSlideUp 0.7s cubic-bezier(0.16,1,0.3,1) forwards;}@keyframes loginSlideUp{from{opacity:0;transform:translateY(40px) scale(0.96);}to{opacity:1;transform:translateY(0) scale(1);}}.login-logo{display:block;margin:0 auto 20px;height:56px;width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,0.08));}.login-box h2{font-size:22px;font-weight:700;color:#1e293b;margin-bottom:32px;letter-spacing:-0.02em;}.login-box .form-group{margin-bottom:20px;text-align:left;}.login-box .form-group label{display:block;font-size:13px;font-weight:600;color:#475569;margin-bottom:8px;letter-spacing:0.01em;}.login-box .form-group input{width:100%;padding:14px 16px;font-size:15px;border:1.5px solid #e2e8f0;border-radius:12px;background:#f8fafc;color:#1e293b;transition:border-color 0.2s ease,box-shadow 0.2s ease,background-color 0.2s ease;min-height:50px;}.login-box .form-group input:hover{border-color:#cbd5e1;background:#ffffff;}.login-box .form-group input:focus{outline:none;border-color:#3b82f6;background:#ffffff;box-shadow:0 0 0 3px rgba(59,130,246,0.12);}.login-box .form-group input::placeholder{color:#94a3b8;}.login-box .btn-primary{width:100%;padding:14px 24px;font-size:15px;font-weight:600;color:#ffffff;background:linear-gradient(135deg,#3b82f6 0%,#2563eb 100%);border:none;border-radius:12px;cursor:pointer;transition:background 0.2s ease,transform 0.2s ease,box-shadow 0.2s ease;margin-top:8px;min-height:50px;box-shadow:0 4px 14px rgba(59,130,246,0.25);}.login-box .btn-primary:hover{background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);transform:translateY(-1px);box-shadow:0 6px 20px rgba(59,130,246,0.35);}.login-box .btn-primary:active{transform:translateY(0);box-shadow:0 2px 8px rgba(59,130,246,0.25);}.login-box .btn-primary:disabled{opacity:0.6;cursor:not-allowed;transform:none;}.login-box .error-msg{margin-top:20px;padding:12px 16px;font-size:13px;font-weight:500;color:#dc2626;background:#fef2f2;border:1px solid #fecaca;border-radius:10px;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px;}.login-box .error-msg::before{content:'⚠';font-size:14px;}.login-credit{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);font-size:11px;color:#94a3b8;letter-spacing:0.3px;white-space:nowrap;user-select:none;font-weight:500;}.main-app{display:flex;flex-direction:column;min-height:100vh;}.app-header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-6);height:64px;background:#ffffff;color:var(--text);position:sticky;top:0;z-index:var(--z-sticky);box-shadow:0 1px 3px rgba(0,0,0,0.05);flex-shrink:0;border-bottom:1px solid #f1f5f9;}.header-left{display:flex;align-items:center;gap:var(--sp-3);}.header-logo{height:36px;width:auto;max-width:100%;object-fit:contain;flex-shrink:0;min-width:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,0.1));transition:transform var(--duration-normal) var(--ease-out);}.header-logo:hover{transform:scale(1.05);}.header-title{font-size:var(--text-xl);font-weight:700;color:var(--text);letter-spacing:var(--tracking-tight);}.header-right{display:flex;align-items:center;gap:var(--sp-4);}.user-info{font-size:var(--text-sm);color:var(--text-secondary);white-space:nowrap;font-weight:500;padding:var(--sp-2) var(--sp-3);background:#f1f5f9;border-radius:var(--radius-full);min-width:80px;}.header-right .btn-outline{color:var(--text-secondary);border:1.5px solid rgba(0,0,0,0.12);font-size:var(--text-sm);font-weight:600;padding:var(--sp-2) var(--sp-4);min-height:36px;border-radius:var(--radius-lg);background:#ffffff;transition:color var(--duration-normal) var(--ease-out),border-color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-out);}.header-right .btn-outline:hover{color:var(--text);border-color:rgba(0,0,0,0.2);background:#f8fafc;transform:translateY(-1px);}.warning-banner{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);background:var(--danger);color:#ffffff;font-size:0.875rem;font-weight:600;flex-shrink:0;animation:warningPulse 2s ease-in-out infinite;}@keyframes warningPulse{0%,100%{opacity:1;}50%{opacity:0.88;}}.warning-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:rgba(255,255,255,0.25);border-radius:var(--radius-full);font-size:0.75rem;font-weight:800;flex-shrink:0;}.btn-dismiss{margin-left:auto;background:rgba(255,255,255,0.2);border:none;color:#ffffff;padding:0.25rem 0.75rem;font-size:0.75rem;font-weight:600;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--ease-fast);min-height:32px;}.btn-dismiss:hover{background:rgba(255,255,255,0.35);}.tab-nav{display:flex;gap:var(--sp-2);padding:var(--sp-3) var(--sp-6);background:var(--glass-bg-subtle);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-border);box-shadow:var(--glass-edge-light);overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-shrink:0;position:relative;}.tab-nav::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);}.tab-nav::-webkit-scrollbar{display:none;}.tab-btn{padding:var(--sp-3) var(--sp-5);font-size:var(--text-base);font-weight:600;color:var(--text-subtle);background:transparent;border:none;border-radius:var(--radius-xl);cursor:pointer;transition:color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out);white-space:nowrap;min-height:44px;position:relative;letter-spacing:var(--tracking-wide);}.tab-btn:hover{color:var(--text);background:var(--bg-sunken);}.tab-btn.active{color:var(--primary-700);background:var(--primary-bg-strong);}.tab-btn.active::after{content:'';position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);width:28px;height:2px;background:var(--primary);border-radius:var(--radius-full);}.tab-content{display:none;flex:1 1 0;min-height:0;padding:var(--sp-6);overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;background:#f8fafc;}.tab-content.active{display:flex;flex-direction:column;animation:tabFadeIn 0.2s var(--ease-out);}@keyframes tabFadeIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}.filter-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-4);position:relative;z-index:10;flex-wrap:wrap;flex-shrink:0;background:var(--glass-bg-subtle);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);padding:var(--sp-3) var(--sp-4);border-radius:var(--radius-xl);border:1px solid var(--glass-border);}.filter-buttons{display:flex;gap:var(--sp-1);overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;scrollbar-width:none;}.filter-buttons::-webkit-scrollbar{display:none;}.filter-btn{padding:0.375rem 0.875rem;font-size:0.8125rem;font-weight:600;color:var(--text-subtle);background:var(--gray-100);border:1px solid transparent;border-radius:var(--radius-full);cursor:pointer;transition:color var(--ease-fast),background-color var(--ease-fast),border-color var(--ease-fast);white-space:nowrap;min-height:36px;}.filter-btn:hover{color:var(--text);background:var(--gray-200);}.filter-btn.active{color:var(--gray-900);background:var(--primary);border-color:var(--primary);}.filter-divider{width:1px;height:20px;background:var(--border);margin:0 2px;flex-shrink:0;}.filter-btn-meeting.active{background:var(--success);border-color:var(--success);}.filter-btn-payment.active{background:var(--accent-600);border-color:var(--accent-600);}.filter-actions{display:flex;align-items:center;gap:var(--sp-2);flex-shrink:0;}.search-input{padding:0.5rem 0.875rem;font-size:0.875rem;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);color:var(--text);width:200px;min-height:40px;transition:border-color var(--ease-fast),box-shadow var(--ease-fast);}.search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.search-input::placeholder{color:var(--text-muted);}.lead-list{display:flex;flex-direction:column;gap:var(--sp-2);flex:1 1 0;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:var(--sp-4);}.lead-list .lead-card + .lead-card{border-top:1px solid var(--gray-100,#f1f5f9);}.lead-card{background:#ffffff;border:1px solid #e2e8f0;border-radius:14px;overflow:visible;cursor:pointer;transition:transform 0.2s ease,box-shadow 0.2s ease;box-shadow:0 2px 8px rgba(0,0,0,0.06);position:relative;}.lead-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.08);border-color:rgba(59,130,246,0.2);}.lead-card:active{transform:translateY(0);}.lead-card-notes-inline{margin:var(--sp-2) 0;padding:var(--sp-3);background:linear-gradient(135deg,#ecfdf5 0%,#d1fae5 100%);border-radius:var(--radius-md);border-left:3px solid #10b981;}.lead-card-notes-inline .notes-label{display:block;font-size:0.72rem;font-weight:700;color:#059669;margin-bottom:var(--sp-1);}.lead-card-notes-inline .notes-text{font-size:0.85rem;color:var(--text-primary);line-height:1.7;margin:0;word-break:break-word;white-space:pre-line;overflow:hidden;display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;}@media (max-width:768px){.lead-card-notes-inline .notes-text{-webkit-line-clamp:4;}}.lead-card-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--glass-border);background:transparent;}.lead-card-header strong{font-size:var(--text-md);font-weight:700;color:var(--text);letter-spacing:var(--tracking-tight);}.lead-card-header .status-badge{font-size:var(--text-xs);font-weight:600;padding:var(--sp-1) var(--sp-2-5);border-radius:var(--radius-full);}.lead-card-body{padding:var(--sp-4) var(--sp-5);font-size:var(--text-sm);color:var(--text-subtle);line-height:1.6;}.lead-card-row{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-2);}.lead-quick-actions{display:flex;align-items:center;gap:var(--sp-2);margin-left:auto;}.lead-quick-actions select,.lead-quick-actions button{font-size:0.75rem;border-radius:var(--radius-md);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);}.quick-call-select{padding:4px 8px;border:1px solid var(--gray-300);background:var(--bg-elevated);color:var(--text-secondary);font-weight:500;}.quick-call-select:hover{border-color:var(--primary-400);background:var(--primary-50);}.quick-call-select:focus{outline:none;border-color:var(--primary-500);box-shadow:0 0 0 2px var(--primary-ring);}.quick-meeting-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;border:1px solid var(--gray-300);background:var(--bg-elevated);color:var(--text-secondary);font-weight:500;}.quick-meeting-btn:hover{border-color:var(--success);background:var(--success-50);color:var(--success);}.quick-meeting-btn.active{border-color:var(--success);background:var(--success);color:#fff;}.quick-meeting-btn .meeting-icon{font-size:0.85rem;}.quick-report-btn{display:flex;align-items:center;gap:4px;padding:4px 10px;border:1px solid var(--gray-300);background:var(--bg-elevated);color:var(--text-secondary);font-weight:500;}.quick-report-btn:hover{border-color:var(--info);background:var(--info-50);color:var(--info);}.quick-report-btn .report-icon{font-size:0.85rem;}@media (max-width:600px){.lead-quick-actions{width:100%;margin-left:0;justify-content:flex-start;}.quick-meeting-btn .meeting-text,.quick-report-btn .report-text{display:none;}}.lead-card-body p{margin-bottom:var(--sp-1-5);display:flex;align-items:center;gap:var(--sp-2);}.lead-card-body p strong{color:var(--text);font-weight:500;}.lead-card-tags{display:flex;flex-wrap:wrap;gap:var(--sp-1-5);padding:0 var(--sp-5) var(--sp-4);}.lead-card-tags span{font-size:var(--text-xs);font-weight:500;padding:var(--sp-1) var(--sp-2-5);background:var(--slate-100);color:var(--text-subtle);border-radius:var(--radius-full);transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);}.lead-card:hover .lead-card-tags span{background:var(--primary-50);color:var(--primary-700);}.status-badge{display:inline-flex;align-items:center;font-size:0.6875rem;font-weight:600;padding:0.1875rem 0.5rem;border-radius:var(--radius-full);white-space:nowrap;}.status-badge[data-status="1차콜"],.status-badge.call1{background:#dbeafe;color:#1e40af;}.status-badge[data-status="2차콜"],.status-badge.call2{background:#e0e7ff;color:#4338ca;}.status-badge[data-status="3차콜"],.status-badge.call3{background:#fee2e2;color:#991b1b;}.status-badge[data-status="미팅완료"],.status-badge.meeting{background:#d1fae5;color:#065f46;}.status-badge[data-status="결제완료"],.status-badge.payment{background:var(--primary-bg-strong);color:#92400e;}.list-loader{display:flex;align-items:center;justify-content:center;padding:var(--sp-8);flex-shrink:0;}.spinner{width:32px;height:32px;border:3px solid var(--gray-200);border-top-color:var(--primary);border-radius:50%;animation:spin 0.7s linear infinite;}@keyframes spin{to{transform:rotate(360deg);}}.spinner-sm{display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,0.4);border-top-color:#fff;border-radius:50%;animation:spin 0.7s linear infinite;vertical-align:middle;margin-right:4px;}.list-empty{text-align:center;padding:var(--sp-12) var(--sp-4);font-size:0.9375rem;color:var(--text-muted);flex-shrink:0;}.stats-header{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-6);flex-wrap:wrap;flex-shrink:0;}.stats-header h3{font-size:var(--text-2xl);font-weight:700;color:var(--text);letter-spacing:var(--tracking-tight);display:flex;align-items:center;gap:var(--sp-3);}.stats-header h3::before{content:'';width:4px;height:24px;background:var(--gradient-primary);border-radius:var(--radius-full);}.stats-controls{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;}.stats-level-selector{display:flex;gap:var(--sp-1);background:var(--slate-100);padding:var(--sp-1);border-radius:var(--radius-xl);box-shadow:var(--shadow-inner);}.stats-level-btn{padding:var(--sp-2) var(--sp-4);font-size:var(--text-sm);font-weight:600;color:var(--text-subtle);background:transparent;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);min-height:36px;letter-spacing:var(--tracking-wide);}.stats-level-btn:hover{color:var(--text);background:rgba(255,255,255,0.5);}.stats-level-btn.active{color:var(--primary-700);background:var(--card);box-shadow:var(--shadow-sm);}.stats-selector{padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);font-weight:500;color:var(--text);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);min-height:36px;min-width:120px;cursor:pointer;}.stats-selector:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-bg);}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-8);flex-shrink:0;}.stat-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--sp-5);display:flex;flex-direction:column;transition:var(--glass-transition);position:relative;overflow:hidden;box-shadow:var(--glass-shadow),var(--glass-edge-light);}.stat-card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.10);transform:translateY(-2px);}.stat-clickable{cursor:pointer;}.stat-clickable:hover{border-color:var(--primary-300);box-shadow:0 4px 20px rgba(59,130,246,0.15);}.stat-label{font-size:var(--text-xs);font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wider);margin-bottom:var(--sp-3);}.stat-value{font-size:var(--text-4xl);font-weight:800;color:var(--text);line-height:1;letter-spacing:var(--tracking-tighter);font-variant-numeric:tabular-nums;}.stat-sub{font-size:var(--text-xs);font-weight:600;color:var(--text-subtle);margin-top:var(--sp-2);display:flex;align-items:center;gap:var(--sp-1);}.call3-stat{border-color:var(--danger-500);border-left:3px solid var(--danger-500);background:var(--card);}.call3-stat .stat-value{color:var(--danger);}.call3-stat .stat-sub{color:var(--danger);}.stat-card.accent{border-left:3px solid var(--primary-500);background:var(--card);}.stat-card.accent .stat-value{color:var(--primary-700);}.stats-rates{flex-shrink:0;}.stats-rates h4{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--sp-4);color:var(--text);display:flex;align-items:center;gap:var(--sp-2);}.rate-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--sp-4);}.rate-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-5);box-shadow:var(--shadow-card);transition:box-shadow var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-out);}.rate-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-1px);}.rate-label{font-size:var(--text-sm);font-weight:600;color:var(--text-subtle);margin-bottom:2px;}.rate-sublabel{font-size:0.7rem;font-weight:400;color:var(--slate-400);margin-bottom:var(--sp-2);}.rate-value{font-size:1.25rem;font-weight:800;color:var(--text);margin-bottom:var(--sp-2);}.rate-detail{display:inline-block;font-size:0.75rem;font-weight:500;color:var(--text-muted);margin-left:6px;}.rate-bar{width:100%;height:8px;background:var(--gray-100);border-radius:4px;overflow:hidden;}.rate-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-light));border-radius:4px;transition:width 0.6s cubic-bezier(0.4,0,0.2,1);min-width:0;}.rate-fill.meeting-fill{background:linear-gradient(90deg,var(--accent-500,#06b6d4),var(--accent-400,#22d3ee));}.stats-matrix-section{margin-top:var(--sp-6);}.stats-matrix-section h4{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--sp-4);color:var(--text);}.stats-matrix{overflow-x:auto;-webkit-overflow-scrolling:touch;}.matrix-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;}.matrix-table thead th{background:var(--primary-50,#f0f4f8);color:var(--text-subtle);font-weight:600;padding:var(--sp-3) var(--sp-4);text-align:center;border-bottom:2px solid var(--border);white-space:nowrap;}.matrix-table tbody td{padding:var(--sp-3) var(--sp-4);text-align:center;border-bottom:1px solid var(--border-light,var(--border));transition:background 0.15s;}.matrix-table tbody tr:hover td{background:var(--primary-bg,rgba(98,125,152,0.05));}.matrix-stage{font-weight:600;text-align:left !important;color:var(--text);}.matrix-num{color:var(--text);font-variant-numeric:tabular-nums;}.matrix-rate{color:var(--primary);font-weight:600;font-variant-numeric:tabular-nums;}.matrix-na{color:var(--text-muted,#999);}.matrix-meet-col{color:var(--accent-600,#0891b2) !important;}.matrix-pay-col{color:var(--success-600,#16a34a) !important;}.matrix-total-row td{border-top:2px solid var(--border);background:var(--primary-bg-strong,rgba(98,125,152,0.1)) !important;font-weight:600;}.team-leads-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-5);flex-wrap:wrap;gap:var(--sp-4);padding-bottom:var(--sp-4);border-bottom:1px solid var(--border);min-height:52px;}.team-leads-header h3{margin:0;font-size:var(--text-xl);font-weight:700;color:var(--text);}.team-leads-stats{display:flex;gap:var(--sp-4);font-size:var(--text-sm);color:var(--text-secondary);min-height:38px;}.team-leads-stats .stat-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);background:var(--surface-secondary);border-radius:var(--radius-md);}.team-leads-stats .stat-item strong{color:var(--primary);font-size:var(--text-lg);font-weight:600;}.team-leads-filters{background:linear-gradient(135deg,var(--surface-secondary) 0%,var(--card) 100%);border-radius:var(--radius-lg);padding:var(--sp-4);margin-bottom:var(--sp-4);border:1px solid var(--border);box-shadow:var(--shadow-sm);}.team-leads-filters .filter-row{display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:center;}.team-leads-filters .filter-row input,.team-leads-filters .filter-row select{height:42px;border-radius:var(--radius-md);border:1px solid var(--border);padding:0 var(--sp-3);font-size:var(--text-sm);background:var(--bg);transition:border-color var(--ease-fast),box-shadow var(--ease-fast);}.team-leads-filters .filter-row input:focus,.team-leads-filters .filter-row select:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-bg);outline:none;}.team-leads-filters .filter-row input::placeholder{color:var(--text-muted);}.team-leads-quick-filters{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-4);min-height:40px;}.team-leads-region-filters{display:flex;gap:6px;flex-wrap:wrap;padding:6px 0 8px;margin-bottom:var(--sp-3);border-top:1px solid var(--border-subtle,#e2e8f0);min-height:34px;}.filter-btn-region{font-size:var(--text-xs,0.75rem);padding:4px 10px;background:var(--bg-subtle,#f8fafc);border:1px solid var(--border,#e2e8f0);border-radius:9999px;color:var(--text-muted,#94a3b8);cursor:pointer;transition:background 0.15s ease-out,color 0.15s ease-out,border-color 0.15s ease-out;white-space:nowrap;}.filter-btn-region.active{background:var(--primary,#627d98);color:#fff;border-color:var(--primary,#627d98);}.filter-btn-region:hover:not(.active){background:var(--bg-hover,#f1f5f9);color:var(--text,#1e293b);}.received-bulk-bar{padding:10px 16px;background:var(--primary-50,#eff6ff);border:1px solid var(--primary-200,#bfdbfe);border-radius:var(--radius-lg,12px);margin-bottom:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}.team-leads-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--sp-4);}.team-lead-card{cursor:pointer;background:#ffffff;border:1px solid #e2e8f0;border-radius:var(--radius-lg);padding:var(--sp-4);box-shadow:0 2px 8px rgba(0,0,0,0.06);transition:transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease;}.team-lead-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.12);border-color:#cbd5e1;}.team-lead-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-2);padding-bottom:var(--sp-2);border-bottom:1px solid var(--gray-50);}.team-lead-owner{font-size:0.75rem;color:var(--text-secondary);background:var(--gray-100);padding:2px 8px;border-radius:var(--radius-sm);}.team-lead-badges{display:flex;gap:4px;flex-wrap:wrap;}.team-lead-card-body{}.team-lead-name{font-weight:600;font-size:var(--text-base);color:var(--text);margin-bottom:var(--sp-1);}.team-lead-info{display:flex;gap:var(--sp-3);font-size:var(--text-sm);color:var(--text-muted);margin-bottom:var(--sp-1);}.team-lead-header-right{display:flex;align-items:center;gap:8px;}.team-lead-edit-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1px solid #e2e8f0;border-radius:6px;background:#f8fafc;color:#64748b;cursor:pointer;padding:0;transition:background 0.15s ease,color 0.15s ease,border-color 0.15s ease;}.team-lead-edit-btn:hover{background:#e2e8f0;color:#1e293b;border-color:#cbd5e1;}.team-lead-notes{font-size:0.75rem;color:var(--text-secondary);background:var(--gray-50);padding:4px 8px;border-radius:var(--radius-sm);margin-top:var(--sp-2);cursor:pointer;transition:background 0.15s ease;}.team-lead-notes:hover{background:var(--gray-100);}.team-lead-card.notes-updated-today{border-color:#4ade80;border-width:2px;background:linear-gradient(135deg,#dcfce7 0%,#f0fdf4 30%,#ffffff 60%);box-shadow:0 2px 10px rgba(16,185,129,0.18);}.team-lead-card.notes-updated-today:hover{border-color:#22c55e;box-shadow:0 8px 24px rgba(16,185,129,0.22);}.team-lead-card.notes-updated-today .team-lead-notes{background:#bbf7d0;color:#14532d;border-left:3px solid #16a34a;font-weight:500;}.badge-notes-updated{background:#bbf7d0;color:#15803d;font-weight:700;font-size:0.65rem;padding:2px 6px;border-radius:var(--radius-sm);border:1px solid #4ade80;}.expiry-badge{font-size:0.7rem;padding:2px 6px;border-radius:var(--radius-sm);background:var(--gray-100);color:var(--text-secondary);font-weight:600;}.expiry-badge.urgent{background:var(--warning-bg);color:var(--warning);}.expiry-badge.expired{background:var(--danger-bg);color:var(--danger);}.monitor-header{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);flex-shrink:0;}.monitor-header h3{font-size:1.125rem;font-weight:700;}.monitor-list{display:flex;flex-direction:column;gap:var(--sp-3);flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;}.monitor-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--sp-4);cursor:pointer;transition:var(--glass-transition);box-shadow:var(--glass-shadow),var(--glass-edge-light);}.monitor-card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.10);transform:translateY(-2px);}.monitor-detail-body{padding:var(--sp-4);overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch;max-height:60vh;}.read-only-badge{display:inline-flex;align-items:center;padding:0.1875rem 0.625rem;font-size:0.6875rem;font-weight:700;color:var(--text-muted);background:var(--gray-100);border:1px solid var(--border);border-radius:var(--radius-full);text-transform:uppercase;letter-spacing:0.04em;}.staff-header{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-6);flex-shrink:0;}.staff-header h3{font-size:var(--text-2xl);font-weight:700;color:var(--text);display:flex;align-items:center;gap:var(--sp-3);}.staff-header h3::before{content:'';width:4px;height:24px;background:var(--gradient-primary);border-radius:var(--radius-full);}.staff-header-actions{display:flex;gap:var(--sp-3);}.staff-list{display:flex;flex-direction:column;gap:0;flex:0 0 auto;overflow-y:visible;}.staff-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-4);transition:box-shadow var(--duration-normal) var(--ease-out),border-color var(--duration-normal) var(--ease-out);box-shadow:var(--shadow-card);position:relative;overflow:hidden;}.staff-card:hover{box-shadow:var(--shadow-card-hover);border-color:var(--primary-200);}.staff-info{display:flex;flex-direction:column;gap:var(--sp-2);}.staff-info strong{font-size:var(--text-lg);font-weight:700;color:var(--text);}.staff-info span{font-size:var(--text-sm);color:var(--text-subtle);}.staff-actions{display:flex;gap:var(--sp-2);margin-top:auto;}.staff-quick-filters{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) 0;flex-wrap:wrap;}.staff-quick-filter-btn{padding:var(--sp-2) var(--sp-4);border:1px solid var(--border);border-radius:var(--radius-full);background:var(--card);color:var(--text-secondary);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);}.staff-quick-filter-btn:hover{border-color:var(--primary-300);color:var(--primary);background:var(--primary-50);}.staff-quick-filter-btn.active{background:var(--primary);color:white;border-color:var(--primary);}.filter-divider{width:1px;height:24px;background:var(--border);margin:0 var(--sp-2);}.staff-branch-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-4);}.staff-branch-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-4);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);position:relative;overflow:hidden;}.staff-branch-card:hover{border-color:var(--primary-300);box-shadow:var(--shadow-md);transform:translateY(-2px);}.staff-branch-card.active{border-color:var(--primary);background:var(--primary-50);}.staff-branch-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-2);}.staff-branch-card-name{font-weight:600;font-size:var(--text-base);color:var(--text);}.staff-branch-card-count{background:var(--primary-100);color:var(--primary-700);padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;}.staff-branch-card-stats{display:flex;gap:var(--sp-2);font-size:var(--text-xs);color:var(--text-muted);}.staff-branch-card-stat{display:flex;align-items:center;gap:var(--sp-1);}.staff-branch-card-expand{position:absolute;right:var(--sp-3);top:50%;transform:translateY(-50%);color:var(--text-muted);transition:transform var(--duration-fast) var(--ease-out);}.staff-branch-card.active .staff-branch-card-expand{transform:translateY(-50%) rotate(180deg);}.audit-log-list{display:flex;flex-direction:column;gap:var(--sp-3);flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;}.audit-log-item{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);font-size:var(--text-sm);box-shadow:var(--shadow-xs);transition:box-shadow var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);}.audit-log-item:hover{box-shadow:var(--shadow-sm);border-color:var(--primary-200);}.audit-log-item time{color:var(--text-muted);font-size:var(--text-xs);white-space:nowrap;flex-shrink:0;font-weight:500;background:var(--slate-100);padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-md);}.modal{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--sp-4);}.modal-overlay{position:absolute;inset:0;background:rgba(15,23,42,0.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:overlayFadeIn 0.2s ease;}@keyframes overlayFadeIn{from{opacity:0;}to{opacity:1;}}.modal-content{position:relative;width:100%;max-width:520px;max-height:90vh;max-height:90dvh;background:#ffffff;border:1px solid rgba(0,0,0,0.08);border-radius:20px;box-shadow:0 25px 50px -12px rgba(0,0,0,0.25);display:flex;flex-direction:column;overflow:hidden;animation:modalGlassIn 0.3s var(--ease-out);}@keyframes modalGlassIn{from{opacity:0;transform:scale(0.95) translateY(12px);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);}to{opacity:1;transform:scale(1) translateY(0);backdrop-filter:var(--glass-blur-strong);-webkit-backdrop-filter:var(--glass-blur-strong);}}.modal-large{max-width:720px;}.modal-xl{max-width:960px;}.modal-content.lead-form-modal{max-width:960px;}.lead-form-body{display:flex;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;min-height:0;}.lead-form-left{flex:1;min-width:0;overflow-y:auto;-webkit-overflow-scrolling:touch;}.lead-form-right{width:450px;flex-shrink:0;border-left:1px solid var(--border-subtle);display:flex;flex-direction:column;overflow-y:auto;-webkit-overflow-scrolling:touch;}.lead-form-right .form-section{flex:1;display:flex;flex-direction:column;border-bottom:none;}.lead-form-right .form-group{flex:1;display:flex;flex-direction:column;margin-bottom:0;}.lead-form-right textarea{flex:1;min-height:300px;resize:none;overflow-y:auto;}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-5) var(--sp-6);border-bottom:1px solid var(--border);flex-shrink:0;gap:var(--sp-3);background:var(--slate-50);}.modal-header h3{font-size:var(--text-xl);font-weight:700;flex:1;min-width:0;letter-spacing:var(--tracking-tight);color:var(--text);}.modal-header-actions{display:flex;align-items:center;gap:var(--sp-2);flex-shrink:0;}.modal-close{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--slate-100);border:none;border-radius:var(--radius-lg);color:var(--text-subtle);font-size:var(--text-xl);cursor:pointer;transition:background-color var(--duration-normal) var(--ease-out),color var(--duration-normal) var(--ease-out);flex-shrink:0;line-height:1;}.modal-close:hover{background:var(--slate-200);color:var(--text);}.lead-form{display:flex;flex-direction:column;flex:1;min-height:0;}.form-section{padding:var(--sp-5) var(--sp-6);border-bottom:1px solid var(--border-subtle);}.form-section:last-of-type{border-bottom:none;}.status-section{background:var(--slate-50);}.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-4) var(--sp-5);}.form-row.three-col{grid-template-columns:repeat(3,1fr);}.form-group{margin-bottom:var(--sp-4);}.form-group.full{grid-column:1 / -1;}.form-group label{display:flex;align-items:center;gap:var(--sp-1);font-size:var(--text-sm);font-weight:600;color:var(--text-secondary);margin-bottom:var(--sp-2);letter-spacing:var(--tracking-wide);}.form-group input,.form-group select,.form-group textarea{width:100%;padding:var(--sp-3) var(--sp-4);font-size:var(--text-md);color:var(--text);background:#f8fafc;border:1px solid rgba(0,0,0,0.08);border-radius:10px;transition:border-color 0.2s ease,box-shadow 0.2s ease,background-color 0.2s ease;min-height:46px;}.form-group input:hover,.form-group select:hover,.form-group textarea:hover{border-color:rgba(0,0,0,0.15);background:#ffffff;}.form-group textarea{resize:vertical;min-height:88px;line-height:1.6;}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:rgba(59,130,246,0.5);background:#ffffff;box-shadow:0 0 0 3px rgba(59,130,246,0.1);}.form-group input::placeholder,.form-group textarea::placeholder{color:var(--text-muted);}.form-group input:read-only{background:var(--slate-100);cursor:not-allowed;color:var(--text-subtle);border-color:var(--border);}.form-group input:read-only:focus{box-shadow:none;border-color:var(--border);}.input-with-btn{display:flex;gap:var(--sp-2);align-items:stretch;}.input-with-btn input{flex:1;min-width:0;}.btn-place-link{flex-shrink:0;padding:0 var(--sp-3);background:var(--primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:background-color var(--transition-fast),opacity var(--transition-fast);white-space:nowrap;}.btn-place-link:hover{background:var(--primary-hover);}.btn-place-link:disabled{background:var(--slate-300);cursor:not-allowed;}.required{color:var(--danger);font-weight:700;}.error-msg{font-size:var(--text-sm);color:var(--danger);margin-top:var(--sp-2);display:flex;align-items:center;gap:var(--sp-1);}.error-msg::before{content:'⚠';font-size:var(--text-xs);}.form-hint{font-size:var(--text-xs);color:var(--text-muted);margin-top:var(--sp-1);}.radio-group{display:flex;gap:var(--sp-1);flex-wrap:wrap;}.radio-label{cursor:pointer;display:inline-flex;}.radio-label input[type="radio"]{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}.radio-label span{display:inline-flex;align-items:center;justify-content:center;padding:0.375rem 0.875rem;font-size:0.8125rem;font-weight:600;color:var(--text-subtle);background:var(--gray-100);border:2px solid transparent;border-radius:var(--radius-full);transition:color var(--ease-fast),background-color var(--ease-fast),border-color var(--ease-fast);min-height:36px;cursor:pointer;}.radio-label span:hover{background:var(--gray-200);color:var(--text);}.radio-label input[type="radio"]:checked + span{color:var(--gray-900);background:var(--primary-bg-strong);border-color:var(--primary);}.radio-label input[type="radio"]:focus-visible + span{box-shadow:0 0 0 3px var(--primary-ring);}.form-actions{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-5);border-top:1px solid var(--border);background:var(--gray-50);gap:var(--sp-2);flex-shrink:0;}.form-actions-right{display:flex;align-items:center;gap:var(--sp-2);margin-left:auto;}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-2-5) var(--sp-4);font-family:inherit;font-size:var(--text-base);font-weight:600;line-height:1.5;color:var(--text);background:var(--card);border:1.5px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;transition:background-color var(--duration-normal) var(--ease-out),color var(--duration-normal) var(--ease-out),border-color var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-out),opacity var(--duration-normal) var(--ease-out);white-space:nowrap;min-height:44px;-webkit-user-select:none;user-select:none;touch-action:manipulation;letter-spacing:var(--tracking-wide);}.btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:var(--shadow-sm);}.btn:focus-visible{outline:none;box-shadow:0 0 0 3px var(--primary-ring);}.btn:disabled{opacity:0.5;cursor:not-allowed;pointer-events:none;}.btn:active:not(:disabled){transform:translateY(0) scale(0.98);box-shadow:none;}.btn-primary{color:#ffffff;background:linear-gradient(135deg,#3b82f6 0%,#2563eb 100%);border-color:transparent;box-shadow:0 4px 14px rgba(59,130,246,0.35);}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);box-shadow:0 6px 20px rgba(59,130,246,0.4);transform:translateY(-1px);}.btn-primary:active:not(:disabled){transform:translateY(0);box-shadow:0 2px 8px rgba(59,130,246,0.3);}.btn-danger{color:#ffffff;background:var(--gradient-danger);border-color:transparent;box-shadow:0 2px 8px rgba(220,38,38,0.25);}.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,#b91c1c 0%,#dc2626 100%);box-shadow:0 4px 14px rgba(220,38,38,0.35);}.btn-success{color:#ffffff;background:var(--gradient-success);border-color:transparent;box-shadow:0 2px 8px rgba(22,163,74,0.25);}.btn-success:hover:not(:disabled){box-shadow:0 4px 14px rgba(22,163,74,0.35);}.btn-warning{color:#ffffff;background:linear-gradient(135deg,var(--warning-600) 0%,var(--warning-500) 100%);border-color:transparent;box-shadow:0 2px 8px rgba(245,158,11,0.25);}.btn-warning:hover:not(:disabled){box-shadow:0 4px 14px rgba(245,158,11,0.35);}.btn-outline{color:var(--text-secondary);background:var(--card);border-color:var(--border);}.btn-outline:hover:not(:disabled){background:var(--bg-sunken);border-color:var(--border-strong);color:var(--text);}.btn-ghost{color:var(--text-subtle);background:transparent;border-color:transparent;}.btn-ghost:hover:not(:disabled){background:var(--bg-sunken);color:var(--text);}.btn-xs{padding:var(--sp-1) var(--sp-2);font-size:var(--text-xs);min-height:28px;border-radius:var(--radius-md);}.btn-sm{padding:var(--sp-1-5) var(--sp-3);font-size:var(--text-sm);min-height:36px;}.btn-lg{padding:var(--sp-3) var(--sp-6);font-size:var(--text-lg);min-height:52px;border-radius:var(--radius-xl);}.btn-full{width:100%;min-height:52px;font-size:var(--text-md);margin-top:var(--sp-4);border-radius:var(--radius-xl);}.btn-icon{width:44px;height:44px;padding:0;border-radius:var(--radius-lg);}.btn-icon.btn-sm{width:36px;height:36px;min-height:36px;}.toast{position:fixed;bottom:var(--sp-6);left:50%;transform:translateX(-50%);z-index:2000;display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5);background:rgba(30,41,59,0.85);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);color:#ffffff;font-size:0.875rem;font-weight:600;border-radius:var(--radius-lg);box-shadow:var(--glass-shadow-elevated);animation:toastIn 0.3s ease;max-width:calc(100vw - var(--sp-8));}@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(12px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}.toast-success{background:var(--success);}.toast-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;background:rgba(255,255,255,0.2);border-radius:var(--radius-full);font-size:0.6875rem;font-weight:800;flex-shrink:0;}.auto-save-indicator{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:0.75rem;font-weight:600;color:var(--success);padding:0.25rem 0.5rem;background:var(--success-bg);border-radius:var(--radius-full);animation:autoSaveFadeIn 0.3s ease;}@keyframes autoSaveFadeIn{from{opacity:0;transform:scale(0.9);}to{opacity:1;transform:scale(1);}}.superior-only,.admin-only,.branch-mgr-only{}@media (max-width:768px){.app-header{padding:0 var(--sp-4);height:56px;}.header-title{font-size:var(--text-md);}.header-logo{height:32px;object-fit:contain;}.user-info{font-size:var(--text-xs);padding:var(--sp-1-5) var(--sp-2);}.tab-nav{padding:var(--sp-2) var(--sp-4);gap:var(--sp-1);}.tab-btn{padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);border-radius:var(--radius-lg);}.tab-btn.active::after{bottom:-8px;width:24px;}.tab-content{padding:var(--sp-4);}.filter-bar{flex-direction:column;align-items:stretch;gap:var(--sp-3);}.filter-actions{flex-direction:row;flex-wrap:wrap;}.search-input{flex:1;width:auto;min-width:200px;}.stats-header{flex-direction:column;align-items:flex-start;}.stats-grid{grid-template-columns:repeat(3,1fr);gap:var(--sp-3);}.stat-card{padding:var(--sp-4);}.stat-value{font-size:var(--text-3xl);}.rate-grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-3);}.form-row{grid-template-columns:1fr;}.form-row.three-col{grid-template-columns:repeat(2,1fr);}.modal{padding:var(--sp-3);align-items:flex-end;}.modal-content{max-height:90vh;max-height:90dvh;border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;animation:modalSlideUp 0.35s var(--ease-spring);}@keyframes modalSlideUp{from{opacity:0;transform:translateY(100%);}to{opacity:1;transform:translateY(0);}}.modal-large{max-width:100%;}.lead-form-modal{max-width:100%;}.lead-form-body{flex-direction:column;}.lead-form-left{overflow-y:visible;}.lead-form-right{width:100%;border-left:none;border-top:1px solid var(--border-subtle);overflow-y:visible;}.lead-form-right textarea{min-height:88px;resize:vertical;}.lead-form{overflow-y:auto;-webkit-overflow-scrolling:touch;}.staff-card{padding:var(--sp-4);}.lead-list{gap:var(--sp-3);}.lead-card{border-radius:var(--radius-lg);}.lead-card-header{padding:var(--sp-3) var(--sp-4);}.lead-card-body{padding:var(--sp-3) var(--sp-4);}.lead-card-tags{padding:0 var(--sp-4) var(--sp-3);}}@media (max-width:480px){:root{font-size:15px;}.login-screen{padding:var(--sp-3);}.login-box{padding:var(--sp-6) var(--sp-4) var(--sp-5);border-radius:var(--radius-xl);}.login-logo{height:48px;object-fit:contain;}.login-box h2{font-size:var(--text-xl);}.app-header{height:52px;padding:0 var(--sp-3);}.header-logo{height:28px;object-fit:contain;}.header-title{font-size:var(--text-sm);}.user-info{display:none;}.notification-bell{font-size:var(--text-lg);width:36px;height:36px;}.tab-nav{padding:var(--sp-2) var(--sp-3);}.tab-btn{padding:var(--sp-2) var(--sp-2-5);font-size:var(--text-xs);min-height:40px;}.tab-btn.active::after{width:20px;height:2px;}.tab-content{padding:var(--sp-3);}.filter-bar{gap:var(--sp-2);}.filter-btn{font-size:var(--text-xs);padding:var(--sp-1-5) var(--sp-2);min-height:32px;}.stats-header h3{font-size:var(--text-lg);}.stats-header h3::before{height:20px;width:3px;}.stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-2);}.stat-card{padding:var(--sp-3);border-radius:var(--radius-lg);}.stat-label{font-size:0.625rem;}.stat-value{font-size:var(--text-2xl);}.rate-grid{grid-template-columns:1fr;gap:var(--sp-2);}.rate-card{padding:var(--sp-4);}.form-row.three-col{grid-template-columns:1fr;}.form-section{padding:var(--sp-4);}.form-group input,.form-group select,.form-group textarea{min-height:44px;font-size:var(--text-base);}.form-actions{padding:var(--sp-3) var(--sp-4);flex-wrap:wrap;}.modal{padding:0;align-items:flex-end;}.modal-content{max-height:94vh;max-height:94dvh;border-radius:var(--radius-xl) var(--radius-xl) 0 0;margin:0;}.modal-header{padding:var(--sp-4);}.modal-header h3{font-size:var(--text-lg);}.lead-card-header strong{font-size:var(--text-base);}.btn{min-height:44px;font-size:var(--text-sm);}.btn-sm{min-height:36px;font-size:var(--text-xs);}.stats-header{flex-direction:column;align-items:flex-start;}.stats-level-selector{width:100%;}.stats-level-btn{flex:1;text-align:center;}.staff-header{flex-direction:column;align-items:flex-start;gap:var(--sp-2);}.staff-header .btn{width:100%;}.monitor-header{flex-wrap:wrap;}}::-webkit-scrollbar{width:5px;height:5px;}::-webkit-scrollbar-track{background:transparent;}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px;}::-webkit-scrollbar-thumb:hover{background:var(--gray-400);}*{scrollbar-width:thin;scrollbar-color:var(--gray-300) transparent;}.hidden{display:none !important;}.text-muted{color:var(--text-muted);}.text-success{color:var(--success);}.text-error{color:var(--danger);}.font-mono{font-family:'JetBrains Mono','Fira Code','Consolas',monospace;}:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}button:focus:not(:focus-visible),input:focus:not(:focus-visible),select:focus:not(:focus-visible),textarea:focus:not(:focus-visible){outline:none;}@supports (padding:env(safe-area-inset-bottom)){.main-app{padding-bottom:env(safe-area-inset-bottom);}.form-actions{padding-bottom:calc(var(--sp-3) + env(safe-area-inset-bottom));}.toast{bottom:calc(var(--sp-6) + env(safe-area-inset-bottom));}}@media print{.app-header,.tab-nav,.filter-bar,.warning-banner,.toast,.modal-overlay,.btn{display:none !important;}body{background:#fff;}.tab-content{display:block !important;padding:0;}.stat-card,.rate-card,.lead-card{break-inside:avoid;}}.call0-stat{border-color:var(--gray-400);border-width:2px;background:linear-gradient(135deg,var(--gray-50) 0%,var(--gray-100) 100%);}.call0-stat .stat-value{color:var(--gray-600);}.status-badge[data-status="0차콜"],.status-badge.call0,.badge-call0{background:#f3f4f6;color:#4b5563;}.bulk-action-bar{position:fixed;bottom:0;left:0;right:0;background:var(--gradient-header);color:#ffffff;padding:var(--sp-3) var(--sp-4);display:flex;align-items:center;gap:var(--sp-4);z-index:200;box-shadow:0 -4px 12px rgba(0,0,0,0.1);animation:slideUp 0.3s ease;}@keyframes slideUp{from{transform:translateY(100%);opacity:0;}to{transform:translateY(0);opacity:1;}}.select-all-label{display:flex;align-items:center;gap:var(--sp-2);cursor:pointer;font-weight:600;}.select-all-label input[type="checkbox"]{width:18px;height:18px;cursor:pointer;}.selected-count{font-weight:600;padding:var(--sp-1) var(--sp-3);background:rgba(255,255,255,0.2);border-radius:var(--radius-full);}.bulk-action-bar .btn-danger{margin-left:auto;}.bulk-bar-inner{display:flex;align-items:center;gap:var(--sp-3);width:100%;}.bulk-bar-info{display:flex;align-items:center;gap:var(--sp-2);flex-shrink:0;}.bulk-bar-select-all{display:flex;align-items:center;gap:var(--sp-2);cursor:pointer;font-weight:600;}.bulk-bar-select-all input[type="checkbox"]{width:18px;height:18px;cursor:pointer;}.bulk-bar-count{font-weight:700;font-size:1rem;padding:2px 10px;background:rgba(255,255,255,0.2);border-radius:20px;}.bulk-bar-count-label{font-size:0.85rem;opacity:0.9;}.bulk-bar-actions{display:flex;align-items:center;gap:var(--sp-2);margin-left:auto;flex-wrap:wrap;}.bulk-bar-btn{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;background:rgba(255,255,255,0.15);color:#ffffff;border:1px solid rgba(255,255,255,0.25);border-radius:6px;cursor:pointer;font-size:0.8125rem;font-weight:500;transition:background 0.15s ease;white-space:nowrap;}.bulk-bar-btn:hover{background:rgba(255,255,255,0.25);}.bulk-bar-btn--status{background:rgba(59,130,246,0.3);border-color:rgba(59,130,246,0.4);}.bulk-bar-btn--danger{background:rgba(239,68,68,0.3);border-color:rgba(239,68,68,0.4);}.bulk-bar-btn--danger:hover{background:rgba(239,68,68,0.5);}.bulk-bar-btn--escalate{background:rgba(245,158,11,0.3);border-color:rgba(245,158,11,0.4);}.bulk-bar-btn--exchange{background:rgba(16,185,129,0.3);border-color:rgba(16,185,129,0.4);}.bulk-bar-btn--requests{position:relative;}.bulk-bar-badge{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 4px;background:#ef4444;color:#fff;font-size:11px;font-weight:700;border-radius:9px;display:flex;align-items:center;justify-content:center;}.bulk-bar-select{padding:5px 8px;background:rgba(255,255,255,0.15);color:#ffffff;border:1px solid rgba(255,255,255,0.25);border-radius:6px;font-size:0.8125rem;cursor:pointer;}.bulk-bar-select option{background:#1e293b;color:#ffffff;}.bulk-bar-divider{width:1px;height:24px;background:rgba(255,255,255,0.2);flex-shrink:0;}.bulk-bar-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.1);color:#ffffff;border:none;border-radius:50%;cursor:pointer;font-size:18px;flex-shrink:0;transition:background 0.15s ease;}.bulk-bar-close:hover{background:rgba(255,255,255,0.25);}.shortcut-hint{font-size:0.6875rem;font-weight:400;color:var(--text-muted);margin-left:var(--sp-1);}.payment-type-row{display:flex;align-items:center;gap:var(--sp-2);}.payment-type-row select{flex:1;}.toast-error{background:var(--danger);}.modal-alert{max-width:360px;text-align:center;}.session-alert-body,.preparing-body{padding:var(--sp-6);text-align:center;}.alert-icon{width:64px;height:64px;margin:0 auto var(--sp-4);background:var(--danger-bg);color:var(--danger);font-size:2rem;font-weight:800;display:flex;align-items:center;justify-content:center;border-radius:50%;}.alert-sub{font-size:0.8125rem;color:var(--text-muted);margin-top:var(--sp-2);}.modal-footer{padding:var(--sp-4);border-top:1px solid var(--border);}.export-format-btn.active{border-color:#4f46e5 !important;background:#eef2ff !important;color:#4338ca !important;}#export-settings-modal label:has(input[type="radio"]:checked){background:#f5f3ff;border-color:#a78bfa;}.modal-body{padding:var(--sp-4);}.report-progress-container{padding:28px 24px;display:flex;flex-direction:column;align-items:center;text-align:center;}.report-progress-header{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:24px;}.report-progress-icon{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,#eff6ff,#dbeafe);display:flex;align-items:center;justify-content:center;animation:reportIconPulse 2s ease-in-out infinite;}@keyframes reportIconPulse{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(59,130,246,0.2);}50%{transform:scale(1.05);box-shadow:0 0 0 12px rgba(59,130,246,0);}}.report-progress-header h4{font-size:16px;font-weight:700;color:#1e293b;}.report-progress-bar-wrapper{width:100%;display:flex;align-items:center;gap:12px;margin-bottom:16px;}.report-progress-bar{flex:1;height:10px;background:#f1f5f9;border-radius:999px;overflow:hidden;position:relative;}.report-progress-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#3b82f6,#6366f1);transition:width 0.6s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;}.report-progress-fill::after{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent);animation:reportShimmer 2s ease-in-out infinite;}@keyframes reportShimmer{0%{left:-100%;}100%{left:100%;}}.report-progress-percent{font-size:14px;font-weight:700;color:#3b82f6;min-width:42px;text-align:right;font-variant-numeric:tabular-nums;}.report-progress-step{font-size:14px;font-weight:600;color:#334155;margin:0 0 4px;}.report-progress-subtext{font-size:12px;color:#94a3b8;margin:0;}.preparing-icon{font-size:3rem;margin-bottom:var(--sp-4);}.deleted-leads-list{padding:var(--sp-4);max-height:60vh;overflow-y:auto;}.deleted-lead-card{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);background:var(--gray-50);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:var(--sp-2);opacity:0.8;}.deleted-lead-card:hover{opacity:1;background:var(--card);}.deleted-lead-info{flex:1;}.deleted-lead-info strong{display:block;margin-bottom:var(--sp-1);}.deleted-lead-info span{font-size:0.8125rem;color:var(--text-muted);}.staff-header-actions{display:flex;align-items:center;gap:var(--sp-2);}.lead-card-info{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-3);margin:var(--sp-2) 0;font-size:0.8rem;color:var(--text-secondary);line-height:1.5;}.lead-info-address{display:inline-flex;align-items:baseline;gap:4px;color:var(--text-secondary);}.lead-info-keywords{display:inline-flex;align-items:baseline;gap:4px;color:var(--primary);font-weight:500;}.lead-card-extended{padding:var(--sp-2) var(--sp-4) var(--sp-3);background:var(--gray-50);border-top:1px solid var(--gray-100);font-size:0.75rem;color:var(--text-subtle);}.lead-card-extended-row{display:flex;gap:var(--sp-4);flex-wrap:wrap;}.lead-card-extended-row span{white-space:nowrap;}.lead-card-extended .place-url{color:var(--primary);cursor:pointer;text-decoration:underline;}.lead-card-extended .place-url:hover{color:var(--primary-hover);}.lead-card.expiring-soon{border-color:var(--danger);border-width:2px;animation:expiringPulse 2s ease-in-out infinite;}@keyframes expiringPulse{0%,100%{box-shadow:0 0 0 0 rgba(239,68,68,0.4);}50%{box-shadow:0 0 0 6px rgba(239,68,68,0);}}.expiry-badge{display:inline-flex;align-items:center;gap:var(--sp-1);padding:0.125rem 0.5rem;font-size:0.6875rem;font-weight:600;background:var(--danger-bg);color:var(--danger);border-radius:var(--radius-full);}.expiry-badge.warning{background:#fef3c7;color:#92400e;}.days-remaining{font-size:0.6875rem;color:var(--text-muted);display:inline-flex;align-items:center;gap:2px;}.days-remaining.urgent{color:var(--danger);font-weight:600;}.lead-card-checkbox{position:absolute;top:var(--sp-3);left:var(--sp-3);width:20px;height:20px;cursor:pointer;z-index:10;opacity:0;transition:opacity var(--ease-fast);}.lead-card:hover .lead-card-checkbox,.lead-card.selected .lead-card-checkbox,.bulk-select-mode .lead-card-checkbox{opacity:1;}.lead-card.selected{border-color:var(--primary);background:var(--primary-bg);}.lead-card{position:relative;transition:padding 0.15s ease;}.lead-card:hover,.lead-card.selected{padding-left:calc(var(--sp-3) + 24px);}.bulk-select-mode .lead-card{padding-left:calc(var(--sp-4) + 28px);}.lead-card-delete{position:absolute;top:var(--sp-2);right:var(--sp-2);width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--danger-bg);color:var(--danger);border:none;border-radius:var(--radius-sm);cursor:pointer;opacity:0;transition:opacity var(--ease-fast);font-size:1rem;z-index:10;}.lead-card:hover .lead-card-delete{opacity:1;}.lead-card-delete:hover{background:var(--danger);color:#ffffff;}.lead-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}.lead-name-wrap{overflow:hidden;}.lead-card.selected .lead-name{color:var(--text);}.bulk-select-mode .lead-card .lead-card-header{padding-left:var(--sp-2);}.bulk-select-mode .lead-card.selected{background:rgba(var(--primary-rgb,59,130,246),0.08);border-color:var(--primary);}.audit-table{width:100%;border-collapse:collapse;font-size:0.8125rem;}.audit-table th,.audit-table td{padding:var(--sp-3);text-align:left;border-bottom:1px solid var(--border);}.audit-table th{background:var(--gray-50);font-weight:600;color:var(--text-subtle);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.02em;}.audit-table tr:hover td{background:var(--gray-50);}.audit-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4);}.audit-header h3{margin:0;font-size:1.125rem;font-weight:700;}.audit-filters{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);padding:var(--sp-3) var(--sp-4);background:var(--gray-50,#f9fafb);border-radius:var(--radius-lg);border:1px solid var(--border);}.audit-category-btns{display:flex;gap:var(--sp-1);flex-wrap:wrap;}.audit-cat-btn{padding:var(--sp-1) var(--sp-3);font-size:var(--text-sm);font-weight:500;border:1px solid var(--border);border-radius:var(--radius-full,9999px);background:var(--card);color:var(--text-subtle);cursor:pointer;transition:border-color 0.15s,color 0.15s,background-color 0.15s;}.audit-cat-btn:hover{border-color:var(--primary);color:var(--primary);}.audit-cat-btn.active{background:var(--primary);color:#fff;border-color:var(--primary);}.audit-date-filters{display:flex;align-items:center;gap:var(--sp-2);margin-left:auto;}.audit-date-input{padding:var(--sp-1) var(--sp-2);font-size:var(--text-sm);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);color:var(--text);}.audit-date-sep{color:var(--text-muted);font-size:var(--text-sm);}.audit-cat-badge{display:inline-block;padding:2px 8px;font-size:0.6875rem;font-weight:600;border-radius:var(--radius-full,9999px);text-align:center;white-space:nowrap;}.audit-cat-badge.cat-auth{background:rgba(59,130,246,0.1);color:#2563eb;}.audit-cat-badge.cat-staff{background:rgba(168,85,247,0.1);color:#7c3aed;}.audit-cat-badge.cat-business{background:rgba(34,197,94,0.1);color:#16a34a;}.audit-cat-badge.cat-system{background:rgba(245,158,11,0.1);color:#d97706;}.audit-pagination{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);padding:var(--sp-4) 0;}.audit-page-info{font-size:var(--text-sm);color:var(--text-subtle);}.audit-page-btn{cursor:pointer;}@media (max-width:640px){.audit-filters{flex-direction:column;align-items:stretch;}.audit-date-filters{margin-left:0;}}.monitor-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3);}.monitor-role{font-size:0.75rem;color:var(--text-muted);}.monitor-stats{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);font-size:0.8125rem;}.monitor-stats span{white-space:nowrap;}.call3-danger{color:var(--danger);font-weight:700;}.payment-highlight{color:var(--primary);font-weight:700;}.staff-info{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-4);align-items:center;}.staff-info strong{font-size:1rem;}.staff-info span{font-size:0.8125rem;color:var(--text-subtle);}.staff-actions{display:flex;gap:var(--sp-2);}.skeleton{background:linear-gradient(90deg,var(--gray-100) 25%,var(--gray-200) 50%,var(--gray-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm);}@keyframes shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}.skeleton-text{height:1rem;margin-bottom:var(--sp-2);}.skeleton-text.short{width:60%;}.skeleton-title{height:1.5rem;width:40%;margin-bottom:var(--sp-3);}.skeleton-card{height:120px;border-radius:var(--radius-lg);}.skeleton-stat{height:80px;border-radius:var(--radius-lg);}.count-up{transition:transform 0.3s ease;}.count-up.counting{transform:scale(1.1);}@keyframes countPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.05);}}.kpi-card{background:#ffffff;border:1px solid #e2e8f0;border-radius:16px;padding:var(--sp-5);position:relative;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,0.06);transition:transform 0.25s ease,box-shadow 0.25s ease,border-color 0.25s ease;min-height:242px;box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(0,0,0,0.03);}.kpi-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(135deg,#3b82f6 0%,#6366f1 100%);opacity:0;transition:opacity 0.3s ease;}.kpi-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,0.08),0 4px 12px rgba(59,130,246,0.08);border-color:rgba(59,130,246,0.15);}.kpi-card.kpi-clickable{cursor:pointer;}.kpi-card.kpi-clickable:active{transform:translateY(-1px) scale(0.99);}.kpi-card.kpi-clickable::after{content:'\2197';position:absolute;top:var(--sp-2);right:var(--sp-2);font-size:12px;color:var(--text-muted);opacity:0;transition:opacity 0.2s ease;}.kpi-card.kpi-clickable:hover::after{opacity:1;}.kpi-card:hover::before{opacity:1;}.kpi-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-2);}.kpi-label{font-size:0.8125rem;color:var(--text-subtle);font-weight:500;}.kpi-trend{font-size:0.75rem;font-weight:600;padding:0.125rem 0.5rem;border-radius:var(--radius-full);}.kpi-trend.up{background:var(--success-bg);color:var(--success);}.kpi-trend.down{background:var(--danger-bg);color:var(--danger);}.kpi-trend.neutral{background:var(--gray-100);color:var(--text-muted);}.kpi-value{font-size:2rem;font-weight:700;color:var(--text);line-height:1.2;margin-bottom:var(--sp-2);}.kpi-sub{font-size:0.75rem;color:var(--text-muted);}.kpi-progress{margin-top:var(--sp-3);}.kpi-progress-bar{height:6px;background:var(--gray-100);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--sp-1);}.kpi-progress-fill{height:100%;background:var(--gradient-primary);border-radius:var(--radius-full);transition:width 0.8s ease;}.kpi-progress-text{font-size:0.6875rem;color:var(--text-muted);}.activity-feed{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);max-height:400px;overflow-y:auto;min-height:200px;}.activity-feed-header{padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--card);z-index:1;}.activity-feed-title{font-weight:600;font-size:0.875rem;}.activity-item{display:flex;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--gray-50);transition:background var(--ease-fast);}.activity-item:hover{background:var(--gray-50);}.activity-item:last-child{border-bottom:none;}.activity-icon{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0;}.activity-icon.icon-call{background:#dbeafe;color:#2563eb;}.activity-icon.icon-meeting{background:#fef3c7;color:#d97706;}.activity-icon.icon-payment{background:#d1fae5;color:#059669;}.activity-icon.icon-create{background:var(--primary-50);color:var(--primary);}.activity-icon.icon-delete{background:#fee2e2;color:#dc2626;}.activity-content{flex:1;min-width:0;}.activity-content strong{color:var(--text);}.activity-content .highlight{color:var(--primary);font-weight:500;}.activity-time{display:block;font-size:0.6875rem;color:var(--text-muted);margin-top:var(--sp-1);}.activity-header{display:flex;flex-wrap:wrap;gap:var(--sp-1);align-items:baseline;}.activity-user{font-size:0.75rem;color:var(--text-secondary);padding:1px 6px;background:var(--gray-100);border-radius:4px;margin-right:4px;}.activity-changes{margin-top:var(--sp-2);padding:var(--sp-2);background:var(--gray-50);border-radius:6px;font-size:0.75rem;}.activity-change-item{display:flex;flex-wrap:wrap;gap:4px;padding:2px 0;align-items:center;}.activity-change-item .change-label{font-weight:500;color:var(--text-secondary);min-width:60px;}.activity-change-item .change-old{color:var(--danger);text-decoration:line-through;opacity:0.8;}.activity-change-item .change-arrow{color:var(--text-muted);margin:0 4px;}.activity-change-item .change-new{color:var(--success);font-weight:500;}.activity-icon.icon-update{background:#fef3c7;color:#d97706;}.notification-bell{position:relative;width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;border-radius:50%;transition:background var(--ease-fast);color:var(--slate-600);font-size:1.25rem;}.notification-bell:hover{background:var(--slate-100);}.notification-badge{position:absolute;top:2px;right:2px;min-width:18px;height:18px;background:var(--danger);color:#fff;font-size:0.625rem;font-weight:700;border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;padding:0 4px;animation:notificationPulse 2s ease-in-out infinite;}@keyframes notificationPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.1);}}.notification-panel{position:absolute;top:100%;right:0;width:320px;max-height:400px;background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur-strong);-webkit-backdrop-filter:var(--glass-blur-strong);border:1px solid var(--glass-border-strong);border-radius:var(--radius-lg);box-shadow:var(--glass-shadow-elevated),var(--glass-inner-glow);overflow:hidden;z-index:1000;animation:slideDown 0.2s ease;}@keyframes slideDown{from{opacity:0;transform:translateY(-10px);}to{opacity:1;transform:translateY(0);}}.notification-header{padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}.notification-title{font-weight:600;font-size:0.875rem;color:var(--text);}.notification-clear{font-size:0.75rem;color:var(--primary);cursor:pointer;}.notification-list{max-height:300px;overflow-y:auto;}.notification-item{padding:0.75rem 1rem 0.75rem 1rem;border-bottom:1px solid var(--gray-100);cursor:pointer;transition:background 0.15s ease;position:relative;}.notification-item.unread{background:var(--primary-50);border-left:4px solid var(--primary);padding-left:calc(1rem - 4px);}.notification-item.unread .notification-item-title{font-weight:700;color:var(--text);}.notification-item:not(.unread){opacity:0.65;}.notification-item:not(.unread) .notification-item-title{font-weight:400;}.notification-item:hover{background:var(--gray-50);}.notification-item.unread:hover{background:var(--primary-100);}.notification-item-title{font-size:0.8125rem;font-weight:500;color:var(--text);margin-bottom:var(--sp-1);}.notification-item-desc{font-size:0.75rem;color:var(--text-muted);}.notification-empty{padding:var(--sp-6);text-align:center;color:var(--text-muted);font-size:0.875rem;}.notification-actions{display:flex;align-items:center;gap:var(--sp-2);}.notification-history-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;font-size:0.75rem;font-weight:500;color:var(--primary);background:var(--primary-50,rgba(59,130,246,0.08));border:1px solid var(--primary-200,rgba(59,130,246,0.2));border-radius:var(--radius-md);cursor:pointer;transition:background 0.15s ease,border-color 0.15s ease;white-space:nowrap;}.notification-history-btn:hover{background:var(--primary-100,rgba(59,130,246,0.15));border-color:var(--primary);}.notification-history-btn svg{flex-shrink:0;}.notif-date-separator{display:flex;align-items:center;gap:12px;padding:10px 16px 6px;position:sticky;top:0;background:var(--surface,#fff);z-index:1;}.notif-date-separator::before,.notif-date-separator::after{content:'';flex:1;height:1px;background:var(--border,#e2e8f0);}.notif-date-label{font-size:12px;font-weight:600;color:var(--text-muted,#94a3b8);white-space:nowrap;letter-spacing:0.02em;}.notif-history-item{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border-subtle,#f1f5f9);cursor:pointer;transition:background 0.15s ease;}.notif-history-item:last-child{border-bottom:none;}.notif-history-item:hover{background:var(--bg-subtle,#f8fafc);}.notif-history-item.unread{background:var(--primary-50,rgba(59,130,246,0.05));border-left:3px solid var(--primary);padding-left:13px;}.notif-history-item.unread:hover{background:var(--primary-100,rgba(59,130,246,0.1));}.notif-icon{flex-shrink:0;width:32px;height:32px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;background:var(--bg-subtle,#f1f5f9);color:var(--text-secondary);}.notif-icon.type-warning{background:#fef3c7;color:#d97706;}.notif-icon.type-security{background:#fee2e2;color:#dc2626;}.notif-icon.type-expiry{background:#fce7f3;color:#db2777;}.notif-icon.type-success{background:#dcfce7;color:#16a34a;}.notif-icon.type-info{background:#dbeafe;color:#2563eb;}.notif-content{flex:1;min-width:0;}.notif-title{font-size:0.8125rem;font-weight:600;color:var(--text);margin-bottom:2px;line-height:1.4;}.notif-history-item:not(.unread) .notif-title{font-weight:500;color:var(--text-secondary);}.notif-message{font-size:0.75rem;color:var(--text-muted);line-height:1.4;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}.notif-meta{display:flex;align-items:center;gap:8px;font-size:0.6875rem;color:var(--text-muted);}.notif-type-badge{display:inline-flex;align-items:center;padding:1px 6px;border-radius:var(--radius-sm);font-size:0.625rem;font-weight:600;line-height:1.6;}.bulk-bar-select-wrapper{position:relative;}.bulk-bar-select{appearance:none;-webkit-appearance:none;padding:6px 28px 6px 10px;font-size:0.8125rem;font-weight:500;color:#fff;background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.3);border-radius:var(--radius-md);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;}.bulk-bar-select:focus{outline:none;border-color:rgba(255,255,255,0.6);background-color:rgba(255,255,255,0.25);}.bulk-bar-select option{background:#1e293b;color:#fff;}.bulk-status-wrapper{position:relative;}.bulk-status-popup{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#1e293b;border:1px solid rgba(255,255,255,0.15);border-radius:var(--radius-lg);box-shadow:0 -4px 16px rgba(0,0,0,0.3);overflow:hidden;z-index:210;min-width:100px;animation:popupSlideUp 0.15s ease;}@keyframes popupSlideUp{from{opacity:0;transform:translateX(-50%) translateY(8px);}to{opacity:1;transform:translateX(-50%) translateY(0);}}.bulk-status-option{display:block;width:100%;padding:10px 20px;text-align:center;background:transparent;border:none;color:#e2e8f0;font-size:0.8125rem;font-weight:500;cursor:pointer;transition:background 0.1s ease;white-space:nowrap;}.bulk-status-option:hover{background:rgba(255,255,255,0.1);color:#fff;}.bulk-status-option:not(:last-child){border-bottom:1px solid rgba(255,255,255,0.08);}.bulk-status-option.selected{background:rgba(59,130,246,0.2);color:#93c5fd;}.recv-esc{padding:12px;}.recv-esc-summary{font-size:14px;color:var(--text-secondary,#94a3b8);margin-bottom:12px;padding:0 4px;}.recv-esc-summary strong{color:var(--color-primary,#3b82f6);font-size:18px;}.recv-esc-cards{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}.recv-esc-card{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--glass-bg,rgba(255,255,255,0.06));border:1px solid var(--glass-border,rgba(255,255,255,0.1));border-radius:var(--radius-lg,12px);cursor:pointer;transition:border-color 0.15s,box-shadow 0.15s;color:var(--text-primary,#e2e8f0);font-size:13px;min-width:0;}.recv-esc-card:hover{border-color:rgba(59,130,246,0.4);box-shadow:0 2px 8px rgba(59,130,246,0.1);}.recv-esc-card.active{border-color:var(--color-primary,#3b82f6);background:rgba(59,130,246,0.12);box-shadow:0 2px 12px rgba(59,130,246,0.15);}.recv-esc-avatar{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#3b82f6,#6366f1);color:#fff;font-weight:700;font-size:14px;flex-shrink:0;}.recv-esc-card.active .recv-esc-avatar{background:linear-gradient(135deg,#2563eb,#4f46e5);}.recv-esc-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.recv-esc-count{display:flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;background:rgba(59,130,246,0.2);color:#93c5fd;border-radius:11px;font-size:12px;font-weight:700;flex-shrink:0;}.recv-esc-card.active .recv-esc-count{background:rgba(59,130,246,0.35);color:#fff;}.recv-esc-leads{animation:fadeSlideDown 0.2s ease;}@keyframes fadeSlideDown{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}.recv-esc-sub{margin-bottom:8px;}.recv-esc-sub-header{display:flex;align-items:center;gap:8px;width:100%;padding:8px 12px;background:var(--glass-bg,rgba(255,255,255,0.04));border:1px solid var(--glass-border,rgba(255,255,255,0.08));border-radius:var(--radius-md,8px);cursor:pointer;color:var(--text-primary,#e2e8f0);font-size:13px;transition:background 0.15s;}.recv-esc-sub-header:hover{background:rgba(255,255,255,0.08);}.recv-esc-sub-name{font-weight:600;}.recv-esc-sub-count{color:var(--text-secondary,#94a3b8);font-size:12px;}.recv-esc-chevron{margin-left:auto;transition:transform 0.2s;color:var(--text-secondary,#94a3b8);flex-shrink:0;}.recv-esc-sub-header.open .recv-esc-chevron{transform:rotate(180deg);}.recv-esc-sub-body{padding-left:12px;border-left:2px solid rgba(59,130,246,0.2);margin-left:16px;margin-top:4px;}.btn{position:relative;overflow:hidden;}.btn-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,0.4);transform:scale(0);animation:ripple 0.6s linear;pointer-events:none;}@keyframes ripple{to{transform:scale(4);opacity:0;}}.lead-card,.stat-card,.rate-card,.staff-card,.monitor-card{transition:transform var(--ease-fast),box-shadow var(--ease-fast);}.lead-card:hover,.stat-card:hover,.rate-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,0.08);}.donut-chart{width:120px;height:120px;position:relative;}.donut-chart svg{transform:rotate(-90deg);}.donut-chart circle{fill:none;stroke-width:20;stroke-linecap:round;}.donut-chart .donut-bg{stroke:var(--gray-100);}.donut-chart .donut-segment{transition:stroke-dasharray 0.8s ease;}.donut-chart .segment-call0{stroke:var(--gray-400);}.donut-chart .segment-call1{stroke:#3b82f6;}.donut-chart .segment-call2{stroke:#f59e0b;}.donut-chart .segment-call3{stroke:#ef4444;}.donut-chart .segment-meeting{stroke:#8b5cf6;}.donut-chart .segment-payment{stroke:#10b981;}.donut-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;}.donut-center-value{font-size:1.5rem;font-weight:700;color:var(--text);line-height:1;}.donut-center-label{font-size:0.6875rem;color:var(--text-muted);}.mini-bar-chart{display:flex;align-items:flex-end;gap:4px;height:40px;}.mini-bar{flex:1;background:linear-gradient(180deg,var(--primary) 0%,var(--primary-400) 100%);border-radius:2px 2px 0 0;min-height:4px;transition:height 0.5s ease;}.mini-bar.empty{background:var(--gray-200);}.kbd{display:inline-block;padding:0.125rem 0.375rem;font-family:ui-monospace,monospace;font-size:0.6875rem;font-weight:500;background:var(--gray-100);border:1px solid var(--gray-300);border-radius:var(--radius-sm);box-shadow:0 1px 0 var(--gray-300);color:var(--text-subtle);}.advanced-search{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);margin-bottom:var(--sp-4);}.search-filters{display:flex;flex-wrap:wrap;gap:var(--sp-3);}.search-filter-group{display:flex;flex-direction:column;gap:var(--sp-1);}.search-filter-label{font-size:0.75rem;font-weight:500;color:var(--text-subtle);}.date-range-picker{display:flex;align-items:center;gap:var(--sp-2);}.date-range-picker input{width:140px;}.date-range-separator{color:var(--text-muted);}.saved-searches{margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid var(--border);}.saved-search-tag{display:inline-flex;align-items:center;gap:var(--sp-1);padding:0.25rem 0.75rem;background:var(--gray-100);border-radius:var(--radius-full);font-size:0.75rem;cursor:pointer;transition:background-color var(--ease-fast),color var(--ease-fast);}.saved-search-tag:hover{background:var(--primary-bg);color:var(--primary);}.login-screen.visible ~ .fab,.login-screen.visible ~ .fab-menu{display:none !important;}.fab{position:fixed;bottom:var(--sp-6);right:var(--sp-6);width:56px;height:56px;border-radius:50%;background:var(--gradient-primary);color:#fff;border:none;cursor:pointer;box-shadow:0 4px 16px rgba(98,125,152,0.25);display:flex;align-items:center;justify-content:center;font-size:1.5rem;transition:transform var(--ease-fast),box-shadow var(--ease-fast);z-index:100;}.fab:hover{transform:scale(1.1);box-shadow:0 6px 24px rgba(98,125,152,0.3);}.fab:active{transform:scale(0.95);}.fab-menu{position:fixed;bottom:calc(var(--sp-6) + 70px);right:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-2);z-index:99;}.fab-menu-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-full);box-shadow:0 2px 8px rgba(0,0,0,0.1);cursor:pointer;white-space:nowrap;font-size:0.8125rem;transition:background-color var(--ease-fast),color var(--ease-fast);animation:fabMenuIn 0.2s ease backwards;}.fab-menu-item:nth-child(1){animation-delay:0s;}.fab-menu-item:nth-child(2){animation-delay:0.05s;}.fab-menu-item:nth-child(3){animation-delay:0.1s;}@keyframes fabMenuIn{from{opacity:0;transform:translateX(20px);}to{opacity:1;transform:translateX(0);}}.fab-menu-item:hover{background:var(--primary-bg);color:var(--primary);}.stats-section{margin-bottom:var(--sp-6);}.stats-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4);}.stats-section-title{font-size:1rem;font-weight:600;color:var(--text);}.stats-grid-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--sp-4);}.stats-charts-row{display:grid;grid-template-columns:1fr 2fr;gap:var(--sp-4);margin-top:var(--sp-4);}@media (max-width:768px){.stats-charts-row{grid-template-columns:1fr;}}.btn-excel{background:#217346;color:#fff;}.btn-excel:hover{background:#1a5c38;}.shortcuts-list{display:flex;flex-direction:column;gap:var(--sp-3);}.shortcut-item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;border-bottom:1px solid var(--gray-100);}.shortcut-item:last-child{border-bottom:none;}.shortcut-item span{color:var(--text-subtle);font-size:0.875rem;}.toast-success{background:var(--success);color:#fff;}@media (max-width:640px){.kpi-card{padding:var(--sp-3);}.kpi-value{font-size:1.5rem;}.notification-panel{width:calc(100vw - var(--sp-4));right:calc(var(--sp-2) * -1);}.fab{bottom:var(--sp-4);right:var(--sp-4);width:48px;height:48px;font-size:1.25rem;}}.monitor-dashboard-header{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);margin-bottom:var(--sp-5);flex-wrap:wrap;}.monitor-dashboard-header h3{font-size:var(--text-2xl);font-weight:700;color:var(--text);display:flex;align-items:center;gap:var(--sp-3);}.monitor-dashboard-header h3::before{content:'';width:3px;height:22px;background:var(--primary);border-radius:var(--radius-full);}.monitor-view-selector{display:flex;gap:var(--sp-1);background:var(--slate-100);padding:var(--sp-1);border-radius:var(--radius-xl);}.monitor-view-btn{padding:var(--sp-2) var(--sp-4);font-size:var(--text-sm);font-weight:600;color:var(--text-subtle);background:transparent;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);min-height:36px;}.monitor-view-btn:hover{color:var(--text);background:rgba(255,255,255,0.5);}.monitor-view-btn.active{color:var(--primary-700);background:var(--card);box-shadow:var(--shadow-sm);}.monitor-data-type-selector,.stats-data-type-selector{display:flex;gap:var(--sp-1);background:var(--slate-200);padding:3px;border-radius:var(--radius-xl);margin-right:var(--sp-4);}.monitor-data-type-btn,.stats-data-type-btn{padding:var(--sp-2) var(--sp-4);font-size:var(--text-sm);font-weight:600;color:var(--text-subtle);background:transparent;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);min-height:36px;white-space:nowrap;}.monitor-data-type-btn:hover,.stats-data-type-btn:hover{color:var(--text);background:rgba(255,255,255,0.5);}.monitor-data-type-btn.active,.stats-data-type-btn.active{color:#fff;background:var(--primary);box-shadow:var(--shadow-sm);}.monitor-data-type-btn[data-type="primary"].active,.stats-data-type-btn[data-type="primary"].active{background:var(--cyan-600);}.primary-monitor-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6);}.primary-monitor-stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-4) var(--sp-5);text-align:center;transition:transform var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);}.primary-monitor-stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}.pm-stat-value{font-size:28px;font-weight:800;color:var(--text);line-height:1.2;}.pm-stat-label{font-size:var(--text-sm);color:var(--text-secondary);margin-top:var(--sp-1);}.primary-monitor-stat-card.status-approved .pm-stat-value{color:var(--success);}.primary-monitor-stat-card.status-rejected .pm-stat-value{color:var(--error);}.primary-monitor-stat-card.status-distributed .pm-stat-value{color:var(--primary);}.primary-monitor-stat-card.status-converted .pm-stat-value{color:var(--cyan-600);}.primary-monitor-staff-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-4);}.primary-monitor-staff-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-4);transition:transform var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);}.primary-monitor-staff-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}.pm-staff-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--border);}.pm-staff-name{font-weight:700;font-size:var(--text-base);color:var(--text);}.pm-staff-role{font-size:var(--text-xs);color:var(--text-subtle);background:var(--slate-100);padding:2px 8px;border-radius:var(--radius-full);}.pm-staff-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);}.pm-staff-stat{text-align:center;padding:var(--sp-2);background:var(--slate-50);border-radius:var(--radius);}.pm-staff-stat-value{font-size:var(--text-lg);font-weight:700;color:var(--text);}.pm-staff-stat-label{font-size:var(--text-xs);color:var(--text-secondary);}.primary-stats-section .stats-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}.stat-card-draft{border-left-color:var(--slate-400);}.stat-card-submitted{border-left-color:var(--warning);}.stat-card-approved{border-left-color:var(--success);}.stat-card-rejected{border-left-color:var(--error);}.stat-card-distributed{border-left-color:var(--primary);}.stat-card-converted{border-left-color:var(--cyan-600);}.stat-icon-draft{background:var(--slate-100);color:var(--slate-600);}.stat-icon-submitted{background:var(--warning-light);color:var(--warning);}.stat-icon-approved{background:var(--success-light);color:var(--success);}.stat-icon-rejected{background:var(--error-light);color:var(--error);}.stat-icon-distributed{background:var(--primary-light);color:var(--primary);}.stat-icon-converted{background:rgba(8,145,178,0.1);color:var(--cyan-600);}.primary-stats-level-selector{display:flex;gap:var(--sp-1);background:var(--slate-100);padding:var(--sp-1);border-radius:var(--radius-xl);box-shadow:var(--shadow-inner);margin-bottom:var(--sp-4);width:fit-content;}.primary-stats-level-btn{padding:var(--sp-2) var(--sp-4);font-size:var(--text-sm);font-weight:500;border-radius:var(--radius-lg);border:none;background:transparent;color:var(--text-subtle);cursor:pointer;transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);}.primary-stats-level-btn:hover{color:var(--text);background:var(--slate-50);}.primary-stats-level-btn.active{background:var(--card);color:var(--text);box-shadow:var(--shadow-sm);}.primary-branch-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);background:var(--card);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);}.primary-branch-table th,.primary-branch-table td{padding:var(--sp-3) var(--sp-4);text-align:center;border-bottom:1px solid var(--border);}.primary-branch-table th{background:var(--slate-100);font-weight:600;color:var(--text);}.primary-branch-table td:first-child{text-align:left;}.primary-branch-table tr:hover{background:var(--slate-50);}.primary-branch-table .text-success{color:var(--success);font-weight:600;}.primary-branch-table .text-error{color:var(--error);}.primary-branch-table .text-primary{color:var(--primary);font-weight:600;}.primary-funnel-section{margin-top:var(--sp-6);padding:var(--sp-5);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);}.primary-funnel-section h4{margin-bottom:var(--sp-4);font-size:var(--text-base);font-weight:600;color:var(--text);}.primary-funnel-chart{display:flex;flex-direction:column;gap:var(--sp-2);}.primary-funnel-bar{display:flex;align-items:center;gap:var(--sp-3);}.primary-funnel-label{width:80px;font-size:var(--text-sm);font-weight:600;color:var(--text-secondary);text-align:right;}.primary-funnel-track{flex:1;height:28px;background:var(--slate-100);border-radius:var(--radius);overflow:hidden;}.primary-funnel-fill{height:100%;border-radius:var(--radius);display:flex;align-items:center;justify-content:flex-end;padding-right:var(--sp-2);transition:width var(--duration-slow) var(--ease-out);}.primary-funnel-fill span{font-size:var(--text-xs);font-weight:700;color:#fff;}.primary-fill{background:var(--cyan-600);}.primary-fill-success{background:var(--success);}.monitor-chips-bar{margin-bottom:var(--sp-4);flex-shrink:0;}.monitor-branch-chips,.monitor-team-chips,.monitor-trainee-chips{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;}.chips-bar-label{font-size:var(--text-sm);font-weight:600;color:var(--text-subtle);margin-right:var(--sp-2);}#monitorTraineeChipsBar{display:flex;align-items:center;}.chip{padding:var(--sp-1-5) var(--sp-3);font-size:var(--text-sm);font-weight:500;color:var(--text-subtle);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-full);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);min-height:32px;display:inline-flex;align-items:center;gap:var(--sp-1);}.chip:hover{border-color:var(--primary-300);color:var(--text);}.chip.active{background:var(--primary-bg-strong);border-color:var(--primary-300);color:var(--primary-700);font-weight:600;}.branch-drilldown-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--sp-4);padding:var(--sp-4);animation:fadeIn var(--duration-normal) var(--ease-out);}.branch-drilldown-team{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);}.branch-drilldown-team:hover{border-color:var(--primary-300);box-shadow:var(--shadow-md);transform:translateY(-2px);}.branch-drilldown-team-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--border-subtle);}.branch-drilldown-team-name{font-weight:700;font-size:var(--text-base);color:var(--text);}.branch-drilldown-team-count{font-size:var(--text-xs);color:var(--text-subtle);background:var(--slate-100);padding:2px 8px;border-radius:var(--radius-full);}.branch-drilldown-team-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);}.branch-drilldown-stat{text-align:center;padding:var(--sp-2);background:var(--slate-50);border-radius:var(--radius);}.branch-drilldown-stat-value{font-size:var(--text-lg);font-weight:700;color:var(--text);}.branch-drilldown-stat-label{font-size:var(--text-xs);color:var(--text-secondary);}.branch-drilldown-back{display:inline-flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);font-weight:500;color:var(--primary);background:var(--primary-bg);border:1px solid var(--primary-200);border-radius:var(--radius-lg);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);margin-bottom:var(--sp-4);}.branch-drilldown-back:hover{background:var(--primary-bg-strong);border-color:var(--primary-300);}.branch-drilldown-title{font-size:var(--text-lg);font-weight:700;color:var(--text);margin-bottom:var(--sp-4);padding-bottom:var(--sp-3);border-bottom:1px solid var(--border);}.stats-trainee-filter{display:flex;align-items:center;gap:var(--sp-2);margin-left:var(--sp-3);padding-left:var(--sp-3);border-left:1px solid var(--border);}.stats-trainee-chip{padding:var(--sp-1) var(--sp-2-5);font-size:var(--text-xs);font-weight:500;color:var(--text-subtle);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-full);cursor:pointer;transition:border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out);}.stats-trainee-chip:hover{border-color:var(--primary-300);color:var(--text);}.stats-trainee-chip.active{background:var(--primary-bg-strong);border-color:var(--primary-300);color:var(--primary-700);font-weight:600;}.monitor-dashboard{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--sp-5);flex:1;}.monitor-loading{grid-column:1 / -1;display:flex;align-items:center;justify-content:center;padding:var(--sp-16);}.monitor-comparison-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:var(--sp-5);box-shadow:var(--glass-shadow),var(--glass-edge-light);transition:var(--glass-transition);}.monitor-comparison-card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.10);transform:translateY(-2px);}.monitor-comparison-card.clickable{cursor:pointer;}.monitor-card-drill{font-size:var(--text-xs);color:var(--text-muted);margin-left:auto;opacity:0.5;transition:opacity 0.2s;}.monitor-comparison-card.clickable:hover .monitor-card-drill{opacity:1;color:var(--primary);}.team-drilldown-list{display:flex;flex-direction:column;gap:var(--sp-2);}.team-drilldown-member{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);background:var(--slate-50);border-radius:var(--radius-md);cursor:pointer;transition:background 0.2s;}.team-drilldown-member:hover{background:var(--slate-100);}.team-drilldown-member .member-info{display:flex;align-items:center;gap:var(--sp-3);}.team-drilldown-member .member-name{font-weight:600;color:var(--text);}.team-drilldown-member .member-role{font-size:var(--text-sm);color:var(--text-muted);}.team-drilldown-member .member-stats{display:flex;gap:var(--sp-4);}.team-drilldown-member .stat-item{font-size:var(--text-sm);color:var(--text-subtle);}.team-drilldown-member .stat-item strong{color:var(--text);}.team-drilldown-member .stat-item.text-error strong{color:var(--error);}.monitor-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4);padding-bottom:var(--sp-3);border-bottom:1px solid var(--border-subtle);}.monitor-card-title{font-size:var(--text-lg);font-weight:700;color:var(--text);}.monitor-card-badge{font-size:var(--text-xs);font-weight:600;color:var(--text-muted);background:var(--slate-100);padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-full);}.monitor-card-total{display:flex;align-items:baseline;gap:var(--sp-2);margin-bottom:var(--sp-4);}.monitor-card-total .total-value{font-size:var(--text-3xl);font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;}.monitor-card-total .total-label{font-size:var(--text-sm);color:var(--text-muted);}.monitor-stat-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;}.monitor-stat-row + .monitor-stat-row{border-top:1px solid var(--border-subtle);}.monitor-stat-label{font-size:var(--text-sm);font-weight:500;color:var(--text-subtle);min-width:64px;flex-shrink:0;}.monitor-stat-bar{flex:1;height:6px;background:var(--slate-100);border-radius:var(--radius-full);overflow:hidden;}.monitor-stat-fill{height:100%;border-radius:var(--radius-full);transition:width 0.5s var(--ease-out);min-width:0;}.monitor-stat-fill.fill-call0{background:var(--slate-400);}.monitor-stat-fill.fill-call1{background:#60a5fa;}.monitor-stat-fill.fill-call2{background:var(--primary-400);}.monitor-stat-fill.fill-call3{background:#f87171;}.monitor-stat-fill.fill-meeting{background:#34d399;}.monitor-stat-fill.fill-payment{background:var(--primary);}.monitor-stat-value{font-size:var(--text-sm);font-weight:600;color:var(--text);min-width:48px;text-align:right;font-variant-numeric:tabular-nums;}.monitor-stat-pct{font-size:var(--text-xs);color:var(--text-muted);min-width:36px;text-align:right;}.monitor-staff-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:var(--sp-4);cursor:pointer;transition:var(--glass-transition);box-shadow:var(--glass-shadow),var(--glass-edge-light);}.monitor-staff-card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.10);transform:translateY(-2px);}.monitor-staff-name{font-size:var(--text-md);font-weight:600;color:var(--text);margin-bottom:var(--sp-1);}.monitor-staff-role{font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--sp-3);}.monitor-staff-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-2);}.monitor-staff-stat{text-align:center;}.monitor-staff-stat-value{font-size:var(--text-lg);font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}.monitor-staff-stat-label{font-size:0.625rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wider);}.monitor-staff-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:var(--sp-3);}.monitor-staff-info{flex:1;}.monitor-staff-name{display:flex;align-items:center;gap:var(--sp-2);}.monitor-rank-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:20px;font-size:11px;font-weight:700;border-radius:var(--radius-full);padding:0 6px;}.monitor-rank-badge.rank-1{background:linear-gradient(135deg,#ffd700,#ffb800);color:#7c5800;}.monitor-rank-badge.rank-2{background:linear-gradient(135deg,#c0c0c0,#a8a8a8);color:#505050;}.monitor-rank-badge.rank-3{background:linear-gradient(135deg,#cd7f32,#a86428);color:#fff;}.monitor-rank-badge.rank-other{background:var(--slate-100);color:var(--text-muted);}.monitor-staff-delta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:11px;font-weight:600;}.monitor-staff-delta .delta-up{color:var(--success);}.monitor-staff-delta .delta-down{color:var(--error);}.monitor-staff-delta .delta-same{color:var(--text-muted);}.monitor-staff-rates{display:flex;gap:var(--sp-3);margin-top:var(--sp-3);padding-top:var(--sp-3);border-top:1px solid var(--border-subtle);}.monitor-staff-rates .rate-item{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;}.monitor-staff-rates .rate-label{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px;}.monitor-staff-rates .rate-value{font-size:var(--text-sm);font-weight:700;color:var(--primary);}.monitor-staff-rates .rate-value.text-error{color:var(--error);}.monitor-staff-calls{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2);margin-top:var(--sp-3);padding:var(--sp-2) 0;background:var(--surface-subtle);border-radius:var(--radius-md);}.monitor-staff-calls .call-item{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--sp-1) 0;}.monitor-staff-calls .call-label{font-size:10px;color:var(--text-muted);font-weight:500;}.monitor-staff-calls .call-value{font-size:var(--text-md);font-weight:700;color:var(--text);font-variant-numeric:tabular-nums;}.monitor-staff-calls .call-pct{font-size:10px;color:var(--text-subtle);}.monitor-staff-calls .call-item.call-warning{background:rgba(239,68,68,0.1);border-radius:var(--radius-sm);}.monitor-staff-calls .call-item.call-warning .call-value,.monitor-staff-calls .call-item.call-warning .call-pct{color:var(--error);}.role-line-selector{display:flex;gap:var(--sp-2);background:var(--slate-100);padding:var(--sp-1);border-radius:var(--radius-lg);}.role-line-btn{flex:1;padding:var(--sp-2) var(--sp-4);font-size:var(--text-sm);font-weight:600;color:var(--text-subtle);background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);}.role-line-btn:hover{color:var(--text);}.role-line-btn.active{background:var(--card);color:var(--primary-700);box-shadow:var(--shadow-sm);}.role-type-selector{display:flex;flex-direction:column;gap:var(--sp-2);}.radio-card{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--surface-subtle);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);}.radio-card:hover{background:var(--surface);border-color:var(--primary-200);}.radio-card:has(input:checked){background:var(--primary-bg);border-color:var(--primary-300);}.radio-card input[type="radio"]{width:18px;height:18px;margin:0;accent-color:var(--primary);}.radio-card-label{font-weight:600;color:var(--text);font-size:var(--text-sm);}.radio-card-desc{font-size:var(--text-xs);color:var(--text-muted);margin-left:auto;}.import-body{padding:var(--sp-5) var(--sp-6);overflow-y:auto;max-height:70vh;}.import-steps-indicator{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-6);padding-bottom:var(--sp-4);border-bottom:1px solid var(--border-subtle);}.import-steps-indicator .step{font-size:var(--text-sm);font-weight:500;color:var(--text-muted);padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-full);background:var(--slate-100);}.import-steps-indicator .step.active{color:var(--primary-700);background:var(--primary-bg-strong);font-weight:600;}.import-steps-indicator .step.done{color:var(--success);background:var(--success-bg);}.import-dropzone{border:2px dashed var(--border);border-radius:var(--radius-xl);padding:var(--sp-10) var(--sp-6);text-align:center;cursor:pointer;transition:border-color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out);background:var(--bg-sunken);margin-bottom:var(--sp-5);}.import-dropzone:hover{border-color:var(--primary-300);background:var(--primary-bg);}.import-dropzone.dragover{border-color:var(--primary);background:var(--primary-bg-strong);border-style:solid;}.dropzone-icon{font-size:2rem;margin-bottom:var(--sp-3);opacity:0.6;}.dropzone-text{font-size:var(--text-md);font-weight:600;color:var(--text-secondary);margin-bottom:var(--sp-1);}.dropzone-hint{font-size:var(--text-xs);color:var(--text-muted);}.import-paste-section{margin-bottom:var(--sp-5);}.import-paste-section label{display:block;font-size:var(--text-sm);font-weight:600;color:var(--text-secondary);margin-bottom:var(--sp-2);}.import-paste-area{width:100%;padding:var(--sp-3) var(--sp-4);font-size:var(--text-sm);font-family:var(--font-mono);border:1.5px solid var(--border);border-radius:var(--radius-lg);background:var(--bg);color:var(--text);resize:vertical;transition:border-color var(--duration-fast) var(--ease-out);}.import-paste-area:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.import-preview-header{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-3);font-size:var(--text-sm);font-weight:600;}.import-preview-table-wrap{overflow-x:auto;margin-bottom:var(--sp-4);border:1px solid var(--border);border-radius:var(--radius-lg);}.import-preview-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}.import-preview-table th{background:var(--slate-50);padding:var(--sp-2-5) var(--sp-3);text-align:left;font-weight:600;color:var(--text-subtle);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-wider);border-bottom:1px solid var(--border);white-space:nowrap;}.import-preview-table td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border-subtle);color:var(--text);}.import-preview-table td[contenteditable="true"]{cursor:text;outline:none;transition:background var(--duration-fast) var(--ease-out);}.import-preview-table td[contenteditable="true"]:focus{background:var(--primary-bg);}.import-preview-table tr:last-child td{border-bottom:none;}.import-preview-table .row-remove{color:var(--text-muted);cursor:pointer;text-align:center;font-size:var(--text-lg);padding:0 var(--sp-2);}.import-preview-table .row-remove:hover{color:var(--danger);}.import-preview-table .notes-cell{white-space:pre-wrap;word-break:break-word;max-width:250px;min-width:100px;}.import-failed-section{padding:var(--sp-4);background:var(--danger-bg);border:1px solid rgba(220,38,38,0.1);border-radius:var(--radius-lg);margin-bottom:var(--sp-4);}.import-failed-section h4{font-size:var(--text-md);font-weight:600;color:var(--danger);margin-bottom:var(--sp-1);}.import-step-actions{display:flex;justify-content:flex-end;gap:var(--sp-3);padding-top:var(--sp-4);border-top:1px solid var(--border-subtle);}.import-result{text-align:center;padding:var(--sp-8) var(--sp-4);}.import-result-icon{width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;background:var(--success-bg);color:var(--success);font-size:var(--text-2xl);font-weight:700;border-radius:var(--radius-full);margin-bottom:var(--sp-4);}.import-result h3{font-size:var(--text-xl);margin-bottom:var(--sp-2);}.import-result p{color:var(--text-subtle);font-size:var(--text-md);}.import-result-stats{display:flex;justify-content:center;gap:var(--sp-6);margin-top:var(--sp-5);}.import-result-stats > div{text-align:center;}.import-result-stats .stat-num{font-size:var(--text-3xl);font-weight:800;color:var(--text);font-variant-numeric:tabular-nums;}.import-result-stats .stat-lbl{font-size:var(--text-xs);color:var(--text-muted);}.import-failed-details{margin-top:var(--sp-4);padding:var(--sp-4);background:var(--bg-sunken);border-radius:var(--radius-lg);max-height:200px;overflow-y:auto;text-align:left;}.import-failed-list h4{font-size:var(--text-sm);font-weight:600;color:var(--danger);margin-bottom:var(--sp-2);}.import-failed-list ul{list-style:none;padding:0;margin:0;}.import-failed-list li{font-size:var(--text-xs);color:var(--text-secondary);padding:var(--sp-2);border-bottom:1px solid var(--border);}.import-failed-list li:last-child{border-bottom:none;}.import-failed-list .error-reason{color:var(--danger);font-weight:500;}.parse-verify-body{padding:var(--sp-5) var(--sp-6);overflow-y:auto;max-height:60vh;display:flex;flex-direction:column;gap:var(--sp-4);}.parse-verify-item{background:var(--bg-sunken);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);}.parse-verify-original{font-size:var(--text-sm);font-family:var(--font-mono);color:var(--text-subtle);padding:var(--sp-2) var(--sp-3);background:var(--card);border-radius:var(--radius-md);margin-bottom:var(--sp-3);word-break:break-all;}.parse-verify-fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);}.parse-verify-fields input{width:100%;padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);}.parse-verify-fields input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-ring);}.input-error{border-color:var(--danger) !important;background:var(--danger-bg) !important;}.field-error-msg{font-size:var(--text-xs);color:var(--danger);margin-top:var(--sp-1);display:flex;align-items:center;gap:var(--sp-1);}.skeleton{position:relative;overflow:hidden;background:var(--slate-100) !important;color:transparent !important;border-color:transparent !important;pointer-events:none;}.skeleton *{visibility:hidden;}.skeleton::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,0.5) 50%,transparent 100%);animation:skeletonShimmer 1.5s ease-in-out infinite;}@keyframes skeletonShimmer{0%{transform:translateX(-100%);}100%{transform:translateX(100%);}}.empty-state-cta{text-align:center;padding:var(--sp-12) var(--sp-4);}.empty-state-cta .empty-icon{font-size:2.5rem;opacity:0.4;margin-bottom:var(--sp-4);}.empty-state-cta p{font-size:var(--text-md);color:var(--text-muted);margin-bottom:var(--sp-5);}.skip-link{position:absolute;top:-40px;left:0;background:var(--primary);color:var(--text-inverted);padding:var(--sp-2) var(--sp-4);z-index:var(--z-max);border-radius:0 0 var(--radius-md) 0;font-weight:600;transition:top var(--duration-fast) var(--ease-out);}.skip-link:focus{top:0;}@media (max-width:768px){.monitor-dashboard-header{flex-direction:column;align-items:flex-start;}.monitor-view-selector{width:100%;}.monitor-view-btn{flex:1;text-align:center;}.monitor-dashboard{grid-template-columns:1fr;gap:var(--sp-4);}.monitor-staff-stats{grid-template-columns:repeat(3,1fr);}.import-body{padding:var(--sp-4);}.import-dropzone{padding:var(--sp-6) var(--sp-4);}.parse-verify-fields{grid-template-columns:1fr;}}@media (max-width:480px){.monitor-branch-chips,.monitor-team-chips{gap:var(--sp-1);}.chip{padding:var(--sp-1) var(--sp-2);font-size:var(--text-xs);min-height:28px;}.monitor-comparison-card{padding:var(--sp-4);}.import-preview-table{font-size:var(--text-xs);}.import-preview-table th,.import-preview-table td{padding:var(--sp-1-5) var(--sp-2);}}.toast-undo{background:var(--slate-800);color:#fff;display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);}.btn-undo{background:transparent;color:var(--primary-200);border:1px solid var(--primary-300);padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);white-space:nowrap;}.btn-undo:hover{background:rgba(255,255,255,0.15);color:#fff;}.bulk-status-select{padding:var(--sp-1-5) var(--sp-3);border:1px solid rgba(255,255,255,0.3);border-radius:var(--radius-md);background:rgba(255,255,255,0.15);color:#fff;font-size:var(--text-sm);font-weight:500;cursor:pointer;}.bulk-status-select option{background:var(--slate-800);color:#fff;}.bulk-status-btn{padding:var(--sp-1-5) var(--sp-3);background:rgba(255,255,255,0.2);color:#fff;border:1px solid rgba(255,255,255,0.3);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:background var(--duration-fast) var(--ease-out);}.bulk-status-btn:hover{background:rgba(255,255,255,0.3);}.btn:disabled,.btn[disabled]{opacity:0.6;cursor:not-allowed;pointer-events:none;}.main-app{display:flex;min-height:100vh;flex-direction:row;}.sidebar{width:240px;min-width:240px;background:#ffffff;border-right:1px solid #e2e8f0;box-shadow:2px 0 8px rgba(0,0,0,0.04);color:#334155;display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:var(--z-fixed);transition:width var(--duration-slow) var(--ease-in-out),min-width var(--duration-slow) var(--ease-in-out);overflow:hidden;}.sidebar.collapsed{width:64px;min-width:64px;}.sidebar-header{display:flex;align-items:center;justify-content:center;padding:var(--sp-3);border-bottom:1px solid #f1f5f9;height:64px;flex-shrink:0;}.sidebar:not(.collapsed) .sidebar-header{justify-content:flex-start;padding:var(--sp-3) var(--sp-4);}.sidebar-logo-btn{position:relative;height:36px;min-width:36px;display:flex;align-items:center;justify-content:flex-start;background:transparent;border:none;cursor:pointer;padding:0;border-radius:var(--radius-md);transition:background 0.2s ease;}.sidebar-logo-btn:hover{background:rgba(0,0,0,0.04);}.sidebar-logo{height:32px;width:auto;object-fit:contain;transition:opacity 0.3s ease,transform 0.3s ease;}.sidebar-logo-full{opacity:1;transform:scale(1);}.sidebar-logo-icon{position:absolute;left:4px;height:32px;max-height:32px;width:auto;opacity:0;transform:scale(0.8);object-fit:contain;}.sidebar.collapsed .sidebar-logo-btn{justify-content:center;width:100%;height:44px;padding:6px;}.sidebar.collapsed .sidebar-logo-full{opacity:0;transform:scale(0.8);position:absolute;pointer-events:none;}.sidebar.collapsed .sidebar-logo-icon{opacity:1;transform:scale(1);position:relative;left:0;height:32px;max-height:32px;}.sidebar-nav{flex:1;padding:var(--sp-3) var(--sp-2);display:flex;flex-direction:column;gap:var(--sp-1);overflow-y:auto;scrollbar-width:none;}.sidebar-nav::-webkit-scrollbar{display:none;}.sidebar-nav-item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2-5) var(--sp-3);background:transparent;border:none;color:#64748b;font-size:var(--text-sm);font-weight:500;cursor:pointer;border-radius:10px;transition:background 0.2s ease,color 0.2s ease;white-space:nowrap;width:100%;text-align:left;min-height:44px;position:relative;}.sidebar-nav-item:hover{background:#f8fafc;color:#334155;}.sidebar-nav-item.active{background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);color:#2563eb;font-weight:600;box-shadow:none;}.sidebar-nav-item.active::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:24px;background:#3b82f6;border-radius:0 4px 4px 0;}.sidebar-icon{width:20px;height:20px;flex-shrink:0;}.sidebar-nav-label{opacity:1;transition:opacity var(--duration-normal) var(--ease-out);overflow:hidden;}.sidebar.collapsed .sidebar-nav-label{opacity:0;width:0;}.sidebar.collapsed .sidebar-nav-item{justify-content:center;padding:var(--sp-2-5) 0;}.sidebar-footer{border-top:1px solid #f1f5f9;padding:var(--sp-3) var(--sp-2);flex-shrink:0;}.sidebar-footer-btn{display:flex;align-items:center;gap:var(--sp-3);width:100%;padding:var(--sp-2-5) var(--sp-3);background:transparent;border:none;color:#64748b;font-size:var(--text-sm);cursor:pointer;border-radius:var(--radius-lg);transition:background 0.15s ease-out,color 0.15s ease-out;}.sidebar-footer-btn:hover{background:#f8fafc;color:#334155;}.sidebar.collapsed .sidebar-footer-btn{justify-content:center;padding:var(--sp-2-5) 0;}.main-content{flex:1;margin-left:240px;display:flex;flex-direction:column;min-height:100vh;transition:margin-left var(--duration-slow) var(--ease-in-out);min-width:0;}.sidebar.collapsed ~ .main-content{margin-left:64px;}.page-title{font-size:var(--text-xl);font-weight:700;color:var(--text);letter-spacing:var(--tracking-tight);}.mobile-sidebar-toggle{display:none;background:none;border:none;color:var(--text);cursor:pointer;padding:var(--sp-1);border-radius:var(--radius-md);transition:background var(--duration-fast) var(--ease-out);}.mobile-sidebar-toggle:hover{background:rgba(0,0,0,0.06);}.header-logout-btn{color:var(--text-secondary);border:1.5px solid rgba(0,0,0,0.12);font-size:var(--text-sm);font-weight:600;padding:var(--sp-2) var(--sp-4);min-height:36px;border-radius:var(--radius-lg);background:#ffffff;transition:background 0.15s ease-out,border-color 0.15s ease-out,color 0.15s ease-out;}.header-logout-btn:hover{color:var(--text);border-color:rgba(0,0,0,0.2);background:#f8fafc;}.mobile-tabbar{display:none;position:fixed;bottom:0;left:0;right:0;height:60px;background:var(--card);border-top:1px solid var(--border);z-index:var(--z-fixed);justify-content:space-around;align-items:center;padding:0 var(--sp-2);box-shadow:0 -2px 10px rgba(0,0,0,0.05);}.mobile-tab-item{display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;color:var(--text-muted);font-size:0.625rem;font-weight:500;cursor:pointer;padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-md);transition:color var(--duration-fast) var(--ease-out);min-width:56px;}.mobile-tab-item svg{width:22px;height:22px;}.mobile-tab-item.active{color:var(--primary);font-weight:600;}.mobile-tab-item:hover{color:var(--primary-hover);}.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,0.5);z-index:calc(var(--z-fixed) - 1);opacity:0;transition:opacity var(--duration-normal) var(--ease-out);}.sidebar-overlay.active{display:block;opacity:1;}.dashboard-home{display:flex;flex-direction:column;gap:var(--sp-6);}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4);min-height:140px;}.kpi-card.kpi-accent{border-left:3px solid var(--primary);}.kpi-card.kpi-accent .kpi-value{color:var(--primary-700);}.dashboard-charts-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-5);min-height:300px;}.dashboard-chart-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-card);}.card-header-simple{padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--border-subtle);}.card-header-simple h3{font-size:var(--text-md);font-weight:600;color:var(--text);}.chart-area{padding:var(--sp-5);display:flex;align-items:center;justify-content:center;min-height:200px;}.donut-chart-wrapper{display:flex;align-items:center;gap:var(--sp-5);min-height:180px;}.donut-legend{display:flex;flex-direction:column;gap:var(--sp-2);font-size:var(--text-sm);}.donut-legend-item{display:flex;align-items:center;gap:var(--sp-2);}.donut-legend-dot{width:10px;height:10px;border-radius:var(--radius-full);flex-shrink:0;}.donut-legend-label{color:var(--text-subtle);font-size:var(--text-xs);}.donut-legend-value{font-weight:600;color:var(--text);font-size:var(--text-xs);margin-left:auto;font-variant-numeric:tabular-nums;}.donut-legend-item.drilldown-clickable{cursor:pointer;padding:var(--sp-1) var(--sp-2);margin:calc(-1 * var(--sp-1)) calc(-1 * var(--sp-2));border-radius:var(--radius-sm);transition:background 0.15s ease;}.donut-legend-item.drilldown-clickable:hover{background:var(--surface-hover);}.drilldown-modal-content{max-width:600px;width:95%;}.drilldown-total{font-size:var(--text-sm);color:var(--text-subtle);font-weight:500;margin-left:auto;margin-right:var(--sp-4);}.drilldown-breadcrumb{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);background:var(--surface);border-bottom:1px solid var(--border);font-size:var(--text-sm);flex-wrap:wrap;}.drilldown-back-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:var(--surface-hover);border-radius:var(--radius-sm);cursor:pointer;color:var(--text);margin-right:var(--sp-2);transition:background 0.15s ease;}.drilldown-back-btn:hover{background:var(--border);}.breadcrumb-item{color:var(--text-subtle);}.breadcrumb-item.breadcrumb-clickable{color:var(--primary);cursor:pointer;}.breadcrumb-item.breadcrumb-clickable:hover{text-decoration:underline;}.breadcrumb-separator{color:var(--text-muted);margin:0 var(--sp-1);}.drilldown-body{padding:0;max-height:60vh;overflow-y:auto;}.drilldown-list{display:flex;flex-direction:column;}.drilldown-loading,.drilldown-empty{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);padding:var(--sp-8);color:var(--text-subtle);font-size:var(--text-sm);}.drilldown-item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-light);transition:background 0.15s ease;}.drilldown-item:last-child{border-bottom:none;}.drilldown-item-clickable{cursor:pointer;}.drilldown-item-clickable:hover{background:var(--surface-hover);}.drilldown-item-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);flex-shrink:0;}.drilldown-branch .drilldown-item-icon{background:rgba(59,130,246,0.1);color:#3b82f6;}.drilldown-team .drilldown-item-icon{background:rgba(139,92,246,0.1);color:#8b5cf6;}.drilldown-member .drilldown-item-icon{background:rgba(16,185,129,0.1);color:#10b981;}.drilldown-item-info{flex:1;min-width:0;}.drilldown-item-name{font-weight:500;color:var(--text);font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.drilldown-item-count{font-size:var(--text-xs);color:var(--text-subtle);margin-top:2px;}.drilldown-arrow{color:var(--text-muted);flex-shrink:0;}.dashboard-activity-card{display:flex;flex-direction:column;}.activity-feed-time{font-size:var(--text-xs);color:var(--text-muted);min-width:90px;text-align:right;}.quick-actions{display:flex;gap:var(--sp-3);flex-wrap:wrap;position:relative;z-index:10;min-height:48px;}.quick-action-btn{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-5);background:var(--card);border:1.5px solid var(--border);border-radius:var(--radius-xl);color:var(--text-secondary);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:border-color var(--duration-normal) var(--ease-out),color var(--duration-normal) var(--ease-out),background-color var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out);min-height:48px;}.quick-action-btn svg{width:18px;height:18px;}.quick-action-btn:hover{border-color:var(--primary-300);color:var(--primary-700);background:var(--primary-bg);transform:translateY(-1px);box-shadow:var(--shadow-sm);}.kanban-board{display:flex;gap:var(--sp-4);overflow-x:auto;padding-bottom:var(--sp-4);min-height:calc(100vh - 200px);-webkit-overflow-scrolling:touch;}.kanban-column{flex:0 0 280px;background:var(--bg-sunken);border-radius:var(--radius-xl);display:flex;flex-direction:column;max-height:calc(100vh - 180px);border:1px solid var(--border-subtle);}.kanban-column-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);flex-shrink:0;background:var(--card);border-radius:var(--radius-xl) var(--radius-xl) 0 0;}.kanban-col-title{font-size:var(--text-sm);font-weight:700;color:var(--text);}.kanban-col-count{font-size:var(--text-xs);font-weight:700;color:var(--text-muted);background:var(--slate-100);padding:2px 8px;border-radius:var(--radius-full);font-variant-numeric:tabular-nums;}.kanban-column-body{flex:1;padding:var(--sp-3);overflow-y:auto;display:flex;flex-direction:column;gap:var(--sp-2);min-height:100px;}.kanban-column-body.drag-over{background:var(--primary-bg);border:2px dashed var(--primary-300);border-radius:0 0 var(--radius-xl) var(--radius-xl);}.kanban-col-done .kanban-column-header{background:var(--success-bg);}.kanban-col-done .kanban-col-title{color:var(--success);}.kanban-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-3);cursor:grab;transition:box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),opacity var(--duration-fast) var(--ease-out);box-shadow:var(--shadow-xs);}.kanban-card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px);}.kanban-card.dragging{opacity:0.5;cursor:grabbing;box-shadow:var(--shadow-xl);transform:rotate(2deg);}.kanban-card-name{font-size:var(--text-sm);font-weight:600;color:var(--text);margin-bottom:var(--sp-1);}.kanban-card-phone{font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--sp-2);}.kanban-card-badges{display:flex;gap:var(--sp-1);flex-wrap:wrap;}.kanban-card-date{font-size:0.625rem;color:var(--text-muted);margin-top:var(--sp-2);}.stats-bar-chart-section{margin-bottom:var(--sp-6);flex-shrink:0;}.stats-bar-chart-section h4{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--sp-4);color:var(--text);}.bar-chart-container{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-5);box-shadow:var(--shadow-card);}.bar-chart-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;}.bar-chart-row + .bar-chart-row{border-top:1px solid var(--border-subtle);}.bar-chart-label{font-size:var(--text-sm);font-weight:500;color:var(--text-subtle);min-width:56px;flex-shrink:0;}.bar-chart-track{flex:1;height:24px;background:var(--slate-100);border-radius:var(--radius-md);overflow:hidden;position:relative;}.bar-chart-fill{height:100%;border-radius:var(--radius-md);transition:width 0.6s var(--ease-out);display:flex;align-items:center;justify-content:flex-end;padding-right:var(--sp-2);min-width:0;}.bar-chart-fill-text{font-size:0.625rem;font-weight:700;color:#fff;white-space:nowrap;}.bar-chart-value{font-size:var(--text-sm);font-weight:600;color:var(--text);min-width:40px;text-align:right;font-variant-numeric:tabular-nums;flex-shrink:0;}.search-input-wrapper{position:relative;display:flex;align-items:center;}.search-input-wrapper .search-icon{position:absolute;left:var(--sp-3);width:16px;height:16px;color:var(--text-muted);pointer-events:none;}.search-input-wrapper .search-input{padding-left:calc(var(--sp-3) + 20px);}.filter-select{padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);color:var(--text);min-height:36px;transition:border-color var(--duration-fast) var(--ease-out);}.filter-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.filter-date-input{padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);color:var(--text);min-height:36px;transition:border-color var(--duration-fast) var(--ease-out);}.filter-date-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.monitor-controls{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;}.monitor-refresh-info{display:flex;align-items:center;gap:var(--sp-3);font-size:var(--text-xs);color:var(--text-muted);}.monitor-last-refresh{font-weight:500;}.monitor-auto-refresh-label{display:flex;align-items:center;gap:var(--sp-1);cursor:pointer;font-size:var(--text-xs);color:var(--text-subtle);}.monitor-auto-refresh-label input[type="checkbox"]{width:16px;height:16px;cursor:pointer;accent-color:var(--primary);}.toast-container{position:fixed;top:var(--sp-5);right:var(--sp-5);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--sp-2);max-width:380px;pointer-events:none;}.toast-item{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:#ffffff;background:rgba(255,255,255,0.97);border:1.5px solid var(--border);border-radius:var(--radius-lg);box-shadow:0 8px 32px rgba(0,0,0,0.15),0 2px 8px rgba(0,0,0,0.08);font-size:var(--text-sm);font-weight:500;color:var(--text);animation:toastSlideIn 0.3s var(--ease-spring);pointer-events:auto;transition:opacity var(--duration-normal) var(--ease-out),transform var(--duration-normal) var(--ease-out);}.toast-item.toast-success{border-left:3px solid var(--success);}.toast-item.toast-warning{border-left:3px solid var(--warning);}.toast-item.toast-error{border-left:3px solid var(--danger);}.toast-item.toast-info{border-left:3px solid var(--info);}.toast-item.removing{opacity:0;transform:translateX(100%);}.toast-item-icon{width:20px;height:20px;flex-shrink:0;}.toast-item-close{margin-left:auto;background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:var(--text-lg);padding:0;line-height:1;}@keyframes toastSlideIn{from{opacity:0;transform:translateX(100%);}to{opacity:1;transform:translateX(0);}}.preparing-icon-svg{display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-4);color:var(--warning);}@media (max-width:1024px){.sidebar{width:64px;min-width:64px;}.sidebar .sidebar-brand,.sidebar .sidebar-nav-label{opacity:0;width:0;overflow:hidden;}.sidebar .sidebar-nav-item{justify-content:center;padding:var(--sp-2-5) 0;}.sidebar .sidebar-footer-btn{justify-content:center;padding:var(--sp-2-5) 0;}.main-content{margin-left:64px;}}@media (max-width:768px){.sidebar{transform:translateX(-100%);width:180px;min-width:180px;z-index:calc(var(--z-fixed) + 1);transition:transform 0.3s ease-in-out;}.sidebar.mobile-open{transform:translateX(0);}.sidebar.mobile-open .sidebar-brand,.sidebar.mobile-open .sidebar-nav-label{opacity:1;width:auto;}.sidebar.mobile-open .sidebar-nav-item{justify-content:flex-start;padding:var(--sp-1-5) var(--sp-2-5);min-height:36px;font-size:var(--text-xs);gap:var(--sp-2);}.sidebar.mobile-open .sidebar-icon{width:18px;height:18px;}.sidebar.mobile-open .sidebar-footer-btn{justify-content:flex-start;padding:var(--sp-1-5) var(--sp-2-5);font-size:var(--text-xs);}.sidebar .sidebar-header{height:48px;padding:var(--sp-2);}.sidebar .sidebar-logo-btn{height:28px;min-width:28px;}.sidebar .sidebar-logo{height:24px;}.main-content{margin-left:0;}.mobile-sidebar-toggle{display:flex;}.mobile-tabbar{display:flex;}.tab-content{padding-bottom:calc(var(--sp-6) + 60px);}.fab{bottom:calc(var(--sp-6) + 60px);}.fab-menu{bottom:calc(var(--sp-6) + 130px);}.bulk-action-bar{bottom:60px;}.kpi-grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-3);min-height:auto;}.dashboard-charts-row{grid-template-columns:1fr;min-height:auto;}.kanban-board{min-height:auto;}.kanban-column{flex:0 0 260px;}}@media (max-width:480px){.kpi-grid{grid-template-columns:1fr 1fr;gap:var(--sp-2);min-height:auto;}.quick-actions{flex-direction:column;}.quick-action-btn{width:100%;}.kanban-column{flex:0 0 240px;}.page-title{font-size:var(--text-md);}.mobile-tabbar{height:56px;}}#dashboard-donut{width:180px;height:180px;}#dashboard-donut svg{transform:rotate(-90deg);}#dashboard-donut .donut-bg{fill:none;stroke:var(--slate-100);stroke-width:16;}#dashboard-donut .donut-segment{fill:none;stroke-width:16;stroke-linecap:round;transition:stroke-dasharray 0.8s ease;}#dashboard-donut .donut-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;}#dashboard-donut .donut-center-value{font-size:var(--text-3xl);font-weight:800;}.inline-editable{cursor:text;border-bottom:1px dashed transparent;transition:border-color 0.2s ease;padding-bottom:1px;}.inline-editable:hover{border-bottom-color:var(--color-primary);}.inline-edit-input{width:100%;padding:2px 4px;border:1px solid var(--color-primary);border-radius:4px;font-size:inherit;font-family:inherit;background:var(--surface-primary);color:var(--text-primary);outline:none;box-shadow:0 0 0 2px rgba(79,70,229,0.2);}.inline-edit-input:focus{border-color:var(--color-primary-dark);box-shadow:0 0 0 3px rgba(79,70,229,0.3);}.sort-indicator{display:inline-flex;align-items:center;gap:2px;cursor:pointer;user-select:none;}.sort-indicator:hover{color:var(--color-primary);}.sort-indicator .sort-arrow{opacity:0.3;font-size:10px;transition:opacity 0.2s;}.sort-indicator.active .sort-arrow{opacity:1;color:var(--color-primary);}.filter-sort{padding:6px 10px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-primary);color:var(--text-primary);font-size:var(--text-sm);min-width:140px;}.notification-unread-dot{width:10px;height:10px;border-radius:50%;background:var(--danger);flex-shrink:0;}.toast-item.removing{opacity:0;transform:translateX(100%);transition:opacity 0.3s ease,transform 0.3s ease;}.staff-summary{display:flex;gap:1rem;padding:1rem 0 1.25rem;border-bottom:1px solid var(--border-color);margin-bottom:1rem;flex-wrap:wrap;}.staff-summary-item{display:flex;flex-direction:column;align-items:center;min-width:60px;}.staff-summary-num{font-size:1.25rem;font-weight:700;color:var(--text-primary);}.staff-summary-num.active{color:#10b981;}.staff-summary-label{font-size:0.75rem;color:var(--text-secondary);margin-top:2px;}.staff-card-v2{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:var(--glass-bg);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);border-radius:10px;margin-bottom:0.5rem;border:1px solid var(--glass-border);transition:var(--glass-transition);box-shadow:var(--glass-shadow),var(--glass-edge-light);}.staff-card-v2:hover{box-shadow:0 4px 16px rgba(0,0,0,0.10);transform:translateY(-2px);}.staff-card-left{position:relative;flex-shrink:0;}.staff-avatar{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;color:#fff;background:var(--color-primary);}.staff-avatar.role-admin{background:#8b5cf6;}.staff-avatar.role-branch_manager{background:#3b82f6;}.staff-avatar.role-manager{background:#10b981;}.staff-avatar.role-staff{background:#6b7280;}.staff-status-dot{position:absolute;bottom:0;right:0;width:12px;height:12px;border-radius:50%;border:2px solid var(--surface-secondary);}.staff-status-dot.active{background:#10b981;}.staff-status-dot.inactive{background:#d1d5db;}.staff-card-center{flex:1;min-width:0;}.staff-card-name{font-weight:600;font-size:0.9375rem;color:var(--text-primary);margin-bottom:4px;}.staff-card-meta{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:4px;}.staff-role-tag,.staff-branch-tag,.staff-team-tag{font-size:0.6875rem;padding:2px 8px;border-radius:4px;font-weight:500;}.staff-role-tag{color:#fff;}.staff-role-tag.role-admin{background:#8b5cf6;}.staff-role-tag.role-branch_manager,.staff-role-tag.role-branch-manager{background:#3b82f6;}.staff-role-tag.role-manager{background:#10b981;}.staff-role-tag.role-staff{background:#6b7280;}.staff-role-tag.role-training-director{background:#ec4899;}.staff-role-tag.role-primary-manager{background:#f59e0b;}.staff-role-tag.role-secondary-manager{background:#10b981;}.staff-role-tag.role-primary-staff{background:#f97316;}.staff-role-tag.role-trainee{background:#a855f7;}.staff-role-tag.role-secondary-staff{background:#6b7280;}.staff-branch-tag{background:var(--surface-tertiary);color:var(--text-secondary);}.staff-team-tag{background:#fef3c7;color:#92400e;}.staff-special-team-tag{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;font-size:0.6875rem;padding:2px 10px;border-radius:4px;font-weight:600;}.staff-avatar.special-team{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;}.staff-card-details{display:flex;gap:12px;font-size:0.75rem;color:var(--text-tertiary);}.staff-card-actions{display:flex;gap:6px;flex-shrink:0;align-items:center;}.staff-self-badge{font-size:0.75rem;color:var(--color-primary);padding:4px 10px;border:1px solid var(--color-primary);border-radius:6px;font-weight:500;}.modal-content.modal-medium{max-width:480px;}.bulk-delete-body{padding:0 1.5rem 1.5rem;}.bulk-delete-warning{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;margin-bottom:1rem;font-size:0.875rem;color:#991b1b;}.bulk-delete-warning svg{flex-shrink:0;color:#ef4444;margin-top:1px;}.bulk-delete-list{max-height:320px;overflow-y:auto;border:1px solid var(--border-color);border-radius:8px;margin-bottom:1rem;}.bulk-delete-item{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--border-color);font-size:0.875rem;transition:background 0.1s;}.bulk-delete-item:last-child{border-bottom:none;}.bulk-delete-item:hover{background:var(--surface-tertiary);}.bulk-delete-item-info{display:flex;flex-direction:column;gap:2px;}.bulk-delete-item-info strong{font-size:0.875rem;}.bulk-delete-item-info span{font-size:0.75rem;color:var(--text-tertiary);}.bulk-delete-item-remove{background:none;border:none;cursor:pointer;color:var(--text-tertiary);font-size:1.25rem;padding:4px 8px;border-radius:4px;transition:color 0.15s,background 0.15s;}.bulk-delete-item-remove:hover{color:#ef4444;background:#fef2f2;}.bulk-delete-actions{display:flex;justify-content:flex-end;gap:8px;}#staffBulkActionBar{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:8px;margin-bottom:8px;flex-wrap:wrap;}#btnBulkExportTxt{margin-left:auto;}@media (max-width:640px){.staff-card-v2{flex-wrap:wrap;}.staff-card-actions{width:100%;justify-content:flex-end;padding-top:8px;border-top:1px solid var(--border-color);}.staff-card-details{flex-direction:column;gap:2px;}}.staff-filter-bar{display:flex;gap:1rem;align-items:flex-end;padding:0.75rem 1rem;background:var(--surface-secondary);border:1px solid var(--border-color);border-radius:10px;margin-bottom:1rem;flex-wrap:wrap;}.staff-filter-group{display:flex;flex-direction:column;gap:0.25rem;min-width:120px;}.staff-filter-group label{font-size:0.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:0.5px;}.staff-filter-select{padding:0.5rem 0.75rem;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-elevated);color:var(--text-primary);font-size:0.875rem;cursor:pointer;transition:border-color 0.15s ease;}.staff-filter-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--primary-ring);}.staff-search-group{flex:1;min-width:180px;}.staff-search-wrapper{position:relative;display:flex;align-items:center;}.staff-search-icon{position:absolute;left:0.625rem;width:16px;height:16px;color:var(--text-muted);pointer-events:none;}.staff-search-input{width:100%;padding:0.5rem 0.75rem 0.5rem 2rem;border:1px solid var(--border-color);border-radius:6px;background:var(--bg-elevated);color:var(--text-primary);font-size:0.875rem;transition:border-color 0.15s ease;}.staff-search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--primary-ring);}.staff-search-input::placeholder{color:var(--text-muted);}.staff-group-header{font-size:0.8125rem;font-weight:700;color:var(--text-secondary);padding:0.75rem 0.25rem 0.375rem;margin-top:0.5rem;border-bottom:1px solid var(--border-light);text-transform:uppercase;letter-spacing:0.5px;}.staff-group-count{font-weight:400;color:var(--text-muted);font-size:0.75rem;}.call3-alert-modal{border:2px solid var(--danger-500);max-width:520px;}.call3-alert-header{text-align:center;padding:1.5rem 1.5rem 1rem;background:var(--danger-50);border-bottom:1px solid var(--danger-100);border-radius:var(--radius-xl) var(--radius-xl) 0 0;}.call3-alert-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--danger-100);color:var(--danger-500);margin-bottom:0.75rem;}.call3-alert-header h3{margin:0 0 0.25rem;font-size:1.125rem;font-weight:700;color:var(--danger-600);}.call3-alert-subtitle{margin:0;font-size:0.8125rem;color:var(--danger-500);}.call3-alert-list{padding:1rem 1.5rem;max-height:300px;overflow-y:auto;}.call3-alert-item{display:flex;align-items:center;gap:0.625rem;padding:0.625rem 0.75rem;background:var(--surface-secondary);border-radius:8px;margin-bottom:0.5rem;border-left:3px solid var(--danger-500);}.call3-alert-type-badge{font-size:0.6875rem;font-weight:600;padding:2px 8px;border-radius:4px;text-transform:uppercase;flex-shrink:0;}.call3-alert-type-badge.team{background:#fef3c7;color:#92400e;}.call3-alert-type-badge.individual{background:#dbeafe;color:#1e40af;}.call3-alert-team{font-size:0.8125rem;color:var(--text-secondary);min-width:60px;}.call3-alert-name{font-size:0.875rem;font-weight:600;color:var(--text-primary);flex:1;}.call3-alert-rate{font-size:0.9375rem;font-weight:700;color:var(--danger-600);min-width:50px;text-align:right;}.call3-alert-footer{padding:1rem 1.5rem;border-top:1px solid var(--border-color);}.subordinate-leads-filter{display:flex;gap:0.375rem;padding:0.75rem 1.5rem;border-bottom:1px solid var(--border-color);flex-wrap:wrap;}.subordinate-leads-filter .filter-btn{padding:0.375rem 0.75rem;font-size:0.8125rem;}.subordinate-leads-body{overflow-x:auto;max-height:55vh;overflow-y:auto;}.subordinate-leads-table{width:100%;border-collapse:collapse;font-size:0.8125rem;}.subordinate-leads-table thead{position:sticky;top:0;z-index:1;}.subordinate-leads-table th{background:var(--bg-sunken);padding:0.625rem 0.75rem;text-align:left;font-weight:600;font-size:0.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:0.5px;border-bottom:2px solid var(--border-color);white-space:nowrap;}.subordinate-leads-table td{padding:0.5rem 0.75rem;border-bottom:1px solid var(--border-light);color:var(--text-primary);vertical-align:middle;}.subordinate-lead-row{cursor:pointer;transition:background 0.1s ease;}.subordinate-lead-row:hover{background:var(--primary-bg);}.subordinate-lead-detail td{background:var(--bg-sunken);padding:0;}.subordinate-lead-detail-content{padding:0.75rem 1rem;}.subordinate-lead-detail-content .detail-row{padding:0.25rem 0;font-size:0.8125rem;color:var(--text-secondary);}.subordinate-lead-detail-content .detail-row strong{color:var(--text-primary);margin-right:0.25rem;}.subordinate-lead-detail-content a{color:var(--info);text-decoration:none;}.subordinate-lead-detail-content a:hover{text-decoration:underline;}.badge-muted{background:var(--slate-100);color:var(--slate-500);font-size:0.6875rem;padding:2px 8px;border-radius:4px;font-weight:500;}.subordinate-leads-pagination{display:flex;align-items:center;justify-content:center;gap:0.75rem;padding:0.75rem 1rem;border-top:1px solid var(--border-color);}.sub-lead-page-info{font-size:0.8125rem;color:var(--text-secondary);}.staff-view-leads-btn{border-color:var(--info) !important;color:var(--info) !important;}.staff-view-leads-btn:hover{background:var(--info-bg) !important;}@media (max-width:768px){.staff-filter-bar{flex-direction:column;gap:0.625rem;}.staff-filter-group{width:100%;min-width:unset;}.staff-filter-select,.staff-search-input{width:100%;}.call3-alert-modal{margin:1rem;max-width:unset;}.call3-alert-item{flex-wrap:wrap;gap:0.375rem;}.subordinate-leads-filter{padding:0.5rem 1rem;}.subordinate-leads-filter .filter-btn{padding:0.25rem 0.5rem;font-size:0.75rem;}.subordinate-leads-table{font-size:0.75rem;}.subordinate-leads-table th,.subordinate-leads-table td{padding:0.375rem 0.5rem;}.staff-card-actions{gap:4px;}.staff-card-actions .btn{font-size:0.6875rem;padding:0.25rem 0.5rem;}}@media (max-width:480px){.subordinate-leads-table th:nth-child(6),.subordinate-leads-table td:nth-child(6),.subordinate-leads-table th:nth-child(7),.subordinate-leads-table td:nth-child(7){display:none;}}.filter-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;font-size:0.6875rem;font-weight:700;background:rgba(0,0,0,0.08);margin-left:4px;}.filter-btn.active .filter-count{background:rgba(255,255,255,0.25);color:inherit;}.lead-card.call-level-1{border-left:4px solid #3b82f6;}.lead-card.call-level-2{border-left:4px solid #f59e0b;}.lead-card.call-level-3{border-left:4px solid #ef4444;}.lead-card.meeting-done{border-left:4px solid #10b981;}.lead-card.payment-done{border-left:4px solid #8b5cf6;}.lead-card.meeting-done::before,.lead-card.payment-done::before{position:absolute;top:8px;left:8px;font-size:0.75rem;z-index:1;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;line-height:1;}.lead-card.meeting-done::before{content:"\2713";background:#10b981;}.lead-card.payment-done::before{content:"\2713";background:#8b5cf6;}/* Root-level modal overlays (settingsModal,notifDetailModal,call3AlertModal 등)- [id]가 있는 .modal-overlay만 대상:기존 .modal 내부의 자식 overlay는 영향 없음 */.modal-overlay[id]{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;z-index:var(--z-modal);}.settings-body{padding:0 1.5rem 1.5rem;overflow-y:auto;flex:1;min-height:0;}.settings-section{margin-bottom:1.5rem;}.settings-section-title{font-size:0.8125rem;font-weight:700;color:var(--text-subtle);text-transform:uppercase;letter-spacing:0.5px;padding-bottom:0.5rem;border-bottom:1px solid var(--border);margin-bottom:0.75rem;}.settings-item{display:flex;align-items:center;justify-content:space-between;padding:0.75rem 0;border-bottom:1px solid var(--slate-100);}.settings-item:last-child{border-bottom:none;}.settings-item-info{flex:1;min-width:0;}.settings-item-label{display:block;font-size:0.875rem;font-weight:600;color:var(--text);margin-bottom:2px;}.settings-item-desc{display:block;font-size:0.75rem;color:var(--text-muted);}.settings-toggle{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0;margin-left:1rem;}.settings-toggle input{opacity:0;width:0;height:0;}.settings-toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:var(--slate-300);border-radius:24px;transition:0.3s;}.settings-toggle-slider:before{content:"";position:absolute;height:18px;width:18px;left:3px;bottom:3px;background-color:white;border-radius:50%;transition:0.3s;}.settings-toggle input:checked + .settings-toggle-slider{background-color:var(--primary);}.settings-toggle input:checked + .settings-toggle-slider:before{transform:translateX(20px);}.settings-select{padding:0.375rem 0.75rem;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--text);font-size:0.8125rem;cursor:pointer;margin-left:1rem;}.settings-actions{padding-top:1rem;border-top:1px solid var(--border);display:flex;justify-content:flex-end;}.notif-detail-body{padding:1.5rem;}.notif-detail-type{margin-bottom:1rem;}.notif-detail-message{font-size:0.9375rem;color:var(--text);line-height:1.7;margin-bottom:1rem;white-space:pre-wrap;}.notif-detail-time{font-size:0.8125rem;color:var(--text-muted);margin-bottom:1rem;}.notif-detail-action{padding-top:1rem;border-top:1px solid var(--border);}.stat-card-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:var(--sp-3);}.stat-card-icon svg{width:20px;height:20px;}.stat-icon-total{background:var(--primary-100);color:var(--primary-700);}.stat-icon-total svg{stroke:var(--primary-700);}.stat-icon-call0{background:var(--slate-100);color:var(--slate-600);}.stat-icon-call0 svg{stroke:var(--slate-500);}.stat-icon-call1{background:#dbeafe;color:#2563eb;}.stat-icon-call1 svg{stroke:#3b82f6;}.stat-icon-call2{background:#fef3c7;color:#d97706;}.stat-icon-call2 svg{stroke:#f59e0b;}.stat-icon-call3{background:#fee2e2;color:#dc2626;}.stat-icon-call3 svg{stroke:#ef4444;}.stat-icon-meeting{background:var(--success-100);color:var(--success-600);}.stat-icon-meeting svg{stroke:var(--success-600);}.stat-icon-payment{background:var(--accent-100);color:var(--accent-600);}.stat-icon-payment svg{stroke:var(--accent-600);}.stat-card-total{border-top:3px solid var(--primary);}.stat-card-call0{border-top:3px solid var(--slate-300);}.stat-card-call1{border-top:3px solid #3b82f6;}.stat-card-call2{border-top:3px solid #f59e0b;}.stat-card-call3{border-top:3px solid #ef4444;}.stat-card-meeting{border-top:3px solid var(--success);}.stat-card-payment{border-top:3px solid var(--accent-500);}.rate-fill.payment-fill-0{background:linear-gradient(90deg,#94a3b8,#cbd5e1);}.rate-fill.payment-fill-1{background:linear-gradient(90deg,#3b82f6,#60a5fa);}.rate-fill.payment-fill-2{background:linear-gradient(90deg,#f59e0b,#fbbf24);}.rate-fill.payment-fill-3{background:linear-gradient(90deg,#ef4444,#f87171);}.rate-fill.meeting-fill-1{background:linear-gradient(90deg,#3b82f6,#93c5fd);}.rate-fill.meeting-fill-2{background:linear-gradient(90deg,#f59e0b,#fde68a);}.rate-fill.meeting-fill-3{background:linear-gradient(90deg,#ef4444,#fca5a5);}.matrix-table tbody td.matrix-heat-1{background:rgba(34,197,94,0.06);}.matrix-table tbody td.matrix-heat-2{background:rgba(34,197,94,0.12);}.matrix-table tbody td.matrix-heat-3{background:rgba(34,197,94,0.20);}.matrix-table tbody td.matrix-heat-4{background:rgba(34,197,94,0.30);}.matrix-table tbody td.matrix-heat-5{background:rgba(34,197,94,0.42);}.stats-trend-section{margin-top:var(--sp-6);padding:var(--sp-4);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);}.stats-trend-section h4{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--sp-4);color:var(--text);}.trend-chart-container{height:200px;display:flex;align-items:flex-end;gap:2px;padding:var(--sp-2) 0;border-bottom:1px solid var(--border);}.trend-chart-loading{width:100%;text-align:center;color:var(--text-muted);font-size:var(--text-sm);}.trend-bar-group{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;}.trend-bars{display:flex;gap:2px;align-items:flex-end;height:160px;}.trend-bar{width:12px;border-radius:3px 3px 0 0;transition:height 0.3s ease;}.trend-bar.bar-total{background:var(--primary);}.trend-bar.bar-meeting{background:#34d399;}.trend-bar.bar-payment{background:#f59e0b;}.trend-date{font-size:10px;color:var(--text-muted);white-space:nowrap;}.trend-legend{display:flex;justify-content:center;gap:var(--sp-4);margin-top:var(--sp-3);}.trend-legend-item{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);color:var(--text-secondary);}.legend-dot{width:10px;height:10px;border-radius:2px;}.legend-dot.legend-total{background:var(--primary);}.legend-dot.legend-meeting{background:#34d399;}.legend-dot.legend-payment{background:#f59e0b;}.stats-target-section{margin-top:var(--sp-6);padding:var(--sp-4);background:linear-gradient(135deg,var(--primary-50,#f0f4f8) 0%,var(--card) 100%);border:1px solid var(--border);border-radius:var(--radius-xl);}.target-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-4);}.target-header h4{font-size:var(--text-lg);font-weight:700;color:var(--text);margin:0;}.target-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--sp-4);}.target-card{background:var(--bg);border-radius:var(--radius-lg);padding:var(--sp-4);box-shadow:var(--shadow-sm);}.target-card-label{font-size:var(--text-sm);font-weight:600;color:var(--text-secondary);margin-bottom:var(--sp-2);}.target-card-progress{margin-bottom:var(--sp-2);}.target-progress-bar{height:8px;background:var(--slate-200);border-radius:4px;overflow:hidden;margin-bottom:6px;}.target-progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-400));border-radius:4px;transition:width 0.5s ease;}.target-progress-fill.target-fill-meeting{background:linear-gradient(90deg,#34d399,#6ee7b7);}.target-progress-fill.target-fill-payment{background:linear-gradient(90deg,#f59e0b,#fbbf24);}.target-values{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--text-muted);}.target-card-rate{font-size:var(--text-xl);font-weight:700;color:var(--primary);text-align:right;}.stats-period-bar{padding:0.75rem 0;margin-bottom:1rem;border-bottom:1px solid var(--border);}.stats-period-presets{display:flex;gap:0.375rem;flex-wrap:wrap;margin-bottom:0.5rem;}.stats-period-btn{padding:0.375rem 0.75rem;font-size:0.8125rem;font-weight:500;color:var(--text-subtle);background:var(--gray-100);border:1px solid transparent;border-radius:6px;cursor:pointer;transition:color 0.15s ease,background-color 0.15s ease,border-color 0.15s ease;}.stats-period-btn:hover{color:var(--text);background:var(--gray-200);}.stats-period-btn.active{color:#fff;background:var(--primary);border-color:var(--primary);}.stats-date-range{display:flex;align-items:center;gap:0.5rem;margin-top:0.5rem;flex-wrap:wrap;}.stats-date-input{padding:0.375rem 0.625rem;font-size:0.8125rem;border:1px solid var(--border);border-radius:6px;background:var(--card);color:var(--text);}.stats-date-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.stats-date-separator{color:var(--text-muted);font-size:0.875rem;}.stats-current-period{font-size:0.8125rem;color:var(--text-secondary);font-weight:500;margin-top:0.375rem;}.stats-current-period span{background:var(--primary-50);color:var(--primary-700);padding:0.25rem 0.75rem;border-radius:4px;display:inline-block;}@media (max-width:768px){.stats-period-presets{gap:0.25rem;}.stats-period-btn{padding:0.25rem 0.5rem;font-size:0.75rem;}}.approval-tab-badge{position:absolute;top:4px;right:4px;background:var(--danger);color:#fff;font-size:11px;font-weight:700;min-width:18px;height:18px;line-height:18px;text-align:center;border-radius:9px;padding:0 5px;}.approval-header-section{padding:var(--sp-4) 0;display:flex;flex-direction:column;gap:var(--sp-4);}.approval-header-section h3{font-size:var(--text-xl);font-weight:700;color:var(--text);margin:0;}.approval-search-bar{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center;padding:var(--sp-4);background:var(--surface-subtle);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);}.approval-search-bar .search-input-group{display:flex;align-items:center;gap:var(--sp-2);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);padding:0 var(--sp-3);flex:1;min-width:180px;max-width:280px;}.approval-search-bar .search-input-group svg{color:var(--text-muted);flex-shrink:0;}.approval-search-bar .search-input-group input{border:none;background:transparent;padding:var(--sp-2) 0;font-size:var(--text-sm);width:100%;outline:none;}.approval-select{padding:var(--sp-2) var(--sp-3);font-size:var(--text-sm);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);min-width:100px;}.date-range-group{display:flex;align-items:center;gap:var(--sp-2);}.approval-date{padding:var(--sp-2) var(--sp-2);font-size:var(--text-sm);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);}.date-separator{color:var(--text-muted);font-size:var(--text-sm);}.approval-category-bar{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4);flex-wrap:wrap;padding:var(--sp-2);background:var(--slate-100);border-radius:var(--radius-xl);}.approval-cat-btn{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-4);font-size:var(--text-sm);font-weight:500;color:var(--text-subtle);background:transparent;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);}.approval-cat-btn:hover{color:var(--text);background:rgba(255,255,255,0.5);}.approval-cat-btn.active{color:var(--primary-700);background:var(--card);box-shadow:var(--shadow-sm);}.approval-cat-btn .cat-label{font-weight:600;}.approval-cat-btn .cat-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;font-size:11px;font-weight:700;background:var(--slate-200);color:var(--text-subtle);border-radius:var(--radius-full);}.approval-cat-btn.active .cat-count{background:var(--primary-100);color:var(--primary-700);}.approval-cat-btn .cat-count.pending{background:var(--warning-bg);color:var(--warning-text);}.approval-cat-btn .cat-count.payment{background:var(--success-bg);color:var(--success);}.approval-cat-btn .cat-count.delete{background:var(--danger-bg);color:var(--danger);}.approval-cat-btn .cat-count.exchange{background:var(--info-bg);color:var(--info);}.approval-cat-btn .cat-count.transfer{background:var(--primary-bg);color:var(--primary);}.approval-cat-btn .cat-count.escalation{background:#fff3e0;color:#e65100;}.approval-header{padding:var(--sp-4) 0;}.approval-header h3{font-size:var(--text-xl);font-weight:700;color:var(--text);}.approval-filter-bar{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4);flex-wrap:wrap;}.approval-list{display:flex;flex-direction:column;gap:var(--sp-3);}.approval-card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);transition:box-shadow 0.2s;}.approval-card:hover{box-shadow:var(--shadow-md);}.approval-card-header{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-3);}.approval-type-badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:600;}.approval-type-payment_approval{background:var(--success-bg);color:var(--success);}.approval-type-delete_approval{background:var(--danger-bg);color:var(--danger);}.approval-type-exchange_approval{background:var(--info-bg);color:var(--info);}.approval-type-transfer_to_manager{background:var(--primary-bg);color:var(--primary);}.approval-type-escalation{background:#fff3e0;color:#e65100;}.approval-status-pending{color:var(--warning);font-weight:600;font-size:var(--text-sm);}.approval-status-partial{color:var(--info);font-weight:600;font-size:var(--text-sm);}.approval-status-approved{color:var(--success);font-weight:600;font-size:var(--text-sm);}.approval-status-rejected{color:var(--danger);font-weight:600;font-size:var(--text-sm);}.approval-card-body{display:flex;flex-direction:column;gap:var(--sp-1);}.approval-info{font-size:var(--text-sm);color:var(--text-muted);}.approval-label{font-weight:600;color:var(--text);}.approval-actions{display:flex;gap:var(--sp-2);margin-top:var(--sp-3);}.approval-processed{margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px dashed var(--gray-100);}.approval-reject-reason{font-size:0.75rem;color:var(--text-muted);margin-top:2px;padding-left:4px;}.approval-checkbox{flex-shrink:0;display:flex;align-items:center;}.approval-check-input{width:16px;height:16px;cursor:pointer;accent-color:var(--primary);}.approval-bulk-bar{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--primary-50);border-bottom:1px solid var(--primary-100);}.my-req-filter-btn{padding:6px 14px;border:1px solid #e2e8f0;border-radius:20px;background:#fff;font-size:13px;font-weight:500;color:#64748b;cursor:pointer;transition:background 0.15s,border-color 0.15s,color 0.15s;}.my-req-filter-btn:hover{background:#f8fafc;border-color:#cbd5e1;}.my-req-filter-btn.active{background:#1e293b;color:#fff;border-color:#1e293b;}.my-req-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:10px;border:1px solid #f1f5f9;margin-bottom:8px;transition:background 0.15s;}.my-req-item:hover{background:#f8fafc;}.my-req-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:#f1f5f9;color:#64748b;}.my-req-icon--escalation{background:#fff7ed;color:#ea580c;}.my-req-icon--exchange_approval{background:#eff6ff;color:#2563eb;}.my-req-icon--payment_approval{background:#f0fdf4;color:#16a34a;}.my-req-icon--delete_approval{background:#fef2f2;color:#dc2626;}.my-req-content{flex:1;min-width:0;}.my-req-title{display:flex;align-items:center;gap:6px;font-size:14px;color:#1e293b;}.my-req-title strong{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.my-req-type{font-size:11px;font-weight:600;padding:2px 8px;border-radius:10px;background:#f1f5f9;color:#64748b;white-space:nowrap;}.my-req-detail{font-size:12px;color:#94a3b8;display:flex;align-items:center;gap:8px;margin-top:2px;}.my-req-date{color:#cbd5e1;}.my-req-status{font-size:12px;font-weight:600;padding:4px 10px;border-radius:8px;white-space:nowrap;flex-shrink:0;}.my-req-status--pending{background:#fef3c7;color:#d97706;}.my-req-status--approved{background:#dcfce7;color:#16a34a;}.my-req-status--rejected{background:#fef2f2;color:#dc2626;}.my-req-status--cancelled{background:#f1f5f9;color:#94a3b8;}.my-req-cancel-btn{padding:4px 10px;border:1px solid #fecaca;border-radius:6px;background:#fff;color:#dc2626;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;flex-shrink:0;transition:background 0.15s;}.my-req-cancel-btn:hover{background:#fef2f2;}.pending-request-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:6px;font-size:11px;font-weight:600;background:#fef3c7;color:#d97706;border:1px solid #fde68a;}.pending-request-badge.pending-escalation{background:#fff7ed;color:#ea580c;border-color:#fed7aa;}.pending-request-badge.pending-exchange_approval{background:#eff6ff;color:#2563eb;border-color:#bfdbfe;}.pending-request-badge.pending-payment_approval{background:#f0fdf4;color:#16a34a;border-color:#bbf7d0;}.pending-request-badge.pending-delete_approval{background:#fef2f2;color:#dc2626;border-color:#fecaca;}.pending-icon{font-size:12px;}.pending-text{font-size:11px;}.lead-transfer-from{display:flex;align-items:center;gap:6px;padding:4px 8px;background:#faf5ff;border:1px solid #e9d5ff;border-radius:6px;margin-top:6px;font-size:11px;color:#7c3aed;cursor:pointer;transition:background 0.15s;}.lead-transfer-from:hover{background:#f3e8ff;}.transfer-from-icon{font-size:13px;flex-shrink:0;}.transfer-from-label{font-weight:500;}.transfer-from-date{color:#a78bfa;margin-left:auto;}.transfer-from-origin{color:#a78bfa;font-size:10px;}.escalation-deadline{font-size:11px;font-weight:600;color:#64748b;}.escalation-deadline.urgent{color:#dc2626;}.badge-approval-pending{background:var(--warning-bg);color:var(--warning);font-size:11px;padding:2px 8px;border-radius:var(--radius-full);font-weight:600;}.badge-delete-pending{background:var(--danger-bg);color:var(--danger);font-size:11px;padding:2px 8px;border-radius:var(--radius-full);font-weight:600;}.transfer-superior-btn{margin-left:var(--sp-2);}.approval-request-btn{margin-left:var(--sp-2);}@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}.lead-card-fade-in{animation:fadeIn 0.2s ease-in;}.sidebar-nav-item{position:relative;}.primary-subtabs{display:flex;gap:var(--sp-1);padding:var(--sp-4) var(--sp-4) 0;border-bottom:1px solid var(--border);background:var(--bg-elevated);}.primary-subtab{padding:var(--sp-2-5) var(--sp-4);border:none;background:none;font-size:var(--text-sm);font-weight:500;color:var(--text-subtle);cursor:pointer;border-bottom:2px solid transparent;transition:color 0.15s ease,background-color 0.15s ease,border-bottom-color 0.15s ease;font-family:var(--font);}.primary-subtab:hover{color:var(--text);background:var(--slate-50);}.primary-subtab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600;}.primary-sub-content{padding:var(--sp-4);}.primary-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin-bottom:var(--sp-4);flex-wrap:wrap;}.primary-status-chips{display:flex;gap:var(--sp-1-5);flex-wrap:wrap;}.primary-status-chip{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-1-5) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-full);background:var(--bg-elevated);font-size:var(--text-xs);font-weight:500;color:var(--text-subtle);cursor:pointer;transition:border-color 0.15s ease,color 0.15s ease,background-color 0.15s ease;font-family:var(--font);white-space:nowrap;}.primary-status-chip:hover{border-color:var(--primary-300);color:var(--primary);background:var(--primary-bg);}.primary-status-chip.active{border-color:var(--primary);color:var(--primary);background:var(--primary-bg-strong);font-weight:600;}.primary-status-chip span{font-weight:700;font-size:var(--text-xs);}.primary-search-bar{display:flex;align-items:center;gap:var(--sp-2);}.primary-search-bar input{padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);font-family:var(--font);width:220px;transition:border-color 0.15s ease;}.primary-search-bar input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.primary-date-filter select{background:var(--card);cursor:pointer;}.primary-date-filter select:focus{outline:none;border-color:var(--primary);}.primary-date-filter input[type="date"]{background:var(--card);font-family:var(--font);}.primary-date-filter input[type="date"]:focus{outline:none;border-color:var(--primary);}.primary-bulk-bar{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--primary-bg-strong);border-radius:var(--radius-lg);margin-bottom:var(--sp-4);font-size:var(--text-sm);font-weight:500;color:var(--primary-700);border:1px solid var(--primary-200);}.primary-actions{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4);}.primary-lead-list{display:flex;flex-direction:column;gap:var(--sp-3);}.primary-lead-card{background:var(--glass-bg);backdrop-filter:var(--glass-blur-subtle);-webkit-backdrop-filter:var(--glass-blur-subtle);border:1px solid var(--glass-border);border-radius:var(--radius-xl);overflow:hidden;transition:var(--glass-transition);box-shadow:var(--glass-shadow),var(--glass-edge-light);}.primary-lead-card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.10);transform:translateY(-2px);}.primary-lead-card .card-header{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-subtle);background:var(--slate-50);}.primary-lead-checkbox{display:flex;align-items:center;}.primary-lead-checkbox input[type="checkbox"]{width:16px;height:16px;cursor:pointer;accent-color:var(--primary);}.card-title-area{display:flex;align-items:center;gap:var(--sp-2);flex:1;min-width:0;}.card-business-name{font-weight:600;font-size:var(--text-base);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.primary-lead-card .card-body{padding:var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-1-5);}.card-info-row{display:flex;align-items:baseline;gap:var(--sp-2);font-size:var(--text-sm);}.card-label{color:var(--text-muted);font-weight:500;min-width:50px;flex-shrink:0;}.card-value{color:var(--text);}.primary-lead-card .card-footer{display:flex;gap:var(--sp-2);padding:var(--sp-2-5) var(--sp-4);border-top:1px solid var(--border-subtle);justify-content:flex-end;}.primary-status-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-full);font-size:11px;font-weight:600;white-space:nowrap;}.primary-status-badge.draft{background:#f1f5f9;color:#64748b;}.primary-status-badge.submitted{background:#dbeafe;color:#2563eb;}.primary-status-badge.approved{background:#dcfce7;color:#16a34a;}.primary-status-badge.rejected{background:#fef2f2;color:#dc2626;}.primary-status-badge.distributed{background:#f3e8ff;color:#7c3aed;}.primary-status-badge.converted{background:#fef3c7;color:#d97706;}.primary-status-badge.pending{background:#fef3c7;color:#d97706;}.d-day-badge{display:inline-block;padding:1px 6px;border-radius:var(--radius-full);font-size:10px;font-weight:700;margin-left:6px;background:#dbeafe;color:#2563eb;}.d-day-badge.warning{background:#fef3c7;color:#d97706;}.d-day-badge.urgent{background:#fef2f2;color:#dc2626;animation:pulse-urgent 1.5s ease-in-out infinite;}.d-day-badge.overdue{background:#7f1d1d;color:#fff;}@keyframes pulse-urgent{0%,100%{opacity:1;}50%{opacity:0.7;}}.transfer-list{display:flex;flex-direction:column;gap:var(--sp-3);}.transfer-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;transition:box-shadow 0.15s ease;}.transfer-card:hover{box-shadow:var(--shadow-card-hover);}.transfer-card-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-subtle);background:var(--slate-50);}.transfer-direction{font-weight:600;font-size:var(--text-base);color:var(--text);}.transfer-card-body{padding:var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-1-5);}.transfer-card-footer{display:flex;gap:var(--sp-2);padding:var(--sp-2-5) var(--sp-4);border-top:1px solid var(--border-subtle);justify-content:flex-end;}.distribution-list{display:flex;flex-direction:column;gap:var(--sp-3);}.distribution-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);overflow:hidden;transition:box-shadow 0.15s ease;}.distribution-card:hover{box-shadow:var(--shadow-card-hover);}.distribution-card-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-subtle);background:var(--slate-50);}.distribution-date{font-weight:500;font-size:var(--text-sm);color:var(--text-subtle);}.distribution-count{font-weight:700;font-size:var(--text-base);color:var(--primary);}.distribution-card-body{padding:var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-1-5);}.primary-stats-container{padding:var(--sp-2) 0;}.primary-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:var(--sp-4);}.primary-stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--sp-5) var(--sp-4);text-align:center;transition:box-shadow 0.15s ease,border-color 0.15s ease;}.primary-stat-card:hover{box-shadow:var(--shadow-card-hover);border-color:var(--border-strong);}.primary-stat-card.primary-stat-highlight{background:var(--primary-bg-strong);border-color:var(--primary-200);}.primary-stat-value{font-size:var(--text-3xl);font-weight:800;color:var(--text);line-height:var(--leading-tight);}.primary-stat-highlight .primary-stat-value{color:var(--primary);}.primary-stat-label{font-size:var(--text-sm);color:var(--text-muted);margin-top:var(--sp-1);font-weight:500;}.pagination-bar{display:flex;align-items:center;justify-content:center;gap:var(--sp-1);padding:var(--sp-4) 0;}.page-btn{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 var(--sp-2);border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);font-size:var(--text-sm);font-weight:500;color:var(--text);cursor:pointer;transition:border-color 0.15s ease,color 0.15s ease,background-color 0.15s ease;font-family:var(--font);}.page-btn:hover:not(.disabled):not(.active){border-color:var(--primary-300);color:var(--primary);background:var(--primary-bg);}.page-btn.active{background:var(--primary);color:var(--text-inverted);border-color:var(--primary);font-weight:600;}.page-btn.disabled{opacity:0.4;cursor:not-allowed;}.page-dots{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;font-size:var(--text-sm);color:var(--text-muted);}.btn-secondary{background:var(--slate-100);color:var(--text);border:1px solid var(--border);padding:var(--sp-2) var(--sp-4);border-radius:var(--radius-lg);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:background-color 0.15s ease,border-color 0.15s ease;font-family:var(--font);}.btn-secondary:hover:not(:disabled){background:var(--slate-200);border-color:var(--border-strong);}@media (max-width:768px){.primary-filter-bar{flex-direction:column;align-items:stretch;}.primary-status-chips{flex-wrap:wrap;}.primary-search-bar{width:100%;}.primary-search-bar input{width:100%;flex:1;}.primary-date-filter{width:100%;order:-1;}.primary-date-filter select{flex:1;}.primary-subtabs{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}.primary-subtabs::-webkit-scrollbar{display:none;}.primary-subtab{white-space:nowrap;flex-shrink:0;}.primary-stats-grid{grid-template-columns:repeat(2,1fr);}.primary-bulk-bar{flex-wrap:wrap;}.primary-actions{flex-wrap:wrap;}.primary-lead-card .card-header{padding:var(--sp-2-5) var(--sp-3);}.primary-lead-card .card-body{padding:var(--sp-2-5) var(--sp-3);}.primary-lead-card .card-footer{padding:var(--sp-2) var(--sp-3);}.transfer-card-header{flex-direction:column;align-items:flex-start;gap:var(--sp-1);}}@media (max-width:480px){.primary-stats-grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-2);}.primary-stat-card{padding:var(--sp-3);}.primary-stat-value{font-size:var(--text-2xl);}}#staffForm{overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1;max-height:calc(90vh - 60px);}.btn{position:relative;overflow:hidden;}.btn::after{content:'';position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,0.3) 10%,transparent 10.01%);transform:scale(10);opacity:0;transition:transform 0.5s,opacity 0.5s;}.btn:active::after{transform:scale(0);opacity:1;transition:0s;}.btn-primary:active{box-shadow:0 0 0 4px rgba(98,125,152,0.3);}.hide-for-primary-manager .status-section{display:none !important;}.primary-perf-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6);}.perf-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-5);text-align:center;}.perf-card .perf-label{font-size:var(--text-sm);color:var(--text-subtle);}.perf-card .perf-value{font-size:var(--text-3xl);font-weight:var(--font-bold);color:var(--primary-700);}.primary-perf-list-item{display:flex;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border-subtle);font-size:var(--text-sm);}/* ========================================토스트 알림 시스템 (Toast Notifications)======================================== */#toast-container{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:420px;width:100%;}.toast-new{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border-radius:var(--radius-lg,10px);background:#ffffff;background:rgba(255,255,255,0.97);border:1.5px solid var(--border-default,#e2e8f0);box-shadow:0 8px 32px rgba(0,0,0,0.15),0 2px 8px rgba(0,0,0,0.08);pointer-events:auto;animation:toastSlideIn 0.3s ease-out;font-size:var(--text-sm,13px);line-height:1.5;max-width:100%;word-break:keep-all;}.toast-new.toast-exiting{animation:toastSlideOut 0.25s ease-in forwards;}.toast-new .toast-icon{flex-shrink:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:16px;}.toast-new .toast-body{flex:1;min-width:0;}.toast-new .toast-message{color:var(--text-primary,#1e293b);font-weight:500;}.toast-new .toast-close{flex-shrink:0;background:none;border:none;color:var(--text-tertiary,#94a3b8);cursor:pointer;padding:2px;font-size:18px;line-height:1;opacity:0.6;transition:opacity 0.15s;}.toast-new .toast-close:hover{opacity:1;}.toast-new .toast-undo-btn{display:inline-block;margin-top:6px;padding:4px 10px;background:var(--color-primary,#4f46e5);color:#fff;border:none;border-radius:var(--radius-sm,4px);cursor:pointer;font-size:12px;font-weight:600;}.toast-new .toast-undo-btn:hover{opacity:0.9;}.toast-new.toast-success{border-left:4px solid var(--color-success,#22c55e);}.toast-new.toast-success .toast-icon{color:var(--color-success,#22c55e);}.toast-new.toast-error{border-left:4px solid var(--color-danger,#ef4444);}.toast-new.toast-error .toast-icon{color:var(--color-danger,#ef4444);}.toast-new.toast-warning{border-left:4px solid var(--color-warning,#f59e0b);}.toast-new.toast-warning .toast-icon{color:var(--color-warning,#f59e0b);}.toast-new.toast-info{border-left:4px solid var(--color-info,#3b82f6);}.toast-new.toast-info .toast-icon{color:var(--color-info,#3b82f6);}.toast-new .toast-progress{position:absolute;bottom:0;left:0;height:3px;border-radius:0 0 0 var(--radius-lg,10px);background:currentColor;opacity:0.3;animation:toastProgress linear forwards;}@keyframes toastSlideIn{from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}@keyframes toastSlideOut{from{transform:translateX(0);opacity:1;max-height:120px;margin-bottom:0;}to{transform:translateX(100%);opacity:0;max-height:0;margin-bottom:-8px;}}@keyframes toastProgress{from{width:100%;}to{width:0%;}}/* ========================================로딩 상태 (Loading States)======================================== */.btn-loading{position:relative;pointer-events:none;opacity:0.75;}.btn-loading .btn-text{visibility:hidden;}.btn-loading::after{content:'';position:absolute;top:50%;left:50%;width:18px;height:18px;margin:-9px 0 0 -9px;border:2px solid rgba(255,255,255,0.3);border-top-color:#fff;border-radius:50%;animation:spin 0.6s linear infinite;}.skeleton{background:linear-gradient(90deg,var(--bg-skeleton,#e2e8f0) 25%,var(--bg-skeleton-shine,#f1f5f9) 50%,var(--bg-skeleton,#e2e8f0) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s ease-in-out infinite;border-radius:var(--radius-md,6px);}.skeleton-text{height:14px;margin-bottom:8px;width:100%;}.skeleton-text:last-child{width:70%;}.skeleton-card{height:120px;margin-bottom:12px;}.skeleton-stat{height:80px;}.skeleton-row{display:flex;gap:12px;margin-bottom:12px;}.skeleton-avatar{width:40px;height:40px;border-radius:50%;flex-shrink:0;}@keyframes skeleton-shimmer{0%{background-position:200% 0;}100%{background-position:-200% 0;}}.loading-overlay{position:absolute;inset:0;background:rgba(255,255,255,0.7);display:flex;align-items:center;justify-content:center;z-index:100;border-radius:inherit;}.loading-spinner{width:36px;height:36px;border:3px solid var(--border-default,#e2e8f0);border-top-color:var(--color-primary,#4f46e5);border-radius:50%;animation:spin 0.7s linear infinite;}@keyframes spin{to{transform:rotate(360deg);}}@media (max-width:640px){#toast-container{top:auto;bottom:20px;left:16px;right:16px;max-width:none;}}/* ========================================접근성 (Accessibility)======================================== */.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}.status-symbol{margin-right:4px;font-size:0.85em;}/* ========================================모바일 반응형 개선 (Mobile UX)======================================== */@media (max-width:768px){.kanban-board{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:12px;padding-bottom:12px;}.kanban-column{min-width:280px;flex-shrink:0;scroll-snap-align:start;}.kanban-card{padding:10px;font-size:13px;}.modal-content{width:100vw !important;max-width:100vw !important;height:100vh !important;max-height:100vh !important;border-radius:0 !important;margin:0 !important;}.stats-grid,.stat-cards,.dashboard-stats{grid-template-columns:repeat(2,1fr) !important;gap:8px !important;}.stat-card{padding:12px !important;}.stat-card .stat-value{font-size:1.25rem !important;}.responsive-table thead{display:none;}.responsive-table tbody tr{display:block;margin-bottom:12px;border:1px solid var(--border,#e2e8f0);border-radius:var(--radius-md,6px);padding:12px;}.responsive-table tbody td{display:flex;justify-content:space-between;padding:4px 0;border:none;}.responsive-table tbody td::before{content:attr(data-label);font-weight:600;color:var(--text-secondary,#64748b);margin-right:12px;}.sidebar{transform:translateX(-100%);transition:transform 0.3s ease;position:fixed !important;z-index:1000;}.sidebar.mobile-open{transform:translateX(0);}.main-content{margin-left:0 !important;}.filter-bar,.search-bar{flex-direction:column;gap:8px;}.filter-bar select,.filter-bar input,.search-bar input{width:100%;}.btn-group,.action-buttons{flex-wrap:wrap;gap:6px;}.btn-group .btn,.action-buttons .btn{flex:1;min-width:0;}}@media (max-width:480px){.stats-grid,.stat-cards,.dashboard-stats{grid-template-columns:1fr !important;}.modal-header,.modal-footer{padding:12px !important;}.modal-body{padding:12px !important;}}/* ========================================애니메이션 다듬기 (Animations)======================================== */.tab-content-enter{animation:fadeSlideIn 0.2s ease-out;}@keyframes fadeSlideIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}.modal.show .modal-content,.modal-content.modal-enter{animation:modalSlideUp 0.25s ease-out;}@keyframes modalSlideUp{from{opacity:0;transform:translateY(20px) scale(0.98);}to{opacity:1;transform:translateY(0) scale(1);}}.btn:active{transform:scale(0.98);transition:transform 0.1s;}.lead-card:hover,.stat-card:hover,.kanban-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md,0 4px 6px rgba(0,0,0,0.1));transition:transform 0.2s,box-shadow 0.2s;}.badge-urgent,.badge-3rd{animation:urgentPulse 2s ease-in-out infinite;}@keyframes urgentPulse{0%,100%{opacity:1;}50%{opacity:0.6;}}.stat-value{transition:color 0.3s;}/* ========================================툴팁 시스템 (Tooltips)======================================== */[data-tooltip]{position:relative;cursor:help;}[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:var(--bg-tooltip,#1e293b);color:#fff;padding:6px 10px;border-radius:var(--radius-sm,4px);font-size:12px;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity 0.15s,visibility 0.15s;z-index:10001;max-width:250px;white-space:normal;text-align:center;line-height:1.4;}[data-tooltip]::before{content:'';position:absolute;bottom:calc(100% + 2px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--bg-tooltip,#1e293b);opacity:0;visibility:hidden;transition:opacity 0.15s,visibility 0.15s;z-index:10001;}[data-tooltip]:hover::after,[data-tooltip]:hover::before,[data-tooltip]:focus::after,[data-tooltip]:focus::before{opacity:1;visibility:visible;}/* ========================================인쇄 스타일 (Print)======================================== */@media print{.sidebar,.mobile-header,.tab-bar,.filter-bar,.search-bar,.modal-overlay,.btn,button,.toast-container,#toast-container,.loading-overlay,.action-buttons,.pagination,.kanban-controls,nav{display:none !important;}.main-content{margin:0 !important;padding:0 !important;width:100% !important;}*{box-shadow:none !important;text-shadow:none !important;}body{background:#fff !important;color:#000 !important;font-size:12pt;}.stat-card,.lead-card,.kanban-card,tr{break-inside:avoid;page-break-inside:avoid;}table{border-collapse:collapse;width:100%;}th,td{border:1px solid #ccc;padding:6px 8px;text-align:left;}.print-header{display:block !important;text-align:center;margin-bottom:20px;font-size:18pt;font-weight:bold;}.print-date{display:block !important;text-align:right;font-size:10pt;color:#666;}a[href]::after{content:" (" attr(href) ")";font-size:9pt;color:#666;}a[href^="#"]::after,a[href^="javascript"]::after{content:none;}}/* ========================================빈 상태 (Empty States)======================================== */.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:48px 24px;text-align:center;color:var(--text-secondary,#64748b);}.empty-state-icon{font-size:48px;margin-bottom:16px;opacity:0.4;}.empty-state-title{font-size:var(--text-lg,16px);font-weight:600;color:var(--text-primary,#1e293b);margin-bottom:8px;}.empty-state-desc{font-size:var(--text-sm,13px);max-width:320px;line-height:1.6;}.trend{font-size:12px;font-weight:600;margin-left:6px;}.trend-up{color:var(--color-success,#22c55e);}.trend-down{color:var(--color-danger,#ef4444);}.trend-flat{color:var(--text-tertiary,#94a3b8);}/* ========================================Glassmorphism Animations & Keyframes======================================== */@keyframes glassCardIn{from{opacity:0;transform:translateY(20px) scale(0.97);}to{opacity:1;transform:translateY(0) scale(1);}}@keyframes smoothSlideDown{from{max-height:0;opacity:0;transform:translateY(-10px);overflow:hidden;}to{max-height:200px;opacity:1;transform:translateY(0);overflow:hidden;}}@keyframes smoothSlideUp{from{max-height:200px;opacity:1;transform:translateY(0);overflow:hidden;}to{max-height:0;opacity:0;transform:translateY(-10px);overflow:hidden;}}@keyframes valueFlash{0%{background-color:transparent;}30%{background-color:rgba(6,182,212,0.12);}100%{background-color:transparent;}}@keyframes tabSlideIn{from{opacity:0;transform:translateX(20px);}to{opacity:1;transform:translateX(0);}}@keyframes glassShimmer{0%{background-position:-200% 0;}100%{background-position:200% 0;}}/* ========================================Glass Utility Classes======================================== */.glass-card-enter{animation:glassCardIn 0.4s var(--ease-out) both;}.slide-in-item{animation:smoothSlideDown 0.35s var(--ease-out) both;}.slide-out-item{animation:smoothSlideUp 0.3s var(--ease-out) both;}.value-updated{animation:valueFlash 0.6s ease both;}.tab-slide-in{animation:tabSlideIn 0.3s var(--ease-out) both;will-change:transform,opacity;}.skeleton-shimmer{background:linear-gradient(90deg,var(--glass-bg-subtle) 25%,rgba(255,255,255,0.6) 50%,var(--glass-bg-subtle) 75%);background-size:200% 100%;animation:glassShimmer 1.5s ease infinite;border-radius:var(--radius-lg);}[data-stagger-index="0"]{animation-delay:0ms;}[data-stagger-index="1"]{animation-delay:50ms;}[data-stagger-index="2"]{animation-delay:100ms;}[data-stagger-index="3"]{animation-delay:150ms;}[data-stagger-index="4"]{animation-delay:200ms;}[data-stagger-index="5"]{animation-delay:250ms;}[data-stagger-index="6"]{animation-delay:300ms;}[data-stagger-index="7"]{animation-delay:350ms;}[data-stagger-index="8"]{animation-delay:400ms;}[data-stagger-index="9"]{animation-delay:450ms;}.distribute-animation-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:10001;display:flex;align-items:center;justify-content:center;flex-direction:column;}.distribute-shuffle-container{position:relative;width:300px;height:300px;}.shuffle-card{position:absolute;width:80px;height:50px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:8px;display:flex;align-items:center;justify-content:center;color:white;font-size:11px;font-weight:700;box-shadow:0 4px 12px rgba(0,0,0,0.3);transition:none;}@keyframes shuffleSpin{0%{transform:translate(0,0) rotate(0deg);}25%{transform:translate(100px,-80px) rotate(90deg);}50%{transform:translate(200px,0) rotate(180deg);}75%{transform:translate(100px,80px) rotate(270deg);}100%{transform:translate(0,0) rotate(360deg);}}@keyframes cardFlyOut{0%{transform:scale(1);opacity:1;}100%{transform:scale(0.3) translateY(200px);opacity:0;}}@keyframes confettiDrop{0%{transform:translateY(-100px) rotate(0deg);opacity:1;}100%{transform:translateY(100vh) rotate(720deg);opacity:0;}}.distribute-result-title{color:white;font-size:28px;font-weight:800;text-align:center;animation:resultBounce 0.5s ease-out;}@keyframes resultBounce{0%{transform:scale(0);opacity:0;}60%{transform:scale(1.2);}100%{transform:scale(1);opacity:1;}}.confetti-piece{position:absolute;width:8px;height:8px;border-radius:2px;animation:confettiDrop 2s ease-in forwards;}.lead-card--important{border-left:4px solid #f59e0b !important;background:linear-gradient(90deg,rgba(245,158,11,0.05) 0%,transparent 100%);}.lead-card--important::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#f59e0b,transparent);}.lead-name-wrap{display:flex;align-items:center;gap:6px;flex:1;min-width:0;}.important-btn{flex-shrink:0;width:20px;height:20px;border:none;background:transparent;color:var(--slate-300);font-size:14px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);transition:background-color var(--ease-fast),color var(--ease-fast),transform var(--ease-fast),opacity var(--ease-fast);opacity:0.5;}.lead-card:hover .important-btn{opacity:1;color:var(--slate-400);}.important-btn:hover{background:var(--warning-bg);color:var(--warning);transform:scale(1.1);}.important-btn.active,.lead-card--important .important-btn{color:#f59e0b;opacity:1;}.important-btn.active:hover{color:#d97706;}.kanban-card--important{border-left:3px solid #f59e0b;}.kanban-card--important .important-btn{opacity:1;color:#f59e0b;}.lead-card-phone-large{font-size:var(--text-lg) !important;font-weight:600;color:var(--primary-700);letter-spacing:0.5px;}.lead-phone.lead-card-phone-large{font-size:var(--text-lg);font-weight:600;color:var(--primary-700);letter-spacing:0.5px;display:inline-flex;align-items:center;gap:var(--sp-1);}.lead-phone.lead-card-phone-large::before{content:'\260E';font-size:var(--text-sm);opacity:0.7;}.lead-card-notes-preview{font-size:var(--text-xs);color:var(--text-subtle);background:var(--slate-50);padding:var(--sp-1-5) var(--sp-2);border-radius:var(--radius-md);border-left:2px solid var(--info);max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:var(--sp-1);display:flex;align-items:center;gap:var(--sp-1);}.lead-card-notes-preview::before{content:'\1F4DD';font-size:10px;flex-shrink:0;}.lead-card-extended .lead-card-notes-preview{max-width:100%;margin-top:var(--sp-2);}.region-filter-wrapper{position:relative;display:inline-flex;align-items:center;}.region-filter-select{appearance:none;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-2) var(--sp-8) var(--sp-2) var(--sp-3);font-size:var(--text-sm);color:var(--text);cursor:pointer;transition:border-color var(--ease-fast),box-shadow var(--ease-fast);min-width:100px;}.region-filter-select:hover{border-color:var(--primary-300);}.region-filter-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.region-filter-wrapper::after{content:'\25BC';position:absolute;right:var(--sp-3);top:50%;transform:translateY(-50%);font-size:10px;color:var(--text-muted);pointer-events:none;}.lead-region-tag{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--text-xs);color:var(--slate-600);background:var(--slate-100);padding:var(--sp-0-5) var(--sp-2);border-radius:var(--radius-full);}.lead-region-tag::before{content:'\1F4CD';font-size:10px;}.filter-btn[data-filter="important"]{color:#f59e0b;}.filter-btn[data-filter="important"].active{background:linear-gradient(135deg,#f59e0b,#d97706);color:white;}.filter-btn[data-filter="important"]::before{content:'\2605';margin-right:var(--sp-1);}.filter-btn-expired{color:var(--danger);}.filter-btn-expired.active{background:linear-gradient(135deg,var(--danger),var(--danger-hover));color:white;}.lead-filters-extended{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--border-subtle);}@media (max-width:768px){.region-filter-select{min-width:80px;padding:var(--sp-1-5) var(--sp-6) var(--sp-1-5) var(--sp-2);font-size:var(--text-xs);}.lead-card-notes-preview{max-width:150px;}.lead-card-phone-large{font-size:var(--text-md) !important;}}.reservation-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:var(--sp-4);margin-bottom:var(--sp-5);padding:var(--sp-4);background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);}.reservation-summary{display:flex;gap:var(--sp-4);flex-wrap:wrap;}.reservation-summary-card{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--bg-sunken);border-radius:var(--radius-md);min-width:140px;}.reservation-summary-card.next-call{background:linear-gradient(135deg,var(--primary-50) 0%,var(--accent-50) 100%);border:1px solid var(--primary-200);}.summary-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);}.summary-icon svg{width:20px;height:20px;}.summary-icon.pending{background:var(--warning-bg);color:var(--warning);}.summary-icon.completed{background:var(--success-bg);color:var(--success);}.summary-icon.next{background:var(--primary-bg-strong);color:var(--primary);}.summary-content{display:flex;flex-direction:column;gap:var(--sp-0-5);}.summary-label{font-size:var(--text-xs);color:var(--text-muted);}.summary-value{font-size:var(--text-xl);font-weight:700;color:var(--text);}.summary-sub{font-size:var(--text-xs);color:var(--text-subtle);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.reservation-actions{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;}.reservation-filter-group{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--text-sm);}.reservation-filter-group label{color:var(--text-muted);white-space:nowrap;}.reservation-date-input{padding:var(--sp-1-5) var(--sp-2);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-sm);background:var(--card);}.reservation-status-select{padding:var(--sp-1-5) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-sm);background:var(--card);cursor:pointer;}.reservation-list{display:flex;flex-direction:column;gap:var(--sp-3);}.reservation-card{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4);background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);border-left:4px solid var(--primary);transition:box-shadow var(--ease-fast),transform var(--ease-fast);}.reservation-card .reservation-time{flex-shrink:0;width:100px;}.reservation-card .reservation-info{flex:1;min-width:0;}.reservation-card .reservation-status{flex-shrink:0;}.reservation-card .reservation-actions{flex-shrink:0;}.reservation-card:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-1px);}.reservation-card.completed{border-left-color:var(--success);opacity:0.8;}.reservation-card.cancelled{border-left-color:var(--slate-400);opacity:0.6;}.reservation-card.overdue{border-left-color:var(--danger);background:var(--danger-50);}.reservation-time{display:flex;flex-direction:column;align-items:center;gap:var(--sp-1);}.reservation-date{font-size:var(--text-sm);color:var(--text-muted);font-weight:500;}.reservation-hour{font-size:var(--text-2xl);font-weight:700;color:var(--primary);}.overdue-badge{font-size:var(--text-xs);padding:var(--sp-0-5) var(--sp-1-5);background:var(--danger);color:white;border-radius:var(--radius-sm);}.reservation-info{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0;}.reservation-staff{margin-bottom:var(--sp-1);}.reservation-staff .staff-badge{display:inline-block;padding:var(--sp-0-5) var(--sp-2);background:var(--primary-100);color:var(--primary-700);font-size:var(--text-xs);font-weight:600;border-radius:var(--radius-full);}.reservation-view-toggle{display:inline-flex;gap:0;background:var(--bg-sunken);border-radius:var(--radius-lg);padding:3px;border:1px solid var(--border);}.reservation-view-toggle .btn{border:none;background:transparent;color:var(--text-secondary);border-radius:calc(var(--radius-lg) - 2px);min-height:32px;padding:var(--sp-1-5) var(--sp-3);font-weight:500;transition:color var(--duration-fast) var(--ease-out),background-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);position:relative;}.reservation-view-toggle .btn:hover:not(.active){color:var(--text);background:rgba(0,0,0,0.05);}.reservation-view-toggle .btn.active{background:var(--primary);color:white;box-shadow:0 2px 4px rgba(59,130,246,0.25);}.reservation-view-toggle .btn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--primary-ring);}.reservation-view-toggle .btn:active:not(:disabled){transform:scale(0.97);}.reservation-bulk-notify-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);background:var(--primary-50);border:1px solid var(--primary-200);border-radius:var(--radius-lg);margin-bottom:var(--sp-4);}.bulk-notify-info{display:flex;align-items:center;gap:var(--sp-4);}.bulk-notify-info .checkbox-label{display:flex;align-items:center;gap:var(--sp-2);cursor:pointer;font-size:var(--text-sm);font-weight:500;color:var(--text);}.bulk-notify-info .checkbox-label input[type="checkbox"]{width:16px;height:16px;cursor:pointer;accent-color:var(--primary);}.bulk-notify-info .selected-count{font-size:var(--text-sm);color:var(--text-subtle);}.bulk-notify-info .selected-count strong{color:var(--primary);font-weight:600;}.bulk-notify-actions{display:flex;gap:var(--sp-2);}.bulk-notify-actions .btn:disabled{opacity:0.5;cursor:not-allowed;}.reservation-card .notify-checkbox{display:flex;align-items:center;margin-right:var(--sp-3);}.reservation-card .notify-checkbox input[type="checkbox"]{width:18px;height:18px;cursor:pointer;accent-color:var(--primary);}.reservation-card .notify-checkbox .notify-icon{margin-left:var(--sp-1);color:var(--warning-500);}.reservation-card .notify-checkbox .notify-icon.active{color:var(--success);}.reservation-card.notify-enabled{border-left:3px solid var(--success);}.reservation-business{font-size:var(--text-md);font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}.reservation-business.clickable-business{cursor:pointer;color:var(--primary);text-decoration:underline;text-decoration-color:transparent;text-underline-offset:2px;}.reservation-business.clickable-business:hover{text-decoration-color:var(--primary);}.reservation-phone{font-size:var(--text-sm);color:var(--text-subtle);}.reservation-phone .phone-link{color:var(--primary);text-decoration:none;}.reservation-phone .phone-link:hover{text-decoration:underline;}.reservation-memo{font-size:var(--text-xs);color:var(--text-muted);background:var(--bg-sunken);padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-sm);max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.reservation-status{display:flex;justify-content:center;}.reservation-card .status-badge{font-size:var(--text-xs);padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-sm);font-weight:500;}.status-badge.pending{background:var(--warning-bg);color:var(--warning);}.status-badge.completed{background:var(--success-bg);color:var(--success);}.status-badge.cancelled{background:var(--slate-100);color:var(--slate-500);}.reservation-card .reservation-actions{display:flex;gap:var(--sp-2);}.reservation-section{margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--border);}.reservation-section .section-title{font-size:var(--text-sm);font-weight:600;color:var(--text);margin-bottom:var(--sp-3);display:flex;align-items:center;gap:var(--sp-2);}.reservation-section .section-title::before{content:'';width:4px;height:16px;background:var(--primary);border-radius:2px;}.lead-reservation-section{margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--border);}.lead-reservation-section .section-title{font-size:var(--text-sm);font-weight:600;color:var(--text);margin-bottom:var(--sp-3);display:flex;align-items:center;gap:var(--sp-2);}.lead-reservation-section .section-title::before{content:'';width:4px;height:16px;background:var(--primary);border-radius:2px;}.reservation-form-inline{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap;margin-bottom:var(--sp-3);}.reservation-datetime-input,.reservation-date-input,.reservation-time-input{flex:1;min-width:120px;padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);height:38px;}.reservation-time-input{min-width:100px;cursor:pointer;}.reservation-memo-input{flex:1;min-width:120px;padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.lead-reservation-list{display:flex;flex-direction:column;gap:var(--sp-2);max-height:150px;overflow-y:auto;}.lead-reservation-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2);background:var(--bg-sunken);border-radius:var(--radius-sm);font-size:var(--text-xs);}.lead-reservation-item.completed{opacity:0.6;}.lead-reservation-item.cancelled{opacity:0.4;text-decoration:line-through;}.reservation-item-time{font-weight:600;color:var(--primary);}.reservation-item-status{padding:var(--sp-0-5) var(--sp-1);border-radius:var(--radius-xs);font-size:10px;font-weight:500;}.lead-reservation-item.pending .reservation-item-status{background:var(--warning-bg);color:var(--warning);}.lead-reservation-item.completed .reservation-item-status{background:var(--success-bg);color:var(--success);}.lead-reservation-item.cancelled .reservation-item-status{background:var(--slate-100);color:var(--slate-500);}.reservation-item-memo{color:var(--text-muted);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.no-reservations{font-size:var(--text-xs);color:var(--text-muted);text-align:center;padding:var(--sp-3);}@media (max-width:768px){.reservation-header{flex-direction:column;}.reservation-summary{width:100%;justify-content:space-between;}.reservation-summary-card{flex:1;min-width:100px;}.reservation-actions{width:100%;}.reservation-card{flex-wrap:wrap;}.reservation-card .reservation-time{width:80px;}.reservation-card .reservation-info{width:calc(100% - 100px);}.reservation-card .reservation-status,.reservation-card .reservation-actions{margin-left:auto;}.reservation-card .notify-checkbox{order:-1;}.reservation-card .reservation-actions{grid-column:2;grid-row:2;justify-content:flex-end;}.reservation-form-inline{flex-direction:column;align-items:stretch;}.reservation-datetime-input,.reservation-date-input,.reservation-time-input,.reservation-memo-input{min-width:100%;}}/* ========================================특수팀 스타일======================================== */.special-team-header{display:flex;align-items:center;gap:var(--sp-4);margin-bottom:var(--sp-6);padding-bottom:var(--sp-4);border-bottom:1px solid var(--border);}.special-team-header h2{font-size:var(--text-xl);font-weight:600;color:var(--text);margin:0;}.team-role-badge{display:inline-flex;align-items:center;padding:var(--sp-1) var(--sp-3);background:var(--primary-bg);color:var(--primary);font-size:var(--text-xs);font-weight:500;border-radius:var(--radius-full);}.admin-team-subtabs,.risk-team-subtabs{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-6);border-bottom:1px solid var(--border);padding-bottom:var(--sp-2);}.admin-subtab,.risk-subtab{padding:var(--sp-2) var(--sp-4);border:none;background:none;cursor:pointer;font-size:var(--text-sm);font-weight:500;color:var(--text-muted);border-bottom:2px solid transparent;margin-bottom:-2px;transition:color 0.2s,border-bottom-color 0.2s;}.admin-subtab:hover,.risk-subtab:hover{color:var(--primary);}.admin-subtab.active,.risk-subtab.active{color:var(--primary);border-bottom-color:var(--primary);}.work-log-editor{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-6);}.work-log-date-header{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);}.work-log-date-header input[type="date"]{padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.my-categories-display{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-4);}.category-badge{display:inline-flex;align-items:center;padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:500;color:#fff;}#workLogContent{width:100%;min-height:300px;padding:var(--sp-4);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);line-height:1.6;resize:vertical;}.work-log-actions{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-4);}.save-status{font-size:var(--text-xs);color:var(--success);}.team-logs-filter{display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;margin-bottom:var(--sp-4);}.team-logs-filter input,.team-logs-filter select{padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.team-work-logs-list{display:flex;flex-direction:column;gap:var(--sp-4);}.team-work-log-item{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);}.team-work-log-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-3);padding-bottom:var(--sp-2);border-bottom:1px solid var(--border-light);}.team-work-log-header .staff-name{font-weight:600;color:var(--text);}.team-work-log-header .log-date{font-size:var(--text-xs);color:var(--text-muted);}.team-work-log-content{font-size:var(--text-sm);color:var(--text);line-height:1.6;white-space:pre-wrap;}.category-management{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-6);}.category-add-form{display:flex;gap:var(--sp-3);align-items:center;margin-bottom:var(--sp-4);}.category-add-form input[type="text"]{flex:1;max-width:200px;padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.category-add-form input[type="color"]{width:40px;height:32px;padding:2px;border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;}.category-list{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-4);}.category-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);}.category-item .category-color{width:16px;height:16px;border-radius:50%;}.category-item .delete-category{padding:2px;border:none;background:none;cursor:pointer;color:var(--text-muted);opacity:0.6;}.category-item .delete-category:hover{opacity:1;color:var(--danger);}.staff-category-assign{display:flex;flex-direction:column;gap:var(--sp-3);}.staff-assign-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0;border-bottom:1px solid var(--border-light);}.staff-assign-row .staff-name{min-width:100px;font-weight:500;}.staff-assign-row .category-checkboxes{display:flex;flex-wrap:wrap;gap:var(--sp-2);}.upsell-stats-summary,.renewal-stats-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6);}.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);text-align:center;}.stat-card .stat-label{font-size:var(--text-xs);color:var(--text-muted);margin-bottom:var(--sp-1);}.stat-card .stat-value{font-size:var(--text-2xl);font-weight:600;color:var(--primary);}.upsell-actions,.renewal-actions{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-4);}.upsell-lead-list,.renewal-lead-list{display:flex;flex-direction:column;gap:var(--sp-3);}.risk-report-form{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-6);}.report-date-header{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-6);}.report-date-header input[type="date"]{padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.report-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6);}.report-section{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--sp-4);}.report-section.wide{grid-column:1 / -1;}.report-section legend{font-size:var(--text-sm);font-weight:600;color:var(--text);padding:0 var(--sp-2);}.report-row{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-2) 0;border-bottom:1px solid var(--border-light);}.report-row:last-child{border-bottom:none;}.report-row label{font-size:var(--text-sm);color:var(--text-muted);}.report-row input[type="number"]{width:100px;padding:var(--sp-1-5) var(--sp-2);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-sm);text-align:right;}.computed-value{font-size:var(--text-sm);font-weight:600;color:var(--primary);}.cancel-reasons-grid,.solutions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--sp-3);}.reason-item,.solution-item{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-2);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-sm);}.reason-item label,.solution-item label{font-size:var(--text-xs);color:var(--text);}.reason-item input,.solution-item input{width:60px;padding:var(--sp-1);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:var(--text-xs);text-align:right;}.report-actions{display:flex;align-items:center;gap:var(--sp-3);margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--border);}.complaints-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-4);}.complaints-filter{display:flex;gap:var(--sp-3);}.complaints-filter select{padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.complaints-list{display:flex;flex-direction:column;gap:var(--sp-3);}.complaint-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);}.complaint-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-3);}.complaint-type-badge{display:inline-flex;padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:500;}.complaint-type-badge.card{background:var(--info-bg);color:var(--info);}.complaint-type-badge.institution{background:var(--warning-bg);color:var(--warning);}.complaint-type-badge.lawsuit{background:var(--danger-bg);color:var(--danger);}.complaint-status-badge{display:inline-flex;padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-sm);font-size:var(--text-xs);}.complaint-status-badge.pending{background:var(--slate-100);color:var(--slate-600);}.complaint-status-badge.in_progress{background:var(--info-bg);color:var(--info);}.complaint-status-badge.completed{background:var(--success-bg);color:var(--success);}.complaint-content{font-size:var(--text-sm);color:var(--text);line-height:1.5;}.complaint-meta{display:flex;gap:var(--sp-4);margin-top:var(--sp-3);font-size:var(--text-xs);color:var(--text-muted);}.report-history-filter{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);}.report-history-filter input[type="month"]{padding:var(--sp-2) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--text-sm);}.report-history-list{display:flex;flex-direction:column;gap:var(--sp-3);}.report-history-item{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);cursor:pointer;transition:border-color 0.2s;}.report-history-item:hover{border-color:var(--primary);}@media (max-width:768px){.special-team-header{flex-direction:column;align-items:flex-start;gap:var(--sp-2);}.admin-team-subtabs,.risk-team-subtabs{overflow-x:auto;-webkit-overflow-scrolling:touch;}.report-grid{grid-template-columns:1fr;}.cancel-reasons-grid,.solutions-grid{grid-template-columns:1fr;}.team-logs-filter{flex-direction:column;align-items:stretch;}.complaints-header{flex-direction:column;gap:var(--sp-3);}.complaints-filter{width:100%;}.complaints-filter select{flex:1;}}/* ===================================Activity Feed - View More Button=================================== */.activity-feed-footer{padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--border);text-align:center;}.activity-viewmore-btn{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:var(--text-sm);}.activity-viewmore-btn svg{flex-shrink:0;}/* ===================================Exchange Approval - Dual Manager Status=================================== */.exchange-dual-status{flex-direction:column;align-items:flex-start;gap:var(--sp-1);}.exchange-managers-status{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-2);margin-top:var(--sp-1);}.exchange-mgr-item{display:inline-flex;align-items:center;gap:var(--sp-1);}.exchange-mgr-name{font-size:var(--text-xs);color:var(--text-secondary);}.exchange-mgr-separator{color:var(--text-muted);font-weight:300;}.badge-success{background:var(--success-bg);color:var(--success);font-size:var(--text-xs);padding:2px 6px;border-radius:var(--radius-sm);}.badge-warning{background:var(--warning-bg);color:var(--warning);font-size:var(--text-xs);padding:2px 6px;border-radius:var(--radius-sm);}#activityModal .modal-content{max-width:800px;}#activityModalList .activity-item{padding:var(--sp-3);border-bottom:1px solid var(--border);}#activityModalList .activity-item:last-child{border-bottom:none;}.activity-pagination{display:flex;align-items:center;gap:var(--sp-2);}/* ===================================Mobile CSS Optimization=================================== */@media (max-width:768px){.btn,.filter-btn,.modal-close,button{min-height:44px;min-width:44px;}.btn-sm{min-height:36px;padding:var(--sp-2) var(--sp-3);}.modal-content{width:calc(100vw - var(--sp-4));max-width:100%;margin:var(--sp-2);}.table-responsive,.data-table-wrapper,table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin;}.table-responsive::-webkit-scrollbar,table::-webkit-scrollbar{height:6px;}.table-responsive::-webkit-scrollbar-thumb,table::-webkit-scrollbar-thumb{background:var(--slate-300);border-radius:3px;}.lead-card{margin-bottom:var(--sp-3);}.lead-card-header{flex-wrap:wrap;gap:var(--sp-2);}.lead-badges{flex-wrap:wrap;gap:var(--sp-1);}.filter-buttons{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;padding-bottom:var(--sp-2);}.filter-buttons::-webkit-scrollbar{display:none;}.filter-btn{flex-shrink:0;white-space:nowrap;}.mobile-tabbar .mobile-tab-item{min-height:48px;padding:var(--sp-1-5) var(--sp-2);}.escalation-btn{min-height:44px;padding:var(--sp-2) var(--sp-3);display:inline-flex;align-items:center;gap:var(--sp-2);}}@media (max-width:768px){.team-leads-header{flex-direction:column;align-items:flex-start;gap:var(--sp-2);margin-bottom:var(--sp-3);padding-bottom:var(--sp-3);min-height:auto;}.team-leads-stats{width:100%;flex-wrap:wrap;gap:var(--sp-2);min-height:auto;}.team-leads-stats .stat-item{font-size:var(--text-xs);padding:var(--sp-1) var(--sp-2);}.team-leads-stats .stat-item strong{font-size:var(--text-sm);}.team-leads-filters{padding:var(--sp-3);margin-bottom:var(--sp-3);}.team-leads-filters .filter-row{flex-direction:column;gap:var(--sp-2);}.team-leads-filters .filter-row input,.team-leads-filters .filter-row select{width:100%;min-width:0 !important;height:40px;font-size:var(--text-sm);}.team-leads-filters .filter-row .btn{width:100%;}.team-leads-quick-filters{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:var(--sp-1);gap:var(--sp-1);min-height:auto;}.team-leads-quick-filters::-webkit-scrollbar{display:none;}.team-leads-quick-filters .filter-btn{flex-shrink:0;font-size:var(--text-xs);padding:var(--sp-1-5) var(--sp-2-5);min-height:34px;}.team-leads-quick-filters .member-stats-popup-btn{flex-shrink:0;min-height:34px;font-size:var(--text-xs);}.team-leads-region-filters{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:var(--sp-1);min-height:auto;}.team-leads-region-filters::-webkit-scrollbar{display:none;}.team-leads-region-filters .filter-btn-region{flex-shrink:0;}.team-leads-list{grid-template-columns:1fr;gap:var(--sp-3);}.team-lead-card{padding:var(--sp-3);}.team-lead-card:hover{transform:none;}.team-lead-card-header{flex-wrap:wrap;gap:var(--sp-1);}}@media (max-width:480px){.btn{padding:var(--sp-2-5) var(--sp-3);font-size:var(--text-sm);}.modal-content{margin:0;border-radius:var(--radius-xl) var(--radius-xl) 0 0;max-height:95vh;max-height:95dvh;}.lead-card-body{padding:var(--sp-2-5) var(--sp-3);}.lead-card-notes-inline{padding:var(--sp-2);}#activityModal .modal-content{padding:var(--sp-3);}#activityModalList .activity-item{padding:var(--sp-2);}.activity-filter-row{flex-direction:column;gap:var(--sp-2);}.activity-filter-row select,.activity-filter-row input{width:100%;}}@media (max-width:480px){.team-leads-header h3{font-size:var(--text-lg);}.team-leads-filters{padding:var(--sp-2);}.team-leads-filters .filter-row input,.team-leads-filters .filter-row select{height:38px;}.team-leads-quick-filters .filter-btn{padding:var(--sp-1) var(--sp-2);font-size:0.6875rem;min-height:30px;}.team-leads-region-filters .filter-btn-region{padding:3px 8px;font-size:0.6875rem;}.team-lead-card{padding:var(--sp-2-5);}}.escalation-btn{background:var(--warning);color:var(--text-inverted);border:none;border-radius:var(--radius-md);padding:var(--sp-1-5) var(--sp-3);font-size:var(--text-xs);font-weight:600;cursor:pointer;transition:background-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);display:inline-flex;align-items:center;gap:var(--sp-1);}.escalation-btn:hover{background:var(--warning-600);transform:translateY(-1px);}.escalation-btn svg{width:14px;height:14px;}.lead-card-actions{display:flex;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid #f1f5f9;justify-content:flex-end;}.exchange-btn{background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:background 0.15s ease,border-color 0.15s ease;white-space:nowrap;}.exchange-btn:hover{background:#dbeafe;border-color:#93c5fd;}.exchange-btn:active{background:#bfdbfe;}.escalation-badge{background:var(--warning-bg);color:var(--warning);font-size:var(--text-xs);padding:2px 6px;border-radius:var(--radius-sm);font-weight:600;}/* ========================================보안 모니터링 스타일======================================== */.security-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6);}.security-kpi-card{background:var(--card);border-radius:var(--radius-lg);padding:var(--sp-4);text-align:center;border:1px solid var(--border);}.security-kpi-card .kpi-value{font-size:var(--text-3xl);font-weight:700;color:var(--primary);}.security-kpi-card.warning .kpi-value{color:var(--warning);}.security-kpi-card.danger .kpi-value{color:var(--danger);}.security-kpi-card .kpi-label{font-size:var(--text-sm);color:var(--text-secondary);margin-top:var(--sp-1);}.security-section{background:var(--card);border-radius:var(--radius-lg);padding:var(--sp-4);margin-bottom:var(--sp-4);border:1px solid var(--border);}.security-section h4{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-3);color:var(--text);font-size:var(--text-base);}.device-stats,.geo-stats{display:flex;flex-wrap:wrap;gap:var(--sp-3);}.device-stat-item,.geo-stat-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);background:var(--bg-alt);border-radius:var(--radius-md);}.device-icon{font-size:20px;}.device-type,.geo-city{color:var(--text);}.device-count,.geo-count{font-weight:600;color:var(--primary);}.security-alert-item{padding:var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:var(--sp-2);background:var(--card);}.security-alert-item.status-pending{border-left:3px solid var(--warning);}.security-alert-item.status-reviewed{opacity:0.7;border-left:3px solid var(--success);}.security-alert-item.status-dismissed{opacity:0.5;}.alert-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-1);}.alert-type{font-weight:600;color:var(--text);}.alert-time{font-size:var(--text-xs);color:var(--text-muted);}.alert-user{font-size:var(--text-sm);color:var(--text-secondary);margin-bottom:var(--sp-1);}.alert-message{font-size:var(--text-sm);color:var(--text);}.alert-actions{display:flex;gap:var(--sp-2);margin-top:var(--sp-2);}.user-badge{display:inline-block;padding:2px 8px;background:var(--primary-bg);color:var(--primary);border-radius:var(--radius-sm);font-size:var(--text-xs);margin-right:var(--sp-1);}.multi-ip-cards{display:flex;flex-direction:column;gap:10px;}.multi-ip-card{background:var(--card,#fff);border:1px solid var(--border-color,#e5e7eb);border-radius:10px;padding:14px 18px;border-left:4px solid var(--text-muted,#94a3b8);}.multi-ip-low{border-left-color:#f59e0b;}.multi-ip-medium{border-left-color:#f97316;}.multi-ip-high{border-left-color:#ef4444;background:#fef2f2;}.multi-ip-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap;}.multi-ip-left{display:flex;align-items:center;gap:10px;}.multi-ip-addr{font-family:'SF Mono','Consolas',monospace;font-size:14px;font-weight:700;color:var(--text-primary,#1e293b);}.multi-ip-count{font-size:12px;font-weight:600;padding:2px 10px;border-radius:12px;background:#fef3c7;color:#d97706;}.multi-ip-high .multi-ip-count{background:#fee2e2;color:#dc2626;}.multi-ip-right{display:flex;align-items:center;gap:12px;}.multi-ip-date,.multi-ip-logins{font-size:12px;color:var(--text-muted,#94a3b8);}.multi-ip-users{display:flex;flex-wrap:wrap;gap:8px;}.multi-ip-user{display:flex;align-items:center;gap:6px;background:var(--bg-subtle,#f8fafc);border:1px solid var(--border-color,#e5e7eb);border-radius:8px;padding:6px 12px;}.multi-ip-user-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--primary,#3b82f6);color:#fff;font-size:11px;font-weight:700;flex-shrink:0;}.multi-ip-user-name{font-size:13px;font-weight:600;color:var(--text-primary,#1e293b);}.multi-ip-user-branch{font-size:11px;color:var(--text-muted,#94a3b8);}@media (max-width:640px){.multi-ip-header{flex-direction:column;align-items:flex-start;gap:6px;}.multi-ip-card{padding:12px 14px;}}.security-subtabs{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4);padding-bottom:var(--sp-3);border-bottom:1px solid var(--border);flex-wrap:wrap;}.security-subtab{padding:var(--sp-2) var(--sp-4);background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:background-color 0.2s ease,color 0.2s ease,border-color 0.2s ease;}.security-subtab:hover{background:var(--slate-100);color:var(--text);}.security-subtab.active{background:var(--primary);color:white;border-color:var(--primary);}.security-subtab-content{min-height:200px;}.security-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-4);}.security-header h3{margin:0;color:var(--text);font-size:var(--text-xl);font-weight:600;}.security-header-actions{display:flex;gap:var(--sp-2);}.security-alerts-filter{display:flex;gap:var(--sp-2);margin-bottom:var(--sp-4);}.backup-actions{margin-bottom:var(--sp-4);}/* ==========================================Performance Optimization Styles========================================== */.virtual-spacer-top,.virtual-spacer-bottom{flex-shrink:0;pointer-events:none;}.virtual-scroll-status{position:sticky;top:0;z-index:5;background:var(--bg-subtle);padding:var(--sp-1) var(--sp-3);font-size:var(--text-xs);color:var(--text-muted);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:var(--sp-2);}.virtual-scroll-status::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--success);animation:pulse-dot 1.5s infinite;}@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.5;transform:scale(0.8);}}img[data-src],[data-bg]{opacity:0;transition:opacity 0.3s ease;}img.lazy-loaded,.lazy-loaded{opacity:1;}.glass-card,.toast-item,.modal-content{will-change:transform;transform:translateZ(0);}@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;}}.skeleton{background:linear-gradient(90deg,var(--slate-100) 25%,var(--slate-50) 50%,var(--slate-100) 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;}@keyframes skeleton-loading{0%{background-position:200% 0;}100%{background-position:-200% 0;}}.skeleton-card{height:120px;border-radius:var(--radius-lg);margin-bottom:var(--sp-3);}.skeleton-text{height:1em;border-radius:var(--radius-sm);margin-bottom:var(--sp-2);}.skeleton-text.short{width:40%;}.skeleton-text.medium{width:70%;}.cached-indicator{display:inline-flex;align-items:center;gap:var(--sp-1);font-size:var(--text-xs);color:var(--text-muted);padding:var(--sp-1) var(--sp-2);background:var(--bg-subtle);border-radius:var(--radius-sm);}.cached-indicator::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--info);}.perf-metrics{position:fixed;bottom:var(--sp-4);right:var(--sp-4);background:rgba(0,0,0,0.8);color:#0f0;font-family:monospace;font-size:11px;padding:var(--sp-2);border-radius:var(--radius-md);z-index:9999;pointer-events:none;}html{scroll-behavior:smooth;}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}.fade-on-scroll{opacity:0;transform:translateY(20px);transition:opacity 0.4s ease,transform 0.4s ease;}.fade-on-scroll.is-visible{opacity:1;transform:translateY(0);}.input-debouncing::after{content:'';position:absolute;right:10px;top:50%;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;background:var(--warning);animation:debounce-pulse 0.3s ease;}@keyframes debounce-pulse{0%{transform:translateY(-50%) scale(1);opacity:1;}100%{transform:translateY(-50%) scale(1.5);opacity:0;}}.followup-section{padding:var(--sp-4);}.followup-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-4);}.followup-header h4{font-size:var(--text-md);font-weight:600;color:var(--text);margin:0;}.followup-header-actions{display:flex;gap:var(--sp-2);}.followup-rules-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--sp-4);}.followup-rule-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:box-shadow 0.2s ease,border-color 0.2s ease;}.followup-rule-card:hover{border-color:var(--primary-light);box-shadow:0 4px 12px rgba(0,0,0,0.08);}.followup-rule-card.inactive{opacity:0.7;background:var(--bg-subtle);}.followup-rule-card .rule-header{display:flex;justify-content:space-between;align-items:flex-start;padding:var(--sp-4);border-bottom:1px solid var(--border);background:var(--bg-subtle);}.followup-rule-card .rule-title{display:flex;flex-direction:column;gap:var(--sp-1);}.followup-rule-card .rule-name{font-size:var(--text-sm);font-weight:600;color:var(--text);}.followup-rule-card .rule-status{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:500;}.followup-rule-card .rule-status.active{background:var(--success-bg);color:var(--success);}.followup-rule-card .rule-status.inactive{background:var(--slate-100);color:var(--slate-500);}.followup-rule-card .rule-actions{display:flex;gap:var(--sp-1);}.followup-rule-card .btn-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:none;background:transparent;border-radius:var(--radius);color:var(--text-muted);cursor:pointer;transition:background 0.15s ease,color 0.15s ease;}.followup-rule-card .btn-icon:hover{background:var(--slate-100);color:var(--text);}.followup-rule-card .btn-icon.btn-danger:hover{background:var(--danger-bg);color:var(--danger);}.followup-rule-card .rule-body{padding:var(--sp-4);}.followup-rule-card .rule-info{display:flex;gap:var(--sp-4);margin-bottom:var(--sp-3);}.followup-rule-card .rule-info-item{display:flex;flex-direction:column;gap:2px;}.followup-rule-card .rule-info-label{font-size:var(--text-xs);color:var(--text-muted);}.followup-rule-card .rule-info-value{font-size:var(--text-sm);font-weight:500;color:var(--text);}.followup-rule-card .rule-condition{font-size:var(--text-xs);color:var(--text-subtle);background:var(--bg-subtle);padding:var(--sp-2) var(--sp-3);border-radius:var(--radius);}.followup-rule-card .rule-footer{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-top:1px solid var(--border);background:var(--bg-subtle);}.followup-rule-card .rule-meta{font-size:var(--text-xs);color:var(--text-muted);}.followup-rule-card .rule-footer .btn{margin-left:auto;}.followup-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--sp-8);text-align:center;color:var(--text-muted);}.followup-empty svg{margin-bottom:var(--sp-3);}.followup-empty p{margin-bottom:var(--sp-4);font-size:var(--text-sm);}.followup-modal .form-row{display:flex;gap:var(--sp-4);margin-bottom:var(--sp-4);}.followup-modal .form-row .form-group{margin-bottom:0;}.followup-modal .form-section{margin-bottom:var(--sp-5);padding-bottom:var(--sp-4);border-bottom:1px solid var(--border);}.followup-modal .form-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}.followup-modal .form-section-title{font-size:var(--text-sm);font-weight:600;color:var(--text);margin-bottom:var(--sp-3);display:flex;align-items:center;gap:var(--sp-2);}.followup-modal .form-section-title svg{width:16px;height:16px;color:var(--primary);}.followup-modal .form-textarea{width:100%;min-height:80px;padding:var(--sp-3);border:1px solid var(--border);border-radius:var(--radius);font-size:var(--text-sm);font-family:inherit;resize:vertical;}.followup-modal .form-textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ring);}.followup-modal .template-select-wrapper{margin-bottom:var(--sp-4);padding:var(--sp-3);background:var(--info-bg);border-radius:var(--radius);display:flex;align-items:center;gap:var(--sp-3);}.followup-modal .template-select-wrapper label{font-size:var(--text-sm);font-weight:500;color:var(--info);white-space:nowrap;}.followup-modal .template-select-wrapper select{flex:1;}.followup-logs-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}.followup-logs-table th,.followup-logs-table td{padding:var(--sp-3);text-align:left;border-bottom:1px solid var(--border);}.followup-logs-table th{font-weight:600;color:var(--text-muted);font-size:var(--text-xs);text-transform:uppercase;background:var(--bg-subtle);}.followup-logs-table tbody tr:hover{background:var(--bg-subtle);}.followup-toggle-wrapper{display:flex;align-items:center;gap:var(--sp-2);}.followup-toggle-wrapper label{font-size:var(--text-sm);color:var(--text);}@media (max-width:768px){.followup-rules-grid{grid-template-columns:1fr;}.followup-modal .form-row{flex-direction:column;gap:var(--sp-3);}.followup-header{flex-direction:column;align-items:flex-start;gap:var(--sp-3);}.followup-rule-card .rule-info{flex-direction:column;gap:var(--sp-2);}}/* ==========================================================================스마트 배분 시스템 (Distribution System)========================================================================== */.dist-settings-card,.dist-simulation-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-5);margin-bottom:var(--sp-4);}.dist-settings-card h3,.dist-simulation-card h3{display:flex;align-items:center;gap:var(--sp-2);font-size:1.125rem;font-weight:700;margin:0 0 var(--sp-4) 0;color:var(--text);}.dist-settings-card h3 .material-icons,.dist-simulation-card h3 .material-icons{font-size:1.25rem;color:var(--primary);}.dist-settings-card h4{display:flex;align-items:center;gap:var(--sp-2);font-size:0.9375rem;font-weight:600;margin:var(--sp-4) 0 var(--sp-3) 0;color:var(--text-subtle);}.algo-info-box{display:flex;align-items:flex-start;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--gray-50);border-radius:var(--radius-md);margin-bottom:var(--sp-4);}.algo-info-box .material-icons{font-size:1.5rem;flex-shrink:0;margin-top:2px;}.algo-info-box strong{display:block;margin-bottom:var(--sp-1);}.algo-info-box p{margin:0;font-size:0.875rem;color:var(--text-subtle);}.config-options{background:var(--gray-50);border-radius:var(--radius-md);padding:var(--sp-4);margin-bottom:var(--sp-4);}.config-options .form-group{margin-bottom:var(--sp-3);}.config-options .form-group:last-child{margin-bottom:0;}.staff-checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--sp-2);max-height:200px;overflow-y:auto;padding:var(--sp-3);background:var(--gray-50);border-radius:var(--radius-md);}.staff-checkbox-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:border-color var(--ease-fast),background-color var(--ease-fast);}.staff-checkbox-item:hover{border-color:var(--primary);background:var(--primary-bg);}.staff-checkbox-item input[type="checkbox"]{width:16px;height:16px;accent-color:var(--primary);}.staff-checkbox-item small{color:var(--text-muted);font-size:0.75rem;}.settings-actions{display:flex;gap:var(--sp-3);margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--border);}.simulation-controls{display:flex;align-items:flex-end;gap:var(--sp-3);margin-bottom:var(--sp-4);}.simulation-controls .form-group{margin-bottom:0;flex:1;max-width:200px;}.simulation-summary{padding:var(--sp-3);background:var(--primary-bg);border-radius:var(--radius-md);margin-bottom:var(--sp-4);}.simulation-summary p{margin:0;}.simulation-chart{display:flex;flex-direction:column;gap:var(--sp-2);}.sim-bar-row{display:flex;align-items:center;gap:var(--sp-3);}.sim-staff-name{width:100px;font-size:0.875rem;font-weight:500;flex-shrink:0;text-align:right;}.sim-bar-container{flex:1;height:28px;background:var(--gray-100);border-radius:var(--radius-sm);overflow:hidden;}.sim-bar{height:100%;display:flex;align-items:center;justify-content:flex-end;padding-right:var(--sp-2);border-radius:var(--radius-sm);transition:width 0.5s ease;min-width:30px;}.sim-bar-value{color:#fff;font-size:0.75rem;font-weight:600;}.performance-table{width:100%;border-collapse:collapse;font-size:0.8125rem;}.performance-table th,.performance-table td{padding:var(--sp-3);text-align:left;border-bottom:1px solid var(--border);}.performance-table th{background:var(--gray-50);font-weight:600;color:var(--text-subtle);font-size:0.75rem;text-transform:uppercase;}.performance-table tbody tr:hover{background:var(--gray-50);}.rank-badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-weight:700;font-size:0.75rem;}.rank-badge.rank-1{background:linear-gradient(135deg,#FFD700,#FFA500);color:#fff;}.rank-badge.rank-2{background:linear-gradient(135deg,#C0C0C0,#A9A9A9);color:#fff;}.rank-badge.rank-3{background:linear-gradient(135deg,#CD7F32,#B8860B);color:#fff;}.rank-badge.rank-other{background:var(--gray-100);color:var(--text-subtle);}.conversion-rate{display:inline-block;padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-sm);font-weight:600;font-size:0.8125rem;}.conversion-rate.rate-high{background:var(--success-bg);color:var(--success);}.conversion-rate.rate-medium{background:var(--warning-bg);color:var(--warning);}.conversion-rate.rate-low{background:var(--gray-100);color:var(--text-subtle);}.workload-badge{display:inline-block;padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-sm);font-weight:500;font-size:0.8125rem;}.workload-badge.workload-high{background:var(--danger-bg);color:var(--danger);}.workload-badge.workload-medium{background:var(--warning-bg);color:var(--warning);}.workload-badge.workload-low{background:var(--success-bg);color:var(--success);}.specialty-tag{display:inline-block;padding:2px 6px;background:var(--primary-bg);color:var(--primary);border-radius:var(--radius-sm);font-size:0.6875rem;margin-right:2px;}.dashboard-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-4);margin-bottom:var(--sp-6);}.dashboard-stats-grid .stat-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);text-align:center;}.dashboard-stats-grid .stat-card .material-icons{font-size:1.75rem;color:var(--primary);margin-bottom:var(--sp-2);}.dashboard-stats-grid .stat-value{font-size:1.75rem;font-weight:700;color:var(--text);line-height:1.2;}.dashboard-stats-grid .stat-label{font-size:0.75rem;color:var(--text-muted);margin-top:var(--sp-1);}.dashboard-section{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-5);margin-bottom:var(--sp-4);}.dashboard-section h4{display:flex;align-items:center;gap:var(--sp-2);font-size:1rem;font-weight:600;margin:0 0 var(--sp-4) 0;color:var(--text);}.dashboard-section h4 .material-icons{font-size:1.125rem;color:var(--primary);}.conversion-chart{display:flex;flex-direction:column;gap:var(--sp-2);}.chart-bar-row{display:flex;align-items:center;gap:var(--sp-3);}.chart-rank{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--gray-100);border-radius:50%;font-size:0.75rem;font-weight:600;color:var(--text-subtle);flex-shrink:0;}.chart-name{width:80px;font-size:0.875rem;font-weight:500;flex-shrink:0;}.chart-bar-wrapper{flex:1;display:flex;align-items:center;gap:var(--sp-2);}.chart-bar{height:20px;border-radius:var(--radius-sm);transition:width 0.5s ease;}.chart-value{font-size:0.8125rem;font-weight:600;color:var(--text);white-space:nowrap;}.specialty-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--sp-3);}.specialty-card{background:var(--gray-50);border-radius:var(--radius-md);padding:var(--sp-3);text-align:center;}.specialty-keyword{font-weight:600;color:var(--text);margin-bottom:var(--sp-1);}.specialty-rate{font-size:1.25rem;font-weight:700;color:var(--primary);}.specialty-range{font-size:0.6875rem;color:var(--text-muted);margin:var(--sp-1) 0;}.specialty-staff{font-size:0.75rem;color:var(--text-subtle);}.algo-badge{display:inline-block;padding:2px 8px;border-radius:var(--radius-sm);font-size:0.6875rem;font-weight:500;}.algo-badge.algo-round_robin{background:rgba(76,175,80,0.15);color:#4CAF50;}.algo-badge.algo-performance{background:rgba(33,150,243,0.15);color:#2196F3;}.algo-badge.algo-workload{background:rgba(255,152,0,0.15);color:#FF9800;}.algo-badge.algo-specialty{background:rgba(156,39,176,0.15);color:#9C27B0;}.distributions-table{width:100%;font-size:0.8125rem;}.distributions-table th,.distributions-table td{padding:var(--sp-2) var(--sp-3);text-align:left;border-bottom:1px solid var(--border);}.distributions-table th{font-weight:600;color:var(--text-subtle);font-size:0.75rem;background:var(--gray-50);}.spin{animation:spin 1s linear infinite;}@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}#distribution-result-modal .result-summary{background:var(--success-bg);border:1px solid var(--success);border-radius:var(--radius-md);padding:var(--sp-4);margin-bottom:var(--sp-4);}#distribution-result-modal .error-list{background:var(--warning-bg);border-radius:var(--radius-md);padding:var(--sp-3) var(--sp-4);list-style-position:inside;}#distribution-result-modal .error-list li{padding:var(--sp-1) 0;color:var(--warning);}@media (max-width:768px){.dashboard-stats-grid{grid-template-columns:repeat(2,1fr);}.settings-actions{flex-direction:column;}.simulation-controls{flex-direction:column;align-items:stretch;}.simulation-controls .form-group{max-width:none;}.staff-checkbox-grid{grid-template-columns:1fr;}.sim-staff-name,.chart-name{width:70px;font-size:0.75rem;}.specialty-grid{grid-template-columns:repeat(2,1fr);}}.kpi-detail-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-4);}.kpi-detail-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--sp-3) var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-1);}.kpi-detail-card .kpi-detail-card-label{font-size:var(--text-sm);color:var(--text-muted);font-weight:500;}.kpi-detail-card .kpi-detail-card-value{font-size:var(--text-lg);font-weight:600;color:var(--text);}.kpi-detail-card.total{background:linear-gradient(135deg,var(--primary-50) 0%,var(--accent-50) 100%);border-color:var(--primary-200,rgba(59,130,246,0.25));}.kpi-detail-card.total .kpi-detail-card-value{font-size:var(--text-2xl);color:var(--primary);font-weight:700;}.kpi-detail-branch-group{margin-bottom:var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden;}.kpi-detail-branch-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);background:var(--bg-sunken);cursor:pointer;user-select:none;transition:background 0.15s ease;}.kpi-detail-branch-header:hover{background:var(--border-subtle);}.kpi-detail-branch-header .branch-label{font-weight:600;font-size:var(--text-base);color:var(--text);display:flex;align-items:center;gap:var(--sp-2);}.kpi-detail-branch-header .branch-count{font-size:var(--text-sm);color:var(--text-muted);font-weight:400;}.kpi-detail-branch-header .chevron{width:16px;height:16px;color:var(--text-muted);transition:transform 0.2s ease;flex-shrink:0;}.kpi-detail-branch-header.collapsed .chevron{transform:rotate(-90deg);}.kpi-detail-branch-body{border-top:1px solid var(--border);overflow:hidden;max-height:3000px;transition:max-height 0.3s ease;}.kpi-detail-branch-body.collapsed{max-height:0;border-top-color:transparent;}.kpi-detail-branch-body table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}.kpi-detail-branch-body table thead th{padding:var(--sp-2) var(--sp-3);text-align:left;font-weight:600;font-size:var(--text-xs);color:var(--text-muted);text-transform:uppercase;letter-spacing:0.025em;background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;}.kpi-detail-branch-body table tbody td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border-subtle);color:var(--text-secondary);}.kpi-detail-branch-body table tbody tr:last-child td{border-bottom:none;}.kpi-detail-branch-body table tbody tr:hover{background:var(--bg-sunken);}.member-update-stats-panel{margin:0 var(--sp-4) var(--sp-3);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}.member-stats-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);cursor:pointer;user-select:none;background:linear-gradient(135deg,rgba(22,163,106,0.04),rgba(22,163,106,0.01));border-bottom:1px solid var(--border);}.member-stats-header:hover{background:linear-gradient(135deg,rgba(22,163,106,0.08),rgba(22,163,106,0.03));}.member-stats-title{font-size:var(--text-sm);font-weight:600;color:var(--text-primary);display:flex;align-items:center;}.member-stats-total-badge{display:inline-block;background:#16a34a;color:#fff;font-size:11px;font-weight:600;padding:1px 8px;border-radius:10px;margin-left:8px;}.member-stats-chevron{transition:transform 0.2s ease;color:var(--text-muted);}.member-stats-body{padding:var(--sp-2) var(--sp-4) var(--sp-3);max-height:400px;overflow-y:auto;transition:max-height 0.25s ease,padding 0.25s ease;}.member-stats-body.collapsed{max-height:0;padding-top:0;padding-bottom:0;overflow:hidden;}.member-stat-row{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) 0;border-bottom:1px solid var(--gray-50,#f8fafc);}.member-stat-row:last-child{border-bottom:none;}.member-stat-name{font-size:var(--text-sm);font-weight:500;color:var(--text-primary);min-width:60px;flex-shrink:0;}.member-stat-total{font-size:var(--text-sm);font-weight:600;color:#16a34a;min-width:40px;flex-shrink:0;}.member-stat-cats{display:flex;flex-wrap:wrap;gap:4px;}.member-cat{display:inline-block;font-size:11px;padding:1px 6px;border-radius:8px;font-weight:500;}.member-cat.badge-call0{background:#f1f5f9;color:#64748b;}.member-cat.badge-call1{background:#dbeafe;color:#2563eb;}.member-cat.badge-call2{background:#fef3c7;color:#d97706;}.member-cat.badge-call3{background:#fee2e2;color:#dc2626;}.member-cat.badge-meeting{background:#f3e8ff;color:#9333ea;}.member-cat.badge-payment{background:#dcfce7;color:#16a34a;}.member-stats-count-badge{display:inline-block;background:var(--primary);color:#fff;font-size:11px;font-weight:700;padding:1px 6px;border-radius:10px;margin-left:4px;min-width:20px;text-align:center;}.member-stats-popup-btn:hover .member-stats-count-badge{background:var(--primary-700);}.member-stats-popup-list{display:flex;flex-direction:column;gap:8px;}.member-stat-popup-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--surface-secondary,#f8fafc);border-radius:var(--radius-md);border:1px solid var(--border-subtle,#e2e8f0);}.member-stat-popup-row .member-stat-name{font-weight:600;font-size:var(--text-sm);min-width:60px;}.member-stat-popup-row .member-stat-total{font-weight:700;color:var(--primary);font-size:var(--text-sm);min-width:40px;}.member-stat-popup-row .member-stat-cats{display:flex;gap:4px;flex-wrap:wrap;flex:1;}.monitor-notes-badge{display:inline-flex;align-items:center;gap:2px;color:#16a34a;font-size:12px;font-weight:600;margin-left:8px;}.monitor-staff-stat.notes-highlight .monitor-staff-stat-value{color:#16a34a;font-weight:700;}.data-manage-subtabs{display:flex;gap:4px;padding:16px 20px 0;border-bottom:1px solid var(--border-color,#e2e8f0);margin-bottom:16px;}.data-manage-subtab{padding:8px 20px;border:none;background:none;color:var(--text-secondary,#64748b);font-size:14px;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:color 0.2s,border-color 0.2s;white-space:nowrap;}.data-manage-subtab:hover{color:var(--text-primary,#1e293b);}.data-manage-subtab.active{color:var(--color-primary,#3b82f6);border-bottom-color:var(--color-primary,#3b82f6);}.dm-panel{padding:0 20px 20px;}.dm-search-bar{display:flex;gap:8px;margin-bottom:16px;}.dm-search-input{flex:1;padding:8px 14px;border:1px solid var(--border-color,#e2e8f0);border-radius:8px;font-size:14px;background:var(--bg-primary,#fff);color:var(--text-primary,#1e293b);max-width:400px;}.dm-search-input:focus{outline:none;border-color:var(--color-primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,.1);}.dm-search-btn{padding:8px 18px;border:none;border-radius:8px;background:var(--color-primary,#3b82f6);color:#fff;font-size:14px;font-weight:500;cursor:pointer;}.dm-search-btn:hover{opacity:0.9;}.dm-export-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border:1px solid #059669;border-radius:8px;background:#fff;color:#059669;font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;transition:background 0.15s,color 0.15s;}.dm-export-btn:hover{background:#059669;color:#fff;}.dm-export-btn svg{flex-shrink:0;}.dm-summary{margin-bottom:12px;}.dm-summary-text{font-size:14px;color:var(--text-secondary,#64748b);}.dm-summary-text strong{color:var(--text-primary,#1e293b);}.dm-dup-list{display:flex;flex-direction:column;gap:16px;}.dm-dup-group{border:1px solid var(--border-color,#e2e8f0);border-radius:12px;overflow:hidden;background:var(--bg-primary,#fff);}.dm-dup-group-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 18px;background:var(--bg-secondary,#f8fafc);border-bottom:1px solid var(--border-color,#e2e8f0);}.dm-dup-header-info{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0;}.dm-dup-biz-name{font-weight:700;font-size:16px;color:var(--text-primary,#1e293b);}.dm-dup-header-sub{font-size:13px;color:var(--text-secondary,#64748b);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.dm-dup-header-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;}.dm-dup-place-id{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--text-primary,#1e293b);font-family:'SF Mono','Consolas',monospace;font-weight:600;background:var(--bg-subtle,#f1f5f9);border:1px solid var(--border-color,#e2e8f0);padding:3px 10px;border-radius:6px;max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.dm-place-label{font-size:10px;font-weight:700;color:#fff;background:var(--primary,#3b82f6);padding:1px 6px;border-radius:3px;text-transform:uppercase;letter-spacing:0.5px;flex-shrink:0;}.dm-dup-count{display:inline-flex;align-items:center;padding:2px 10px;border-radius:12px;font-size:12px;font-weight:600;background:#fee2e2;color:#dc2626;white-space:nowrap;}.dm-dup-rows{padding:4px 0;}.dm-dup-row{display:flex;align-items:flex-start;gap:10px;padding:10px 18px;border-bottom:1px solid var(--border-light,#f1f5f9);}.dm-dup-row:last-child{border-bottom:none;}.dm-dup-row--first{background:rgba(59,130,246,.03);}.dm-dup-row--deleted{opacity:0.5;}.dm-dup-row-left{display:flex;align-items:center;gap:6px;flex-shrink:0;min-width:90px;}.dm-dup-row-num{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;font-size:11px;font-weight:700;background:var(--bg-secondary,#f1f5f9);color:var(--text-secondary,#64748b);}.dm-dup-row--first .dm-dup-row-num{background:#3b82f6;color:#fff;}.dm-dup-row-main{flex:1;min-width:0;}.dm-dup-row-line1{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;}.dm-dup-row-registrant{font-weight:600;color:var(--text-primary,#1e293b);}.dm-row-branch{font-weight:400;color:var(--text-tertiary,#94a3b8);font-size:12px;margin-left:4px;}.dm-row-branch::before{content:'';}.dm-row-assignee{font-size:12px;color:var(--text-secondary,#64748b);}.dm-row-assignee::before{content:'\2192 ';}.dm-dup-row-line2{display:flex;align-items:center;gap:10px;margin-top:3px;font-size:12px;color:var(--text-tertiary,#94a3b8);}.dm-dup-row-pid{font-family:'SF Mono','Consolas',monospace;font-size:11px;color:var(--primary,#3b82f6);font-weight:600;background:#eff6ff;padding:1px 6px;border-radius:3px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.dm-dup-row-date{white-space:nowrap;}.dm-dup-row-kw{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px;}.dm-dup-row-biz{font-weight:600;margin-right:6px;}.dm-dup-row-biz::after{content:'\00b7';margin-left:6px;color:var(--text-tertiary);font-weight:400;}.dm-biz-diff{color:#ea580c;background:#fff7ed;padding:1px 4px;border-radius:3px;}.dm-dup-biz-extra{font-size:0.8em;color:var(--text-secondary);margin-left:4px;font-weight:400;}.dm-status-badge{display:inline-block;padding:1px 7px;border-radius:4px;font-size:11px;font-weight:600;white-space:nowrap;}.dm-status-call{background:#dbeafe;color:#2563eb;}.dm-status-meeting{background:#d1fae5;color:#059669;}.dm-status-payment{background:#fef3c7;color:#d97706;}.dm-status-none{background:#f1f5f9;color:#94a3b8;}.dm-status-draft{background:#f1f5f9;color:#64748b;}.dm-status-submitted{background:#fef3c7;color:#d97706;}.dm-status-approved{background:#d1fae5;color:#059669;}.dm-status-rejected{background:#fee2e2;color:#dc2626;}.dm-status-distributed{background:#dbeafe;color:#2563eb;}.dm-status-converted{background:#ede9fe;color:#7c3aed;}@media (max-width:640px){.dm-dup-group-header{flex-direction:column;gap:6px;}.dm-dup-header-top{flex-direction:column;align-items:flex-start;gap:6px;}.dm-dup-place-id{max-width:100%;font-size:12px;}.dm-dup-row{flex-direction:column;gap:4px;padding:10px 14px;}.dm-dup-row-left{min-width:0;}}.dm-table{width:100%;border-collapse:collapse;font-size:13px;}.dm-table th{text-align:left;padding:10px 12px;font-weight:600;color:var(--text-secondary,#64748b);font-size:12px;background:var(--bg-secondary,#f8fafc);border-bottom:1px solid var(--border-color,#e2e8f0);white-space:nowrap;}.dm-table td{padding:10px 12px;color:var(--text-primary,#1e293b);border-bottom:1px solid var(--border-light,#f1f5f9);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.dm-table tbody tr:hover{background:var(--bg-hover,#f1f5f9);}.dm-table-wrap{overflow-x:auto;border:1px solid var(--border-color,#e2e8f0);border-radius:12px;}.dm-addr-cell{max-width:180px;}.dm-source-badge{display:inline-block;padding:2px 8px;border-radius:6px;font-size:11px;font-weight:600;white-space:nowrap;}.dm-source-lead{background:#dbeafe;color:#2563eb;}.dm-source-primary{background:#f3e8ff;color:#7c3aed;}.dm-deleted-label{display:inline-block;padding:1px 6px;border-radius:4px;font-size:10px;font-weight:600;background:#fecaca;color:#dc2626;margin-left:4px;}.dm-loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:40px;color:var(--text-secondary,#64748b);font-size:14px;}.dm-empty{text-align:center;padding:60px 20px;color:var(--text-tertiary,#94a3b8);}.dm-empty p{margin-top:12px;font-size:15px;}.dm-error{text-align:center;padding:20px;color:#dc2626;}.dm-pagination{display:flex;justify-content:center;gap:4px;margin-top:16px;}.dm-page-btn{padding:6px 12px;border:1px solid var(--border-color,#e2e8f0);border-radius:6px;background:var(--bg-primary,#fff);color:var(--text-primary,#1e293b);font-size:13px;cursor:pointer;}.dm-page-btn:hover{background:var(--bg-secondary,#f8fafc);}.dm-page-btn.active{background:var(--color-primary,#3b82f6);color:#fff;border-color:var(--color-primary,#3b82f6);}.dm-date-filter{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-secondary);}.dm-date-input{padding:6px 10px;border:1px solid var(--border);border-radius:var(--radius-md);font-size:13px;background:var(--card);color:var(--text);}.dm-reset-btn{padding:8px 16px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--card);color:var(--text-secondary);font-size:13px;cursor:pointer;transition:background 0.15s;}.dm-reset-btn:hover{background:var(--muted);}.dm-action-cell{display:flex;gap:4px;white-space:nowrap;}.dm-btn{padding:4px 10px;border-radius:var(--radius-sm);font-size:12px;cursor:pointer;border:1px solid var(--border);transition:background 0.15s;}.dm-btn-detail{background:var(--card);color:var(--text);}.dm-btn-detail:hover{background:var(--muted);}.dm-btn-restore{background:var(--primary);color:white;border-color:var(--primary);}.dm-btn-restore:hover{opacity:0.9;}@media (max-width:768px){.dm-panel{padding:0 12px 16px;}.dm-search-bar{flex-direction:column;}.dm-search-input{max-width:none;}.dm-table{font-size:12px;}.dm-table th,.dm-table td{padding:8px 8px;}.dm-addr-cell{max-width:120px;}.data-manage-subtabs{padding:12px 12px 0;}.dm-date-filter{flex-wrap:wrap;}}.leads-tab-header{display:flex;align-items:center;gap:12px;padding:12px 16px 8px;}.leads-tab-title{margin:0;font-size:18px;font-weight:700;color:var(--text-primary);white-space:nowrap;}.dupdb-inline-wrap{position:relative;margin-left:12px;display:flex;align-items:center;gap:4px;}.dupdb-inline-search{display:flex;align-items:center;gap:0;background:#f3f0ff;border:1.5px solid #c4b5fd;border-radius:8px;padding:0 2px 0 10px;height:34px;transition:border-color 0.15s,box-shadow 0.15s;}.dupdb-inline-search:focus-within{border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,0.12);}.dupdb-inline-icon{color:#7c3aed;flex-shrink:0;}.dupdb-inline-input{border:none;background:transparent;outline:none;font-size:13px;color:#1f2937;width:160px;padding:0 6px;height:100%;}.dupdb-inline-input::placeholder{color:#a78bfa;font-size:12px;}.dupdb-inline-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:#7c3aed;color:#fff;border-radius:6px;cursor:pointer;flex-shrink:0;transition:background 0.15s;}.dupdb-inline-btn:hover{background:#6d28d9;}.dupdb-inline-btn:disabled{background:#c4b5fd;cursor:not-allowed;}.dupdb-settings-btn{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1.5px solid #c4b5fd;background:#f3f0ff;color:#7c3aed;border-radius:8px;cursor:pointer;flex-shrink:0;margin-left:4px;transition:background 0.15s,border-color 0.15s;}.dupdb-settings-btn:hover{background:#ede9fe;border-color:#7c3aed;}.badge-dupdb-registered{background:#7c3aed !important;color:#fff !important;font-size:10px !important;padding:2px 6px !important;border-radius:4px !important;font-weight:600 !important;}.badge-dupdb-deleted{background:#6b7280 !important;color:#fff !important;font-size:10px !important;padding:2px 6px !important;border-radius:4px !important;font-weight:600 !important;text-decoration:line-through;}.dupdb-history-table{width:100%;border-collapse:collapse;font-size:13px;}.dupdb-history-table th{background:#f1f5f9;padding:8px 10px;text-align:left;font-weight:600;color:#374151;border-bottom:2px solid #e2e8f0;white-space:nowrap;}.dupdb-history-table td{padding:7px 10px;border-bottom:1px solid #f1f5f9;color:#4b5563;}.dupdb-history-table tr:hover td{background:#f8fafc;}.dupdb-action-register,.dupdb-action-re_register{color:#7c3aed;font-weight:600;}.dupdb-action-delete,.dupdb-action-mark_deleted{color:#ef4444;font-weight:600;}.dupdb-action-contract_update{color:#059669;font-weight:600;}.dupdb-action-mark_registered{color:#6366f1;font-weight:600;}.btn-dupdb-register{white-space:nowrap;padding:0 10px;height:36px;font-size:12px;font-weight:600;color:#fff;background:#7c3aed;border:none;border-radius:6px;cursor:pointer;transition:background 0.15s;}.btn-dupdb-register:hover{background:#6d28d9;}.btn-dupdb-register:disabled{background:#c4b5fd;cursor:not-allowed;}.btn-dupdb-register.btn-dupdb-done{background:#059669;font-size:11px;cursor:default;}.btn-dupdb-register.btn-dupdb-done:disabled{background:#059669;opacity:0.85;}.dupdb-status-label{white-space:nowrap;padding:2px 8px;font-size:11px;font-weight:600;border-radius:4px;user-select:none;}.dupdb-status-label.dupdb-registered{color:#059669;background:#ecfdf5;border:1px solid #a7f3d0;}.dupdb-status-label.dupdb-not-target{color:#6b7280;background:#f3f4f6;border:1px solid #e5e7eb;}.dupdb-status-label.dupdb-auto{color:#7c3aed;background:#f5f3ff;border:1px solid #ddd6fe;}.dupdb-dropdown{position:absolute;top:calc(100% + 6px);left:0;width:380px;max-height:420px;overflow-y:auto;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,0.12);z-index:1000;padding:8px;}.dupdb-dropdown-status{padding:6px 8px;font-size:12px;color:#6b7280;}.dupdb-dropdown-status.error{color:#ef4444;}.dupdb-dropdown-status.success{color:#059669;}.dupdb-dropdown-empty{text-align:center;padding:20px 12px;color:#9ca3af;font-size:13px;}.dupdb-dropdown-empty p{margin:4px 0;}.dupdb-dropdown-config{text-align:center;padding:16px 12px;}.dupdb-dropdown-config p{margin:4px 0;font-size:13px;color:#6b7280;}.dupdb-result-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:10px 12px;margin-bottom:6px;}.dupdb-result-card:last-child{margin-bottom:0;}.dupdb-result-row{display:flex;justify-content:space-between;align-items:center;padding:2px 0;font-size:13px;}.dupdb-result-label{color:#6b7280;min-width:60px;font-size:12px;}.dupdb-result-value{color:#111827;font-weight:500;text-align:right;}@media (max-width:600px){.dupdb-inline-input{width:100px;}.dupdb-dropdown{width:300px;left:0;}}
/* ==================== 1차 전산 통합 CSS ==================== */

/* 대시보드 */
.primary-dashboard{padding:var(--sp-4) 0;}
.primary-dash-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--sp-4);}
.primary-dash-header h3{margin:0;font-size:var(--text-lg);font-weight:700;}
.primary-dash-date{font-size:var(--text-sm);color:var(--text-muted);}

/* KPI 그리드 */
.primary-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);margin-bottom:var(--sp-5);}
.primary-kpi-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);display:flex;align-items:center;gap:var(--sp-3);transition:transform .15s,box-shadow .15s;}
.primary-kpi-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.08);}
.kpi-icon-wrap{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.kpi-today .kpi-icon-wrap{background:rgba(59,130,246,.1);color:#3b82f6;}
.kpi-week .kpi-icon-wrap{background:rgba(16,185,129,.1);color:#10b981;}
.kpi-month .kpi-icon-wrap{background:rgba(245,158,11,.1);color:#f59e0b;}
.kpi-total .kpi-icon-wrap{background:rgba(139,92,246,.1);color:#8b5cf6;}
.kpi-content{flex:1;min-width:0;}
.kpi-value{font-size:var(--text-2xl);font-weight:800;line-height:1.2;}
.kpi-label{font-size:var(--text-xs);color:var(--text-muted);margin-top:2px;}
.kpi-trend{font-size:var(--text-xs);margin-top:4px;}
.trend-up{color:#10b981;font-weight:600;}
.trend-down{color:#ef4444;font-weight:600;}
.trend-flat{color:var(--text-muted);}

/* 대시보드 하단 2열 */
.primary-dash-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);}
.primary-dash-row h4{margin:0 0 var(--sp-3);font-size:var(--text-sm);font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;}
.primary-weekly-chart,.primary-recent-list{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);}

/* 주간 바 차트 */
.weekly-bar-chart{display:flex;flex-direction:column;gap:var(--sp-2);}
.weekly-bar-item{display:flex;align-items:center;gap:var(--sp-2);}
.bar-label{width:24px;font-size:var(--text-xs);color:var(--text-muted);text-align:center;flex-shrink:0;}
.bar-track{flex:1;height:20px;background:var(--bg-subtle);border-radius:var(--radius);}
.bar-fill{height:100%;background:linear-gradient(90deg,#3b82f6,#6366f1);border-radius:var(--radius);transition:width .4s ease;min-width:2px;}
.bar-count{width:28px;font-size:var(--text-xs);font-weight:600;text-align:right;flex-shrink:0;}

/* 최근 등록 목록 */
.primary-perf-list-item{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) 0;border-bottom:1px solid var(--border-subtle);font-size:var(--text-sm);}
.primary-perf-list-item:last-child{border-bottom:none;}
.perf-item-name{flex:1;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.perf-item-phone{color:var(--text-muted);font-size:var(--text-xs);}
.perf-item-date{color:var(--text-muted);font-size:var(--text-xs);flex-shrink:0;}

/* 1차 직원 통계 그리드 */
.staff-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);margin-bottom:var(--sp-4);}
.staff-stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-4);text-align:center;}
.staff-stat-card .stat-num{font-size:var(--text-2xl);font-weight:800;color:var(--primary);}
.staff-stat-card .stat-label{font-size:var(--text-xs);color:var(--text-muted);margin-top:4px;}

/* 변경 이력 테이블 */
.change-history-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);}
.change-history-table th{background:var(--bg-subtle);padding:var(--sp-2) var(--sp-3);text-align:left;font-weight:600;border-bottom:2px solid var(--border);white-space:nowrap;}
.change-history-table td{padding:var(--sp-2) var(--sp-3);border-bottom:1px solid var(--border-subtle);}
.change-history-table tr:hover{background:var(--bg-hover);}

/* 액션 뱃지 */
.badge-action-create_lead{background:#dbeafe;color:#1d4ed8;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;}
.badge-action-update_lead{background:#fef3c7;color:#92400e;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;}
.badge-action-delete_lead,.badge-action-bulk_delete_primary{background:#fee2e2;color:#991b1b;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;}
.badge-action-submit_to_manager,.badge-action-batch_submit_today{background:#d1fae5;color:#065f46;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600;}

/* 일괄 제출 버튼 */
.btn-warning{background:#f59e0b;color:#fff;border:none;font-weight:600;}
.btn-warning:hover{background:#d97706;}

/* 반응형 */
@media (max-width:768px){
  .primary-kpi-grid{grid-template-columns:repeat(2,1fr);}
  .primary-dash-row{grid-template-columns:1fr;}
  .staff-stats-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:480px){
  .primary-kpi-grid{grid-template-columns:1fr;}
  .staff-stats-grid{grid-template-columns:1fr;}
}

/* 공정배분 현황 */
.fairness-pending-header{font-size:var(--text-sm);font-weight:600;color:var(--text-muted);margin-bottom:var(--sp-2);text-transform:uppercase;letter-spacing:.03em;}
.fairness-pending-grid{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-3);}
.fairness-pending-card{background:linear-gradient(135deg,#fef3c7,#fff7ed);border:1px solid #fcd34d;border-radius:var(--radius-md);padding:var(--sp-2) var(--sp-3);min-width:140px;}
.fairness-name{font-weight:600;font-size:var(--text-sm);}
.fairness-shortfall{color:#d97706;font-size:var(--text-xs);font-weight:600;margin-top:2px;}
.fairness-dates{color:var(--text-muted);font-size:11px;margin-top:2px;}

/* 1차 관리자 - 2차 콘텐츠 숨김 강화 */
body.hide-for-primary-manager .kpi-grid:not(.primary-kpi-grid){display:none !important;}
body.hide-for-primary-manager .quick-actions{display:none !important;}
body.hide-for-primary-manager .priority-section{display:none !important;}
body.hide-for-primary-manager #dashboardScoreWidget{display:none !important;}
body.hide-for-primary-manager .dashboard-widget.score-widget{display:none !important;}

/* 서브탭 필터 바 */
.subtab-filter-bar{display:flex;gap:12px;padding:8px 0 12px;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--border);margin-bottom:12px;}
.subtab-date-chips{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.date-chip{padding:4px 14px;border-radius:16px;border:1px solid var(--border);cursor:pointer;font-size:13px;background:var(--card);color:var(--text);transition:background .15s,color .15s,border-color .15s;}
.date-chip:hover{border-color:var(--primary);color:var(--primary);}
.date-chip.active{background:var(--primary);color:#fff;border-color:var(--primary);}
.date-separator{color:var(--text-muted);font-size:13px;}
.date-custom-input{width:130px;padding:4px 8px;border:1px solid var(--border);border-radius:6px;font-size:13px;background:var(--card);color:var(--text);}
.subtab-filter-right{display:flex;gap:8px;align-items:center;margin-left:auto;}
.subtab-select{padding:6px 10px;border:1px solid var(--border);border-radius:6px;font-size:13px;background:var(--card);color:var(--text);min-width:100px;cursor:pointer;}
.subtab-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px rgba(var(--primary-rgb),.15);}
.subtab-search-input{width:180px;padding:6px 10px;border:1px solid var(--border);border-radius:6px;font-size:13px;background:var(--card);color:var(--text);}
.subtab-search-input:focus,.date-custom-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px rgba(var(--primary-rgb),.15);}

/* 페이지 도약 */
.page-jump{display:inline-flex;gap:4px;margin-left:12px;align-items:center;}
.page-jump-input{width:72px;padding:4px 8px;border:1px solid var(--border);border-radius:4px;text-align:center;font-size:13px;background:var(--card);color:var(--text);}
.page-jump-input:focus{outline:none;border-color:var(--primary);}
.page-jump-btn{padding:4px 12px;background:var(--primary);color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:13px;}
.page-jump-btn:hover{opacity:.85;}

@media(max-width:768px){
.subtab-filter-bar{flex-direction:column;align-items:stretch;}
.subtab-date-chips{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.subtab-filter-right{margin-left:0;flex-wrap:wrap;}
.subtab-select{flex:1;min-width:0;}
.date-custom-input{width:110px;}
.subtab-search-input{width:100%;flex:1;}
.page-jump{margin-left:0;margin-top:8px;}
}

/* 배분 모달 드릴다운 트리 */
.distribute-staff-tree{padding:0;}
.dist-branch-group{border-bottom:1px solid var(--border);}
.dist-branch-group:last-child{border-bottom:none;}
.dist-branch-header{display:flex;align-items:center;gap:var(--sp-2);padding:10px 12px;cursor:pointer;font-weight:600;font-size:14px;background:var(--slate-50);user-select:none;transition:background .15s;}
.dist-branch-header:hover{background:var(--slate-100);}
.dist-branch-header .chevron{transition:transform .2s;font-size:12px;color:var(--text-muted);flex-shrink:0;}
.dist-branch-header.collapsed .chevron{transform:rotate(-90deg);}
.dist-branch-header input[type="checkbox"]{margin:0;accent-color:var(--primary);}
.dist-branch-body{padding-left:8px;}
.dist-branch-body.collapsed{display:none;}
.dist-team-group{border-top:1px solid var(--border-light,rgba(0,0,0,.05));}
.dist-team-header{display:flex;align-items:center;gap:var(--sp-2);padding:8px 12px 8px 20px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text-subtle);user-select:none;transition:background .15s;}
.dist-team-header:hover{background:var(--slate-50);}
.dist-team-header .chevron{transition:transform .2s;font-size:11px;color:var(--text-muted);}
.dist-team-header.collapsed .chevron{transform:rotate(-90deg);}
.dist-team-header input[type="checkbox"]{margin:0;accent-color:var(--primary);}
.dist-team-body{padding-left:12px;}
.dist-team-body.collapsed{display:none;}
.dist-member-item{display:flex;align-items:center;gap:var(--sp-2);padding:6px 12px 6px 36px;font-size:13px;cursor:pointer;transition:background .15s;}
.dist-member-item:hover{background:var(--slate-50);}
.dist-member-item input[type="checkbox"]{margin:0;accent-color:var(--primary);}
.dist-member-item .member-name{flex:1;}
.dist-member-item .member-recent{font-size:12px;color:var(--text-muted);white-space:nowrap;}
.dist-member-item.excluded{opacity:.5;text-decoration:line-through;}
.dist-tree-actions .btn-xs{padding:2px 10px;font-size:12px;border-radius:4px;}

/* 받은 이관 카드 */
.td-received-card{display:flex;align-items:center;gap:var(--sp-3);padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:8px;background:var(--card);transition:border-color .15s,box-shadow .15s;cursor:pointer;}
.td-received-card:hover{border-color:var(--primary);box-shadow:0 2px 8px rgba(var(--primary-rgb),.1);}
.td-received-card.selected{border-color:var(--primary);background:rgba(var(--primary-rgb),.04);}
.td-received-card input[type="checkbox"]{margin:0;accent-color:var(--primary);flex-shrink:0;}
.td-received-card .card-info{flex:1;min-width:0;}
.td-received-card .card-name{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.td-received-card .card-meta{font-size:12px;color:var(--text-muted);margin-top:2px;display:flex;gap:var(--sp-2);flex-wrap:wrap;}
.td-received-card .card-status{font-size:12px;padding:2px 8px;border-radius:10px;background:var(--amber-50,#fffbeb);color:var(--amber-700,#b45309);font-weight:500;}

/* 모달 modal-large */
.modal-large{max-width:680px;width:95%;}

/* 총괄 1차 관리자 태그 */
.staff-role-tag.role-primary-director{background:#7c3aed;color:#fff;}

/* 1차 가망 필터 바 레이아웃 */
.primary-filter-bar{display:flex;flex-direction:row;align-items:center;gap:var(--sp-2);flex-wrap:wrap;}
.primary-status-chips{flex:1;min-width:0;}
.primary-date-filter{flex:0 0 auto;}
.primary-date-filter select{height:34px;padding:5px 28px 5px 10px;font-size:13px;font-weight:500;border:1px solid var(--border,#d1d5db);border-radius:8px;background:#fff;color:var(--text,#1f2937);appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;cursor:pointer;transition:border-color 0.15s,box-shadow 0.15s;box-shadow:0 1px 2px rgba(0,0,0,.05);}
.primary-date-filter select:hover{border-color:var(--primary,#3b82f6);}
.primary-date-filter select:focus{outline:none;border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,0.12);}
.primary-category-filters{display:flex;gap:8px;align-items:center;flex-wrap:wrap;width:100%;margin-top:2px;}
.primary-category-filters select{height:36px;padding:6px 30px 6px 10px;font-size:13px;font-weight:500;border:1px solid var(--border,#d1d5db);border-radius:8px;background:#fff;color:var(--text,#1f2937);appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;cursor:pointer;transition:border-color 0.15s,box-shadow 0.15s;box-shadow:0 1px 2px rgba(0,0,0,.05);min-width:110px;flex:1;}
.primary-category-filters select:hover{border-color:var(--primary,#3b82f6);}
.primary-category-filters select:focus{outline:none;border-color:var(--primary,#3b82f6);box-shadow:0 0 0 3px rgba(59,130,246,0.12);}
.primary-search-bar{display:flex;align-items:center;gap:6px;}
@media(max-width:640px){
.primary-filter-bar{flex-direction:column;align-items:stretch;}
.primary-date-filter{width:100%;order:-1;}
.primary-category-filters{width:100%;}
.primary-category-filters select{flex:1;min-width:0;}
}

/* 공가 배지 */
.badge-public{display:inline-flex;align-items:center;gap:3px;background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#1d4ed8;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;border:1px solid #93c5fd;letter-spacing:0.5px;white-space:nowrap;}
/* 중요 배지 */
.badge-important{display:inline-flex;align-items:center;gap:2px;background:#fef3c7;color:#b45309;font-size:10px;font-weight:600;padding:1px 6px;border-radius:3px;border:1px solid #fcd34d;letter-spacing:0.3px;white-space:nowrap;}
/* 인수인계 배지 */
.badge-reassigned{display:inline-flex;align-items:center;gap:3px;background:linear-gradient(135deg,#f5f3ff,#ede9fe);color:#6d28d9;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;border:1px solid #c4b5fd;letter-spacing:0.5px;white-space:nowrap;}
/* 중복 소유자 표시 */
.badge-dup-owner{display:block;width:100%;font-size:10px;color:var(--warning,#d97706);margin-top:1px;line-height:1.3;font-weight:500;}
.badge-dup-owner-modal{font-size:12px;color:var(--warning,#d97706);font-weight:500;white-space:nowrap;flex-shrink:0;}

/* 1차 관리자 아코디언 뷰 */
.primary-accordion{display:flex;flex-direction:column;gap:12px;padding:8px 0;}
.acc-toolbar{display:flex;align-items:center;gap:8px;margin-bottom:2px;}
.acc-toolbar .btn-acc-toggle{font-size:12px;color:var(--primary,#2563eb);background:#fff;border:1px solid var(--primary,#2563eb);border-radius:20px;padding:5px 16px;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s;font-weight:600;box-shadow:0 1px 3px rgba(37,99,235,.1);}
.acc-toolbar .btn-acc-toggle:hover{background:var(--primary,#2563eb);color:#fff;box-shadow:0 2px 8px rgba(37,99,235,.25);}
.acc-team{border:none;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.07),0 0 0 1px rgba(0,0,0,.04);}
.acc-team-header{display:flex;align-items:center;gap:12px;padding:14px 18px;cursor:pointer;background:linear-gradient(135deg,#f8fafc 0%,#eef2f7 100%);font-weight:600;font-size:14px;user-select:none;transition:background .2s ease,border-left-color .2s ease;border-left:4px solid var(--primary,#2563eb);}
.acc-team-header:hover{background:linear-gradient(135deg,#eef4ff 0%,#dbeafe 100%);}
.acc-team-header.open{background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);border-left-color:#1d4ed8;}
.acc-team-header .acc-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 2px 6px rgba(37,99,235,.3);}
.acc-team-body{padding:8px 12px 12px;background:linear-gradient(180deg,#f8fafc,#fff);}
.acc-member{margin-top:8px;border:none;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.03);}
.acc-member-header{display:flex;align-items:center;gap:10px;padding:12px 16px;cursor:pointer;background:#fff;font-size:13px;font-weight:500;user-select:none;transition:background .2s ease,border-left-color .2s ease;border-left:3px solid #c7d2fe;}
.acc-member-header:hover{background:#f0f4ff;border-left-color:#818cf8;}
.acc-member-header.open{background:#f0f4ff;border-left-color:#6366f1;}
.acc-member-header .acc-icon{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#4338ca;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.acc-member-body{padding:8px 10px 10px;background:#fafbfe;}
.acc-member-body .primary-lead-card{margin-bottom:8px;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,.05);}
.acc-member-body .primary-lead-card:last-child{margin-bottom:0;}
/* 카드 펼치기/접기 */
.primary-lead-card .card-header{cursor:pointer;user-select:none;}
.primary-lead-card .card-chevron{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;transition:transform .25s ease;color:#94a3b8;margin-left:auto;}
.primary-lead-card .card-chevron svg{width:14px;height:14px;}
.primary-lead-card .card-chevron.open{transform:rotate(90deg);color:var(--primary,#2563eb);}
.primary-lead-card.collapsed .card-body,.primary-lead-card.collapsed .card-footer{display:none!important;}
.primary-lead-card .card-header .card-title-area{flex:1;min-width:0;display:flex;align-items:center;gap:var(--sp-2,6px);flex-wrap:wrap;}
.acc-arrow{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);color:#94a3b8;}
.acc-arrow svg{width:14px;height:14px;}
.acc-arrow.open{transform:rotate(90deg);color:var(--primary,#2563eb);}
.acc-team-name{flex:1;min-width:0;color:#1e293b;letter-spacing:-.01em;}
.acc-member-name{flex:1;min-width:0;color:#374151;}
.acc-count{font-size:11px;color:#fff;font-weight:700;white-space:nowrap;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:20px;padding:3px 12px;min-width:32px;text-align:center;line-height:1.3;box-shadow:0 1px 3px rgba(37,99,235,.25);}
.acc-member-header .acc-count{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#3730a3;font-size:11px;padding:2px 10px;box-shadow:none;font-weight:600;}
/* 지사 필터 칩 */
.acc-branch-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 4px 14px;border-bottom:1px solid var(--border-subtle,#e5e7eb);margin-bottom:8px;}
.acc-branch-chip{display:inline-flex;align-items:center;gap:5px;padding:7px 16px;border-radius:20px;border:1.5px solid var(--border,#d1d5db);background:#fff;color:#374151;font-size:13px;font-weight:500;cursor:pointer;transition:background .2s,color .2s,border-color .2s,box-shadow .2s;white-space:nowrap;box-shadow:0 1px 2px rgba(0,0,0,.04);}
.acc-branch-chip:hover{border-color:var(--primary,#2563eb);color:var(--primary,#2563eb);background:#eff6ff;box-shadow:0 2px 6px rgba(37,99,235,.12);}
.acc-branch-chip.active{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border-color:transparent;box-shadow:0 2px 8px rgba(37,99,235,.3);font-weight:600;}
.acc-chip-count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;font-size:11px;font-weight:700;background:rgba(0,0,0,.06);line-height:1;}
.acc-branch-chip.active .acc-chip-count{background:rgba(255,255,255,.25);color:#fff;}
.acc-branch-label{font-size:11px;font-weight:500;color:#6366f1;background:#eef2ff;padding:1px 8px;border-radius:10px;margin-left:4px;}
/* 서브탭 설명 */
.primary-subtab-desc{display:flex;align-items:center;gap:6px;padding:8px 14px;margin:6px 0;background:linear-gradient(135deg,#f0f9ff,#eff6ff);border-radius:8px;border-left:3px solid #3b82f6;font-size:12px;color:#475569;line-height:1.4;}
.subtab-group{display:inline-flex;gap:2px;padding:2px 4px;border:1px solid var(--border);border-radius:var(--radius-md);align-items:center;}.subtab-group-label{font-size:10px;color:var(--text-muted);padding:2px 4px;font-weight:600;white-space:nowrap;}.primary-subtabs{align-items:center;flex-wrap:wrap;gap:var(--sp-2);}
.subtab-desc-icon{font-size:14px;color:#3b82f6;flex-shrink:0;}
/* KPI 드릴다운 */
.kpi-drilldown{cursor:pointer;transition:transform .15s,box-shadow .15s;}
.kpi-drilldown:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.12);}
.kpi-drilldown:active{transform:translateY(0);}
.btn-dash-more{font-size:12px;color:var(--primary,#2563eb);background:none;border:1px solid var(--primary,#2563eb);border-radius:16px;padding:4px 12px;cursor:pointer;transition:background .2s,color .2s;font-weight:500;}
.btn-dash-more:hover{background:var(--primary,#2563eb);color:#fff;}
.dash-branch-select{font-size:12px;padding:4px 10px;border:1px solid var(--border,#d1d5db);border-radius:8px;background:#fff;color:#374151;}
.primary-drilldown{margin-top:16px;border:1px solid var(--border,#e2e8f0);border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.06);}
.drilldown-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:linear-gradient(135deg,#f8fafc,#eef2f7);border-bottom:1px solid var(--border,#e2e8f0);}
.drilldown-header h4{margin:0;font-size:14px;color:#1e293b;}
.btn-drilldown-close{width:28px;height:28px;border:none;background:#e2e8f0;border-radius:50%;cursor:pointer;font-size:16px;color:#64748b;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s;}
.btn-drilldown-close:hover{background:#dc2626;color:#fff;}

/* 1차 가망 등록 모달 - 작은 화면 스크롤 */
#primaryLeadModal .modal-content.lead-form-modal{max-height:90vh;max-height:90dvh;display:flex;flex-direction:column;}
#primaryLeadModal .modal-content.lead-form-modal form{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;}
#primaryLeadModal .modal-content.lead-form-modal .modal-footer{flex-shrink:0;position:sticky;bottom:0;background:var(--bg-elevated,#fff);border-top:1px solid var(--border,#e2e8f0);z-index:1;}

/* 중복DB 검색 클리어 버튼 */
.dupdb-inline-clear{display:none;align-items:center;justify-content:center;width:20px;height:20px;border:none;background:transparent;color:var(--text-muted,#9ca3af);cursor:pointer;font-size:16px;line-height:1;padding:0;margin-right:2px;border-radius:50%;flex-shrink:0;}
.dupdb-inline-clear:hover{color:var(--danger,#dc2626);background:var(--danger-bg,rgba(220,38,38,0.08));}
.dupdb-inline-input:not(:placeholder-shown) ~ .dupdb-inline-clear,
.dupdb-inline-search:has(.dupdb-inline-input:not(:placeholder-shown)) .dupdb-inline-clear{display:flex;}

/* 1차 직원: 총 건수 라벨 */
.primary-staff-count-label{font-size:var(--text-sm,13px);color:var(--text-secondary,#6b7280);font-weight:600;white-space:nowrap;padding:var(--sp-1) var(--sp-2);background:var(--surface-secondary,#f3f4f6);border-radius:var(--radius-md,6px);}

/* 1차 직원: 오늘 미제출 경고 배너 */
.primary-today-draft-warn{display:flex;align-items:center;gap:var(--sp-2,8px);padding:var(--sp-2) var(--sp-3);margin-bottom:var(--sp-2,8px);background:var(--warning-bg,#fffbeb);border:1px solid var(--warning-border,#fcd34d);border-radius:var(--radius-md,6px);color:var(--warning-700,#b45309);font-size:var(--text-sm,13px);line-height:1.4;}
.primary-today-draft-warn svg{flex-shrink:0;color:var(--warning-600,#d97706);}

/* 1차 가망 검색 돋보기 버튼 */
.primary-search-bar .btn-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:var(--bg-elevated,#fff);border-radius:var(--radius-md,6px);color:var(--text-secondary);cursor:pointer;transition:background 0.15s ease,color 0.15s ease,border-color 0.15s ease;padding:0;}
.primary-search-bar .btn-icon:hover{background:var(--primary,#3b82f6);color:#fff;border-color:var(--primary,#3b82f6);}
.primary-search-bar .btn-icon svg{width:16px;height:16px;}

/* 데이터 관리: 1차/2차 소스 탭 */
.dm-del-source-tabs{display:flex;gap:4px;margin-bottom:12px;padding:3px;background:var(--bg-sunken,#f1f5f9);border-radius:var(--radius-md,6px);}
.dm-del-source-tab{flex:1;padding:6px 12px;border:none;background:transparent;border-radius:var(--radius,4px);font-size:13px;font-weight:500;color:var(--text-subtle,#6b7280);cursor:pointer;transition:background 0.15s ease,color 0.15s ease,box-shadow 0.15s ease;}
.dm-del-source-tab.active{background:var(--bg-elevated,#fff);color:var(--text,#1e293b);box-shadow:0 1px 2px rgba(0,0,0,0.06);}
/* 배분 탭 - 가망 목록 */
.dist-lead-group{border-bottom:1px solid var(--border);}
.dist-lead-group.collapsed .dist-lead-group-body{display:none;}
.dist-lead-group-header{display:flex;align-items:center;gap:4px;padding:6px 10px;background:var(--slate-50);cursor:pointer;user-select:none;}
.dist-grp-arrow{display:flex;align-items:center;transition:transform 0.15s;color:var(--text-muted);flex-shrink:0;}
.dist-lead-group:not(.collapsed) .dist-grp-arrow{transform:rotate(90deg);}
.dist-grp-name{font-size:13px;font-weight:600;color:var(--text);}
.dist-grp-count{font-size:11px;color:var(--text-muted);margin-left:auto;white-space:nowrap;}
.dist-tab-lead-item{display:flex;align-items:center;gap:8px;padding:7px 12px;border-bottom:1px solid var(--border-subtle);cursor:pointer;transition:background 0.1s;}
.dist-tab-lead-item:last-child{border-bottom:none;}
.dist-tab-lead-item:hover{background:var(--primary-bg);}
.dist-tab-lead-item.selected{background:var(--primary-bg-strong);}
.dist-lead-name{font-weight:500;font-size:13px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dist-lead-phone{font-size:11px;color:var(--text-muted);white-space:nowrap;}
.dist-lead-date{font-size:11px;color:var(--text-muted);white-space:nowrap;}
.dist-tab-lead-check,.dist-grp-check{width:16px;height:16px;accent-color:var(--primary);cursor:pointer;flex-shrink:0;}
/* 장기보류 */
.badge-hold{background:#f3f4f6;color:#6b7280;}.call-level-hold{border-left:4px solid #9ca3af;opacity:0.7;}.filter-btn-hold{color:#6b7280;}
/* 가망 재배분 버튼 */
.staff-redistribute-btn{font-size:11px !important;white-space:nowrap;}
.staff-redistribute-btn:hover{background:var(--warning-50,#fffbeb) !important;color:var(--warning-700,#a16207) !important;border-color:var(--warning-500) !important;}
/* 재배분 모달 spinner */
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
/* ==================== 직원관리 서브탭 (칩 스타일) ==================== */
.staff-sub-tabs{display:flex;gap:var(--sp-1-5);flex-wrap:wrap;margin-bottom:var(--sp-4);}
.staff-sub-tab{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-1-5) var(--sp-3);border:1px solid var(--border);border-radius:var(--radius-full);background:var(--bg-elevated);font-size:var(--text-xs);font-weight:500;color:var(--text-subtle);cursor:pointer;transition:border-color 0.15s ease,color 0.15s ease,background-color 0.15s ease;font-family:var(--font);white-space:nowrap;}
.staff-sub-tab:hover{border-color:var(--primary-300);color:var(--primary);background:var(--primary-bg);}
.staff-sub-tab.active{border-color:var(--primary);color:var(--primary);background:var(--primary-bg-strong);font-weight:600;}
.staff-sub-tab .sub-tab-count{font-weight:700;font-size:var(--text-xs);}
/* ==================== 삭제된 계정 카드 ==================== */
.deleted-staff-list{display:flex;flex-direction:column;gap:var(--sp-3);}
.deleted-staff-card{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);transition:box-shadow 0.15s ease,border-color 0.15s ease;}
.deleted-staff-card:hover{border-color:var(--primary-200);box-shadow:0 2px 8px rgba(0,0,0,0.06);}
.deleted-staff-card.has-leads{border-left:3px solid var(--danger);}
.deleted-staff-info{flex:1;min-width:0;}
.deleted-staff-name{font-weight:600;font-size:var(--text-sm);color:var(--text);}
.deleted-staff-meta{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:2px;font-size:var(--text-xs);color:var(--text-muted);}
.deleted-staff-meta span{display:inline-flex;align-items:center;gap:2px;}
.deleted-staff-leads{display:flex;gap:var(--sp-2);flex-wrap:wrap;align-items:center;}
.deleted-lead-badge{display:inline-flex;align-items:center;gap:2px;padding:2px 8px;border-radius:var(--radius-full);font-size:11px;font-weight:500;font-variant-numeric:tabular-nums;background:var(--bg-sunken);color:var(--text-muted);}
.deleted-lead-badge.has-leads{background:var(--danger-50);color:var(--danger);font-weight:700;}
.btn-restore-staff{padding:var(--sp-1-5) var(--sp-3);font-size:var(--text-xs);font-weight:600;color:var(--success-600,#16a34a);background:var(--success-50,#f0fdf4);border:1px solid #86efac;border-radius:var(--radius-full);cursor:pointer;white-space:nowrap;transition:background 0.15s,border-color 0.15s,transform 0.1s;}
.btn-restore-staff:hover{background:#dcfce7;border-color:#4ade80;color:#15803d;}
.btn-restore-staff:active{transform:scale(0.96);}
.deleted-staff-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--sp-8) var(--sp-4);color:var(--text-muted);text-align:center;}
.deleted-staff-empty p{margin:var(--sp-2) 0 0;font-size:var(--text-sm);}
.deleted-staff-summary{padding:var(--sp-2) 0;font-size:var(--text-xs);color:var(--text-muted);text-align:right;}
@media(max-width:768px){.deleted-staff-card{flex-direction:column;align-items:stretch;gap:var(--sp-2);}.deleted-staff-leads{justify-content:flex-start;}.staff-sub-tabs{gap:var(--sp-1);}}

/* 로그인 split 레이아웃 */
.login-screen {
    display: flex;
    min-height: 100vh;
    background: #f0f4f8;
    padding: 0;
    align-items: stretch;
    justify-content: flex-start;
    overflow: hidden;
}
.login-screen::before, .login-screen::after { display: none; }
.login-brand-panel {
    flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #334155 100%);
    color: #e2e8f0; padding: 3rem 2rem; text-align: center; min-height: 100vh;
}
.login-brand-logo { max-width: 180px; height: auto; }
.login-brand-title { font-size: 2rem; font-weight: 800; color: #f1f5f9; margin: 1rem 0 0.25rem; }
.login-brand-subtitle { font-size: 1rem; color: #60a5fa; font-weight: 600; margin-bottom: 1.5rem; }
.login-brand-desc { font-size: 0.9rem; line-height: 1.7; color: #94a3b8; max-width: 320px; }
.login-brand-credit { margin-top: 2rem; font-size: 0.75rem; color: #64748b; }
.login-form-panel { flex: 1; display: flex; align-items: center; justify-content: center; padding: 2rem; }
.login-box { width: 100%; max-width: 380px; }
.login-box h2 { font-size: 1.5rem; font-weight: 700; color: #1e293b; margin-bottom: 0.5rem; }
.login-form-hint { color: #64748b; font-size: 0.875rem; margin-bottom: 1.5rem; }
.login-box .form-group { margin-bottom: 1rem; }
.login-box .form-group label { display: block; font-size: 0.875rem; font-weight: 600; color: #374151; margin-bottom: 0.375rem; }
.login-box .form-group input { width: 100%; padding: 0.625rem 0.875rem; border: 1px solid #d1d5db; border-radius: 8px; font-size: 0.9375rem; background: #fff; transition: border-color 0.2s, box-shadow 0.2s; }
.login-box .form-group input:focus { outline: none; border-color: #3b82f6; box-shadow: 0 0 0 3px rgba(59,130,246,0.1); }
.login-box .btn-full { width: 100%; padding: 0.75rem; font-size: 1rem; font-weight: 600; margin-top: 0.5rem; }
.login-credit { display: none; }
@media (max-width: 768px) {
    .login-screen { flex-direction: column; }
    .login-brand-panel { padding: 2rem 1.5rem; min-height: auto; }
    .login-brand-desc { display: none; }
}

/* 사이드바 네이비 테마 */
.sidebar { background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%); color: #e2e8f0; border-right: none; box-shadow: 2px 0 12px rgba(0,0,0,.15); }
.sidebar-header { border-bottom-color: rgba(255,255,255,.08); }
.sidebar .sidebar-logo { filter: brightness(0) invert(1); }
.sidebar-nav-item { color: #cbd5e1; }
.sidebar-nav-item:hover { background: rgba(255,255,255,.08); color: #f8fafc; }
.sidebar-nav-item.active { background: rgba(59,130,246,.2); color: #60a5fa; border-left-color: #60a5fa; }
.sidebar-nav-item .nav-icon { color: #94a3b8; }
.sidebar-nav-item:hover .nav-icon, .sidebar-nav-item.active .nav-icon { color: #60a5fa; }
.sidebar-nav-item .nav-badge { background: #3b82f6; color: #fff; }
.sidebar-footer { border-top-color: rgba(255,255,255,.08); color: #94a3b8; }
.sidebar-footer-btn { color: #94a3b8; }
.sidebar-footer-btn:hover { color: #f1f5f9; background: rgba(255,255,255,.08); }
.sidebar-section-title { color: #64748b; }
.sidebar .user-info-name { color: #f1f5f9; }
.sidebar .user-info-role { color: #94a3b8; }

/* 별점 필터 */
.filter-star { color: #f59e0b; font-size: 12px; }
.filter-star.active { background: #f59e0b; color: #fff; border-color: #f59e0b; }
.important-btn { cursor: pointer; line-height: 1; letter-spacing: -1px; }
.important-btn:hover { color: #f59e0b; }
#star-popup button { transition: background 0.15s; }
#star-popup button:hover { background: #fef9c3; }

/* 뿌토 필터 */
.filter-btn[data-filter="putto"] { color: #7c3aed; }
.filter-btn[data-filter="putto"].active { background: #7c3aed; color: #fff; border-color: #7c3aed; }
.putto-export-bar { display:none; position:fixed; bottom:0; left:0; right:0; background:#7c3aed; color:#fff; padding:12px 24px; z-index:9999; box-shadow:0 -2px 10px rgba(0,0,0,.2); }
.putto-bar-btn { background:#fff; color:#7c3aed; border:none; padding:8px 16px; border-radius:6px; font-weight:600; cursor:pointer; }
.putto-bar-btn-danger { background:#ef4444; color:#fff; }

/* 오늘수정 필터 */
.filter-btn-notes-today { color: #16a34a; }
.filter-btn-notes-today.active { background: #16a34a; color: #fff; border-color: #16a34a; }

/* 필터 반응형 */
.filter-buttons, .team-leads-quick-filters { flex-wrap: wrap; gap: 4px; }
@media (max-width: 900px) {
    .filter-star .filter-count, .filter-star .tl-star-count { display: none; }
    .filter-btn { padding: 4px 8px; font-size: 12px; }
}

/* 페이지네이션 버튼 */
.notice-page-btn {
    padding: 4px 10px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #fff;
    color: #374151;
    font-size: 13px;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.notice-page-btn:hover { background: #f3f4f6; }
.notice-page-btn.active { background: #3b82f6; color: #fff; border-color: #3b82f6; }
.notice-page-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.extend-lead-btn{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:#ecfdf5;color:#059669;border:1px solid #a7f3d0;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:background .2s,color .2s,border-color .2s;white-space:nowrap}.extend-lead-btn:hover{background:#d1fae5;border-color:#6ee7b7;color:#047857}.extend-lead-btn svg{flex-shrink:0}.extend-lead-btn.pending{background:#fef3c7;color:#d97706;border-color:#fcd34d;cursor:default;opacity:.8}.notice-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:20px; }.notice-header h3 { font-size:22px;font-weight:700;color:#1e293b;margin:0; }.notice-list { display:flex;flex-direction:column;gap:10px; }.notice-item { background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:16px 20px;transition:box-shadow 0.2s,border-color 0.2s; }.notice-item:hover { box-shadow:0 4px 12px rgba(0,0,0,0.06);border-color:#d1d5db; }.notice-item.unread { border-left:3px solid #3b82f6;background:#fafbff; }.notice-item.pinned { border-left:3px solid #f59e0b; }.notice-item-header { display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap; }.notice-item-title { font-size:15px;font-weight:600;color:#1e293b;line-height:1.4; }.notice-item-meta { display:flex;gap:12px;margin-top:8px;font-size:12px;color:#9ca3af; }.notice-item-admin { display:flex;gap:6px;margin-top:10px; }.notice-new-badge { background:#3b82f6;color:#fff;font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;line-height:1; }.notice-pin-badge { background:#fef3c7;color:#92400e;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px; }.notice-target { font-size:11px;color:#6b7280;background:#f3f4f6;padding:2px 8px;border-radius:4px; }.notice-date { font-size:12px;color:#9ca3af;margin-left:auto; }.notice-confirmed-badge { background:#dcfce7;color:#15803d;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px; }.notice-filter-bar { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:8px; }.notice-filter-chips { display:flex;gap:6px; }.notice-filter-chip { padding:6px 14px;border:1px solid #e5e7eb;border-radius:20px;background:#fff;font-size:13px;color:#374151;cursor:pointer;transition:all 0.15s; }.notice-filter-chip:hover { border-color:#93c5fd;background:#f8fafc; }.notice-filter-chip.active { background:#3b82f6;color:#fff;border-color:#3b82f6; }.notice-filter-chip span { font-weight:600;margin-left:4px; }.notice-pagination { display:flex;justify-content:center;gap:4px;margin-top:20px; }.notice-page-btn { padding:6px 12px;border:1px solid #e5e7eb;border-radius:6px;background:#fff;font-size:13px;color:#374151;cursor:pointer; }.notice-page-btn:hover { background:#f3f4f6;border-color:#d1d5db; }.notice-page-btn.active { background:#3b82f6;color:#fff;border-color:#3b82f6; }

/* Restored missing rules */
.import-detail-section{margin-bottom:16px;padding:12px;background:#fafafa;border-radius:8px;border:1px solid #e5e7eb}
.import-detail-section h4{font-size:13px;font-weight:600}
.import-detail-table{width:100%;border-collapse:collapse;font-size:12px;margin-top:4px}
.import-detail-table th{background:#f3f4f6;text-align:left;padding:6px 10px;font-weight:600;color:#374151;border-bottom:2px solid #d1d5db}
.import-detail-table td{padding:6px 10px;border-bottom:1px solid #e5e7eb;color:#4b5563}
.import-detail-table tr:hover td{background:#f9fafb}
.dist-section{background:#fff;border-radius:12px;padding:24px;margin-bottom:20px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.dist-section-header{margin-bottom:20px}
.dist-section-header h3{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;color:#1f2937;margin:0 0 6px 0}
.dist-section-header h3 .material-icons{font-size:20px;color:#6366f1}
.dist-section-header .section-desc{font-size:13px;color:#6b7280;margin:0}
.algo-cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.algo-cards-grid{grid-template-columns:1fr}
.algo-card{display:flex;align-items:flex-start;gap:16px;padding:16px;border:2px solid #e5e7eb;border-radius:12px;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;position:relative;background:#fff}
.algo-card:hover{border-color:#d1d5db;box-shadow:0 4px 12px rgba(0,0,0,.08)}
.algo-card.selected{border-color:#6366f1;background:#f5f3ff}
.algo-card-icon{flex-shrink:0;width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.algo-card-icon .material-icons{font-size:24px;color:#fff}
.algo-card-content{flex:1;min-width:0}
.algo-card-content h4{font-size:15px;font-weight:600;color:#1f2937;margin:0 0 2px 0}
.algo-subtitle{font-size:12px;color:#6b7280;display:block;margin-bottom:6px}
.algo-desc{font-size:13px;color:#4b5563;margin:0;line-height:1.4}
.algo-card-check{position:absolute;top:12px;right:12px;opacity:0;transition:opacity .2s}
.algo-card-check .material-icons{font-size:24px;color:#6366f1}
.algo-card.selected .algo-card-check{opacity:1}
.algo-config-card{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;border-left-width:4px}
.algo-config-header{display:flex;align-items:center;gap:10px;padding:14px 20px;color:#fff;font-weight:500}
.algo-config-header .material-icons{font-size:20px}
.algo-pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:0;border-bottom:1px solid #e5e7eb}
.algo-pros-cons{grid-template-columns:1fr}
.algo-pros-cons .cons,.algo-pros-cons .pros{padding:16px 20px}
.algo-pros-cons .pros{background:#f0fdf4;border-right:1px solid #e5e7eb}
.algo-pros-cons .cons{background:#fef2f2}
.algo-pros-cons .pros{border-right:none;border-bottom:1px solid #e5e7eb}
.algo-pros-cons h5{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin:0 0 10px 0}
.algo-pros-cons .pros h5{color:#16a34a}
.algo-pros-cons .cons h5{color:#dc2626}
.algo-pros-cons ul{list-style:none;padding:0;margin:0}
.algo-pros-cons li{display:flex;align-items:flex-start;gap:6px;font-size:13px;margin-bottom:6px;line-height:1.4}
.algo-pros-cons li:last-child{margin-bottom:0}
.algo-pros-cons .pros li{color:#166534}
.algo-pros-cons .cons li{color:#991b1b}
.algo-pros-cons li .material-icons{font-size:16px;flex-shrink:0}
.algo-pros-cons .pros li .material-icons{color:#16a34a}
.algo-pros-cons .cons li .material-icons{color:#dc2626}
.config-fields{padding:20px}
.config-field{margin-bottom:20px}
.config-field:last-child{margin-bottom:0}
.config-field label{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#374151;margin-bottom:8px}
.config-field label .material-icons{font-size:18px;color:#6366f1}
.config-field .field-hint{width:100%;font-size:12px;font-weight:400;color:#6b7280;margin-top:2px}
.config-field input[type=number],.config-field select{width:100%;max-width:200px;padding:10px 14px;border:1px solid #d1d5db;border-radius:8px;font-size:14px;transition:border-color .2s,box-shadow .2s}
.config-field input[type=number]:focus,.config-field select:focus{outline:0;border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.1)}
.config-field input[type=range]{flex:1;max-width:200px;height:6px;border-radius:3px;background:#e5e7eb;-webkit-appearance:none;appearance:none}
.config-field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#6366f1;cursor:pointer;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.2)}
.range-value{display:inline-block;min-width:40px;text-align:center;font-size:14px;font-weight:600;color:#6366f1;background:#f5f3ff;padding:4px 8px;border-radius:6px;margin-left:12px}
.config-note{display:flex;align-items:center;gap:10px;padding:16px 20px;color:#6b7280;font-size:14px}
.config-note .material-icons{color:#6366f1}
.staff-stats{display:flex;gap:12px}
.staff-stats .stat-item{display:flex;align-items:center;gap:3px;font-size:12px;color:#6b7280}
.staff-stats .stat-item .material-icons{font-size:14px}
.exclude-badge{display:none;font-size:11px;font-weight:600;color:#dc2626;background:#fee2e2;padding:3px 8px;border-radius:4px}
.staff-checkbox-item.excluded .exclude-badge{display:block}
.sim-input-group{display:flex;flex-direction:column;gap:6px}
.sim-input-group label{font-size:13px;font-weight:500;color:#4b5563}
.input-with-suffix{display:flex;align-items:center;border:1px solid #d1d5db;border-radius:8px;overflow:hidden;background:#fff}
.input-with-suffix input{flex:1;width:80px;padding:10px 12px;border:none;font-size:14px}
.input-with-suffix input:focus{outline:0}
.input-suffix{padding:10px 12px;background:#f3f4f6;color:#6b7280;font-size:13px;border-left:1px solid #e5e7eb}
.btn-simulate{display:flex;align-items:center;gap:6px;padding:10px 20px;background:linear-gradient(135deg,#6366f1 0,#4f46e5 100%);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:transform .2s,box-shadow .2s}
.btn-simulate:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,.4)}
.btn-simulate:disabled{opacity:.7;cursor:not-allowed;transform:none}
.simulation-result-container{margin-top:20px}
.simulation-result-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;background:#f9fafb;border-radius:10px;border-left:4px solid;margin-bottom:16px}
.sim-algo-info{display:flex;align-items:center;gap:8px}
.sim-algo-info .material-icons{font-size:22px}
.sim-algo-name{font-weight:600;color:#374151}
.sim-summary{font-size:14px;color:#6b7280}
.sim-total{font-weight:600;color:#1f2937}
.sim-bar-wrapper{flex:1;display:flex;align-items:center;gap:10px;height:28px;background:#f3f4f6;border-radius:6px;overflow:hidden;position:relative}
.sim-bar-label{position:absolute;right:10px;font-size:12px;font-weight:500;color:#374151}
.dist-actions-bar{display:flex;justify-content:flex-end;gap:12px;padding:20px 0;border-top:1px solid #e5e7eb;margin-top:8px;position:sticky;bottom:0;background:#f5f7fa}
.dist-actions-bar .btn{display:flex;align-items:center;gap:6px;padding:12px 24px;border-radius:10px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.dist-actions-bar .btn-secondary{background:#fff;color:#374151;border:1px solid #d1d5db}
.dist-actions-bar .btn-secondary:hover{background:#f3f4f6}
.dist-actions-bar .btn-primary{background:linear-gradient(135deg,#6366f1 0,#4f46e5 100%);color:#fff;border:none}
.dist-actions-bar .btn-primary:hover{box-shadow:0 4px 12px rgba(99,102,241,.4)}
.dist-actions-bar .btn:disabled{opacity:.6;cursor:not-allowed}
.stat-icon{width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px!important;color:#fff}
.stat-leads .stat-icon{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
.stat-converted .stat-icon{background:linear-gradient(135deg,#10b981,#059669)}
.stat-rate .stat-icon{background:linear-gradient(135deg,#f59e0b,#d97706)}
.stat-days .stat-icon{background:linear-gradient(135deg,#8b5cf6,#6d28d9)}
.stat-content{flex:1}
.rate-badge{display:inline-block;padding:4px 10px;border-radius:6px;font-weight:600}
.rate-badge.rate-high{background:#dcfce7;color:#166534}
.rate-badge.rate-medium{background:#fef3c7;color:#92400e}
.rate-badge.rate-low{background:#fee2e2;color:#991b1b}
.no-specialty{color:#9ca3af}
.loading-placeholder{display:flex;align-items:center;justify-content:center;gap:10px;padding:40px;color:#9ca3af;font-size:14px}
.filter-buttons.has-overflow::after,.tab-nav.has-overflow::after,.primary-subtabs.has-overflow::after{opacity:1}
.tooltip,[data-tooltip]::after{z-index:var(--z-tooltip)}
.skeleton-loading{position:relative;overflow:hidden;color:transparent!important}
.skeleton-loading::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(0,0,0,.05) 50%,transparent 75%);background-size:200% 100%;animation:skeleton-shimmer 1.5s infinite;border-radius:4px}
.team-lead-card .badge{font-size:10px;padding:1px 5px}
.team-lead-reserve-btn,.team-lead-edit-btn{padding:6px!important;min-width:28px;min-height:28px}
/* Deleted leads selection styles */
#dmDelTable tr.del-selected{background:var(--accent-light,#eff6ff) !important;}
#dmDelTable tr.del-selected td{border-color:var(--accent,#3b82f6);}
#dmDelTable .del-check{cursor:pointer;width:16px;height:16px;}
/* ============================================
   CRM Redesign Override - openplat.kr style
   v1.0 2026-03-17
   ============================================ */

/* === 1. Root Variables Override === */
:root{--primary: #3b82f6;
    --primary-hover: #2563eb;
    --primary-light: #60a5fa;
    --primary-bg: rgba(59, 130, 246, 0.05);
    --primary-bg-strong: rgba(59, 130, 246, 0.1);
    --primary-ring: rgba(59, 130, 246, 0.2);
    --primary-50: #eff6ff;
    --primary-100: #dbeafe;
    --primary-200: #bfdbfe;
    --primary-300: #93c5fd;
    --primary-400: #60a5fa;
    --primary-500: #3b82f6;
    --primary-600: #2563eb;
    --primary-700: #1d4ed8;
    --primary-800: #1e40af;
    --primary-900: #1e3a8a;
    --accent: #3b82f6;
    --accent-50: #eff6ff;
    --accent-100: #dbeafe;
    --accent-light: #eff6ff;
    --color-primary: #3b82f6;
    --bg: #f8fafc;
    --card: #ffffff;
    --border: #e5e7eb;
    --border-strong: #d1d5db;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;}
.sidebar .settings-btn,
body .sidebar-nav-item[data-tab="settings"]{color: rgba(255,255,255,0.6);}
.sidebar .settings-btn:hover,
body .sidebar-nav-item[data-tab="settings"]:hover{color: #ffffff;
    background: rgba(255,255,255,0.06);}
.sidebar .settings-btn .sidebar-icon,
body .sidebar-nav-item[data-tab="settings"] .sidebar-icon{color: rgba(255,255,255,0.5);
    stroke: rgba(255,255,255,0.5);}
/* === 7. Tables === */
.table thead th,
table thead th,
body .dm-table thead th{background: #f9fafb;
    color: #374151;
    font-weight: 600;
    font-size: 13px;
    border-bottom: 1px solid #e5e7eb;}
.table tbody tr:hover,
body table tbody tr:hover{background: #f9fafb;}
/* Matrix table headers */
body .matrix-table thead th,
body .audit-table th,
body .goals-table th{background: #f8fafc;
    color: #64748b;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.05em;}
/* === Login exact match to openplat.kr === */
/* Left panel */
#loginScreen .login-brand-panel .login-brand-logo{max-width: 200px; max-height: 40px; height: auto;}
/* === Security premium polish === */
body .security-kpi-card .kpi-icon{margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: #eff6ff;
    margin-left: auto;
    margin-right: auto;}
.security-kpi-card.warning .kpi-icon{background: #fffbeb;}
.security-kpi-card.danger .kpi-icon{background: #fef2f2;}
/* Alert cards in dashboard */
.security-alerts-list .security-alert-card,
body .security-alerts-list > div[style*='background']{border-radius: 10px;
    padding: 16px 20px;
    margin-bottom: 10px;}
/* Dashboard banner */
.dashboard-notice-banner{margin-bottom:16px;}
.dash-notice-wrap{display:flex;flex-direction:column;gap:8px;}
.dash-notice-item{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:10px 16px;transition:background 0.15s;}
.dash-notice-item:hover{background:#f8fafc;}
.dash-notice-title{font-size:14px;font-weight:500;color:#1e293b;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dash-notice-date{font-size:12px;color:#9ca3af;white-space:nowrap;}
body .team-lead-delete-btn{opacity: 0; transition: opacity 0.15s;}
body .team-lead-card:hover .team-lead-delete-btn{opacity: 1; color: #ef4444;}