:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#eef3f8;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#0b0f14;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{min-height:100%}body{background:linear-gradient(#18212cdb,#0b0f1400 260px),#0b0f14;min-height:100%;margin:0}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.app{width:min(1120px,100%);padding:max(18px, env(safe-area-inset-top)) clamp(14px, 3vw, 28px) max(24px, env(safe-area-inset-bottom));margin:0 auto}.login-shell{place-items:center;min-height:calc(100vh - 48px);display:grid}.login-panel{background:#11171ff0;border:1px solid #ffffff17;border-radius:8px;gap:14px;width:min(430px,100%);padding:18px;display:grid;box-shadow:0 18px 44px #00000052}.hero{justify-content:space-between;align-items:flex-end;gap:18px;padding:8px 0 18px;display:flex}.eyebrow{color:#8ea0b6;letter-spacing:0;text-transform:uppercase;margin:0 0 6px;font-size:.76rem;font-weight:800}h1,h2,p{margin:0}h1{font-size:clamp(2rem,6vw,3.4rem);line-height:.95}h2{font-size:1.15rem}.status-pill{color:#c7d4e3;white-space:nowrap;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:999px;align-items:center;gap:9px;min-height:40px;padding:0 14px;font-weight:800;display:inline-flex}.status-pill span{background:#7c8794;border-radius:999px;width:10px;height:10px}.status-pill.is-connecting span{background:#f4be47}.status-pill.is-connected span{background:#31d18b}.status-pill.is-error span{background:#ff5f6d}.panel{background:#11171feb;border:1px solid #ffffff17;border-radius:8px;width:100%;margin-top:14px;box-shadow:0 18px 44px #00000047}.connection-panel{grid-template-columns:minmax(0,1.2fr) minmax(0,.9fr);gap:12px;padding:14px;display:grid}.connection-summary{background:#ffffff09;border:1px solid #ffffff17;border-radius:8px;gap:7px;min-height:72px;padding:12px;display:grid}.connection-summary span{color:#9eafc2;font-size:.88rem;font-weight:800}.connection-summary strong{color:#eef3f8;overflow-wrap:anywhere}.field{gap:7px;display:grid}.field span,.check span{color:#9eafc2;font-size:.88rem;font-weight:700}.field input{color:#f4f8fb;background:#0b1118;border:1px solid #ffffff1a;border-radius:8px;outline:none;width:100%;min-height:52px;padding:0 14px}.field input:focus{border-color:#69b7ff;box-shadow:0 0 0 3px #69b7ff29}.check{grid-column:1/-1;align-items:center;gap:10px;min-height:28px;display:flex}.check input{accent-color:#34c989;width:20px;height:20px}.connection-actions{grid-column:1/-1;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:10px;display:grid}.primary-button,.secondary-button,.control-button,.scene-button,.toggle-button,.filter-button,.track-button,.source-select{color:#fff;cursor:pointer;border:0;border-radius:8px;min-height:58px;font-weight:900;transition:transform .12s,border-color .12s,background-color .12s,opacity .12s}.primary-button{background:#2377ff}.secondary-button{color:#d6e2ee;background:#1c2733;border:1px solid #ffffff1f}.primary-button:active,.secondary-button:active,.control-button:active,.scene-button:active{transform:translateY(1px)}button:disabled{cursor:not-allowed;opacity:.48}.warning,.error-text{grid-column:1/-1;font-size:.9rem;line-height:1.35}.warning{color:#f0c96c}.logout-button{grid-column:1/-1}.error-text{color:#ff8d98}.controls-panel,.scenes-panel,.sources-panel,.filters-panel,.audio-panel,.streams-panel{padding:14px}.is-muted{opacity:.76}.section-title{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.section-title span{color:#9eafc2;font-size:.92rem;font-weight:800}.control-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.output-status-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:10px;display:grid}.output-chip{color:#9eafc2;background:#ffffff0a;border:1px solid #ffffff17;border-radius:8px;align-items:center;min-height:38px;padding:0 12px;font-size:.9rem;font-weight:800;display:flex}.output-chip.is-live{color:#6df2b1;background:#31d18b1f;border-color:#31d18b73}.control-button{background:#29a66f;font-size:clamp(1rem,3.8vw,1.25rem)}.control-button.is-danger{background:#d33b4a}.scene-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;display:grid}.source-grid,.filter-grid,.audio-grid{gap:10px;display:grid}.source-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.filter-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.audio-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.stream-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;display:grid}.scene-button,.filter-button,.source-select{text-align:left;background:#182231;border:1px solid #ffffff1a;justify-content:space-between;align-items:center;gap:10px;min-height:74px;padding:12px 14px;display:flex}.source-card{background:#ffffff09;border:1px solid #ffffff17;border-radius:8px;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:8px;display:grid}.source-card.is-selected{border-color:#69b7ffb3;box-shadow:inset 0 0 0 1px #69b7ff38}.source-select{background:#182231;border:1px solid #ffffff1a;min-height:58px}.toggle-button{background:#1c2733;border:1px solid #ffffff1f;min-width:92px;padding:0 12px}.toggle-button.is-on{background:#1a523c;border-color:#31d18b7a}.filter-button{background:#1c2733}.filter-button.is-on{background:#18372b;border-color:#31d18be6}.scene-button span,.filter-button span,.source-select span{overflow-wrap:anywhere;font-size:1.06rem}.scene-button strong,.filter-button strong,.source-select strong{color:#6df2b1;background:#31d18b29;border-radius:999px;flex:none;padding:5px 8px;font-size:.72rem}.scene-button.is-active{background:#18372b;border-color:#31d18be6;box-shadow:inset 0 0 0 1px #31d18b66}.audio-card{background:#ffffff09;border:1px solid #ffffff17;border-radius:8px;gap:12px;padding:12px;display:grid}.audio-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.audio-head h3{overflow-wrap:anywhere;margin:0 0 4px;font-size:1rem}.audio-head span{color:#9eafc2;font-size:.9rem;font-weight:800}.volume-control{gap:8px;display:grid}.volume-control span{color:#c7d4e3;font-size:.9rem;font-weight:800}.volume-control input{accent-color:#2377ff;width:100%}.track-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;display:grid}.track-button{background:#1c2733;border:1px solid #ffffff1a;min-height:42px;padding:0}.track-button.is-on{background:#1a523c;border-color:#31d18bb3}.stream-card{background:#ffffff09;border:1px solid #ffffff17;border-radius:8px;gap:12px;padding:12px;display:grid}.stream-card.is-online{border-color:#31d18b5c}.stream-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.stream-head h3{overflow-wrap:anywhere;margin:0;font-size:1.05rem}.stream-head span{color:#6df2b1;background:#31d18b29;border-radius:999px;flex:none;padding:5px 8px;font-size:.72rem;font-weight:900}.bitrate-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.bitrate-grid div{background:#0000002e;border:1px solid #ffffff14;border-radius:8px;min-height:62px;padding:9px}.bitrate-grid span{color:#9eafc2;margin-bottom:5px;font-size:.78rem;font-weight:800;display:block}.bitrate-grid strong{color:#eef3f8;overflow-wrap:anywhere;font-size:.96rem;display:block}.empty-state{color:#9eafc2;border:1px dashed #ffffff21;border-radius:8px;place-items:center;min-height:94px;font-weight:800;display:grid}@media (width<=760px){.hero{flex-direction:column;align-items:flex-start}.connection-panel,.connection-actions,.control-grid,.output-status-grid,.scene-grid,.source-grid,.filter-grid,.audio-grid,.stream-grid,.source-card{grid-template-columns:1fr}.track-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.bitrate-grid{grid-template-columns:1fr}.scene-button,.source-select{min-height:68px}}@media (hover:hover){.primary-button:hover:not(:disabled){background:#3988ff}.secondary-button:hover:not(:disabled),.scene-button:hover:not(:disabled),.source-select:hover:not(:disabled),.filter-button:hover:not(:disabled),.toggle-button:hover:not(:disabled),.track-button:hover:not(:disabled){background:#202d3c;border-color:#fff3}.control-button:hover:not(:disabled){background:#30b87d}.control-button.is-danger:hover:not(:disabled){background:#ea4657}}
