/* HR-specific additions. Original SDK tokens/auth/scan/result CSS is bundled unchanged. */
html,body{margin:0;width:100%;height:100%;overflow:hidden}#app{position:relative;width:100%;height:100%;height:100dvh;background:var(--dhv-color-bg)}[hidden]{display:none!important}
.hr-mode-col{padding-top:20px}.hr-mode-options{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}.hr-mode-card{border:1.5px solid var(--dhv-color-secondary-cta-border);border-radius:10px;background:var(--dhv-color-surface);color:var(--dhv-color-font-title);font-family:inherit;padding:32px 24px;cursor:pointer;text-align:left}.hr-mode-card strong{display:block;font-size:24px;margin-bottom:16px}.hr-mode-card span{font-size:18px;line-height:1.7;color:var(--dhv-color-font-contents)}.hr-mode-card:focus-visible{outline:3px solid var(--dhv-color-focused)}.hr-mode-card:hover{background:var(--dhv-color-selected-bg)}.hr-privacy{text-align:center;font-size:14px;margin-top:32px!important}
.hr-live-value{font-size:30px;font-weight:700;line-height:1.3;margin-top:8px}.hr-update{font-size:14px;line-height:1.4;margin-top:6px!important}.dhv-scan__bottom #quality{font-size:clamp(16px,calc(22 * var(--u)),28px);line-height:1.4}.hr-scan-back{position:absolute;right:calc(33 * var(--u));bottom:calc(70 * var(--gu,var(--u)));height:calc(40 * var(--u));padding:0 16px;background:transparent;border:1.5px solid white;border-radius:10px;color:white;font:inherit;cursor:pointer;z-index:4}.hr-error{position:absolute;left:50%;transform:translateX(-50%);top:16px;width:min(90%,660px);padding:14px 18px;background:#fff2f2;color:#982a2a;border:1px solid #f1bcbc;border-radius:10px;font-size:16px;line-height:1.5;z-index:9;white-space:pre-line;text-align:center}.dhv-scan__help,.dhv-scan__retry,.dhv-scan__bottom,.dhv-scan__top{z-index:3}
.hr-instructions{width:min(92vw,560px);max-height:88dvh;border:0;border-radius:16px;padding:24px;background:var(--dhv-color-surface);color:var(--dhv-color-font-contents);font:inherit}.hr-instructions::backdrop{background:rgba(0,0,0,.65)}.hr-instructions h2{font-size:24px;margin-bottom:20px}.hr-instructions ul{list-style:none;padding:0}.hr-instructions li{display:flex;align-items:center;gap:18px;margin:20px 0;line-height:1.6}.hr-instructions img{width:64px;max-height:86px;object-fit:contain}.hr-instructions p{line-height:1.5;font-size:14px;margin:20px 0}.hr-instructions button{width:100%;height:52px;font-size:18px}.dhv-auth-invite__helper{white-space:normal;max-width:92%}
[data-dhv-layout="mobile"] .hr-mode-options{grid-template-columns:1fr;gap:16px;margin-top:32px}[data-dhv-layout="mobile"] .hr-mode-card{padding:24px}[data-dhv-layout="mobile"] .hr-mode-card strong{font-size:21px}[data-dhv-layout="mobile"] .hr-mode-card span{font-size:16px}[data-dhv-layout="mobile"] .hr-live-value{font-size:25px}[data-dhv-layout="mobile"] .hr-error{font-size:14px;top:8px}

/* HR overlays never enter the video used for RGB extraction. */
.hr-live-panel{position:absolute;left:50%;transform:translateX(-50%);top:calc((var(--gy) + var(--gh) + 4) * var(--u));width:min(78%,350px);color:#b6f0d1;z-index:4;pointer-events:none}
.hr-live-panel svg{display:block;width:100%;height:80px}
.dhv-scan__top.hr-current-value{font-size:clamp(28px,calc(40 * var(--u)),48px);font-weight:700;text-shadow:0 2px 10px #000}
.hr-just-updated{animation:hr-update-flash .3s ease-out}
@keyframes hr-update-flash{from{color:#63e8a2}to{color:white}}
.hr-measure-controls{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));display:flex;flex-direction:column;align-items:flex-start;gap:6px;z-index:5;width:max-content;max-width:96%}
.hr-measure-controls button{border:1px solid #ffffff80;border-radius:8px;background:#15251ee6;color:white;padding:10px 12px;font:inherit;font-size:14px;cursor:pointer}
.hr-measure-controls button:disabled{opacity:.45;cursor:default}
.hr-result-trend{color:#16794b;margin:12px 0}.hr-result-trend svg{width:100%;max-height:180px;display:block}
.dhv-scan[data-hr-live="true"] .dhv-scan__bottom{top:calc((var(--gy) + var(--gh)) * var(--u) + 88px);font-size:16px}
@media(max-height:700px){.hr-live-panel svg{height:55px}.dhv-scan[data-hr-live="true"] .dhv-scan__bottom{top:calc((var(--gy) + var(--gh)) * var(--u) + 62px);font-size:13px}.hr-measure-controls{top:max(8px,env(safe-area-inset-top))}.hr-measure-controls button{padding:7px 9px;font-size:12px}}
@media(prefers-reduced-motion:reduce){.hr-just-updated{animation:none}.hr-just-updated::after{content:'Just updated';display:block;font-size:12px;font-weight:400}}

.dhv-ux[data-dhv-layout="mobile"] .dhv-scan .hr-live-panel{top:calc(466 * var(--u) + 86 * var(--gu))}
.dhv-ux[data-dhv-layout="mobile"] .dhv-scan[data-hr-live="true"] .dhv-scan__bottom{top:calc(462 * var(--u) + 86 * var(--gu) + 88px)}
@media(max-height:700px){.dhv-ux[data-dhv-layout="mobile"] .dhv-scan[data-hr-live="true"] .dhv-scan__bottom{top:calc(462 * var(--u) + 86 * var(--gu) + 62px)}}

/* Restore the original bottom camera controls; host actions are now top-left. */
.dhv-scan[data-state="scanning"] .dhv-scan__retry,
.dhv-scan[data-state="scanning"] .dhv-scan__switch{margin-bottom:0}

.hr-recovery-note{position:absolute;top:max(12px,env(safe-area-inset-top));right:12px;max-width:calc(100% - 195px);padding:6px 10px;border-radius:6px;background:#000a;color:#fff;font-size:14px;text-align:center;z-index:4;pointer-events:none}
