:root{--bg: #0f1420;--bg-elev: #171e2e;--bg-elev-2: #1f2740;--border: #2a3450;--text: #e8ecf5;--muted: #8a93ab;--accent: #4f7cff;--accent-2: #6d5cff;--on: #35d07f;--off: #e0555b;--warn: #e6b23a;--radius: 14px;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:radial-gradient(1200px 800px at 70% -10%,#1a2338 0%,var(--bg) 55%);color:var(--text)}#app{min-height:100%;display:flex;flex-direction:column}button{cursor:pointer;font:inherit;border:1px solid var(--border);background:var(--bg-elev-2);color:var(--text);border-radius:10px;padding:.55rem .9rem;transition:background .15s,border-color .15s,transform .05s}button:hover{border-color:var(--accent)}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));border:none;font-weight:600}button.ghost{background:transparent;padding:.4rem .6rem;font-size:1.05rem}button.ghost.active{border-color:var(--accent);color:var(--accent)}input,select{font:inherit;color:var(--text);background:var(--bg-elev);border:1px solid var(--border);border-radius:10px;padding:.6rem .75rem}input:focus,select:focus{outline:none;border-color:var(--accent)}.muted{color:var(--muted)}.error{color:var(--off);min-height:1.2em;margin:.4rem 0 0;font-size:.9rem}.login-wrap{flex:1;display:grid;place-items:center;padding:1.5rem}.login-card{width:min(360px,100%);background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:2rem 1.6rem;display:flex;flex-direction:column;gap:.7rem;box-shadow:0 20px 60px #0006}.login-card .logo{font-size:1.6rem;font-weight:800;letter-spacing:.5px}.login-card input,.login-card button{padding:.8rem}.topbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:1rem;padding:.7rem 1rem;padding-top:max(.7rem,env(safe-area-inset-top));background:#0f1420d9;backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}.topbar .brand{font-weight:800;font-size:1.15rem}.topbar .status{display:flex;gap:.9rem;margin-left:auto;font-size:.8rem;color:var(--muted)}.status-item{display:inline-flex;align-items:center;gap:.35rem}.topbar .actions{display:flex;gap:.35rem}.dot{width:9px;height:9px;border-radius:50%;background:var(--muted);display:inline-block}.dot.on{background:var(--on);box-shadow:0 0 8px var(--on)}.dot.off{background:var(--off)}.dot.warn{background:var(--warn)}.layout{flex:1;display:grid;gap:1rem;padding:1rem 1rem 6rem;grid-template-columns:1fr;max-width:1000px;width:100%;margin:0 auto}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.card h2{margin:0 0 .7rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.conn-card .conn-text{font-weight:600}.members{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem}.members .empty{padding:.4rem 0}.member{display:flex;align-items:center;gap:.6rem;padding:.45rem .5rem;border-radius:10px;cursor:pointer}.member:hover{background:var(--bg-elev-2)}.avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.85rem;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff}.feed-card{display:flex;flex-direction:column;min-height:300px}.feed{display:flex;flex-direction:column;gap:.55rem;overflow-y:auto;max-height:60vh;padding-right:.2rem}.feed-item{font-size:.92rem}.feed-item.event{display:flex;align-items:center;gap:.5rem;color:var(--muted)}.feed-item.event .ev-text{color:var(--text)}.feed-item.event.poke .ev-text{color:var(--warn);font-weight:600}.ft-time{color:var(--muted);font-size:.72rem;margin-left:auto;white-space:nowrap}.feed-item.msg{display:flex}.feed-item.msg.out{justify-content:flex-end}.bubble{max-width:78%;background:var(--bg-elev-2);border:1px solid var(--border);border-radius:14px;padding:.5rem .7rem}.feed-item.msg.out .bubble{background:linear-gradient(135deg,#4f7cff40,#6d5cff40);border-color:var(--accent)}.bubble .meta{display:flex;align-items:center;gap:.4rem;margin-bottom:.15rem}.bubble .who{font-weight:600;font-size:.8rem}.bubble .body{white-space:pre-wrap;word-break:break-word}.badge{font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;padding:.1rem .4rem;border-radius:6px;background:var(--border);color:var(--text)}.badge.private{background:#3a2b57}.badge.channel{background:#26406b}.badge.server{background:#4a3320}.modal-overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#060910b8;backdrop-filter:blur(6px);padding:1.2rem}.modal-card{width:min(380px,100%);max-height:90vh;overflow-y:auto;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:1.4rem;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 24px 70px #0000008c}.modal-card h2{margin:0;font-size:1.15rem}.modal-card h3{margin:.6rem 0 0;font-size:.75rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}.modal-card .small{font-size:.8rem;margin:0}.modal-card p{margin:0}.qr{width:100%;max-width:240px;align-self:center;background:#fff;border-radius:12px;padding:10px}.cmd-row{display:flex;gap:.5rem;align-items:stretch}.cmd{flex:1;min-width:0;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:.55rem .7rem;font-size:.78rem;overflow-x:auto;white-space:nowrap;color:var(--text)}.copy{white-space:nowrap;font-size:.8rem}.composer{position:fixed;bottom:0;left:0;right:0;display:flex;gap:.5rem;padding:.7rem 1rem;padding-bottom:max(.7rem,env(safe-area-inset-bottom));background:#0f1420eb;backdrop-filter:blur(10px);border-top:1px solid var(--border)}.composer .msg-input{flex:1;min-width:0}.composer .scope,.composer .target{flex:0 0 auto;max-width:40vw}@media (min-width: 720px){.layout{grid-template-columns:300px 1fr;grid-template-areas:"status feed" "members feed"}.conn-card{grid-area:status}.card:nth-child(2){grid-area:members}.feed-card{grid-area:feed}.composer{max-width:1000px;margin:0 auto;border-radius:var(--radius) var(--radius) 0 0}}