.listener-sharing { min-width: 0; }
.listener-sharing fieldset { display: flex; flex-wrap: wrap; gap: 12px 24px; border: 0; padding: 0; margin: 0 0 16px; }
.listener-sharing legend { font-weight: 700; margin-bottom: 12px; }
.listener-sharing fieldset label { display: flex; align-items: center; gap: 8px; }
.listener-sharing input[type="radio"] { width: 18px; height: 18px; margin: 0; flex: none; }
.listener-sharing [data-sharing="url"] { width: 100%; box-sizing: border-box; }
.listener-sharing > div { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 16px 0; }
.listener-sharing [data-sharing="qr"] { display: block; max-width: 100%; height: auto; background: white; }
.listener-sharing[hidden], .listener-sharing [hidden] { display: none !important; }
.listener-sharing .sharing-url { display: block; }
.listener-sharing .sharing-compact-label { display: none; }
.broadcast-compact .listener-sharing .sharing-full-label { display: none; }
.broadcast-compact .listener-sharing .sharing-compact-label { display: inline; }
.listener-sharing [data-sharing="qr"] { cursor: copy; }
.listener-sharing [data-sharing="qr"]:focus-visible { outline: 3px solid #008d93; outline-offset: 4px; }
.broadcast-compact .listener-sharing { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr) 112px; gap: 8px 20px; align-items: center; }
.broadcast-compact .listener-sharing fieldset { grid-column: 1; grid-row: 1; gap: 0; margin: 0; }
.broadcast-compact .listener-sharing legend { margin-bottom: 10px; }
.broadcast-compact .listener-sharing fieldset label { position: relative; padding: 10px 12px; border: 1px solid #8bb8bd; cursor: pointer; font-size: 12px; flex: 1; justify-content: center; }
.broadcast-compact .listener-sharing fieldset label:first-of-type { border-radius: 9px 0 0 9px; }
.broadcast-compact .listener-sharing fieldset label:last-of-type { border-radius: 0 9px 9px 0; }
.broadcast-compact .listener-sharing fieldset input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.broadcast-compact .listener-sharing fieldset label:has(:checked) { background: #007c83; color: #fff; border-color: #007c83; }
.broadcast-compact .listener-sharing fieldset label:has(:focus-visible) { outline: 3px solid #183b5a; outline-offset: 2px; }
.broadcast-compact .listener-sharing fieldset label:has(:disabled) { cursor: default; opacity: .7; }
.broadcast-compact .listener-sharing .sharing-url { grid-column: 2; grid-row: 1; position: relative; margin: 0; min-width: 0; }
.broadcast-compact .listener-sharing [data-sharing="url"] { cursor: copy; font-size: 12px; padding-right: 110px; }
.broadcast-compact .listener-sharing [data-sharing="copy"] { position: absolute; right: 5px; bottom: 5px; padding: 5px 8px; opacity: 0; pointer-events: none; }
.broadcast-compact .sharing-url:hover [data-sharing="copy"],
.broadcast-compact .sharing-url:focus-within [data-sharing="copy"] { opacity: 1; pointer-events: auto; }
.broadcast-compact .listener-sharing [data-sharing="qr"] { grid-column: 3; grid-row: 1 / span 3; width: 112px; height: 112px; }
.broadcast-compact .listener-sharing > p { grid-column: 1 / span 2; margin: 0; font-size: 11px; }
.broadcast-compact .listener-sharing .sharing-actions { grid-column: 1 / -1; margin: 2px 0; font-size: 12px; }
@media (hover: none) { .broadcast-compact .listener-sharing [data-sharing="copy"] { opacity: 1; pointer-events: auto; } }
@media (max-width: 700px) {
  .broadcast-compact .listener-sharing { grid-template-columns: minmax(0, 1fr) 96px; gap: 10px; }
  .broadcast-compact .listener-sharing fieldset { grid-column: 1 / -1; grid-row: 1; }
  .broadcast-compact .listener-sharing .sharing-url { grid-column: 1; grid-row: 2; }
  .broadcast-compact .listener-sharing [data-sharing="qr"] { grid-column: 2; grid-row: 2 / span 3; width: 96px; height: 96px; }
  .broadcast-compact .listener-sharing > p { grid-column: 1; }
  .broadcast-compact .listener-sharing [data-sharing="url"] { padding-right: 8px; }
  .broadcast-compact .listener-sharing [data-sharing="copy"] { position: static; margin-top: 4px; }
  .broadcast-compact #liveMasterToggle { width: 100%; min-width: 0; }
}

/* Reserve the QR space before loading; normal status changes keep one slot. */
.listener-sharing .sharing-qr-slot { width:80px; height:80px; flex:none; }
.listener-sharing .sharing-qr-slot [data-sharing="qr"] { width:100%; height:100%; }
.broadcast-compact .listener-sharing { grid-template-columns:minmax(220px,1fr) minmax(0,2fr) 80px; grid-template-rows:minmax(80px,auto) minmax(36px,auto); }
.broadcast-compact .listener-sharing .sharing-qr-slot { grid-column:3; grid-row:1; }
.broadcast-compact .listener-sharing [data-sharing="status"] { grid-column:1 / span 2; grid-row:2; min-height:36px; line-height:18px; }
@media(max-width:700px) {
 .broadcast-compact .listener-sharing { grid-template-columns:minmax(0,1fr) 72px; grid-template-rows:auto minmax(72px,auto) minmax(36px,auto); }
 .broadcast-compact .listener-sharing .sharing-qr-slot { width:72px; height:72px; grid-column:2; grid-row:2; }
 .broadcast-compact .listener-sharing [data-sharing="status"] { grid-column:1 / -1; grid-row:3; }
}
.listener-sharing [data-sharing="status"] { min-height:36px; line-height:18px; }
.listener-sharing .sharing-qr-slot { margin:0; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing { grid-template-columns:190px minmax(120px,1fr) 64px; grid-template-rows:minmax(64px,auto); gap:6px 10px; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing legend { display:none; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing .sharing-qr-slot { width:64px; height:64px; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing [data-sharing='status'] { position:absolute; top:100%; left:20px; right:20px; min-height:0; background:#fff; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing [data-sharing='status']:empty { display:none; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing [data-sharing='url'] { padding-right:8px; }
.broadcast-compact .broadcast-toolbar-actions .listener-sharing [data-sharing='copy'] { bottom:3px; font-size:10px; padding:4px 6px; }
@media(max-width:700px) {
 .broadcast-compact .broadcast-toolbar-actions .listener-sharing { grid-template-columns:minmax(0,1fr) 64px; grid-template-rows:auto minmax(64px,auto) auto; }
 .broadcast-compact .broadcast-toolbar-actions .listener-sharing [data-sharing='status'] { position:static; min-height:36px; }
}