:root{--bg: #0f1117;--panel: #1a1d27;--accent: #7c5cff;--text: #e8e9ee;--muted: #9aa0b0;--danger: #ff5c72}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text)}.topbar{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;border-bottom:1px solid #262a38}.topbar h1{margin:0;font-size:1.4rem}.topbar nav button{background:none;border:none;color:var(--muted);font-size:1rem;cursor:pointer;margin-left:1rem}.topbar nav button.active{color:var(--accent);font-weight:600}main{padding:1.5rem;max-width:960px;margin:0 auto}.view.hidden,.hidden{display:none}.stream-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}.stream-card{background:var(--panel);border-radius:12px;padding:1rem}.stream-card h3{margin:0 0 .3rem;font-size:1.05rem}.stream-card .meta{margin:.15rem 0;color:var(--muted);font-size:.85rem}button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:.5rem .9rem;cursor:pointer;font-size:.9rem}button.danger{background:var(--danger)}form{display:flex;flex-direction:column;gap:.6rem;max-width:360px}input{background:var(--panel);border:1px solid #2c3040;color:var(--text);border-radius:8px;padding:.55rem .7rem;font-size:.95rem}video{width:100%;max-width:720px;margin-top:1rem;background:#000;border-radius:12px;aspect-ratio:16 / 9}.status{color:var(--muted);margin-top:.6rem}.empty{color:var(--muted)}.muted-note{color:var(--muted);font-size:.8rem;margin-top:1rem}.section-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}.toolbar{display:flex;gap:.6rem;margin:1rem 0 1.25rem;flex-wrap:wrap}.toolbar input[type=search]{flex:1;min-width:200px}.toolbar select{background:var(--panel);border:1px solid #2c3040;color:var(--text);border-radius:8px;padding:.55rem .7rem;font-size:.95rem}.panel-form{background:var(--panel);border-radius:12px;padding:1rem;max-width:none;margin-bottom:1rem}.panel-form .form-row{flex-direction:row;display:flex;gap:.6rem}button.ghost{background:none;border:1px solid #2c3040;color:var(--text)}button.small{padding:.3rem .6rem;font-size:.78rem}.stream-card .desc{margin:.3rem 0;font-size:.85rem}.stream-card .card-id{display:flex;align-items:center;gap:.5rem;margin-top:.6rem}.stream-card .card-id code{flex:1;font-size:.7rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}a.channel-card{display:block;color:inherit;text-decoration:none;border:1px solid transparent;transition:border-color .12s ease,transform .12s ease}a.channel-card:hover,a.channel-card:focus-visible{border-color:var(--accent);transform:translateY(-1px)}a.channel-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.live-badge{color:var(--danger);font-size:.7rem;font-weight:700;letter-spacing:.04em;vertical-align:middle;margin-left:.4rem}#view-channel .desc{margin:.4rem 0 1rem}#view-channel h3{margin:1.6rem 0 .4rem;font-size:.95rem;border-top:1px solid var(--panel);padding-top:1.2rem}#view-channel .card-id{display:flex;align-items:center;gap:.5rem;max-width:34rem}#view-channel .card-id code{flex:1;font-size:.75rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#channel-live-panel{background:var(--panel);border-radius:12px;padding:1rem;max-width:34rem}#channel-key-out,#channel-live-panel .meta{margin:0 0 .6rem}#channel-key-out{-webkit-user-select:all;user-select:all;word-break:break-all}.relay-panel{background:var(--panel);border-radius:12px;padding:.8rem 1rem;margin-top:1rem;max-width:34rem}.relay-toggle{display:flex;align-items:center;gap:.5rem;cursor:pointer}.relay-toggle input{cursor:pointer}.relay-panel .status{margin-top:.4rem}.status.subtle{font-size:.85rem}.topbar .account{display:flex;align-items:center;gap:.6rem;margin-left:auto}#account-name{color:var(--muted);font-size:.9rem}#view-account .panel-form{max-width:26rem}