body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.message-item.own-message{background:#1e3a5f;border-left-color:#4caf50}.message-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:5px}.message-username{color:#64b5f6;font-size:.9rem;font-weight:700}.own-message .message-username{color:#4caf50}.message-content{word-wrap:break-word}.username-editor{background:#2d2d2d;border-radius:8px;margin-bottom:15px;padding:15px}.username-edit-form{display:flex;flex-direction:column;gap:10px}.username-input{background:#1a1a1a;border:1px solid #444;border-radius:5px;color:#fff;font-size:1rem;padding:10px}.username-input:focus{border-color:#2196f3;outline:none}.username-actions{display:flex;gap:10px}.cancel-button,.edit-button,.save-button{border:none;border-radius:5px;cursor:pointer;font-size:.9rem;padding:8px 16px}.save-button{background:#4caf50;color:#fff}.save-button:hover:not(:disabled){background:#45a049}.save-button:disabled{background:#666;cursor:not-allowed}.cancel-button{background:#f44336;color:#fff}.cancel-button:hover{background:#da190b}.edit-button{background:#2196f3;color:#fff;margin-left:10px}.edit-button:hover:not(:disabled){background:#1976d2}.edit-button:disabled{background:#666;cursor:not-allowed}.username-display{align-items:center;display:flex}.username-label{color:#ccc;font-weight:700}.username-value{color:#64b5f6;font-weight:700;margin-left:5px}.video-publisher,.video-subscriber{background:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 2px 8px #0000001a;box-sizing:border-box;margin:0;width:100%}.video-header{border-bottom:1px solid #eee;flex-shrink:0;padding-bottom:10px}.video-header h2,.video-header h3{color:#333;font-size:1.2rem;font-weight:600;margin:0}.stream-status{align-items:center;color:#666;display:flex;font-weight:500;gap:8px}.status-indicator{font-size:1rem;font-weight:700}.status-indicator.streaming{animation:pulse 1.5s infinite;color:#f44}.status-indicator.ready{color:#4caf50}.status-indicator.error{color:#f44336}.status-indicator.idle{color:#ff9800}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}.video-container{aspect-ratio:9/16;border-radius:6px;flex:1 1;min-height:0;width:100%}.camera-preview,.video-stream{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.video-placeholder{flex-direction:column;gap:15px}.placeholder-icon{opacity:.7}.placeholder-text{color:#ccc;font-size:.95rem;line-height:1.4;padding:20px;text-align:center}.placeholder-text h3{font-size:1.1rem;margin:0 0 8px}.placeholder-text p{margin:0;opacity:.8}.camera-error-overlay{background:#000000d9;color:#fff;z-index:10}.error-content{padding:20px}.error-content p{font-size:1rem;margin:0 0 15px}.error-content button{background:#2196f3;border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:500;margin-top:10px;padding:10px 20px;transition:background-color .2s}.error-content button:hover{background:#1976d2}.video-controls{flex-shrink:0;gap:15px;margin-bottom:15px}.connection-button,.refresh-camera,.stream-button{border:none;border-radius:6px;cursor:pointer;font-size:.9rem;font-weight:600;min-width:120px;padding:10px 20px;transition:all .2s ease}.connection-button.connect,.stream-button.start{background:#4caf50;color:#fff}.connection-button.connect:hover:not(:disabled),.stream-button.start:hover:not(:disabled){background:#45a049;transform:translateY(-1px)}.connection-button.disconnect,.stream-button.stop{background:#f44336;color:#fff}.connection-button.disconnect:hover:not(:disabled),.stream-button.stop:hover:not(:disabled){background:#da190b;transform:translateY(-1px)}.refresh-camera{background:#2196f3;color:#fff}.refresh-camera:hover:not(:disabled){background:#1976d2;transform:translateY(-1px)}.refresh-camera:disabled,.stream-button:disabled{background:#ccc;color:#666;cursor:not-allowed;transform:none}.fps-control{background:#f5f5f5;border-radius:6px;font-size:.9rem;padding:8px 12px}.fps-control label{color:#333;font-weight:500}.fps-control select{background:#fff;border:1px solid #ddd;cursor:pointer;font-size:.9rem;padding:6px 10px}.fps-control select:focus{border-color:#2196f3;box-shadow:0 0 0 2px #2196f333;outline:none}.stream-info{border:1px solid #e9ecef;border-radius:6px;color:#495057;display:flex;justify-content:space-between;padding:12px}.stream-info,.streaming-stats{background:#f8f9fa;flex-shrink:0;font-size:.85rem}.streaming-stats{border-radius:0 0 6px 6px;border-top:1px solid #e9ecef;color:#666;text-align:center}.error-message{border:1px solid #f44336;border-radius:6px;flex-shrink:0;font-size:.9rem;line-height:1.4;padding:12px 15px}.live-badge{align-items:center;animation:pulse 2s infinite;border-radius:20px;display:flex;gap:6px;left:12px;padding:6px 12px;top:12px;z-index:5}.live-badge:before{background:#fff;border-radius:50%;content:"";display:inline-block;height:8px;width:8px}.audio-publisher,.audio-subscriber{border-color:#4caf50}.audio-container{background:linear-gradient(135deg,#1a1a1a,#2d2d2d)}.audio-container,.audio-visualizer{align-items:center;display:flex;justify-content:center}.audio-visualizer{height:60px;width:80%}.audio-wave{animation:audioWave 2s infinite;background:linear-gradient(90deg,#4caf50,#2196f3);border-radius:2px;height:4px;width:100%}@keyframes audioWave{0%,to{opacity:.7;transform:scaleY(1)}50%{opacity:1;transform:scaleY(2)}}.video-publisher,.video-subscriber{background:#1a1a1a;border-radius:12px;margin-bottom:20px;padding:15px}.video-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:15px}.video-header h3{color:#fff;font-size:1.2rem;margin:0}.stream-status{color:#888;font-size:.9rem}.status-indicator{margin-right:5px}.status-indicator.connected,.status-indicator.streaming{color:#4caf50}.status-indicator.disconnected,.status-indicator.error{color:#f44}.status-indicator.ready{color:#fa0}.video-container{background:#000;border-radius:8px;margin-bottom:15px;overflow:hidden;position:relative}.camera-preview,.video-stream{background:#000;display:block}.live-badge{font-size:.8rem}.video-controls{align-items:center;display:flex;flex-wrap:wrap;gap:10px}.stream-button{border:none;border-radius:6px;cursor:pointer;font-weight:600;padding:10px 20px;transition:all .3s}.stream-button.start{background:#4caf50;color:#fff}.stream-button.stop{background:#f44;color:#fff}.stream-button:disabled{background:#666;cursor:not-allowed}.audio-controls button,.retry-button,.toggle-camera-button{background:#2196f3;border:none;border-radius:6px;color:#fff;cursor:pointer;font-weight:500;padding:10px 15px}.fps-control{align-items:center;color:#fff;display:flex;gap:8px;margin-left:auto}.fps-control select{background:#333;border:1px solid #555;border-radius:4px;color:#fff;padding:5px}.error-message{background:#ffebee;border-left:4px solid #c62828;color:#c62828;padding:10px}.error-message,.streaming-stats{border-radius:4px;margin-top:10px}.streaming-stats{background:#0000004d;color:#aaa;font-size:.8rem;padding:8px}.video-placeholder{background:#000c;bottom:0;left:0;position:absolute;right:0;top:0}.placeholder-content{color:#fff}.placeholder-icon{font-size:3rem;margin-bottom:10px}.placeholder-text h3{color:#fff;margin:0 0 10px}.placeholder-text p{color:#aaa;margin:0 0 15px}.camera-error-overlay{align-items:center;background:#000c;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.error-content{color:#fff;text-align:center}.error-content p{margin-bottom:15px}.stats-overlay{background:#000000b3;border-radius:4px;bottom:10px;color:#fff;font-size:.8rem;left:10px;padding:4px 8px;position:absolute}.volume-controls{bottom:10px;display:flex;gap:5px;position:absolute;right:10px}.volume-controls button{background:#000000b3;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:.9rem;padding:5px 10px}.audio-publisher .status-indicator.streaming,.audio-subscriber .status-indicator.connected{color:#4caf50}.audio-publisher .live-badge,.audio-subscriber .live-badge.watching{background:#4caf50}@media (max-width:1024px){.video-publisher,.video-subscriber{padding:12px}.video-header{align-items:flex-start;flex-direction:column;gap:10px}.video-controls{gap:10px}.connection-button,.refresh-camera,.stream-button{font-size:.85rem;min-width:110px;padding:9px 16px}}@media (max-width:768px){.video-publisher,.video-subscriber{border-radius:6px;margin:0;padding:10px}.video-header{margin-bottom:12px}.video-header h2,.video-header h3{font-size:1.1rem}.video-container{aspect-ratio:9/16;margin-bottom:12px}.video-controls{align-items:stretch;flex-direction:column;gap:10px}.connection-button,.refresh-camera,.stream-button{font-size:.9rem;min-width:auto;padding:12px 16px;width:100%}.fps-control{justify-content:space-between;width:100%}.stream-info{align-items:flex-start;flex-direction:column;gap:8px}.placeholder-icon{font-size:2.5rem}.placeholder-text{font-size:.9rem;padding:15px}}@media (max-width:480px){.video-publisher,.video-subscriber{padding:8px}.video-header h2,.video-header h3{font-size:1rem}.stream-status{font-size:.8rem}.placeholder-icon{font-size:2rem}.placeholder-text{font-size:.85rem;padding:12px}}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.connection-button,.refresh-camera,.stream-button,.video-container{border-radius:8px}}@media (prefers-reduced-motion:reduce){.status-indicator.streaming{animation:none;opacity:1}.live-badge{animation:none}.connection-button,.refresh-camera,.stream-button{transition:none}.audio-wave{animation:none}}@media (prefers-color-scheme:dark){.video-publisher,.video-subscriber{background:#2d2d2d;border-color:#444;color:#fff}.video-header h2,.video-header h3{color:#fff}.stream-status{color:#ccc}.fps-control{background:#3d3d3d;color:#fff}.fps-control label{color:#fff}.fps-control select{background:#4d4d4d;border-color:#666;color:#fff}.stream-info,.streaming-stats{background:#3d3d3d;border-color:#444;color:#ccc}.error-message{background:#422;border-color:#633;color:#f99}.video-placeholder{background:#000}.placeholder-text h3{color:#fff}}.chat-container{height:70vh;max-height:800px;min-height:500px}.sound-toggle{background:none;border:none;cursor:pointer;font-size:1.2em;padding:8px;transition:background-color .2s}.sound-toggle:hover{background-color:#ffffff1a}.chat-header{padding-right:80px}.audio-controls{display:flex;gap:8px;position:absolute;right:20px;top:20px}.sound-test,.sound-toggle{background:#ffffff1a;border:1px solid #fff3;border-radius:4px;color:#fff;cursor:pointer;font-size:.9em;padding:6px 12px;transition:background-color .2s}.sound-toggle{align-items:center;border-radius:50%;display:flex;height:40px;justify-content:center;width:40px}.sound-test{border-radius:20px}.sound-test:hover,.sound-toggle:hover{background-color:#fff3}.sound-toggle.disabled{opacity:.5}.chat-header{padding-right:180px;position:relative}.video-role-controls{background:#f5f5f5;border:1px solid #e0e0e0;border-radius:8px;margin:15px 0;padding:15px}.role-buttons{display:flex;flex-wrap:wrap;gap:10px}.role-button{background:#fff;border:2px solid #ddd;border-radius:6px;cursor:pointer;font-weight:700;padding:10px 20px;transition:all .3s ease}.role-button:hover:not(:disabled){background:#f0f8ff;border-color:#2196f3}.role-button.active{background:#2196f3;border-color:#2196f3;color:#fff}.role-button:disabled{cursor:not-allowed;opacity:.5}.chat-container{grid-gap:20px;display:grid;grid-template-columns:1fr 1fr;height:600px}@media (max-width:768px){.chat-container{grid-template-columns:1fr;height:auto}}.video-section{background:#000;border-radius:8px;display:flex;flex-direction:column;min-height:300px;overflow:hidden;position:relative}.video-placeholder{align-items:center;background:#1a1a1a;color:#fff;display:flex;height:100%;justify-content:center}.placeholder-content{padding:20px;text-align:center}.placeholder-icon{font-size:48px;margin-bottom:15px}.placeholder-content h3{color:#fff;margin:0 0 10px}.placeholder-content p{color:#ccc;font-size:14px;margin:0}.chat-section{background:#fff;border:1px solid #ddd;border-radius:8px;display:flex;flex-direction:column}.publisher-notice{background:#fff3cd;border:1px solid #ffeaa7;border-radius:4px;color:#856404;font-size:14px;margin:10px;padding:10px;text-align:center}.live-badge{background:#f44;border-radius:4px;color:#fff;font-size:12px;font-weight:700;left:10px;padding:4px 8px;position:absolute;top:10px}.live-badge.watching{background:#2196f3}.video-publisher,.video-subscriber{display:flex;flex:1 1;flex-direction:column;height:100%}.video-publisher .video-header,.video-subscriber .video-header{background:#000c;color:#fff;margin:0;padding:10px 15px}.video-publisher .video-header h3,.video-subscriber .video-header h3{font-size:16px;margin:0}.video-publisher .video-container,.video-subscriber .video-container{flex:1 1;min-height:0;position:relative}.video-publisher .video-controls{background:#000c;margin:0;padding:10px 15px}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#1a1a1a;color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.App{min-height:100vh}.App,.chat-room{display:flex;flex-direction:column}.chat-room{height:100vh;margin:0 auto;max-width:1200px;padding:20px}.chat-header{align-items:center;border-bottom:1px solid #333;display:flex;justify-content:space-between;margin-bottom:20px;padding:20px 0}.chat-header h1{color:#fff;font-size:2rem}.connection-status{align-items:center;display:flex;font-size:.9rem;gap:8px}.status-indicator{font-size:1.2rem}.status-indicator.connected{color:#4caf50}.status-indicator.disconnected{color:#f44336}.chat-container{display:flex;flex:1 1;flex-direction:column;gap:20px}.channel-selector,.chat-container{background:#2d2d2d;border-radius:10px;padding:20px}.channel-selector{margin-bottom:20px}.current-channel h3{color:#64b5f6;margin-bottom:15px}.channel-form{display:flex;gap:10px;margin-bottom:15px}.channel-input{background:#1a1a1a;border:1px solid #444;border-radius:5px;color:#fff;flex:1 1;font-size:1rem;padding:10px}.join-button{background:#2196f3;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1rem;padding:10px 20px}.join-button:hover{background:#1976d2}.available-channels h4{color:#ccc;margin-bottom:10px}.channel-buttons{display:flex;flex-wrap:wrap;gap:10px}.channel-button{background:#444;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:.9rem;padding:8px 16px}.channel-button:hover{background:#555}.channel-button.active{background:#2196f3}.message-list{background:#1a1a1a;border-radius:8px;flex:1 1;max-height:400px;overflow-y:auto;padding:20px}.no-messages{color:#666;padding:40px;text-align:center}.message-item{background:#2d2d2d;border-left:4px solid #2196f3;border-radius:8px;margin-bottom:15px;padding:12px}.message-content{color:#fff;line-height:1.4;margin-bottom:5px}.message-timestamp{color:#888;font-size:.8rem;text-align:right}.message-input-form{background:#2d2d2d;border-radius:8px;padding:15px}.input-container{align-items:flex-end;display:flex;gap:10px}.message-textarea{background:#1a1a1a;border:1px solid #444;border-radius:5px;color:#fff;flex:1 1;font-family:inherit;font-size:1rem;max-height:120px;min-height:60px;padding:12px;resize:vertical}.message-textarea:focus{border-color:#2196f3;outline:none}.send-button{background:#4caf50;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1rem;height:-webkit-fit-content;height:fit-content;padding:12px 24px}.send-button:hover:not(:disabled){background:#45a049}.send-button:disabled{background:#666;cursor:not-allowed}.error-message{background:#f44336;border-radius:5px;color:#fff;margin:10px 0;padding:12px;text-align:center}.message-list::-webkit-scrollbar{width:6px}.message-list::-webkit-scrollbar-track{background:#1a1a1a}.message-list::-webkit-scrollbar-thumb{background:#444;border-radius:3px}.message-list::-webkit-scrollbar-thumb:hover{background:#555}
/*# sourceMappingURL=main.ba5c40d3.css.map*/