*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#1a1a1a;color:#ffffff;height:100vh;overflow:hidden}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.chat-container{height:100vh}}.chat-container{display:flex;flex-direction:column;height:100vh;max-width:800px;margin:0 auto;background:#2d2d2d}.chat-header{padding:1rem;background:#333;border-bottom:1px solid #444}.chat-header,.teacher-info{display:flex;align-items:center}.teacher-info{flex:1 1}.profile-pic{width:50px;height:50px;border-radius:50%;margin-right:1rem;object-fit:cover}.teacher-details h3{margin:0;color:#fff}.online-status{display:flex;align-items:center;color:#4CAF50;font-size:.9rem}.green-dot{width:8px;height:8px;background:#4CAF50;border-radius:50%;margin-right:5px}.teacher-toggle{display:flex;background:#444;border-radius:25px;padding:4px}.toggle-btn{padding:8px 16px;border:none;background:transparent;color:#ccc;border-radius:20px;cursor:pointer;transition:all .3s ease}.toggle-btn.active{background:#007bff;color:#fff}.toggle-btn:hover:not(.active){background:#555}.messages-container{flex:1 1;overflow-y:auto;padding:1rem;background:#1a1a1a}.message{display:flex;margin-bottom:1rem;animation:fadeIn .3s ease-in}.message.user{justify-content:flex-end}.message-content{max-width:70%;padding:12px 16px;border-radius:18px;word-wrap:break-word;line-height:1.4}.message.user .message-content{background:#007bff;color:white;border-bottom-right-radius:6px}.message.ai .message-content{background:#333;color:#fff;border-bottom-left-radius:6px}.input-container{display:flex;padding:1rem;background:#333;border-top:1px solid #444}.message-input{flex:1 1;padding:12px 16px;border:none;border-radius:25px;background:#444;color:#fff;outline:none;font-size:1rem;resize:none}.message-input::placeholder{color:#888}.message-input:focus{background:#555}.send-btn{margin-left:10px;padding:12px 20px;background:#007bff;color:white;border:none;border-radius:25px;cursor:pointer;transition:background .3s ease;font-weight:500}.send-btn:hover:not(:disabled){background:#0056b3}.send-btn:disabled{background:#555;cursor:not-allowed;opacity:.6}.typing-indicator{display:flex;align-items:center;padding:12px 16px;background:#333;border-radius:18px;border-bottom-left-radius:6px;max-width:70%;margin-bottom:1rem}.typing-dots{display:flex;gap:4px}.dot{width:8px;height:8px;background:#888;border-radius:50%;animation:typingAnimation 1.5s infinite}.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}@keyframes typingAnimation{0%,60%,to{opacity:.3;transform:scale(1)}30%{opacity:1;transform:scale(1.2)}}@media (max-width:768px){.chat-header{padding:.75rem;flex-wrap:wrap;gap:.5rem}.teacher-info{flex:1 1 100%;min-width:0}.teacher-toggle{flex-shrink:0}.toggle-btn{padding:6px 12px;font-size:.9rem}.profile-pic{width:40px;height:40px}.teacher-details h3{font-size:1rem}.message-content{max-width:85%;font-size:.95rem}.input-container{padding:.75rem}.message-input{font-size:16px}}@media (max-width:480px){.chat-header{padding:.5rem}.teacher-toggle{width:100%;margin-top:.5rem}.toggle-btn{flex:1 1;text-align:center}}.messages-container::-webkit-scrollbar{width:6px}.messages-container::-webkit-scrollbar-track{background:transparent}.messages-container::-webkit-scrollbar-thumb{background:#555;border-radius:3px}.messages-container::-webkit-scrollbar-thumb:hover{background:#666}.message-input:focus,.send-btn:focus,.toggle-btn:focus{outline:2px solid #007bff;outline-offset:2px}.send-btn:disabled{position:relative}.send-btn:disabled:after{content:"";position:absolute;width:16px;height:16px;margin:auto;border:2px solid transparent;border-top-color:#ffffff;border-radius:50%;animation:button-loading-spinner 1s ease infinite}@keyframes button-loading-spinner{0%{transform:rotate(0turn)}to{transform:rotate(1turn)}}