:root{--bg: #1e1f22;--bg-elev: #2b2d31;--bg-hover: #35373c;--border: #3f4147;--text: #f2f3f5;--muted: #b5bac1;--accent: #5865f2;--green: #23a559;--danger: #da373c;--font: "Segoe UI", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;font-family:var(--font);background:var(--bg);color:var(--text)}#app-root{display:flex;flex-direction:column;height:100%}.auth-banner{padding:.5rem 1rem;background:var(--bg-elev);border-bottom:1px solid var(--border);display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:space-between;font-size:.85rem}.auth-banner-main{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.auth-banner-aside{flex-shrink:0}.auth-banner-aside .desktop-dl{color:var(--accent);text-decoration:none;font-weight:600;white-space:nowrap}.auth-banner-aside .desktop-dl:hover{text-decoration:underline}.auth-banner--guest{flex-direction:column;align-items:stretch}.auth-hint-wrap{width:100%;display:flex;flex-direction:column;gap:.35rem}.auth-hint{font-size:.8rem;line-height:1.35}.auth-hint--muted{color:var(--muted)}.auth-hint--err{color:var(--danger);font-weight:600}.auth-banner input{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:4px;padding:.25rem .5rem}.auth-banner button{background:var(--accent);color:#fff;border:none;border-radius:4px;padding:.35rem .75rem;cursor:pointer}.auth-banner button.secondary{background:var(--bg-hover);color:var(--text)}.layout{display:flex;flex:1;min-height:0}.guild-rail{width:72px;background:#111214;display:flex;flex-direction:column;align-items:center;padding:.5rem 0;gap:.5rem;overflow-y:auto}.guild-icon{width:48px;height:48px;border-radius:50%;background:var(--bg-elev);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.65rem;font-weight:700;color:var(--muted);border:2px solid transparent;flex-shrink:0}.guild-icon:hover{border-radius:35%;background:var(--accent);color:#fff}.guild-icon.guild-add{font-size:1.35rem;font-weight:300;color:var(--accent)}.guild-icon.guild-add:hover{color:#fff}.modal-hint{font-size:.8rem;color:var(--muted);margin:0 0 .75rem}.modal-field{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.65rem;font-size:.8rem;color:var(--muted)}.modal-input{width:100%;box-sizing:border-box;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:.45rem .5rem;font-family:inherit;font-size:.9rem}.modal-input[readonly]{opacity:.75;cursor:default}width: 240px; background: var(--bg-elev); display: flex; flex-direction: column; border-right: 1px solid var(--border); } .guild-header{padding:.75rem 1rem;font-weight:700;box-shadow:0 1px 0 var(--border)}.channel-tools{padding:.25rem .5rem;border-bottom:1px solid var(--border)}.channel-tools-inner{display:flex;gap:.35rem}button.tiny{font-size:.7rem;padding:.2rem .45rem;background:var(--bg-hover);color:var(--text);border:1px solid var(--border);border-radius:4px;cursor:pointer}.composer{display:flex;gap:.5rem;padding:.5rem 1rem;border-top:1px solid var(--border);background:var(--bg-elev)}.composer input{flex:1;background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:4px;padding:.4rem .6rem}.composer button{background:var(--accent);color:#fff;border:none;border-radius:4px;padding:.4rem .75rem;cursor:pointer}.channel-list{flex:1;overflow-y:auto;padding:.35rem}.channel-item{padding:.35rem .5rem;border-radius:4px;cursor:pointer;color:var(--muted);font-size:.9rem}.channel-item:hover{background:var(--bg-hover);color:var(--text)}.channel-item.active{background:#3c3f45;color:var(--text)}.main-panel{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg)}.toolbar{height:48px;border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 1rem;gap:.75rem;font-weight:600}.toolbar .spacer{flex:1}.toolbar button{background:var(--green);color:#fff;border:none;border-radius:4px;padding:.35rem .75rem;cursor:pointer;font-size:.8rem}.toolbar button:disabled{opacity:.45;cursor:not-allowed}.toolbar button.disconnect{background:var(--danger)}.messages{flex:1;overflow-y:auto;padding:1rem;font-size:.9rem}.msg{margin-bottom:.75rem;color:var(--muted)}.msg--local{border-left:3px solid var(--border);padding-left:.5rem;margin-left:-.15rem}.msg--local.msg--pending{border-left-color:var(--muted);opacity:.92}.msg--local.msg--sending{border-left-color:#e8a317}.msg--local.msg--failed{border-left-color:#ed4245;background:#ed42450f;border-radius:4px;padding:.35rem .5rem}.msg-delivery{font-size:.7rem;font-weight:500;color:var(--muted);margin-left:.35rem}.msg-delivery--pending{color:var(--muted)}.msg-delivery--sending{color:#e8a317}.msg-delivery--failed{color:#ed4245}button.tiny.msg-retry{margin-left:.35rem;font-size:.65rem;padding:.1rem .4rem;background:#ed424526;color:#ed4245;border:1px solid rgba(237,66,69,.35);border-radius:3px;cursor:pointer}button.tiny.msg-retry:hover{background:#ed424540}.msg-header{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .5rem;margin-bottom:.2rem}.msg .meta{color:var(--text);font-weight:600}.msg-body{display:block;color:var(--text);word-break:break-word;line-height:1.45}.msg-deleted{font-style:italic;opacity:.65}.msg-actions{margin-left:.35rem;display:inline-flex;gap:.2rem;vertical-align:middle}.msg-actions button.tiny{font-size:.65rem;padding:.1rem .35rem;background:var(--bg-hover);color:var(--muted);border:1px solid var(--border);border-radius:3px;cursor:pointer}.edited-hint{font-size:.75em;color:var(--muted);font-weight:400}.msg-react-row{margin-top:.35rem;display:flex;flex-wrap:wrap;gap:.25rem;align-items:center}.msg-reactions{display:inline-flex;flex-wrap:wrap;gap:.25rem;align-items:center}.msg-reactions button.react-pill{font-size:.75rem;padding:.1rem .45rem;border-radius:999px;background:var(--bg-hover);border:1px solid var(--border);color:var(--text);cursor:pointer}.msg-reactions button.react-pill:hover{border-color:var(--accent)}.msg-reactions button.react-pill.reacted{border-color:var(--accent);background:#5865f226}.msg-reactions button.react-add{font-size:.75rem;padding:.1rem .35rem;border-radius:4px;background:transparent;border:1px dashed var(--border);color:var(--muted);cursor:pointer}.msg-edit-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0000008c;display:flex;align-items:center;justify-content:center;z-index:1000}.msg-edit-dialog{width:min(520px,92vw);background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:1rem;box-shadow:0 8px 32px #0006}.msg-edit-title{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:var(--text)}.msg-edit-dialog textarea{width:100%;min-height:120px;box-sizing:border-box;margin-bottom:.75rem;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:.5rem;font-family:inherit;font-size:.9rem}.msg-edit-actions{display:flex;justify-content:flex-end;gap:.5rem}.voice-dev-wrap{display:none;align-items:center;gap:.35rem;margin-left:.35rem;flex-wrap:wrap}.voice-dev-wrap select{font-size:.72rem;max-width:160px;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:4px;padding:.15rem .25rem}.msg-attach-row{margin-top:.25rem;font-size:.8rem;display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}.msg-attachments{color:var(--muted)}.msg-attach-link{color:var(--accent);text-decoration:none}.msg-attach-link:hover{text-decoration:underline}.roles-hint{font-size:.8rem;color:var(--muted);margin:0 0 .75rem}.role-row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.4rem 0;border-bottom:1px solid var(--border)}.role-row.managed{opacity:.75}.role-row .muted{color:var(--muted);font-size:.75rem}.role-perm-label{font-size:.8rem;color:var(--muted)}.role-perm-inp{width:5rem;margin-left:.25rem}.members-panel{width:240px;background:var(--bg-elev);border-left:1px solid var(--border);display:flex;flex-direction:column}.members-header{padding:.75rem 1rem;font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--muted)}.member-list{flex:1;overflow-y:auto;padding:0 .5rem .5rem}.member{display:flex;align-items:flex-start;gap:.4rem;padding:.35rem .5rem;border-radius:4px;font-size:.85rem}.presence-dot{width:8px;height:8px;border-radius:50%;margin-top:.35rem;flex-shrink:0;background:var(--muted)}.presence-dot--online{background:#3ba55d}.presence-dot--idle{background:#faa81a}.presence-dot--dnd{background:#ed4245}.presence-dot--offline{background:#4f545c}.invites-list{max-height:40vh;overflow-y:auto;margin:.5rem 0}.invite-row{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;padding:.35rem 0;border-bottom:1px solid var(--border);font-size:.85rem}button.tiny.danger{color:#ed4245}.member:hover{background:var(--bg-hover)}.member .roles{font-size:.7rem;color:var(--muted)}.member--speaking .presence-dot{box-shadow:0 0 0 1px var(--bg-elev),0 0 0 3px #3ba55d}.voice-mic-activity{width:10px;height:10px;border-radius:50%;background:#4f545c;flex-shrink:0;align-self:center;transition:background .12s ease,box-shadow .12s ease}.voice-mic-activity.active{background:#3ba55d;box-shadow:0 0 10px #3ba55dd9;animation:voice-mic-pulse 1.1s ease-in-out infinite}@keyframes voice-mic-pulse{0%,to{box-shadow:0 0 6px #3ba55d8c}50%{box-shadow:0 0 12px #3ba55df2}}.voice-playback-fix{border-color:#faa81a!important;color:#f0c663}.status-bar{height:52px;background:#232428;border-top:1px solid var(--border);display:flex;align-items:center;padding:0 .5rem;font-size:.8rem;color:var(--muted)}.status-bar .voice-state{margin-left:auto;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-bar .status-version{font-size:.72rem;opacity:.88;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty-placeholder{color:var(--muted);padding:2rem;text-align:center}