/* ============================================================
   TRANG 'DUNG TU BAN VE' — /dung-tu-ban-ve/  v2 (11/09/2026 toi)
   Bo cuc kieu APP VE: khung ban ve chiem gan tron man, dieu khien
   trong NGAN KEO day (.bv-sheet), cong cu NOI tren khung. May tinh
   (>=1024px): cot trai 400px + khung phai. Nap SAU page-bep-3d.css
   (dung chung .tv-o, .pn, .b3-goc). Moi rule boc .bmh.
   ============================================================ */
/* ⚠️ page-bep-3d.css chi cho SECTION.b3-ui hien — khoi nay la DIV nen phai mo rieng */
.js .bmh div.bv-app.b3-ui{display:block}
.js .bmh section.bv-chon.b3-ui{display:block}

.bmh .bv-app{position:relative;background:var(--ink);color:#F3EEE7;height:calc(100svh - 70px);min-height:520px;overflow:hidden}
.bmh .bv-khung{position:absolute;inset:0;background:#2b2b2b}
.bmh .bv-2d{position:absolute;inset:0;overflow:hidden}
.bmh .bv-2d canvas{display:block;touch-action:none;cursor:crosshair}
.bmh .bv-3d{position:absolute;inset:0}
.bmh .bv-3d[hidden],.bmh .bv-2d[hidden]{display:none}
.bmh #sk{position:absolute;inset:0;background:linear-gradient(180deg,#e9e5de 0%,#d6d0c6 48%,#b9b1a5 100%)}   /* nền 3D: trời sáng ấm, mờ dần xuống sân */
.bmh #sk canvas{display:block;width:100%;height:100%}
.bmh .bv-3d-loi{position:absolute;left:16px;right:16px;top:40%;text-align:center;font:13px/1.6 var(--font-body);color:rgba(243,238,231,.85)}
.bmh .bv-goc{bottom:auto;top:14px;left:14px;transform:none;max-width:calc(100% - 80px)}

/* ---- công cụ nổi ---- */
.bmh .bv-zoom{position:absolute;right:12px;top:56px;z-index:7;display:flex;flex-direction:column;gap:6px}
.bmh .bv-zoom[hidden]{display:none}
.bmh .bv-zoom button{appearance:none;width:42px;height:42px;border:1px solid rgba(243,238,231,.35);
  background:rgba(38,38,38,.78);color:#F3EEE7;font:19px/1 var(--font-body);cursor:pointer;backdrop-filter:blur(4px)}
.bmh .bv-zoom button:hover{background:#F3EEE7;color:var(--ink)}
.bmh .bv-loai{position:absolute;left:12px;top:12px;z-index:7;display:flex;gap:6px;flex-wrap:wrap;max-width:calc(100% - 76px)}
.bmh .bv-loai[hidden]{display:none}
@media(max-width:480px){.bmh .bv-loai{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:calc(100% - 76px)}.bmh .bv-loai::-webkit-scrollbar{display:none}.bmh .bv-loai button{flex:0 0 auto}}   /* điện thoại: 1 hàng vuốt ngang, đỡ che bản vẽ */
.bmh .bv-loai button{appearance:none;background:rgba(38,38,38,.82);border:1px solid rgba(243,238,231,.3);color:#F3EEE7;
  padding:0 12px;height:40px;cursor:pointer;display:inline-flex;align-items:center;gap:8px;backdrop-filter:blur(4px);
  font:10px/1 var(--font-head);letter-spacing:.14em;text-transform:uppercase}
.bmh .bv-loai button i{width:11px;height:11px;display:inline-block}
.bmh .bv-loai button[aria-pressed="true"]{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh .bv-hanh{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:7;display:flex;gap:8px}
.bmh .bv-pill{appearance:none;background:rgba(38,38,38,.86);border:1px solid rgba(243,238,231,.4);color:#F3EEE7;
  padding:0 16px;height:44px;cursor:pointer;backdrop-filter:blur(4px);white-space:nowrap;
  font:11px/1 var(--font-head);letter-spacing:.16em;text-transform:uppercase}
.bmh .bv-pill--chinh{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh .bv-pill[hidden]{display:none}
.bmh .bv-lup{position:absolute;left:12px;top:12px;z-index:9;width:120px;height:120px;border-radius:50%;
  border:2px solid #F3EEE7;box-shadow:0 4px 18px rgba(0,0,0,.5);background:#fff;pointer-events:none}
.bmh .bv-lup[hidden]{display:none}
.bmh .bv-goi{position:absolute;left:50%;top:14px;transform:translateX(-50%);z-index:8;margin:0;max-width:calc(100% - 140px);
  background:rgba(38,38,38,.88);color:#F3EEE7;padding:9px 14px;font:12px/1.45 var(--font-body);text-align:center;pointer-events:none}
.bmh .bv-goi[hidden]{display:none}

/* ---- ngăn kéo điều khiển (mobile) ---- */
.bmh .bv-sheet{position:absolute;left:0;right:0;bottom:0;z-index:10;background:var(--ink);border-top:1px solid rgba(243,238,231,.22);
  display:flex;flex-direction:column;max-height:46svh;transition:max-height .35s var(--ease);box-shadow:0 -10px 30px rgba(0,0,0,.35)}
.bmh .bv-sheet.mo{max-height:88svh}
.bmh .bv-sheet.thu{max-height:112px}
.bmh .bv-keo{appearance:none;background:none;border:0;padding:8px 0 4px;cursor:pointer;flex:0 0 auto}
.bmh .bv-keo i{display:block;width:44px;height:4px;margin:0 auto;background:rgba(243,238,231,.4);border-radius:2px}
.bmh .bv-buoc{display:flex;gap:4px;padding:0 12px;flex:0 0 auto}
.bmh .bv-buoc button{appearance:none;flex:1 1 0;background:none;border:0;border-bottom:2px solid rgba(243,238,231,.18);color:rgba(243,238,231,.55);
  padding:8px 2px 9px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;
  font:9px/1 var(--font-head);letter-spacing:.12em;text-transform:uppercase}
.bmh .bv-buoc button b{font-weight:500;width:18px;height:18px;border-radius:50%;border:1px solid currentColor;
  display:inline-flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:0;flex:0 0 auto}
.bmh .bv-buoc button[aria-current="step"]{color:#F3EEE7;border-bottom-color:#F3EEE7}
.bmh .bv-buoc button[aria-current="step"] b{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh .bv-tt{display:flex;gap:14px;margin:0;padding:8px 16px 0;font:11px/1.4 var(--font-body);color:rgba(243,238,231,.55)}
.bmh .bv-tt i{font-style:normal}
.bmh .bv-bao{margin:4px 16px 0;font:12px/1.5 var(--font-body);color:#F3EEE7;min-height:0;flex:0 0 auto}   /* ⚠️ không cho co trong flex: dòng báo 2 dòng từng bị ép còn 1 dòng, chữ tràn đè tiêu đề bên dưới (đo 11/09) */
.bmh .bv-bao:empty{display:none}
/* ⚠️ dock Gọi/Zalo cố định (56px, components.css) đè đáy ngăn kéo trên điện thoại → chừa chỗ */
.bmh .bv-cuon{overflow-y:auto;overflow-x:hidden;padding:10px 16px 0;flex:1 1 auto;-webkit-overflow-scrolling:touch;scroll-padding-bottom:84px}   /* hàng nút dính đáy cao ~80px: cuộn tới ô nào thì ô đó phải nằm TRÊN hàng nút (đo 12/09: ô '12 bậc' chui dưới 'Tiếp tục', bấm trượt) */
/* ⚠️ điện thoại (≤768px) có thanh Gọi/Zalo cố định 56px (.dock, components.css): vùng làm việc phải NGẮN LẠI đúng 56px,
   không thì đáy ngăn kéo (nút Dựng 3D / Tiếp) chui xuống dưới thanh Gọi — chạm vào là bấm nhầm Gọi (đo 11/09: nút ở y=822, elementFromPoint = nút Gọi) */
@media(max-width:768px){.bmh .bv-app{height:calc(100svh - 70px - 56px - env(safe-area-inset-bottom))}}
.bmh .bv-b[hidden]{display:none}
.bmh .bv-h{font:400 13px/1.5 var(--font-head);letter-spacing:.16em;text-transform:uppercase;color:#F3EEE7;margin:0 0 6px}
.bmh .bv-h small{display:block;font:12px/1.5 var(--font-body);letter-spacing:0;text-transform:none;color:rgba(243,238,231,.6)}
.bmh .bv-hd{font:13px/1.55 var(--font-body);color:rgba(243,238,231,.72);margin:0 0 10px;max-width:64ch}
.bmh .bv-hd b{font-weight:500;color:#F3EEE7}
/* ---- 3 lối vào ở bước 1 (11/09 tối, theo ý sếp: khách không chấm điểm) ---- */
.bmh .bv-cach{border:1px solid rgba(243,238,231,.16);padding:12px 14px 14px;margin:0 0 10px}
.bmh .bv-cach-h{display:flex;align-items:center;gap:10px;margin:0 0 10px;font:400 12px/1.4 var(--font-head);letter-spacing:.14em;text-transform:uppercase;color:#F3EEE7}
.bmh .bv-cach-h b{flex:0 0 auto;width:22px;height:22px;border:1px solid rgba(243,238,231,.55);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:500;font-size:11px}
.bmh .bv-cach-h small{margin-left:auto;font:11px/1.3 var(--font-body);letter-spacing:0;text-transform:none;color:rgba(243,238,231,.5);white-space:nowrap}
.bmh .bv-mau-ds .bv-nut em{font-style:normal;letter-spacing:0;text-transform:none;opacity:.6;margin-left:4px}
.bmh .bv-tick-ds{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 8px}
.bmh .bv-tick{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;border:1px solid rgba(243,238,231,.28);font:11px/1 var(--font-head);letter-spacing:.14em;text-transform:uppercase;color:rgba(243,238,231,.85);cursor:pointer}
.bmh .bv-tick:has(input:checked){background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh .bv-tick input{accent-color:var(--ink);width:14px;height:14px;margin:0}
.bmh .bv-tn-o[hidden]{display:none}
.bmh .bv-hoi{margin-top:12px;padding-top:10px;border-top:1px solid rgba(243,238,231,.16)}
.bmh .bv-link{appearance:none;background:none;border:0;padding:0;color:#F3EEE7;text-decoration:underline;text-underline-offset:3px;font:inherit;cursor:pointer}
.bmh .bv-nut--vien.bv-nut--vien{display:inline-flex;align-items:center;text-decoration:none}
#bv-tn-bao{margin:0 0 8px}
/* ---- HỎI TỪNG CÂU (mặc định) — chữ 16px thường, nút to, cho khách 40–50 tuổi ---- */
.bmh .bv-app.nhanh .bv-buoc,.bmh .bv-app.nhanh #bv-tt-tile{display:none}   /* ẩn thanh 4 bước + "tỉ lệ": từ của thợ */
.bmh .bv-app.nhanh[data-buoc="1"] .bv-tt,.bmh .bv-app.nhanh[data-buoc="1"] #bv-zoom{display:none}   /* màn hỏi: không có gì để đếm/phóng */
.bmh .bv-app.nhanh .bv-tt{font-size:14px;color:#F3EEE7}
/* ngăn kéo ở màn hỏi mở 88svh bằng JS ngan('mo'); sang 3D về 46svh để thấy phòng */
.bmh .bv-cho{position:absolute;inset:0;z-index:6;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(38,38,38,.55);backdrop-filter:blur(2px)}
.bmh .bv-cho p{margin:0;max-width:26ch;text-align:center;font:16px/1.6 var(--font-body);color:rgba(243,238,231,.85)}
.bmh .bv-cho[hidden]{display:none}
.bmh .nh-man{padding:6px 0 4px}
.bmh .nh-hoi{margin:0 0 6px;font:500 20px/1.35 var(--font-body);letter-spacing:0;text-transform:none;color:#F3EEE7}
.bmh .nh-phu{margin:0 0 14px;font:15px/1.5 var(--font-body);color:rgba(243,238,231,.7)}
.bmh .nh-cach{margin-top:14px}
.bmh .nh-nho{font-size:13px;margin-top:-4px}
.bmh .nh-buoc{margin:0 0 12px;padding-left:22px;font:15px/1.55 var(--font-body);color:rgba(243,238,231,.85)}.bmh .nh-buoc li{margin:0 0 6px}.bmh .nh-buoc b{font-weight:500;color:#F3EEE7}
.bmh #nh-mo-lai b{font-weight:500}
.bmh .nh-ds{display:grid;grid-template-columns:1fr;gap:8px}
.bmh .nh-o{appearance:none;display:grid;grid-template-columns:14px 1fr;grid-template-rows:auto auto;column-gap:12px;align-items:center;text-align:left;min-height:56px;padding:10px 14px;background:none;border:1px solid rgba(243,238,231,.3);color:#F3EEE7;cursor:pointer;font:inherit}
.bmh .nh-o i{grid-row:1/3;grid-column:1;width:14px;height:14px;border-radius:2px}
.bmh .nh-o b{grid-column:2;grid-row:1}.bmh .nh-o small{grid-column:2;grid-row:2}
.bmh .nh-o b{font:500 16px/1.3 var(--font-body)}
.bmh .nh-o small{font:13px/1.4 var(--font-body);color:rgba(243,238,231,.6)}
.bmh .nh-o[aria-pressed="true"]{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh .nh-o[aria-pressed="true"] small{color:rgba(38,38,38,.65)}
.bmh .nh-o[aria-pressed="true"]::after{content:"✓";grid-column:3;grid-row:1/3;font-weight:500;font-size:18px}
.bmh .nh-o[aria-pressed="true"]{grid-template-columns:14px 1fr auto}
.bmh .nh-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.bmh .nh-chip{appearance:none;min-height:44px;padding:8px 14px;background:none;border:1px solid rgba(243,238,231,.3);color:#F3EEE7;font:15px/1.3 var(--font-body);cursor:pointer;text-align:left}
.bmh .nh-chip[aria-pressed="true"]{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh .nh-so{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 6px}
.bmh .nh-so label{display:flex;flex-direction:column;gap:4px;font:13px/1.4 var(--font-body);color:rgba(243,238,231,.7)}
.bmh .nh-so input{width:120px;min-height:44px;padding:0 12px;background:rgba(243,238,231,.06);border:1px solid rgba(243,238,231,.3);color:#F3EEE7;font:16px/1 var(--font-body)}
.bmh .nh-bao{margin:0 0 6px;min-height:0;font:14px/1.5 var(--font-body);color:#ffbe5a}
.bmh .nh-bao:empty{display:none}
.bmh .nh-chan{display:flex;gap:10px;align-items:center;margin-top:10px;position:sticky;bottom:0;padding:10px 0 14px;background:var(--ink);z-index:2;box-shadow:0 -14px 14px -6px var(--ink)}
.bmh .nh-tiep{appearance:none;flex:1 1 auto;min-height:52px;padding:0 20px;background:#F3EEE7;color:var(--ink);border:0;font:500 16px/1 var(--font-body);cursor:pointer}
.bmh .nh-tiep:hover{background:#fff}
.bmh .nh-lui{appearance:none;min-height:52px;padding:0 16px;background:none;border:1px solid rgba(243,238,231,.4);color:#F3EEE7;font:15px/1 var(--font-body);cursor:pointer}
.bmh .nh-khac{margin:14px 0 0;font:14px/1.5 var(--font-body);color:rgba(243,238,231,.75)}
.bmh .nh-khac .bv-link{font:inherit;color:#F3EEE7}
.bmh .bv-cach-khac[hidden]{display:none}
/* (14/09) điện thoại/tablet: ô tìm + 2 hàng lọc GIẤU sau nút "Tìm & lọc mẫu" — màn 3D bớt rối; máy tính (cột trái) giữ nguyên */
@media(max-width:1023px){.bmh .bv-chon .tv-tim{display:none}.bmh .bv-chon.loc-mo .tv-tim{display:block}
  .bmh .bv-loc-nut{appearance:none;align-self:flex-start;margin:6px 16px 4px;padding:9px 12px;background:none;border:1px solid rgba(243,238,231,.3);color:rgba(243,238,231,.85);font:11px/1 var(--font-head);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
  .bmh .bv-chon.loc-mo .bv-loc-nut{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}}
@media(min-width:1024px){.bmh .bv-loc-nut{display:none}}
/* bước 4: dải ảnh mẫu lên TRƯỚC ô tìm + bộ lọc (khách 40–50 chọn bằng mắt, không gõ) */
.js .bmh section.bv-chon.b3-ui{display:flex;flex-direction:column}.bmh .bv-chon .tv-dai-o{order:-1}   /* ⚠️ phải thắng luật mở section.b3-ui{display:block} (bẫy 54) */
.bmh .bv-app.nhanh #bv-3d-nut .bv-tiep[data-den="3"]{display:none}   /* "Sửa mảng" là việc chấm điểm — chế độ hỏi thì thay bằng "Sửa số đo" */
#bv-3d-nut{flex-wrap:nowrap;gap:8px}#bv-3d-nut #kl{flex:1 1 auto;min-width:0;white-space:normal;line-height:1.3;text-align:center;padding-left:10px;padding-right:10px}   /* cột hẹp (xoay ngang 323px): chữ nút chính xuống 2 dòng, nút phụ không văng khỏi cột */#bv-3d-nut .bv-nut--vien{flex:0 0 auto;padding:12px 12px}   /* hàng dính 1 dòng: nút chính co giãn, nút phụ giữ cỡ */
#bv-3d-phu{margin-top:10px}
.bmh .bv-nho{font-size:12px}
.bmh .bv-hang{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:6px}
.bmh .bv-cuoi{margin-top:14px;padding:12px 0 14px;border-top:1px solid rgba(243,238,231,.15);position:sticky;bottom:0;background:var(--ink);z-index:2;box-shadow:0 -14px 14px -6px var(--ink)}   /* bóng lên trên: hàng dính là LỚP TRÊN, nội dung cuộn dưới nó không nhìn như chồng chéo. ⚠️ ngăn kéo padding-bottom 0: trước đây hở 16px dưới hàng dính, chip lọc thò ra nhìn như chồng chéo (anh báo 14/09) */   /* hàng nút chính DÍNH đáy ngăn kéo: Dựng 3D / Bảng khối lượng luôn trong tầm ngón tay */
.bmh .bv-o{display:flex;flex-direction:column;gap:5px;font:10px/1.4 var(--font-head);letter-spacing:.14em;text-transform:uppercase;color:rgba(243,238,231,.7)}
.bmh .bv-o input{background:none;border:1px solid rgba(243,238,231,.35);color:#F3EEE7;padding:10px 12px;font:16px/1.2 var(--font-body);width:140px;min-height:44px}
.bmh .bv-o input:focus{outline:none;border-color:#F3EEE7}
.bmh .bv-ts{margin:0 0 8px}
.bmh .bv-ts[hidden]{display:none}

/* nút trong ngăn kéo */
.bmh .bv-nut{appearance:none;border:0;background:none;cursor:pointer;font:11px/1 var(--font-head);letter-spacing:.18em;text-transform:uppercase;
  min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none;color:#F3EEE7;padding:12px 16px}
.bmh .bv-nut--chinh{background:#F3EEE7;color:var(--ink);padding:13px 20px}
.bmh .bv-nut--chinh:hover{background:#fff}
.bmh .bv-nut--chinh:disabled{opacity:.35;cursor:not-allowed}
.bmh .bv-nut--vien{border:1px solid rgba(243,238,231,.55)}
.bmh .bv-nut--vien:hover{border-color:#F3EEE7}
.bmh .bv-nut--nhat{color:rgba(243,238,231,.6);padding-left:0;padding-right:0}
.bmh .bv-nut--nhat:hover{color:#F3EEE7}
.bmh .bv-nut[hidden]{display:none}

/* danh sách mảng */
.bmh .bv-ds{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.bmh .bv-chip{appearance:none;background:none;border:1px solid rgba(243,238,231,.28);color:rgba(243,238,231,.85);
  padding:8px 8px 8px 12px;min-height:40px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;font:12px/1.2 var(--font-body)}
.bmh .bv-chip i{width:10px;height:10px;display:inline-block}
.bmh .bv-chip em{font-style:normal;color:rgba(243,238,231,.55);font-size:11px}
.bmh .bv-chip span{margin-left:2px;padding:4px 8px;color:rgba(243,238,231,.6);font-size:16px;line-height:1}
.bmh .bv-chip span:hover{color:#F3EEE7}
.bmh .bv-chip[aria-pressed="true"]{border-color:#F3EEE7;background:rgba(243,238,231,.1)}
.bmh #bv-ds-trong[hidden]{display:none}

/* bước 4: chip mảng + dải đá trong ngăn kéo */
.bmh #bv-bm{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:8px;padding:4px 0 8px;margin:8px 0 0}
.bmh #pkl-bang td i{display:block;font-size:10px;letter-spacing:0}.bmh #pkl-bang td:last-child,.bmh #pkl-bang th:last-child{white-space:nowrap}
@media(max-width:480px){.bmh #pkl-bang td i{display:none}}   /* 390px: bảng 5 cột không đủ chỗ cho ghi chú khổ tấm -> ẩn, khổ đã ghi ở dòng mẫu + chú thích cuối bảng */   /* khổ tấm xuống dòng + cột Số tấm không xuống dòng -> bảng tự nới cột này, hết bị cắt ở 390px */
.bmh #bv-bm::-webkit-scrollbar{display:none}
.bmh #bv-bm button{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(243,238,231,.28);padding:9px 12px;min-height:40px;color:rgba(243,238,231,.8);letter-spacing:.12em}
.bmh #bv-bm button::after{display:none}
.bmh #bv-bm button[aria-pressed="true"]{background:#F3EEE7;color:var(--ink);border-color:#F3EEE7}
.bmh #bv-bm .b3-swatch{width:16px;height:16px;background-size:cover;background-position:center;border:1px solid rgba(243,238,231,.35)}
.bmh #bv-bm .b3-trong{background:repeating-linear-gradient(45deg,rgba(243,238,231,.25) 0 2px,transparent 2px 5px)}
.bmh .bv-chon{padding:0;margin:0 -16px}
.bmh .bv-chon .tv-tim{padding:0 16px}
.bmh .bv-chon .tv-dai{padding:0 16px 4px}
.bmh .bv-chon .tv-o,.bmh .bv-chon .tv-o img{width:84px}.bmh .bv-chon .tv-o img{height:84px}
.bmh .bv-chon .tv-dai-o{padding-top:6px}
/* mũi tên vuốt dải mẫu (điện thoại/tablet) */
.bmh .bv-mui{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:30px;height:48px;border:0;background:rgba(38,38,38,.72);color:#F3EEE7;font:24px/1 var(--font-body);cursor:pointer;padding:0}
.bmh .bv-mui--trai{left:0}.bmh .bv-mui--phai{right:0}
@media(max-width:599px){.bmh .bv-mui{display:none}}   /* điện thoại: vuốt ngón tay tự nhiên, mẫu thứ 5 lộ nửa là đủ gợi ý */

/* bảng chọn trang PDF */
.bmh .bv-trang-ds{display:flex;gap:10px;flex-wrap:wrap;max-height:60vh;overflow:auto}
.bmh .bv-trang-ds button{appearance:none;background:none;border:1px solid rgba(243,238,231,.3);padding:6px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;gap:6px;color:#F3EEE7;font:10px/1 var(--font-head);letter-spacing:.14em;text-transform:uppercase}
.bmh .bv-trang-ds button:hover{border-color:#F3EEE7;background:rgba(243,238,231,.08)}
.bmh .bv-trang-ds canvas{display:block;max-width:220px;max-height:220px;background:#fff}

/* ---- máy tính / tablet ngang: cột trái + khung phải ---- */
/* máy tính, VÀ điện thoại/tablet XOAY NGANG (≥640px ngang): ngăn kéo thành CỘT TRÁI, khung bên phải — màn ngang 393px cao mà ngăn kéo chồng dưới thì khung chỉ còn ~130px (đo 11/09) */
@media(min-width:1024px),(min-width:640px) and (max-width:1023px) and (orientation:landscape){
  /* ⚠️ phải cùng độ ưu tiên với luật mở .js .bmh div.bv-app.b3-ui{display:block} ở trên, không thì block đè grid */
  .js .bmh div.bv-app.b3-ui{display:grid;grid-template-columns:min(400px,38%) 1fr;height:calc(100vh - 70px);min-height:640px}
  .js .bmh div.bv-app.b3-ui{grid-template-rows:minmax(0,1fr)}   /* ⚠️ hàng lưới KHÔNG được nở theo ruột ngăn kéo: màn ngang 393px đo được cột cao 457px, trang cuộn */
  .bmh .bv-sheet{position:relative;max-height:none!important;min-height:0;overflow:hidden;border-top:0;border-right:1px solid rgba(243,238,231,.18);box-shadow:none;grid-column:1;order:1}
  .bmh .bv-khung{min-height:0}
  .bmh .bv-keo{display:none}
  .bmh .bv-khung{position:relative;grid-column:2;order:2}
  .bmh .bv-buoc button{font-size:10px;gap:8px}
  .bmh .bv-cuon{padding:14px 20px 20px}   /* máy tính không có dock */
  .bmh .bv-chon{margin:0 -20px}.bmh .bv-chon .tv-tim,.bmh .bv-chon .tv-dai{padding-left:20px;padding-right:20px}
  /* (13/09) máy tính: LƯỚI DỌC 3 cột kiểu Roomvo — tên dưới ảnh, cuộn trong cột; ô tìm + lọc lên TRÊN lưới (lưới dài 215 mẫu) */
  .bmh .bv-chon .tv-dai-o{order:0;padding-top:4px}
  .bmh .bv-mui{display:none}
  .bmh .bv-chon .tv-dai{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 6px;overflow:visible;padding:0 20px 12px}   /* minmax(0,…): img có width=150 làm cột min-content 150px -> lưới tràn, cột 3 bị cắt (đo 13/09) */
  .bmh .bv-chon .tv-o{width:100%;min-width:0}.bmh .bv-chon .tv-o img{width:100%;min-width:0}
  .bmh .bv-chon .tv-o img{height:auto;aspect-ratio:1/1;opacity:.85}
  .bmh .bv-chon .tv-o:hover img,.bmh .bv-chon .tv-o[aria-pressed="true"] img{opacity:1}
  .bmh .bv-chon .tv-o .ten{position:static;opacity:1;background:none;padding:4px 0 0;font:11px/1.3 var(--font-body);color:rgba(243,238,231,.7);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bmh .bv-chon .tv-o[aria-pressed="true"] .ten{color:#F3EEE7}
  .bmh .bv-chon .tv-o[aria-pressed="true"]::after{inset:0 0 auto 0;aspect-ratio:1/1}
  .bmh .bv-lup{width:160px;height:160px}
}
@media(max-width:1023px) and (orientation:landscape){
  .js .bmh div.bv-app.b3-ui{height:calc(100svh - 70px);min-height:0}   /* ⚠️ min-height 520px cũ > màn ngang 393px -> trang cuộn, ngăn kéo rớt khỏi màn (đo 11/09) */
  .bmh .bv-cuon{padding:8px 14px 12px}
  .bmh .bv-lup{width:140px;height:140px}
}
@media(prefers-reduced-motion:reduce){.bmh .bv-sheet{transition:none}}

/* ---- (14/09) TOÀN MÀN HÌNH ---- */
.bmh .bv-toan{position:absolute;right:12px;top:12px;z-index:7;display:inline-flex;align-items:center;gap:6px;padding:0 12px;height:36px;background:rgba(38,38,38,.82);border:1px solid rgba(243,238,231,.35);color:#F3EEE7;font:10px/1 var(--font-head);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.bmh .bv-toan svg{flex:0 0 auto}
@media(max-width:599px){.bmh .bv-toan span{display:none}.bmh .bv-toan{width:36px;padding:0;justify-content:center}}
.bmh .bv-app.nhanh[data-buoc="1"] .bv-toan{display:none}
/* trạng thái bung: app phủ kín màn, đè header + dock (dock z 60, menu 80) */
.bmh .bv-app.bv-bung{position:fixed!important;inset:0!important;z-index:70;height:100svh!important;min-height:0!important}
@media(min-width:1024px),(min-width:640px) and (max-width:1023px) and (orientation:landscape){.js .bmh div.bv-app.b3-ui.bv-bung{height:100vh!important}}
.bmh .bv-app.bv-bung .bv-toan{background:#F3EEE7;color:var(--ink)}
body.bv-dang-bung{overflow:hidden}
body.bv-dang-bung .dock,body.bv-dang-bung .tum-nut{display:none!important}
/* toàn màn hình thật (API): trình duyệt chỉ vẽ phần tử được bung */
.bmh .bv-app:fullscreen{width:100vw;height:100vh!important;background:var(--ink)}