:root{--brand: #4f46e5;--brand-hover: #4338ca;--brand-soft: #eef2ff;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-600: #475569;--gray-700: #334155;--gray-800: #1e293b;--gray-900: #0f172a;--bg: #f8fafc;--surface: #ffffff;--surface-hover: #f8fafc;--border: #e2e8f0;--border-strong: #cbd5e1;--text: #0f172a;--text-muted: #64748b;--text-subtle: #94a3b8;--in: #0ea5e9;--in-bg: #f0f9ff;--in-text: #0369a1;--out: #ef4444;--out-bg: #fef2f2;--out-text: #b91c1c;--success: #10b981;--success-bg: #ecfdf5;--success-text: #047857;--warn: #f59e0b;--warn-bg: #fffbeb;--warn-text: #b45309;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 20px;--s6: 24px;--s8: 32px;--s10: 40px;--s12: 48px;--r-sm: 6px;--r-md: 8px;--r-lg: 12px;--r-xl: 16px;--r-pill: 999px;--shadow-xs: 0 1px 2px rgba(15, 23, 42, .04);--shadow-sm: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);--shadow-md: 0 4px 12px rgba(15, 23, 42, .08);--sidebar-w: 240px;--header-h: 60px;--font-sans: "Pretendard Variable", Pretendard, Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}[data-theme=dark]{--bg: #0b1120;--surface: #0f172a;--surface-hover: #1e293b;--border: #1e293b;--border-strong: #334155;--text: #e2e8f0;--text-muted: #94a3b8;--text-subtle: #64748b;--brand-soft: #1e1b4b;--in-bg: #082f49;--in-text: #7dd3fc;--out-bg: #450a0a;--out-text: #fca5a5;--success-bg: #022c22;--success-text: #6ee7b7;--warn-bg: #451a03;--warn-text: #fcd34d;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .4);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .5);--shadow-md: 0 4px 12px rgba(0, 0, 0, .6)}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{font-family:var(--font-sans);font-size:14px;line-height:1.5;font-weight:400;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit}.num,table td,.kpi-value{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}.app-shell{display:grid;grid-template-columns:var(--sidebar-w) 1fr;min-height:100vh;background:var(--bg)}.sidebar{background:var(--surface);border-right:1px solid var(--border);padding:var(--s5) var(--s3);position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.sidebar-brand{display:flex;align-items:center;gap:var(--s2);padding:var(--s2) var(--s3);margin-bottom:var(--s6)}.sidebar-brand-mark{width:28px;height:28px;border-radius:var(--r-md);background:var(--brand);color:#fff;display:grid;place-items:center}.sidebar-brand-text{font-size:15px;font-weight:600;color:var(--text)}.sidebar-section{font-size:11px;font-weight:500;letter-spacing:.04em;color:var(--text-subtle);text-transform:uppercase;padding:var(--s3) var(--s3) var(--s2)}.sidebar-link{display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--s3);border-radius:var(--r-md);font-size:14px;font-weight:500;color:var(--text-muted);transition:background .12s,color .12s}.sidebar-link:hover{background:var(--surface-hover);color:var(--text)}.sidebar-link.active{background:var(--brand-soft);color:var(--brand)}.sidebar-link svg{flex-shrink:0}.sidebar-footer{margin-top:auto;padding-top:var(--s4);border-top:1px solid var(--border)}.app-main{display:flex;flex-direction:column;min-width:0}.app-header{height:var(--header-h);padding:0 var(--s6);background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:var(--s4);position:sticky;top:0;z-index:10}.search{flex:1;max-width:480px;position:relative}.search input{width:100%;height:36px;padding:0 var(--s3) 0 36px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg);color:var(--text);font-size:13px;outline:none;transition:border-color .12s,box-shadow .12s}.search input:focus{border-color:var(--brand);box-shadow:0 0 0 3px #4f46e51f}.search-icon{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:var(--text-subtle);pointer-events:none}.header-actions{display:flex;align-items:center;gap:var(--s2)}.icon-btn{width:36px;height:36px;display:grid;place-items:center;border-radius:var(--r-md);border:1px solid transparent;background:transparent;color:var(--text-muted);position:relative;transition:background .12s,color .12s}.icon-btn:hover{background:var(--surface-hover);color:var(--text)}.icon-btn .badge-dot{position:absolute;top:7px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--out);border:2px solid var(--surface)}.avatar{width:32px;height:32px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:12px;font-weight:600}.app-content{padding:var(--s6);flex:1;min-width:0}.page-header{margin-bottom:var(--s6)}.page-title{font-size:22px;font-weight:600;color:var(--text);margin:0 0 4px}.page-sub{font-size:13px;color:var(--text-muted);margin:0}.grid-12{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--s4)}.col-3{grid-column:span 3}.col-4{grid-column:span 4}.col-6{grid-column:span 6}.col-8{grid-column:span 8}.col-12{grid-column:span 12}@media (max-width: 1100px){.col-3,.col-4{grid-column:span 6}.col-8{grid-column:span 12}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);padding:var(--s5)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s4)}.card-title{font-size:15px;font-weight:600;color:var(--text);margin:0}.card-sub{font-size:12px;color:var(--text-muted)}.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);padding:var(--s5)}.kpi-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--s3)}.kpi-label{font-size:12px;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.kpi-icon{width:36px;height:36px;border-radius:var(--r-md);display:grid;place-items:center}.kpi-value{font-size:28px;font-weight:600;color:var(--text);letter-spacing:-.02em}.kpi-delta{margin-top:var(--s2);font-size:12px;color:var(--text-muted)}.kpi-delta-up{color:var(--success-text)}.kpi-delta-down{color:var(--out-text)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);height:36px;padding:0 var(--s4);border-radius:var(--r-md);font-size:13px;font-weight:500;border:1px solid transparent;transition:background .12s,border-color .12s,color .12s}.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover{background:var(--brand-hover)}.btn-secondary{background:var(--surface);color:var(--text);border-color:var(--border)}.btn-secondary:hover{background:var(--surface-hover);border-color:var(--border-strong)}.btn-ghost{background:transparent;color:var(--text-muted)}.btn-ghost:hover{background:var(--surface-hover);color:var(--text)}.btn:disabled{opacity:.5;cursor:not-allowed}.input,input[type=text],input[type=email],input[type=password],input[type=number],input[type=search],select,textarea{width:100%;height:36px;padding:0 var(--s3);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text);font-size:13px;outline:none;transition:border-color .12s,box-shadow .12s}.input:focus,input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px #4f46e51f}textarea{height:auto;padding:var(--s3);resize:vertical}.label{display:block;font-size:12px;font-weight:500;color:var(--text-muted);margin-bottom:6px}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:var(--r-pill);font-size:11px;font-weight:600;line-height:1;letter-spacing:.02em}.badge-in{background:var(--in-bg);color:var(--in-text)}.badge-out{background:var(--out-bg);color:var(--out-text)}.badge-success{background:var(--success-bg);color:var(--success-text)}.badge-warn{background:var(--warn-bg);color:var(--warn-text)}.badge-neutral{background:var(--gray-100);color:var(--gray-600)}[data-theme=dark] .badge-neutral{background:var(--gray-800);color:var(--gray-300)}.table-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-xs);overflow:hidden}.table-toolbar{padding:var(--s4) var(--s5);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:var(--s3)}table{width:100%;border-collapse:collapse}thead th{background:transparent;font-size:11px;font-weight:500;color:var(--text-subtle);text-transform:uppercase;letter-spacing:.04em;text-align:left;padding:var(--s3) var(--s5);border-bottom:1px solid var(--border);white-space:nowrap}tbody td{padding:var(--s4) var(--s5);font-size:14px;color:var(--text);border-bottom:1px solid var(--border)}tbody tr:last-child td{border-bottom:none}tbody tr{transition:background .12s}tbody tr:hover{background:var(--surface-hover)}.t-muted{color:var(--text-muted);font-size:12px}.t-num{font-variant-numeric:tabular-nums}.t-right{text-align:right}.login-shell{min-height:100vh;display:grid;place-items:center;background:var(--bg);padding:var(--s6)}.login-card{width:100%;max-width:400px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);box-shadow:var(--shadow-md);padding:var(--s8)}.login-brand{display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s6)}.login-brand-mark{width:36px;height:36px;border-radius:var(--r-md);background:var(--brand);color:#fff;display:grid;place-items:center}.login-title{font-size:18px;font-weight:600;margin:0}.login-sub{font-size:12px;color:var(--text-muted)}.mobile-toggle{display:none}@media (max-width: 900px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;top:0;left:0;height:100vh;width:260px;transform:translate(-100%);transition:transform .2s ease;z-index:30;box-shadow:var(--shadow-md)}.sidebar.open{transform:translate(0)}.sidebar-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a66;z-index:20}.mobile-toggle{display:grid}}.row{display:flex;align-items:center;gap:var(--s3)}.col{display:flex;flex-direction:column;gap:var(--s3)}.spacer{flex:1}.muted{color:var(--text-muted)}.subtle{color:var(--text-subtle);font-size:12px}.divider{height:1px;background:var(--border);margin:var(--s4) 0}.empty{padding:var(--s8) var(--s4);text-align:center;color:var(--text-subtle);font-size:13px}.recharts-cartesian-axis-tick-value{fill:var(--text-subtle);font-size:11px}.recharts-cartesian-grid line{stroke:var(--border)}.recharts-tooltip-wrapper{outline:none}.recharts-default-tooltip{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:var(--r-md)!important;box-shadow:var(--shadow-md)!important;padding:8px 12px!important;font-size:12px!important;color:var(--text)!important}.recharts-tooltip-label{color:var(--text-muted)!important;font-size:11px!important}