:root{--bg-0: #0f0f0f;--bg-1: #1a1a1a;--bg-2: #242424;--bg-3: #2e2e2e;--border-subtle: #333333;--border-muted: #404040;--border-focus: var(--accent-blue);--text-primary: #f0f0f0;--text-secondary: #a0a0a0;--text-muted: #5a5a5a;--accent-blue: #3b82f6;--accent-blue-dim: rgba(59, 130, 246, .12);--accent-blue-glow: rgba(59, 130, 246, .25);--accent-red: #e53e3e;--accent-red-dim: rgba(229, 62, 62, .12);--accent-red-glow: rgba(229, 62, 62, .2);--accent-green: #48bb78;--accent-green-dim: rgba(72, 187, 120, .12);--accent-amber: #f59e0b;--accent-amber-dim: rgba(245, 158, 11, .12);--header-height: 56px;--tabbar-height: 64px;--card-radius: 12px;--card-padding: 16px;--gap: 12px;--touch-min: 44px;--shadow-card: 0 1px 3px rgba(0, 0, 0, .5), 0 0 0 1px var(--border-subtle);--shadow-elevated: 0 4px 12px rgba(0, 0, 0, .5), 0 0 0 1px var(--border-muted);--t-fast: .12s ease;--t-medium: .22s ease;--t-spring: .3s cubic-bezier(.34, 1.56, .64, 1);--font-mono: "SF Mono", "Fira Code", "Consolas", monospace}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%}body{background:var(--bg-0);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:.9375rem;line-height:1.5;min-height:100dvh;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit}input[type=range]{cursor:pointer}.app-header{position:fixed;top:0;left:0;right:0;height:var(--header-height);background:#0f0f0feb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-subtle);display:flex;align-items:center;justify-content:space-between;padding:0 16px;z-index:100;padding-top:env(safe-area-inset-top)}.app-title{font-size:1rem;font-weight:600;letter-spacing:-.02em;color:var(--text-primary)}.header-right{display:flex;align-items:center;gap:8px}.header-status{display:flex;align-items:center;gap:6px}.status-text{font-size:.75rem;color:var(--text-secondary)}.app-main{padding-top:calc(var(--header-height) + env(safe-area-inset-top) + 12px);padding-bottom:calc(var(--tabbar-height) + env(safe-area-inset-bottom) + 12px);padding-left:12px;padding-right:12px;min-height:100dvh}.panel{width:100%}.card{background:var(--bg-1);border-radius:var(--card-radius);padding:var(--card-padding);box-shadow:var(--shadow-card);width:100%}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:8px}.card-title{font-size:.6875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);-webkit-user-select:none;user-select:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:var(--touch-min);padding:0 16px;border-radius:8px;border:1px solid transparent;font-size:.875rem;font-weight:500;cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),opacity var(--t-fast),box-shadow var(--t-fast);-webkit-user-select:none;user-select:none;white-space:nowrap}.btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--accent-blue);color:#fff;border-color:var(--accent-blue)}.btn-primary:hover:not(:disabled){background:#2563eb;border-color:#2563eb}.btn-primary:active:not(:disabled){background:#1d4ed8}.btn-danger{background:var(--accent-red);color:#fff;border-color:var(--accent-red)}.btn-danger:hover:not(:disabled){background:#c53030;border-color:#c53030}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--border-muted)}.btn-ghost:hover:not(:disabled){background:var(--bg-2);color:var(--text-primary);border-color:var(--border-muted)}.btn-icon{width:var(--touch-min);min-height:var(--touch-min);padding:0;border-radius:8px;background:transparent;color:var(--text-secondary);border-color:transparent}.btn-icon:hover:not(:disabled){background:var(--bg-2);color:var(--text-primary)}.btn-full{width:100%}.input{width:100%;min-height:var(--touch-min);padding:10px 12px;background:var(--bg-2);border:1px solid var(--border-subtle);border-radius:8px;color:var(--text-primary);font-size:.875rem;transition:border-color var(--t-fast),box-shadow var(--t-fast);-webkit-appearance:none;appearance:none;outline:none}.input:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--accent-blue-dim)}.input::placeholder{color:var(--text-muted)}select.input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235a5a5a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;cursor:pointer}.toggle{position:relative;display:inline-block;width:44px;height:26px;cursor:pointer;flex-shrink:0}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle-track{position:absolute;inset:0;background:var(--bg-3);border-radius:13px;border:1px solid var(--border-muted);transition:background var(--t-medium),border-color var(--t-medium)}.toggle-thumb{position:absolute;top:3px;left:3px;width:18px;height:18px;background:var(--text-secondary);border-radius:50%;transition:transform var(--t-spring),background var(--t-medium)}.toggle input:checked+.toggle-track{background:var(--accent-blue);border-color:var(--accent-blue)}.toggle input:checked+.toggle-track .toggle-thumb{transform:translate(18px);background:#fff}.toggle input:focus-visible+.toggle-track{box-shadow:0 0 0 3px var(--accent-blue-dim)}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--text-muted);flex-shrink:0;transition:background var(--t-medium),box-shadow var(--t-medium)}.status-dot.connecting{background:var(--accent-amber);box-shadow:0 0 0 2px var(--accent-amber-dim);animation:dot-pulse 1.2s ease infinite}.status-dot.connected{background:var(--accent-green);box-shadow:0 0 4px var(--accent-green-dim)}.status-dot.error{background:var(--accent-red);box-shadow:0 0 4px var(--accent-red-dim)}@keyframes dot-pulse{0%,to{opacity:1}50%{opacity:.4}}.form-row{display:flex;gap:10px}.form-row .form-group{flex:1}.form-group{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}.form-group:last-child{margin-bottom:0}.form-label{font-size:.75rem;font-weight:500;color:var(--text-secondary);-webkit-user-select:none;user-select:none}.tab-bar{position:fixed;bottom:0;left:0;right:0;height:calc(var(--tabbar-height) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#0f0f0ff2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--border-subtle);display:none;z-index:100}.tab-bar.is-visible{display:flex}.tab-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:transparent;border:none;color:var(--text-muted);cursor:pointer;transition:color var(--t-fast);padding:0 4px;-webkit-tap-highlight-color:transparent}.tab-btn:hover{color:var(--text-secondary)}.tab-btn.is-active{color:var(--accent-blue)}.tab-icon{display:flex;align-items:center;justify-content:center}.tab-label{font-size:.625rem;font-weight:500;letter-spacing:.02em}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 16px;gap:8px;color:var(--text-muted);text-align:center}.empty-state-icon{opacity:.3;margin-bottom:4px}.empty-state-text{font-size:.875rem}.divider{height:1px;background:var(--border-subtle);margin:12px 0}::-webkit-scrollbar{width:4px;height:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-muted);border-radius:2px}.settings-card{max-width:480px;margin:0 auto}.settings-section{padding-top:14px;margin-top:14px;border-top:1px solid var(--border-subtle)}.settings-section:first-of-type{margin-top:0;padding-top:0;border-top:none}.settings-section-title{font-size:.6875rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);margin-bottom:10px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0}.settings-row-label{font-size:.8125rem;color:var(--text-secondary)}.sm-toggle{width:34px;height:20px;flex-shrink:0}.sm-toggle .toggle-track{border-radius:10px}.sm-toggle .toggle-thumb{width:14px;height:14px;top:2px;left:2px}.sm-toggle input:checked+.toggle-track .toggle-thumb{transform:translate(14px)}.sm-select{min-height:unset;height:28px;padding:3px 28px 3px 8px;font-size:.75rem;width:auto;background-color:var(--bg-2);color:var(--text-secondary)}.conn-status{display:flex;align-items:center;gap:6px}.conn-status-text{font-size:.75rem;color:var(--text-secondary)}.connection-form{margin-bottom:16px}.conn-error{font-size:.8125rem;color:var(--accent-red);background:var(--accent-red-dim);border:1px solid rgba(229,62,62,.25);border-radius:8px;padding:10px 12px;margin-top:12px;line-height:1.4}.scene-mode-hint{font-size:.75rem;color:var(--text-muted)}.scenes-list{display:flex;flex-direction:column;gap:4px}.scene-item{display:flex;align-items:center;gap:10px;width:100%;min-height:var(--touch-min);padding:10px 12px;background:transparent;border:1px solid transparent;border-radius:8px;color:var(--text-secondary);font-size:.9375rem;text-align:left;cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast)}.scene-item:hover{background:var(--bg-2);color:var(--text-primary)}.scene-item:active{background:var(--bg-3)}.scene-item.is-program{background:var(--accent-red-dim);border-color:#e53e3e66;color:var(--text-primary)}.scene-item.is-program .scene-name{font-weight:500}.scene-item.is-preview{background:var(--accent-green-dim);border-color:#48bb7866;color:var(--text-primary)}.scene-item.is-preview .scene-name{font-weight:500}.scene-item.is-program.is-preview{background:var(--accent-red-dim);border-color:#e53e3e66}.scene-index{font-size:.6875rem;font-weight:500;color:var(--text-muted);min-width:16px;text-align:right;font-variant-numeric:tabular-nums}.scene-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400}.scene-badges{display:flex;gap:4px;flex-shrink:0}.scene-badge{display:inline-flex;align-items:center;justify-content:center;font-size:.5625rem;font-weight:700;letter-spacing:.08em;padding:1px 5px;border-radius:3px;-webkit-user-select:none;user-select:none;line-height:1.4}.badge-program{background:var(--accent-red);color:#fff}.badge-preview{background:var(--accent-green);color:#fff}.studio-content{display:flex;flex-direction:column;gap:14px}.studio-preview-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.studio-preview-box{display:flex;flex-direction:column;gap:6px}.preview-label{display:flex;align-items:center;gap:6px}.preview-scene-name{font-size:.75rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preview-thumb{position:relative;width:100%;aspect-ratio:16 / 9;background:var(--bg-2);border-radius:6px;border:1px solid var(--border-subtle);overflow:hidden}.preview-box-pvw .preview-thumb{border-color:#48bb784d}.preview-box-pgm .preview-thumb{border-color:#e53e3e4d}.preview-img{width:100%;height:100%;object-fit:cover;display:block}.preview-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.6875rem;color:var(--text-muted)}.transition-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:4px}.transition-info{display:flex;flex-direction:column;gap:3px;min-width:0}.transition-name{font-size:.875rem;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.transition-btn{flex-shrink:0;gap:6px}.studio-disabled-hint{padding:4px 0}.studio-hint-text{font-size:.8125rem;color:var(--text-muted);line-height:1.6}.sources-scene-select{max-width:200px;min-height:34px;padding:6px 32px 6px 10px;font-size:.8rem}.sources-list{display:flex;flex-direction:column;gap:1px}.source-item{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 10px;border-radius:6px;background:var(--bg-2);border-left:3px solid var(--text-muted);transition:background var(--t-fast),opacity var(--t-fast),border-color var(--t-fast)}.source-item:hover{background:var(--bg-3)}.source-item.is-hidden{opacity:.45;border-left-color:var(--text-muted)!important}.source-cat-video{border-left-color:#3b82f6}.source-cat-image{border-left-color:#48bb78}.source-cat-text{border-left-color:#f59e0b}.source-cat-browser{border-left-color:#a78bfa}.source-cat-display{border-left-color:#22d3ee}.source-cat-capture{border-left-color:#06b6d4}.source-cat-audio{border-left-color:#f472b6}.source-cat-scene{border-left-color:#9ca3af}.source-cat-default{border-left-color:#6b7280}.source-type-icon{display:flex;align-items:center;justify-content:center;color:var(--text-muted);flex-shrink:0;width:20px;height:20px}.source-item:not(.is-hidden) .source-type-icon{color:var(--text-secondary)}.source-name-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.source-name{font-size:.8125rem;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.3}.source-window-name{font-size:.6875rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;max-width:180px}.visibility-btn{width:32px;min-height:32px;color:var(--text-secondary);flex-shrink:0}.visibility-btn:hover{color:var(--text-primary);background:#ffffff0f}.source-item.is-hidden .visibility-btn{color:var(--text-muted)}.source-group{border-radius:6px}.source-group-header{cursor:pointer;gap:6px;border-left-color:var(--accent-amber);background:#f59e0b0f}.source-group-header:hover{background:#f59e0b1a}.source-group-header.is-hidden{border-left-color:var(--text-muted);background:var(--bg-2)}.source-group-header .source-name{flex:1;font-weight:500}.group-toggle-icon{display:flex;align-items:center;justify-content:center;transition:transform var(--t-fast);color:var(--text-muted);flex-shrink:0;width:14px;height:14px}.group-toggle-icon.is-expanded{transform:rotate(90deg)}.group-folder-icon{display:flex;align-items:center;color:var(--accent-amber);flex-shrink:0}.group-count{font-size:.625rem;font-weight:600;color:var(--text-muted);background:var(--bg-3);padding:1px 6px;border-radius:10px;line-height:1.5;flex-shrink:0}.source-group-children{display:flex;flex-direction:column;gap:1px;padding-left:14px;margin-left:12px;margin-top:1px;border-left:1px solid var(--border-subtle)}.source-child{border-radius:0 6px 6px 0}.loading-text{font-size:.875rem;color:var(--text-muted);animation:dot-pulse 1.2s ease infinite}.audio-count{font-size:.75rem;color:var(--text-muted)}.audio-list{display:flex;flex-direction:column;gap:2px}.audio-item{padding:12px 14px;border-radius:8px;border:1px solid transparent;transition:background var(--t-fast)}.audio-item:hover{background:var(--bg-2)}.audio-item.is-muted{opacity:.55}.audio-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.audio-name{flex:1;font-size:.875rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mute-btn{color:var(--accent-blue);flex-shrink:0}.mute-btn.is-muted{color:var(--text-muted)}.mute-btn:hover{color:var(--text-primary)}.volume-row{display:flex;align-items:center;gap:10px}.volume-slider{flex:1;height:4px;border-radius:2px;-webkit-appearance:none;appearance:none;background:linear-gradient(to right,var(--accent-blue) var(--fill, 60%),var(--bg-3) var(--fill, 60%));outline:none;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--text-primary);box-shadow:0 1px 4px #00000080;cursor:pointer;transition:transform var(--t-fast),background var(--t-fast)}.volume-slider::-webkit-slider-thumb:active{transform:scale(1.2)}.volume-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--text-primary);border:none;box-shadow:0 1px 4px #00000080;cursor:pointer}.volume-slider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--accent-blue-dim)}.volume-db{font-size:.6875rem;color:var(--text-muted);font-family:var(--font-mono);min-width:60px;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.streaming-card .card-header{margin-bottom:6px}.stream-badge{display:inline-flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:700;letter-spacing:.1em;padding:2px 8px;border-radius:4px;background:var(--bg-3);color:var(--text-muted);border:1px solid transparent;transition:background var(--t-medium),color var(--t-medium),border-color var(--t-medium);-webkit-user-select:none;user-select:none}.stream-badge.is-live{background:var(--accent-red-dim);color:var(--accent-red);border-color:#e53e3e66;animation:live-pulse 2s ease infinite}@keyframes live-pulse{0%,to{box-shadow:0 0 #e53e3e00}50%{box-shadow:0 0 0 4px #e53e3e1f}}.stream-service-row{display:flex;align-items:center;gap:6px;padding:8px 0 14px}.stream-service-icon{display:flex;color:var(--text-muted);flex-shrink:0}.stream-service-name{font-size:.8125rem;font-weight:500;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stream-body{display:flex;flex-direction:column;align-items:center;gap:20px}.stream-timer{font-size:2.5rem;font-weight:200;letter-spacing:.04em;color:var(--text-primary);font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:center;line-height:1}.btn-stream{background:var(--bg-2);color:var(--text-secondary);border-color:var(--border-muted);font-size:.9375rem;font-weight:500;gap:8px;transition:background var(--t-medium),border-color var(--t-medium),color var(--t-medium),box-shadow var(--t-medium)}.btn-stream:hover:not(:disabled){background:var(--bg-3);color:var(--text-primary)}.btn-stream.is-live{background:var(--accent-red);border-color:var(--accent-red);color:#fff}.btn-stream.is-live:hover:not(:disabled){background:#c53030;border-color:#c53030}.stream-meta{display:flex;flex-direction:column;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--border-subtle)}.stream-meta-item{display:flex;justify-content:space-between;align-items:center}.stream-meta-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.stream-state-text{font-size:.8125rem;color:var(--text-secondary)}.btn-settings{color:var(--text-muted)}.btn-settings:hover{color:var(--text-secondary);background:var(--bg-2)}.panel{display:none}.panel.is-active{display:block}@media(min-width:640px){.panel{display:block!important}.tab-bar,.tab-bar.is-visible{display:none!important}.app-main{padding-bottom:20px;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:start}.panel[data-panel=settings]{grid-column:1 / -1}.settings-card{max-width:100%}.btn-settings{display:none}}@media(min-width:1024px){:root{--sources-sidebar-width: 280px}.app-header{right:var(--sources-sidebar-width)}.app-main{grid-template-columns:repeat(3,1fr);gap:16px;max-width:none;margin-left:0;margin-right:var(--sources-sidebar-width);padding:80px 24px 32px}.panel[data-panel=settings]{grid-column:1 / -1}.panel[data-panel=audio]{grid-column:span 2}.panel[data-panel=streaming]{grid-column:span 1}.panel[data-panel=sources]{position:fixed;top:0;right:0;bottom:0;width:var(--sources-sidebar-width);padding:calc(var(--header-height) + env(safe-area-inset-top) + 8px) 0 12px;overflow-y:auto;background:var(--bg-1);border-left:1px solid var(--border-subtle);z-index:90}.panel[data-panel=sources] .sources-card{border-radius:0;box-shadow:none;background:transparent}}@media(min-width:1440px){:root{--sources-sidebar-width: 320px}.app-main{grid-template-columns:repeat(3,1fr);max-width:1200px;margin-left:auto;margin-right:calc(var(--sources-sidebar-width) + 24px)}.panel[data-panel=settings]{grid-column:1 / -1}.panel[data-panel=audio]{grid-column:span 2}}@media(max-height:500px)and (max-width:900px){.app-header{height:48px}:root{--header-height: 48px;--tabbar-height: 56px}.stream-timer{font-size:1.75rem}.card{padding:12px}}@media(hover:none)and (pointer:coarse){.scene-item,.source-item{min-height:48px}.volume-slider::-webkit-slider-thumb{width:22px;height:22px}.volume-slider::-moz-range-thumb{width:22px;height:22px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(forced-colors:active){.toggle-track{border:2px solid ButtonText}.stream-badge.is-live{forced-color-adjust:none;background:red;color:#fff}}