*{box-sizing:border-box;font-family:Inter,system-ui,Arial,sans-serif}body #app{margin:0;background:#f3f4f6;color:#111827;display:flex;align-items:center;justify-content:center;height:100vh}.chat-container{width:100%;max-width:720px;background:#fff;border-radius:12px;box-shadow:0 8px 24px #0f172a14;padding:16px;display:flex;flex-direction:column;height:80vh}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}#messages{list-style:none;padding:8px;margin:0;flex:1 1 auto;overflow-y:auto;border:1px solid #e5e7eb;border-radius:8px}#messages li{padding:8px;margin-bottom:6px;border-radius:8px;max-width:80%}#messages li .meta{font-size:12px;color:#6b7280;margin-bottom:4px}#messages li.me{margin-left:auto;background:#dcfce7;text-align:right}#messages li.other{margin-right:auto;background:#f3f4f6;text-align:left}form{display:flex;gap:8px;margin-top:12px}input#input{flex:1;padding:10px 12px;border-radius:8px;border:1px solid #e5e7eb;outline:none}button{padding:10px 14px;border-radius:8px;border:none;background:#2563eb;color:#fff;cursor:pointer}button:active{transform:translateY(1px)}.layout{display:flex;height:80vh;width:100%;max-width:900px;gap:16px}.users-panel{width:200px;background:#fff;border-radius:12px;border:1px solid #e5e7eb;padding:12px;overflow-y:auto;box-shadow:0 8px 24px #0000000d}.users-panel h2{margin:0 0 8px;font-size:16px;border-bottom:1px solid #eee;padding-bottom:4px}#users{list-style:none;margin:0;padding:0}#users li{padding:6px 4px;border-bottom:1px solid #f3f4f6}#users li:last-child{border-bottom:none}#users .me{font-weight:700;color:#2563eb}@media(max-width:768px){.layout{flex-direction:column;height:auto}.users-panel{width:100%;order:2;margin-top:12px}.chat-container{width:100%;order:1}#messages{height:50vh}}.modal{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:999}.modal-content{background:#fff;padding:20px;border-radius:8px;width:280px;display:flex;flex-direction:column;gap:10px;text-align:center}.modal input{padding:10px;font-size:1rem}.modal button{padding:10px;cursor:pointer;background:#222;color:#fff}