:root{color-scheme:dark;--bg:#020617;--surface:#0f172a;--surface2:#111c31;--line:#1e293b;--muted:#94a3b8;--text:#e2e8f0;--white:#fff;--green:#10b981;--teal:#2dd4bf;--blue:#38bdf8;--amber:#f59e0b;--rose:#fb7185}
*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -20%,#0f2b35 0,transparent 40%),var(--bg)}button,input,select{font:inherit}.topbar{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:rgba(15,23,42,.92);backdrop-filter:blur(14px)}.topbar__inner,.container{width:min(1280px,calc(100% - 32px));margin:auto}.topbar__inner{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:16px 0}.brand__title{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--white);font-size:20px}.brand__title svg{color:#34d399;width:24px}.brand__title span{font-size:11px;color:#6ee7b7;border:1px solid rgba(16,185,129,.28);background:rgba(16,185,129,.09);border-radius:999px;padding:3px 8px}.brand p{margin:4px 0 0;color:var(--muted);font-size:12px}.filters{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap}.filters label{display:grid;gap:4px;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:700;letter-spacing:.06em}.filters select,.filters input{height:34px;padding:0 10px;border-radius:8px;border:1px solid #334155;background:#1e293b;color:var(--text);outline:none}.filters select:focus,.filters input:focus{border-color:var(--green)}.filters button,.alert button{height:34px;border:0;border-radius:8px;padding:0 13px;background:#059669;color:#fff;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:7px}.filters button:hover,.alert button:hover{background:#10b981}.filters button:disabled{opacity:.55;cursor:wait}.filters svg{width:15px}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.container{padding:28px 0 40px}.statusbar{display:flex;justify-content:space-between;gap:16px;padding-bottom:13px;margin-bottom:16px;border-bottom:1px solid rgba(30,41,59,.8);font-size:12px;color:var(--muted)}.alert{margin:12px 0;padding:12px 14px;border-radius:10px;display:flex;align-items:center;gap:9px;font-size:12px}.alert[hidden]{display:none}.alert--error{border:1px solid rgba(244,63,94,.35);background:rgba(244,63,94,.08);color:#fecdd3}.alert--error button{margin-left:auto;background:#be123c}.alert--info{border:1px solid rgba(56,189,248,.25);background:rgba(56,189,248,.07);color:#bae6fd}.kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.card{background:linear-gradient(145deg,rgba(15,23,42,.98),rgba(10,18,34,.98));border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.12)}.kpi{padding:16px}.kpi header{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}.kpi svg{width:17px;color:var(--blue)}.kpi strong{display:block;margin-top:7px;font-size:27px;color:var(--white)}.kpi--success svg,.kpi--success strong{color:var(--green)}.kpi--teal svg,.kpi--teal strong{color:var(--teal)}.kpi--warning svg,.kpi--warning strong{color:var(--amber)}.kpi--danger svg,.kpi--danger strong{color:var(--rose)}.charts{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}.chart-card{padding:20px}.chart-card h2,.table-card h2{display:flex;align-items:center;gap:8px;margin:0;color:#f8fafc;font-size:14px}.chart-card h2 svg,.table-card h2 svg{width:18px;color:var(--blue)}.chart-card p{margin:5px 0 0;color:var(--muted);font-size:11px}.chart-wrap{height:280px;margin-top:18px}.table-card{margin-top:20px;overflow:hidden}.table-card__header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 18px;border-bottom:1px solid var(--line)}.badges{display:flex;flex-wrap:wrap;gap:8px}.badge{padding:4px 9px;border-radius:999px;font-size:11px;border:1px solid}.badge--success{color:#6ee7b7;background:rgba(16,185,129,.08);border-color:rgba(16,185,129,.25)}.badge--danger{color:#fda4af;background:rgba(244,63,94,.08);border-color:rgba(244,63,94,.25)}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:12px}th,td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line)}th{background:rgba(2,6,23,.55);color:var(--muted);font-weight:700}td{color:#cbd5e1}tbody tr:hover{background:rgba(30,41,59,.42)}td:first-child{color:#fff;font-weight:700}.success{color:#34d399}.warning{color:#fbbf24}.danger{color:#fb7185}.empty{text-align:center!important;color:var(--muted)!important;padding:28px!important}footer{text-align:center;color:#64748b;font-size:11px;padding:0 16px 28px}
@media(max-width:1050px){.topbar__inner{align-items:flex-start;flex-direction:column}.kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.topbar{position:static}.topbar__inner,.container{width:min(100% - 24px,1280px)}.filters{width:100%}.filters label{flex:1;min-width:130px}.filters input,.filters select{width:100%}.filters button{align-self:flex-end}.statusbar{align-items:flex-start;flex-direction:column}.kpis{grid-template-columns:repeat(2,1fr)}.charts{grid-template-columns:1fr}.table-card__header{align-items:flex-start;flex-direction:column}.chart-wrap{height:250px}}
@media(max-width:420px){.brand__title{align-items:flex-start;flex-wrap:wrap;font-size:17px}.kpis{grid-template-columns:1fr 1fr}.kpi{padding:13px}.kpi strong{font-size:23px}.alert{align-items:flex-start;flex-wrap:wrap}.alert button{margin-left:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
