*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,"sans-serif";background:#1c1e29;color:#333}.join-container{display:flex;justify-content:center;align-items:center;height:100vh;background:linear-gradient(135deg,#1c1e29,#010d5020)}.join-container .join-form{background-color:#282a36;padding:2rem;border-radius:8px;box-shadow:0 4px 6px #0000001a;text-align:center;width:300px}.join-container .join-form h1{margin-bottom:1.5rem;color:#fff}.join-container .join-form input{width:100%;padding:.75rem;margin-bottom:1rem;border:1px solid #ddd;border-radius:4px;background:#eee;font-size:16PX;font-weight:700}.join-container .join-form button{width:100%;padding:.75rem;background-color:#4aed88;color:#333;border:none;border-radius:4px;font-size:16px;font-weight:700;cursor:pointer;transition:background-color .3s ease}.join-container .join-form button:hover{background-color:#2b824c}.editor-container{display:flex;height:100vh}.editor-container .sidebar{width:250px;padding:1.5rem;background-color:#2c3e50;color:#ecf0f1}.editor-container .sidebar .room-info{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:1rem}.editor-container .sidebar .room-info h2{margin-bottom:1rem;font-size:1.2rem}.editor-container .sidebar .room-info .copy-button{padding:.5rem 1rem;background-color:#3498db;color:#fff;border:none;border-radius:4px;font-weight:700;cursor:pointer;transition:background-color .3s ease}.editor-container .sidebar .room-info .copy-button:hover{background-color:#2980b9}.editor-container .sidebar .room-info .copy-success{margin-left:.5rem;color:#26a726;font-size:.8rem}.editor-container .sidebar h3{margin-top:1.5rem;margin-bottom:.5rem;font-size:1rem}.editor-container .sidebar ul{list-style:none}.editor-container .sidebar ul li{padding:.5rem;font-size:.9rem;background:gray;margin-top:5px;border-radius:5px}.editor-container .sidebar .typing-indicator{margin-top:1rem;font-size:1rem;color:#fff}.editor-container .sidebar .language-selector{margin-top:1rem;width:100%;padding:.5rem;background-color:#34495e;color:#fff;border:none;border-radius:4px}.editor-container .sidebar .leave-button{margin-top:1rem;width:100%;padding:.75rem;background-color:#4aed88;color:#000;border:none;border-radius:4px;font-size:1rem;font-weight:700;cursor:pointer;transition:background-color .3s ease}.editor-container .sidebar .leave-button:hover{background-color:#2b824c}.editor-container .editor-wrapper{flex-grow:1;background-color:#fff}.run-btn{background-color:#0f7fa4;padding:10px;font-weight:700}.output-console{width:100%;margin-top:10px;padding:10px;font-size:20px;height:200px}
