@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";:root{--bg:#0d151b;--panel:#17232c;--panel2:#1c2a34;--line:#2a3a45;--mine:#405e59;--other:#253642;--text:#e6edf0;--muted:#8999a4;--accent:#77a99c;--radius:8px;--side:280px;--max:860px}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,Arial,sans-serif;font-size:14px}.app{height:100dvh;display:flex;overflow:hidden}.sidebar{width:var(--side);border-right:1px solid var(--line);z-index:5;background:#17232c url(/sidebar-bg.png) 0/cover no-repeat;flex-direction:column;display:flex;position:relative}.sidebar:before{content:"";-webkit-backdrop-filter:grayscale()saturate(.55);backdrop-filter:grayscale()saturate(.55);z-index:-1;background:linear-gradient(#101d2694,#111e2785 45%,#0b141bad);position:absolute;inset:0}.brand{letter-spacing:2px;background:#0b141b3d;border-bottom:1px solid #b4cdda24;align-items:center;gap:10px;height:68px;padding:0 20px;font-size:12px;font-weight:600;display:flex}.brandMark{color:var(--accent);letter-spacing:-2px;font-size:18px}.sideLabel{letter-spacing:1.4px;color:#a3b1b9;padding:25px 20px 10px;font-size:10px}.people{flex:1;padding:0 10px}.person{color:#d8e0e3;text-shadow:0 1px 2px #0008;border-radius:5px;align-items:center;gap:11px;padding:8px 10px;display:flex}.person:hover{background:#89a5b41f}.avatar,.miniAvatar{background:#22313be0;border:1px solid #b4cdda1f;border-radius:50%;place-items:center;width:34px;height:34px;font-size:12px;display:grid;position:relative}.avatar i{background:#66737b;border:2px solid #1a2831;border-radius:50%;width:9px;height:9px;position:absolute;bottom:1px;right:-1px}.avatar i.online{background:var(--accent)}.identity{background:#0a131959;border-top:1px solid #b4cdda24;align-items:center;gap:10px;padding:14px 20px;display:flex}.identity div:last-child{flex-direction:column;gap:3px;display:flex}.identity small,header small{color:var(--muted);font-size:11px}.chat{background:radial-gradient(circle at 50% 0,#192832 0,#0d151b 55%);flex-direction:column;flex:1;min-width:0;display:flex}header{border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0d151be6;align-items:center;height:68px;padding:0 24px;display:flex}header>div{flex-direction:column;gap:4px;display:flex}header b{font-weight:500}.messages{padding:28px max(20px,calc((100% - var(--max))/2));flex:1;overflow-y:auto}.day{text-align:center;color:var(--muted);letter-spacing:1.5px;margin:4px 0 30px;font-size:9px}.row{align-items:flex-end;gap:9px;margin:9px 0;display:flex}.row.mine{justify-content:flex-end}.miniAvatar{flex:0 0 30px;width:30px;height:30px}.messageWrap{max-width:min(70%,560px)}.author{color:#a9b7bf;margin:0 0 5px 5px;font-size:11px;display:block}.bubble{background:var(--other);border-radius:var(--radius) var(--radius) var(--radius) 3px;border:1px solid #314550;min-width:100px;padding:10px 52px 10px 13px;line-height:1.45;position:relative;box-shadow:0 5px 18px #00000014}.mine .bubble{background:var(--mine);border-radius:var(--radius) var(--radius) 3px var(--radius);border-color:#52746e}.bubble time{color:#e6edf08c;font-size:9px;position:absolute;bottom:7px;right:10px}.bubble img{border-radius:5px;width:100%;max-width:340px;margin:0 0 6px;display:block}footer{border-top:1px solid var(--line);min-height:72px;padding:12px max(20px,calc((100% - var(--max))/2));background:#111c23;align-items:center;gap:7px;display:flex}button{color:var(--muted);cursor:pointer;background:0 0;border:0;place-items:center;display:grid}button svg{width:19px;height:19px}footer>input{border:1px solid var(--line);background:var(--panel2);height:44px;color:var(--text);font:inherit;border-radius:7px;outline:0;flex:1;padding:0 14px}footer>input:focus{border-color:#58756f}.send{background:var(--mine);color:#fff;border-radius:6px;width:40px;height:40px}.hamb,.close,.shade{display:none}@media (width<=700px){.sidebar{width:280px;transition:all .2s;position:absolute;inset:0 auto 0 0;transform:translate(-100%)}.sidebar.open{transform:none}.hamb,.close{display:grid}.hamb{margin-right:15px}.close{margin-left:auto}.shade{z-index:4;background:#0008;display:block;position:fixed;inset:0}.messages{padding:20px 12px}.messageWrap{max-width:82%}header{padding:0 14px}footer{padding:10px}.bubble{padding-right:47px}.bubble img{max-width:280px}}.systemNote{color:var(--muted,#8997a3);align-self:center;padding:7px 10px;font-size:12px}.systemNote.error{color:#dba2a2}.boot,.loginPage{background:radial-gradient(circle at 50% 0,#192832,#0d151b 58%);place-items:center;height:100dvh;display:grid}.boot{letter-spacing:4px;color:var(--accent)}.loginCard,.modal{border:1px solid var(--line);background:#17232cf5;box-shadow:0 25px 80px #0008}.loginCard{border-radius:8px;flex-direction:column;gap:12px;width:min(380px,100vw - 32px);padding:32px;display:flex}.loginBrand{letter-spacing:3px;color:#b9c5ca;margin-bottom:16px;font-size:12px}.loginBrand span{color:var(--accent);font-size:18px}.loginCard h1,.modal h2{margin:0 0 10px;font-size:20px;font-weight:500}.modal h3{color:#c7d1d6;margin:8px 0 12px;font-size:13px;font-weight:500}.loginCard input,.field input{border:1px solid var(--line);background:var(--panel2);width:100%;height:42px;color:var(--text);font:inherit;border-radius:6px;outline:none;padding:0 12px}.field input[type=file]{height:auto;padding:9px}.loginCard input:focus,.field input:focus{border-color:#58756f}.primary,.secondary{min-height:38px;font:inherit;border:1px solid #52746e;border-radius:6px;justify-content:center;align-items:center;gap:8px;padding:0 13px;display:inline-flex}.primary{background:var(--mine);color:#fff}.secondary{color:#cdd7db;border-color:var(--line);background:#202f39}.primary:disabled{opacity:.45}.primary svg,.secondary svg{width:16px;height:16px}.formError,.formMessage{color:#dba2a2;margin-top:4px;font-size:12px}.formMessage{color:#a9c6be}.modalShade{z-index:30;background:#05090dbb;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.modal{border-radius:8px;width:min(520px,100%);max-height:90dvh;padding:25px;position:relative;overflow:auto}.modalClose{position:absolute;top:14px;right:14px}.profileHead{align-items:center;gap:12px;margin:8px 0 20px;display:flex}.profileHead .avatar{width:54px;height:54px}.profileHead>div:last-child{flex-direction:column;gap:4px;display:flex}.profileHead small,.adminUser small{color:var(--muted);margin-top:3px;font-size:11px;display:block}.field{color:#9eacb4;margin:11px 0;font-size:11px;display:block}.field input{margin-top:6px;display:block}.divider{background:var(--line);height:1px;margin:22px 0}.adminUsers{flex-direction:column;gap:7px;display:flex}.adminUser{background:#111c2377;border:1px solid #263843;border-radius:6px;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:8px;display:grid}.compact{min-height:30px;padding:0 9px;font-size:11px}.avatarImg{overflow:hidden}.avatarImg img{object-fit:cover;width:100%;height:100%}.identityButton{margin-left:auto}.identityButton+.identityButton{margin-left:2px}.identityButton svg{width:16px;height:16px}.adminButton{border:1px solid var(--line);border-radius:6px;flex-direction:row;gap:7px;margin-left:auto;padding:7px 10px;font-size:11px;display:flex}.adminButton svg{width:15px;height:15px}@media (width<=700px){.adminButton{font-size:0}.adminButton svg{width:18px;height:18px}.modal{padding:22px 16px}.adminUser{grid-template-columns:36px 1fr}.adminUser .compact{grid-column:2}}.bubble{position:relative}.deleteMessage{color:#ebf2f694;opacity:0;cursor:pointer;background:#0c141a73;border:0;border-radius:5px;place-items:center;width:26px;height:26px;padding:0;transition:opacity .12s,background .12s,color .12s;display:grid;position:absolute;top:5px;right:5px}.bubble:hover .deleteMessage,.deleteMessage:focus-visible{opacity:1}.deleteMessage:hover{color:#fff;background:#5c2626cc}.deleteMessage svg{width:14px;height:14px}@media (hover:none){.deleteMessage{opacity:.72}}.adminActions{align-items:center;gap:6px;display:flex}.danger{color:#e6b6b6;min-height:30px;font:inherit;background:#5b26266b;border:1px solid #974c4ca6;border-radius:6px;align-items:center;gap:5px;padding:0 9px;display:inline-flex}.danger:hover{color:#fff;background:#742d2db8}.danger svg{width:13px;height:13px}.messageActions{opacity:0;gap:3px;transition:opacity .12s;display:flex;position:absolute;top:5px;right:5px}.bubble:hover .messageActions,.messageActions:focus-within{opacity:1}.messageActions button{color:#ebf2f6a6;cursor:pointer;background:#0c141a73;border:0;border-radius:5px;place-items:center;width:26px;height:26px;padding:0;display:grid}.messageActions button:hover{color:#fff;background:#263b44e6}.messageActions svg{width:14px;height:14px}.messageActions .deleteMessage{opacity:1;position:static}.replyQuote{background:#080f133d;border-left:2px solid #78978f;border-radius:2px;flex-direction:column;gap:2px;max-width:420px;margin:0 26px 7px 0;padding:6px 9px;display:flex}.replyQuote b{color:#9fc0b8;font-size:10px;font-weight:600}.replyQuote span{color:#b8c4c9;white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.messageImage{cursor:zoom-in}.lightbox{z-index:100;cursor:zoom-out;background:#03070af0;place-items:center;padding:34px;display:grid;position:fixed;inset:0}.lightbox img{object-fit:contain;cursor:default;max-width:95vw;max-height:92vh;box-shadow:0 20px 80px #000}.lightboxClose{color:#dce5e8;background:#17232ccc;border-radius:50%;place-items:center;width:42px;height:42px;display:grid;position:fixed;top:18px;right:20px}.lightboxClose svg{width:22px;height:22px}.day{z-index:2;border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:1.2px;color:#82939c;background:#111c23e8;border-radius:12px;align-self:center;width:max-content;margin:18px auto 12px;padding:5px 10px;font-size:9px;position:sticky;top:8px}.chat footer.withReply{height:auto;min-height:70px;padding-top:8px;display:block}.composerRow{grid-template-columns:auto 1fr auto;align-items:center;gap:8px;width:100%;display:grid}.replyComposer{color:#8fa49f;grid-template-columns:18px 1fr auto;align-items:center;gap:9px;width:100%;padding:0 4px 8px;display:grid}.replyComposer>svg{width:15px}.replyComposer div{flex-direction:column;min-width:0;display:flex}.replyComposer b{color:#9fc0b8;font-size:10px}.replyComposer span{color:#8d9da5;white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.replyComposer button{place-items:center;width:28px;height:28px;display:grid}.replyComposer button svg{width:14px}@media (hover:none){.messageActions{opacity:.72}}@media (width<=700px){.lightbox{padding:12px}.lightbox img{max-width:100%;max-height:88vh}.replyQuote{max-width:70vw}}.composerRow>input:not([type=file]){border:1px solid var(--line);background:var(--panel2);width:100%;min-width:0;height:44px;color:var(--text);font:inherit;border-radius:7px;outline:0;padding:0 14px}.composerRow>input:not([type=file]):focus{border-color:#58756f}