:root{--bg:#1e2030;--bg-soft:#222436;--surface:#2f334d;--surface-2:#3b4261;--fg:#c8d3f5;--muted:#a9b8e8;--accent:#82aaff;--accent-hover:#a8c5ff;--accent-soft:#82aaff29;--accent-border:#82aaff61;--focus-ring:#82aaff80;--accent-2:#c099ff;--success:#c3e88d;--warn:#ffc777;--danger:#ff757f;--border:#444a73;--ring:#82aaff73}body[data-theme=youtube]{--bg:#2a171d;--bg-soft:#342029;--surface:#462a35;--surface-2:#5a3342;--border:#7b3f52;--accent:#f03;--accent-hover:#cc0029;--accent-soft:#ff003329;--accent-border:#ff003359;--focus-ring:#ff003380;--success:#4caf50;--danger:#ff5252;--warn:#ffb74d;--ring:#ff003359}body{background:radial-gradient(circle at 20% -10%, color-mix(in srgb, var(--surface-2) 88%, black) 0%, var(--bg-soft) 45%, var(--bg) 100%);min-height:100vh;color:var(--fg);scrollbar-width:none;-ms-overflow-style:none;margin:0;font-family:IBM Plex Sans,Noto Sans,sans-serif}body::-webkit-scrollbar{display:none}html{scrollbar-width:none;-ms-overflow-style:none}html::-webkit-scrollbar{display:none}.ui-hide-scrollbar{scrollbar-width:none;-ms-overflow-style:none}.ui-hide-scrollbar::-webkit-scrollbar{display:none}.ui-muted{color:var(--muted);margin:0}.ui-error{border:1px solid var(--danger);color:var(--danger);background:#ff525226;border-radius:.5rem;margin:0;padding:.75rem}.ui-list{gap:.75rem;display:grid}.ui-card{border:1px solid var(--border-strong);background:var(--bg-card);border-radius:.75rem}.ui-card-interactive{cursor:pointer;transition:border-color .2s,background-color .2s}.ui-card-interactive:hover,.ui-card-interactive:focus-visible{border-color:var(--accent-border);background:var(--accent-soft);outline:none}.ui-card-interactive:focus-visible{box-shadow:0 0 0 3px var(--focus-ring)}.ui-media-row{text-align:left;color:inherit;align-items:center;gap:.75rem;padding:.8rem;display:grid}.ui-media-visual{align-items:center;display:flex}.ui-media-main{gap:.28rem;min-width:0;display:grid}.ui-media-title{color:var(--fg);white-space:nowrap;text-overflow:ellipsis;text-align:left;font-size:.95rem;font-weight:600;overflow:hidden}.ui-media-meta{color:var(--muted);font-size:.8rem}.ui-avatar{object-fit:cover;background:linear-gradient(90deg, var(--surface-2) 25%, var(--skeleton-mid) 50%, var(--surface-2) 75%);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-pulse;display:block}.ui-avatar[src]{background:var(--surface-2);animation:none}.ui-avatar-fallback{text-transform:uppercase;color:var(--fg);place-items:center;font-weight:700;display:grid}.ui-thumbnail{object-fit:cover;background:linear-gradient(90deg, var(--surface-2) 25%, var(--skeleton-mid) 50%, var(--surface-2) 75%);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-pulse;display:block}.ui-thumbnail[src]{background:var(--surface-2);animation:none}@keyframes skeleton-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.ui-nav-chip{border:1px solid var(--border-strong);color:var(--fg);font:inherit;cursor:pointer;background:0 0;border-radius:.6rem;justify-content:center;align-items:center;min-height:2rem;padding:.4rem .8rem;font-size:.85rem;font-weight:600;line-height:1;display:inline-flex}.ui-nav-chip:hover{border-color:var(--accent-border);background:var(--accent-soft)}.ui-nav-chip:disabled{opacity:.6;cursor:not-allowed}.ui-ghost-btn{border:1px solid var(--border-soft);color:var(--fg);font:inherit;cursor:pointer;background:0 0;border-radius:.6rem;padding:.62rem .95rem;font-weight:600;transition:border-color .15s,background-color .15s}.ui-ghost-btn:hover{border-color:var(--accent-border);background:var(--accent-soft)}.ui-ghost-btn:disabled{opacity:.6;cursor:not-allowed}.ui-input{border:1px solid var(--border-soft);color:var(--fg);font:inherit;background:#080c13e6;border-radius:.6rem;padding:.7rem .8rem}.ui-section-title{color:var(--fg);font-weight:600}.ui-page-shell{box-sizing:border-box;align-content:start;justify-items:center;min-height:100dvh;padding:1rem;display:grid}.ui-page-shell--centered{align-content:center}.ui-page-panel{background:linear-gradient(160deg, var(--bg-elevated), var(--bg-panel));border:1px solid var(--border-subtle);border-radius:1rem;width:min(42rem,100%);padding:1.2rem;box-shadow:0 1rem 2.5rem #03081073}.ui-page-panel--wide{width:min(74rem,96vw)}.ui-page-panel--narrow{width:min(24rem,100%)}.ui-page-header{justify-content:space-between;align-items:flex-start;gap:.75rem;margin-bottom:1rem;display:flex}.ui-page-eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin:0;font-size:.68rem}.ui-page-title{margin:.18rem 0 0;font-size:clamp(1.45rem,4vw,1.9rem);line-height:1.1}.ui-page-subtle{color:var(--muted);margin:.35rem 0 0;font-size:.86rem}.ui-page-subtle strong{color:var(--fg)}.ui-alert-success{color:var(--success-soft);background:#81c7842e;border:1px solid #c3e88d73;border-radius:.6rem;margin:0 0 .9rem;padding:.65rem .72rem}.ui-form{gap:.8rem;display:grid}.ui-field{gap:.35rem;display:grid}.ui-label{color:var(--fg);font-weight:600}.ui-button-primary{background:var(--accent);color:#1e2030;font:inherit;cursor:pointer;border:0;border-radius:.6rem;padding:.62rem .95rem;font-weight:600}.ui-button-primary:disabled{opacity:.6;cursor:not-allowed}.ui-action-row{justify-content:flex-end;margin-top:.2rem;display:flex}.ui-panel-header--centered{text-align:center;margin-bottom:1.25rem}.ui-success-message{text-align:center;padding:1rem 0}.ui-success-text{color:var(--success);margin:0;font-size:1.1rem;font-weight:600}.ui-success-subtext{color:var(--muted);margin:.5rem 0 0;font-size:.9rem}:root{--border-subtle:color-mix(in srgb, var(--border) 65%, transparent);--border-soft:color-mix(in srgb, var(--border) 72%, transparent);--border-medium:color-mix(in srgb, var(--border) 75%, transparent);--border-strong:color-mix(in srgb, var(--border) 78%, transparent);--accent-border-hover:color-mix(in srgb, var(--accent) 68%, white);--accent-border-soft:color-mix(in srgb, var(--accent) 55%, var(--border));--bg-panel:color-mix(in srgb, var(--bg-soft) 95%, transparent);--bg-elevated:color-mix(in srgb, var(--surface) 95%, transparent);--bg-card:color-mix(in srgb, var(--bg-soft) 60%, var(--surface));--bg-surface-soft:color-mix(in srgb, var(--surface) 45%, transparent);--bg-surface-medium:color-mix(in srgb, var(--surface) 75%, transparent);--skeleton-mid:color-mix(in srgb, var(--surface-2) 70%, var(--surface));--success-soft:color-mix(in srgb, var(--success) 72%, white);--live-soon-bg:#ff757f3d;--live-soon-border:#ff757f8f;--live-active-bg:#eb040066;--live-active-border:#eb0400bd;--accent-hover:color-mix(in srgb, var(--accent) 85%, white);--surface-subtle:color-mix(in srgb, var(--surface-2) 62%, transparent)}.theme-youtube,body[data-theme=youtube]{--bg:#2a171d;--bg-soft:#342029;--surface:#462a35;--surface-2:#5a3342;--border:#7b3f52;--accent:#f03;--accent-hover:color-mix(in srgb, var(--accent) 85%, white);--accent-soft:#ff003329;--accent-border:#ff003359;--focus-ring:#ff003380;--success:#4caf50;--danger:#ff5252;--warn:#ffb74d;--ring:#ff003359;--border-subtle:color-mix(in srgb, var(--border) 65%, transparent);--border-soft:color-mix(in srgb, var(--border) 72%, transparent);--border-medium:color-mix(in srgb, var(--border) 75%, transparent);--border-strong:color-mix(in srgb, var(--border) 78%, transparent);--accent-border-hover:color-mix(in srgb, var(--accent) 68%, white);--accent-border-soft:color-mix(in srgb, var(--accent) 55%, var(--border));--bg-panel:color-mix(in srgb, var(--bg-soft) 95%, transparent);--bg-elevated:color-mix(in srgb, var(--surface) 95%, transparent);--bg-card:color-mix(in srgb, var(--bg-soft) 60%, var(--surface));--bg-surface-soft:color-mix(in srgb, var(--surface) 45%, transparent);--bg-surface-medium:color-mix(in srgb, var(--surface) 75%, transparent);--skeleton-mid:color-mix(in srgb, var(--surface-2) 70%, var(--surface));--success-soft:color-mix(in srgb, var(--success) 72%, white);--live-soon-bg:#ff757f3d;--live-soon-border:#ff757f8f;--live-active-bg:#eb040066;--live-active-border:#eb0400bd;--surface-subtle:color-mix(in srgb, var(--surface-2) 62%, transparent)}@media screen and (width>=1000px) and (width<=1400px) and (height>=600px) and (height<=800px) and (orientation:landscape){.ui-page-shell{padding:.5rem}.ui-page-header{margin-bottom:.5rem}.ui-page-panel{padding:.8rem}.ui-list{gap:.5rem}}@media (prefers-reduced-motion:reduce){.ui-avatar,.ui-thumbnail{animation:none}}.ui-chat-composer{flex:1;min-width:0;position:relative}.ui-chat-composer-input{box-sizing:border-box;background:var(--bg);border:1px solid var(--border);width:100%;color:var(--fg);white-space:pre-wrap;word-break:break-word;scrollbar-width:none;-ms-overflow-style:none;border-radius:6px;outline:none;min-height:2.2rem;max-height:6rem;padding:.35rem .55rem;line-height:1.2;overflow:hidden auto}.ui-chat-composer-input::-webkit-scrollbar{display:none}.ui-chat-composer-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--ring)}.ui-chat-composer-input:empty:before{content:attr(data-placeholder);color:var(--muted);pointer-events:none}.ui-chat-composer-input.is-disabled{opacity:.65;cursor:not-allowed}.ui-chat-suggestions{border:1px solid var(--border);background:var(--bg-soft);z-index:45;border-radius:6px;max-height:180px;position:absolute;bottom:calc(100% + .42rem);left:0;right:0;overflow-y:auto;box-shadow:0 8px 20px #0000006b}.ui-chat-suggestion-item{cursor:pointer;color:var(--fg);text-align:left;appearance:none;background:0 0;border:0;align-items:center;gap:.45rem;width:100%;min-height:34px;padding:.35rem .5rem;font-size:.86rem;display:flex}.ui-chat-suggestion-item:hover,.ui-chat-suggestion-item.active{background:var(--surface)}.ui-chat-suggestion-item img{object-fit:contain;flex:0 0 24px;width:24px;height:24px}.ui-chat-suggestion-item span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ui-chat-composer-emote-wrap{vertical-align:middle;cursor:pointer;display:inline-block;position:relative}.ui-chat-composer-emote{vertical-align:middle;-webkit-user-select:none;user-select:none;z-index:1;width:auto;height:1.35em;margin:0 .05em;display:inline-block;position:relative}.ui-chat-emote-preview{pointer-events:none;z-index:120;filter:drop-shadow(0 10px 18px #000000a6);opacity:0;background-position:50%;background-repeat:no-repeat;background-size:contain;border-radius:8px;width:112px;height:112px;transition:opacity .18s,transform .18s;position:fixed;transform:scale(.8)}.ui-chat-emote-preview.visible{opacity:1;transition-delay:.35s;transform:scale(1)}.empty-state{text-align:center;flex-direction:column;align-items:center;gap:.75rem;padding:2.5rem 1.5rem;display:flex}.empty-icon{color:var(--muted);opacity:.6;margin-bottom:.25rem}.empty-title{color:var(--fg);margin:0;font-size:1rem;font-weight:600}.empty-description{color:var(--muted);max-width:24rem;margin:0;font-size:.9rem;line-height:1.5}.empty-action{margin-top:.5rem}@media (width<=600px){.empty-state{padding:2rem 1rem}}.error-state{border:1px solid color-mix(in srgb, var(--danger) 40%, transparent);background:#ff525214;border-radius:.6rem;align-items:flex-start;gap:.75rem;padding:1rem;display:flex}.error-icon{color:var(--danger);flex-shrink:0;margin-top:.1rem}.error-content{flex:1;gap:.6rem;min-width:0;display:grid}.error-message{color:var(--fg);overflow-wrap:anywhere;margin:0;line-height:1.5}.retry-btn{border:1px solid color-mix(in srgb, var(--border) 72%, transparent);color:var(--fg);font:inherit;cursor:pointer;background:0 0;border-radius:.5rem;align-items:center;gap:.4rem;width:fit-content;padding:.45rem .8rem;font-size:.85rem;font-weight:500;transition:border-color .15s,background-color .15s;display:inline-flex}.retry-btn:hover:not(:disabled){border-color:var(--accent-border);background:var(--accent-soft)}.retry-btn:disabled{opacity:.6;cursor:not-allowed}.retry-spinner{border:2px solid #fff3;border-top:2px solid var(--fg);border-radius:50%;width:.9rem;height:.9rem;animation:.8s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.retry-spinner{animation:none}}.modal-overlay{z-index:100;opacity:0;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-overlay.entering{animation:.18s ease-out forwards overlayFadeIn}.modal-overlay.exiting{animation:.18s ease-in forwards overlayFadeOut}.modal{opacity:0;background:linear-gradient(160deg,#141c2bfa,#0d121cfa);border:1px solid #a4b6d84d;border-radius:1rem;width:90%;max-width:22rem;padding:1.5rem;transform:scale(.96)}.modal.entering{animation:.18s ease-out forwards modalEnter}.modal.exiting{animation:.18s ease-in forwards modalExit}@keyframes overlayFadeIn{0%{opacity:0}to{opacity:1}}@keyframes overlayFadeOut{0%{opacity:1}to{opacity:0}}@keyframes modalEnter{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes modalExit{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.96)}}.modal-content{min-width:0;margin-bottom:1.25rem}.modal-content p{color:var(--fg);overflow-wrap:anywhere;word-break:break-word;margin:0 0 .5rem;line-height:1.5}.modal-content p:last-child{margin-bottom:0}.modal-content .subtle{color:var(--muted);font-size:.9rem}.modal-content strong{color:var(--accent);overflow-wrap:anywhere;word-break:break-word}.modal-content .danger-text{color:var(--danger)}.modal-actions{justify-content:flex-end;gap:.5rem;display:flex}.modal-actions button{background:var(--accent);color:#1e2030;font:inherit;cursor:pointer;border:0;border-radius:.6rem;padding:.62rem .95rem;font-weight:600;transition:opacity .15s}.modal-actions button:disabled{opacity:.6;cursor:not-allowed}.modal-actions button.primary{background:var(--accent);color:#1e2030}.modal-actions button.danger{background:color-mix(in srgb, var(--danger) 92%, #1e2030);color:#fff}@media (prefers-reduced-motion:reduce){.modal-overlay,.modal{opacity:1;animation:none;transform:none}}.loaded-fade{opacity:0}.loaded-fade.loaded{animation:loadedFadeIn var(--loaded-fade-duration,.18s) ease both}@keyframes loadedFadeIn{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.loaded-fade{opacity:1}.loaded-fade.loaded{animation:none}}.skeleton-text{flex-direction:column;gap:.5rem;width:100%;display:flex}.skeleton-line{background:linear-gradient(90deg, var(--surface-2) 25%, color-mix(in srgb, var(--surface-2) 70%, var(--surface)) 50%, var(--surface-2) 75%);background-size:200% 100%;border-radius:.25rem;height:.9rem;animation:1.5s ease-in-out infinite skeleton-pulse}@media (prefers-reduced-motion:reduce){.skeleton-line{background:var(--surface-2);animation:none}}.relay-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex;position:relative}.relay-header-title{min-width:0}.relay-header-eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin:0;font-size:.68rem}.relay-header-subtitle{color:var(--muted);margin:.35rem 0 0;font-size:.86rem}.relay-header-subtitle strong{color:var(--fg);font-weight:700}.relay-header-title h1{margin:0;font-size:clamp(1.5rem,4vw,2rem);line-height:1.1}.relay-header-button,.relay-header-button:hover,.relay-header-button:focus,.relay-header-button:active{text-decoration:none}.relay-header-button{appearance:none;font:inherit;font-weight:inherit;cursor:pointer;text-align:left;color:inherit;background:0 0;border:0;align-items:baseline;gap:.4rem;margin:.2rem 0 0;padding:0;display:inline-flex}.relay-header-button:hover{color:var(--accent)}.relay-header-toggle-icon{opacity:.45;color:var(--muted);align-items:center;transition:opacity .15s,transform .15s;display:inline-flex}.relay-header-button:hover .relay-header-toggle-icon{opacity:.9;color:var(--accent);transform:rotate(180deg)}@media (width<=600px){.relay-header{flex-direction:column;align-items:flex-start}}.skeleton-media-list{gap:.75rem;display:grid}.skeleton-media-row{border:1px solid color-mix(in srgb, var(--border) 78%, transparent);background:color-mix(in srgb, var(--bg-soft) 60%, var(--surface));border-radius:.75rem;grid-template-columns:74px minmax(0,1fr);align-items:center;gap:.75rem;padding:.8rem;display:grid}.skeleton-media-info{min-width:0}.skeleton-video-list{flex-direction:column;gap:.75rem;display:flex}.skeleton-video-row{box-sizing:border-box;border:1px solid color-mix(in srgb, var(--border) 75%, transparent);background:color-mix(in srgb, var(--bg-soft) 62%, var(--surface));border-radius:.75rem;align-items:stretch;gap:1rem;width:100%;padding:1rem;display:flex}.skeleton-video-info{flex-direction:column;flex:1;justify-content:center;min-width:0;display:flex}@media (width<=700px){.skeleton-video-row{flex-direction:column}}.skeleton-recordings{gap:.75rem;display:grid}.skeleton-section{border:1px solid color-mix(in srgb, var(--border) 58%, transparent);background:color-mix(in srgb, var(--bg-soft) 62%, #0a101b);border-radius:.75rem;padding:.8rem}.skeleton-section-header{margin-bottom:.55rem}.skeleton-list{gap:.45rem;display:grid}.skeleton-item{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.4rem 0;display:grid}.skeleton-item-content{gap:.25rem;min-width:0;display:grid}.skeleton-item-actions{align-items:center;gap:.35rem;display:inline-flex}.skeleton-action{background:linear-gradient(90deg, var(--surface-2) 25%, color-mix(in srgb, var(--surface-2) 70%, var(--surface)) 50%, var(--surface-2) 75%);background-size:200% 100%;border-radius:.55rem;width:2rem;height:2rem;animation:1.5s ease-in-out infinite skeleton-pulse}.skeleton-thumbnail{background:linear-gradient(90deg, var(--surface-2) 25%, color-mix(in srgb, var(--surface-2) 70%, var(--surface)) 50%, var(--surface-2) 75%);background-size:200% 100%;flex-shrink:0;max-width:100%;animation:1.5s ease-in-out infinite skeleton-pulse}@media (prefers-reduced-motion:reduce){.skeleton-action,.skeleton-thumbnail{animation:none}.skeleton-thumbnail{background:var(--surface-2)}}.status-dot{vertical-align:middle;border-radius:50%;width:6px;height:6px;margin-right:.35rem;display:inline-block}.status-dot.connected{background:var(--success)}.status-dot.disconnected{background:color-mix(in srgb, var(--muted) 60%, var(--danger))}.header-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:flex;position:relative}.header-actions-inline{align-items:center;gap:.5rem;display:flex}.header-actions-menu{display:none;position:relative}.menu-dropdown{background:var(--surface);border:1px solid color-mix(in srgb, var(--border) 72%, transparent);z-index:50;border-radius:.6rem;min-width:10rem;padding:.35rem;position:absolute;top:calc(100% + .5rem);right:0;box-shadow:0 10px 24px #00000073}.menu-item{text-align:left;width:100%;color:var(--fg);font:inherit;cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:.4rem;padding:.55rem .75rem;font-size:.85rem}.menu-item:hover:not(:disabled){background:var(--accent-soft)}.menu-item:disabled{opacity:.6;cursor:not-allowed}.menu-backdrop{z-index:40;position:fixed;inset:0}.app-header-simple{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex;position:relative}.app-header-title{min-width:0}.app-header-eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--muted);margin:0;font-size:.68rem}.app-header-simple h1{margin:0;font-size:clamp(1.5rem,4vw,2rem);line-height:1.1}.menu-toggle{justify-content:center;align-items:center;min-width:2.35rem;padding:.4rem;display:inline-flex}@media (width<=768px) and (width>=601px){.header-actions-inline{display:none}.header-actions-menu{display:block}}@media (width<=600px){.header-actions{justify-content:flex-start;width:100%}.header-actions-inline{flex-wrap:wrap;display:flex}.header-actions-menu{display:none}}@media (width<=700px){.youtube-video-row{flex-direction:column}.youtube-video-thumb-wrap{flex-basis:auto;width:100%;max-width:none}}.youtube-nav{border-bottom:1px solid color-mix(in srgb, var(--border) 50%, transparent);gap:1.25rem;margin-bottom:1rem;padding-bottom:.75rem;display:flex}.nav-link{color:var(--muted);border-bottom:2px solid #0000;padding:.35rem 0;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .2s,border-color .2s}.nav-link:hover{color:var(--fg)}.nav-link.active{color:var(--fg);border-bottom-color:var(--accent)}.nav-tabs{border-bottom:1px solid color-mix(in srgb, var(--border) 50%, transparent);gap:1.25rem;margin-bottom:1rem;padding-bottom:.75rem;display:flex}.nav-tab{color:var(--muted);border-bottom:2px solid #0000;padding:.35rem 0;font-size:.9rem;font-weight:500;text-decoration:none;transition:color .2s,border-color .2s}.nav-tab:hover{color:var(--fg)}.nav-tab.active{color:var(--fg);border-bottom-color:var(--accent)}.recording-button-wrap{align-items:center;gap:.35rem;display:inline-flex;position:relative}.recording-button{appearance:none;border:1px solid var(--border-soft);color:var(--danger);font:inherit;cursor:pointer;background:0 0;border-radius:.6rem;justify-content:center;align-items:center;gap:.35rem;min-height:2rem;padding:.4rem .7rem;font-size:.85rem;font-weight:600;line-height:1;transition:border-color .15s,background-color .15s,color .15s;display:inline-flex}.recording-button:hover:not(:disabled){background:color-mix(in srgb, var(--danger) 10%, transparent);border-color:color-mix(in srgb, var(--danger) 50%, var(--border))}.recording-button:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent);outline:none}.recording-button:disabled,.recording-button.loading{opacity:.6;cursor:not-allowed}.recording-button.recording{color:#fff}.recording-button.recording.active-manual{background:color-mix(in srgb, var(--danger) 74%, #1e2030);border-color:color-mix(in srgb, var(--danger) 75%, #fff)}.recording-button.recording.active-auto{background:#bc8d53;border-color:#f6c585}.recording-button.recording.active-auto:hover:not(:disabled){background:#cd9957}.recording-button.recording.active-manual:hover:not(:disabled){background:color-mix(in srgb, var(--danger) 82%, #1e2030)}.recording-pulse{width:7px;height:7px;color:var(--danger);background:currentColor;border-radius:50%;animation:1.5s ease-in-out infinite pulse;display:inline-block}.recording-button.recording.active-auto~.recording-pulse{color:var(--warn)}.recording-error{white-space:nowrap;color:var(--danger);background:color-mix(in srgb, var(--danger) 10%, var(--bg));border:1px solid color-mix(in srgb, var(--danger) 30%, transparent);z-index:10;border-radius:.4rem;padding:.3rem .5rem;font-size:.78rem;position:absolute;top:calc(100% + .35rem);right:0}@media (width<=700px){.stream-info-bar{gap:.55rem;padding:.55rem .65rem}.stream-info-actions{order:3;justify-content:flex-end;width:100%}.stream-info-details{order:3;width:100%}.recording-error{white-space:normal;width:100%;position:static}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.watch-page{flex-direction:column;height:100dvh;min-height:100dvh;display:flex;overflow:hidden}.watch-page-header{border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .75rem;transition:opacity .15s;display:flex}.watch-page-meta{flex:auto;align-items:center;gap:.6rem;min-width:0;display:flex}.watch-page-avatar{border-radius:50%;flex:0 0 32px;width:32px;height:32px}.watch-page-meta-text{flex-direction:column;flex:auto;gap:.08rem;min-width:0;display:flex}.watch-page-name-row,.watch-page-detail-row{align-items:center;gap:.45rem;min-width:0;display:flex}.watch-page-detail-row{color:var(--muted);font-size:.78rem}.watch-page-name{color:var(--fg);white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:700;overflow:hidden}.watch-page-login{color:var(--muted);text-transform:lowercase;white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;overflow:hidden}.watch-page-live-badge{letter-spacing:.04em;flex-shrink:0;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;line-height:1;display:inline-flex}.watch-page-live-badge.live{color:var(--success)}.watch-page-live-badge.offline{color:var(--danger)}.watch-page-live-dot{background:currentColor;border-radius:50%;width:6px;height:6px;animation:1.5s ease-in-out infinite pulse;display:inline-block}.watch-page-live-badge.offline .watch-page-live-dot{animation:none}.watch-page-viewers{color:var(--muted);flex-shrink:0;align-items:center;gap:.25rem;font-size:.75rem;display:inline-flex}.watch-page-title-text,.watch-page-game{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.watch-page-game:before{content:"•";margin-right:.45rem}.watch-page-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:inline-flex}.watch-loading-state{flex:1;place-items:center;padding:1.2rem;display:grid}.watch-layout{--watch-chat-width:clamp(280px, 19vw, 380px);--watch-layout-gap:clamp(8px, 1.2vw, 16px);--watch-layout-padding:clamp(8px, 1.2vw, 16px);grid-template-columns:minmax(0, 1fr) var(--watch-chat-width);justify-content:stretch;align-items:stretch;gap:var(--watch-layout-gap);min-height:0;padding:var(--watch-layout-padding);flex:1;display:grid;position:relative}.watch-player-panel{flex-direction:column;min-width:0;min-height:0;display:flex}.watch-chat-panel{border:1px solid var(--border);background:var(--bg-soft);flex-direction:column;width:100%;min-width:0;height:100%;min-height:0;display:flex;position:relative}.watch-layout.chat-only{grid-template-columns:minmax(0,1fr)}.watch-player-panel.player-hidden{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden;transform:translate(-1.5rem)scale(.985)}.watch-player-panel.player-entering,.watch-player-panel.player-leaving{z-index:1;top:var(--watch-layout-padding);left:var(--watch-layout-padding);width:calc(100% - var(--watch-chat-width) - var(--watch-layout-gap) - var(--watch-layout-padding) - var(--watch-layout-padding));height:calc(100% - var(--watch-layout-padding) - var(--watch-layout-padding));pointer-events:none;will-change:opacity, transform;transition:opacity .18s,transform .18s;position:absolute;overflow:hidden}.watch-player-panel.player-entering{opacity:0;transform:translate(-1.5rem)scale(.985)}.watch-player-panel.player-leaving{opacity:1;transform:translate(0)scale(1)}.watch-layout.chat-only .watch-chat-panel{grid-column:1}@media (width<=900px){.watch-page{height:auto;overflow:visible}.watch-layout{flex-direction:column;display:flex}.watch-chat-panel{width:100%;min-width:0;height:38vh}.watch-layout.chat-only .watch-chat-panel{flex:1;height:100%}.watch-player-panel.player-entering,.watch-player-panel.player-leaving{width:calc(100% - var(--watch-layout-padding) - var(--watch-layout-padding));aspect-ratio:16/9;height:auto}}body[data-theater=true] .watch-page{box-shadow:none;border:0;padding:0}body[data-theater=true] .watch-page-header{display:none}body[data-theater=true] .watch-layout{--watch-layout-gap:0px;--watch-layout-padding:0px;grid-template-columns:minmax(0, 1fr) var(--watch-chat-width);background:#000;border:0;border-radius:0;gap:0;width:100vw;max-width:none;height:100dvh;padding:0;position:fixed;inset:0}body[data-theater=true] .watch-layout.chat-collapsed{grid-template-columns:minmax(0,1fr) 0}body[data-theater=true] .watch-layout.chat-only{grid-template-columns:minmax(0,1fr)}body[data-theater=true] .watch-player-panel,body[data-theater=true] .video-shell{border:0;border-radius:0}body[data-theater=true] .watch-chat-panel{border-top:0;border-bottom:0;border-right:0;border-left:1px solid color-mix(in srgb, var(--border) 70%, transparent);background:var(--bg-soft);border-radius:0}.watch-layout.theater{transition:grid-template-columns .17s}@media (width<=900px){body[data-theater=true] .watch-layout{flex-direction:column;height:auto;min-height:100dvh;display:flex;position:static}body[data-theater=true] .watch-chat-panel{border-left:0;border-top:1px solid color-mix(in srgb, var(--border) 70%, transparent);height:38vh}body[data-theater=true] .watch-layout.chat-only .watch-chat-panel{height:100%}}@media (prefers-reduced-motion:reduce){.watch-page-header,body[data-theater=true] .watch-layout,.watch-player-panel.player-entering,.watch-player-panel.player-leaving{transition:none!important}}.watch-layout{transition:grid-template-columns .17s}.watch-layout.chat-collapsed{grid-template-columns:minmax(0,1fr) 0}.watch-chat-panel{transition:opacity .12s,transform .17s;overflow:hidden}.watch-chat-panel.collapsed{opacity:0;pointer-events:none;transform:translate(12px)}.chat-panel.collapsed{opacity:0;transition:opacity .12s,transform .17s;transform:translate(12px)}.chat-header-toggle{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:30px;min-height:30px;padding:0;transition:color .15s,background .15s;display:flex}.chat-header-toggle:hover{color:var(--text);background:var(--surface-2)}.chat-header-toggle:focus-visible{box-shadow:0 0 0 3px var(--focus-ring);outline:none}@media (prefers-reduced-motion:reduce){.watch-layout,.watch-chat-panel,.chat-panel{transition:none!important}}.video-shell{border:1px solid var(--border);background:#000;flex:1;width:100%;min-height:0;position:relative}.video{object-fit:contain;width:100%;height:100%;display:block}.overlay-controls{z-index:10;opacity:0;pointer-events:none;background:linear-gradient(#1e2030eb,#0000);justify-content:flex-end;align-items:center;gap:8px;padding:8px 10px 20px;transition:opacity .3s;display:flex;position:absolute;top:0;left:0;right:0}.video-shell:hover .overlay-controls,.overlay-controls:focus-within{opacity:1;pointer-events:auto}@media (hover:none){.overlay-controls{opacity:1;pointer-events:auto}}.overlay-left,.overlay-right{align-items:center;gap:8px;display:flex;position:relative}.overlay-btn{background:color-mix(in srgb, var(--surface) 45%, transparent);border:1px solid color-mix(in srgb, var(--border) 70%, transparent);color:var(--fg);cursor:pointer;box-sizing:border-box;border-radius:4px;justify-content:center;align-items:center;min-width:30px;min-height:30px;padding:6px 10px;font-size:12px;font-weight:600;line-height:1;transition:background .15s,border-color .15s;display:inline-flex}.overlay-btn:hover{background:var(--surface);border-color:var(--accent)}.overlay-btn:disabled{opacity:.65;cursor:not-allowed}.overlay-btn.theater-btn,.overlay-btn.pip-btn,.overlay-btn.fullscreen-btn,.overlay-btn.chat-expand-btn{width:30px;padding:0}.go-live-btn{background:#ff757f3d;border-color:#ff757f8f}.go-live-btn.live{color:#fff;background:#eb040066;border-color:#eb0400bd}.quality-menu{border:1px solid color-mix(in srgb, var(--border) 75%, transparent);z-index:20;background:#222436f5;border-radius:6px;min-width:140px;margin-top:4px;padding:6px 0;display:none;position:absolute;top:100%;right:0;box-shadow:0 4px 12px #00000080}.quality-menu.open{display:block}.quality-item{cursor:pointer;width:100%;color:var(--fg);text-align:left;background:0 0;border:0;justify-content:space-between;padding:8px 14px;font-size:13px;display:flex}.quality-item:hover{background:color-mix(in srgb, var(--surface) 75%, transparent)}.quality-item.active{color:var(--accent-2);font-weight:600}.chat-header{border-bottom:1px solid var(--border);color:var(--muted);justify-content:space-between;align-items:center;gap:.55rem;padding:.65rem .75rem;font-size:.82rem;display:flex}.chat-header-title{align-items:baseline;gap:.55rem;min-width:0;display:flex}.chat-header strong{color:var(--fg);font-size:.85rem}.chat-header-actions{flex-shrink:0;align-items:center;gap:.25rem;display:inline-flex}.chat-header-action-btn{color:var(--muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:.4rem;justify-content:center;align-items:center;min-width:28px;min-height:28px;padding:.3rem;transition:color .15s,background-color .15s,border-color .15s;display:inline-flex}.chat-header-action-btn:hover{color:var(--fg);background:var(--surface-2);border-color:var(--border)}.chat-header-action-btn.active{color:var(--accent);background:var(--accent-soft);border-color:var(--accent-border)}.chat-header-action-btn:focus-visible{box-shadow:0 0 0 3px var(--focus-ring);outline:none}.chat-header-toggle{border:1px solid #0000}.chat-header-toggle:hover{border-color:var(--border)}.status-live{color:var(--success)}.chat-offline{gap:.75rem;padding:.85rem;display:grid}.chat-messages{flex-direction:column;flex:1;gap:.4rem;padding:.65rem .75rem;display:flex;overflow-y:auto}.chat-empty{color:var(--muted);margin:0;font-size:.85rem}.chat-message{word-break:break-word;border-radius:.4rem;align-items:flex-start;gap:.35rem;padding:.35rem .55rem;font-size:.9rem;line-height:1.35;transition:background-color .15s;display:flex;position:relative}.chat-message:nth-child(2n){background:color-mix(in srgb, var(--bg) 50%, transparent)}.chat-message:hover{background:color-mix(in srgb, var(--surface) 55%, transparent)}.chat-timestamp{color:var(--muted);font-variant-numeric:tabular-nums;opacity:.8;flex:none;width:2.4rem;padding-top:.12rem;font-size:.78rem}.chat-message .sender{color:var(--accent);flex:none;margin-right:.35rem;font-weight:600}.chat-message.notice .sender{color:var(--warn)}.chat-message .content{flex:auto;min-width:0}.chat-message .content .emote{vertical-align:middle;width:auto;height:1.6em;margin:0 .05em}.chat-mention{background:var(--accent-soft);color:var(--accent);border-radius:.25rem;padding:.05rem .18rem;font-weight:500}.chat-message-actions{opacity:0;pointer-events:none;background:color-mix(in srgb, var(--bg-soft) 92%, transparent);border:1px solid var(--border);z-index:5;border-radius:.4rem;align-items:center;gap:.2rem;padding:.1rem;transition:opacity .15s;display:inline-flex;position:absolute;top:.25rem;right:.35rem;box-shadow:0 4px 10px #00000040}@media (hover:hover){.chat-message:hover .chat-message-actions{opacity:1;pointer-events:auto}}.chat-message-action-btn{color:var(--muted);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:.3rem;justify-content:center;align-items:center;min-width:22px;min-height:22px;padding:.25rem;transition:color .15s,background-color .15s,border-color .15s;display:inline-flex}.chat-message-action-btn:hover{color:var(--fg);background:var(--surface-2);border-color:var(--border)}.chat-message-action-btn:focus-visible{box-shadow:0 0 0 2px var(--focus-ring);outline:none}.unread-pill{border:1px solid color-mix(in srgb, var(--border) 72%, transparent);color:var(--fg);cursor:pointer;z-index:30;background:#2f334df5;border:none;border-radius:999px;padding:.34rem .78rem;font-size:.95rem;font-weight:500;line-height:1;position:absolute;bottom:3.6rem;left:50%;transform:translate(-50%);box-shadow:0 10px 20px #00000057}.unread-pill:hover{border-color:color-mix(in srgb, var(--accent) 55%, var(--border));background:#3b4261fa}.chat-form{border-top:1px solid var(--border);align-items:flex-end;gap:.45rem;padding:.65rem;display:flex;position:relative}.emote-toggle{box-sizing:border-box;border:1px solid var(--border);background:var(--surface);width:2.2rem;min-width:2.2rem;height:2.2rem;color:var(--fg);cursor:pointer;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.emote-toggle:hover{border-color:var(--accent);background:var(--surface-2)}.emote-popup{background:var(--bg-soft);border:1px solid var(--border);z-index:40;border-radius:8px;flex-direction:column;max-height:min(52vh,420px);display:flex;position:absolute;bottom:calc(100% + .5rem);left:.65rem;right:.65rem;overflow:visible;box-shadow:0 10px 24px #00000073}.emote-search{border:1px solid var(--border);background:var(--bg);color:var(--fg);border-radius:6px;margin:.6rem;padding:.45rem .55rem;font-size:.9rem}.emote-search:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--ring);outline:none}.emote-groups{padding:0 .6rem .6rem;overflow-y:auto}.emote-group-title{color:var(--muted);letter-spacing:.02em;margin:.5rem 0 .38rem;font-size:.8rem;font-weight:700}.emote-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:.35rem;display:grid}.emote-item{color:var(--fg);cursor:pointer;background:0 0;border:0;border-radius:6px;justify-content:center;align-items:center;height:44px;min-height:44px;display:flex}.emote-item:hover{background:color-mix(in srgb, var(--surface-2) 62%, transparent)}.emote-item img{z-index:1;max-width:30px;max-height:30px;transition:transform .18s,filter .18s;position:relative}.emote-item:hover img{z-index:80;filter:drop-shadow(0 8px 14px #0000008c);transition-delay:.35s;transform:scale(3.5)}.emote-empty{color:var(--muted);text-align:center;padding:.75rem .2rem;font-size:.85rem}.channel-card{border:1px solid color-mix(in srgb, var(--border) 58%, transparent);background:color-mix(in srgb, var(--bg-soft) 62%, #0a101b);border-radius:.75rem;grid-template-columns:74px minmax(0,1fr);align-items:stretch;gap:.75rem;height:5.5rem;padding:.8rem;transition:border-color .2s,transform .15s;display:grid}.channel-card:hover{transform:translateY(-1px)}.channel-card.live{border-left:3px solid var(--success)}.channel-avatar-wrap{align-items:center;height:100%;min-height:74px;display:flex;position:relative}.channel-avatar{background:color-mix(in srgb, var(--surface-2) 70%, transparent);border-radius:50%;width:74px;height:74px}.avatar-status-dot{background:var(--success);border:2px solid var(--bg-soft);border-radius:50%;width:14px;height:14px;animation:1.5s ease-in-out infinite pulse;position:absolute;bottom:4px;right:4px}.channel-content{flex-direction:column;justify-content:space-between;min-width:0;min-height:74px;display:flex;overflow:hidden}.channel-content-header{justify-content:space-between;align-items:flex-start;gap:.5rem;min-width:0;display:flex}.channel-name-area{flex-direction:column;flex:1;min-width:0;display:flex}.channel-name{text-transform:lowercase;color:var(--fg);white-space:nowrap;text-overflow:ellipsis;text-align:left;cursor:pointer;background:0 0;border:0;margin:0;padding:0;font-size:.9rem;font-weight:600;overflow:hidden}.channel-name:hover{text-decoration:underline}.channel-meta{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;margin:.2rem 0 0;font-size:.74rem}.channel-content-body{min-height:2.15rem}.channel-title{width:100%;color:color-mix(in srgb, var(--fg) 85%, var(--muted));white-space:nowrap;text-overflow:ellipsis;max-width:100%;margin:.2rem 0 0;font-size:.82rem;display:block;overflow:hidden}.channel-subtitle{color:var(--muted);margin:.15rem 0 0;font-size:.87rem}.channel-controls{--ctrl-h:2.35rem;--ctrl-r:.5rem;--ctrl-gap:.35rem;--ctrl-border:#a0b5d852;--ctrl-bg:#0e1624eb;--ctrl-fg:var(--fg);flex-shrink:0;align-items:center;gap:.35rem;display:inline-flex}.icon-btn{width:var(--ctrl-h);height:var(--ctrl-h);border:1px solid var(--ctrl-border);border-radius:var(--ctrl-r);background:var(--ctrl-bg);color:var(--ctrl-fg);cursor:pointer;justify-content:center;align-items:center;padding:0;font-size:.9rem;line-height:1;transition:border-color .15s,background-color .15s,width .2s,opacity .2s,margin .2s;display:inline-flex}.icon-btn:hover{border-color:var(--accent-border);background:color-mix(in srgb, var(--ctrl-bg) 82%, #101b30)}.icon-btn:focus-visible{box-shadow:0 0 0 3px var(--focus-ring);outline:none}.play-btn{background:var(--accent);color:#1e2030;border-color:#0000}.play-btn:hover:not(:disabled){background:color-mix(in srgb, var(--accent) 85%, white)}.play-btn:disabled{opacity:.6;cursor:not-allowed}.play-btn.watching .spinning,.spinning{animation:.8s linear infinite spin}.clock-btn.enabled{background:color-mix(in srgb, var(--accent) 46%, var(--ctrl-bg));border-color:color-mix(in srgb, var(--accent) 68%, white);color:#eaf2ff}.record-btn{color:color-mix(in srgb, var(--danger) 65%, var(--muted));background:color-mix(in srgb, var(--danger) 8%, var(--ctrl-bg));border-color:color-mix(in srgb, var(--danger) 25%, var(--ctrl-border))}.record-btn.active-auto{color:#fff;background:#bc8d53;border-color:#f6c585}.record-btn.active-manual{background:color-mix(in srgb, var(--danger) 74%, #1e2030);border-color:color-mix(in srgb, var(--danger) 75%, #fff);color:#fff}.record-btn.active-manual:hover,.record-btn.active-auto:hover{background:inherit;border-color:inherit}.play-btn:hover{border-color:#0000}.remove-btn{opacity:0;width:0;margin-left:0;margin-right:calc(-1 * var(--ctrl-gap));pointer-events:none;border-width:0;border-color:color-mix(in srgb, var(--border) 60%, transparent);color:var(--muted);overflow:hidden}.channel-card:hover .remove-btn,.channel-controls:focus-within .remove-btn,.remove-btn:focus-visible{width:var(--ctrl-h);opacity:1;pointer-events:auto;border-width:1px;margin-left:0;margin-right:0;overflow:visible}.remove-btn:hover{border-color:color-mix(in srgb, var(--danger) 60%, transparent);color:var(--danger);background:color-mix(in srgb, var(--danger) 10%, var(--ctrl-bg))}.channels-header{justify-content:space-between;align-items:center;gap:.6rem;margin-bottom:.75rem;display:flex}.channels-actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:inline-flex}.channels-title-row{align-items:center;gap:.75rem;display:flex}.channels-label{color:var(--fg);font-weight:600}.live-only-switch{color:var(--muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.45rem;font-size:.82rem;line-height:1;display:inline-flex}.switch-text{color:var(--muted);letter-spacing:.01em}.switch-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.switch-track{border:1px solid color-mix(in srgb, var(--border) 75%, transparent);background:#95aace4d;border-radius:999px;align-items:center;width:2.6rem;height:1.45rem;padding:.11rem;transition:background-color .18s,border-color .18s,box-shadow .18s;display:inline-flex}.switch-knob{background:var(--fg);border-radius:50%;width:1.12rem;height:1.12rem;transition:transform .18s;transform:translate(0);box-shadow:0 1px 5px #00000047}.switch-input:checked+.switch-track{background:color-mix(in srgb, var(--accent) 80%, var(--accent-2));border-color:color-mix(in srgb, var(--accent) 68%, white)}.switch-input:checked+.switch-track .switch-knob{transform:translate(1.12rem)}.switch-input:focus-visible+.switch-track{box-shadow:0 0 0 3px var(--focus-ring)}.switch-input:disabled+.switch-track{opacity:.6;cursor:not-allowed}.live-status-warning{color:var(--warn);margin:0 0 .65rem;font-size:.8rem}.add-btn{border:1px dashed color-mix(in srgb, var(--border) 78%, transparent);color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:.6rem;justify-content:center;align-items:center;min-height:2rem;padding:.4rem .8rem;font-size:.85rem;font-weight:600;line-height:1;display:inline-flex}.add-btn:hover{border-color:var(--accent-border);background:var(--accent-soft);color:var(--fg)}.channels{gap:.75rem;display:grid}.add-form{gap:.75rem;margin-bottom:.75rem;display:grid}.app-version{text-align:center;color:var(--muted);margin-top:auto;padding:1rem;font-size:.8rem}.header-subtle{color:var(--muted);margin:.35rem 0 0;font-size:.86rem}.login-form{gap:.75rem;display:grid}.login-form label{color:var(--fg);font-weight:600}.login-form button[type=submit]{background:var(--accent);color:#1e2030;font:inherit;cursor:pointer;border:0;border-radius:.6rem;padding:.62rem .95rem;font-weight:600}.login-form button[type=submit]:disabled{opacity:.6;cursor:not-allowed}.login-form button{background:var(--accent);color:#1e2030;font:inherit;cursor:pointer;border:0;border-radius:.6rem;padding:.62rem .95rem;font-weight:600}.login-form button:disabled{opacity:.6;cursor:not-allowed}.qr-login{place-items:center;gap:.75rem;display:grid}.qr-code{background:var(--surface);border-radius:.75rem;width:200px;height:200px;padding:.5rem}.qr-placeholder{background:var(--surface);width:200px;height:200px;color:var(--muted);border-radius:.75rem;place-items:center;font-size:.9rem;display:grid}.qr-instructions{text-align:center;color:var(--fg);margin:0;font-size:.95rem}.qr-expires{color:var(--muted);font-size:.8rem}.qr-login button{background:var(--accent);color:#1e2030;font:inherit;cursor:pointer;border:0;border-radius:.6rem;padding:.62rem .95rem;font-weight:600}.qr-login button:hover{background:var(--accent-hover)}.qr-login button:disabled{opacity:.6;cursor:not-allowed}.recordings-view{gap:.85rem;display:grid}.recordings-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.65rem;display:flex}.recordings-subtle{color:var(--muted);margin:.3rem 0 0;font-size:.84rem}.recordings-grid{gap:.75rem;display:grid}.recordings-section{border:1px solid color-mix(in srgb, var(--border) 58%, transparent);background:color-mix(in srgb, var(--bg-soft) 62%, #0a101b);border-radius:.75rem;padding:.8rem}.recordings-section h2{margin:0 0 .55rem;font-size:.95rem;font-weight:700}.incomplete-section-header{justify-content:space-between;align-items:center;margin-bottom:.55rem;display:flex}.merge-btn{border:1px solid color-mix(in srgb, var(--border) 72%, transparent);background:color-mix(in srgb, var(--bg-soft) 70%, #0e1624);height:1.8rem;color:var(--fg);cursor:pointer;border-radius:.55rem;align-items:center;gap:.4rem;padding:0 .62rem;font-size:.78rem;font-weight:600;display:inline-flex}.merge-btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--accent) 68%, white);background:color-mix(in srgb, var(--accent) 34%, #1b2436)}.merge-btn:disabled{opacity:.55;cursor:not-allowed}.merge-btn-spinner{border:2px solid #fff3;border-top-color:#fffc;border-radius:50%;width:.8rem;height:.8rem;animation:.8s linear infinite spin}.section-empty{margin:.5rem 0;padding:.5rem 0}.recordings-list{gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.recordings-filter-row{gap:.35rem;margin-top:-.1rem;display:grid}.recordings-filter-label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:.8rem}.select-wrapper{width:min(22rem,100%);position:relative}.select-chevron{color:var(--muted);pointer-events:none;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.recordings-filter-select{border:1px solid color-mix(in srgb, var(--border) 65%, transparent);background:color-mix(in srgb, var(--bg-soft) 70%, var(--surface));width:100%;color:var(--fg);font:inherit;appearance:none;cursor:pointer;border-radius:.6rem;padding:.6rem 2.5rem .6rem .7rem;transition:border-color .15s,background-color .15s}.recordings-filter-select:hover{border-color:var(--accent-border)}.recordings-filter-select:focus{border-color:var(--accent-border);box-shadow:0 0 0 2px var(--focus-ring);outline:none}.recordings-filter-select:disabled{opacity:.55;cursor:not-allowed}.recordings-filter-hint{color:var(--muted);margin:0;font-size:.78rem}.recording-badges{flex-wrap:wrap;gap:.35rem;display:flex}.badge{text-transform:uppercase;letter-spacing:.02em;white-space:nowrap;border-radius:.25rem;align-items:center;padding:.15rem .45rem;font-size:.7rem;font-weight:600;line-height:1.2;display:inline-flex}.badge-processing{background:color-mix(in srgb, var(--warn) 20%, transparent);color:var(--warn);border:1px solid color-mix(in srgb, var(--warn) 40%, transparent)}.badge-pinned{background:color-mix(in srgb, var(--accent) 20%, transparent);color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 40%, transparent)}.badge-repair{background:color-mix(in srgb, var(--danger) 15%, transparent);color:var(--danger);border:1px solid color-mix(in srgb, var(--danger) 40%, transparent)}.recording-item-actions{align-items:center;gap:.35rem;margin-top:.1rem;display:inline-flex}.recording-pin-btn,.recording-play-btn,.recording-delete-btn{border:1px solid color-mix(in srgb, var(--border) 72%, transparent);background:color-mix(in srgb, var(--bg-soft) 70%, #0e1624);width:2rem;height:2rem;color:var(--muted);cursor:pointer;border-radius:.55rem;justify-content:center;align-items:center;padding:0;transition:border-color .15s,background-color .15s,color .15s;display:inline-flex}.recording-pin-btn:hover:not(:disabled),.recording-play-btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--accent) 68%, white);background:color-mix(in srgb, var(--accent) 34%, #1b2436);color:var(--fg)}.recording-delete-btn:hover:not(:disabled){border-color:color-mix(in srgb, var(--danger) 68%, white);color:var(--danger);background:#230e16e6}.recording-pin-btn:disabled,.recording-play-btn:disabled,.recording-delete-btn:disabled{opacity:.55;cursor:not-allowed}.recording-pin-btn.pinned{color:var(--accent)}.delete-spinner,.repair-spinner{border:2px solid #fff3;border-top:2px solid var(--fg);border-radius:50%;width:.9rem;height:.9rem;animation:.8s linear infinite spin}.recordings-item-with-action{grid-template-columns:minmax(0,1fr) auto;align-items:flex-start;gap:.5rem;display:grid}.recording-entry,.recording-entry-incomplete{gap:.2rem;min-width:0;display:grid}.recording-title-row{flex-wrap:wrap;align-items:center;gap:.5rem;min-width:0;display:flex}.recording-title-row .entry-main{flex:1;min-width:0}.entry-main{color:var(--fg);white-space:nowrap;text-overflow:ellipsis;font-size:.88rem;display:block;overflow:hidden}.entry-meta{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;display:block;overflow:hidden}.active-recordings-section .recordings-section{border:1px solid color-mix(in srgb, var(--border) 58%, transparent);background:color-mix(in srgb, var(--bg-soft) 62%, #0a101b);border-radius:.75rem;padding:.8rem}.twitch-app{box-sizing:border-box;background:radial-gradient(circle at 20% -10%, color-mix(in srgb, var(--surface-2) 88%, black) 0%, var(--bg-soft) 45%, var(--bg) 100%);min-height:100dvh;color:var(--fg);flex-direction:column;display:flex}.twitch-main{flex-direction:column;flex:1;align-items:center;padding:1rem;display:flex}.twitch-main:focus{outline:none}.twitch-panel{background:linear-gradient(160deg, color-mix(in srgb, var(--surface) 95%, transparent), color-mix(in srgb, var(--bg-soft) 95%, transparent));border:1px solid color-mix(in srgb, var(--border) 65%, transparent);border-radius:1rem;width:min(46rem,100%);padding:1.2rem;box-shadow:0 1rem 2.5rem #03081073}.youtube-app{box-sizing:border-box;background:radial-gradient(circle at 20% -10%, color-mix(in srgb, var(--surface-2) 88%, black) 0%, var(--bg-soft) 45%, var(--bg) 100%);min-height:100dvh;color:var(--fg);flex-direction:column;display:flex}.youtube-main{flex-direction:column;flex:1;align-items:center;padding:1rem;display:flex}.youtube-main:focus{outline:none}.youtube-panel{background:linear-gradient(160deg, color-mix(in srgb, var(--surface) 95%, transparent), color-mix(in srgb, var(--bg-soft) 95%, transparent));border:1px solid color-mix(in srgb, var(--border) 65%, transparent);border-radius:1rem;width:min(46rem,100%);padding:1.2rem;box-shadow:0 1rem 2.5rem #03081073}.youtube-video-row{border:1px solid color-mix(in srgb, var(--border) 75%, transparent);background:color-mix(in srgb, var(--bg-soft) 62%, var(--surface));text-align:left;width:100%;color:inherit;cursor:pointer;border-radius:.75rem;align-items:stretch;gap:1rem;padding:1rem;transition:border-color .2s,background-color .2s;display:flex}.youtube-video-row:hover,.youtube-video-row:focus-visible{border-color:var(--accent-border);background:var(--accent-soft);outline:none}.youtube-video-title{color:var(--fg);margin:0;font-size:1rem;font-weight:600;line-height:1.3}.youtube-video-meta{color:var(--muted);margin-top:.32rem;font-size:.8rem}.youtube-video-description{color:color-mix(in srgb, var(--fg) 80%, var(--muted));opacity:.85;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:.5rem 0 0;font-size:.85rem;line-height:1.4;display:-webkit-box;overflow:hidden}.youtube-video-thumb-wrap{flex:0 0 240px;max-width:240px;position:relative}.youtube-video-info{flex:1;min-width:0}.youtube-video-thumb{aspect-ratio:16/9;object-fit:cover;background:var(--surface-2);border-radius:.56rem;width:100%;height:auto;display:block}.youtube-video-duration{color:#fff;background:#000000bf;border-radius:.25rem;padding:.15rem .35rem;font-size:.8rem;position:absolute;bottom:.4rem;right:.4rem}.youtube-channel-page{width:min(46rem,100%)}.youtube-channel-page .panel-header{border-bottom:none;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;padding:0;display:flex}.youtube-channel-page .panel-title{min-width:0}.youtube-channel-page .panel-title>.ui-nav-chip{margin-bottom:.5rem}.youtube-channel-page .ui-page-title{font-size:clamp(1.5rem,4vw,2rem)}.youtube-watch-page .player-header{opacity:1;pointer-events:auto;background:0 0;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.75rem;padding:0;transition:none;display:flex;position:static}.youtube-watch-page .player-header .ui-nav-chip{margin-bottom:.5rem}.youtube-watch-page h1{margin:.2rem 0 0;font-size:clamp(1.2rem,3vw,1.8rem);line-height:1.3}.youtube-watch-page .subtle{color:var(--muted);overflow-wrap:anywhere;margin:.35rem 0 0;font-size:.84rem}.youtube-watch-page .player-wrapper{aspect-ratio:16/9;border:1px solid color-mix(in srgb, var(--border) 72%, transparent);flex:initial;background:#000;width:100%;min-height:16rem;max-height:min(74vh,52rem);overflow:hidden}.youtube-watch-page .player{border:none;width:100%;height:100%;display:block}.youtube-watch-page .error-box{background:#000;border:none;border-radius:0;place-items:center;width:100%;height:100%;margin:0;padding:1rem;display:grid}.youtube-watch-page .loading-box{background:color-mix(in srgb, var(--bg-soft) 50%, #000);place-items:center;width:100%;height:100%;padding:1rem;display:grid}@media screen and (width>=100px) and (width<=1400px) and (height>=600px) and (height<=800px) and (orientation:landscape){.youtube-watch-page .player-wrapper{max-height:min(70vh,600px)}}.player-wrapper{border:1px solid var(--border);background:#000;flex:1;width:100%;min-height:0;position:relative}.player{object-fit:contain;width:100%;height:100%;display:block}.player-header{z-index:10;opacity:0;pointer-events:none;background:linear-gradient(#1e2030eb,#0000);justify-content:flex-end;align-items:center;gap:8px;padding:8px 10px 20px;transition:opacity .3s;display:flex;position:absolute;top:0;left:0;right:0}.player-wrapper:hover .player-header,.player-header:focus-within{opacity:1;pointer-events:auto}.quality-btn{background:color-mix(in srgb, var(--surface) 45%, transparent);border:1px solid color-mix(in srgb, var(--border) 70%, transparent);color:var(--fg);cursor:pointer;border-radius:4px;padding:6px 12px;font-size:12px;font-weight:600;line-height:1;transition:background .15s,border-color .15s}.quality-btn:hover{background:var(--surface);border-color:var(--accent)}.chat-panel{border:1px solid var(--border);background:var(--bg-soft);flex-direction:column;width:100%;min-width:0;height:100%;min-height:0;display:flex;position:relative}.panel-header{border-bottom:1px solid var(--border);color:var(--muted);justify-content:space-between;align-items:center;gap:.55rem;padding:.65rem .75rem;font-size:.82rem;display:flex}.panel-title{color:var(--fg);font-size:.85rem;font-weight:600}.muted{color:var(--muted);margin:0}.hint{color:var(--muted);margin:.25rem 0 0;font-size:.78rem}.loading{place-items:center;padding:2rem;display:grid}.loading-box{flex-direction:column;align-items:center;gap:.75rem;display:flex}.fallback{background:var(--surface);color:var(--muted);place-items:center;display:grid}.error-box{color:var(--danger);background:#ff52522e;border:1px solid #c3e88d73;border-radius:.6rem;margin:0 0 .9rem;padding:.65rem .72rem}.toggle-row{justify-content:space-between;align-items:center;gap:.75rem;padding:.5rem 0;display:flex}.playlist-thumbnail-container{flex:0 0 120px;max-width:120px;position:relative}.playlist-thumbnail{aspect-ratio:16/9;object-fit:cover;background:var(--surface-2);border-radius:.5rem;width:100%;height:auto;display:block}.playlist-thumbnail-fallback{aspect-ratio:16/9;background:var(--surface-2);width:100%;height:100%;color:var(--muted);border-radius:.5rem;place-items:center;font-size:.8rem;display:grid}.playlist-meta{color:var(--muted);margin-top:.25rem;font-size:.78rem}.recent-thumbnail-wrap{flex:0 0 200px;max-width:200px;position:relative}.recent-thumbnail{aspect-ratio:16/9;object-fit:cover;background:var(--surface-2);border-radius:.5rem;width:100%;height:auto;display:block}.recent-meta{color:var(--muted);margin-top:.32rem;font-size:.8rem}.recent-duration{color:#fff;background:#000000bf;border-radius:.25rem;padding:.15rem .35rem;font-size:.8rem;position:absolute;bottom:.4rem;right:.4rem}@media (width<=700px){.youtube-video-row{flex-direction:column}.youtube-video-thumb-wrap,.recent-thumbnail-wrap,.playlist-thumbnail-container{flex-basis:auto;width:100%;max-width:none}}@media (width<=600px){.channel-card{grid-template-columns:64px minmax(0,1fr);align-items:stretch}.channel-avatar-wrap{grid-row:span 2;min-height:96px}.channel-avatar{width:64px;height:64px}.channel-content{grid-column:2;min-height:0}.channel-content-header{flex-wrap:wrap}.channel-controls{--ctrl-h:2.15rem;--ctrl-r:.5rem;gap:.35rem}.channel-controls button:not(.remove-btn){flex:1}.remove-btn{width:var(--ctrl-h);opacity:1;pointer-events:auto;border-width:1px;margin-left:0;margin-right:0;overflow:visible}.channels-title-row{flex-wrap:wrap}.channels-header{flex-direction:column;align-items:flex-start}.channels-actions{justify-content:flex-start;width:100%}.recording-title-row{flex-direction:column;align-items:flex-start;gap:.35rem}.recordings-item-with-action{grid-template-columns:1fr;gap:.35rem}.recording-item-actions{justify-content:flex-start;margin-top:.35rem}.recording-badges{width:100%}.recordings-header{align-items:flex-start}}@media (hover:none){.remove-btn{width:var(--ctrl-h);opacity:1;pointer-events:auto;border-width:1px;margin-left:0;margin-right:0}.player-header{opacity:1;pointer-events:auto}}@media (prefers-reduced-motion:reduce){.avatar-status-dot,.spinning,.delete-spinner,.repair-spinner,.merge-btn-spinner{animation:none}}.channel-settings-page .ui-page-header .ui-nav-chip{border:1px solid color-mix(in srgb, var(--border) 78%, transparent);color:var(--fg);background:0 0;min-height:2rem;padding:.4rem .8rem;font-size:.85rem}.channel-settings-page .ui-page-header .ui-nav-chip:hover{border-color:var(--accent-border);background:var(--accent-soft)}.channel-settings-form{gap:.8rem;display:grid}.channel-settings-form label{gap:.35rem;font-weight:600;display:grid}.channel-settings-form .toggle-row{justify-content:flex-start;align-items:center;gap:.55rem;padding:0;font-weight:500;display:inline-flex}.channel-settings-form input,.channel-settings-form select{color:var(--fg);font:inherit;background:#080c13e6;border:1px solid #a0b5d859;border-radius:.6rem;padding:.68rem .76rem}.channel-settings-form .hint{color:var(--muted);margin:0;font-size:.84rem}.channel-quality-select-wrap{width:min(12rem,100%);position:relative}.channel-quality-select-wrap:after{content:"";border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);pointer-events:none;width:.42rem;height:.42rem;position:absolute;top:50%;right:.8rem;transform:translateY(-65%)rotate(45deg)}.channel-quality-select-wrap select{appearance:none;cursor:pointer;width:100%;padding-right:2.2rem}.channel-quality-select-wrap select:hover{border-color:var(--accent-border)}.channel-quality-select-wrap select:focus{border-color:var(--accent-border);box-shadow:0 0 0 2px var(--focus-ring);outline:none}@media (width<=640px){.channel-settings-page .ui-page-header{flex-direction:column;align-items:flex-start}.channel-settings-form .ui-action-row{justify-content:flex-start}}.youtube-channel-row{text-align:left;grid-template-columns:74px minmax(0,1fr);align-items:center;gap:.75rem;padding:.8rem;display:grid}.youtube-channel-row .ui-media-visual,.youtube-channel-row .ui-media-main{min-width:0}.youtube-channel-row .ui-avatar.channel-avatar{border-radius:50%;width:74px;height:74px;font-size:1.35rem;display:block}.youtube-channel-row .ui-avatar-fallback.channel-avatar{border-radius:50%;width:74px;height:74px;font-size:1.35rem}.youtube-channel-row .channel-description{line-clamp:3;-webkit-line-clamp:3;text-overflow:ellipsis;white-space:pre-line;-webkit-box-orient:vertical;line-height:1.4;display:-webkit-box;overflow:hidden}.youtube-recent-row{text-align:left;grid-template-columns:140px minmax(0,1fr);align-items:center;gap:.75rem;padding:.8rem;display:grid}.youtube-recent-row .ui-media-visual,.youtube-recent-row .ui-media-main{min-width:0}.youtube-playlist-row{text-align:left;grid-template-columns:140px minmax(0,1fr);align-items:center;gap:.75rem;padding:.8rem;display:grid}.youtube-playlist-row .ui-media-visual,.youtube-playlist-row .ui-media-main{min-width:0}.recent-thumbnail-wrap{flex:none;width:140px;height:78px;position:relative}.recent-thumbnail{object-fit:cover;background:var(--surface-2);border-radius:.5rem;width:140px;height:78px;display:block}.recent-duration{color:#fff;background:#000000c2;border-radius:.25rem;padding:.1rem .3rem;font-size:.74rem;line-height:1.1;position:absolute;bottom:.35rem;right:.35rem}.recent-meta{line-height:1.35}.playlist-thumbnail-container{width:140px;height:78px;position:relative}.playlist-thumbnail{object-fit:cover;background:var(--surface-2);border-radius:.5rem;width:140px;height:78px;display:block}.playlist-thumbnail-fallback{text-transform:uppercase;width:140px;height:78px;color:var(--fg);background:var(--surface-2);border-radius:.5rem;place-items:center;font-size:1.5rem;font-weight:700;display:none;position:absolute;top:0;left:0}.playlist-meta{line-height:1.35}.youtube-video-row:hover,.youtube-video-row:focus-visible{border-color:color-mix(in srgb, var(--accent-border) 60%, transparent);background:color-mix(in srgb, var(--accent-soft) 40%, transparent)}.youtube-video-row:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--focus-ring) 70%, transparent)}.youtube-video-list{flex-direction:column;gap:.75rem;display:flex}
