/* [23/10] CHỈ SỐ VĨ MÔ (Tiến trình, dưới dòng tiền) — ô số + đường 7 ngày; biểu đồ lớn trong hộp nổi. Xanh tăng · đỏ giảm như bảng giá.
   Không cuộn ngang: ô gói dòng theo lưới auto-fill, đường co theo viewBox. Chữ Việt không dùng font mono (số · giờ mới mono). */
.vm-khoi { margin-top: 18px; }
.vm-luoi-o { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.vm-o-so { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 10px 12px 8px; text-align: left; cursor: pointer;
  border: 1px solid var(--wow-vien); border-radius: 10px; background: var(--wow-mat); color: var(--wow-chu); font: inherit; }
.vm-o-so:hover { filter: brightness(1.18); }
.vm-ten { font-family: var(--wow-font-chu); font-size: 11px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--wow-chu-3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vm-dong { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.vm-dong b { font-size: 22px; line-height: 1.1; }
.vm-chenh { font-family: var(--wow-font-chu); font-variant-numeric: tabular-nums; font-style: normal; font-size: 11px; white-space: nowrap; }
.vm-chenh.tang, .vm-o span.tang { color: var(--wow-tot); }
.vm-chenh.giam, .vm-o span.giam { color: var(--wow-xau); }
.vm-chenh.deu { color: var(--wow-chu-3); }
.vm-svg { display: block; width: 100%; height: auto; touch-action: pan-y; }
.vm-svg.nho { height: 44px; }
.vm-svg.nho .vm-duong, .vm-svg.nho .vm-sale { vector-effect: non-scaling-stroke; }
.vm-luoi { stroke: var(--wow-vien-nhat); stroke-width: 1; }
.vm-nhan { fill: var(--wow-chu-3); font-family: var(--wow-font-mono); font-size: 10px; }
.vm-duong { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.vm-svg.nho .vm-duong { stroke-width: 1.5; }
.vm-duong.dut { stroke-dasharray: 4 4; opacity: 0.75; }
/* [12/11] đoạn máy đổi độ phủ (page quét lệch >15% so 24h trước) — xám, không mang màu tăng/giảm vì không phải thị trường */
.vm-duong.vm-doi-phu { stroke: var(--wow-chu-3); opacity: 0.6; }
.vm-duong.tang, .vm-cham.tang { stroke: var(--wow-tot); }
.vm-duong.giam, .vm-cham.giam { stroke: var(--wow-xau); }
.vm-duong.deu, .vm-cham.deu { stroke: var(--wow-chu-2); }
.vm-cham { fill: var(--wow-mat); stroke-width: 2; }
.vm-to-dau { stop-color: var(--wow-chu-2); stop-opacity: 0.18; }
.vm-to-dau.tang { stop-color: var(--wow-tot); }
.vm-to-dau.giam { stop-color: var(--wow-xau); }
.vm-to-cuoi { stop-color: var(--wow-mat); stop-opacity: 0; }
.vm-vach { stroke: var(--wow-chu-4); stroke-width: 1; }
.vm-cham-re { fill: var(--wow-chu); stroke: var(--wow-mat); stroke-width: 2; }
.vm-khung { position: relative; }
.vm-o { position: absolute; top: 0; width: 150px; padding: 6px 9px; border: 1px solid var(--wow-vien); border-radius: 8px; background: var(--wow-mat);
  display: flex; flex-direction: column; gap: 2px; pointer-events: none; }
.vm-o span { font-family: var(--wow-font-chu); font-variant-numeric: tabular-nums; font-size: 11px; color: var(--wow-chu-2); }
.vm-o b { font-family: var(--wow-font-so); font-size: 18px; color: var(--wow-chu); }
.vm-lon { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 12px; }
.vm-dau { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.vm-dau b { font-size: 34px; }
.vm-dau .vm-chenh { font-size: 13px; }
.vm-chon { display: flex; gap: 6px; flex-wrap: wrap; }
.vm-nut { padding: 3px 10px; font-size: 12px; opacity: 0.6; }
.vm-nut.chon { opacity: 1; }
.vm-sale { stroke: var(--wow-cam-sang); stroke-width: 1; stroke-dasharray: 2 3; opacity: 0.55; }
.vm-sale-chu { fill: var(--wow-cam-sang); }