:root{color-scheme:dark;--bg:#0d111d;--card:#171d2d;--card2:#1e2638;--border:#30394c;--text:#f4f6fb;--muted:#9ca9c2;--faint:#6f7d98;--accent:#81e6d1;--accent-ink:#072f2c;--danger:#ffa7ad;--radius:20px;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",system-ui,sans-serif;font-synthesis:none;-webkit-text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse 700px 400px at 10% -10%,#23374865,transparent),var(--bg);color:var(--text);min-height:100vh}button,input,textarea{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}.svg-library{position:absolute;width:0;height:0;overflow:hidden}svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.app-shell{max-width:960px;margin:auto;padding:0 22px 116px}.masthead{height:92px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff11;margin-bottom:28px}.brand{display:flex;align-items:center;gap:13px;font-size:23px;font-weight:800;letter-spacing:-1px;line-height:1}.brand-icon{display:grid;place-items:center;width:47px;height:47px;border-radius:15px;background:linear-gradient(140deg,#84ead2,#48b6c6);box-shadow:0 10px 30px #49e5bd1e;color:#073334}.brand-icon svg{width:25px;height:25px;stroke-width:2.3}.brand-em{color:var(--accent)}.brand small{display:block;margin-top:8px;font-size:9px;font-weight:800;color:var(--faint);letter-spacing:2.6px}.round-action{width:43px;height:43px;display:grid;place-items:center;color:var(--text);border:1px solid var(--border);border-radius:14px;background:#20293b}.section-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:3px 0 22px}.section-title h1{font-size:clamp(29px,4.8vw,38px);margin:8px 0 0;letter-spacing:-1.5px}.eyebrow{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:2px;margin:0;display:flex;align-items:center;gap:9px}.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#6eeab1;box-shadow:0 0 0 4px #6eeab112}.muted-count,.subtle-text{color:var(--muted);font-size:12px}.player-card{background:var(--card);border:1px solid var(--border);border-radius:23px;overflow:hidden;box-shadow:0 15px 40px #0003}.player-stage{position:relative;background:radial-gradient(ellipse at 50% 30%,#263d51,#101724 66%);aspect-ratio:16/8.5;min-height:210px;max-height:485px}.player-stage video{width:100%;height:100%;object-fit:contain;background:#03070c}.player-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:9px;flex-direction:column;padding:20px;text-align:center}.player-empty strong{font-size:19px;letter-spacing:-.5px}.player-empty>span:not(.player-orbit){font-size:13px;color:var(--muted)}.player-orbit{width:67px;height:67px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#64d8c7,#284d65);margin-bottom:7px;box-shadow:0 0 0 13px #6fddcf12}.player-orbit svg{width:29px;height:29px;stroke-width:2.6;fill:var(--text);stroke:var(--text)}.player-empty .button{margin-top:14px}.nowbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 20px;min-height:92px}.nowbar-heading{display:flex;flex-direction:column;gap:5px;min-width:0}.nowbar-heading strong{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.now-pill{font-weight:800;color:var(--accent);letter-spacing:1.5px;font-size:9px;display:flex;align-items:center;gap:9px}.now-pill .live-dot{width:6px;height:6px}.favourite-control{border:1px solid var(--border);border-radius:14px;background:var(--card2);color:#b8c5dc;width:43px;height:43px;display:grid;place-items:center}.favourite-control.active{color:#ffcf74;border-color:#82683b}.favourite-control.active svg,.fav-toggle.active svg{fill:currentColor}.toolbar{margin-top:28px;display:flex;gap:10px}.search{height:48px;background:var(--card);border:1px solid var(--border);border-radius:14px;display:flex;align-items:center;gap:10px;padding:0 14px;flex:1;color:#91a3c0}.search svg{width:18px;height:18px}.search input{border:0;outline:0!important;background:transparent;color:var(--text);min-width:0;width:100%;font-size:14px}.search input::placeholder{color:#8390a8}.button{border-radius:12px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:750;border:0;min-height:43px;padding:0 17px;font-size:13px}.button svg{width:17px;height:17px}.button-primary{background:var(--accent);color:var(--accent-ink)}.button-primary:hover{background:#a5f6e7}.button-secondary{color:#e1ebf8;background:#263145;border:1px solid #34415a}.button-outline{border:1px solid var(--border);background:none;color:var(--text)}.category-list{display:flex;gap:9px;overflow:auto;scrollbar-width:none;margin:21px -22px 27px;padding:0 22px 4px}.category-list::-webkit-scrollbar{display:none}.category-chip{border:1px solid var(--border);border-radius:40px;background:#1b2435;color:#adbcd2;white-space:nowrap;padding:10px 15px;font-size:12px;font-weight:700}.category-chip.active{background:var(--accent);border-color:var(--accent);color:#092e2d}.list-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:0 0 14px}.list-heading h2{font-size:17px;letter-spacing:-.4px;margin:0}.list-heading span{font-size:11px;color:var(--muted)}.channel-list,.guide-list{display:grid;gap:9px}.channel-card{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid #2c3548;border-radius:15px;padding:10px 11px;min-height:69px}.channel-card.is-playing{border-color:#6dcfbd;background:#1a3040}.channel-main{display:flex;align-items:center;gap:12px;min-width:0;flex:1;border:0;background:none;color:inherit;padding:0;text-align:left}.channel-avatar{width:46px;height:46px;flex-shrink:0;border-radius:12px;background:linear-gradient(125deg,#365b68,#283351);display:grid;place-items:center;color:#c2f3e6;font-size:16px;font-weight:800;overflow:hidden}.channel-avatar img{width:100%;height:100%;object-fit:contain;padding:4px}.channel-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}.channel-meta strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-meta small{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.play-arrow{color:#9db9c9;display:grid;place-items:center;margin-left:auto}.play-arrow svg{width:18px;height:18px;fill:#9db9c9}.fav-toggle{border:0;background:none;color:#8d99b0;display:grid;place-items:center;width:39px;height:42px;flex-shrink:0}.fav-toggle.active{color:#ffcf74}.fav-toggle svg{width:19px;height:19px}.empty-state{display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:190px;border:1px dashed #39455e;border-radius:18px;text-align:center;padding:20px;gap:9px;color:var(--muted)}.empty-state strong{color:#e5ebf9}.empty-state svg{width:35px;height:35px;color:#6da8a4}.empty-state p{font-size:12px;margin:0;line-height:1.6}.show-more{width:100%;margin-top:15px}.section-explain{color:var(--muted);font-size:13px;line-height:1.6;margin:-8px 0 22px}.guide-search{margin-bottom:17px}.guide-card{background:var(--card);border:1px solid var(--border);border-radius:15px;padding:15px}.guide-card-top{display:flex;align-items:center;gap:12px;margin-bottom:10px}.guide-card-top .channel-avatar{width:37px;height:37px;border-radius:11px;font-size:13px}.guide-card-top strong{flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guide-card-top button{font-size:11px;background:#2a3847;border:0;color:var(--accent);border-radius:8px;padding:8px 10px}.guide-event{display:flex;gap:13px;font-size:12px;color:#e8eef9;margin-top:9px}.guide-event time{color:var(--accent);min-width:68px;flex-shrink:0}.guide-event span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.guide-event.next{color:#95a3b9}.guide-progress{height:3px;border-radius:4px;background:#394357;overflow:hidden;margin-top:12px}.guide-progress span{display:block;height:100%;background:var(--accent);width:0}.settings-card{padding:17px 16px 7px;border-radius:18px;background:var(--card);border:1px solid var(--border);margin-bottom:17px}.settings-card h2{font-size:13px;margin:0 0 12px;color:#a5b1c6;letter-spacing:.4px}.setting-row{color:var(--text);background:none;border:0;display:flex;align-items:center;text-align:left;gap:13px;width:100%;padding:15px 0;border-top:1px solid #ffffff11}.setting-icon{width:35px;height:35px;display:grid;place-items:center;background:#2a3546;border-radius:10px;color:var(--accent)}.setting-icon svg{width:17px;height:17px}.setting-row>span:nth-child(2){flex:1;min-width:0}.setting-row strong,.toggle-row strong{display:block;font-size:13px}.setting-row small,.toggle-row small{display:block;font-size:11px;line-height:1.5;color:var(--muted);margin-top:5px}.setting-row .arrow{width:15px;height:15px;color:#6e7f99}.danger .setting-icon,.danger strong{color:var(--danger)}.toggle-row{display:flex;align-items:center;gap:12px;padding:15px 0;border-top:1px solid #ffffff11}.toggle-row>span{flex:1}.toggle-row input{accent-color:var(--accent);width:22px;height:22px}.privacy-note{border:1px solid #305b58;border-radius:15px;padding:15px;display:flex;gap:12px;background:#18342e75;color:#c0e9e2}.privacy-note svg{color:var(--accent);margin-top:1px}.privacy-note strong{font-size:13px}.privacy-note p{font-size:11px;line-height:1.6;margin:6px 0 0;color:#a8c7c3}.footer-note{font-size:11px;color:var(--faint);text-align:center;margin:25px 0}.bottom-nav{position:fixed;z-index:20;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:min(5vw,40px);padding:10px 12px calc(12px + env(safe-area-inset-bottom));background:#141a28ed;backdrop-filter:blur(16px);border-top:1px solid #3c4658}.nav-item{border:0;background:none;color:#8795ae;display:flex;flex-direction:column;align-items:center;gap:5px;min-width:66px;font-size:10px;font-weight:700;padding:5px 0}.nav-item.active{color:var(--accent)}.nav-item svg{width:22px;height:22px}.notice{position:sticky;top:10px;z-index:25;background:#21433f;color:#ccfff0;border:1px solid #4f8e82;padding:13px 17px;border-radius:12px;font-size:12px;line-height:1.5;margin:-10px 0 20px;box-shadow:0 10px 40px #0006}.notice.error{background:#4e2732;border-color:#9b5a6d;color:#ffe3ea}.source-dialog{width:min(calc(100% - 20px),540px);max-height:min(92dvh,780px);border-radius:24px;border:1px solid #3a475c;background:#1b2333;color:var(--text);padding:24px;overflow:auto;box-shadow:0 22px 90px #0009}.source-dialog::backdrop{background:#030915b8;backdrop-filter:blur(5px)}.modal-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.modal-top h2{margin:8px 0 0;font-size:24px;letter-spacing:-.8px}.close-button{border:1px solid var(--border);background:#2c3545;color:#d8e4f0;width:36px;height:36px;border-radius:11px;display:grid;place-items:center}.modal-desc{color:var(--muted);font-size:13px;line-height:1.6;margin:15px 0 20px}.source-tabs{display:flex;gap:5px;background:#121a29;border:1px solid #334051;padding:5px;border-radius:13px}.source-method{background:none;color:#94a2bb;border:0;border-radius:9px;flex:1;height:38px;font-size:13px;font-weight:700}.source-method.selected{background:#334658;color:var(--accent)}.form-content{margin:23px 0 16px}.input-block label{display:block;font-weight:750;font-size:13px;margin-bottom:11px}.input-block input:not([type=file]),.input-block textarea{display:block;width:100%;color:var(--text);background:#101827;border:1px solid #47536a;border-radius:12px;padding:13px;font-size:14px;outline:none}.input-block input::placeholder,.input-block textarea::placeholder{color:#687992}.input-block input[type=file]{display:block;max-width:100%;font-size:12px;line-height:2}.input-block small{display:block;color:var(--muted);line-height:1.6;margin-top:9px;font-size:11px}.form-error{border:1px solid #a05262;background:#4f2935;color:#ffe2e8;border-radius:10px;padding:12px;font-size:12px;line-height:1.5;margin-bottom:15px}.full-button{width:100%;min-height:49px}.demo-button{width:100%;border:0;background:transparent;color:var(--accent);padding:17px 0 8px;font-size:12px;font-weight:750}.modal-footnote{font-size:10px;color:#8392aa;line-height:1.5;margin:14px 0 0;text-align:center}@media(min-width:700px){.app-shell{padding:0 40px 116px}.category-list{margin-left:0;margin-right:0;padding-left:0;padding-right:0}.channel-list{grid-template-columns:repeat(2,minmax(0,1fr))}.bottom-nav{max-width:700px;left:50%;transform:translateX(-50%);border:1px solid #354258;border-bottom:0;border-radius:18px 18px 0 0}.masthead{margin-bottom:38px}.guide-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:400px){.app-shell{padding-left:15px;padding-right:15px}.category-list{margin-left:-15px;margin-right:-15px;padding-left:15px;padding-right:15px}.brand{font-size:21px}.brand-icon{width:42px;height:42px}.button.small{padding:0 12px}.nowbar{padding:15px}.player-stage{min-height:200px}.source-dialog{padding:20px}.nav-item{min-width:62px}}@media(prefers-reduced-motion:no-preference){.button,.category-chip,.nav-item{transition:background .15s,color .15s}} 
.view:not(.is-active){display:none}.channel-card button:active,.setting-row:active{opacity:.8}

/* Secure relay controls */
.relay-settings{display:grid;gap:13px}.relay-settings .input-block{margin:0}.relay-settings .input-block input{width:100%;min-height:50px;padding:12px 14px;border:1px solid #3c5065;border-radius:13px;background:#111927;color:#f7fafc;font-size:16px}.relay-settings .input-block label{display:block;margin-bottom:7px;font-weight:650}.relay-settings .input-block small{display:block;margin-top:5px;color:#9dacbf;font-size:12px;line-height:1.5}.relay-settings .section-explain{margin-top:0}.relay-settings .relay-status{line-height:1.6;font-size:13px;color:#9dacbf;margin:0;overflow-wrap:anywhere}.relay-settings .button-outline{margin-top:0}.relay-settings .relay-status.error{color:#ff9a99}.relay-settings .relay-status.ok{color:#80e1cc}