:root{--primary:#ff6b00;--primary-hover:#e55f00;--primary-light:#fff3eb;--bg:#f5f6fa;--bg-white:#fff;--sidebar-bg:#1b1e2b;--sidebar-text:#a0a4b8;--sidebar-active:#fff;--sidebar-active-bg:#ff6b001f;--text:#1e1e2d;--text-muted:#6b7280;--text-light:#9ca3af;--border:#e5e7eb;--border-light:#f0f0f5;--success:#10b981;--danger:#ef4444;--warning:#f59e0b;--info:#3b82f6;--shadow-sm:0 1px 2px #0000000d;--shadow:0 1px 3px #0000001a, 0 1px 2px #0000000f;--shadow-md:0 4px 6px #00000012, 0 2px 4px #0000000f;--shadow-lg:0 10px 15px #0000001a, 0 4px 6px #0000000d;--radius:12px;--radius-sm:8px;--radius-xs:6px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{width:100%;height:100vh}.card{background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);padding:1.5rem}.card-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;display:flex}.card-header h3{color:var(--text);text-transform:uppercase;letter-spacing:.5px;font-size:.9rem;font-weight:600}.kpi-card{background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);flex-direction:column;gap:.5rem;padding:1.25rem;display:flex}.kpi-card .kpi-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:.8rem;font-weight:500}.kpi-card .kpi-value{color:var(--text);font-size:1.75rem;font-weight:700}.kpi-card .kpi-change{font-size:.8rem;font-weight:500}.kpi-card .kpi-change.positive{color:var(--success)}.kpi-card .kpi-change.negative{color:var(--danger)}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.875rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover);box-shadow:var(--shadow-md)}.btn-outline{color:var(--text-muted);border:1px solid var(--border);background:0 0}.btn-outline:hover{background:var(--bg);color:var(--text)}.badge{border-radius:20px;align-items:center;padding:.2rem .6rem;font-size:.75rem;font-weight:600;display:inline-flex}.badge-success{color:#065f46;background:#ecfdf5}.badge-warning{color:#92400e;background:#fffbeb}.badge-danger{color:#991b1b;background:#fef2f2}.badge-info{color:#1e40af;background:#eff6ff}.badge-neutral{color:#374151;background:#f3f4f6}.table-wrapper{background:var(--bg-white);border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden}table{border-collapse:collapse;width:100%}thead{background:var(--bg)}th{text-align:left;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid var(--border);padding:.75rem 1rem;font-size:.8rem;font-weight:600}td{border-bottom:1px solid var(--border-light);padding:.75rem 1rem;font-size:.875rem}tr:hover{background:var(--primary-light);cursor:pointer}tr:last-child td{border-bottom:none}.toolbar{justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.search-input{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-white);color:var(--text);width:280px;padding:.5rem .75rem;font-size:.875rem;transition:border-color .2s}.search-input:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #ff6b001a}.grid-2{grid-template-columns:repeat(2,1fr);gap:1rem;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:1rem;display:grid}.grid-6{grid-template-columns:repeat(6,1fr);gap:1rem;display:grid}.tabs{border-bottom:2px solid var(--border);gap:0;margin-bottom:1.5rem;display:flex}.tab{color:var(--text-muted);cursor:pointer;border-bottom:2px solid #0000;margin-bottom:-2px;padding:.75rem 1.25rem;font-size:.875rem;font-weight:500;transition:all .2s}.tab:hover{color:var(--text)}.tab.active{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}.page-header{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.page-header h1{color:var(--text);font-size:1.5rem;font-weight:700}@media (width<=768px){.grid-2,.grid-3,.grid-4,.grid-6{grid-template-columns:1fr}.toolbar{flex-direction:column;align-items:stretch}.search-input{width:100%}}