/* Shared presentation. Backend and media delivery are unchanged. */
:root{color-scheme:dark;--bg:#0c111b;--surface:#121b29;--raised:#172232;--line:#29374a;--text:#e4ebf5;--muted:#a0afc1;--accent:#71c5f4}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;max-width:1520px;margin:auto;padding:28px 36px;line-height:1.5}
.header{border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:22px;gap:16px}.brand{display:flex;align-items:center;gap:14px}.brand-mark{display:grid;place-items:center;background:var(--accent);color:#0c1d2a;font-weight:800;font-size:24px;width:44px;height:44px;border-radius:12px;flex:none}.header h1{font-size:19px;color:var(--text);letter-spacing:-.3px}.header h1 small{font-size:12px;color:var(--muted)}.header p{font-size:12px;color:var(--muted);margin-top:3px}
.tabs{gap:6px;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:24px}.tab{width:auto;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);padding:10px 17px;font-size:13px;margin:0}.tab:hover{background:var(--raised);color:var(--text)}.tab.active{background:#20394e;border:1px solid #3b607a;color:#b8e5ff}
.panel{border:0;padding:0;background:transparent}.section-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 24px}.section-head h2{font-size:27px;color:#f5f8fc;letter-spacing:-.7px;margin:3px 0 5px}.section-head p{font-size:13px;color:var(--muted)}.eyebrow{font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:1.5px}.refresh-note{color:var(--muted);font-size:11px}.overview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:20px}.overview-grid>div{padding:18px 22px;background:var(--surface);border:1px solid var(--line);border-radius:10px}.overview-grid small{display:block;color:var(--muted);font-size:12px}.overview-grid strong{display:block;font-size:30px;color:var(--text);margin-top:4px}.overview-grid .text-warning{color:#f8bf83}
.notice{padding:12px 16px;border:1px solid var(--line);border-radius:8px;margin:0 0 20px;font-size:13px}.notice.warning{background:#292219;border-color:#645138;color:#edc494}.subtle-note{color:var(--muted);font-size:12px;margin:15px 0 22px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;margin-bottom:18px}.card h3{color:var(--text);font-size:16px}.edge-note,.help,.category-note,.channel-count-label{color:var(--muted)}
input,select,textarea{background:#0e1622;color:var(--text);border:1px solid #3a4b60;border-radius:7px;padding:10px 12px;font:inherit;font-size:13px;width:100%;min-width:0}textarea{resize:vertical}input:disabled,select:disabled{opacity:.5}button{width:auto;background:var(--accent);border:1px solid transparent;color:#0c2638;font:inherit;font-size:13px;font-weight:650;border-radius:7px;padding:9px 15px;transition:background .15s}button:hover{filter:brightness(1.1)}button:disabled{opacity:.5;cursor:wait}input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.btn-sm{font-size:12px;padding:7px 12px;margin:0}.btn-edit{background:#1b293b;color:#d0deed;border:1px solid #3a4b60}.btn-green{background:#244c42;color:#a6e6cf;border:1px solid #417d6a}.btn-red,.btn-danger-outline{background:transparent;color:#eea0af;border:1px solid #75414e}.btn-danger-outline:hover,.btn-red:hover{background:#3b2029}.field label{color:#b6c4d5;font-size:11px;font-weight:600}.form-message{color:#f0bf8a}.form-actions button,.login-card button{width:100%}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--surface)}table{margin:0}th{background:#172333;color:#aabbd0;font-size:10px;letter-spacing:.6px;padding:13px 16px;font-weight:600}td{padding:14px 16px;border-bottom:1px solid #263345;font-size:13px;vertical-align:middle}td strong,td b{font-weight:600}tbody tr:last-child td{border-bottom:0}.server-list table{min-width:760px}.server-list td:first-child{width:35%}.server-table-note{color:var(--muted);font-size:11px;margin-top:5px;overflow-wrap:anywhere}.server-actions,.channel-actions,.category-actions{display:flex;gap:8px;flex-wrap:wrap}.stat{font-size:10px;font-weight:600;padding:4px 8px;border-radius:5px;margin:2px 2px 2px 0}.s-on{background:#1b3b32;color:#92dfbd}.s-off{background:#422733;color:#f0acbb}.s-unknown{background:#253144;color:#bdcada}.server-details-row td{padding:0 16px;background:#101926}.server-details-row summary{padding:9px 0;font-size:11px;color:var(--muted);cursor:pointer}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:16px 0}.detail-grid dt{font-size:11px;color:var(--muted)}.detail-grid dd{font-size:12px;margin:4px 0 0;overflow-wrap:anywhere}.diagnostic-error{font-size:12px;color:#efb2a5;overflow-wrap:anywhere}.danger-zone{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:16px 0;margin-top:16px;font-size:11px;color:var(--muted)}
.route-diagnostics{margin:18px 0}.route-diagnostics-title{display:flex;justify-content:space-between;color:var(--muted);font-size:11px;margin-bottom:8px}.route-health-row{display:grid;grid-template-columns:1fr auto;padding:10px 12px;margin-top:6px;background:var(--surface);border-radius:6px;border-left:2px solid #498672;gap:4px 12px;font-size:11px}.route-health-row.down{border-color:#b66d81}.route-health-row.blocked{border-color:#d4ab68}.route-health-row span{font-size:9px}.route-health-row small{grid-column:1/-1;color:var(--muted);overflow-wrap:anywhere}
.disclosure{border:1px solid var(--line);background:var(--surface);border-radius:9px;margin-bottom:20px}.disclosure>summary{padding:15px 18px;color:#c9e2f3;cursor:pointer;font-size:13px;font-weight:600}.disclosure>.card{margin:0;border:0;border-top:1px solid var(--line);border-radius:0 0 9px 9px}.server-form-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.server-form-grid .field-wide{grid-column:span 2}.capacity-preview{color:#afd0e6;background:#192c3d;border-color:#35516c;font-size:12px}.server-switch input,.playback-toggle input{width:18px}.server-switch{grid-column:1/-1}
.stats{gap:12px}.stat-card{background:var(--surface);border:1px solid var(--line);padding:10px 18px;text-align:left}.stat-card .n{font-size:23px}.stat-card .l{color:var(--muted)}.channel-toolbar{align-items:flex-start;margin:18px 0}.channel-toolbar-main{flex-wrap:wrap}.channel-toolbar-main>input{min-width:220px;flex:1}.channel-toolbar-main>select{max-width:240px}.channel-filter-buttons{width:100%}.channel-filter-buttons button{font-size:11px;padding:7px 10px;background:var(--surface);color:var(--muted);border-color:var(--line)}.channel-filter-buttons button.active{background:#20394e;border-color:#3b607a;color:#b8e5ff}.channel-count-label{font-size:11px}.logo-thumb{background:#192333;border-color:var(--line);width:36px;height:36px}.stream-summary .stat{font-size:9px}.playback-badge{background:#20364b;border-color:#335676;color:#a0d4f7}.playback-config{background:var(--surface);border-color:var(--line)}
.modal-backdrop{background:rgba(3,8,15,.8);backdrop-filter:blur(4px)}.modal-box{background:var(--surface);border:1px solid #3a4b60;color:var(--text);max-height:90vh;overflow:auto}.modal-head h2{color:var(--text)}.modal-close{background:#1b293b;color:#d0deed;border:1px solid #3a4b60}.modal-actions button{width:auto}.server-proxy-dialog{margin:auto;box-shadow:0 24px 90px #0008}.server-proxy-dialog::backdrop{background:#03080dcc;backdrop-filter:blur(4px)}.server-proxy-dialog h2{font-size:22px;margin-bottom:8px}.server-proxy-dialog p{color:var(--muted);font-size:12px;margin:7px 0}.server-proxy-dialog button{width:auto}.server-proxy-dialog form>div:last-child{justify-content:flex-end}.server-proxy-dialog label{color:#c5d4e5}.login-screen{background:#0c111b}.login-card{background:var(--surface);border-color:var(--line)}.login-card h2{color:var(--text)}
.epg-source,.isp-kpi{background:var(--surface);border-color:var(--line)}.epg-source small{color:var(--muted)}.epg-summary .stat-card{padding:16px}.audience-empty{color:var(--muted)}
.load-balance-card{padding:20px;margin:0 0 20px}.load-balance-card .section-head{margin-bottom:16px}.load-balance-card .section-head h3{margin:0 0 4px}.load-balance-card .section-head p{margin:0}.load-balance-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:16px}.load-balance-member{display:grid;grid-template-columns:auto 1fr minmax(82px,110px);align-items:center;gap:12px;padding:12px;background:#0e1622;border:1px solid var(--line);border-radius:8px}.load-balance-member>input{width:18px}.load-balance-member span{min-width:0}.load-balance-member span>small{display:block;color:var(--muted);font-size:10px}.load-balance-member input[type=number]{padding:7px 9px}.load-balance-card .form-actions{display:flex;justify-content:flex-end}.load-balance-card .form-actions button{width:auto}
@media(max-width:800px){body{padding:18px 14px}.header h1{font-size:16px}.header h1 small{display:block}.brand-mark{width:36px;height:36px}.section-head{align-items:flex-start;flex-direction:column;gap:8px}.tabs{flex-wrap:nowrap;overflow-x:auto;gap:3px}.tab{white-space:nowrap;padding:9px 12px}.overview-grid{gap:8px}.overview-grid>div{padding:12px}.overview-grid small{font-size:10px}.overview-grid strong{font-size:24px}.server-form-grid{grid-template-columns:1fr}.server-form-grid .field-wide{grid-column:auto}.detail-grid{grid-template-columns:1fr 1fr}.channel-toolbar{flex-direction:column}.channel-toolbar-main{width:100%}.channel-toolbar-main>select{max-width:none}.channel-filter-buttons{gap:5px}.isp-grid{grid-template-columns:1fr 1fr}.modal-box{padding:18px;width:96vw}.server-proxy-dialog{max-height:90vh!important;padding:18px!important}.server-proxy-dialog form>div:last-child{gap:6px!important}.server-proxy-dialog button{padding:9px 11px!important}}
@media(max-width:800px){.load-balance-grid{grid-template-columns:1fr}.load-balance-member{grid-template-columns:auto 1fr 90px}}
.server-proxy-dialog form{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}.server-proxy-dialog form>label:first-child,.server-proxy-dialog form>p,.server-proxy-dialog form>div{grid-column:1/-1}.server-proxy-dialog form>label{margin:8px 0!important}.server-proxy-dialog form>div:last-child{margin-top:10px!important}.server-proxy-dialog form>p{margin:4px 0}.server-proxy-dialog form>label input,.server-proxy-dialog form>label select{margin-bottom:0}
@media(max-width:500px){.server-proxy-dialog form{grid-template-columns:1fr}.server-proxy-dialog form>label{grid-column:1}.server-proxy-dialog form>div:last-child{position:sticky;bottom:-18px;background:#101925;padding:10px 0}}