.barcode-camera-button{color:#155eef;vertical-align:middle;cursor:pointer;background:#edf4ff;border:1px solid #cbdcf6;border-radius:8px;justify-content:center;align-items:center;min-width:44px;min-height:44px;display:inline-flex}.barcode-camera-button:focus-visible,.barcode-scanner button:focus-visible{outline-offset:2px;outline:3px solid #60a5fa}.barcode-scanner{color:#152d4b;background:#fff;border:0;border-radius:16px;width:min(700px,95vw);max-height:95dvh;padding:0;overflow:auto;box-shadow:0 20px 70px #001c4d66}.barcode-scanner::backdrop{background:#051629bb}.barcode-scanner header{justify-content:space-between;gap:16px;padding:18px;display:flex}.barcode-scanner h2{margin:0;font-size:22px}.barcode-scanner p{font-size:14px;line-height:1.5}.barcode-scanner button,.barcode-scanner select,.barcode-scanner input:not([type=range]){color:#123566;background:#f1f6ff;border:1px solid #bfd3f1;border-radius:8px;min-height:44px;padding:10px}.barcode-scanner button{cursor:pointer}.barcode-scanner button:disabled{opacity:.5}.barcode-video{aspect-ratio:16/10;background:#081729;position:relative;overflow:hidden}.barcode-video video{object-fit:contain;width:100%;height:100%}.barcode-target{pointer-events:none;border:3px solid #60a5fa;border-radius:12px;position:absolute;inset:17.5% 10%;box-shadow:0 0 0 200px #0003}.barcode-video>span{color:#fff;background:#071a2cbb;border-radius:6px;padding:6px;font-size:13px;position:absolute;bottom:12px;left:12px}.barcode-scanner footer{flex-wrap:wrap;gap:10px;padding:18px;display:flex}.barcode-scanner label{flex-direction:column;gap:6px;display:flex}.barcode-scanner form,.barcode-candidates{gap:12px;padding:18px;display:grid}.barcode-candidates button{text-align:left;flex-wrap:wrap;align-items:center;gap:12px;display:flex}.barcode-candidates code{overflow-wrap:anywhere;white-space:normal}.barcode-error{color:#9f1239;background:#fff1f2;border-radius:8px;margin:14px 18px;padding:12px}@media (max-width:600px){.barcode-scanner{border-radius:0;width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0}.barcode-scanner footer>button{flex:1}.barcode-video{aspect-ratio:1}.barcode-scanner header p{max-width:270px}}.barcode-scanner header>button{flex-shrink:0;align-self:flex-start;min-width:44px}
