*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:#f0f2f5;color:#1a1a2e}.container{max-width:800px;margin:0 auto;padding:1rem}.card{background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a;padding:1rem;margin-bottom:1rem}.btn{display:inline-block;padding:.5rem 1rem;border:none;border-radius:4px;cursor:pointer;font-size:.9rem;transition:background .2s}.btn-primary{background-color:#1877f2;color:#fff}.btn-primary:hover{background-color:#1558b0}.btn-secondary{background-color:#e4e6eb;color:#1c1e21}.btn-secondary:hover{background-color:#d0d2d7}.btn-danger{background-color:#e74c3c;color:#fff}.btn-danger:hover{background-color:#c0392b}.input{width:100%;padding:.5rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;margin-bottom:.5rem}.avatar{width:40px;height:40px;border-radius:50%;object-fit:cover}.sidebar{width:300px;background:#fff;border-right:1px solid #ddd;height:100vh;overflow-y:auto}.chat-area{flex:1;display:flex;flex-direction:column;height:100vh}.messages{flex:1;overflow-y:auto;padding:1rem}.message{margin-bottom:.5rem;display:flex}.message.sent{justify-content:flex-end}.message .bubble{max-width:60%;padding:.5rem .75rem;border-radius:12px;background:#e4e6eb}.message.sent .bubble{background:#1877f2;color:#fff}.message .sender-name{font-size:.75rem;color:#666;margin-bottom:.25rem}.message .timestamp{font-size:.7rem;color:#999;margin-top:.25rem;text-align:right}.typing{font-style:italic;color:#666;font-size:.8rem;padding:.5rem 1rem}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center}.modal{background:#fff;border-radius:8px;padding:2rem;width:400px;max-width:90%}