:root{
  --bg:#080b16;--panel:rgba(15,20,38,.78);--panel2:rgba(20,27,50,.92);--stroke:rgba(255,255,255,.11);
  --text:#eef3ff;--muted:#8d9ab8;--blue:#55e6ff;--violet:#9a6cff;--green:#43e6a8;--danger:#ff5876;
  --shadow:0 24px 80px rgba(0,0,0,.44);--radius:24px;--radius2:16px;
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:inherit}.hidden{display:none!important}.glass{background:var(--panel);border:1px solid var(--stroke);backdrop-filter:blur(22px);box-shadow:var(--shadow)}
.auth-body{overflow-x:hidden}.auth-bg,.app-body:before{position:fixed;inset:0;content:"";z-index:-2;background:radial-gradient(circle at 15% 10%,rgba(85,230,255,.33),transparent 28%),radial-gradient(circle at 85% 15%,rgba(154,108,255,.34),transparent 28%),radial-gradient(circle at 50% 90%,rgba(67,230,168,.18),transparent 34%),linear-gradient(135deg,#080b16,#10172c 48%,#090b14)}
.auth-bg:after,.app-body:after{content:"";position:fixed;inset:0;z-index:-1;opacity:.28;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:38px 38px;mask-image:radial-gradient(circle at center,#000,transparent 85%)}
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(320px,1.05fr) minmax(330px,.55fr);gap:28px;padding:46px;align-items:center}.hero-card,.auth-card{border-radius:var(--radius);padding:34px}.brand-line{display:flex;gap:14px;align-items:center;text-decoration:none;font-weight:900;letter-spacing:.3px}.brand-logo{width:48px;height:48px;border-radius:16px;object-fit:cover}.hero-card h1{font-size:clamp(38px,5.5vw,74px);line-height:.95;margin:32px 0 18px;letter-spacing:-2.5px}.lead{font-size:18px;color:var(--muted);max-width:760px;line-height:1.65}.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}.feature-grid div{padding:18px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid var(--stroke)}.feature-grid b{display:block;font-size:18px;margin-bottom:6px}.feature-grid span{color:var(--muted);font-size:14px}.made-by{margin-top:34px;color:var(--muted);font-size:13px}.made-by a{color:var(--blue);text-decoration:none;font-weight:900}.made-by.side{margin:12px 14px 16px}.tabs{display:flex;background:rgba(255,255,255,.06);border-radius:16px;padding:6px}.tab{flex:1;border:0;border-radius:12px;padding:12px 16px;background:transparent;color:var(--muted);font-weight:800;cursor:pointer}.tab.active{background:linear-gradient(135deg,var(--blue),var(--violet));color:#07101d}.auth-form{display:none;margin-top:24px}.auth-form.active{display:block}.auth-form label,.center-card label{display:block;margin:16px 0 8px;color:#c9d6f7;font-weight:800;font-size:13px}input,textarea,select{width:100%;border:1px solid var(--stroke);background:rgba(4,7,17,.58);color:var(--text);border-radius:14px;padding:14px 15px;outline:none}input:focus,textarea:focus,select:focus{border-color:rgba(85,230,255,.7);box-shadow:0 0 0 4px rgba(85,230,255,.08)}button{font:inherit}.primary-btn,.send-btn{border:0;border-radius:14px;padding:14px 18px;background:linear-gradient(135deg,var(--blue),var(--violet));color:#07101d;font-weight:950;cursor:pointer;box-shadow:0 14px 34px rgba(85,230,255,.16)}.primary-btn{width:100%;margin-top:20px}.auth-msg{min-height:22px;color:#ffd166;margin-top:18px}.mini-note{color:var(--muted);font-size:13px;line-height:1.45}.app-body{height:100vh;overflow:hidden}.app-shell{height:100vh;padding:14px;display:grid;grid-template-columns:72px 304px minmax(380px,1fr) 300px;gap:14px}.server-rail,.left-panel,.chat-panel,.right-panel{min-height:0}.server-rail{border-radius:24px;background:rgba(7,10,20,.84);border:1px solid var(--stroke);display:flex;flex-direction:column;align-items:center;gap:12px;padding:12px 8px}.rail-logo,.server-bubble,.rail-btn{width:48px;height:48px;border-radius:17px;display:grid;place-items:center;border:1px solid var(--stroke);background:rgba(255,255,255,.06);color:var(--text);cursor:pointer;text-decoration:none;transition:.16s}.rail-logo img,.server-bubble img{width:100%;height:100%;object-fit:cover;border-radius:17px}.server-bubble{position:relative;overflow:hidden}.server-bubble span{position:absolute;font-size:11px;font-weight:950;text-shadow:0 2px 8px #000}.rail-btn:hover,.server-bubble:hover,.rail-btn.active{transform:translateY(-1px);border-color:rgba(85,230,255,.55)}.add-server{margin-top:auto;font-size:28px;color:var(--green)}.left-panel,.chat-panel,.right-panel{border-radius:var(--radius);overflow:hidden}.left-panel{display:flex;flex-direction:column}.panel-top{display:flex;align-items:center;justify-content:space-between;padding:20px}.eyebrow{color:var(--blue);font-size:11px;font-weight:950;letter-spacing:1.5px}.panel-top h2{margin:2px 0 0;font-size:26px}.icon-btn{border:1px solid var(--stroke);background:rgba(255,255,255,.06);color:var(--text);border-radius:13px;width:42px;height:42px;cursor:pointer}.quick-search{display:flex;gap:8px;padding:0 14px 12px}.quick-search input{padding:12px}.quick-search button,.mini-action{border:1px solid var(--stroke);background:rgba(85,230,255,.12);color:var(--blue);border-radius:13px;padding:0 12px;font-weight:900;cursor:pointer}.search-results{padding:0 14px}.search-results button{width:100%;display:flex;align-items:center;gap:10px;border:1px solid var(--stroke);background:rgba(255,255,255,.055);color:var(--text);border-radius:15px;padding:10px;margin:6px 0;cursor:pointer}.search-results img,.list-item img,.member img{width:34px;height:34px;border-radius:12px;object-fit:cover}.search-results small,.list-item small,.member small{display:block;color:var(--muted);font-size:12px}.section-list{padding:8px 14px;display:grid;gap:8px}.section-item,.list-item,.channel-item{width:100%;border:1px solid transparent;background:rgba(255,255,255,.04);color:var(--text);border-radius:15px;padding:12px;text-align:left;cursor:pointer}.section-item.active,.section-item:hover,.list-item:hover,.channel-item:hover{background:rgba(85,230,255,.11);border-color:rgba(85,230,255,.25)}.dynamic-list{padding:0 14px;overflow:auto;min-height:0;flex:1}.dynamic-list h4{color:#d6e2ff;margin:16px 0 10px}.list-item{display:flex;align-items:center;gap:10px;margin:8px 0}.channel-group{margin-top:14px}.channel-group b{display:block;color:var(--muted);font-size:12px;text-transform:uppercase;margin:12px 4px}.channel-item{margin:6px 0;display:flex;justify-content:space-between;align-items:center}.channel-item small{color:var(--muted);font-size:11px}.user-dock{display:flex;align-items:center;gap:10px;padding:12px 14px;border-top:1px solid var(--stroke);background:rgba(0,0,0,.16)}.avatar-frame{width:42px;height:42px;border-radius:16px;padding:2px;background:linear-gradient(135deg,var(--blue),var(--violet))}.avatar-frame img{width:100%;height:100%;object-fit:cover;border-radius:14px;background:#111}.avatar-frame.big{width:76px;height:76px;border-radius:28px;margin:-38px auto 10px}.avatar-frame.big img{border-radius:25px}.dock-info{min-width:0;flex:1}.dock-info b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dock-info span{font-size:12px;color:var(--muted)}.chat-panel{display:flex;flex-direction:column;background:rgba(9,13,26,.72)}.chat-header{height:80px;border-bottom:1px solid var(--stroke);display:flex;align-items:center;justify-content:space-between;padding:0 22px}.chat-title-wrap{display:flex;align-items:center;gap:13px;min-width:0}.chat-icon{width:48px;height:48px;border-radius:17px;background:linear-gradient(135deg,rgba(85,230,255,.22),rgba(154,108,255,.22));display:grid;place-items:center;font-size:22px;border:1px solid var(--stroke)}.chat-header h1{margin:0;font-size:22px}.chat-header p{margin:4px 0 0;color:var(--muted);font-size:13px}.chat-actions{display:flex;gap:8px}.ghost-btn{border:1px solid var(--stroke);background:rgba(255,255,255,.055);color:var(--text);border-radius:13px;padding:11px 14px;cursor:pointer;font-weight:850}.ghost-btn:hover{border-color:rgba(85,230,255,.5)}.messages{flex:1;overflow:auto;padding:24px}.empty-state,.empty-thread{display:grid;place-items:center;text-align:center;align-content:center;color:var(--muted)}.empty-logo{width:92px;height:92px;border-radius:28px;margin-bottom:18px;filter:drop-shadow(0 16px 34px rgba(85,230,255,.2))}.empty-state h2,.empty-thread h2{color:var(--text);margin:0 0 8px}.msg{display:flex;gap:12px;margin:15px 0;align-items:flex-start}.msg.mine{flex-direction:row-reverse}.msg-avatar{width:42px;height:42px;border-radius:15px;object-fit:cover}.msg-body{max-width:min(660px,76%);background:rgba(255,255,255,.06);border:1px solid var(--stroke);border-radius:18px;padding:12px 14px}.msg.mine .msg-body{background:linear-gradient(135deg,rgba(85,230,255,.16),rgba(154,108,255,.14));border-color:rgba(85,230,255,.22)}.msg-meta{display:flex;gap:8px;align-items:baseline;margin-bottom:6px}.msg-meta b{font-size:14px}.msg-meta span{color:var(--muted);font-size:12px}.msg-body p{margin:0;line-height:1.45;white-space:normal}.msg-media{display:block;max-width:340px;max-height:260px;border-radius:14px;margin:8px 0;object-fit:cover;border:1px solid var(--stroke)}.file-pill{display:inline-flex;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.08);text-decoration:none;margin:8px 0}.deleted{color:var(--muted);justify-content:center}.composer{border-top:1px solid var(--stroke);padding:14px;display:flex;align-items:flex-end;gap:10px;background:rgba(0,0,0,.14)}.composer textarea{min-height:46px;max-height:160px;resize:none;flex:1}.send-btn{width:auto}.right-panel{padding:14px;overflow:auto}.right-card{border:1px solid var(--stroke);background:rgba(255,255,255,.05);border-radius:20px;margin-bottom:14px;padding:15px}.profile-card{padding:0;overflow:hidden}.profile-banner{height:78px;background:radial-gradient(circle at 30% 20%,var(--blue),transparent 36%),linear-gradient(135deg,#17213f,#3d2569)}.profile-main{text-align:center;padding:0 16px 16px}.profile-main h3{margin:0 0 6px}.profile-main p,.small-text p,.muted{color:var(--muted);font-size:13px;line-height:1.45}.member{display:flex;align-items:center;gap:10px;padding:8px;border-radius:14px}.member:hover{background:rgba(255,255,255,.05)}.center-card{max-width:560px;margin:70px auto;padding:28px;border:1px solid var(--stroke);background:rgba(255,255,255,.055);border-radius:24px}.wide-input{margin-bottom:12px}.danger-btn{border:1px solid rgba(255,88,118,.35);background:rgba(255,88,118,.12);color:#ff91a5;border-radius:13px;padding:12px 14px;cursor:pointer;font-weight:850}.connect-modal{border:1px solid var(--stroke);background:rgba(12,17,33,.96);color:var(--text);border-radius:24px;max-width:620px;width:min(92vw,620px);box-shadow:var(--shadow);padding:26px}.connect-modal::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(8px)}.modal-x{float:right;border:0;background:transparent;color:var(--muted);font-size:30px;cursor:pointer}.perm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}.perm-grid label{background:rgba(255,255,255,.05);border:1px solid var(--stroke);padding:10px;border-radius:12px;color:#d9e5ff}.perm-grid input{width:auto}.role-row{padding:9px;border-radius:12px;background:rgba(255,255,255,.04);margin:6px 0}.local-video{width:100%;max-height:340px;background:#000;border-radius:18px;border:1px solid var(--stroke);margin:12px 0}#toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:rgba(8,12,24,.94);border:1px solid rgba(85,230,255,.28);box-shadow:var(--shadow);border-radius:16px;padding:13px 18px;z-index:1000;opacity:0;pointer-events:none;transition:.22s}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1120px){.app-shell{grid-template-columns:64px 280px 1fr}.right-panel{display:none}.auth-shell{grid-template-columns:1fr}.hero-card h1{font-size:44px}}
@media(max-width:760px){.app-shell{grid-template-columns:56px 1fr;padding:8px}.left-panel{display:none}.right-panel{display:none}.chat-header{height:auto;padding:12px;align-items:flex-start;gap:10px;flex-direction:column}.chat-actions{flex-wrap:wrap}.messages{padding:14px}.auth-shell{padding:18px}.feature-grid{grid-template-columns:1fr}.msg-body{max-width:86%}}