:root{--bg:#101216;--panel:#191c22;--panel2:#23272f;--text:#f3f4f6;--muted:#9ba4b3;--accent:#e74751;--line:#30353e;--ok:#59d9ab;--bad:#ff7b83;--warn:#edc576}
body{background:var(--bg);font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:14px;line-height:1.5}
.top{position:fixed;inset:0 auto 0 0;width:232px;padding:30px 18px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;background:#15171c;border-right:1px solid var(--line);border-bottom:0;overflow-y:auto;gap:36px}
.brand{gap:10px;padding:0 6px}.brandmark{width:49px;height:42px;font-size:22px;flex-shrink:0;border-radius:9px;background:#e74751;box-shadow:none}.brand h1{font-size:14px;letter-spacing:-.3px}.brand p{font-size:11px;color:var(--muted);margin-top:3px}
.tabs{display:flex;flex-direction:column;gap:5px}.tabs button{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid transparent;background:transparent;border-radius:8px;font-size:13px;font-weight:550;padding:12px;color:#aab1bd}.tabs button.active{background:#302127;color:#fff;border-color:#563138}.tabs button:hover{background:#252930;color:#fff}.navGroup{font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#7d8796;padding:18px 12px 6px}.navGroup:first-child{padding-top:0}.navIcon{width:18px;height:18px;flex:none}.sidebarFoot{margin-top:auto;border-top:1px solid var(--line);padding:18px 10px 0;font-size:11px;color:var(--muted)}
main{margin-left:232px;max-width:none;padding:30px 34px 60px}.controlHeading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:26px}.controlHeading h1{font-size:29px;font-weight:650;letter-spacing:-1px;margin:4px 0}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:var(--muted)}.controlHeading p{margin:4px 0 0;color:var(--muted);font-size:13px}.connectionBadge{border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-size:12px;white-space:nowrap;color:var(--muted)}.connectionBadge.online{color:var(--ok);border-color:#315348;background:#152b24}
.card{background:var(--panel);box-shadow:none;border:1px solid var(--line);border-radius:12px;padding:22px}.grid{gap:18px;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}h2{font-size:17px;font-weight:650;letter-spacing:-.25px}h3{font-size:15px}.mini{font-size:12px;line-height:1.6}.muted{line-height:1.6}.btn,button.small{font-family:inherit;font-size:12px;font-weight:600;transition:background .15s;border-radius:7px;padding:9px 12px;border:1px solid var(--line);background:#252a33;color:var(--text);margin:0}.btn:hover,button.small:hover{filter:brightness(1.2)}.btn.primary{background:#d43d49;border-color:#d43d49}.danger{background:#3f232a!important;color:#ff9da4!important;border-color:#69333e!important}.okb{background:#203b32!important;color:#89e6bd!important;border-color:#365d4e!important}.warnb{background:#3a3220!important;color:#edce8e!important;border-color:#615334!important}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #94b8ff;outline-offset:3px}
input,select,textarea{background:#11141a;border-color:#3a414d;border-radius:7px;font:inherit;font-size:13px;color:var(--text);padding:9px 10px}input[type=checkbox],input[type=radio]{width:16px;height:16px;vertical-align:middle;margin:0 5px 0 0;accent-color:var(--accent)}input:focus,select:focus,textarea:focus{outline:2px solid #6789b9;outline-offset:1px}label{color:#bec6d2;font-size:12px}.row>*{min-width:0}.saveLine{gap:8px}.pill{font-size:11px;background:#2b3039;padding:3px 9px}.code{font-size:12px;background:#11141a;border-radius:7px}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.metric{padding:18px 20px;border:1px solid var(--line);background:var(--panel);border-radius:10px}.metric label{margin:0 0 9px;color:var(--muted);font-size:11px}.metric strong{font-size:30px;line-height:1.2;font-weight:650;letter-spacing:-1px}.metric small{display:block;font-size:11px;color:var(--muted);margin-top:8px}.metric.live strong{color:var(--ok)}
.dashboardLayout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:20px}.broadcastBoard{grid-row:span 2}.boardHead{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.boardHead h2{margin:0}.boardRow{display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #2b3039}.boardRow:last-child{border-bottom:0}.boardNumber{color:#7d8796;font:12px ui-monospace,monospace}.boardRow b{display:block;font-size:13px;font-weight:600}.boardRow small{color:var(--muted);font-size:11px}.boardState{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:650;letter-spacing:.4px;color:var(--muted)}.boardState.live{color:var(--ok)}.boardState:before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}.viewerPanel{grid-column:1/-1}.viewerChart{max-height:400px;overflow:auto;padding-right:8px}.viewerRow{padding:5px 0}.viewerBar{background:#699cce}.viewerBarTrack{height:7px}.viewerLive{font-size:32px}.eventsPanel #events{max-height:210px;overflow:auto;font-size:12px}.eventsPanel #events>div{padding:9px 0;border-bottom:1px solid var(--line)}.eventsPanel #events .muted{display:block;font-size:10px}.systemPanel .saveLine{display:grid;grid-template-columns:1fr 1fr}.systemPanel #statusBox{font-size:12px}.feedPanel{grid-column:1/-1}.feedPanel .code{max-height:180px}.feedPanel>summary,.fold>summary{cursor:pointer;font-size:13px;font-weight:600;list-style-position:inside}.feedPanel>summary{padding:2px}.fold{border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:16px 20px;margin-bottom:18px}.fold[open]>summary{margin-bottom:16px}.fold>.card{border:0;padding:0;background:transparent}.fold form.card{border:0;padding:0}.fold .grid{gap:12px}
.filterBar{display:flex;align-items:end;gap:14px;margin-bottom:18px;flex-wrap:wrap}.filterBar label{margin:0;flex:1;min-width:160px}.filterBar input{margin-top:6px}.filterBar select{min-width:160px}.filterBar .filterCount{color:var(--muted);font-size:12px;padding-bottom:10px}.filteredOut{display:none!important}.emptyFilter{padding:22px;color:var(--muted);text-align:center;border:1px dashed var(--line);border-radius:8px}
#channelsList table{display:block;min-width:0}#channelsList thead{display:none}#channelsList tbody{display:grid;gap:12px}#channelsList tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;background:#15181e;overflow:hidden}#channelsList td{display:block;border:0;padding:16px;min-width:0}#channelsList td:first-child{grid-column:1/-1;padding:0}#channelsList tr:not(.expanded) td:not(:first-child),#channelsList tr:not(.expanded) td:first-child>:not(.channelSummary){display:none}#channelsList tr.expanded td:first-child>:not(.channelSummary){margin:12px 16px;width:calc(100% - 32px)}#channelsList tr.expanded td:first-child>.statusDot{display:none}#channelsList td:not(:first-child){border-top:1px solid var(--line)}.cellHeading{display:block;font-size:10px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted);margin-bottom:12px}#channelsList td:last-child{display:flex;flex-wrap:wrap;gap:7px;align-content:start}#channelsList td:last-child .mini{flex-basis:100%}.channelSummary{width:100%;display:flex;align-items:center;gap:12px;background:transparent;border:0;color:var(--text);text-align:left;padding:17px;cursor:pointer;font-family:inherit}.channelSummary .channelTitle{flex:1;min-width:0}.channelSummary b{display:block;font-size:14px}.channelSummary small{font-size:11px;color:var(--muted)}.channelSummary .chevron{color:var(--muted);font-size:16px}.expanded .channelSummary{background:#20252d}.channelsStack{gap:18px}#externalIngestInfo{margin-bottom:0!important}.channelsStack>.fold{margin:0}
#mediaTable .tableWrap{max-height:70vh;overflow:auto;border:1px solid var(--line);border-radius:8px}th{background:#242933;color:#b8c2d0;font-size:11px;position:sticky;top:0;z-index:1}td{padding:12px 8px}#mediaTable td:first-child{width:35px}#mediaTable td:last-child button{display:block;width:100%;margin-bottom:6px}#mediaTable tbody tr:hover{background:#20242b}#mediaTable input[data-f=title]{min-width:190px}#mediaTable textarea{min-width:220px}.extraScheduleGrid{grid-template-columns:1fr}.extraScheduleCard{background:#15181e;padding:18px}.seriesChecks{max-height:370px;overflow:auto;grid-template-columns:repeat(3,minmax(0,1fr));padding-right:5px}.extraScheduleCard .statusLine{cursor:pointer}.extraScheduleCard:not(.expanded)>:not(.statusLine){display:none!important}.extraScheduleCard h3{margin-bottom:2px}.extraScheduleCard .statusLine:after{content:'+';font-size:24px;color:var(--muted)}.extraScheduleCard.expanded .statusLine:after{content:'−'}.extraScheduleCard.expanded .statusLine{margin-bottom:16px}.scheduleSlot{background:#15181e}.scheduleHelp>div{background:#15181e}.scheduleHelp .mini{font-size:11px}#logosList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#logosList>div{min-width:0}.logoPreview{margin:10px 0;background:#11141a}.hidden{display:none!important}.uiDirty{position:sticky;top:0;z-index:11;margin-bottom:15px;padding:10px 14px;background:#42371f;color:#ffdc8f;border:1px solid #6c572c;border-radius:8px;font-size:12px}.navGroup,.sidebarFoot{user-select:none}
@media(min-width:1650px){main{max-width:1800px}.dashboardLayout{grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr)}}
@media(max-width:1150px){.top{width:205px;padding:24px 12px}main{margin-left:205px;padding:24px}.dashboardLayout{grid-template-columns:1fr}.broadcastBoard{grid-row:auto}.viewerPanel,.feedPanel{grid-column:auto}.metrics{grid-template-columns:repeat(2,1fr)}#channelsList tr{grid-template-columns:repeat(2,minmax(0,1fr))}.seriesChecks{grid-template-columns:repeat(2,minmax(0,1fr))}.controlHeading h1{font-size:25px}}
@media(max-width:700px){.top{position:static;width:100%;padding:16px;gap:16px;border-right:0;border-bottom:1px solid var(--line)}.brand h1{font-size:15px}.tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.tabs button{padding:9px 4px;display:flex;flex-direction:column;gap:5px;font-size:10px;text-align:center}.navGroup,.sidebarFoot{display:none}main{margin-left:0;padding:20px 14px 40px}.controlHeading{align-items:flex-start;gap:10px}.controlHeading h1{font-size:23px}.connectionBadge{font-size:10px;padding:6px}.card{padding:16px}.metrics{gap:10px}.metric{padding:14px}.metric strong{font-size:25px}#channelsList tr{grid-template-columns:1fr}.channelSummary{padding:13px;gap:8px}.channelSummary b{font-size:13px}.channelSummary .boardState{font-size:9px}.seriesChecks{grid-template-columns:1fr}.row{flex-wrap:wrap}.row>*{flex:1 1 100px}.scheduleHelp{grid-template-columns:1fr}#logosList{grid-template-columns:1fr}.viewerRow{grid-template-columns:1fr}.filterBar label{min-width:120px}.controlHeading p{font-size:12px}}
/* Keep the operational overview compact and prevent min-content overflow. */
.card,.dashboardLayout>*{min-width:0}.dashboardLayout{grid-template-areas:"board system" "board events" "viewers viewers" "feed feed";align-items:start}.broadcastBoard{grid-area:board}.systemPanel{grid-area:system}.eventsPanel{grid-area:events}.viewerPanel{grid-area:viewers}.feedPanel{grid-area:feed}#broadcastRows{max-height:510px;overflow:auto;padding-right:8px}.boardHead{gap:12px;flex-wrap:wrap}.boardRow b{overflow-wrap:anywhere}#channelsList td:last-child .cellHeading{flex-basis:100%}.channelSummary .channelTitle{overflow-wrap:anywhere}
@media(max-width:1150px){.dashboardLayout{grid-template-columns:minmax(0,1fr);grid-template-areas:"board" "system" "events" "viewers" "feed"}.viewerRow{grid-template-columns:minmax(120px,1fr) minmax(80px,1fr) auto}}
@media(max-width:700px){.viewerRow{grid-template-columns:1fr}.boardHead .btn{font-size:11px}.channelSummary .boardState{max-width:68px}.systemPanel .saveLine{grid-template-columns:1fr 1fr}}
