:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{background:#f5f5f7;justify-content:center;min-height:100vh;margin:0;display:flex}#root{width:100%;max-width:480px;padding:2rem 1.5rem}body:has(.chat-screen) #root{max-width:640px}.loading{text-align:center;color:#888}button{cursor:pointer;font:inherit}.error{color:#c0392b}.auth-screen h1{text-align:center}.tabs{gap:.5rem;margin-bottom:1rem;display:flex}.tabs button{background:#fff;border:1px solid #ccc;border-radius:6px;flex:1;padding:.5rem}.tabs button.active{color:#fff;background:#2d6cdf;border-color:#2d6cdf}form{flex-direction:column;gap:.75rem;display:flex}label{flex-direction:column;gap:.25rem;font-size:.9rem;display:flex}input{font:inherit;border:1px solid #ccc;border-radius:6px;padding:.5rem}.auth-screen button[type=submit],.create-room button,.room-list button{color:#fff;background:#2d6cdf;border:none;border-radius:6px;padding:.5rem 1rem}.rooms-screen header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.user-info{align-items:center;gap:.5rem;display:flex}.create-room{flex-direction:row;margin-bottom:1rem}.create-room input{flex:1}.room-list{flex-direction:column;gap:.5rem;padding:0;list-style:none;display:flex}.room-list li{background:#fff;border:1px solid #e0e0e0;border-radius:8px;justify-content:space-between;align-items:center;gap:.5rem;padding:.75rem;display:flex}.room-list li.empty{color:#888;justify-content:center}.room-name{flex:1;font-weight:600}.room-meta{color:#666;font-size:.85rem}.chat-screen header{justify-content:space-between;align-items:flex-start;margin-bottom:1rem;display:flex}.chat-screen h1{margin:0 0 .25rem}.hint{color:#888;margin:0;font-size:.8rem}.message-list{flex-direction:column;gap:.5rem;min-height:240px;max-height:50vh;margin:0 0 1rem;padding:0;list-style:none;display:flex;overflow-y:auto}.message-list li{background:#fff;border:1px solid #e0e0e0;border-radius:8px;flex-direction:column;align-self:flex-start;gap:.15rem;max-width:80%;padding:.5rem .75rem;display:flex}.message-list li.mine{background:#e7f0ff;border-color:#bcd4f8;align-self:flex-end}.message-list li.empty{color:#888;background:0 0;border:none;align-self:center}.message-list .sender{color:#555;font-size:.75rem;font-weight:600}.message-form{flex-direction:row}.message-form input{flex:1}.message-form button{color:#fff;background:#2d6cdf;border:none;border-radius:6px;padding:.5rem 1rem}