.liveApp{max-width:900px;margin:auto}.viewfinder{position:relative;background:#060909;border-radius:18px;overflow:hidden;aspect-ratio:16/9;margin:16px 0}.viewfinder video{width:100%;height:100%;object-fit:contain}.viewfinder span{position:absolute;inset:40% 12%;text-align:center;color:#acc2c4}#badge{border:1px solid #415455;padding:8px 14px;border-radius:20px}#badge.live{background:#a9ff63;color:#102012}#go{background:#b7fa72;color:#112010;font-weight:800}details{background:#192223;padding:16px;border-radius:14px;margin:20px 0}summary{cursor:pointer}button:disabled{opacity:.4}.liveApp h1{font-size:clamp(25px,5vw,42px)}@media(max-width:650px){header{padding:12px}header nav{gap:10px;flex-wrap:wrap}.liveApp{padding:16px}.viewfinder{aspect-ratio:9/12;max-height:58dvh}.liveApp .row{display:flex;flex-wrap:wrap}.liveApp .row button{flex:1;min-width:130px}body{padding-bottom:env(safe-area-inset-bottom)}}
.liveDestinations{background:linear-gradient(135deg,#17292d,#111b20);border:1px solid #35525b;border-radius:16px;padding:18px;margin:20px 0}.liveDestinations h2{margin:0;font-size:22px}.liveDestinations p{font-size:13px;color:#b3c6cb}.liveOutput{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #304249}.liveOutput strong,.liveOutput small{display:block}.liveOutput small{color:#afc3c9;margin-top:5px}.liveOutput input{width:22px;height:22px;accent-color:#b7fa72}.liveOutput[data-tone="live"] small{color:#b7fa72}.liveOutput[data-tone="error"] small{color:#ffac93}#sendOutputs{background:#b7fa72;color:#112010}.liveComposition{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.viewfinder .compositionSource{opacity:0}.liveWorshipPanel{position:fixed;inset:8vh 16px 16px auto;margin:0;width:min(430px,calc(100vw - 32px));box-sizing:border-box;max-height:84vh;overflow:auto;background:#142024;color:#ecf4ef;border:1px solid #496365;border-radius:16px;padding:16px;z-index:9000;box-shadow:0 8px 36px #0008}.liveWorshipPanel h2{display:inline-block;margin:0 18px 16px 0;font-size:1.1rem}.liveWorshipPanel .worshipMixerControls{display:flex;flex-wrap:wrap;gap:8px}.liveWorshipPanel select{max-width:100%}.liveWorshipPanel label{width:100%}.liveWorshipCues{display:flex;flex-direction:column;gap:5px}.liveWorshipCues button{text-align:left}.liveWorshipCues button[aria-pressed=true]{background:#b7fa72;color:#112010}.liveWorshipPanel details{margin:10px 0}.liveComposition[hidden]{display:none}

.liveWorshipPanel{width:min(560px,calc(100vw - 32px));resize:horizontal;min-width:min(320px,calc(100vw - 32px));max-width:calc(100vw - 32px)}
.liveWorshipPanel,.liveWorshipPanel *{box-sizing:border-box;min-width:0;overflow-wrap:anywhere}
.liveWorshipPanel select,.liveWorshipPanel input,.liveWorshipPanel video,.liveWorshipPanel img{max-width:100%}
.liveWorshipPanel .liveCueGroup{padding:0;margin:5px 0;border:1px solid #3c5357;border-radius:12px;overflow:hidden}
.liveCueGroup summary{padding:14px;font-size:16px;line-height:1.45}
.liveCueGroup summary small{display:block;margin-top:4px;font-size:12px;color:#b2c8c9;font-weight:400}
.liveCueGroup button{display:block;width:calc(100% - 16px);margin:8px;padding:14px;white-space:normal;line-height:1.5}
.liveCueGroup button strong{display:block;font-size:12px;margin-bottom:8px;opacity:.8}
.liveCueGroup button span{display:block;white-space:pre-wrap;font-size:17px;font-weight:500}
.liveWorshipPanel a,.liveWorshipPanel button{white-space:normal;max-width:100%}

.livePictureLibrary{margin:18px 0;padding:18px;background:#142024;border:1px solid #354e55;border-radius:14px}.livePictureLibrary summary{font-weight:700;cursor:pointer}.livePictureGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:12px;margin:18px 0}.pictureTile{min-width:0;padding:8px;display:flex;flex-direction:column;gap:6px;text-align:left}.pictureTile img{width:100%;aspect-ratio:16/9;object-fit:contain;background:#090e10;border-radius:6px}.pictureTile span{max-width:100%;overflow-wrap:anywhere;line-height:1.4}.pictureTile small{color:#adc3ca}.pictureTile[aria-pressed=true]{outline:2px solid #c1ef7c}.liveSelectedPicture{display:block;max-width:100%;max-height:220px;margin:12px auto;object-fit:contain}.liveSelectedPicture[hidden]{display:none}.livePictureLibrary select{max-width:100%}