/* Compact broadcast player controls; settings stay closed until requested. */
.broadcast-screen { position:relative; isolation:isolate; width:100%; min-height:240px; background:#101827; border-radius:12px; overflow:hidden; color:#fff; }
.broadcast-screen > video { display:block; width:100%; min-height:240px !important; object-fit:contain; }
.broadcast-screen-toolbar { position:absolute; z-index:20; inset:auto 0 0; display:flex; align-items:center; justify-content:space-between; gap:4px; padding:22px 8px 6px; background:linear-gradient(transparent,rgba(0,0,0,.8)); }
.broadcast-screen-actions,.broadcast-screen-settings { display:flex; align-items:center; gap:2px; }
.broadcast-screen .broadcast-screen-toolbar button { margin:0 !important; box-shadow:none; font:inherit; cursor:pointer; }
.broadcast-screen .broadcast-screen-toolbar .broadcast-icon { position:relative; display:inline-flex; align-items:center; justify-content:center; flex:0 0 40px; width:40px; height:44px; min-height:44px; padding:0; border:0; border-radius:4px; background:transparent; color:white; font-size:0; line-height:0; }
.broadcast-screen .broadcast-icon > * { display:none; }
.broadcast-screen .broadcast-icon::before { content:''; width:22px; height:22px; background:currentColor; mask:var(--control-icon) center/contain no-repeat; }
.broadcast-screen .broadcast-icon:hover:not(:disabled),.broadcast-screen .broadcast-icon[aria-expanded=true] { background:#ffffff25; }
.broadcast-screen .broadcast-icon:is(#connect,#global-connect,#phone-connect):not(:disabled) { color:#ff5252; }
.broadcast-screen .broadcast-screen-toolbar button:disabled { opacity:.4; cursor:not-allowed; }
.broadcast-screen .broadcast-screen-toolbar [hidden] { display:none !important; }
.broadcast-screen button:focus-visible,.broadcast-screen summary:focus-visible,.broadcast-screen input:focus-visible,.broadcast-screen select:focus-visible { outline:2px solid #93c5fd; outline-offset:-2px; }
.broadcast-settings-menu { position:absolute; bottom:60px; right:8px; width:300px; max-width:calc(100% - 16px); max-height:var(--control-room,180px); overflow-y:auto; overscroll-behavior:contain; box-sizing:border-box; border-radius:8px; padding:8px 0; background:rgba(35,35,35,.97); color:#fff; box-shadow:0 8px 24px #0006; font-size:14px; line-height:1.5; }
.broadcast-settings-menu > strong { display:block; padding:6px 16px 10px; border-bottom:1px solid #ffffff25; font-size:14px; }
.broadcast-screen .broadcast-settings-menu > button,.broadcast-screen .camera-adjustments > summary { display:flex; align-items:center; justify-content:space-between; box-sizing:border-box; width:100%; min-height:44px; padding:10px 16px; border:0; border-radius:0; background:transparent; color:#fff; text-align:left; font-size:14px; line-height:1.5; cursor:pointer; }
.broadcast-screen .broadcast-settings-menu > button:hover,.broadcast-screen .camera-adjustments > summary:hover { background:#ffffff15; }
.broadcast-screen .camera-adjustments { margin:0; }
.broadcast-screen .camera-adjustments summary { list-style:none; }
.broadcast-screen .camera-adjustments summary::-webkit-details-marker { display:none; }
.broadcast-screen .camera-adjustments summary::after { content:''; width:7px; height:7px; border-top:2px solid currentColor; border-right:2px solid currentColor; transform:rotate(45deg); margin-right:4px; }
.broadcast-screen .camera-adjustments[open] summary::after { transform:rotate(135deg); }
.broadcast-screen .camera-adjustments > div { padding:8px 16px 12px; background:#0002; }
.broadcast-screen .camera-adjustments p { color:#ddd; margin:0 0 8px; font-size:12px; }
.broadcast-screen .camera-adjustments label { color:#fff; }
.broadcast-screen .camera-adjustments input { width:100%; min-height:32px; accent-color:#ff5252; }
.broadcast-screen .camera-adjustments select { background:#333; color:#fff; border:1px solid #777; padding:8px; max-width:100%; }
.broadcast-screen #global-end { color:#ff8a80; }
.broadcast-screen:fullscreen { width:100%; height:100%; border-radius:0; }
.broadcast-screen:fullscreen > video { width:100%; height:100%; max-height:none !important; }
.broadcast-screen:fullscreen .broadcast-screen-toolbar { padding-bottom:max(6px,env(safe-area-inset-bottom)); }
@media(max-width:360px) { .broadcast-screen .broadcast-screen-toolbar .broadcast-icon { width:36px; flex-basis:36px; } .broadcast-screen-toolbar { padding-inline:4px; } }
.broadcast-icon[data-icon="play"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m8%205%2011%207-11%207z%22%20fill%3D%22white%22%20stroke%3D%22none%22/%3E%3C/svg%3E"); }
.broadcast-icon[data-icon="stop"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%226%22%20y%3D%226%22%20width%3D%2212%22%20height%3D%2212%22%20fill%3D%22white%22%20stroke%3D%22none%22/%3E%3C/svg%3E"); }
.broadcast-icon[data-icon="camera"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2212%22%20height%3D%2214%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22m15%209%206-3v12l-6-3z%22/%3E%3C/svg%3E"); }
.broadcast-icon[data-icon="mic"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%229%22%20y%3D%223%22%20width%3D%226%22%20height%3D%2212%22%20rx%3D%223%22/%3E%3Cpath%20d%3D%22M5%2010v2a7%207%200%200%200%2014%200v-2M12%2019v3M8%2022h8%22/%3E%3C/svg%3E"); }
.broadcast-icon[data-icon="mic-off"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m3%203%2018%2018M9%209v3a3%203%200%200%200%205%202M9%205a3%203%200%200%201%206%201v5M5%2010v2a7%207%200%200%200%2011%206M19%2010v2M12%2019v3M8%2022h8%22/%3E%3C/svg%3E"); }
.broadcast-icon[data-icon="fullscreen"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%203H3v5M16%203h5v5M21%2016v5h-5M8%2021H3v-5%22/%3E%3C/svg%3E"); }
.broadcast-icon[data-icon="settings"] { --control-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22white%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m9%203-1%203-3%201-2%203%202%202-1%203%203%202%202-1%202%203h3l1-3%203-1%202-3-2-2%201-3-3-2-2%201-2-3z%22/%3E%3Ccircle%20cx%3D%2211.5%22%20cy%3D%2211%22%20r%3D%223%22/%3E%3C/svg%3E"); }

.live-viewer .viewer-live-badge { font:700 11px/1.2 system-ui,sans-serif; letter-spacing:.05em; color:#ccc; display:flex; align-items:center; gap:6px; margin-left:6px; }
.live-viewer .viewer-live-badge::before { content:''; width:7px; height:7px; border-radius:50%; background:#888; }
.live-viewer .viewer-live-badge.is-live::before { background:#ff3838; }
.live-viewer .viewer-setting { display:block; padding:10px 16px; color:white; font-size:14px; }
.live-viewer .viewer-setting input { display:block; width:100%; min-height:32px; accent-color:#ff5252; }
.live-viewer .broadcast-settings-menu small { display:block; padding:8px 16px; color:#ccc; line-height:1.5; }
.viewer-feedback:empty { display:none; }
.viewer-feedback { font-size:.85rem; margin:.5rem 0; }