*{box-sizing:border-box;margin:0;padding:0}body{background:linear-gradient(135deg,#667eea,#764ba2);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;overflow:auto}#root,.App{display:flex;flex-direction:column;min-height:100vh}.header{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 20px #00000026;padding:1.5rem 2rem}.header-content{justify-content:space-between;margin:0 auto;max-width:1200px}.header-content,.logo{align-items:center;display:flex}.logo{color:#fff;font-size:2rem;font-weight:700;gap:.5rem;margin:0}.tagline{color:#ffffffe6;font-size:.9rem;font-weight:500;margin:0}.home-container{align-items:center;display:flex;flex:1 1;justify-content:center;padding:2rem}.home-card{animation:slideUp .5s ease-out;background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;max-width:500px;padding:3rem;width:100%}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.home-card h2{color:#333;font-size:1.8rem;text-align:center}.action-section,.home-card h2{margin-bottom:2rem}.btn{border:none;border-radius:10px;cursor:pointer;font-family:inherit;font-size:1rem;font-weight:600;transition:all .3s ease}.btn:hover{box-shadow:0 5px 15px #0003;transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:1rem 2rem}.btn-large{font-size:1.1rem;padding:1.2rem;width:100%}.btn-secondary{background:#f0f0f0;color:#333;padding:.8rem 2rem}.btn-secondary:hover{background:#e0e0e0}.btn:disabled{cursor:not-allowed;opacity:.5;transform:none}.divider{color:#999;font-weight:600;margin:1.5rem 0;text-align:center}.join-form{display:flex;flex-direction:column;gap:1rem}.input-field{border:2px solid #e0e0e0;border-radius:10px;font-family:inherit;font-size:1rem;padding:1rem;transition:border-color .3s ease}.input-field:focus{border-color:#667eea;outline:none}.editor-container{border-radius:15px;height:calc(100vh - 150px);margin:1rem;min-height:500px}.editor-header{background:linear-gradient(135deg,#2d3748,#1a202c);border-bottom:1px solid #667eea4d;box-shadow:0 2px 10px #0003;flex-shrink:0;justify-content:space-between;padding:1rem 1.5rem}.editor-header,.room-info{align-items:center;display:flex}.room-info{flex-wrap:wrap;gap:1.5rem}.room-id{background:#667eea33;border:1px solid #667eea66;border-radius:10px;font-family:Courier New,monospace;padding:.6rem 1.2rem}.room-id,.user-count{color:#fff;font-size:.9rem;font-weight:600}.user-count{background:#ffffff1a;border-radius:10px;padding:.6rem 1rem}.status{align-items:center;border-radius:20px;display:flex;font-size:.85rem;font-weight:600;gap:.5rem;padding:.6rem 1rem}.status.connected{background:#48bb7833;border:1px solid #48bb7866;color:#48bb78}.status.disconnected{background:#f5656533;border:1px solid #f5656566;color:#f56565}.editor-controls{align-items:center;display:flex;flex-wrap:wrap;gap:.75rem}.control-btn{border:1px solid #ffffff1a;border-radius:8px;font-size:.85rem;gap:.4rem;padding:.6rem 1.2rem}.control-btn:hover{background:#667eea4d;border-color:#667eea80;box-shadow:0 4px 12px #667eea33}.control-btn.danger:hover{border-color:#f5656580}.language-select{border:1px solid #fff3;border-radius:8px;font-size:.85rem;font-weight:600;padding:.6rem 1.2rem;transition:all .2s ease}.language-select:hover{border-color:#667eea80}.language-select:focus{border-color:#667eeab3}@media (max-width:768px){.header-content{flex-direction:column;gap:.5rem}.logo{font-size:1.5rem}.home-card{padding:2rem}.room-info{align-items:flex-start;flex-direction:column;gap:.5rem}.editor-container{margin:.5rem}}.control-btn{align-items:center;background:#ffffff1a;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;font-weight:600;gap:.3rem;padding:.6rem 1rem;transition:all .2s ease}.control-btn:hover{background:#fff3;transform:translateY(-1px)}.control-btn:active{transform:translateY(0)}.control-btn.danger:hover{background:#f565654d}.loading-container{align-items:center;color:#fff;display:flex;flex:1 1;flex-direction:column;font-size:1.2rem;gap:1.5rem;justify-content:center}.loading-spinner{animation:spin 1s linear infinite;border:4px solid #ffffff4d;border-radius:50%;border-top-color:#fff;height:50px;width:50px}@keyframes spin{to{transform:rotate(1turn)}}.code-editor::placeholder{color:#666}.code-editor-wrapper{display:flex;flex:1 1;overflow:hidden;position:relative}.line-numbers{background:#1e1e1e;border-right:1px solid #333;color:#858585;flex-shrink:0;font-family:Courier New,monospace;font-size:16px;line-height:1.6;padding:1rem .5rem 1rem 1rem;text-align:right;-webkit-user-select:none;user-select:none}.line-numbers pre{margin:0}.editor-content{flex:1 1;overflow:hidden;position:relative}.syntax-highlight-layer{background:#1e1e1e;bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;z-index:1}.syntax-highlight-layer>div{overflow:hidden!important}.code-input-layer{-webkit-text-fill-color:#0000;background:#0000;border:none;bottom:0;caret-color:#fff;color:#0000;font-family:Courier New,Courier,monospace;font-size:16px;left:0;line-height:1.6;overflow:auto;padding:1rem;pointer-events:auto;position:absolute;resize:none;right:0;top:0;z-index:2}.code-input-layer:focus{outline:none}.code-input-layer::selection{background:#fff3}.editor-container.light{background:#fff}.editor-container.light .code-editor{background:#f5f5f5;color:#333}.editor-container.light .line-numbers{background:#f5f5f5;border-right:1px solid #ddd;color:#999}.editor-container.light .code-input-layer{caret-color:#000}.editor-footer{background:#2d3748;border-top:1px solid #4a5568;color:#fff;display:flex;font-size:.85rem;gap:2rem;padding:.75rem 1.5rem}.editor-footer span{color:#ffffffb3}.language-select{background:#ffffff1a;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;padding:.5rem 1rem;transition:background .2s ease}.language-select:hover{background:#ffffff26}.language-select:focus{background:#fff3;outline:none}.language-select option{background:#2d3748;color:#fff}.code-editor-simple{background:#1e1e1e;border:none;color:#d4d4d4;flex:1 1;font-family:Courier New,Courier,monospace;font-size:16px;line-height:1.6;overflow:auto;padding:1rem;resize:none}.code-editor-simple:focus{outline:none}.code-editor-simple.light{background:#fff;color:#333}.code-editor-simple::placeholder{color:#666}.name-prompt-overlay{align-items:center;background:#000c;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.name-prompt-card{animation:slideUp .3s ease-out;background:#fff;border-radius:20px;max-width:400px;padding:3rem;text-align:center;width:90%}.name-prompt-card h2{color:#333;margin-bottom:.5rem}.name-prompt-card p{color:#666;margin-bottom:2rem}.name-input{border:2px solid #e0e0e0;border-radius:10px;font-family:inherit;font-size:1rem;margin-bottom:1rem;padding:1rem;width:100%}.name-input:focus{border-color:#667eea;outline:none}.editor-page{gap:0;height:100%;max-height:calc(100vh - 120px)}.editor-container,.editor-page{display:flex;flex:1 1;overflow:hidden}.editor-container{border-radius:15px 0 0 15px;box-shadow:0 10px 40px #0003;flex-direction:column;margin:1rem 0 1rem 1rem;max-height:100%}.editor-main{display:flex;flex:1 1;min-height:0;overflow:hidden}.editor-sidebar{background:#2d3748;border-right:1px solid #4a5568;overflow-y:auto;padding:1rem;width:200px}.users-list h4{color:#fff;font-size:.9rem;letter-spacing:1px;margin-bottom:1rem;text-transform:uppercase}.users-items{display:flex;flex-direction:column;gap:.75rem}.user-item{gap:.75rem}.user-avatar,.user-item{align-items:center;display:flex}.user-avatar{border-radius:50%;color:#fff;font-size:.9rem;font-weight:700;height:32px;justify-content:center;width:32px}.user-name{color:#ffffffe6;font-size:.9rem}.chat-container{background:#2d3748;border-left:1px solid #4a5568;display:flex;flex-direction:column;flex-shrink:0;max-height:100%;min-height:0;transition:width .3s ease;width:350px}.chat-container.closed{overflow:visible;width:50px}.chat-container.closed .chat-header h3{display:none}.chat-container.closed .chat-toggle-btn{margin:0 auto}.chat-messages{display:flex;flex:1 1;flex-direction:column;gap:1rem;max-height:100%;min-height:0;overflow-x:hidden;overflow-y:auto;padding:1rem}.chat-header{align-items:center;background:#1a202c;border-bottom:1px solid #4a5568;display:flex;flex-shrink:0;justify-content:space-between;padding:1rem}.chat-container.closed .chat-header{justify-content:center;padding:1rem .5rem}.chat-header h3{color:#fff;font-size:1rem;margin:0;white-space:nowrap}.chat-toggle-btn{background:#ffffff1a;border:none;border-radius:5px;color:#fff;cursor:pointer;flex-shrink:0;font-size:1.2rem;padding:.5rem .75rem;transition:background .2s}.chat-toggle-btn:hover{background:#fff3}.chat-empty{color:#ffffff80;font-size:.9rem;padding:2rem 1rem;text-align:center}.chat-message{animation:slideIn .2s ease-out;display:flex;flex-direction:column;gap:.25rem}@keyframes slideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chat-user{display:inline-block;font-size:.85rem;font-weight:700}.chat-time{color:#ffffff80;font-size:.75rem;margin-left:.5rem}.chat-text{word-wrap:break-word;background:#ffffff0d;border-radius:8px;color:#ffffffe6;font-size:.9rem;line-height:1.4;padding:.5rem .75rem}.chat-input-form{background:#2d3748;border-top:1px solid #4a5568;display:flex;flex-shrink:0;gap:.5rem;padding:1rem}.chat-input{background:#ffffff0d;border:1px solid #4a5568;border-radius:8px;color:#fff;flex:1 1;font-family:inherit;font-size:.9rem;padding:.75rem}.chat-input:focus{background:#ffffff14;border-color:#667eea;outline:none}.chat-input::placeholder{color:#fff6}.chat-send-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:.75rem 1.5rem;transition:all .2s}.chat-send-btn:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-1px)}.chat-send-btn:active{transform:translateY(0)}.chat-send-btn:disabled{cursor:not-allowed;opacity:.5;transform:none}.chat-messages::-webkit-scrollbar{width:8px}.chat-messages::-webkit-scrollbar-track{background:#1a202c;border-radius:4px}.chat-messages::-webkit-scrollbar-thumb{background:#4a5568;border-radius:4px}.chat-messages::-webkit-scrollbar-thumb:hover{background:#667eea}
/*# sourceMappingURL=main.a9af90ad.css.map*/