/* Scanner stays inside the usable iPhone viewport, including the keyboard. */
#product-scanner{--scan-safe-top:var(--helper-safe-top,env(safe-area-inset-top,0px));--scan-safe-bottom:var(--helper-safe-bottom,env(safe-area-inset-bottom,0px));position:fixed;inset:auto;top:calc(var(--helper-vv-top,0px) + var(--scan-safe-top) + 8px);left:0;right:0;margin:0 auto;width:min(560px,calc(100% - 16px));max-width:calc(100% - 16px);height:calc(var(--helper-vv-height,100dvh) - var(--scan-safe-top) - var(--scan-safe-bottom) - 16px);max-height:820px;padding:0;overflow:hidden;border-radius:20px}
#product-scanner[open]{display:flex;flex-direction:column}
#product-scanner [hidden]{display:none!important}
#product-scanner .dialog-head{flex:none;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);gap:10px;background:var(--panel)}
#product-scanner .dialog-head h2{font-size:21px;line-height:1.2;margin:0;letter-spacing:-.5px}
#product-scanner .dialog-head button{padding:8px 12px;font-size:14px}
.scan-body{overflow-y:auto;overscroll-behavior:contain;min-height:0;padding:12px 16px 20px;scroll-padding-block:12px}
#product-scanner label.field{margin:0 0 12px;font-size:13px;color:var(--muted)}
#product-scanner select,#product-scanner input{color:var(--ink)}
.scan-hint{font-size:13px;color:var(--muted);margin:8px 0 12px}
.scan-camera{position:relative;margin:12px 0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#10171a}
.scan-camera video{display:block;width:100%;height:clamp(170px,32dvh,280px);object-fit:cover}
.scan-camera:after{content:'';pointer-events:none;position:absolute;inset:20% 6%;border:2px solid var(--accent);border-radius:12px;box-shadow:0 0 0 100vmax #0003}
#product-scanner .scan-controls{margin:0;display:flex;gap:8px}
.scan-controls button{flex:1}
#product-scanner[data-running="yes"] #scan-start{display:none}
#product-scanner[data-running="no"] #scan-stop{display:none}
#product-scanner[data-entry="yes"] .scan-camera,#product-scanner[data-entry="yes"] .scan-controls,#product-scanner[data-entry="yes"] .scan-hint{display:none}
.scan-state{font-size:14px;line-height:1.45;margin:12px 0;color:var(--accent);overflow-wrap:anywhere}
#scan-barcode{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.6px;margin:8px 0 14px}
#scan-unknown button{width:100%}
#product-scanner .scan-help{margin-top:16px;font-size:13px;color:var(--muted)}
#product-scanner summary{display:flex;align-items:center;min-height:44px;cursor:pointer}
#product-scanner .scan-source{font-size:12px;line-height:1.5}
.scan-results{padding:0;list-style:none;display:grid;gap:8px;margin:8px 0}
.scan-results li{padding:12px;border:1px solid var(--line);border-radius:12px;overflow-wrap:anywhere}
.scan-results strong,.scan-results small{display:block}
#scan-count{font-size:16px;margin:16px 0 8px}
#product-scanner[data-empty="yes"] #scan-count{display:none}
@media(max-width:360px){#product-scanner .dialog-head,.scan-body{padding-left:12px;padding-right:12px}#product-scanner .dialog-head h2{font-size:19px}}
@media(max-height:500px){#product-scanner .scan-camera video{height:150px}}