.os-shared-scan{margin:0 0 22px;padding:20px;border:1px solid var(--admin-border,#ded4dc);border-radius:18px;background:var(--admin-panel,#faf7f9);color:var(--admin-text,#392b35)}
.os-scan-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.os-scan-heading strong{font-size:16px}.os-scan-heading small{display:block;margin-top:4px;opacity:.75}.os-scan-heading>span{font-size:11px;border:1px solid #8e738044;padding:6px 10px;border-radius:30px}
.os-scan-actions{display:flex;flex-wrap:wrap;gap:8px}.os-scan-actions .admin-btn{width:auto;min-height:42px;padding:10px 16px;font-size:12px}.os-shared-scan [hidden]{display:none!important}.os-scan-target{display:grid;gap:6px;margin-top:16px;font-size:12px}.os-scan-target select{max-width:100%;width:100%}.os-scan-pair{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;margin-top:18px;align-items:center}.os-scan-pair img{width:220px;height:220px;max-width:100%;object-fit:contain;padding:8px;background:white;border-radius:12px}.os-scan-pair p,.os-shared-scan>p{font-size:12px;line-height:1.6;margin:12px 0 0}.os-scan-pair input{width:100%;font-size:11px}.os-scan-pair button{margin-top:8px}.os-shared-scan .is-error{color:#b03055}
body.dark-mode .os-shared-scan,[data-theme="dark"] .os-shared-scan{background:#242127;color:#f3e9ef;border-color:#4a3d47}
@media(max-width:600px){.os-shared-scan{padding:14px;border-radius:14px}.os-scan-heading{align-items:flex-start}.os-scan-heading>span{display:none}.os-scan-actions{display:grid;grid-template-columns:1fr}.os-scan-actions .admin-btn{width:100%}.os-scan-pair{grid-template-columns:1fr}.os-scan-pair img{justify-self:center}}
/* Confirmed connection uses both text and a green light, on desktop and phone. */
.os-scan-heading>.os-scan-connection{display:inline-flex!important;align-items:center;gap:8px;flex-shrink:0;font-size:12px;white-space:nowrap;background:#f1f0f2;color:#675d65;border-color:#d8d1d6}
.os-scan-connection i{width:9px;height:9px;border-radius:50%;background:#8d8790;flex-shrink:0}
.os-scan-connection[data-state="connected"]{background:#e7f7ed;color:#166534;border-color:#abd9bb}
.os-scan-connection[data-state="connected"] i{background:#16a34a;box-shadow:0 0 0 3px #16a34a20}
.os-scan-connection[data-state="connecting"]{background:#fff7e5;color:#875800;border-color:#edcf91}
.os-scan-connection[data-state="connecting"] i{background:#d49612}
body.os-phone-scanner-mode>.os-shared-scan{position:fixed;inset:0;z-index:9000;box-sizing:border-box;margin:0;border:0;border-radius:0;padding:24px 20px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom));overflow:auto;background:#faf7f9;color:#392b35;display:flex;flex-direction:column;gap:16px}
body.os-phone-scanner-mode .os-scan-heading{flex-wrap:wrap;margin:0}
body.os-phone-scanner-mode .os-scan-target,body.os-phone-scanner-mode [data-scan="create"],body.os-phone-scanner-mode [data-scan="join"]{display:none!important}
body.os-phone-scanner-mode .os-scan-actions{display:flex;flex-direction:column;gap:12px;order:2}
body.os-phone-scanner-mode .os-scan-actions .admin-btn{min-height:54px;width:100%}
body.os-phone-scanner-mode [data-scan="destination"]{padding:18px;border:1px solid #ded4dc;border-radius:14px;background:white;font-size:14px;overflow-wrap:anywhere}
body.os-phone-scanner-mode [data-scan="scan"]{background:#166534!important;color:white!important;border-color:#166534!important}
body.os-phone-scanner-mode [data-scan="status"]{font-size:14px}
@media(max-width:600px){.os-scan-heading>.os-scan-connection{font-size:11px;padding:6px 8px}}
body.os-phone-scanner-mode>:not(.os-shared-scan):not(#barcode-scanner-modal):not(script):not(style){visibility:hidden!important;pointer-events:none!important}

/* Collapsed by default; the connection light remains visible. */
.os-shared-scan>.os-scan-fold{border:0;background:transparent;padding:0;margin:0;min-width:0}
.os-shared-scan .os-scan-fold>.os-scan-heading{list-style:none;cursor:pointer;margin:0;min-height:40px;color:inherit;background:transparent;border:0;padding:0;border-radius:8px}
.os-scan-heading::-webkit-details-marker{display:none}
.os-scan-fold>.os-scan-heading::after{content:'';width:8px;height:8px;flex:0 0 8px;border-right:2px solid #87334f;border-bottom:2px solid #87334f;transform:rotate(45deg);margin:0 3px 4px;transition:transform .15s}
.os-scan-fold[open]>.os-scan-heading::after{transform:rotate(225deg);margin-bottom:0}
.os-scan-heading>div{flex:1;min-width:0}
.os-scan-fold>.os-scan-heading:focus-visible{outline:2px solid #087e80;outline-offset:5px}
.os-scan-body{padding-top:16px;min-width:0}
.os-scan-body>p{font-size:12px;line-height:1.6;margin:12px 0 0}
body.os-phone-scanner-mode .os-scan-fold{width:100%}
body.os-phone-scanner-mode .os-scan-body{display:flex;flex-direction:column;gap:16px}
body.os-phone-scanner-mode .os-scan-fold>.os-scan-heading{cursor:default}
body.os-phone-scanner-mode .os-scan-heading::after{display:none}
@media(max-width:600px){.os-scan-fold>.os-scan-heading{flex-wrap:wrap;gap:10px}.os-scan-heading>div{flex:1 1 150px}.os-scan-heading>.os-scan-connection{margin-left:0}.os-scan-heading::after{margin-left:auto}}