.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px}.login-card{background:#fff;border-radius:12px;padding:40px;width:100%;max-width:400px;box-shadow:0 10px 40px #0003}.login-card h1{text-align:center;color:#667eea;margin-bottom:8px;font-size:2rem}.subtitle{text-align:center;color:#666;margin-bottom:30px;font-size:.9rem}.login-form{display:flex;flex-direction:column;gap:20px}.form-group input{padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:border-color .3s}.error-message{background:#fee;color:#c33;padding:12px;border-radius:8px;font-size:.9rem;text-align:center}.success-message{background:#efe;color:#3c3;padding:12px;border-radius:8px;font-size:.9rem;text-align:center}.submit-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:14px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.submit-button:disabled{opacity:.6;cursor:not-allowed}.toggle-mode{margin-top:20px;text-align:center}.link-button{background:none;border:none;color:#667eea;cursor:pointer;font-size:.9rem;text-decoration:underline;padding:0}.link-button:hover{color:#764ba2}.config-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 6px #0000001a;max-height:calc(100vh - 200px);overflow-y:auto}.config-card h2{margin-bottom:20px;color:#333;font-size:1.5rem}.config-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:500;color:#333;font-size:.9rem}.form-group input[type=text],.form-group input[type=number],.form-group input[type=password]{padding:10px;border:2px solid #e0e0e0;border-radius:6px;font-size:.95rem;transition:border-color .3s}.form-group input:focus{outline:none;border-color:#667eea}.form-group small{color:#666;font-size:.85rem}.srt-input-group{display:grid;grid-template-columns:1fr 1fr;gap:12px}.srt-field{display:flex;flex-direction:column;gap:8px}.srt-field label{font-weight:500;color:#333;font-size:.9rem}.srt-field input{padding:10px;border:2px solid #e0e0e0;border-radius:6px;font-size:.95rem;transition:border-color .3s}.srt-field input:focus{outline:none;border-color:#667eea}.output-url-row{display:flex;gap:8px;margin-bottom:8px}.output-url-row input{flex:1}.remove-button{background:#dc3545;color:#fff;border:none;width:36px;height:36px;border-radius:6px;cursor:pointer;font-size:1.2rem;display:flex;align-items:center;justify-content:center;transition:background .3s}.remove-button:hover{background:#c82333}.add-button{background:#28a745;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;transition:background .3s;align-self:flex-start}.add-button:hover{background:#218838}.checkbox-group{flex-direction:row;align-items:center;gap:8px}.checkbox-group label{display:flex;align-items:center;gap:8px;cursor:pointer}.checkbox-group input[type=checkbox]{width:18px;height:18px;cursor:pointer}.error-message{background:#fee;color:#c33;padding:12px;border-radius:8px;font-size:.9rem}.success-message{background:#efe;color:#3c3;padding:12px;border-radius:8px;font-size:.9rem}.config-actions{display:flex;gap:12px;margin-top:10px}.save-button,.save-start-button{flex:1;padding:12px;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.save-button{background:#667eea;color:#fff}.save-button:hover{background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.save-start-button{background:linear-gradient(135deg,#28a745,#20c997);color:#fff}.save-start-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #28a74566}.command-preview{margin-top:20px;padding:16px;background:#f8f9fa;border-radius:8px;border:1px solid #e0e0e0}.command-preview label{font-weight:600;color:#333;font-size:.9rem;margin-bottom:8px;display:block}.command-display{background:#1e1e1e;border-radius:6px;padding:12px;margin:8px 0;overflow-x:auto}.command-preview small{color:#666;font-size:.85rem}.status-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 6px #0000001a}.status-card h2{margin-bottom:20px;color:#333;font-size:1.5rem}.status-indicator{display:flex;align-items:center;gap:12px;margin-bottom:24px;padding:16px;background:#f8f9fa;border-radius:8px}.status-dot{width:16px;height:16px;border-radius:50%;animation:pulse 2s infinite}.status-dot.running{background:#28a745}.status-dot.stopped{background:#dc3545;animation:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.status-text{font-weight:600;font-size:1.1rem;color:#333}.status-pid{margin-left:auto;color:#666;font-size:.9rem;font-family:monospace}.command-info{margin-top:24px;padding:16px;background:#f8f9fa;border-radius:8px}.command-info h3{margin-bottom:12px;color:#333;font-size:1rem}.command-display{background:#1e1e1e;border-radius:6px;padding:12px;overflow-x:auto}.command-display code{color:#d4d4d4;font-family:Courier New,monospace;font-size:.85rem;white-space:pre-wrap;word-break:break-all}.logs-container{margin-top:24px}.logs-container h3{margin-bottom:12px;color:#333;font-size:1.1rem}.logs{background:#1e1e1e;border-radius:8px;padding:12px;max-height:400px;overflow-y:auto;font-family:Courier New,monospace;font-size:.85rem}.log-entry{display:flex;gap:12px;padding:4px 0;border-bottom:1px solid #333}.log-entry:last-child{border-bottom:none}.log-time{color:#888;min-width:80px}.log-message{color:#d4d4d4;word-break:break-word}.log-entry.log-error .log-message,.log-entry.log-stderr .log-message{color:#f48771}.log-entry.log-stdout .log-message{color:#4ec9b0}.log-entry.log-info .log-message{color:#569cd6}.controls-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 4px 6px #0000001a}.controls-card h2{margin-bottom:20px;color:#333;font-size:1.5rem}.error-message{background:#fee;color:#c33;padding:12px;border-radius:8px;margin-bottom:20px;font-size:.9rem}.controls-buttons{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px}.control-button{flex:1;min-width:120px;padding:14px 24px;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.control-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #0003}.control-button:disabled{opacity:.5;cursor:not-allowed}.control-start{background:linear-gradient(135deg,#28a745,#20c997);color:#fff}.control-stop{background:linear-gradient(135deg,#dc3545,#c82333);color:#fff}.control-restart{background:linear-gradient(135deg,#ffc107,#ff9800);color:#fff}.controls-info{padding:16px;background:#f8f9fa;border-radius:8px;font-size:.9rem;color:#666}.controls-info p{margin:0}.stream-metrics{background:#fff;border-radius:8px;padding:20px;margin-bottom:20px;box-shadow:0 2px 4px #0000001a}.metrics-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.metrics-header h2{margin:0;color:#333}.time-range-selector{display:flex;align-items:center;gap:10px}.time-range-selector label{font-weight:500;color:#666}.time-range-selector select{padding:6px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.realtime-metrics-card,.summary-card{background:#f8f9fa;border-radius:8px;padding:16px;margin-bottom:20px}.realtime-metrics-card h3,.summary-card h3{margin:0 0 16px;color:#333;font-size:18px}.metrics-grid,.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}.metric-item,.summary-item{display:flex;flex-direction:column;gap:4px}.metric-label,.summary-label{font-size:12px;color:#666;text-transform:uppercase;letter-spacing:.5px}.metric-value,.summary-value{font-size:24px;font-weight:600;color:#333}.metric-value.error,.summary-value.error{color:#f44336}.metric-value.health-score{font-size:32px}.metric-status{font-size:14px;font-weight:500;text-transform:uppercase}.charts-container{display:grid;gap:20px}.chart-card{background:#f8f9fa;border-radius:8px;padding:16px}.chart-card h3{margin:0 0 16px;color:#333;font-size:16px}.metrics-loading,.no-data{text-align:center;padding:40px;color:#666;font-size:16px}@media (max-width: 768px){.metrics-grid,.summary-grid{grid-template-columns:repeat(2,1fr)}.metrics-header{flex-direction:column;align-items:flex-start;gap:12px}}.dashboard{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2)}.dashboard-header{background:#fffffff2;padding:20px 40px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 10px #0000001a}.dashboard-header h1{color:#667eea;font-size:1.8rem}.header-actions{display:flex;align-items:center;gap:20px}.username{color:#666;font-weight:500}.logout-button{background:#dc3545;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-weight:500;transition:background .3s}.logout-button:hover{background:#c82333}.dashboard-content{display:grid;grid-template-columns:1fr 400px;gap:20px;padding:20px;max-width:1600px;margin:0 auto}.dashboard-main,.dashboard-sidebar{display:flex;flex-direction:column;gap:20px}@media (max-width: 1200px){.dashboard-content{grid-template-columns:1fr}}@media (max-width: 768px){.dashboard-header{padding:15px 20px;flex-direction:column;gap:15px;align-items:flex-start}.dashboard-content{padding:15px}}.loading{display:flex;justify-content:center;align-items:center;height:100vh;font-size:1.5rem;color:#fff}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh}