*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,"sans-serif";background:#009688;color:#333}.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center}.auth-card{background:#fff;padding:2.5rem 2rem;border-radius:12px;box-shadow:0 8px 32px #2c3e5026;width:340px;display:flex;flex-direction:column;align-items:center}.auth-card h2{margin-bottom:1.5rem;color:#222;font-weight:700;letter-spacing:1px}.auth-card input{width:100%;padding:.8rem;margin-bottom:1rem;border:1px solid #ddd;border-radius:6px;font-size:1rem;transition:border-color .2s;background:#f8f8f8}.auth-card input:focus{border-color:#009688;outline:none}.auth-card button{width:100%;padding:.8rem;background:#009688;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;margin-bottom:1rem;transition:background .2s}.auth-card button:hover{background:#00796b}.auth-card p{font-size:.95rem;color:#333;margin-top:.5rem}.auth-card a{color:#009688;text-decoration:none;font-weight:500;transition:color .2s}.auth-card a:hover{color:#00796b}.auth-card .forgot{align-self:flex-start;margin-bottom:1rem;font-size:.95rem}@media (max-width: 700px){.auth-card{width:95vw;padding:1.5rem .5rem;min-width:unset}}.home-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:#009688}.home-card{background:#fff;padding:2.5rem 2rem;border-radius:12px;box-shadow:0 8px 32px #2c3e5026;width:400px;display:flex;flex-direction:column;align-items:center}.home-card h2{margin-bottom:1rem;color:#222;font-weight:700}.home-card h3{margin:1.5rem 0 .5rem;color:#009688;font-size:1.1rem}.home-input{width:100%;padding:.8rem;margin-bottom:1rem;border:1px solid #ddd;border-radius:6px;font-size:1rem;background:#f8f8f8}.room-list{width:100%;list-style:none;margin-bottom:1rem;padding:0}.room-item{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem;background:#f8f8f8;padding:.5rem .8rem;border-radius:6px}.room-id{font-family:monospace;font-size:.95rem;color:#333}.room-join-btn,.room-create-btn{padding:.5rem 1.2rem;background:#009688;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:500;cursor:pointer;margin-left:.5rem;transition:background .2s}.room-join-btn:disabled{background:#b2dfdb;cursor:not-allowed}.room-join-btn:hover:not(:disabled),.room-create-btn:hover{background:#00796b}.join-form{width:100%;display:flex;gap:.5rem;margin-top:1rem}@media (max-width: 700px){.home-card{width:95vw;padding:1.5rem .5rem;min-width:unset}}@media (max-width: 500px){.home-card{width:98vw;padding:1rem .2rem;border-radius:8px}.room-list,.join-form{flex-direction:column;gap:.3rem}}.editor-container{display:flex;height:100vh}.sidebar{width:250px;padding:1.5rem;background-color:#2c3e50;color:#ecf0f1}.sidebar .room-info{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-bottom:1rem}.sidebar .room-info h2{margin-bottom:1rem;font-size:1.2rem}.sidebar .room-info .copy-button{padding:.5rem 1rem;background-color:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .3s ease}.sidebar .room-info .copy-button:hover{background-color:#2980b9}.sidebar .room-info .copy-success{margin-left:.5rem;color:#26a726;font-size:.8rem}.sidebar h3{margin-top:1.5rem;margin-bottom:.5rem;font-size:1rem}.sidebar ul{list-style:none;padding-left:0}.sidebar ul li{padding:.5rem;font-size:.9rem;background:gray;margin-top:5px;border-radius:5px}.sidebar .typing-indicator{margin-top:1rem;font-size:1rem;color:#fff}.sidebar .language-selector{margin-top:1rem;width:100%;padding:.5rem;background-color:#34495e;color:#fff;border:none;border-radius:4px}.sidebar .leave-button{margin-top:1rem;width:100%;padding:.75rem;background-color:#e74c3c;color:#fff;border:none;border-radius:4px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.sidebar .leave-button:hover{background-color:#ab2a1c}.editor-wrapper{flex-grow:1;background-color:#050514;padding:2rem;box-shadow:0 8px 32px #2c3e5026;display:flex;flex-direction:column;border-radius:12px}.run-btn{background-color:#0cd126;padding:10px;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:1rem;margin-bottom:1rem;transition:background .2s}.run-btn:hover{background-color:#0a7d1a}.output-console{width:100%;margin-top:10px;padding:10px;font-size:20px;height:200px;border:1px solid #ddd;border-radius:6px;background:#f8f8f8;resize:vertical}.input-console{width:100%;height:80px;margin-top:10px;padding:10px;font-family:monospace;background-color:#1e1e1e;color:#fff;border:1px solid #444;border-radius:6px;resize:none}@media (max-width: 900px){.editor-container{flex-direction:column;align-items:stretch;padding:1rem 0}.sidebar{width:100vw;min-width:unset;margin-bottom:1rem;border-radius:12px;box-shadow:0 8px 32px #2c3e5026}.editor-wrapper{width:100vw;min-width:unset;padding:1rem;border-radius:12px;box-shadow:0 8px 32px #2c3e5026}}@media (max-width: 700px){.input-console,.output-console{font-size:1rem;height:120px;padding:8px}.run-btn{font-size:.95rem;padding:8px}}@media (max-width: 500px){.editor-wrapper,.sidebar{width:98vw;padding:1rem .2rem;border-radius:8px}}.auth-container,.home-container,.editor-container{min-height:100vh;height:100vh;overflow-y:auto}@media (max-width: 700px){.auth-card,.home-card,.editor-wrapper,.sidebar{max-height:90vh;overflow-y:auto}}.logout-button{background:#e74c3c}.logout-button:hover{background-color:#c0392b}.room-create-btn,.logout-button{padding:.6rem 1.2rem;font-size:1rem;border-radius:5px;border:none;height:44px;cursor:pointer;transition:background .2s;display:inline-block}.final{display:flex;justify-content:space-between;width:100%;margin-top:1rem}
