:root,:root[data-theme=dark]{--app-bg-1:#0b0d17;--app-bg-2:#1a1a2e;--app-bg-3:#16213e;--panel-bg:#0a0a10;--card-bg:#161625;--primary-text:#fff;--secondary-text:#d3d3d3;--muted-text:grey;--border-color:hsla(0,0%,100%,.2);--hover-color:hsla(0,0%,100%,.1);--icon-bg:hsla(0,0%,100%,.1);--accent:#4a60d4;--danger:#ff3b30;--warning:#fc0}:root[data-theme=light]{--app-bg-1:#e4ebf5;--app-bg-2:#f3f6fa;--app-bg-3:#fff;--panel-bg:#fff;--card-bg:#f5f7fa;--primary-text:#1a1a2e;--secondary-text:#4a4a6a;--muted-text:#8888a0;--border-color:rgba(0,0,0,.1);--hover-color:rgba(0,0,0,.05);--icon-bg:rgba(0,0,0,.05);--accent:#4a60d4;--danger:#ff3b30;--warning:#fc0}*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;color:var(--primary-text);background:linear-gradient(135deg,var(--app-bg-1) 0,var(--app-bg-2) 50%,var(--app-bg-3) 100%);overflow:hidden}button{cursor:pointer;border:none;background:none;color:inherit}button,input,select{font-family:inherit}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-track{background:transparent}.login-wrap{display:flex;align-items:center;justify-content:center;height:100vh}.login-card{width:380px;background:var(--card-bg);border:1px solid var(--border-color);border-radius:16px;padding:36px 32px;box-shadow:0 20px 60px rgba(0,0,0,.4)}.login-logo{text-align:center;font-size:30px;font-weight:800;letter-spacing:2px;margin-bottom:6px}.login-logo span{color:var(--accent)}.login-sub{text-align:center;color:var(--muted-text);font-size:13px;margin-bottom:26px}.field{margin-bottom:16px}.field label{display:block;font-size:12px;color:var(--secondary-text);margin-bottom:6px}.field input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--border-color);background:var(--panel-bg);color:var(--primary-text);font-size:14px;outline:none}.field input:focus{border-color:var(--accent)}.checkbox-row{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--secondary-text);margin-bottom:20px}.btn-primary{width:100%;padding:13px;border-radius:10px;background:var(--accent);color:#fff;font-weight:700;font-size:14px;letter-spacing:1px}.btn-primary:disabled{opacity:.6;cursor:default}.login-error{background:rgba(255,59,48,.15);border:1px solid var(--danger);color:var(--danger);padding:10px 12px;border-radius:8px;font-size:13px;margin-bottom:16px}.app{display:flex;height:100vh}.sidebar{width:322px;flex-shrink:0;background:var(--panel-bg);border-right:1px solid var(--border-color);display:flex;flex-direction:column;transition:width .2s ease;overflow:hidden}.sidebar.collapsed{width:0;border-right:none}.brand{padding:18px 20px;font-size:22px;font-weight:800;letter-spacing:1px;border-bottom:1px solid var(--border-color)}.brand span{color:var(--accent)}.sidebar-controls{padding:14px;display:flex;flex-direction:column;gap:10px}.input,.select{width:100%;padding:10px 12px;border-radius:8px;border:1px solid var(--border-color);background:var(--card-bg);color:var(--primary-text);font-size:13px;outline:none}.input:focus,.select:focus{border-color:var(--accent)}.channel-list{flex:1 1;overflow-y:auto;padding:4px 8px}.channel-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13px}.channel-item:hover{background:var(--hover-color)}.channel-item.active{background:var(--accent);color:#fff}.channel-logo{width:26px;height:26px;border-radius:4px;object-fit:contain;background:var(--icon-bg);flex-shrink:0}.channel-name{flex:1 1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.heart{display:flex;align-items:center;flex-shrink:0;color:var(--muted-text);transition:color .15s,transform .1s}.heart:hover{transform:scale(1.15)}.heart.fav,.heart:hover{color:var(--danger)}.channel-item.active .heart{color:hsla(0,0%,100%,.85)}.channel-item.active .heart.fav{color:#fff}.search-wrap{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:11px;display:flex;color:var(--muted-text);pointer-events:none}.search-input{padding-left:34px}.main{flex:1 1;display:flex;flex-direction:column;min-width:0}.topbar{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--border-color)}.account{display:flex;flex-direction:column;line-height:1.2}.account .u{font-weight:700;font-size:14px}.account .s{font-size:11px;color:var(--muted-text)}.spacer{flex:1 1}.icon-btn{width:38px;height:38px;border-radius:8px;background:var(--icon-bg);display:flex;align-items:center;justify-content:center;font-size:16px}.icon-btn:hover{background:var(--hover-color)}.icon-btn.active{background:var(--accent);color:#fff}.icon-btn:disabled{opacity:.6;cursor:default}.topbtn{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--c,var(--accent));background:color-mix(in srgb,var(--c,var(--accent)) 14%,transparent);border:1px solid color-mix(in srgb,var(--c,var(--accent)) 28%,transparent);transition:transform .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease}.topbtn:hover{background:var(--c,var(--accent));color:#fff;transform:translateY(-2px);box-shadow:0 6px 18px color-mix(in srgb,var(--c,var(--accent)) 50%,transparent)}.topbtn:active{transform:translateY(0) scale(.94)}.topbtn.active{background:var(--c,var(--accent));color:#fff;box-shadow:0 4px 14px color-mix(in srgb,var(--c,var(--accent)) 45%,transparent)}.topbtn:disabled{opacity:.55;cursor:default}.topbtn svg{width:19px;height:19px}.spin-icon{display:inline-block;animation:spin 1s linear infinite}.stage{display:flex;min-height:0}.stage,.video-box{flex:1 1;position:relative;background:#000}.video-box{min-width:0}.video-box video{width:100%;height:100%;object-fit:contain;background:#000}.dual .video-box+.video-box{border-left:2px solid var(--accent)}.box-focus{outline:3px solid var(--accent);outline-offset:-3px}.box-label{top:10px;left:12px;padding:4px 10px;z-index:5}.box-change,.box-label{position:absolute;background:rgba(0,0,0,.6);border-radius:6px;font-size:12px}.box-change{top:8px;right:10px;z-index:6;padding:5px 10px}.buffering{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;background:rgba(0,0,0,.55);z-index:7;font-size:14px}.spinner{width:42px;height:42px;border:4px solid hsla(0,0%,100%,.25);border-top:4px solid var(--accent);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.controlbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;grid-gap:16px;gap:16px;padding:14px 22px;border-top:1px solid var(--border-color);background:var(--panel-bg)}.now-playing{display:flex;align-items:center;gap:9px;min-width:0}.np-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.np-idle{font-size:13px;color:var(--muted-text)}.live-dot{width:8px;height:8px;border-radius:50%;background:#ff3b30;flex-shrink:0;box-shadow:0 0 0 0 rgba(255,59,48,.6);animation:pulse 1.8s infinite}@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,59,48,.5)}70%{box-shadow:0 0 0 7px rgba(255,59,48,0)}to{box-shadow:0 0 0 0 rgba(255,59,48,0)}}.transport{gap:14px}.ctl-btn,.transport{display:flex;align-items:center}.ctl-btn{width:42px;height:42px;border-radius:50%;justify-content:center;color:var(--c,var(--secondary-text));background:color-mix(in srgb,var(--c,#888) 12%,transparent);border:1px solid color-mix(in srgb,var(--c,#888) 22%,transparent);transition:background .16s ease,color .16s ease,transform .14s ease,box-shadow .16s ease}.ctl-btn:hover{background:var(--c,var(--accent));color:#fff;transform:translateY(-2px);box-shadow:0 6px 18px color-mix(in srgb,var(--c,var(--accent)) 50%,transparent)}.ctl-btn:active{transform:translateY(0) scale(.9)}.ctl-btn.play{width:58px;height:58px;color:#fff;border:none;background:linear-gradient(135deg,#5a73ff,#4a60d4 55%,#3a4db0);box-shadow:0 8px 22px rgba(74,96,212,.55),0 0 0 0 rgba(74,96,212,.5)}.ctl-btn.play:hover{transform:translateY(-3px) scale(1.06);box-shadow:0 12px 30px rgba(74,96,212,.7)}.ctl-btn.play:active{transform:translateY(0) scale(.95)}.ctl-btn.play.is-playing{animation:playGlow 2.4s ease-in-out infinite}@keyframes playGlow{0%,to{box-shadow:0 8px 22px rgba(74,96,212,.55),0 0 0 0 rgba(74,96,212,.45)}50%{box-shadow:0 8px 26px rgba(74,96,212,.7),0 0 0 8px rgba(74,96,212,0)}}.ctl-right{justify-content:flex-end;gap:24px}.ctl-right,.volume{display:flex;align-items:center}.volume{gap:6px;width:160px}.volume input[type=range]{flex:1 1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:5px;border-radius:3px;background:linear-gradient(to right,var(--accent) var(--fill,80%),var(--border-color) var(--fill,80%));outline:none;cursor:pointer}.volume input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.3)}.volume input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--accent)}.danger-hover:hover{background:rgba(255,59,48,.15)!important;color:var(--danger)}.epg-panel{position:absolute;top:0;right:0;width:320px;height:100%;background:var(--panel-bg);border-left:1px solid var(--border-color);padding:16px;overflow-y:auto;z-index:8}.epg-panel h3{font-size:14px;margin-bottom:14px;color:var(--accent)}.epg-item{padding:10px 0;border-bottom:1px solid var(--border-color)}.epg-item .t{font-size:11px;color:var(--muted-text)}.epg-item .show{font-size:13px;margin-top:2px}.overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:50}.dialog{background:var(--card-bg);border:1px solid var(--border-color);border-radius:14px;padding:26px;width:420px;max-height:80vh;overflow-y:auto}.dialog h2{font-size:18px;margin-bottom:12px}.dialog p{color:var(--secondary-text);font-size:14px;line-height:1.5;margin-bottom:18px}.dialog-row{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--border-color);font-size:14px}.dialog-row .k{color:var(--muted-text)}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.btn{padding:10px 16px;border-radius:8px;font-weight:600;font-size:13px;background:var(--icon-bg)}.btn:hover{background:var(--hover-color)}.btn.danger{background:var(--danger);color:#fff}.btn.warn{background:var(--warning);color:#000}.btn.accent{background:var(--accent);color:#fff}.settings-row{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border-color);font-size:14px}.picker{width:460px;height:70vh;display:flex;flex-direction:column}.picker .channel-list{flex:1 1;border:1px solid var(--border-color);border-radius:8px;margin-top:12px}.empty-box{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;color:var(--muted-text);cursor:pointer}.empty-box .plus{font-size:44px;line-height:1}