:root{--bg:#f4f6f9;--surface:#fff;--ink:#0e1a2b;--ink-panel:#17263b;--muted:#5b6779;--muted-dark:#c9d2de;--line:#e3e8ef;--track:#eef2f7;--border:#d5dce5;--primary:#1b4f9c;--primary-hover:#123a75;--up:#1b5fb8;--up-dark:#8fc1ff;--down:#b93c08;--radius:14px;--shadow:0 1px 2px #0e1a2b0f;--page:16px;font-variant-numeric:tabular-nums;font-family:Be Vietnam Pro,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);margin:0;font-size:14px;line-height:1.45}button,select,input{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:3px solid var(--primary);outline-offset:2px}h1{margin:0 0 4px;font-size:26px}h2{margin:0 0 10px;font-size:17px}.muted{color:var(--muted);font-size:12px}.app{flex-direction:column;min-height:100%;display:flex}.side{display:none}.main{min-width:0;padding:var(--page);padding-bottom:calc(76px + env(safe-area-inset-bottom));flex:1}.topbar{align-items:center;gap:10px;margin-bottom:12px;display:flex}.topbar .title{flex:1;min-width:0}.tabbar{z-index:20;background:var(--ink);padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--ink-panel);display:flex;position:fixed;bottom:0;left:0;right:0}.tabbar a{min-height:56px;color:var(--muted-dark);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;font-size:11px;text-decoration:none;display:flex}.tabbar a[aria-current=page]{color:#fff;box-shadow:inset 0 3px 0 var(--up-dark);font-weight:600}.ico{font-size:18px;line-height:1}.btn{border:1px solid var(--border);background:var(--surface);border-radius:10px;min-width:44px;min-height:44px;padding:0 14px;font-weight:500}.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn.primary:hover{background:var(--primary-hover)}.only-mobile{justify-content:center;align-items:center;display:inline-flex}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);min-width:0;padding:18px}.grid{gap:14px;display:grid}.kpis{grid-template-columns:1fr 1fr}.kpi .nhan{color:var(--muted);font-size:12px}.kpi .gt{overflow-wrap:break-word;margin:2px 0 6px;font-size:20px;font-weight:700}.delta{color:var(--muted);flex-wrap:wrap;gap:4px 10px;font-size:12px;display:flex}.delta b{font-weight:600}.tang{color:var(--up)}.giam{color:var(--down)}.thieu,.ngang{color:var(--muted)}.seg{border:1px solid var(--border);background:var(--surface);border-radius:10px;display:inline-flex;overflow:hidden}.seg button{background:0 0;border:0;min-width:44px;min-height:44px;padding:0 12px}.seg button[aria-pressed=true]{background:var(--primary);color:#fff;font-weight:600}.filters{gap:12px;display:grid}.field{gap:4px;display:grid}.field>label,.field>.lbl{color:var(--muted);font-size:12px;font-weight:500}.field select{border:1px solid var(--border);background:var(--surface);border-radius:10px;min-height:44px;padding:0 10px}.ms{position:relative}.ms>button{text-align:left;border:1px solid var(--border);background:var(--surface);border-radius:10px;justify-content:space-between;align-items:center;gap:6px;width:100%;min-height:44px;padding:0 10px;display:flex}.ms-pop{z-index:30;background:var(--surface);border:1px solid var(--border);border-radius:10px;min-width:240px;max-height:300px;margin-top:4px;padding:6px;position:absolute;left:0;right:0;overflow:auto;box-shadow:0 8px 24px #0e1a2b29}.ms-pop input[type=search]{border:1px solid var(--border);border-radius:8px;width:100%;min-height:40px;margin-bottom:4px;padding:0 8px}.ms-pop label{border-radius:8px;align-items:center;gap:8px;min-height:40px;padding:0 6px;display:flex}.ms-pop label:hover{background:var(--track)}.ms-pop input[type=checkbox]{width:20px;height:20px}.sheet{z-index:40;background:#0e1a2b73;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet>div{background:var(--surface);width:100%;max-height:88%;padding:16px var(--page) calc(16px + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;overflow:auto}.sheet .head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.banner{background:var(--ink-panel);color:#fff;border-radius:12px;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px;padding:10px 14px;display:flex}.banner span{flex:1;min-width:180px}.state{text-align:center;color:var(--muted);padding:40px 16px}.err{color:var(--down)}.scroll-x{overflow-x:auto}@media (width>=900px){:root{--page:28px}.app{flex-direction:row}.side{background:var(--ink);color:#fff;flex-direction:column;flex:none;align-self:flex-start;gap:4px;width:220px;min-height:100vh;padding:20px 12px;display:flex;position:sticky;top:0}.side .brand{padding:4px 12px 16px;font-size:17px;font-weight:700}.side a{min-height:44px;color:var(--muted-dark);border-radius:10px;align-items:center;gap:10px;padding:0 12px;text-decoration:none;display:flex}.side a[aria-current=page]{background:var(--ink-panel);color:#fff;font-weight:600}.tabbar,.only-mobile{display:none}.main{padding-bottom:var(--page)}.filters.bar{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));align-items:end}.kpis{grid-template-columns:1fr}.overview{grid-template-columns:300px 1fr;align-items:start}.kpi .gt{font-size:30px}}@media (prefers-reduced-motion:no-preference){.card{transition:box-shadow .15s}}.head-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.head-row h2{margin:0}.bang-cuon{border:1px solid var(--line);border-radius:10px;max-height:620px;overflow:auto}.bang{border-collapse:collapse;width:100%;font-size:13px}.bang th{z-index:2;background:var(--track);text-align:right;white-space:nowrap;border-bottom:1px solid var(--border);padding:10px;position:sticky;top:0}.bang td{border-bottom:1px solid var(--line);white-space:nowrap;padding:8px 10px}.bang .so{text-align:right;position:relative}.bang th.trai,.bang td.trai{text-align:left;white-space:normal;min-width:220px}.bang tbody tr:hover{background:var(--track)}.thanh{background:linear-gradient(to right, var(--primary) var(--w), var(--track) var(--w));border-radius:3px;height:6px}.bang td .thanh{min-width:90px;margin-bottom:3px}.the-dn{border-top:1px solid var(--line);padding:12px 0}.the-dn:first-child{border-top:0}.hang{min-width:24px}
