/* ===== BestQR — Health report & print preview ===== */
body.thealth {
  --accent: #16a34a;
  --accent-600: #12833c;
  --accent-soft: #e6f6ec;
  --accent-ring: #16a34a2e;
}
.hr-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: start; }
@media (max-width: 860px) { .hr-grid { grid-template-columns: 1fr; } }
.hr-colors { display: flex; gap: 14px; flex-wrap: wrap; }
.hr-colors label { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--muted); }
.hr-colors input[type=color] { width: 38px; height: 34px; padding: 2px; border: 1px solid var(--border-strong); border-radius: 8px; background: #fff; cursor: pointer; }
.hr-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.hr-two .u-input { width: 100%; }
.hr-drop { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px; border: 2px dashed var(--border-strong); border-radius: 12px; color: var(--muted); font-size: 13.5px; text-align: center; position: relative; cursor: pointer; transition: all .15s; }
.hr-drop:hover, .hr-drop.over { border-color: var(--accent); background: var(--accent-soft); }
.hr-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.hr-drop .icon { width: 20px; height: 20px; color: var(--accent); }
.hr-top { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-bottom: 18px; }
.hr-score { width: 110px; height: 110px; border-radius: 50%; display: grid; place-items: center; text-align: center; border: 8px solid var(--accent); font-family: var(--display); font-weight: 700; font-size: 34px; line-height: 1; flex: none; }
.hr-score small { display: block; font-size: 11px; font-weight: 500; color: var(--muted); font-family: var(--mono); margin-top: 3px; }
.hr-score.pass { border-color: #16a34a; color: #12833c; }
.hr-score.warn { border-color: #d97706; color: #b45f05; }
.hr-score.fail { border-color: #dc2626; color: #b91c1c; }
.hr-verdict { font-family: var(--display); font-weight: 700; font-size: 22px; letter-spacing: -.01em; }
.hr-sum { font-size: 13.5px; color: var(--muted); margin-top: 4px; }
.hr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hr-item { display: flex; gap: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--border); background: #fff; }
.hr-item .icon { width: 20px; height: 20px; flex: none; margin-top: 1px; }
.hr-item b { display: block; font-size: 14.5px; }
.hr-item span { display: block; font-size: 13.5px; color: var(--muted); line-height: 1.5; margin-top: 2px; }
.hr-item.pass .icon { color: #16a34a; }
.hr-item.warn { background: #fffbeb; border-color: #fde68a; }
.hr-item.warn .icon { color: #d97706; }
.hr-item.fail { background: #fef2f2; border-color: #fecaca; }
.hr-item.fail .icon { color: #dc2626; }
.hr-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
.hr-qr { display: grid; place-items: center; padding: 10px; }
#hr-qr canvas, #hr-qr svg { max-width: 100%; height: auto; }
.hr-toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); background: #14161f; color: #fff; padding: 10px 18px; border-radius: 10px; font-size: 14px; opacity: 0; pointer-events: none; transition: all .2s; z-index: 50; }
.hr-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* print preview */
body.tprev { --accent: #0ea5e9; --accent-600: #0284c7; --accent-soft: #e0f2fe; --accent-ring: #0ea5e92e; }
.pv-stage { background: repeating-conic-gradient(#f1f2f7 0 25%, #f8f9fc 0 50%) 50% / 24px 24px; border-radius: 16px; min-height: 420px; display: grid; place-items: center; padding: 28px 16px; overflow: hidden; }
.pv-paper { position: relative; background: #fff; box-shadow: 0 18px 40px -14px rgba(20, 22, 31, .35), 0 2px 6px rgba(20, 22, 31, .12); overflow: hidden; }
.pv-paper .bar { position: absolute; border-radius: 3px; background: #e3e5ee; }
.pv-paper .bar.dark { background: #b9bdcd; }
.pv-paper .blk { position: absolute; border-radius: 4px; background: var(--accent); opacity: .9; }
.pv-paper img.qr { position: absolute; display: block; image-rendering: auto; }
.pv-tee { background: #e9ecf3; clip-path: polygon(30% 0, 70% 0, 78% 7%, 100% 18%, 90% 38%, 80% 33%, 80% 100%, 20% 100%, 20% 33%, 10% 38%, 0 18%, 22% 7%); box-shadow: none; }
.pv-meta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.pv-pill { font-size: 12.5px; padding: 6px 12px; border-radius: 99px; background: var(--surface); border: 1px solid var(--border); color: var(--muted); }
.pv-pill.good { background: #e6f6ec; border-color: #bbf7d0; color: #12833c; }
.pv-pill.warn { background: #fffbeb; border-color: #fde68a; color: #b45f05; }
.pv-pill.bad { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }
.pv-chips { display: flex; gap: 8px; flex-wrap: wrap; }
#pv-test { display: none; }
@media print {
  body.pv-printing > *:not(#pv-test) { display: none !important; }
  body.pv-printing #pv-test { display: block; padding: 10mm; font: 11pt system-ui, sans-serif; }
  body.pv-printing #pv-test img { display: block; }
  @page { margin: 10mm; }
}