/* NHỊP · Theo dõi V2 — chỉ dùng token của hệ giao diện (theme.css) nên tự đổi theo:
   Light Pro · Dark Pro · Soft Comfort · Blue Finance (data-skin) · màu nhận diện (--brand) · màu tăng/giảm (--up/--dn)
   · mật độ (data-den) · cỡ chữ (data-fs) · tương phản cao (data-hc) · giảm chuyển động (data-rm) · màu sàn (--house).
   Nạp SAU nhip-skin-fix.css. */
.tw2{--ref:#a86f00;--tw-r:14px;display:flex;flex-direction:column;gap:14px;min-width:0}
html[data-theme="dark"] .tw2{--ref:#f2c14e}
.tw2 .ref{color:var(--ref)!important}
.tw2 .up{color:var(--up)!important}.tw2 .dn{color:var(--dn)!important}
.tw2 .muted{color:var(--muted)!important}

/* Đầu trang */
.tw2-head{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.tw2-title h1{display:flex;align-items:center;gap:8px;margin:2px 0 2px}
.tw2-title p{margin:0;font-size:13.5px}
.tw2-hact{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.tw2-house{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 13px;border-radius:999px;font-weight:800;font-size:13px;
  background:var(--house-soft);color:var(--house-ink,var(--house));border:1px solid color-mix(in srgb,var(--house) 38%,var(--line))}
.tw2-house i{width:8px;height:8px;border-radius:50%;background:var(--house)}
.tw2-add-f{display:flex;gap:8px;margin:0;min-width:0}
.tw2-add-f input{height:40px;min-width:0;width:210px;border-radius:11px;padding:0 12px;box-sizing:border-box;font:inherit}
.tw2-add-f .btn{height:40px;min-height:40px;padding:0 16px;white-space:nowrap;border-radius:11px;font-weight:700}
.tw2-rl{width:40px;height:40px;display:grid;place-items:center;border-radius:11px;cursor:pointer;
  background:var(--surface)!important;color:var(--text2)!important;border:1px solid var(--line2)!important}
.tw2-rl:hover{border-color:var(--brand)!important;color:var(--brand-ink)!important}

/* Thẻ */
.tw2-card,.tw2-k{background:var(--surface)!important;border:1px solid var(--line)!important;border-radius:var(--tw-r);box-shadow:var(--shadow);color:var(--text);min-width:0}
.tw2-card{padding:16px}
html[data-hc="1"] .tw2-card,html[data-hc="1"] .tw2-k{border-width:1.5px!important}
.tw2-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tw2-k{padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.tw2-kl{font-size:12.5px;color:var(--muted);font-weight:600}
.tw2-k strong{font-size:clamp(24px,3.2vw,32px);line-height:1.15;letter-spacing:-.5px;color:var(--text)}
.tw2-k strong.up{color:var(--up)}.tw2-k strong.dn{color:var(--dn)}.tw2-k strong.ref{color:var(--ref)}
.tw2-k small{font-size:12px;color:var(--muted);font-weight:600}
.tw2-k small i{font-style:normal;opacity:.5;margin:0 1px}
.tw2-k small.up,.tw2-k small.dn,.tw2-k small.ref{font-weight:700}

/* Lưới */
.tw2-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;align-items:start}
.tw2-main,.tw2-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.tw2-ch{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.tw2-ch h2{margin:0;font-size:15px;display:flex;align-items:center;gap:7px}
.tw2-dot{width:9px;height:9px;border-radius:50%;background:var(--house);display:inline-block}
.tw2-lnk{font-size:12.5px;font-weight:700;color:var(--brand-ink)!important;background:none;border:0;cursor:pointer;text-decoration:none;padding:4px 0;font-family:inherit}
.tw2-lnk:hover{text-decoration:underline}

/* Tab + ô lọc */
.tw2-tr{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.tw2-tabs{display:flex;gap:6px;flex-wrap:wrap;min-width:0}
.tw2-tabs button,.tw2-chips button{appearance:none;font:inherit;cursor:pointer;min-height:36px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:700;
  background:var(--surface2)!important;color:var(--text2)!important;border:1px solid var(--line2)!important;white-space:nowrap}
.tw2-tabs button:hover,.tw2-chips button:hover{border-color:var(--brand)!important}
.tw2-tabs button.on,.tw2-chips button.on{background:var(--brand-soft)!important;color:var(--brand-ink)!important;border-color:var(--brand-line)!important}
.tw2-tabs button.on{background:var(--brand)!important;color:var(--on-brand)!important;border-color:var(--brand)!important}
.tw2-chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center;min-width:0}
.tw2-chips button i{font-style:normal;font-size:11.5px;opacity:.75;margin-left:3px}
.tw2-chips button.tw2-add{border-style:dashed!important}
.tw2-chips button.tw2-fl{background:var(--chip)!important}
.tw2-chips.sm button{min-height:30px;padding:0 11px;font-size:12px}
.tw2-q{height:38px;min-width:0;width:230px;max-width:100%;border-radius:11px;padding:0 12px;box-sizing:border-box;font:inherit}
.tw2-ctl{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.tw2-ctl[hidden]{display:none}
.tw2-sort{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);margin:0}
.tw2-sort select,.tw2-cond select{height:36px;border-radius:10px;padding:0 10px;font:inherit;font-size:13px}
.tw2-cond{flex-basis:100%;margin:0;font-size:12px;line-height:1.7;color:var(--muted)}
.tw2-cond select{height:28px;font-size:12px;padding:0 6px}
.tw2-meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);margin:0 0 6px;min-height:16px}

/* Bảng */
.tw2-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tw2-tbl{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.tw2-tbl th{font-size:12px;font-weight:700;color:var(--muted);text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap;background:transparent}
.tw2-tbl th.s{cursor:pointer;user-select:none}.tw2-tbl th.s:hover{color:var(--brand-ink)}
.tw2-tbl td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:14px;color:var(--text);background:transparent}
html[data-den="compact"] .tw2-tbl td{padding:6px 10px}
html[data-den="compact"] .tw2-card{padding:12px}
html[data-den="compact"] .tw2-k{padding:10px 12px}
.tw2-tbl .r{text-align:right}
.tw2-tbl tr.go{cursor:pointer}.tw2-tbl tr.go:hover td{background:var(--sel)}
.tw2-tbl tr.tw-open td{background:var(--sel)}
.tw2-tbl tr.tw-dr td{padding:0;background:var(--surface2);text-align:left}
.tw2-px{font-weight:700}
.tw2-sym{display:flex;align-items:center;gap:9px;min-width:150px}
.tw2-sym>div{min-width:0;display:flex;flex-direction:column;gap:1px}
.tw2-sym b{font-size:15px;color:var(--text)}
.tw2-sym small{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.tw2-star{color:var(--ref);font-size:15px;line-height:1}
.tw2-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.tw2-tag{font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:999px;background:var(--brand-soft);color:var(--brand-ink)}
.tw2-sp{width:100px;height:30px;display:block;overflow:visible}
.tw2-sp .l{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.tw2-sp.k-up .l{stroke:var(--up)}.tw2-sp.k-dn .l{stroke:var(--dn)}
.tw2-sp .a{stroke:none}
.tw2-sp.k-up .a{fill:color-mix(in srgb,var(--up) 16%,transparent)}.tw2-sp.k-dn .a{fill:color-mix(in srgb,var(--dn) 16%,transparent)}
.tw2-ac{white-space:nowrap}
.tw2-ib{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;margin-left:2px;position:relative;
  color:var(--muted)!important;background:transparent!important;border:0!important;cursor:pointer;text-decoration:none;padding:0}
.tw2-ib:hover,.tw2-ib.on{color:var(--brand-ink)!important;background:var(--brand-soft)!important}
.tw2-ib.hot::after{content:"";position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;background:var(--dn);border:1.5px solid var(--surface)}
.tw2-empty{padding:22px 6px;text-align:left!important;color:var(--muted);font-size:13.5px;margin:0}
.tw2-empty a{color:var(--brand-ink);font-weight:700}
.tw2-note{font-size:11.5px;line-height:1.55;color:var(--muted);margin:10px 0 0}
.tw2-pick{cursor:pointer}.tw2-pick:hover td{background:var(--sel)}
.tw2-pick:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
.tw2-bar{display:flex;align-items:center;gap:8px;min-width:90px}
.tw2-bar i{display:block;height:8px;border-radius:99px;flex:0 1 auto;min-width:4px;background:var(--ref)}
.tw2-bar i.up{background:var(--up)}.tw2-bar i.dn{background:var(--dn)}
.tw2-bar span{font-weight:700;font-size:13px;white-space:nowrap}
.tw2-rule{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:3px 0}
.tw2-rule em{font-style:normal;font-size:11.5px;color:var(--muted)}.tw2-rule em.w{color:var(--ref)}

/* Top biến động */
.tw2-topg{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.tw2-tc{display:flex;flex-direction:column;gap:2px;padding:11px 12px;border-radius:12px;text-decoration:none;color:var(--text)!important;
  background:var(--surface2);border:1px solid var(--line);min-width:0}
.tw2-tc:hover{border-color:var(--brand)}
.tw2-tc b{font-size:15px}.tw2-tc span{font-size:12.5px;font-weight:700}.tw2-tc em{font-style:normal;font-size:12px;color:var(--muted)}
.tw2-tc .tw2-sp{width:100%;height:34px;margin-top:4px}

/* Cột phải */
.tw2-ix{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.tw2-ix strong{font-size:26px;letter-spacing:-.4px;color:var(--text)}.tw2-ix span{font-weight:700;font-size:13px}
.tw2-big .tw2-sp{width:100%;height:92px}
.tw2-dl{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:12px 0 0}
.tw2-dl div{display:flex;justify-content:space-between;gap:8px;font-size:12.5px;border-bottom:1px dashed var(--line);padding-bottom:5px}
.tw2-dl dt{color:var(--muted)}.tw2-dl dd{margin:0;font-weight:700;color:var(--text)}
.tw2-sr{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13px}
.tw2-sr:last-child,.tw2-ar:last-child{border-bottom:0}
.tw2-sr span{display:flex;flex-direction:column;min-width:0;color:var(--text)}.tw2-sr small{color:var(--muted);font-size:11px}
.tw2-sr .tw2-bar{min-width:0}.tw2-sr b{font-size:12.5px;min-width:54px;text-align:right}
.tw2-ar{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--text)!important;font-size:13px}
.tw2-ar:hover b{color:var(--brand-ink)}
.tw2-ar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text2)}
.tw2-ar em{font-style:normal;font-size:11.5px;color:var(--muted);font-weight:700}.tw2-ar em.hot{color:var(--dn)}

/* Chi tiết mở rộng: dùng lại .tw-* cũ nhưng theo token */
.tw2 .tw-detail{padding:14px 12px 16px;gap:12px}
.tw2 .tw-st{background:var(--surface);border-color:var(--line)}
.tw2 .tw-st span{color:var(--muted)}.tw2 .tw-st b{color:var(--text)}
.tw2 .tw-news a{color:var(--text)}.tw2 .tw-news{border-color:var(--line)}

/* Màn hình nhỏ */
@media(max-width:1100px){.tw2-grid{grid-template-columns:minmax(0,1fr)}.tw2-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.tw2-side>section:first-child{grid-column:1/-1}.tw2-topg{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){
  .tw2{gap:12px}.tw2-hd720,.tw2 .hd720{display:none}
  .tw2-head{align-items:stretch}.tw2-hact{width:100%}.tw2-add-f{flex:1}.tw2-add-f input{flex:1;width:auto}
  .tw2-kpi{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .tw2-k{padding:10px 8px;text-align:left}.tw2-kl{font-size:11px}.tw2-k strong{font-size:22px}.tw2-k small{font-size:10.5px}
  .tw2-card{padding:12px}
  .tw2-tabs{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:2px;scrollbar-width:none}.tw2-tabs::-webkit-scrollbar{display:none}
  .tw2-tabs button{flex:0 0 auto}
  .tw2-q{width:100%}
  .tw2-sym{min-width:0}.tw2-sym small{max-width:110px}.tw2-star{font-size:13px}
  .tw2-tbl td{padding:11px 6px;font-size:13.5px}.tw2-tbl th{padding:8px 6px}
  .tw2 .tw-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tw2 .tw-cols{grid-template-columns:1fr}
  .tw2-topg{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tw2-side{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:520px){.tw2 .hd520{display:none}.tw2-kpi small{display:none}.tw2-kpi .tw2-k:first-child small{display:block}}
@media(max-width:380px){.tw2-k strong{font-size:19px}.tw2-house{padding:0 10px;font-size:12px}}
html[data-rm="1"] .tw2 *{transition:none!important;animation:none!important}
