:root{color-scheme:dark;--bg:#0f1720;--panel:#17212b;--panel-2:#1f2c39;--line:#243748;--text:#f3f7fb;--muted:#8ba0b3;--accent:#2b5278;--accent-2:#4ea4ff;--danger:#d95c6a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{min-height:100%;margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif}button,input{font:inherit}.authShell{min-height:100dvh;display:grid;place-items:center;background:linear-gradient(180deg,#101a23,#0d141b)}.authCard{width:min(420px,calc(100vw - 32px));background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:28px;display:grid;gap:12px}.authLogo{width:64px;height:64px;border-radius:20px;background:linear-gradient(180deg,#4e88c7,#2f6aa9);display:grid;place-items:center;font-weight:800;margin:0 auto 8px}.authTitle{text-align:center;font-size:24px;font-weight:800}.authInput{border:1px solid var(--line);background:#10202c;color:var(--text);border-radius:14px;padding:12px 14px}.authError{color:#ff9ca5;font-size:14px}.authButton{border:0;border-radius:14px;padding:12px 14px;background:var(--accent-2);color:#fff;font-weight:700}.appShell{display:grid;grid-template-columns:260px 360px 1fr 320px;height:100dvh;background:var(--bg)}.desktopSidebar,.listPane,.workspace,.auxPane,.singlePane{background:var(--panel)}.desktopSidebar{border-right:1px solid var(--line);padding:18px 14px;display:flex;flex-direction:column}.brandBlock{display:flex;gap:12px;align-items:center;padding:10px;margin-bottom:14px}.brandLogo{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(180deg,#4e88c7,#2f6aa9);font-weight:800}.brandTitle{font-weight:800}.brandSub{color:var(--muted);font-size:13px}.sidebarNav{display:grid;gap:8px}.sidebarBtn,.sidebarLogout{border:0;background:transparent;color:var(--text);display:flex;gap:12px;align-items:center;text-align:left;padding:12px 14px;border-radius:14px;cursor:pointer}.sidebarBtn.active,.sidebarBtn:hover,.sidebarLogout:hover{background:var(--panel-2)}.sidebarLogout{margin-top:auto;justify-content:center}.pane.list,.pane.chat,.pane.info{min-width:0}.listPane,.auxPane{border-right:1px solid var(--line);height:100%}.paneTop,.singleHeader{padding:16px;border-bottom:1px solid var(--line)}.paneTitle,.singleHeader{font-size:20px;font-weight:800}.searchField,.workspaceSearch{width:100%;margin-top:10px;border:1px solid var(--line);background:#10202c;color:var(--text);border-radius:14px;padding:12px 14px}.listScroll,.singleScroll{height:calc(100% - 88px);overflow:auto;padding:8px}.sectionTitle{padding:10px 8px 6px;font-size:12px;color:var(--muted);text-transform:uppercase;font-weight:700}.chatRow{width:100%;border:0;background:transparent;color:var(--text);display:flex;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;cursor:pointer}.chatRow:hover,.chatRow.active{background:#ffffff0a}.avatarCircle,.workspaceUserAvatar,.profileAvatar{width:46px;height:46px;border-radius:50%;background:var(--accent);display:grid;place-items:center;font-weight:700;flex:0 0 auto}.chatText{min-width:0;flex:1}.chatTop{display:flex;justify-content:space-between;gap:12px}.chatName{font-weight:700}.chatTime,.chatBottom,.profileSub,.bubbleMeta,.workspaceSub{color:var(--muted)}.chatBottom.typing{color:var(--accent-2)}.badge{min-width:28px;height:28px;border-radius:999px;background:var(--accent-2);display:grid;place-items:center;padding:0 8px;font-size:12px;font-weight:700}.badge.mention{background:var(--danger)}.workspace{display:flex;flex-direction:column;min-width:0;background:linear-gradient(180deg,#162330,#13202b)}.workspace.empty{display:grid;place-items:center}.workspaceHeader{display:flex;align-items:center;gap:12px;padding:max(12px,env(safe-area-inset-top)) 16px 12px;border-bottom:1px solid var(--line);background:#17212be0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.backBtn{border:0;background:transparent;color:var(--text);font-size:20px}.workspaceMeta{flex:1;min-width:0}.workspaceTitle{font-weight:800}.workspaceSearch{width:160px;margin-top:0}.pinnedStub{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);background:#ffffff05;color:var(--muted)}.mediaTabs{display:flex;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);overflow:auto}.mediaTab{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:8px 12px;white-space:nowrap}.mediaTab.active{color:var(--text);background:var(--panel-2)}.messagesScroll{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:10px}.messageRow{display:flex}.messageRow.mine{justify-content:flex-end}.bubble{max-width:76%;background:#1e2d3d;border-radius:18px;padding:12px 14px 10px}.bubble.mine{background:#2b5278}.bubbleSender{color:#90bce6;font-size:13px;margin-bottom:4px}.bubbleText{white-space:pre-wrap;line-height:1.35}.bubbleMeta{text-align:right;font-size:12px}.mention{color:#8ec4ff;font-weight:700}.replyMini{border-left:3px solid var(--accent-2);padding-left:8px;color:var(--muted);font-size:13px;margin-bottom:8px}.attachmentStub{border:1px solid rgba(255,255,255,.08);padding:8px 10px;border-radius:12px;margin-top:8px;display:flex;align-items:center;gap:10px}.thumb{width:42px;height:42px;object-fit:cover;border-radius:8px}.reactionsRow{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.reactionChip{border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:var(--text);border-radius:999px;padding:6px 10px}.reactionChip.mine{background:#4ea4ff2e;border-color:#4ea4ff73}.messageActions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}.actionButtons{display:flex;gap:4px;flex-wrap:wrap}.tinyBtn{border:0;background:#ffffff0f;color:var(--text);border-radius:999px;padding:4px 8px}.composerBlock{border-top:1px solid var(--line);background:#17212beb;padding:10px 12px calc(10px + env(safe-area-inset-bottom))}.replyPreview{display:flex;gap:10px;align-items:center;margin-bottom:8px}.replyBar{width:3px;height:32px;border-radius:999px;background:var(--accent-2)}.replyText{color:var(--muted);font-size:13px}.composer{display:flex;align-items:center;gap:10px}.composerRound{width:42px;height:42px;border-radius:50%;border:0;background:var(--accent);color:#fff}.composerRound.send{background:var(--accent-2)}.composerInput{flex:1;border:1px solid var(--line);background:#11202c;color:var(--text);border-radius:999px;padding:12px 14px}.auxTitle{padding:16px;border-bottom:1px solid var(--line);font-size:20px;font-weight:800}.profileCard{margin:16px;border:1px solid var(--line);border-radius:20px;background:#ffffff05;padding:24px;text-align:center}.profileCard.big{margin:16px}.profileAvatar{margin:0 auto 14px}.profileAvatar.large{width:76px;height:76px}.profileName{font-size:22px;font-weight:800}.sideInfoCard{margin:16px;border:1px solid var(--line);border-radius:18px;background:#ffffff05;padding:16px}.sideInfoTitle{color:var(--muted);font-size:13px;margin-bottom:6px}.sideInfoText{color:var(--text)}.singlePane{height:100%;overflow:auto;background:var(--panel)}.simpleRow{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:18px;background:#ffffff05;padding:12px;margin-bottom:10px}.settingsItem{border:1px solid var(--line);border-radius:18px;background:#ffffff05;padding:14px 16px;margin-bottom:10px}.emptyCard{margin:24px;padding:24px;border-radius:24px;background:#192734e6;border:1px solid var(--line);text-align:center}.emptyTitle{font-size:22px;font-weight:800}.emptySub{color:var(--muted);margin-top:8px}.mobileBottomNav,.pane.hide{display:none}.pane.show{display:block}@media (max-width:820px){.appShell{display:block;height:100dvh;padding-bottom:calc(76px + env(safe-area-inset-bottom))}.pane.info{display:none}.singlePane,.listPane,.workspace{min-height:calc(100dvh - 76px - env(safe-area-inset-bottom));border-right:0}.workspaceSearch{width:120px}.mobileBottomNav{position:fixed;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);background:#17212bf5;border-top:1px solid var(--line);padding:8px 8px calc(8px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.mobileNavBtn{border:0;background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px}.mobileNavBtn.active{color:var(--text)}}
