:root{--bg: #0f172a;--panel: #111827;--card: #1f2933;--messageCard: #2f3f4e;--border: #2d3748;--text: #e5e7eb;--muted: #9ca3af;--accent: #6366f1;--danger: #ef4444;--success: #22c55e;font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;padding:0}body{margin:0;background-color:var(--border);color:var(--text)}button{background:var(--accent);color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer}button:hover{opacity:.9}input{width:80%;background:var(--panel);border:1px solid var(--border);color:var(--text);padding:.5rem;border-radius:6px}#root{margin:0 auto;padding:.5rem}.app{display:flex;flex-direction:column;gap:1.5rem}.user-btn{position:fixed;top:12px;right:12px;z-index:1000}.log-menu{position:fixed;top:50px;right:12px;width:280px;background:#111;border:1px solid #333;padding:12px;z-index:1001;box-shadow:0 8px 30px #0006}.log-menu button,.log-menu input{width:100%;margin-bottom:8px}.loginBlock{width:320px;padding:2rem;background:var(--card);border-radius:8px;display:flex;flex-direction:column;gap:1.5rem}.loginWrapper{min-height:100vh;width:100vw;display:flex;align-items:center;justify-content:center}.loginBlock form{display:flex;flex-direction:column;gap:1rem}.loginBlock input,.loginBlock button{width:auto;padding:.75rem;font-size:1rem}.loginBlock>div{display:flex;gap:1rem;justify-content:space-between}.roomGrid{margin:5px;height:90vh;overflow-y:auto;border-radius:10px;background-color:var(--card);display:grid;padding:16px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem}.card{padding:1rem;border-radius:10px;gap:.5rem;background-color:var(--panel);display:flex;flex-direction:column}.actions{display:flex;justify-content:space-around;gap:.5rem}.chatWidget{margin:5px;display:flex;justify-content:space-between;flex-direction:column;background:var(--card);border-radius:10px;overflow:hidden;height:93vh}.convHeader{display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;padding:8px;overflow-y:auto;height:10%}.convList{display:flex;flex-direction:row;gap:.5rem;padding:8px}.convcard{padding:.5rem .75rem;background:var(--panel);border-radius:6px;cursor:pointer;overflow:hidden}.convcard:hover{background:var(--border)}.senderBox{display:flex;height:18%}.senderBox *{border:0px;padding:0}.textbox{width:70%}.sendbutton{width:30%;border-radius:0%}.messageCard{height:70%;display:flex;flex-direction:column;gap:.5rem;background:var(--messageCard);overflow-y:scroll}.msg{margin:5px;max-width:70%;padding:.5rem .75rem;border-radius:10px;font-size:.9rem}.msg--mine{align-self:flex-end;background:var(--accent);color:#fff}.msg--theirs{align-self:flex-start;background:var(--panel)}.createConvBox{margin:5px;display:flex;justify-content:space-around}.createConvBox>*{margin:5px}.convUtils{width:25%}.convUtils button{margin:3px}.grid{margin:5px;align-items:start;grid-auto-rows:max-content;height:90vh;overflow-y:auto;border-radius:10px;background-color:var(--card);padding:16px;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;display:grid}.itemcard{background-color:var(--panel);padding:1rem;border-radius:10px;display:flex;flex-direction:column;gap:.5rem}.main{display:grid;grid-template-columns:70% 30%;height:80%}.main>*{min-width:0}.toolbar{justify-content:space-around;height:10vh;height:5vh}.toolbutton{margin:.5rem;height:80%;width:10%}