:root{--nen:#0f1115;--the:#171a21;--vien:#252a35;--chu:#e6e8ec;--mo:#8b93a3;
      --xanh:#3fb950;--do:#f85149;--cam:#d29922;--vang:#e3b341;--lam:#58a6ff}
*{box-sizing:border-box}
body{margin:0;padding:16px;background:var(--nen);color:var(--chu);
     font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
body.giua{display:flex;align-items:center;justify-content:center;min-height:100vh}
a{color:var(--lam);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:20px;margin:0 0 16px}
h2{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--mo);margin:0 0 12px}
.mo{color:var(--mo)}
header{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.phai{margin-left:auto}
.chip{font-size:12px;padding:2px 8px;border:1px solid var(--vien);border-radius:99px;color:var(--mo)}
.chip.do{border-color:var(--do);color:var(--do)}
.the{background:var(--the);border:1px solid var(--vien);border-radius:10px;padding:16px;margin-bottom:16px}
.the.hep{width:min(320px,90vw)}
.the.canh-bao{border-color:var(--cam)}
.so-lieu{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.so-lieu .o{flex:1 1 100px;background:var(--the);border:1px solid var(--vien);
            border-radius:10px;padding:14px;text-align:center}
.so-lieu b{display:block;font-size:26px;line-height:1.2}
.so-lieu span{font-size:12px;color:var(--mo)}
.luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.thanh{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.thanh .ten{width:64px;flex:none;font-size:13px}
.thanh .ray{flex:1;height:8px;background:#0b0d11;border-radius:4px;overflow:hidden}
.thanh .ray i{display:block;height:100%;background:var(--xanh)}
.thanh .so{width:52px;flex:none;text-align:right;font-size:12px;color:var(--mo);
           font-variant-numeric:tabular-nums}
svg.cot{width:100%;height:80px}
svg.cot rect{fill:var(--lam)}
.dong{display:flex;gap:10px;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--vien)}
.dong .tieu-de{flex:1;min-width:180px}
input{width:100%;padding:9px 11px;margin-bottom:12px;background:#0b0d11;color:var(--chu);
      border:1px solid var(--vien);border-radius:7px;font-size:14px}
button{width:100%;padding:9px;background:var(--lam);color:#04070d;border:0;
       border-radius:7px;font-size:14px;font-weight:600;cursor:pointer}
.loi{color:var(--do);font-size:13px;margin:0 0 12px}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;color:var(--mo);font-weight:500;font-size:12px;
   border-bottom:1px solid var(--vien);padding:6px 8px}
td{padding:7px 8px;border-bottom:1px solid var(--vien);vertical-align:top}
.muc{font-size:11px;padding:1px 7px;border-radius:99px;white-space:nowrap}
.m-chan{background:#4a1013;color:#ff7b72}.m-cao{background:#4a2a10;color:#ffa657}
.m-vua{background:#3d3410;color:var(--vang)}.m-thap{background:#12331b;color:#56d364}
.m-x{color:var(--mo)}
.ok{color:var(--xanh)}
@media(max-width:640px){
  body{padding:10px}
  table{display:block;overflow-x:auto;white-space:nowrap}
  .so-lieu .o{flex-basis:calc(50% - 6px)}
}