@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";:root{--bg-deep:#eef1f6;--bg-base:#f4f6fa;--bg-surface:#eceff4;--bg-card:#fff;--bg-hover:#e6eaf1;--border:#0f172a1a;--border-glow:#4f8ef766;--accent:#3a7cf5;--accent-dim:#4f8ef71f;--accent-glow:#4f8ef74d;--success:#2f9e5f;--warning:#dd7a1f;--danger:#e53e63;--info:#3182ce;--text-primary:#1a202c;--text-secondary:#4a5568;--text-muted:#718096;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--shadow-sm:0 2px 8px #0f172a0f;--shadow-md:0 8px 24px #0f172a1a;--shadow-lg:0 20px 60px #0f172a29;--shadow-glow:0 0 30px #4f8ef71a}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg-deep);height:100%;color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif;font-size:14px;line-height:1.6}a{color:inherit;text-decoration:none}button{cursor:pointer;font-family:inherit}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:3px}.app-layout{min-height:100vh;display:flex}.sidebar{background:var(--bg-surface);border-right:1px solid var(--border);z-index:100;flex-direction:column;flex-shrink:0;gap:8px;width:240px;padding:24px 16px;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-logo{align-items:center;gap:10px;padding:8px 12px 24px;display:flex}.sidebar-logo .logo-icon{object-fit:contain;flex-shrink:0;width:34px;height:auto}.sidebar-logo .logo-text{color:var(--text-primary);letter-spacing:-.3px;font-size:15px;font-weight:700}.sidebar-logo .logo-text span{color:var(--accent)}.nav-item{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;background:var(--bg-card);border:1px solid #0f172a1f;align-items:center;gap:10px;padding:10px 12px;font-size:13.5px;font-weight:500;text-decoration:none;transition:all .18s;display:flex}.nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.nav-item.active{background:var(--accent-dim);color:var(--accent);border-color:var(--border-glow)}.nav-item svg{flex-shrink:0;width:17px;height:17px}.sidebar-spacer{flex:1}.sidebar-user{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-card);align-items:center;gap:10px;padding:10px 12px;display:flex}.sidebar-user .user-avatar{background:linear-gradient(135deg, var(--accent), #a78bfa);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:12px;font-weight:700;display:flex}.sidebar-user .user-info{flex:1;overflow:hidden}.sidebar-user .user-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;font-weight:600;overflow:hidden}.sidebar-user .user-role{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px}.main-content{flex:1;min-height:100vh;margin-left:240px;padding:32px;overflow-x:hidden}.page-header{margin-bottom:28px}.page-header h1{color:var(--text-primary);letter-spacing:-.5px;font-size:22px;font-weight:700}.page-header p{color:var(--text-secondary);margin-top:4px;font-size:13.5px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px;transition:border-color .2s}.card:hover{border-color:var(--border-glow)}.card-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:8px;margin-bottom:14px;font-size:13px;font-weight:600;display:flex}.card-title svg{width:15px;height:15px}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px;display:grid}.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:8px;padding:20px 20px 16px;transition:all .2s;display:flex;position:relative;overflow:hidden}.stat-card:before{content:"";background:var(--accent);opacity:0;height:2px;transition:opacity .2s;position:absolute;top:0;left:0;right:0}.stat-card:hover{border-color:var(--border-glow);box-shadow:var(--shadow-glow)}.stat-card:hover:before{opacity:1}.stat-card.success:before{background:var(--success)}.stat-card.warning:before{background:var(--warning)}.stat-card.danger:before{background:var(--danger)}.stat-card.info:before{background:var(--info)}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:11.5px;font-weight:600}.stat-value{color:var(--text-primary);letter-spacing:-1px;font-size:28px;font-weight:800;line-height:1}.stat-value.success{color:var(--success)}.stat-value.warning{color:var(--warning)}.stat-value.danger{color:var(--danger)}.stat-value.info{color:var(--info)}.stat-sub{color:var(--text-muted);font-size:11.5px}.charts-grid{grid-template-columns:2fr 1fr;gap:16px;margin-bottom:24px;display:grid}.charts-grid-3{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px;display:grid}.chart-container{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px}.btn{border-radius:var(--radius-sm);white-space:nowrap;border:1px solid #0000;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;transition:all .18s;display:inline-flex}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:#3a7cf5;transform:translateY(-1px);box-shadow:0 4px 12px #4f8ef766}.btn-ghost{color:var(--text-secondary);background:#dde2ec;border-color:#0f172a1f}.btn-ghost:hover{color:var(--text-primary);background:#cbd3e1}.btn-danger{color:var(--danger);background:0 0;border-color:#fc5c7d4d}.btn-danger:hover{background:#fc5c7d1a}.btn-sm{padding:5px 10px;font-size:12px}.switch-row{color:var(--text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;font-size:12px;font-weight:600;display:inline-flex}.switch-track{background:#cbd3e1;border:1px solid #0f172a1f;border-radius:999px;flex-shrink:0;width:34px;height:20px;transition:background .18s,border-color .18s;position:relative}.switch-track:after{content:"";background:#fff;border-radius:50%;width:16px;height:16px;transition:transform .18s;position:absolute;top:1px;left:1px;box-shadow:0 1px 3px #0f172a4d}.switch-track.on{background:var(--accent);border-color:var(--accent)}.switch-track.on:after{transform:translate(14px)}.badge{text-transform:uppercase;letter-spacing:.3px;border-radius:999px;align-items:center;padding:3px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-success{color:var(--success);background:#48bb7826}.badge-warning{color:var(--warning);background:#ed893626}.badge-danger{color:var(--danger);background:#fc5c7d26}.badge-info{color:var(--info);background:#63b3ed26}.badge-muted{background:var(--bg-hover);color:var(--text-muted)}.table-wrapper{overflow-x:auto}table{border-collapse:collapse;width:100%}thead tr{border-bottom:1px solid var(--border)}thead th{text-align:left;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;padding:10px 14px;font-size:11.5px;font-weight:600}tbody tr{border-bottom:1px solid var(--border);transition:background .15s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:var(--bg-hover)}tbody td{color:var(--text-secondary);padding:12px 14px;font-size:13.5px}.input{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);outline:none;width:100%;padding:9px 12px;font-family:inherit;font-size:13.5px;transition:border-color .18s}.input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.input::placeholder{color:var(--text-muted)}.select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;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='%23718096' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;outline:none;padding:8px 32px 8px 12px;font-family:inherit;font-size:13px;transition:border-color .18s}.select:focus{border-color:var(--accent)}.select-accent{border-color:var(--accent);background-color:var(--accent-dim);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='%233a7cf5' stroke-width='2.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");font-weight:600;transition:border-color .18s,background-color .18s,box-shadow .18s}.select-accent:hover{background-color:var(--accent-glow)}.select-accent:focus{box-shadow:0 0 0 3px var(--accent-dim)}.select-accent:disabled{opacity:.55;cursor:not-allowed}.spinner{border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:20px;height:20px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.export-button-wrap{align-items:center;gap:8px;display:inline-flex}.export-button-wrap .spin{animation:.7s linear infinite spin}.export-button-wrap button:disabled{opacity:.6;cursor:progress}.export-button-error{color:var(--danger);max-width:260px;font-size:12px}.loading-center{justify-content:center;align-items:center;height:200px;display:flex}.toast-container{z-index:9999;flex-direction:column;gap:10px;max-width:360px;display:flex;position:fixed;bottom:24px;right:24px}.toast{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);border-left:3px solid var(--danger);align-items:flex-start;gap:12px;padding:14px 16px;animation:.25s ease-out slideInUp;display:flex}.toast-icon{width:32px;height:32px;color:var(--danger);background:#fc5c7d26;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.toast.toast-success{border-left-color:var(--success)}.toast.toast-success .toast-icon{color:var(--success);background:#48bb7826}.toast-body{flex:1}.toast-title{color:var(--text-primary);font-size:13px;font-weight:700}.toast-message{color:var(--text-secondary);margin-top:2px;font-size:12px;line-height:1.5}.toast-close{color:var(--text-muted);background:0 0;border:none;padding:2px;display:flex}@keyframes slideInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.login-page{background:radial-gradient(ellipse 80% 50% at 20% 80%, #4f8ef714 0%, transparent 60%), radial-gradient(ellipse 60% 40% at 80% 20%, #a78bfa14 0%, transparent 60%), var(--bg-deep);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-xl);width:100%;max-width:400px;box-shadow:var(--shadow-lg), 0 0 60px #4f8ef70f;padding:40px 36px}.login-header{text-align:center;margin-bottom:32px}.login-logo{object-fit:contain;width:72px;height:auto;margin:0 auto 16px;display:block}.login-header h1{color:var(--text-primary);letter-spacing:-.5px;font-size:22px;font-weight:700}.login-header p{color:var(--text-muted);margin-top:6px;font-size:13px}.form-group{margin-bottom:16px}.form-group label{color:var(--text-secondary);margin-bottom:7px;font-size:12.5px;font-weight:600;display:block}.login-btn{border-radius:var(--radius-sm);background:linear-gradient(135deg, var(--accent), #a78bfa);color:#fff;cursor:pointer;letter-spacing:.2px;border:none;justify-content:center;align-items:center;gap:8px;width:100%;margin-top:8px;padding:12px;font-size:14px;font-weight:700;transition:all .2s;display:flex}.login-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 20px #4f8ef766}.login-btn:disabled{opacity:.6;cursor:not-allowed}.login-error{border-radius:var(--radius-sm);color:var(--danger);background:#fc5c7d1a;border:1px solid #fc5c7d40;align-items:center;gap:8px;margin-bottom:14px;padding:10px 14px;font-size:12.5px;display:flex}.tab-group{border-radius:var(--radius-sm);background:#dde2ec;gap:2px;padding:3px;display:flex}.tab-btn{color:var(--text-muted);background:0 0;border:none;border-radius:6px;padding:6px 14px;font-size:12.5px;font-weight:600;transition:all .18s}.tab-btn.active{background:var(--bg-card);color:var(--text-primary)}.empty-state{text-align:center;color:var(--text-muted);padding:48px 24px}.empty-state svg{opacity:.3;margin-bottom:12px}.empty-state p{font-size:13.5px}.recharts-text{fill:var(--text-muted)!important;font-size:11px!important}.recharts-cartesian-axis-tick-value{fill:var(--text-muted)!important}.recharts-legend-item-text{color:var(--text-secondary)!important;font-size:12px!important}.recharts-tooltip-wrapper{border-radius:var(--radius-sm)!important}.mobile-topbar,.sidebar-overlay{display:none}@media (max-width:900px){.sidebar{width:260px;transition:transform .22s;transform:translate(-100%)}.sidebar.open{box-shadow:var(--shadow-lg);transform:translate(0)}.sidebar-overlay{z-index:99;background:#0000008c;display:block;position:fixed;top:0;bottom:0;left:0;right:0}.mobile-topbar{z-index:98;background:var(--bg-surface);border-bottom:1px solid var(--border);align-items:center;gap:10px;height:56px;padding:0 12px;display:flex;position:fixed;top:0;left:0;right:0}.mobile-menu-btn{border-radius:var(--radius-sm);width:44px;height:44px;color:var(--text-primary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;margin-left:-6px;display:flex}.mobile-topbar-logo{width:26px;height:auto}.main-content{margin-left:0;padding:72px 12px 24px}.stats-grid,.charts-grid,.charts-grid-3{grid-template-columns:1fr}.page-header{margin-bottom:18px}.page-header h1{font-size:19px}.card{padding:16px}.chart-container{padding:14px}.table-wrapper{-webkit-overflow-scrolling:touch}}