.zx-code{display:flex;justify-content:center;align-items:center;background:#fff;padding:8px;border-radius:10px;max-width:280px;margin:15px auto}.zx-code svg{display:block;width:100%;height:auto;max-width:260px;background:#fff;color:#000}#code-scanner[open]{display:flex;flex-direction:column;overflow:hidden;max-height:85dvh}.zx-scanner-body{min-height:0;overflow:auto;flex:1}.zx-scanner-body>p{font-size:12px;line-height:1.8;color:var(--muted);margin-bottom:15px}.zx-scanner-body video{display:block;width:100%;max-height:260px;background:var(--ink);border-radius:10px;object-fit:cover;margin-bottom:15px}.zx-scanner-body video[hidden]{display:none}.zx-scanner-tools{display:flex;gap:10px;margin-bottom:17px;flex-wrap:wrap}.zx-scanner-body .form-error:not(:empty){display:block}.zx-scanner-body .field input{overflow-wrap:anywhere}#code-scanner .modal-head,#code-scanner .modal-footer{flex-shrink:0}#code-scanner .modal-head button{font-size:23px;line-height:1;min-width:32px;min-height:32px}
@media(max-width:800px){#code-scanner{container-type:size;container-name:code-sheet}#code-scanner .modal-head h2{font-size:16px}.zx-scanner-tools .btn{font-size:12px}.zx-scanner-body{padding:14px 18px}.zx-scanner-body .field input{font-size:16px}#code-scanner .modal-footer .btn{flex:1;justify-content:center}.zx-code{max-width:240px}}
@container code-sheet (max-height:300px){#code-scanner .modal-head{padding-top:2px;padding-bottom:5px}#code-scanner .modal-footer{padding-top:6px;padding-bottom:8px}.zx-scanner-body{padding:8px 14px}#code-scanner .modal-footer .btn{min-height:34px}}