:root{--bg:#0b1220;--bg-soft:#16213a;--panel:#fff;--panel-soft:#f6f8fb;--border:#e5e9f0;--border-strong:#d3dae4;--text:#101828;--text-soft:#667085;--primary:#2563eb;--primary-strong:#1d4ed8;--primary-soft:#eaf1fe;--accent:#0ea5e9;--green:#16a34a;--green-soft:#e8f7ee;--amber:#d97706;--amber-soft:#fdf3e3;--sky-soft:#e6f6fd;--red:#dc2626;--red-soft:#fdeaea;--ring:0 0 0 3px #2563eb38;--shadow:0 1px 2px #1018280d, 0 1px 3px #1018280f;--shadow-md:0 4px 10px -2px #10182814, 0 2px 4px -2px #1018280f;--radius:14px;font-family:Sarabun,Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html{-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}body{background:var(--panel-soft);color:var(--text);margin:0;font-size:14px;line-height:1.45}:focus-visible{box-shadow:var(--ring);border-radius:8px;outline:none}input:focus,select:focus{box-shadow:var(--ring);outline:none;border-color:var(--primary)!important}::-webkit-scrollbar{width:10px;height:8px}::-webkit-scrollbar-thumb{background:#cbd5e1 padding-box content-box;border:2px solid #0000;border-radius:8px}::-webkit-scrollbar-thumb:hover{background-color:#94a3b8}::-webkit-scrollbar-track{background:0 0}.app{grid-template-columns:240px 1fr;min-height:100vh;display:grid}.sidebar{color:#c3cbdb;background:linear-gradient(#0d1526 0%,#0b1220 55%,#0a101c 100%);flex-direction:column;height:100vh;padding:22px 14px 16px;display:flex;position:sticky;top:0;overflow-y:auto}.sidebar h1{letter-spacing:.01em;color:#fff;align-items:center;gap:9px;margin:0 0 2px;padding:0 10px;font-size:17px;font-weight:700;display:flex}.sidebar .subtitle{color:#5b6b85;letter-spacing:.02em;margin:0 0 18px;padding:0 10px;font-size:11.5px}.nav{flex-direction:column;display:flex}.nav-section{letter-spacing:.09em;text-transform:uppercase;color:#4d5d78;-webkit-user-select:none;user-select:none;margin:14px 10px 6px;font-size:10.5px;font-weight:700}.nav-section:first-child{margin-top:0}.nav a{color:#aab6c9;border-radius:9px;align-items:center;gap:11px;margin-bottom:2px;padding:9px 12px;font-size:13.5px;font-weight:500;text-decoration:none;transition:background .14s,color .14s;display:flex;position:relative}.nav a .ico{opacity:.75;justify-content:center;align-items:center;width:19px;height:19px;transition:opacity .14s;display:inline-flex}.nav a .ico svg{width:18px;height:18px}.nav a:hover{color:#eef2f7;background:#94a3b81a}.nav a:hover .ico{opacity:1}.nav a.active{color:#fff;background:#2563eb2e;font-weight:600}.nav a.active .ico{opacity:1;color:#7fabfd}.nav a.active:before{content:"";background:var(--primary);border-radius:0 3px 3px 0;width:3px;position:absolute;top:7px;bottom:7px;left:-14px}.sidebar-user{border-top:1px solid #94a3b824;margin-top:auto;padding-top:14px}.sidebar-user .who{color:#dbe3ee;white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:9px;padding:6px 10px;font-size:13px;font-weight:600;display:flex;overflow:hidden}.sidebar-user .who .ico{background:#94a3b826;border-radius:50%;flex:none;justify-content:center;align-items:center;width:26px;height:26px;font-size:13px;display:inline-flex}.sidebar-user button{color:#aab6c9;cursor:pointer;background:0 0;border:1px solid #94a3b840;border-radius:9px;width:100%;margin-top:8px;padding:8px 12px;font-family:inherit;font-size:12.5px;transition:background .14s,color .14s,border-color .14s}.sidebar-user button:hover{color:#fca5a5;background:#dc26261f;border-color:#dc262673}.main{width:100%;min-width:0;padding:26px 30px 40px}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:22px;display:flex}.page-head h2{letter-spacing:-.01em;margin:0;font-size:21px;font-weight:700}.page-head p{color:var(--text-soft);margin:4px 0 0;font-size:13px}.section-head{border-top:1px solid var(--border);margin:28px 0 16px;padding-top:22px}.section-head h2{margin:0;font-size:18px;font-weight:700}.section-head p{color:var(--text-soft);margin:4px 0 0;font-size:13px}.filters{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.filters label{color:var(--text-soft);letter-spacing:.02em;flex-direction:column;gap:5px;font-size:11.5px;font-weight:600;display:flex}.filters input,.filters select{border:1px solid var(--border-strong);color:var(--text);background:#fff;border-radius:9px;padding:8px 11px;font-family:inherit;font-size:13.5px;transition:border-color .14s,box-shadow .14s}.filters .presets{border:1px solid var(--border-strong);background:#fff;border-radius:9px;gap:0;display:flex;overflow:hidden}.filters .presets button{border:none;border-right:1px solid var(--border);cursor:pointer;color:var(--text-soft);background:#fff;padding:9px 12px;font-family:inherit;font-size:12px;font-weight:500;transition:background .13s,color .13s,border-color .13s,box-shadow .13s}.filters .presets button:last-child{border-right:none}.filters .presets button:hover{background:var(--panel-soft);color:var(--text)}.filters .presets button.active{background:var(--primary);color:#fff;font-weight:600}.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:24px;display:grid}.kpi{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);align-items:flex-start;gap:14px;padding:16px 18px;transition:box-shadow .16s,transform .16s;display:flex}.kpi:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.kpi .chip{background:var(--primary-soft);border-radius:11px;flex:none;justify-content:center;align-items:center;width:42px;height:42px;font-size:20px;display:flex}.kpi.green .chip{background:var(--green-soft)}.kpi.amber .chip{background:var(--amber-soft)}.kpi.sky .chip{background:var(--sky-soft)}.kpi .body{min-width:0}.kpi .label{color:var(--text-soft);letter-spacing:.01em;align-items:center;gap:6px;font-size:12.5px;font-weight:600;display:flex}.kpi .value{letter-spacing:-.01em;font-variant-numeric:tabular-nums;margin-top:3px;font-size:25px;font-weight:700;line-height:1.2}.kpi .sub{color:var(--text-soft);font-variant-numeric:tabular-nums;margin-top:2px;font-size:12px}.grid-2{grid-template-columns:1fr 1fr;gap:20px;display:grid}.grid-2>.full{grid-column:1/-1}@media (width<=980px){.grid-2,.app{grid-template-columns:1fr}.sidebar{height:auto;position:static}.main{padding:18px 16px 32px}}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px;padding:20px}.panel h3{letter-spacing:-.005em;margin:0 0 16px;font-size:14.5px;font-weight:700}table.data{border-collapse:collapse;width:100%;font-size:13px}table.data th,table.data td{text-align:left;border-bottom:1px solid #eef1f6;padding:9px 12px}table.data thead th{color:var(--text-soft);letter-spacing:.05em;text-transform:uppercase;border-bottom:1px solid var(--border-strong);white-space:nowrap;background:#fafbfd;font-size:11px;font-weight:600}table.data td.num,table.data th.num{text-align:right;font-variant-numeric:tabular-nums}table.data tbody tr{transition:background .1s}table.data tbody tr:hover{background:#f4f7fb}table.data tbody tr:last-child td{border-bottom:none}table.data.heatmap th,table.data.heatmap td{padding:5px 6px}.state{text-align:center;color:var(--text-soft);padding:44px 20px;font-size:13.5px}.state.error{color:var(--red)}.state.loading:before{content:"";border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:26px;height:26px;margin:0 auto 12px;animation:.7s linear infinite busy-spin;display:block}.badge{border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:600;display:inline-block}.badge.blue{background:var(--primary-soft);color:var(--primary-strong)}.pager{color:var(--text-soft);border-top:1px solid #eef1f6;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding-top:12px;font-size:12.5px;display:flex}.pager-btns{align-items:center;gap:6px;display:flex}.pager-btns button{border:1px solid var(--border-strong);cursor:pointer;color:var(--text);background:#fff;border-radius:8px;padding:6px 12px;font-family:inherit;font-size:12.5px;transition:background .13s,color .13s,border-color .13s,box-shadow .13s}.pager-btns button:hover:not(:disabled){border-color:var(--primary);color:var(--primary);background:var(--primary-soft)}.pager-btns button:disabled{opacity:.35;cursor:default}.pager-page{color:var(--text);font-variant-numeric:tabular-nums;padding:0 6px;font-weight:600}.busy-spinner{border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:44px;height:44px;animation:.8s linear infinite busy-spin}@keyframes busy-spin{to{transform:rotate(360deg)}}.export-bar{z-index:40;gap:8px;display:flex;position:fixed;top:16px;right:20px}.export-bar button{border:1px solid var(--border-strong);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--text);cursor:pointer;box-shadow:var(--shadow);background:#ffffffeb;border-radius:9px;padding:7px 13px;font-family:inherit;font-size:12.5px;font-weight:600;transition:background .13s,color .13s,border-color .13s,box-shadow .13s}.export-bar button:hover{border-color:var(--primary);color:var(--primary);box-shadow:var(--shadow-md)}.recharts-default-tooltip{border:1px solid var(--border)!important;box-shadow:var(--shadow-md)!important;border-radius:10px!important;font-size:12.5px!important}.recharts-cartesian-axis-tick text{fill:var(--text-soft)}.login-wrap{background:radial-gradient(900px 480px at 80% -10%,#2563eb47,#0000 60%),radial-gradient(700px 420px at -10% 110%,#0ea5e929,#0000 60%),linear-gradient(160deg,#0d1526 0%,#0b1220 60%,#0a101c 100%);justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:#fff;border-radius:18px;width:100%;max-width:400px;padding:38px 40px 30px;box-shadow:0 24px 70px -12px #0208178c}.login-card .brand{text-align:center;margin-bottom:26px}.login-card .brand h1{letter-spacing:-.01em;margin:8px 0 2px;font-size:21px}.login-card .brand .tag{color:var(--text-soft);font-size:13px}.login-card label{color:var(--text-soft);margin:16px 0 6px;font-size:12.5px;font-weight:600;display:block}.login-card label:first-of-type{margin-top:0}.login-card input{border:1px solid var(--border-strong);border-radius:10px;width:100%;padding:11px 13px;font-family:inherit;font-size:14px;transition:border-color .14s,box-shadow .14s}.login-error{background:var(--red-soft);color:var(--red);border:1px solid #f5c8c8;border-radius:9px;margin-top:14px;padding:10px 12px;font-size:13px}.login-btn{background:linear-gradient(180deg, var(--primary) 0%, var(--primary-strong) 100%);color:#fff;cursor:pointer;border:none;border-radius:11px;width:100%;margin-top:22px;padding:12px 0;font-family:inherit;font-size:15px;font-weight:600;transition:filter .14s,transform .1s}.login-btn:hover:not(:disabled){filter:brightness(1.07)}.login-btn:active:not(:disabled){transform:translateY(1px)}.login-btn:disabled{background:var(--border-strong);cursor:default}.login-foot{text-align:center;color:var(--text-soft);margin-top:16px;font-size:12px}@media print{.sidebar,.export-bar,.busy-overlay,.page-head .filters,.presets{display:none!important}.app{display:block!important}.main{padding:0!important}.panel{break-inside:avoid;border:1px solid #e2e8f0;box-shadow:none!important;overflow:visible!important}table.data{font-size:10px!important}.page-head{border-bottom:1px solid #e2e8f0;padding-bottom:8px}body{background:#fff!important}@page{margin:12mm;size:A4 landscape}}