/* TVN Share3D — giao diện viewer. Luôn tối (nền tối giúp nhìn rõ tủ), không theo chế độ sáng/tối của máy. */
:root {
  --tv-top: #1c2128;
  --tv-bot: #2c3138;
  --tv-chrome: rgba(20, 22, 26, .9);
  --tv-line: rgba(255, 255, 255, .11);
  --tv-fg: #f2f3f5;
  --tv-muted: #9aa3ad;
  --tv-led: #ffcf7a;
  --tv-led-ink: #2a1b00;
  --tv-hl: #ffb05c;
  --tv-warn: #ff9b7a;
  --tv-shadow: 0 8px 26px rgba(0, 0, 0, .42);
  --tv-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --tv-num: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
  color-scheme: dark;
}
html, body { height: 100%; margin: 0; background: var(--tv-top); overflow: hidden; overscroll-behavior: none; }
[hidden] { display: none !important; }
#tvn3d { position: fixed; inset: 0; font: 14px/1.4 var(--tv-font); color: var(--tv-fg);
  -webkit-tap-highlight-color: transparent; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
#tvn3d *, #tvn3d *::before, #tvn3d *::after { box-sizing: border-box; }
/* :where() = độ ưu tiên 0 → .tv-btn[aria-pressed] đổi được màu chữ */
:where(#tvn3d) button { font: inherit; color: inherit; cursor: pointer; }
:where(#tvn3d) button:focus-visible { outline: 2px solid var(--tv-hl); outline-offset: 2px; }
:where(#tvn3d) svg { display: block; flex: 0 0 auto; }

.tv-vp { position: absolute; inset: 0; touch-action: none;
  background: linear-gradient(180deg, var(--tv-top) 0%, var(--tv-bot) 62%, #1a1d22 100%); }
.tv-vp canvas { display: block; width: 100%; height: 100%; touch-action: none; }

.tv-ui { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; gap: 10px; pointer-events: none;
  padding: max(12px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px))
           max(12px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); }
.tv-ui > * { pointer-events: auto; }
.tv-top { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; pointer-events: none; }
.tv-top > * { pointer-events: auto; }
.tv-mid { flex: 1 1 auto; min-height: 0; position: relative; pointer-events: none; }

.tv-head { display: flex; align-items: center; gap: 8px; max-width: 100%; pointer-events: none; }
.tv-head > * { pointer-events: auto; }
.tv-back { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px;
  border: 1px solid var(--tv-line); background: var(--tv-chrome); box-shadow: var(--tv-shadow); color: inherit; }
.tv-back svg { width: 20px; height: 20px; }
.tv-back:focus-visible { outline: 2px solid var(--tv-hl); outline-offset: 2px; }
.tv-proj { max-width: min(70vw, 300px); padding: 5px 10px 6px; border-radius: 10px; background: var(--tv-chrome);
  border: 1px solid var(--tv-line); box-shadow: var(--tv-shadow); }
.tv-proj small { display: block; font-size: 10px; font-weight: 600; letter-spacing: .04em; color: var(--tv-muted); text-transform: uppercase; }
.tv-proj b { display: block; font-size: 13px; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }

.tv-crumb { display: flex; align-items: center; gap: 8px; max-width: 100%; height: 40px; padding: 0 14px 0 10px; border-radius: 12px;
  border: 1px solid var(--tv-line); background: var(--tv-chrome); box-shadow: var(--tv-shadow); font-weight: 600; }
.tv-crumb svg { width: 20px; height: 20px; }
.tv-crumb span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-crumb span i { font-style: normal; color: var(--tv-muted); font-weight: 500; }

.tv-toast { position: absolute; left: 50%; top: 0; transform: translate(-50%, -6px); width: max-content; max-width: min(100%, 420px);
  padding: 8px 13px; border-radius: 11px; background: rgba(242, 243, 245, .95); color: #15181c; font-size: 13px; line-height: 1.45;
  text-align: center; box-shadow: var(--tv-shadow); opacity: 0; transition: opacity .2s, transform .2s; }
.tv-toast.show { opacity: 1; transform: translate(-50%, 0); }

.tv-info { width: 100%; max-width: 380px; padding: 10px 12px 11px; border-radius: 14px; background: var(--tv-chrome);
  border: 1px solid var(--tv-line); box-shadow: var(--tv-shadow); }
.tv-info-head { display: flex; align-items: flex-start; gap: 10px; }
.tv-info-title { min-width: 0; flex: 1 1 auto; }
.tv-info-title b { display: block; font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
.tv-info-title span { display: block; margin-top: 1px; font-size: 12px; color: var(--tv-muted); overflow-wrap: anywhere; }
.tv-x { flex: 0 0 auto; width: 32px; height: 32px; margin: -4px -4px 0 0; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .08);
  display: flex; align-items: center; justify-content: center; padding: 0; }
.tv-x svg { width: 16px; height: 16px; }
.tv-dims { margin-top: 7px; font: 600 14px/1.3 var(--tv-num); font-variant-numeric: tabular-nums; }
.tv-dims small { margin-left: 6px; font: 400 11px var(--tv-font); color: var(--tv-muted); }
.tv-rows { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; margin: 6px 0 0; font-size: 12.5px; }
.tv-rows dt { color: var(--tv-muted); }
.tv-rows dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.tv-hint { margin: 7px 0 0; font-size: 12px; color: var(--tv-hl); }

.tv-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tv-btn { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; min-width: 44px; padding: 0 14px;
  border-radius: 12px; border: 1px solid var(--tv-line); background: var(--tv-chrome); box-shadow: var(--tv-shadow);
  font-size: 14px; font-weight: 600; line-height: 1; white-space: nowrap; transition: background .15s, color .15s; }
.tv-btn svg { width: 20px; height: 20px; }
.tv-btn[aria-pressed="true"] { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-btn.tv-led[aria-pressed="true"] { background: var(--tv-led); border-color: var(--tv-led); color: var(--tv-led-ink); }

/* trang khách: lưới thumbnail theo Tầng → Phòng */
.tv-list { position: absolute; inset: 0; z-index: 2; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px))
           max(24px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  background: var(--tv-top); }
.tv-list h1 { margin: 6px 0 4px; font-size: 20px; line-height: 1.25; overflow-wrap: anywhere; }
.tv-list h2 { margin: 20px 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--tv-muted); }
.tv-list h2:empty { display: none; }
.tv-list h3 { margin: 12px 0 8px; font-size: 14px; font-weight: 600; }
.tv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin-top: 8px; }
.tv-card { display: block; min-width: 0; border-radius: 12px; overflow: hidden; background: var(--tv-chrome); border: 1px solid var(--tv-line);
  color: inherit; text-decoration: none; }
.tv-card:focus-visible { outline: 2px solid var(--tv-hl); outline-offset: 2px; }
.tv-th { aspect-ratio: 16 / 10; display: flex; align-items: center; justify-content: center; background: #252a31; color: var(--tv-muted); }
.tv-th img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tv-th svg { width: 30px; height: 30px; }
.tv-card span { display: block; padding: 8px 10px 9px; font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-empty { margin: 24px 0; color: var(--tv-muted); }

.tv-cover { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; justify-content: center; padding: 24px 16px;
  background: var(--tv-top); text-align: center; }
.tv-cover .tv-box { max-width: 360px; line-height: 1.55; }
.tv-cover b { display: block; font-size: 17px; margin-bottom: 6px; }
.tv-cover p { margin: 0; color: var(--tv-muted); font-size: 14px; }
.tv-cover .tv-btn { margin: 16px auto 0; }
.tv-spin { width: 34px; height: 34px; margin: 0 auto 14px; border-radius: 50%; border: 3px solid rgba(255, 255, 255, .14);
  border-top-color: var(--tv-hl); animation: tv-sp .9s linear infinite; }
@keyframes tv-sp { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .tv-toast, .tv-btn { transition: none; } .tv-spin { animation: none; } }

/* nút Tag (1.0.1): cây thư mục tag + tag, mỗi dòng 1 con mắt; tắt = chữ mờ + mắt gạch; nằm trong thư mục đang tắt = mờ hơn */
.tv-tags { width: 100%; max-width: 380px; padding: 10px 8px 8px 12px; border-radius: 14px; background: var(--tv-chrome);
  border: 1px solid var(--tv-line); box-shadow: var(--tv-shadow); display: flex; flex-direction: column; max-height: 46vh; }
.tv-tags[hidden] { display: none; }
.tv-tree { list-style: none; margin: 6px 0 0; padding: 0 4px 0 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.tv-row { display: flex; align-items: center; gap: 9px; width: 100%; min-height: 40px; padding: 0 6px; border: 0; border-radius: 9px;
  background: transparent; text-align: left; font-size: 13.5px; font-weight: 600; }
.tv-row:active { background: rgba(255, 255, 255, .08); }
.tv-row span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-row svg { width: 18px; height: 18px; color: var(--tv-muted); }
.tv-row svg:last-child { color: var(--tv-fg); }
.tv-row.tag { font-weight: 500; }
.tv-row.tag i { width: 10px; height: 10px; margin: 0 4px; border-radius: 3px; background: var(--tv-muted); flex: 0 0 auto; }
.tv-row.off span, .tv-row.off svg:last-child { color: var(--tv-muted); }
.tv-row.dim { opacity: .5; }
.tv-row.d1 { padding-left: 24px; } .tv-row.d2 { padding-left: 42px; } .tv-row.d3 { padding-left: 60px; }
.tv-row.d4 { padding-left: 78px; } .tv-row.d5, .tv-row.d6 { padding-left: 96px; }
.tv-btn.tv-tag[aria-expanded="true"] { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }

/* nút toàn màn hình (góc trên phải); đang toàn màn hình → nút x nhỏ, ẩn tên mô hình cho vùng xem rộng nhất */
.tv-fs { position: absolute; z-index: 2; top: max(12px, env(safe-area-inset-top, 0px)); right: max(16px, env(safe-area-inset-right, 0px));
  width: 40px; height: 40px; padding: 0; border-radius: 12px; border: 1px solid var(--tv-line); background: var(--tv-chrome);
  box-shadow: var(--tv-shadow); display: flex; align-items: center; justify-content: center; }
.tv-fs svg { width: 19px; height: 19px; }
#tvn3d.tv-full .tv-fs { width: 32px; height: 32px; border-radius: 50%; background: rgba(20, 22, 26, .72); }
#tvn3d.tv-full .tv-fs svg { width: 15px; height: 15px; }
#tvn3d.tv-full .tv-head { display: none; }
#tvn3d:fullscreen, #tvn3d:-webkit-full-screen { width: 100%; height: 100%; background: var(--tv-top); }
.tv-head { padding-right: 52px; }

/* nút Đo (27/10/2026): bật = nút trắng + dấu x để tắt; dim vẽ trên lớp SVG đè lên khung nhìn (không bắt chạm).
   tầng 1 phủ bì = xanh, tầng 2 lọt lòng khoang = vàng (nhỏ hơn); nhãn nền tối, số cùng màu nét; 2 đầu dim chấm tròn.
   Viền tối dưới nét / chấm → đọc được trên cả nền tối lẫn tấm trắng */
.tv-btn.tv-dim .tv-dimx { display: flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin: 0 -6px 0 -2px;
  border-radius: 50%; background: rgba(21, 24, 28, .12); }
.tv-btn.tv-dim .tv-dimx svg { width: 12px; height: 12px; }
.tv-dimsvg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.tv-dimsvg path { fill: none; stroke-linecap: butt; opacity: .75; }   /* nét dim mờ 0.75 (user 27/10/2026); chấm + nhãn giữ rõ */   /* nét dừng đúng tâm chấm tròn, không lòi ra */
.tv-dh { stroke: rgba(8, 10, 14, .55); stroke-width: 3.4; }
.tv-dl1 { stroke: #7dd3fc; stroke-width: 1.5; }
.tv-dl2 { stroke: #fcd34d; stroke-width: 1.2; }
.tv-dc1 { fill: #7dd3fc; stroke: rgba(8, 10, 14, .6); stroke-width: 1.2; }
.tv-dc2 { fill: #fcd34d; stroke: rgba(8, 10, 14, .6); stroke-width: 1.2; }
.tv-dp1, .tv-dp2 { fill: rgba(18, 21, 26, .88); }
.tv-dimsvg text { text-anchor: middle; dominant-baseline: central; font-family: var(--tv-num); font-variant-numeric: tabular-nums; }
.tv-dt1 { fill: #7dd3fc; font-size: 12px; font-weight: 700; }
.tv-dt2 { fill: #fcd34d; font-size: 10.5px; font-weight: 600; }
/* điện thoại (dims.js SMALL_PX / SMALL_K = 0,78, user 28/10/2026): chữ, nét nhỏ lại */
.tv-dsm .tv-dt1 { font-size: 9.36px; }
.tv-dsm .tv-dt2 { font-size: 8.19px; }
.tv-dsm .tv-dh { stroke-width: 2.6; }
.tv-dsm .tv-dl1 { stroke-width: 1.2; }
.tv-dsm .tv-dl2 { stroke-width: 1; }
.tv-dsm .tv-dc1, .tv-dsm .tv-dc2 { stroke-width: .9; }

/* nút Tấm (bản thử 28/10/2026): Tìm tấm / Kiểm tấm bằng mã QR — khung camera, ô gõ số, bộ đếm, số tấm còn thiếu, 6 lượt quét gần nhất */
.tv-btn.tv-pan[aria-expanded="true"] { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-sheet { width: 100%; max-width: 380px; padding: 10px 10px 10px 12px; border-radius: 14px; background: var(--tv-chrome);
  border: 1px solid var(--tv-line); box-shadow: var(--tv-shadow); display: flex; flex-direction: column; gap: 8px;
  max-height: 60vh; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; }
.tv-sheet .tv-info-head { align-items: center; justify-content: space-between; }
.tv-sheet .tv-x { margin: 0; }
.tv-seg { display: flex; gap: 2px; padding: 2px; border-radius: 10px; background: rgba(255, 255, 255, .07); }
.tv-seg button { height: 32px; padding: 0 16px; border: 0; border-radius: 8px; background: transparent; font-size: 13.5px; font-weight: 600; color: var(--tv-muted); }
.tv-seg button[aria-selected="true"] { background: #f4f5f7; color: #15181c; }
.tv-cam { position: relative; flex: 0 0 auto; width: 100%; aspect-ratio: 4 / 3; max-height: 30vh; border-radius: 10px; overflow: hidden; background: #000; }
.tv-cam:empty { display: none; }
.tv-cam video, .tv-cam-shot { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.tv-cam-shot { display: none !important; }
.tv-cam.tv-hit .tv-cam-shot { display: block !important; }
.tv-cam-aim { position: absolute; inset: 14% 24%; border: 2px solid var(--tv-hl); border-radius: 8px; box-shadow: 0 0 0 9999px rgba(0, 0, 0, .3); pointer-events: none; }
.tv-cam.tv-hit .tv-cam-aim { display: none; }
.tv-cam-msg { position: absolute; inset: 0; margin: 0; display: flex; align-items: center; justify-content: center; padding: 12px;
  text-align: center; color: var(--tv-warn); font-size: 13px; }
.tv-in { display: flex; gap: 6px; }
.tv-in input { flex: 1 1 auto; min-width: 0; height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--tv-line);
  background: rgba(255, 255, 255, .06); color: var(--tv-fg); font: 600 16px var(--tv-num); user-select: text; -webkit-user-select: text; }
.tv-in input:focus { outline: 2px solid var(--tv-hl); outline-offset: -1px; }
.tv-in input::placeholder { color: var(--tv-muted); font: 500 14px var(--tv-font); }
.tv-ib { flex: 0 0 auto; width: 40px; height: 40px; padding: 0; border-radius: 10px; border: 1px solid var(--tv-line); background: rgba(255, 255, 255, .06);
  display: flex; align-items: center; justify-content: center; }
.tv-ib svg { width: 20px; height: 20px; }
.tv-ib[aria-pressed="true"] { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-cnt { display: flex; align-items: center; gap: 6px; }
.tv-cnt b { font: 700 26px/1 var(--tv-num); font-variant-numeric: tabular-nums; }
.tv-cnt span { flex: 1 1 auto; font: 600 15px var(--tv-num); color: var(--tv-muted); }
.tv-cnt .tv-ib { width: 34px; height: 34px; }
.tv-cnt .tv-ib svg { width: 17px; height: 17px; }
.tv-k-sum.done .tv-cnt b { color: #5fd68e; }
.tv-prog { height: 4px; margin-top: 6px; border-radius: 2px; background: rgba(255, 255, 255, .1); overflow: hidden; }
.tv-prog i { display: block; width: 0; height: 100%; background: #5fd68e; transition: width .2s; }
.tv-log { display: flex; flex-direction: column; gap: 3px; }
.tv-log:empty { display: none; }
.tv-logl { display: flex; align-items: center; gap: 9px; min-height: 34px; padding: 0 8px; border: 0; border-radius: 8px;
  background: rgba(255, 255, 255, .05); text-align: left; font-size: 13px; }
.tv-logl b { min-width: 30px; font: 700 13px var(--tv-num); }
.tv-logl span { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-logl svg { width: 16px; height: 16px; }
.tv-logl.ok svg { color: #5fd68e; }
.tv-logl.dup svg { color: var(--tv-led); }
.tv-logl.net svg { color: #7dd3fc; }
.tv-logl.bad { color: var(--tv-warn); }
@media (prefers-reduced-motion: reduce) { .tv-prog i { transition: none; } }
@media (max-width: 640px) { .tv-cam { aspect-ratio: 16 / 9; max-height: 24vh; } .tv-sheet { max-height: 52vh; } }

/* Kiểm tấm toàn màn hình (28/10/2026): x = thoát Kiểm · chấm xanh = đang đồng bộ máy chủ (cam = mất mạng) · link kiểm chỉ chủ thấy */
.tv-kiem { position: absolute; inset: 0; z-index: 2; background: var(--tv-top); overflow-y: auto; -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain; }
.tv-k-in { width: 100%; max-width: 560px; margin: 0 auto; display: flex; flex-direction: column; gap: 10px;
  padding: max(12px, env(safe-area-inset-top, 0px)) max(14px, env(safe-area-inset-right, 0px))
           max(20px, env(safe-area-inset-bottom, 0px)) max(14px, env(safe-area-inset-left, 0px)); }
.tv-k-head { display: flex; align-items: center; gap: 10px; }
.tv-k-head .tv-x { width: 40px; height: 40px; margin: 0; }
.tv-k-head .tv-x svg { width: 18px; height: 18px; }
.tv-k-title { flex: 1 1 auto; min-width: 0; }
.tv-k-title b { display: block; font-size: 17px; line-height: 1.25; }
.tv-k-title span { display: block; font-size: 12px; color: var(--tv-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-k-net { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: #5fd68e; }
.tv-k-net.off { background: var(--tv-warn); }
.tv-k-share[aria-expanded="true"] { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-k-sum .tv-cnt b { font-size: 44px; }
.tv-k-sum .tv-cnt span { font-size: 18px; }
.tv-k-sum .tv-prog { height: 6px; border-radius: 3px; }
.tv-k-cam { aspect-ratio: 4 / 3; max-height: 46vh; }
.tv-k-log .tv-logl { min-height: 38px; font-size: 14px; }
.tv-k-more { display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--tv-line);
  background: rgba(255, 255, 255, .05); font-weight: 600; text-align: left; }
.tv-k-more span { flex: 1 1 auto; }
.tv-k-more b { font: 600 13px var(--tv-num); color: var(--tv-muted); }
.tv-k-more svg { width: 18px; height: 18px; transition: transform .2s; }
.tv-k-more[aria-expanded="true"] svg { transform: rotate(180deg); }
.tv-k-list { display: flex; flex-direction: column; gap: 8px; }
.tv-k-rows { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; }
.tv-k-row { aspect-ratio: 1; min-width: 0; padding: 0; border: 1px solid var(--tv-line); border-radius: 6px; background: rgba(255, 255, 255, .04);
  display: flex; align-items: center; justify-content: center; font: 700 12px var(--tv-num); font-variant-numeric: tabular-nums; color: var(--tv-muted); }
.tv-k-row.ok { background: #5fd68e; border-color: #5fd68e; color: #0d2a19; }
.tv-k-print, .tv-k-act { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 14px; border-radius: 10px;
  border: 1px solid var(--tv-line); background: rgba(255, 255, 255, .06); font-weight: 600; }
.tv-k-print { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-k-print svg, .tv-k-act svg { width: 18px; height: 18px; }
.tv-k-pick { display: flex; gap: 6px; }
.tv-k-pick button { flex: 1 1 0; min-width: 0; height: 44px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--tv-line);
  background: rgba(255, 255, 255, .06); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tv-k-box { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 12px; border-radius: 12px;
  border: 1px solid var(--tv-line); background: rgba(255, 255, 255, .04); }
.tv-k-qr { width: 196px; height: 196px; padding: 8px; border-radius: 10px; background: #fff; }
.tv-k-qr:empty { background: rgba(255, 255, 255, .08); }
.tv-k-qr svg { width: 100%; height: 100%; }
.tv-k-url { max-width: 100%; font: 12px/1.4 var(--tv-num); color: var(--tv-muted); text-align: center; overflow-wrap: anywhere;
  user-select: text; -webkit-user-select: text; }
.tv-k-acts { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.tv-k-main { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-kiem > .tv-toast { position: fixed; top: max(64px, calc(env(safe-area-inset-top, 0px) + 52px)); z-index: 3; }
@media (prefers-reduced-motion: reduce) { .tv-k-more svg { transition: none; } }

/* báo cáo in (window.print → "Lưu dưới dạng PDF"): chỉ in khối .tv-print, chữ đen nền trắng */
.tv-print { display: none; }
@media print {
  @page { margin: 12mm; }
  html, body { height: auto !important; overflow: visible !important; background: #fff !important; }
  body > *:not(.tv-print) { display: none !important; }
  .tv-print { display: block !important; color: #111; font: 10pt/1.4 var(--tv-font); }
  .tv-print .hd { display: flex; justify-content: space-between; align-items: flex-end; gap: 8mm; padding-bottom: 2mm; border-bottom: 1.2pt solid #111; }
  .tv-print h1 { margin: 0; font-size: 15pt; text-transform: uppercase; letter-spacing: .02em; }
  .tv-print .hd p { margin: 1mm 0 0; color: #444; }
  .tv-print .when { white-space: nowrap; font-variant-numeric: tabular-nums; }
  .tv-print .info { display: grid; grid-template-columns: max-content 1fr; gap: 1mm 5mm; margin: 4mm 0; }
  .tv-print .info dt { color: #555; }
  .tv-print .info dd { margin: 0; font-weight: 600; }
  .tv-print .fin { margin: 0 0 5mm; padding: 2.5mm 3mm; border: 1pt solid currentColor; border-radius: 1.5mm; font-weight: 700; }
  .tv-print .good { color: #067647; }
  .tv-print .bad { color: #b42318; }
  .tv-print section { margin-bottom: 5mm; }
  .tv-print h2 { margin: 0; font-size: 12pt; break-after: avoid; }
  .tv-print .sub { margin: .5mm 0 1mm; color: #555; font-size: 9pt; }
  .tv-print .st { margin: 0 0 1.5mm; font-weight: 600; }
  .tv-print table { width: 100%; border-collapse: collapse; font-size: 9pt; }
  .tv-print th { text-align: left; border-bottom: .8pt solid #111; padding: 1mm 2mm; }
  .tv-print td { border-bottom: .4pt solid #ccc; padding: .9mm 2mm; }
  .tv-print td.n { width: 1%; white-space: nowrap; font-variant-numeric: tabular-nums; }
  .tv-print tr { break-inside: avoid; }
  .tv-print tr.miss td { color: #b42318; font-weight: 600; }
  .tv-print .sign { display: flex; gap: 20mm; margin-top: 10mm; break-inside: avoid; }
  .tv-print .sign div { flex: 1 1 0; height: 28mm; text-align: center; }
}

/* Nhấn giữ Tìm = vào Kiểm: không cho trình duyệt cuộn / bật menu trên nút; vạch chạy theo thời gian giữ (--tv-hold, viewer.js) */
.tv-seg button[data-m="find"] { position: relative; overflow: hidden; touch-action: none; }
.tv-seg button[data-m="find"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--tv-hl);
  transform: scaleX(0); transform-origin: left; }
.tv-seg button.tv-holding::after { transform: scaleX(1); transition: transform var(--tv-hold, 3000ms) linear; }
/* Mã bảo mật kiểm hàng (plugin 1.0.14, 30/10/2026): hộp nhập 4–6 số */
.tv-pin { position: fixed; inset: 0; z-index: 20; display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(8, 10, 13, .55); }
.tv-pin-box { display: flex; flex-direction: column; gap: 10px; width: min(100%, 300px); padding: 18px; border-radius: 14px;
  border: 1px solid var(--tv-line); background: var(--tv-chrome); box-shadow: var(--tv-shadow); }
.tv-pin-box b { font-size: 15px; }
.tv-pin-box input { height: 48px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--tv-line); background: rgba(255, 255, 255, .06);
  color: var(--tv-fg); font: 600 22px/1 var(--tv-num); letter-spacing: .35em; text-align: center; }
.tv-pin-box input:focus { outline: 2px solid var(--tv-hl); outline-offset: 1px; }
.tv-pin-msg { min-height: 1.4em; margin: 0; font-size: 13px; color: var(--tv-warn); text-align: center; }
.tv-pin-acts { display: flex; gap: 8px; }
.tv-pin-acts button { flex: 1 1 0; height: 44px; border-radius: 10px; border: 1px solid var(--tv-line); background: rgba(255, 255, 255, .06);
  color: var(--tv-fg); font-weight: 600; }
.tv-pin-acts .tv-pin-ok { background: #f4f5f7; border-color: #f4f5f7; color: #15181c; }
.tv-pin-acts .tv-pin-ok:disabled { opacity: .45; }