/* NHỊP Tổng quan v2 — bố cục theo từng sàn. Dùng biến màu sẵn có, chỉ thêm lớp .odv */
.odv .odv-hd h1{margin:0;font-size:22px}.odv .odv-hd p{margin:2px 0 12px}.odv .b{background:#f2f7ff}.odv .odv-seg{display:inline-flex;gap:4px}.odv .odv-seg button{padding:3px 10px;border-radius:5px;font-size:12px;border:0;background:none;color:#6b7a90;cursor:pointer}.odv .odv-seg button.on{background:#1570ef;color:#fff}.odv .odv-fc{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;font-size:12px}.odv .odv-fc div{display:flex;flex-direction:column}.odv .odv-fc span{color:#6b7a90}.odv .odv-th{width:62px;height:50px;border-radius:6px;flex:none;background:linear-gradient(135deg,#2b6cb0,#9cc7ee) center/cover}.odv .odv-n{display:flex;gap:10px}.odv .odv-n em{display:inline-block;font-style:normal;font-size:10px;background:#f2f7ff;color:#1570ef;padding:1px 7px;border-radius:4px;font-weight:600;margin-bottom:3px}.odv .odv-fl{display:flex;gap:14px;margin:6px 0;font-size:11px;color:#6b7a90}.odv .odv-fl b{display:block;font-size:17px}.odv .odv-ai h3{font-size:14px;margin:0 0 6px}.odv .odv-ai h3 em{font-style:normal;font-size:10px;background:#1570ef;color:#fff;padding:1px 6px;border-radius:4px}.odv .odv-ai small{display:block;margin-top:8px;color:#6b7a90;font-size:11px}.odv .odv-h b{display:block;font-size:13px}.odv .odv-tabs{display:inline-flex;gap:4px;padding:3px;border:1px solid var(--line,#e3eaf3);border-radius:8px;background:var(--card,#fff);margin:0 0 12px}
.odv .odv-tabs button{padding:6px 16px;border-radius:6px;font-weight:600;color:#6b7a90;border:0;background:none;cursor:pointer}
.odv .odv-tabs button[aria-selected=true]{background:#1570ef;color:#fff}
.odv .odv-g{display:grid;gap:12px;margin-top:12px}
.odv .g4{grid-template-columns:repeat(4,1fr)}.odv .g5{grid-template-columns:repeat(5,1fr)}.odv .g2{grid-template-columns:1.2fr 1fr}.odv .g2e{grid-template-columns:1fr 1fr}
.odv .odv-c{background:var(--card,#fff);border:1px solid var(--line,#e3eaf3);border-radius:10px;padding:12px 14px;min-width:0}
.odv .odv-c h2{font-size:15px;margin:0 0 8px;display:flex;justify-content:space-between;gap:8px}
.odv .odv-c h2 a{font-size:11px;font-weight:500;color:#1570ef;text-decoration:none}
.odv .odv-v{font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}
.odv .odv-c svg.spark{width:100%;height:42px;display:block;margin-top:4px}
.odv .u{background:#e8f7ee}.odv .d{background:#fdecec}.odv .f{background:#fff6e0}
.odv .odv-t{width:100%;border-collapse:collapse;font-size:12.5px;font-variant-numeric:tabular-nums}
.odv .odv-t td,.odv .odv-t th{padding:8px 4px;text-align:right;border-bottom:1px solid var(--line,#e3eaf3)}
.odv .odv-t th{font-size:10.5px;font-weight:500;color:#6b7a90}
.odv .odv-t td:nth-child(-n+3),.odv .odv-t th:nth-child(-n+3){text-align:left}
.odv .odv-t td:nth-child(2){font-weight:700}
.odv .odv-p{padding:2px 7px;border-radius:5px;font-weight:600}
.odv .odv-p.up{background:#e8f7ee}.odv .odv-p.dn{background:#fdecec}
.odv .odv-h{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}
.odv .odv-h div{border-radius:6px;padding:10px 4px;text-align:center;font-size:11px;font-weight:600}
.odv .odv-n{display:block;padding:8px 0;border-bottom:1px solid var(--line,#e3eaf3);color:inherit;text-decoration:none}
.odv .odv-n small{display:block;color:#6b7a90}

/* Bố cục theo chiều rộng của chính vùng nội dung (container query), không theo màn hình → vùng ~880px vẫn giữ đúng hàng như ảnh mẫu */
.odv{container-type:inline-size;container-name:odv}
.odv .odv-g{gap:10px;margin-top:10px}
.odv .g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.odv .g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.odv .g2{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.odv .g2e{grid-template-columns:repeat(2,minmax(0,1fr))}
.odv .g3{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,1fr)}
.odv .odv-c{padding:10px 12px}
.odv .odv-c h2{font-size:14px;margin:0 0 6px}
.odv .odv-v{font-size:21px;line-height:1.2}
.odv .odv-ix.sel{border-color:#1570ef;box-shadow:0 0 0 1px #1570ef inset}
.odv .odv-ix b{font-size:13px}
.odv .odv-c svg.spark{height:34px}
.odv .odv-t td,.odv .odv-t th{padding:5px 3px}
.odv .odv-t{font-size:12px}
.odv .odv-n{padding:6px 0}
.odv .odv-n .odv-th{width:56px;height:42px}
.odv .odv-h{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}
.odv .odv-h div{padding:7px 2px;font-size:10.5px;overflow:hidden;text-overflow:ellipsis}
.odv .odv-fl{gap:10px;flex-wrap:wrap}
.odv .odv-fl b{font-size:15px}
.odv .odv-hd p{margin:2px 0 8px}
.odv .odv-hd h1{font-size:20px}
@container odv (max-width:860px){
  .odv .g3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .odv .g3 .odv-ai{grid-column:1/-1}
}
@container odv (max-width:700px){
  .odv .g2{grid-template-columns:minmax(0,1fr)}
  .odv .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .odv .g5{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@container odv (max-width:520px){
  .odv .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .odv .g3{grid-template-columns:minmax(0,1fr)}
  .odv .g2e{grid-template-columns:minmax(0,1fr)}
  .odv .odv-hm{display:none}
}
