.login-page{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:#2b2d31f5;border:1px solid #ffffff0f;border-radius:24px;width:100%;max-width:440px;padding:32px;box-shadow:0 24px 60px #00000059}.login-logo{color:#aab3ff;letter-spacing:.04em;background:#5865f226;border-radius:999px;width:fit-content;margin:0 auto 18px;padding:10px 16px;font-weight:700}.login-title{text-align:center;color:#fff;font-size:28px;font-weight:800}.login-subtitle{text-align:center;color:#b5bac1;margin-top:8px;font-size:14px}.login-form{flex-direction:column;gap:12px;margin-top:28px;display:flex}.login-label{color:#b5bac1;font-size:13px;font-weight:600}.login-input{color:#f2f3f5;background:#1e1f22;border:1px solid #3a3d44;border-radius:14px;outline:none;width:100%;padding:14px 16px;font-size:15px;transition:all .15s}.login-input:focus{border-color:#5865f2;box-shadow:0 0 0 3px #5865f22e}.login-input::placeholder{color:#7e838c}.login-error{color:#ff9b9d;background:#ed42451f;border:1px solid #ed424533;border-radius:12px;padding:12px 14px;font-size:14px}.login-button{color:#fff;cursor:pointer;background:#5865f2;border:none;border-radius:14px;width:100%;margin-top:8px;padding:14px 16px;font-size:15px;font-weight:700;transition:all .15s}.login-button:hover{background:#4752c4}.login-button:disabled{opacity:.7;cursor:not-allowed}*{box-sizing:border-box}body{color:#f2f3f5;background:#1e1f22;margin:0;font-family:Inter,Arial,sans-serif}.chat-layout{background:#313338;grid-template-columns:280px 1fr 280px;height:100vh;display:grid}.sidebar{background:#2b2d31;border-right:1px solid #1f2023;flex-direction:column;gap:16px;padding:16px;display:flex}.sidebar-header{flex-direction:column;gap:10px;display:flex}.app-title{color:#fff;font-size:22px;font-weight:700}.status-badge{text-transform:capitalize;border-radius:999px;width:fit-content;padding:6px 10px;font-size:12px}.status-connected{color:#57f287;background:#23a55a33}.status-connecting{color:#f0b232;background:#faa61a26}.status-closed,.status-error{color:#ed4245;background:#ed424526}.rooms-title{color:#b5bac1;text-transform:uppercase;letter-spacing:.08em;font-size:13px}.rooms-list{flex-direction:column;gap:8px;display:flex;overflow-y:auto}.room-item{text-align:left;color:#dbdee1;cursor:pointer;background:#35373c;border:none;border-radius:12px;padding:14px;transition:all .15s}.room-item:hover{background:#404249}.room-item.active{color:#fff;background:#5865f2}.room-name{font-size:15px;font-weight:600}.room-id{opacity:.8;margin-top:4px;font-size:12px}.logout-btn{color:#fff;cursor:pointer;background:#da373c;border:none;border-radius:12px;margin-top:auto;padding:12px;font-weight:600}.logout-btn:hover{background:#b52d31}.chat-main{background:#313338;grid-template-rows:72px 1fr 84px;display:grid}.chat-header{background:#313338;border-bottom:1px solid #232428;align-items:center;padding:0 20px;display:flex}.chat-room-name{font-size:20px;font-weight:700}.chat-room-subtitle{color:#b5bac1;margin-top:4px;font-size:13px}.messages-area{flex-direction:column;gap:10px;padding:20px;display:flex;overflow-y:auto}.empty-state{color:#949ba4;margin:auto;font-size:15px}.message-card{background:#2b2d31;border:1px solid #232428;border-radius:16px;padding:14px 16px}.message-top{align-items:center;gap:10px;margin-bottom:6px;display:flex}.message-author{color:#fff;font-weight:700}.message-time{color:#949ba4;font-size:12px}.message-text{color:#dbdee1;white-space:pre-wrap;word-break:break-word;line-height:1.4}.message-input-bar{background:#313338;border-top:1px solid #232428;align-items:center;gap:12px;padding:16px 20px;display:flex}.message-input{color:#f2f3f5;background:#383a40;border:none;border-radius:14px;outline:none;flex:1;padding:14px 16px;font-size:15px}.message-input::placeholder{color:#949ba4}.send-btn{color:#fff;cursor:pointer;background:#5865f2;border:none;border-radius:14px;padding:14px 18px;font-weight:600}.send-btn:hover{background:#4752c4}.users-panel{background:#2b2d31;border-left:1px solid #1f2023;flex-direction:column;padding:16px;display:flex}.users-header{margin-bottom:16px;font-size:16px;font-weight:700}.users-list{flex-direction:column;gap:10px;display:flex;overflow-y:auto}.users-empty{color:#949ba4;font-size:14px}.user-card{background:#35373c;border-radius:14px;align-items:center;gap:12px;padding:12px;display:flex}.user-avatar{color:#fff;background:#5865f2;border-radius:999px;justify-content:center;align-items:center;width:40px;height:40px;font-weight:700;display:flex}.user-meta{flex-direction:column;gap:3px;display:flex}.user-name{font-weight:600}.user-id{color:#949ba4;font-size:12px}@media (width<=1100px){.chat-layout{grid-template-columns:240px 1fr}.users-panel{display:none}}@media (width<=760px){.chat-layout{grid-template-columns:1fr}.sidebar{display:none}}.logs-panel{border-top:1px solid #1f2023;margin-top:16px;padding-top:12px}.logs-header{color:#b5bac1;margin-bottom:8px;font-size:13px}.logs-list{color:#9ca3af;background:#111217;border-radius:12px;max-height:180px;padding:10px;font-family:monospace;font-size:11px;overflow-y:auto}.log-line{white-space:pre-wrap;margin-bottom:4px}