/* Say Piano – đợt "Đàn MIDI bắt buộc + Xếp hạng cùng bạn bè" (spec 2026-10-18): tab Xếp hạng + Bảng Khởi động (xep-hang.js),
 * hộp thoại Thêm bạn / Bạn bè / Chờ đàn, điểm tác phẩm + "Bảng Khởi động" + "Chờ đàn" ở trang tác phẩm, thẻ nhỏ Hôm nay,
 * màn "Chọn đàn để học vui hơn", nút "Đàn sau" + thẻ nối đàn trong màn đàn, dòng hạng ở màn kết bài Khởi động.
 * Mọi màn vừa MỘT màn hình ngang (844×390, 915×412, 740×360). Không giãn khoảng cách chữ. Nạp SAU khung-ngang.css / hom-nay.css. */

/* ---------- màn đàn: "Đàn sau" dưới nút ▶, thẻ nối đàn ---------- */
.gm-dt__cot[hidden], .gm-dt__sau[hidden] { display: none; }
.gm-dt__sau { min-height: 40px; padding: 0 16px; border: 1.5px solid rgba(255, 255, 255, .28); border-radius: 999px; background: rgba(255, 255, 255, .08);
  color: var(--ink, #F4F7FF); font: inherit; font-size: 14px; font-weight: 700; white-space: nowrap; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.gm-dt__sau:active { transform: scale(.96); }
.gm-dt__sau:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(255, 229, 138, .7); }
.gm-dt.is-dan .gm-dt__sau { visibility: hidden; }
.gm-dt__noi strong { color: #2A1A6E; }
html.po-giam .gm-dt__sau:active { transform: none; }

/* ---------- kết bài Khởi động: hạng trong nhóm bạn / nhắc nối đàn ---------- */
.gm-end__xh { margin: 10px 0 0; display: flex; flex-wrap: wrap; align-items: center; column-gap: 8px; row-gap: 2px;
  font-size: 14px; font-weight: 700; line-height: 1.3; color: #CFE3FF; }
.gm-end__xh[hidden] { display: none; }
.gm-end__xh .ico { flex: none; color: #FFE58A; }
.gm-end__vuot { color: #FFE58A; }
@media (max-height: 370px) { .gm-end__xh { margin-top: 6px; font-size: 13px; } }

/* ---------- Hôm nay: thẻ nhỏ Chờ đàn / chọn đàn ---------- */
.hn-mini__art.is-cho { background: linear-gradient(180deg, #5FD18B, #1F8F55); }

/* ---------- dẫn dắt: 2 lựa chọn đàn + "Chọn đàn để học vui hơn" ---------- */
.scr--dan .opts.opts--dan { grid-template-columns: 1fr; }
.scr--dan .opts--dan .opt { min-height: 68px; }
/* "Chọn đàn để học vui hơn" (#/onb/mua-dan, #/chon-dan – onboarding.js khoiChonDan): cột trái = tiêu đề + nhân vật TO (~60 % chiều
 * cao màn) giữa cột, bóng thoại ngắn bên cạnh; cột phải = thẻ lợi ích (hàng trên) + hai thẻ cân nhau (mỗi thẻ đầy, không khoảng trống đáy). */
.scr--mua-dan .scr__main { grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); grid-template-rows: minmax(0, 1fr); align-items: stretch; column-gap: 18px; }
.scr--mua-dan .scr__head.scr__head--guide { min-height: 0; margin: 0; display: flex; flex-direction: column; gap: 0; }
.scr--mua-dan .scr__head--guide .scr__title { flex: none; margin: 0; }
.scr--mua-dan .say { flex: 1; min-height: 0; min-width: 0; max-width: 100%; position: relative; display: flex; flex-direction: row; align-items: center; gap: 0; }
.scr--ngang.scr--mua-dan.scr--rail .scr__main { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); column-gap: 14px; }
.scr--mua-dan .mascot { flex: none; margin-left: -12px; }
.scr--mua-dan .mascot .nv3d img { display: block; width: auto; height: clamp(140px, 58vh, 236px); }
.scr--mua-dan .say__bubble { position: relative; z-index: 1; flex: 1; min-width: 150px; align-self: center; margin: 0 0 0 -34px; padding: 10px 13px; font-size: 14px; line-height: 1.4;
  border-radius: 18px 18px 18px 6px; }
.scr--mua-dan .say__bubble::before { left: -6px; top: calc(50% - 6px); bottom: auto; }
.scr--mua-dan .scr__body { align-self: stretch; min-height: 0; padding-bottom: 0; }
.cd-mua { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 10px; }
.cd-mua__the { min-width: 0; padding: 10px 12px; border-radius: 18px; color: var(--ink); display: flex; flex-direction: column;
  background: linear-gradient(180deg, rgba(52, 22, 140, .92), rgba(36, 12, 104, .94)); border: 1px solid rgba(255, 255, 255, .10); }
.cd-mua__the--loi { grid-column: 1 / -1; }
.cd-mua__t { margin: 0 0 8px; font-size: 14.5px; font-weight: 700; line-height: 1.2; color: #FFE58A; }
.cd-mua__ds { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.cd-mua__the--loi .cd-mua__ds { flex-direction: row; gap: 10px; }
.cd-mua__the--loi .cd-mua__li { flex: 1; min-width: 0; }
.cd-mua__li { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--ink); }
.cd-mua__ic { flex: none; width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; color: var(--tone-on, #fff); background: var(--tone); }
/* hình điện thoại – cáp – đàn: lấp đáy thẻ "Cần thêm" */
.cd-mua__hinh { flex: 1; width: 100%; min-height: 34px; max-height: 58px; margin-top: 8px; }
.cd-mua__dt { fill: #2F9BFF; } .cd-mua__dt-man { fill: #0D1B3A; }
.cd-mua__cap { fill: none; stroke: #FFE58A; stroke-width: 2.6; stroke-linecap: round; }
.cd-mua__dau { fill: #C9B26A; }
.cd-mua__dan { fill: #5B5BE6; } .cd-mua__trang { fill: #F4F7FF; }
.cd-mua__phim { stroke: #C9BEF0; stroke-width: 1; } .cd-mua__den { fill: #0D1B3A; }
@media (max-height: 400px) {
  .cd-mua { gap: 8px; }
  .cd-mua__the { padding: 8px 10px; }
  .cd-mua__t { margin-bottom: 6px; }
  .cd-mua__ds { gap: 5px; }
  .cd-mua__ic { width: 26px; height: 26px; border-radius: 8px; }
  .cd-mua__li { font-size: 12.5px; }
  .scr--mua-dan .say__bubble { font-size: 13px; padding: 8px 11px; }
}
@media (max-width: 800px) {
  .scr--ngang.scr--mua-dan .scr__main { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); column-gap: 10px; }
  .scr--ngang.scr--mua-dan.scr--rail .scr__main { grid-template-columns: minmax(0, .74fr) minmax(0, 1.26fr); }
  .scr--mua-dan.scr--rail .mascot .nv3d img { height: clamp(120px, 48vh, 236px); }
  .scr--mua-dan.scr--rail .say__bubble { margin-left: -56px; }
  .scr--mua-dan .mascot .nv3d img { height: clamp(130px, 54vh, 236px); }
  .scr--mua-dan .say__bubble { min-width: 120px; margin-left: -40px; font-size: 12.5px; }
  .scr--mua-dan .scr__title { font-size: 19px; }
  .cd-mua { gap: 6px; }
  .cd-mua__the { padding: 7px 9px; }
  .cd-mua__t { font-size: 13.5px; margin-bottom: 5px; }
  .cd-mua__ds { gap: 4px; }
  .cd-mua__li { font-size: 12px; gap: 6px; line-height: 1.25; }
  .cd-mua__ic { width: 24px; height: 24px; }
  .cd-mua__ic .ico { width: 15px; height: 15px; }
  .cd-mua__hinh { min-height: 22px; margin-top: 4px; }
}

/* ---------- trang tác phẩm: Bảng Khởi động (thanh trên), Chờ đàn (góc đường), điểm tác phẩm (thẻ vé) ---------- */
.tp-top-o { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.tp-bkd, .tp-cho { flex: none; min-height: 40px; padding: 0 14px 0 10px; border-radius: 20px; display: inline-flex; align-items: center; gap: 6px;
  border: 1px solid rgba(255, 229, 138, .35); background: rgba(255, 229, 138, .12); color: #FFE58A;
  font: inherit; font-size: 13.5px; font-weight: 700; white-space: nowrap; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.tp-bkd:active, .tp-cho:active { transform: scale(.97); }
.tp-bkd:focus-visible, .tp-cho:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(255, 229, 138, .7); }
html.po-giam :is(.tp-bkd, .tp-cho):active { transform: none; }
.scr--ngang .scr__topr .tp-bkd { color: #FFE58A; background: rgba(255, 229, 138, .12); border: 1px solid rgba(255, 229, 138, .35); }
.tp-duong-o { position: relative; min-width: 0; min-height: 0; display: flex; }
.tp-duong-o > .tp-duong-k { flex: 1; }
/* lời mời nối đàn (không đếm số): viên thuốc xanh nổi ở góc đường, như nút chính thu nhỏ */
.tp-cho { position: absolute; left: 10px; top: 10px; z-index: 2; max-width: calc(100% - 20px); padding: 0 16px 0 12px; border: 0; background: var(--nut-xanh); color: #fff;
  font-size: 14px; box-shadow: 0 3px 0 var(--nut-xanh-bd); }
.tp-cho:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--nut-xanh-bd); }
.tp-cho:focus-visible { box-shadow: 0 3px 0 var(--nut-xanh-bd), 0 0 0 3px rgba(255, 229, 138, .8); }
.tp-diem { display: flex; flex-direction: column; gap: 5px; padding: 8px 10px; border-radius: 14px; background: rgba(255, 255, 255, .06); }
.tp-diem__dau { margin: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 6px; font-size: 12px; font-weight: 700; color: var(--ink-2); }
.tp-diem__dau b { font-size: 17px; color: #fff; font-variant-numeric: tabular-nums; }
.tp-diem__dau small { font-size: 12px; color: var(--ink-3); }
.tp-diem__vach { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 10px; row-gap: 4px; }
.tp-diem__v { min-width: 0; display: flex; flex-direction: column-reverse; gap: 2px; }
.tp-diem__v i { display: block; height: 6px; border-radius: 4px; background: rgba(255, 255, 255, .14); overflow: hidden; }
.tp-diem__v em { display: block; width: var(--p, 0%); height: 100%; border-radius: inherit; }
.tp-diem__v.is-khoi_dong em { background: #FF9A2E; }
.tp-diem__v.is-ly_thuyet em { background: #2F9BFF; }
.tp-diem__v.is-thuc_hanh em { background: #36C26B; }
.tp-diem__v.is-ca_bai em { background: #FFD23F; }
.tp-diem__v small { display: flex; justify-content: space-between; gap: 4px; font-size: 10.5px; font-weight: 700; line-height: 1.15; color: var(--ink-3); white-space: nowrap; }
.tp-diem__v small b { color: var(--ink-2); font-variant-numeric: tabular-nums; }
@media (max-height: 400px) {
  .tp-diem { padding: 6px 9px; gap: 4px; }
  .tp-diem__dau b { font-size: 15px; }
}
@media (max-height: 380px) {
  .scr--tp .tp-ve:has(.tp-diem) .tp-ve__by { display: none; }
  .tp-diem { padding: 5px 8px; gap: 3px; }
  .tp-diem__vach { row-gap: 2px; }
}
@media (max-width: 780px) {
  .scr--tp .tp-top { max-width: 18vw; }
  .tp-bkd { padding: 0 10px; font-size: 12.5px; }
}

/* ---------- tab Xếp hạng / Bảng Khởi động ---------- */
.scr--xh .scr__main { padding: 6px 14px 12px 16px; }
.scr--xh .scr__body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.xh-dau { flex: 1; min-width: 0; display: flex; align-items: center; gap: 14px; }
.xh-dau .scr__title { flex: none; margin: 0; font-size: 21px; line-height: 1.2; white-space: nowrap; }
.xh-dau .scr__title:focus { outline: none; }
.xh-man { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(230px, 280px); gap: 12px; }
.xh-man--kd { grid-template-columns: minmax(200px, 250px) minmax(0, 1fr); }

.xh-bang { min-width: 0; min-height: 0; padding: 10px 12px; display: flex; flex-direction: column; gap: 8px; overflow: hidden; }
.xh-bang__dau { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.xh-bang__phu { margin: 1px 0 0; font-size: 12px; color: var(--ink-2); }
.xh-bang__than { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.xh-bang__noi { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 6px; }
.xh-cots { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
.xh-cots.is-mot { grid-template-columns: minmax(0, 1fr); }
.xh-cot { list-style: none; margin: 0; padding: 0; min-width: 0; display: grid; grid-template-rows: repeat(5, minmax(0, 40px)); gap: 4px; align-content: start; }
.xh-cot--minh { flex: none; grid-template-rows: 40px; padding-top: 6px; border-top: 1px dashed rgba(255, 255, 255, .18); }
.xh-dong { min-width: 0; min-height: 0; display: flex; align-items: center; gap: 8px; padding: 0 10px 0 6px; border-radius: 12px; background: rgba(255, 255, 255, .05); }
.xh-dong.is-minh { background: linear-gradient(90deg, rgba(63, 191, 106, .38), rgba(63, 191, 106, .16)); box-shadow: inset 0 0 0 1.5px rgba(127, 227, 164, .7); }
.xh-dong__hang { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 800; color: var(--ink-2); }
.xh-dong.is-huy1 .xh-dong__hang { background: linear-gradient(180deg, #FFE58A, #F2B01E); color: #4A2C00; }
.xh-dong.is-huy2 .xh-dong__hang { background: linear-gradient(180deg, #EEF3FA, #AEB9C9); color: #263244; }
.xh-dong.is-huy3 .xh-dong__hang { background: linear-gradient(180deg, #F4C08E, #C97D3A); color: #3D1E00; }
.xh-dong__anh { flex: none; width: 30px; height: 30px; border-radius: 50%; overflow: hidden; background: rgba(255, 255, 255, .1); line-height: 0; }
.xh-dong__anh .avatar { width: 100%; height: 100%; }
.xh-dong__ten { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xh-dong__diem { flex: none; font-size: 14px; color: #FFE58A; font-variant-numeric: tabular-nums; }
.xh-trong { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; color: var(--ink-2); }
.xh-trong p { margin: 0; max-width: 300px; font-size: 13.5px; }
.xh-trong .ico { color: #FFE58A; opacity: .7; }

/* thẻ mời (chưa có bạn) / đang tắt / vé Bảng Khởi động */
.xh-moi, .xh-bang--tat, .xh-kd-ve { align-items: center; justify-content: center; text-align: center; gap: 6px; padding: 12px 18px; }
.xh-kd-ve { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.xh-moi__art { width: 64px; height: 64px; border-radius: 20px; display: grid; place-items: center; color: #4A2C00;
  background: linear-gradient(180deg, #FFE58A, #F2B01E); box-shadow: none; }
.xh-moi__art.is-kd { color: #fff; background: linear-gradient(180deg, #8063F5, #5534C9); box-shadow: none; }
.xh-moi__art.is-kd .ico { fill: currentColor; stroke: none; }
.xh-moi__t { margin: 4px 0 0; font-size: 18px; font-weight: 700; line-height: 1.25; color: #fff; }
.xh-moi__p { margin: 0; max-width: 380px; font-size: 13px; line-height: 1.4; color: var(--ink-2); }
.xh-kd-ve__minh { margin: 0; font-size: 14px; font-weight: 800; color: #7FE3A4; }
.xh-moi .po-nut, .xh-bang--tat .po-nut, .xh-kd-ve .po-nut { margin-top: 8px; }

/* cột phải: mã bạn bè, nút, lời mời */
.xh-ben { min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.xh-ma { flex: none; padding: 10px 12px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.xh-ma__k { margin: 0; font-size: 12.5px; font-weight: 700; color: var(--ink-2); }
.xh-ma__v { margin: 0; display: flex; gap: 4px; }
.xh-ma__v span { width: 30px; height: 36px; border-radius: 9px; display: grid; place-items: center; font-size: 21px; font-weight: 800; color: #0F004E;
  background: linear-gradient(180deg, #FFFDF6, #FFE9B0); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .12); }
/* hàng 2 nút theo hệ nút chung (.po-nut--gon, khung-ngang.css); chừa 4 px cho mép nổi */
.xh-ma__nuts, .xh-hang-nut { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; width: 100%; padding-bottom: 4px; }
.xh-hang-nut { flex: none; }
.xh-tron:focus-visible, .xh-link:focus-visible, .xh-nut-nho:focus-visible, .xh-cho__i:focus-visible, .xh-x:focus-visible {
  outline: none; box-shadow: 0 0 0 3px rgba(255, 229, 138, .7); }
.xh-loi { flex: none; padding: 8px 12px; display: flex; flex-direction: column; gap: 6px; }
.xh-loi__dau { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 22px; }
.xh-loi__ds { list-style: none; margin: 0; padding: 0; }
.xh-link { min-height: 40px; margin: -9px 0; padding: 0 4px; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 700; color: #9CC8FF; cursor: pointer; }
.xh-tron { flex: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .08); color: var(--ink); cursor: pointer; }
.xh-tron.is-chinh { border: 0; background: var(--nut-xanh); color: #fff; }
.xh-ghi { margin: 0; display: flex; gap: 6px; align-items: flex-start; font-size: 12px; line-height: 1.4; color: var(--ink-3); }
.xh-ghi .ico { flex: none; margin-top: 1px; }

@media (max-height: 400px) {
  .xh-bang { padding: 8px 10px; gap: 6px; }
  .xh-cot { grid-template-rows: repeat(5, minmax(0, 36px)); gap: 3px; }
  .xh-cot--minh { grid-template-rows: 36px; padding-top: 4px; }
  .xh-dong__anh { width: 26px; height: 26px; }
  .xh-dong__hang { width: 24px; height: 24px; font-size: 12px; }
  .xh-ma { padding: 8px 10px; gap: 5px; }
  .xh-ma__v span { width: 27px; height: 32px; font-size: 19px; }
  .xh-ben { gap: 8px; }
  .xh-moi__art { width: 52px; height: 52px; border-radius: 16px; }
  .xh-moi__t { font-size: 16.5px; }
}
@media (max-width: 780px) {
  .xh-man { grid-template-columns: minmax(0, 1fr) minmax(210px, 230px); gap: 10px; }
  .xh-man--kd { grid-template-columns: minmax(180px, 210px) minmax(0, 1fr); }
  .xh-dong { gap: 6px; padding: 0 8px 0 4px; }
  .xh-dong__ten { font-size: 12.5px; }
  .xh-dong__diem { font-size: 13px; }
  .xh-ben .po-nut--gon { padding: 0 8px; font-size: 14px; gap: 5px; }
  .xh-dau { gap: 10px; }
  .xh-dau .scr__title { font-size: 19px; }
}

/* ---------- hộp thoại: Thêm bạn, Bạn bè, Chờ đàn (nền kem như các hộp thoại khác) ---------- */
.xh-dlg { width: min(100% - 32px, 420px); padding: 18px 20px; }
.xh-dlg .dlg__title { margin: 0; font-size: 20px; }
.xh-dlg__phu { margin: 0; font-size: 14px; line-height: 1.45; color: var(--navy-70); text-align: center; }
.xh-dlg__loi { margin: -6px 0 0; min-height: 1.3em; font-size: 14px; font-weight: 700; color: var(--danger); text-align: center; }
.xh-them .dlg__form { gap: 12px; }
.xh-ma-o { height: 56px; text-align: center; font-size: 26px; font-weight: 800; text-transform: uppercase; }
.xh-bb-dlg { max-height: calc(100dvh - 24px); }
.xh-bb { display: flex; flex-direction: column; gap: 8px; max-height: calc(100dvh - 64px); }
.xh-bb__dau { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.xh-x { width: 40px; height: 40px; border: 0; border-radius: 50%; display: grid; place-items: center; background: rgba(15, 0, 78, .06); color: var(--navy); cursor: pointer; }
.xh-bb__cuon { min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; }
.xh-bb__nhom { margin: 6px 0 0; font-size: 14px; font-weight: 700; color: var(--navy-70); }
.xh-bb__ds { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.xh-bb__i { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.xh-bb__ten { flex: 1; min-width: 0; font-size: 15px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xh-loi .xh-bb__ten { font-size: 14px; color: var(--ink); }
.xh-bb__tag { flex: none; padding: 3px 10px; border-radius: 999px; background: rgba(54, 194, 107, .16); color: #17763C; font-size: 12.5px; font-weight: 700; }
.xh-nut-nho { flex: none; min-height: 40px; padding: 0 12px; border-radius: 20px; border: 1.5px solid var(--line, #E5DCCB); background: #fff; color: var(--navy);
  font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.xh-nut-nho.is-chinh { border-color: transparent; background: var(--nut-xanh); color: #fff; }
.xh-cho__i { width: 100%; min-height: 52px; padding: 6px 10px; border: 0; border-radius: 14px; display: flex; align-items: center; gap: 10px; text-align: left;
  background: #fff; color: var(--navy); font: inherit; cursor: pointer; box-shadow: 0 1px 0 #EFE7D8; }
.xh-cho__ic { flex: none; width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: linear-gradient(180deg, #5FD18B, #1F8F55); }
.xh-cho__chu { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.xh-cho__chu b { font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xh-cho__chu small { font-size: 12.5px; color: var(--navy-70); }
.xh-cho__so { flex: none; font-size: 13px; font-weight: 700; color: #17763C; }