:root{color-scheme:light;--bg:#f9fafc;--rail:#e6edf4;--side:#eef4fa;--surface:#fff;--surface-alt:#f6f9fb;--line:#dbe4ec;--line-strong:#c8d5e0;--text:#192237;--text-strong:#111b2e;--secondary:#58687a;--muted:#8796a7;--accent:#147f9b;--accent-strong:#0d718d;--accent-soft:#e4f3f6;--accent-border:#a7d6e0;--green:#249d70;--purple:#8552cc;--pink:#ad246c;--shadow:0 22px 75px rgba(29,48,75,.16);--shadow-soft:0 12px 34px rgba(31,58,87,.07);--overlay:rgba(15,29,51,.48);--font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace}
html[data-theme=dark]{color-scheme:dark;--bg:#151c27;--rail:#141d29;--side:#1a2634;--surface:#202d3d;--surface-alt:#1b2837;--line:#314052;--line-strong:#3f5163;--text:#e0e8f1;--text-strong:#f3f6fb;--secondary:#abbacc;--muted:#8697a9;--accent:#60bfd6;--accent-strong:#7bd3e5;--accent-soft:#233d4c;--accent-border:#386f83;--green:#5bcca1;--purple:#b18be7;--pink:#f083bf;--shadow:0 24px 80px rgba(0,0,0,.48);--shadow-soft:0 12px 35px rgba(0,0,0,.14);--overlay:rgba(0,0,0,.62)}
*,*::before,*::after{box-sizing:border-box}body,html{padding:0;margin:0;height:100%;min-width:320px}body{background:var(--bg);color:var(--text);font:14px/1.5 var(--font);overflow:hidden;-webkit-font-smoothing:antialiased}button,input,textarea,select{font:inherit}button{cursor:pointer}button,select,input,textarea{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--accent-border);outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed}a{color:var(--accent)}.ico{width:20px;height:20px;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;fill:none;display:inline-block;vertical-align:middle;flex-shrink:0}.ico.sm{width:16px;height:16px}.ico.lg{width:24px;height:24px}.ico.xl{width:30px;height:30px}.mono{font-family:var(--mono)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.hidden{display:none!important}
.app{height:100vh;height:100dvh;min-height:430px;display:flex;width:100%;overflow:hidden}.rail{width:76px;flex:0 0 76px;display:flex;flex-direction:column;align-items:center;padding:23px 10px 16px;gap:12px;background:var(--rail);border-right:1px solid var(--line);z-index:20}.brand-mini{display:flex;align-items:center;justify-content:center;height:42px;width:49px;color:var(--text-strong);font-size:32px;line-height:42px;font-weight:900;font-family:var(--mono);letter-spacing:-4px;display:flex;align-items:center;justify-content:center;margin:0 0 10px}.brand-mini b{color:var(--accent);font-weight:900}.rail-divider{height:1px;background:var(--line-strong);width:34px;margin:1px auto 4px}.rail-item{height:48px;width:48px;border:0;display:grid;place-items:center;background:var(--surface);border-radius:16px;color:var(--text);font-size:17px;font-weight:800;font-family:var(--mono);position:relative;transition:background .17s,border-radius .17s,color .17s,transform .17s}.rail-item:hover{background:var(--accent-soft);color:var(--accent);border-radius:14px;transform:translateY(-1px)}.rail-item.current{background:var(--accent-strong);color:#fff;border-radius:16px;box-shadow:0 4px 13px rgba(20,127,155,.17)}html[data-theme=dark] .rail-item.current{color:#102735}.rail-item.current::before{content:"";position:absolute;left:-13px;width:4px;height:27px;border-radius:0 5px 5px 0;background:var(--accent)}.rail-item.dm{background:var(--accent-soft);color:var(--text-strong)}.rail-item.dm.current{background:var(--accent-strong);color:#fff}.rail-item.add{color:var(--secondary);font-weight:400}.rail-item.utility{background:transparent}.rail-item.utility:hover{background:var(--surface-alt)}.rail-bottom{display:flex;flex-direction:column;gap:10px;margin-top:auto;align-items:center}.rail .rail-item .ico{width:23px;height:23px}
.sidebar{width:308px;flex:0 0 308px;background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;z-index:18;min-height:0}.side-head{height:106px;flex:0 0 106px;padding:29px 23px 19px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.eyebrow{font-family:var(--mono);font-weight:800;color:var(--secondary);text-transform:uppercase;letter-spacing:1.15px;font-size:11px}.side-name{font-size:23px;font-weight:780;letter-spacing:-.8px;line-height:1.25;margin-top:7px;color:var(--text-strong)}.side-content{padding:26px 14px;flex:1;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}.side-section{display:flex;align-items:center;justify-content:space-between;padding:3px 9px 13px;gap:8px}.side-section-title{font:800 12px var(--mono);letter-spacing:.85px;text-transform:uppercase;color:var(--secondary)}.section-actions{display:flex;gap:5px}.small-icon-btn,.icon-btn{border:0;background:transparent;display:inline-grid;place-items:center;color:var(--secondary);border-radius:10px;transition:.16s;flex-shrink:0}.small-icon-btn{width:31px;height:31px}.icon-btn{width:39px;height:39px}.small-icon-btn:hover,.icon-btn:hover{background:var(--accent-soft);color:var(--accent)}.icon-btn.active{background:var(--accent-soft);color:var(--accent)}.channel-row{border:0;display:flex;align-items:center;text-align:left;gap:11px;min-width:0;width:100%;height:44px;padding:0 11px;border-radius:11px;color:var(--secondary);background:transparent;margin:3px 0;position:relative}.channel-row:hover{background:rgba(88,130,149,.09)}.channel-row.active{background:var(--accent-soft);color:var(--text-strong);font-weight:750}.channel-row.active::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:3px;background:var(--accent);border-radius:3px}.channel-row>.ico{color:var(--accent);width:20px;height:20px}.channel-row span.name{font-size:14px;font-family:var(--mono);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.channel-row .mini-tags{margin-left:auto;display:flex;align-items:center;gap:5px;color:var(--secondary)}.mini-tags .ico{width:15px;height:15px}.mini-tags .purple{color:var(--purple)}.mini-tags .blue{color:#4e76bd}.sidebar-foot{padding:15px 20px 19px;border-top:1px solid var(--line)}.connection-line{display:flex;align-items:center;gap:8px;color:var(--secondary);font-size:11px}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);flex:0 0 auto}.status-dot.demo{background:#e3a146}.side-foot-meta{margin-top:6px;font:10px/1.5 var(--mono);color:var(--muted)}.dm-side-search{display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line-strong);border-radius:11px;margin:0 2px 22px;padding:0 13px;color:var(--secondary);height:44px}.dm-side-search input{background:transparent;border:0;outline:0;color:var(--text);width:100%;min-width:0}.dm-side-search input::placeholder{color:var(--muted)}.dm-row{display:flex;align-items:center;gap:11px;border:0;background:transparent;width:100%;text-align:left;padding:10px 11px;border-radius:11px;color:var(--text)}.dm-row:hover,.dm-row.active{background:var(--accent-soft)}.dm-row small{display:block;font-size:12px;color:var(--muted);margin-top:2px}.side-empty{padding:14px 10px;color:var(--muted);font-size:13px}
.workspace{display:flex;flex:1;min-width:0;min-height:0;flex-direction:column;background:var(--bg);position:relative}.topbar{height:78px;flex:0 0 78px;display:flex;align-items:center;padding:0 31px;gap:18px;border-bottom:1px solid var(--line);background:var(--bg);position:relative;z-index:5}.topbar-left{min-width:0;display:flex;align-items:center;gap:13px;flex:1}.topbar-left .label-icon{color:var(--accent);width:25px;height:25px}.top-title{font:bold 19px/1.2 var(--mono);color:#23443f;letter-spacing:-.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}html[data-theme=dark] .top-title{color:var(--text-strong)}.top-divider{width:1px;height:27px;background:var(--line-strong);margin:0 5px}.top-subtitle{color:var(--secondary);min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px}.top-actions{display:flex;align-items:center;gap:6px}.mobile-nav{display:none}.chat-topic-bar{border-bottom:1px solid var(--line);background:var(--surface);display:flex;align-items:center;gap:15px;padding:13px 30px;min-height:81px;flex:0 0 auto}.topic-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:var(--accent-soft);color:var(--accent);font:700 24px var(--mono);flex:none}.topic-info{min-width:0;flex:1}.topic-overline{font:800 11px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.6px;color:var(--secondary)}.topic-description{font-size:13px;font-weight:750;color:var(--text-strong);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topic-pinned-desc{font-size:11px;color:var(--secondary);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.outline-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:38px;padding:0 14px;white-space:nowrap;border:1px solid var(--line-strong);color:var(--text);border-radius:10px;background:var(--surface);font-weight:660;font-size:12px}.outline-button:hover{border-color:var(--accent-border);background:var(--accent-soft)}.outline-button .count{font:800 12px var(--mono);color:var(--accent)}.outline-button .ico{width:17px;height:17px}.chat-feed{overflow:auto;min-height:0;flex:1;scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;overscroll-behavior:contain}.chat-feed-inner{width:100%;max-width:1210px;padding:30px 56px 20px;margin:auto;min-height:100%;display:flex;flex-direction:column;justify-content:flex-end}.date-separator{display:flex;align-items:center;gap:18px;font:bold 11px var(--mono);letter-spacing:1.5px;color:var(--secondary);text-transform:uppercase;margin:22px 0 28px;white-space:nowrap}.date-separator:before,.date-separator:after{content:"";height:1px;flex:1;background:var(--line-strong)}.date-separator.unread{color:var(--accent);letter-spacing:0;font:700 12px var(--font)}.date-separator.unread:before,.date-separator.unread:after{background:var(--accent-border)}.chat-message{display:flex;align-items:flex-start;gap:15px;position:relative;padding:12px 10px;border-radius:12px;margin:0 0 3px;transition:background .12s}.chat-message:hover{background:rgba(95,129,148,.06)}.avatar{border:1px solid var(--line-strong);background:linear-gradient(140deg,#e5f1f5,#d9e6ea);color:#19263d;border-radius:15px;width:43px;height:43px;display:grid;place-items:center;flex:none;font:800 14px var(--mono);position:relative}html[data-theme=dark] .avatar{background:linear-gradient(145deg,#375468,#294354);color:#dcecf3}.avatar.tiny{height:37px;width:37px;border-radius:13px;font-size:12px}.avatar .online{position:absolute;right:-2px;bottom:-2px;border:3px solid var(--surface);height:14px;width:14px;border-radius:50%;background:var(--green)}.avatar .offline{background:var(--secondary)}.msg-main{flex:1;min-width:0}.msg-meta{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:0 0 6px}.msg-meta .author{font-weight:780;color:var(--text-strong);font-size:14px}.msg-meta .author.vip{color:var(--pink)}.msg-meta time{color:var(--secondary);font:11px var(--mono)}.pinned-label{color:var(--accent);font:700 11px var(--mono)}.msg-text{font-size:15px;line-height:1.64;color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}.chat-message.pinned .msg-main{border-left:2px solid var(--accent-border);padding-left:13px}.msg-tools{display:flex;align-items:center;gap:3px;opacity:0;transition:opacity .15s;position:absolute;right:12px;top:10px;background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:2px;box-shadow:var(--shadow-soft)}.chat-message:hover .msg-tools,.chat-message:focus-within .msg-tools{opacity:1}.msg-tools .icon-btn{width:31px;height:30px}.msg-tools .ico{width:17px;height:17px}.reactions{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.reaction{border:1px solid var(--line-strong);border-radius:999px;color:var(--text);display:inline-flex;align-items:center;gap:6px;background:var(--surface-alt);padding:4px 10px;font-size:12px;line-height:17px}.reaction:hover,.reaction.mine{border-color:var(--accent);background:var(--accent-soft)}.reaction .emoji{font-size:15px;line-height:16px}.reaction .quantity{font:650 12px var(--mono)}.system-msg{display:flex;justify-content:center;color:var(--secondary);font-size:12px;gap:14px;padding:10px;margin:5px 0}.system-msg span{font:11px var(--mono);color:var(--muted)}.feed-spacer{flex:1;min-height:10px}
.composer-wrap{flex:0 0 auto;padding:12px 38px 22px;background:var(--bg)}.composer-container{max-width:1170px;margin:auto}.reply-preview{border:1px solid var(--line-strong);border-bottom:0;background:var(--surface-alt);padding:9px 14px;display:flex;align-items:center;justify-content:space-between;border-radius:12px 12px 0 0;font-size:12px;color:var(--secondary)}.compose{min-height:55px;display:flex;align-items:center;gap:10px;border:1px solid var(--line-strong);background:var(--surface);border-radius:14px;padding:6px 7px 6px 17px;transition:.15s}.compose:focus-within{border-color:var(--accent-border);box-shadow:0 0 0 3px rgba(20,127,155,.08)}.reply-preview+.compose{border-radius:0 0 14px 14px}.compose textarea{width:100%;min-width:0;max-height:144px;resize:none;border:0;outline:0;background:transparent;color:var(--text);font-size:14px;padding:9px 0;line-height:22px;height:41px}.compose textarea::placeholder{color:var(--secondary)}.compose-actions{display:flex;align-items:center;gap:5px}.send{height:42px;width:44px;border:0;background:var(--accent-strong);color:white;display:grid;place-items:center;border-radius:10px;transition:.15s}.send:hover{filter:brightness(1.08)}.send .ico{width:21px;height:21px}html[data-theme=dark] .send{color:#0b2532}.compose-hint{padding:7px 4px 0;display:flex;justify-content:space-between;gap:15px;font:10px/1.5 var(--mono);color:var(--muted)}.compose-hint b{font-weight:500;color:var(--secondary)}
.home-scroll,.hub-scroll{flex:1;min-height:0;overflow:auto}.home-hero{height:180px;background:radial-gradient(circle at 17% 50%,#c8f4fa 0%,transparent 43%),linear-gradient(110deg,#e4f4f9,#d5e1ec);border-bottom:1px solid var(--line);position:relative;overflow:hidden}html[data-theme=dark] .home-hero{background:radial-gradient(circle at 16% 50%,#1b5b6b 0%,transparent 44%),linear-gradient(110deg,#233f52,#263447)}.home-hero:after{content:"#";font:900 290px/.9 var(--mono);position:absolute;right:6%;top:-16px;color:rgba(26,103,137,.18);transform:rotate(-7deg)}.home-hero .badge{position:absolute;right:25px;bottom:18px;z-index:1;background:rgba(26,47,72,.7);color:white;padding:6px 13px;border-radius:100px;font:800 10px var(--mono);letter-spacing:1.4px}.home-content{max-width:1130px;margin:-28px auto 60px;padding:0 34px;position:relative}.home-brand{display:flex;align-items:flex-end;gap:23px;margin-bottom:46px}.home-logo{width:102px;height:102px;flex:none;border-radius:26px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#1890ac,#086984);font:900 36px var(--mono);border:5px solid var(--bg);box-shadow:var(--shadow-soft)}.home-brand .eyebrow{color:var(--text-strong)}.home-brand h1{font-size:36px;letter-spacing:-1.3px;line-height:1.1;margin:6px 0 8px}.home-brand p{margin:0;color:var(--secondary)}.home-rules{border:1px solid var(--line-strong);border-radius:16px;padding:24px 26px;margin-bottom:23px;background:var(--surface)}.home-rules h2{font-size:23px;letter-spacing:-.8px;font-weight:740;margin:0 0 6px}.home-rules p{margin:0;color:var(--secondary)}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 22px}.stat{border:1px solid var(--line);border-radius:14px;padding:19px 21px;background:var(--surface)}.stat b{font:800 28px var(--mono);color:var(--text-strong)}.stat span{display:block;color:var(--secondary);margin-top:3px;font-size:12px}.home-buttons{display:flex;gap:10px;flex-wrap:wrap}.hub-body{max-width:1130px;margin:0 auto;padding:48px 42px;min-height:100%;display:flex;flex-direction:column}.hub-head{display:flex;gap:18px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:27px}.hub-head-icon{width:65px;height:65px;background:var(--accent-soft);border:1px solid var(--line);border-radius:18px;display:grid;place-items:center}.hub-head-icon .ico{width:32px;height:32px}.hub-head h1{font-size:28px;letter-spacing:-.9px;margin:0 0 4px}.hub-head p{color:var(--secondary);margin:0}.empty-card{border:1px solid var(--line-strong);border-radius:20px;max-width:620px;width:100%;padding:64px 40px;text-align:center;background:var(--surface);margin:auto;display:flex;flex-direction:column;align-items:center}.empty-icon{width:82px;height:82px;background:var(--accent-soft);border-radius:24px;display:grid;place-items:center;margin-bottom:19px}.empty-icon .ico{width:33px;height:33px}.empty-card h2{font-size:24px;letter-spacing:-.6px;margin:0 0 10px}.empty-card p{color:var(--secondary);max-width:390px;margin:0 0 24px}.primary-button{height:39px;background:var(--accent-strong);color:#fff;border:0;border-radius:10px;padding:0 16px;display:inline-flex;align-items:center;gap:9px;font-weight:680}html[data-theme=dark] .primary-button{color:#102735}.primary-button:hover{filter:brightness(1.07)}
.scrim{position:fixed;inset:0;background:var(--overlay);z-index:55;animation:fade .17s ease-out}.drawer{position:fixed;right:0;top:0;bottom:0;z-index:56;width:min(360px,92vw);background:var(--side);box-shadow:var(--shadow);display:flex;flex-direction:column;animation:slidein .18s ease-out}.drawer-head{min-height:92px;border-bottom:1px solid var(--line-strong);padding:26px 24px 16px;display:flex;justify-content:space-between;align-items:flex-start}.drawer-head b{font-size:15px;font-weight:760}.drawer-subtitle{font-size:12px;margin-top:8px;color:var(--secondary)}.pill-count{border-radius:50%;width:27px;height:27px;background:var(--rail);display:inline-grid;place-items:center;font:800 12px var(--mono);margin-left:10px}.drawer-body{padding:20px 23px;overflow:auto;flex:1}.field{height:44px;width:100%;background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:11px;padding:0 13px;outline:0}.field:focus{border-color:var(--accent)}.field::placeholder{color:var(--muted)}.member-group{margin:30px 0 12px;display:flex;justify-content:space-between;color:var(--secondary);text-transform:uppercase;font:800 11px var(--mono);letter-spacing:1px}.member-group.vip{color:var(--pink)}.member-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:transparent;border:0;padding:10px 0;color:var(--text)}.member-item:hover .member-name{text-decoration:underline}.member-name{font-weight:750;color:var(--text-strong)}.member-name.vip{color:var(--pink)}.member-status{font-size:12px;color:var(--secondary);margin-top:2px}.member-badge{margin-left:auto;color:var(--purple);border:1px solid var(--line);border-radius:7px;padding:5px 7px}.notification-panel{position:fixed;right:20px;top:86px;z-index:56;width:min(460px,calc(100vw - 40px));height:min(630px,calc(100dvh - 105px));background:var(--surface);border:1px solid var(--line-strong);border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;animation:popin .15s ease}.panel-header{display:flex;justify-content:space-between;align-items:flex-start;padding:19px 20px;border-bottom:1px solid var(--line)}.panel-header h2{font-size:18px;margin:0 0 2px;letter-spacing:-.4px}.panel-header p{margin:0;color:var(--secondary);font-size:12px}.notification-list{flex:1;overflow:auto}.notification-item{display:flex;gap:13px;padding:17px 19px;border-bottom:1px solid var(--line)}.notification-icon{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:11px;background:var(--side);border:1px solid var(--line)}.notification-content{flex:1;min-width:0}.notification-title{display:flex;gap:8px;justify-content:space-between;font-size:12px}.notification-title b{font-size:12px}.notification-title time{color:var(--secondary);font:10px var(--mono)}.notification-content p{margin:4px 0 0;color:var(--secondary);font-size:12px}.notification-content .detail{color:var(--text);margin-top:3px}.panel-bottom{border-top:1px solid var(--line);padding:13px 18px;display:flex;justify-content:flex-end;background:var(--surface)}
.modal-head{padding:22px 24px 18px;display:flex;align-items:flex-start;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line)}.modal-head h2{font-size:20px;letter-spacing:-.5px;margin:0 0 4px}.modal-head p{color:var(--secondary);margin:0;font-size:12px}.modal-body{padding:24px}.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding:0 24px 24px}.form-label{font-size:12px;font-weight:750;margin-bottom:7px;display:block}.form-group{margin-bottom:20px}.form-helper{font-size:11px;color:var(--muted);margin:8px 0 0}.choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.choice{border:1px solid var(--line-strong);background:var(--surface-alt);padding:13px 8px;border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--secondary)}.choice.selected{border-color:var(--accent);background:var(--accent-soft);color:var(--text-strong)}.choice .ico{width:22px;height:22px}.form-inline{display:flex;gap:9px;align-items:center}.tag{background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:999px;padding:4px 9px;color:var(--accent);font:700 11px var(--mono)}.help-item{display:flex;gap:16px;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line);font-size:12px;color:var(--secondary)}.help-item code{background:var(--side);border:1px solid var(--line);border-radius:6px;padding:4px 7px;color:var(--text);font:11px var(--mono);white-space:nowrap}.search-result{width:100%;text-align:left;background:transparent;border:0;border-bottom:1px solid var(--line);padding:13px 2px;color:var(--text)}.search-result:hover{background:var(--surface-alt)}.search-result b{font-size:12px}.search-result small{display:block;color:var(--muted);font-size:11px}.search-result p{font-size:12px;margin:5px 0 0}.search-list{max-height:350px;overflow:auto}.search-empty{color:var(--secondary);padding:30px 0;text-align:center}
.popover-menu{position:fixed;z-index:65;background:var(--surface);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:11px;padding:5px;min-width:176px}.popover-menu button{border:0;background:transparent;width:100%;text-align:left;padding:9px 11px;display:flex;gap:9px;align-items:center;color:var(--text);border-radius:7px;font-size:12px}.popover-menu button:hover{background:var(--accent-soft)}.popover-menu button .ico{height:16px;width:16px;color:var(--secondary)}.emoji-menu{min-width:238px;display:grid;grid-template-columns:repeat(6,1fr);gap:3px;padding:10px}.emoji-menu button{font-size:20px;justify-content:center;padding:7px 4px}.toast-zone{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom));right:22px;z-index:1090;pointer-events:none;display:flex;flex-direction:column;gap:8px}.aster-toast{pointer-events:auto;display:flex;align-items:center;gap:9px;padding:12px 15px;background:var(--text-strong);color:var(--surface);border-radius:11px;box-shadow:var(--shadow);font-size:12px;max-width:340px;animation:popin .16s}.aster-toast .ico{width:16px;height:16px;color:var(--accent)}.demo-note{background:var(--accent-soft);border:1px solid var(--accent-border);color:var(--secondary);border-radius:11px;padding:11px 13px;font-size:12px;margin-top:18px}.demo-note .ico{width:15px;height:15px;margin-right:7px;color:var(--accent)}.mobile-shade{display:none}
@keyframes fade{from{opacity:0}to{opacity:1}}@keyframes slidein{from{transform:translateX(20px);opacity:.7}to{transform:translateX(0);opacity:1}}@keyframes popin{from{transform:scale(.975);opacity:.3}to{transform:scale(1);opacity:1}}
@media(max-width:1200px){.sidebar{width:276px;flex-basis:276px}.chat-feed-inner{padding-left:37px;padding-right:37px}.composer-wrap{padding-left:28px;padding-right:28px}}
@media(max-width:850px){.rail{width:67px;flex-basis:67px}.sidebar{width:254px;flex-basis:254px}.topbar{padding:0 20px}.top-subtitle{display:none}.top-divider{display:none}.chat-topic-bar{padding:12px 21px}.chat-feed-inner{padding-left:20px;padding-right:20px}.composer-wrap{padding-left:17px;padding-right:17px}.topic-pinned-desc{display:none}}
@media(max-width:680px){.app{min-height:0}.rail{width:62px;flex-basis:62px;padding:16px 7px}.rail-item{height:43px;width:43px;border-radius:14px}.rail-item.current::before{left:-10px}.brand-mini{font-size:27px}.sidebar{position:fixed;z-index:47;left:62px;top:0;bottom:0;width:min(315px,calc(100vw - 95px));transform:translateX(-120%);box-shadow:var(--shadow);transition:transform .2s ease}.sidebar.show{transform:translateX(0)}.mobile-shade.show{display:block;position:fixed;inset:0;background:var(--overlay);z-index:46}.mobile-nav{display:inline-grid;margin-left:-8px}.topbar{height:67px;flex-basis:67px;padding:0 13px;gap:3px}.topbar-left{gap:8px}.topbar-left .label-icon{width:23px;height:23px}.top-title{font-size:18px}.top-actions{gap:0}.top-actions .icon-btn{width:34px;height:37px}.top-actions .hide-mobile{display:none}.chat-topic-bar{min-height:73px;padding:11px 15px;gap:9px}.topic-description{font-size:12px}.topic-mark{width:34px;height:34px}.outline-button.pin-button{padding:0 10px;font-size:0;width:41px;height:38px}.outline-button.pin-button .count{font-size:12px}.chat-feed-inner{padding:13px 13px 16px}.date-separator{margin:19px 0 23px}.chat-message{gap:10px;padding:11px 3px}.avatar{height:36px;width:36px;border-radius:12px;font-size:12px}.msg-meta{gap:8px;margin-bottom:4px}.msg-meta .author{font-size:12px}.msg-text{font-size:13px}.msg-tools{opacity:1;position:static;box-shadow:none;background:transparent;border:0;padding:0;margin-left:3px}.msg-tools .icon-btn{width:25px;height:29px}.msg-tools [data-action="message-menu"]{display:none}.reaction{padding:3px 8px}.composer-wrap{padding:8px 11px max(12px,env(safe-area-inset-bottom))}.compose{min-height:52px}.compose-hint{display:none}.home-hero{height:132px}.home-content{padding:0 18px}.home-brand{gap:12px;margin-bottom:29px}.home-logo{width:70px;height:70px;border-radius:20px;font-size:23px}.home-brand h1{font-size:27px}.home-brand p{font-size:12px}.home-rules{padding:19px}.stats{gap:7px}.stat{padding:12px}.stat b{font-size:21px}.stat span{font-size:10px}.hub-body{padding:26px 16px}.hub-head h1{font-size:22px}.empty-card{padding:35px 20px}.empty-card h2{font-size:21px}.notification-panel{right:8px;top:72px;width:calc(100vw - 80px);height:min(620px,calc(100dvh - 85px))}.drawer{width:min(330px,calc(100vw - 62px))}}
@media(max-width:400px){.rail{width:55px;flex-basis:55px;padding-left:5px;padding-right:5px}.sidebar{left:55px}.topbar{padding:0 8px}.top-title{font-size:16px}.top-actions .icon-btn{width:31px}.msg-tools [data-action="react-menu"]{display:none}.notification-panel{width:calc(100vw - 66px)}.stat{padding:9px}.home-buttons .outline-button{padding:0 9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Aster v3 – routed home, profile interactions and network discovery */
.home-brand{align-items:flex-start}.home-brand>div:last-child{padding-top:24px}

.brand-button{background:none;border:0;cursor:pointer;border-radius:10px}.brand-button:hover,.brand-button.active{background:var(--accent-soft)}
.notification-dot{position:absolute;width:6px;height:6px;background:var(--pink);border-radius:50%;transform:translate(9px,-9px)}
.side-network-row{display:flex;align-items:center;gap:11px;width:100%;background:transparent;border:0;text-align:left;border-radius:12px;padding:10px 9px;color:var(--text)}.side-network-row:hover{background:var(--accent-soft)}.side-network-row>span:nth-child(2){flex:1;min-width:0}.side-network-row b,.side-network-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-network-row small{font-size:11px;color:var(--secondary);max-width:200px}.mini-network-logo{height:36px;width:36px;border-radius:12px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font:800 12px var(--mono)}
.start-scroll{flex:1;overflow:auto;min-height:0;display:flex}.start-inner{width:100%;max-width:870px;margin:auto;padding:65px 34px}.start-card{max-width:760px;margin:auto;background:var(--surface);border:1px solid var(--line-strong);border-radius:24px;padding:43px 52px 30px;box-shadow:0 9px 40px rgba(28,63,84,.025)}.start-icon{width:79px;height:79px;border-radius:23px;background:#e3f0df;border:1px solid #bed7c4;display:grid;place-items:center;margin:0 auto 35px;color:#107a96;font-size:41px;box-shadow:var(--shadow-soft)}html[data-theme=dark] .start-icon{background:#29453e;border-color:#48675c;color:var(--accent)}.accent-eyebrow{color:var(--accent);font-size:12px;letter-spacing:2px}.start-card h1{font-size:clamp(28px,3vw,38px);font-weight:760;line-height:1.15;letter-spacing:-1.4px;margin:20px 0 14px;color:#1a3b31}html[data-theme=dark] .start-card h1{color:var(--text-strong)}.start-description{font-size:16px;line-height:1.7;color:var(--secondary);margin:0 0 26px;max-width:530px}.start-network-list{display:grid;gap:10px}.start-network{display:flex;align-items:center;gap:14px;width:100%;padding:13px 17px;border:1px solid var(--line-strong);border-radius:14px;background:var(--surface);color:var(--text);text-align:left;min-height:79px}.start-network:hover{border-color:var(--accent);background:var(--accent-soft)}.start-network-logo{width:43px;height:43px;border:1px solid var(--line-strong);background:var(--side);color:var(--text-strong);font:800 17px var(--mono);border-radius:13px;display:grid;place-items:center;flex:none}.start-network-name{font-weight:760;font-size:16px;flex:1}.start-network-meta{font-size:12px;color:var(--secondary)}.start-network>.ico{color:var(--accent);width:16px}.start-join{width:100%;display:flex;gap:17px;align-items:center;text-align:left;margin-top:21px;padding:17px 19px;background:var(--surface-alt);color:var(--text-strong);border:1px solid var(--line-strong);border-radius:14px}.start-join:hover{background:var(--accent-soft);border-color:var(--accent-border)}.start-join-glyph{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:#244e40;color:#d9f0de;flex:none}.start-join>span:nth-child(2){min-width:0;flex:1}.start-join b,.start-join small{display:block}.start-join b{font-size:17px}.start-join small{color:var(--secondary);margin-top:4px;font-size:13px}.start-join>.ico{color:var(--accent)}.start-footer{font-size:12px;color:var(--secondary);margin:23px 0 0}
.home-hero{height:210px;background:linear-gradient(116deg,#0d2732 0%,#125a72 42%,#147e99 100%)}.home-hero:after{content:"#";font-size:270px;right:6%;top:-24px;color:rgba(5,39,61,.22)}.banner-sculpture{position:absolute;width:330px;height:330px;left:-80px;top:-175px;border-radius:50%;background:rgba(3,17,27,.88)}html[data-theme=dark] .home-hero{background:linear-gradient(115deg,#091a25,#134d64,#12728a)}.home-content{max-width:1140px;margin:-35px auto 60px}.home-brand{margin-bottom:40px}.home-rules{padding:24px 26px}.home-buttons{margin-top:2px;margin-bottom:36px}.home-buttons>.outline-button,.home-buttons>.primary-button{height:42px;padding:0 15px}.home-buttons>.primary-button{border-radius:10px}.explore-section{border-top:1px solid var(--line-strong);padding-top:30px}.explore-section>.eyebrow{color:var(--accent);font-size:12px}.explore-section>p{margin:8px 0 31px;color:var(--secondary)}.explore-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:17px}.explore-heading h2{font-size:25px;letter-spacing:-.6px;margin:0 0 3px}.explore-heading p{margin:0;color:var(--secondary);font-size:13px}.explore-heading>span{color:var(--secondary);font-size:12px;white-space:nowrap}.open-channel-list{border:1px solid var(--line-strong);border-radius:16px;background:var(--surface);overflow:hidden}.open-channel-row{display:flex;gap:16px;align-items:center;padding:15px 18px;min-height:92px}.open-channel-row+.open-channel-row{border-top:1px solid var(--line)}.channel-emblem{width:48px;height:48px;flex:none;border-radius:13px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}.open-channel-detail{min-width:0;flex:1}.open-channel-detail b{font-size:17px;color:var(--text-strong)}.open-channel-detail span{display:block;color:var(--secondary);font-size:12px;margin-top:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.open-channel-row .primary-button{height:39px}.home-logo{box-shadow:0 10px 25px rgba(0,0,0,.12)}
.avatar-trigger{background:none;border:0;padding:0;align-self:flex-start;border-radius:15px;flex:none}.avatar-trigger:hover .avatar{border-color:var(--accent)}.author-button{border:0;background:transparent;padding:0;line-height:1.5;text-align:left;color:var(--text-strong);font-size:14px;font-weight:780;cursor:pointer}.author-button.vip{color:var(--pink)}.author-button:hover{text-decoration:underline;text-underline-offset:3px}.msg-meta .author-button{font-size:14px}.topic-settings{width:35px;height:35px;color:var(--secondary);border:1px solid var(--line);background:var(--surface-alt)}.channel-settings-top{color:var(--secondary)}
.profile-backdrop{position:fixed;inset:0;z-index:70;background:transparent}.profile-card{position:fixed;z-index:71;background:var(--surface);border:1px solid var(--line-strong);border-radius:18px;box-shadow:var(--shadow);overflow:hidden;animation:popin .15s}.profile-banner{height:65px;background:linear-gradient(115deg,#dceff1,#bfdfe3,#c9e9df);position:relative}html[data-theme=dark] .profile-banner{background:linear-gradient(115deg,#335b61,#2a4a57,#334e4a)}.profile-dismiss{position:absolute;right:10px;top:10px;background:var(--surface);color:var(--secondary)}.profile-card-body{padding:15px 18px 17px}.profile-identity{display:flex;gap:12px;align-items:center}.profile-identity .avatar{width:52px;height:52px;font-size:18px}.profile-identity h2{font-size:18px;letter-spacing:-.4px;margin:0 0 3px;color:var(--text-strong)}.profile-status{display:flex;align-items:center;gap:6px;color:var(--secondary);font-size:12px}.profile-offline{background:var(--secondary)}.profile-tags{display:flex;gap:6px;margin-top:15px}.profile-label{margin:8px 0 15px;color:var(--muted);font:10px var(--mono)}.secondary-tag{background:var(--surface-alt);border-color:var(--line);color:var(--secondary)}.profile-buttons{display:flex;gap:8px}.profile-buttons>.primary-button,.profile-buttons>.outline-button{height:38px;font-size:12px;padding:0 10px}.profile-buttons .icon-btn{height:38px;border:1px solid var(--line);margin-left:auto}.textarea-field{min-height:93px;height:auto;resize:vertical;padding:11px 13px;line-height:1.5}.switch-row{display:flex;justify-content:space-between;gap:18px;padding:15px;border-radius:11px;background:var(--surface-alt);border:1px solid var(--line);align-items:center;font-size:12px;font-weight:650}.switch-row>span{display:flex;align-items:center;gap:10px}.switch-row .ico{color:var(--secondary)}.switch-row input{accent-color:var(--accent);width:18px;height:18px}.invite-preview{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px;background:var(--surface-alt);border:1px solid var(--line);border-radius:12px}.invite-preview code{font:600 12px var(--mono);overflow-wrap:anywhere}.muted{color:var(--secondary)}
@media(max-width:1000px){.home-content{padding:0 25px}.home-buttons{gap:8px}}
@media(max-width:680px){
 .app{min-height:0}.workspace{width:100%}.rail{position:fixed;top:0;bottom:0;left:0;width:62px;transform:translateX(-108%);transition:transform .23s ease;z-index:49;box-shadow:var(--shadow)}.rail.show{transform:translateX(0)}.sidebar{left:62px;transform:translateX(-125%);width:min(295px,calc(100vw - 91px));z-index:49}.sidebar.show{transform:translateX(0)}.mobile-shade.show{z-index:48}.topbar{padding:0 15px}.top-title{font-size:19px}.top-actions .channel-settings-top{display:inline-grid}.start-inner{padding:24px 16px;margin:auto}.start-card{padding:26px 22px 24px;border-radius:22px}.start-icon{width:67px;height:67px;border-radius:19px;margin-bottom:27px}.start-card h1{font-size:29px}.start-description{font-size:15px}.start-network-meta{font-size:11px}.start-network{min-height:70px;padding:11px 12px;gap:10px}.start-network-logo{width:39px;height:39px}.start-join{padding:12px;gap:12px}.start-join-glyph{width:48px;height:48px}.start-join b{font-size:15px}.start-join small{font-size:12px}.home-hero{height:155px}.banner-sculpture{width:260px;height:260px;top:-160px;left:-85px}.home-content{padding:0 17px;margin-top:-24px}.home-brand{margin-bottom:26px}.home-rules{padding:19px 17px;margin-bottom:18px}.home-rules h2{font-size:22px}.home-buttons{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-bottom:32px}.home-buttons>button{grid-column:span 3;min-width:0;white-space:normal;text-align:center;padding:0 7px;font-size:12px}.home-buttons>button:nth-child(3),.home-buttons>button:nth-child(4),.home-buttons>button:nth-child(5){grid-column:span 2}.home-buttons>button:nth-child(6){grid-column:span 6}.stat{padding:11px}.stat b{font-size:23px}.stat span{font-size:10px}.explore-heading{align-items:start;flex-direction:column;gap:9px}.open-channel-row{padding:13px 12px;gap:10px;min-height:78px}.channel-emblem{width:42px;height:42px}.open-channel-detail b{font-size:15px}.open-channel-detail span{font-size:11px}.open-channel-row .primary-button{height:37px;padding:0 11px}.msg-tools [data-action="message-menu"]{display:none}.msg-tools [data-action="react-menu"]{display:grid}.msg-tools{margin-left:0}.chat-message{padding-right:1px}.notification-panel{right:10px;width:min(440px,calc(100vw - 20px))}.profile-card{max-width:calc(100vw - 24px)}.topic-settings{width:31px;height:35px}
}
@media(max-width:400px){.rail{width:55px}.sidebar{left:55px;width:min(288px,calc(100vw - 80px))}.msg-tools [data-action="react-menu"]{display:grid}.start-card{padding:22px 17px}.start-description{font-size:14px}.start-network-meta{display:none}.start-join small{font-size:11px}.home-buttons>button{font-size:11px}.top-actions .channel-settings-top{display:inline-grid}}


/* Aster v4 — responsive layout and consistent controls */
.channel-welcome-host{flex:0 0 auto;background:var(--bg);border-bottom:1px solid var(--line);padding:0 30px}
.channel-welcome-host .channel-welcome{margin:9px auto;max-width:1170px;align-items:center;padding:9px 13px}
.channel-welcome-host .welcome-symbol{width:32px;height:32px}
.channel-welcome-host .welcome-eyebrow{margin-bottom:2px}
.channel-welcome-host .channel-welcome p{font-size:12px;line-height:1.45}
@media(max-width:680px){.channel-welcome-host{padding:0 10px}.channel-welcome-host .channel-welcome{margin:6px auto;padding:8px 10px;gap:9px}.channel-welcome-host .welcome-symbol{width:28px;height:28px}.channel-welcome-host .welcome-symbol .ico{width:18px;height:18px}}

html{ -webkit-text-size-adjust:100%;text-size-adjust:100% }
#app,#workspace{max-width:100%;min-width:0}
.channel-welcome{display:flex;align-items:flex-start;gap:13px;background:var(--accent-soft);border:1px solid var(--accent-border);padding:15px 18px;border-radius:15px;margin:8px 9px 24px;box-shadow:0 5px 18px rgba(7,79,108,.035)}
.welcome-symbol{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:var(--surface);color:var(--accent);flex:none}
.welcome-eyebrow{font:800 10px var(--mono);color:var(--accent);letter-spacing:.8px;text-transform:uppercase;margin:1px 0 4px}
.channel-welcome p{margin:0;font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.member-channel-choices{display:flex;flex-direction:column;gap:8px}
.member-channel-choice{background:var(--surface-alt);color:var(--text);border:1px solid var(--line);border-radius:11px;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px;text-align:left}
.member-channel-choice:hover{border-color:var(--accent-border);background:var(--accent-soft)}
.member-channel-choice>span{display:flex;align-items:center;gap:8px;min-width:0}.member-channel-choice>span:last-child{color:var(--secondary);font-size:11px;white-space:nowrap}
.dm-pin-action{position:relative;display:flex;align-items:center;gap:3px;padding:0 7px;width:auto;min-width:40px}
.dm-pin-action .ico{width:19px;height:19px}
.dm-pin-count{font:750 11px var(--mono);color:var(--accent);min-width:10px}
/* Full actions on touch screens, hover actions on pointer devices */
@media(hover:none){.msg-tools{opacity:1}}
@media(max-width:680px){
 .top-actions .channel-settings-top{display:none!important}
 .msg-tools [data-action="react-menu"],.msg-tools [data-action="message-menu"]{display:grid!important;opacity:1;visibility:visible}
 .msg-tools{display:flex!important;opacity:1;flex-shrink:0;min-width:59px;justify-content:center;gap:1px;margin-left:3px}
 .msg-tools .icon-btn{width:29px;height:30px;flex:none}
 .chat-message{gap:7px;min-width:0}
 .msg-main{min-width:0}
 .chat-feed-inner{padding-left:10px;padding-right:10px}
 .chat-topic-bar{gap:7px;padding:10px 11px}
 .topic-info{min-width:0}
 .outline-button.pin-button{width:auto;min-width:57px;height:38px;padding:0 7px;display:inline-flex;gap:4px;align-items:center;justify-content:center;flex:none;font-size:0}
 .outline-button.pin-button .pin-text{display:none}
 .outline-button.pin-button .ico{height:17px;width:17px;flex:none}
 .outline-button.pin-button .count{display:inline-block;min-width:10px;text-align:center;font:800 12px/1 var(--mono)}
 .channel-welcome{margin:8px 1px 20px;padding:12px;gap:10px;border-radius:12px}
 .channel-welcome p{font-size:12px}
 .welcome-symbol{width:30px;height:30px}
 .home-buttons>button{min-height:42px;height:auto;padding:8px 5px}
 .topbar-left{min-width:0;flex:1}
 .top-title{overflow:hidden;text-overflow:ellipsis}
 .topbar .top-actions{flex-shrink:0}
 .compose textarea,.field,.dm-side-search input{font-size:16px}
}
@media(max-width:400px){
 .msg-tools [data-action="react-menu"],.msg-tools [data-action="message-menu"]{display:grid!important}
 .msg-tools{min-width:56px;margin-left:0}
 .msg-tools .icon-btn{width:27px;height:29px}
 .chat-message{gap:6px}
 .topbar{padding-left:9px;padding-right:9px}
 .top-title{font-size:16px}
 .chat-topic-bar{gap:5px;padding:9px 8px}
 .topic-settings{width:29px}
 .topic-pinned-desc{display:none}
 .outline-button.pin-button{min-width:54px;padding:0 6px}
}

/* Aster v5: refined active state, settings, profiles and message disclosure */
.brand-mini{position:relative;flex:none}
.brand-mini.active::before{content:"";position:absolute;left:-13px;top:8px;width:4px;height:27px;border-radius:0 5px 5px 0;background:var(--accent)}
.side-head .close-side{display:none}
.home-brand>div:last-child .eyebrow{display:inline-flex;align-items:center;background:var(--surface);color:var(--accent-strong);border:1px solid var(--line-strong);border-radius:8px;box-shadow:0 4px 17px rgba(14,32,48,.12);padding:7px 11px;letter-spacing:1.1px;line-height:1.4}
/* On all breakpoints, message actions are contextual, not permanently on screen. */
.chat-message .msg-tools{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(3px);transition:opacity .15s,transform .15s}
.chat-message:hover .msg-tools,.chat-message:focus-within .msg-tools,.chat-message.is-selected .msg-tools{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)}
.chat-message.is-selected{background:var(--accent-soft)}
.chat-message:focus-visible{outline:2px solid var(--accent-border);outline-offset:-2px}
/* Account settings */
.settings-modal .modal-dialog{max-width:min(610px,calc(100vw - 28px))}
.settings-modal .modal-head{padding:25px 29px 20px}
.settings-modal .modal-body{padding:22px 29px 13px}
.settings-modal .modal-footer{padding:17px 29px 25px;border-top:1px solid var(--line);position:sticky;bottom:0;background:var(--surface);z-index:1}
.settings-modal .modal-head h2{font-size:23px;letter-spacing:-.7px}
.settings-profile-preview{display:flex;align-items:center;gap:16px;border-radius:16px;background:linear-gradient(115deg,var(--accent-soft),var(--surface-alt));border:1px solid var(--accent-border);padding:20px;margin-bottom:26px}
.settings-preview-avatar{position:relative;flex:none}
.settings-preview-avatar .avatar{height:67px;width:67px;font-size:22px;border-radius:19px}
.settings-preview-avatar .avatar>.online{display:none}
.settings-avatar-presence{position:absolute;right:-5px;bottom:-5px;padding:3px;background:var(--surface);border-radius:50%;display:grid;place-items:center}
.settings-avatar-presence .presence-dot{height:13px;width:13px}
.settings-preview-text{display:flex;flex-direction:column;min-width:0;gap:3px}
.settings-eyebrow,.profile-eyebrow{font:800 10px var(--mono);letter-spacing:1.2px;color:var(--accent);text-transform:uppercase}
.settings-preview-text strong{font-size:22px;color:var(--text-strong);letter-spacing:-.6px;overflow-wrap:anywhere;line-height:1.22}
#settings-preview-presence{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--secondary)}
.settings-preview-text small{color:var(--secondary);font-size:12px;overflow-wrap:anywhere}
.settings-section{padding:0 0 6px;margin-bottom:21px;border-bottom:1px solid var(--line)}
.settings-section-head{display:flex;align-items:center;gap:12px;margin-bottom:20px}
.settings-section-icon{width:39px;height:39px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:none}
.settings-section-head h3{font-size:16px;margin:0 0 2px;color:var(--text-strong)}
.settings-section-head p{font-size:12px;color:var(--secondary);margin:0}
.settings-modal .form-group{margin-bottom:20px}
.settings-field-hint{color:var(--secondary);font-size:12px;margin:-3px 0 11px}
.settings-presence-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.presence-choice{min-width:0;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:11px;border:1px solid var(--line-strong);background:var(--surface);color:var(--text);text-align:left;font-weight:650}
.presence-choice>span:nth-child(2){flex:1}
.presence-choice>.ico{width:16px;height:16px;opacity:0;color:var(--accent)}
.presence-choice:hover{border-color:var(--accent-border);background:var(--surface-alt)}
.presence-choice.selected{border-color:var(--accent);background:var(--accent-soft)}
.presence-choice.selected>.ico{opacity:1}
.presence-dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--green);flex:none;box-shadow:0 0 0 2px var(--surface)}
.presence-away{background:#dfaa49}.presence-dnd{background:#db6668}.presence-invisible{background:#94a1b0}
.online.presence-away{background:#dfaa49}.online.presence-dnd{background:#db6668}.online.presence-invisible{background:#94a1b0}
.settings-notifications{margin-bottom:18px}
.settings-notifications>span>span{display:flex;flex-direction:column;gap:3px}
.settings-notifications small{font-size:11px;font-weight:400;color:var(--secondary)}
.settings-modal .demo-note{margin-top:8px;margin-bottom:13px}
/* Larger profile card, coherent with the redesigned settings. */
.profile-card-v5{border-radius:19px;max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
.profile-card-v5 .profile-banner{height:109px;background:linear-gradient(113deg,#123442,#157a93 74%,#3da4ac);overflow:hidden}
html[data-theme=dark] .profile-card-v5 .profile-banner{background:linear-gradient(113deg,#091e2c,#125a74 77%,#247a83)}
.profile-banner-lines{position:absolute;width:250px;height:250px;border-radius:50%;right:-65px;top:-165px;border:45px solid rgba(255,255,255,.08)}
.profile-banner-brand{position:absolute;left:23px;top:20px;color:rgba(255,255,255,.85);font:800 11px var(--mono);letter-spacing:1.6px}
.profile-card-v5 .profile-dismiss{background:rgba(255,255,255,.9);color:#263849}
.profile-card-v5 .profile-card-body{padding:0 24px 23px}
.profile-avatar-wrap{position:relative;width:max-content;margin:-33px 0 12px;isolation:isolate}
.profile-avatar-wrap .avatar{width:77px;height:77px;border-radius:23px;border:4px solid var(--surface);font-size:23px;box-shadow:var(--shadow-soft)}
.profile-avatar-wrap .avatar>.online{display:none}
.profile-avatar-presence{position:absolute;right:0;bottom:2px;background:var(--surface);padding:3px;border-radius:50%;display:grid}
.profile-avatar-presence .presence-dot{width:14px;height:14px}
.profile-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.profile-title-row h2{font-size:25px;line-height:1.2;letter-spacing:-.7px;margin:6px 0 4px;color:var(--text-strong);overflow-wrap:anywhere}
.edit-profile-btn{background:var(--surface-alt);border:1px solid var(--line);width:35px;height:35px}
.profile-current-status{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--secondary);margin-top:4px}
.profile-current-status .presence-dot{box-shadow:none}
.profile-custom-status{background:var(--surface-alt);border-radius:10px;padding:11px 12px;margin-top:15px;display:flex;gap:10px;align-items:flex-start;overflow-wrap:anywhere;color:var(--text);font-size:12px}
.profile-custom-status .ico{color:var(--accent);flex:none}
.profile-divider{border-top:1px solid var(--line);margin:19px 0 17px}
.profile-info-heading{font:800 10px var(--mono);color:var(--secondary);letter-spacing:1.2px;text-transform:uppercase;margin-bottom:13px}
.profile-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:23px}
.profile-info-grid>div{min-width:0;display:flex;flex-direction:column;gap:5px}
.profile-info-grid span{font-size:11px;color:var(--secondary)}
.profile-info-grid strong{font-size:13px;color:var(--text-strong);overflow-wrap:anywhere}
.profile-card-v5 .profile-buttons{gap:8px}
.profile-card-v5 .profile-buttons>.primary-button,.profile-card-v5 .profile-buttons>.outline-button{font-size:12px;flex:1;height:43px;justify-content:center}
.profile-card-v5 .profile-buttons>.icon-btn{height:43px;width:44px;flex:none;margin-left:0}
.profile-card-v5 .profile-edit-main{justify-content:center}
@media(max-width:680px){
 .brand-mini.active::before{left:-9px}
 .chat-message .msg-tools{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
 .chat-message:focus-within .msg-tools,.chat-message.is-selected .msg-tools{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
 .chat-message:hover:not(:focus-within):not(.is-selected) .msg-tools{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
 .settings-modal .modal-head{padding:20px 18px 17px}
 .settings-modal .modal-body{padding:18px 17px 9px}
 .settings-modal .modal-footer{padding:15px 17px 19px}
 .settings-profile-preview{padding:16px;gap:13px}
 .settings-preview-avatar .avatar{width:57px;height:57px;border-radius:17px;font-size:19px}
 .profile-card-v5 .profile-card-body{padding-left:20px;padding-right:20px}
}
@media(max-width:365px){.settings-presence-options{gap:6px}.presence-choice{gap:6px;padding:10px 9px;font-size:12px}}
@media(hover:none){.chat-message .msg-tools{opacity:0!important;visibility:hidden!important;pointer-events:none!important}.chat-message.is-selected .msg-tools,.chat-message:focus-within .msg-tools{opacity:1!important;visibility:visible!important;pointer-events:auto!important}}


/* Bootstrap 5.3 integration — Aster's custom surface design sits above Bootstrap. */
html {--bs-font-sans-serif:var(--font);--bs-body-font-family:var(--font);--bs-body-bg:var(--bg);--bs-body-color:var(--text);--bs-primary:var(--accent-strong);--bs-border-color:var(--line);--bs-border-radius:11px;--bs-secondary-color:var(--secondary)}
body{font-family:var(--font);font-size:14px;background:var(--bg);color:var(--text)}
.btn.primary-button,.btn.outline-button{display:inline-flex;align-items:center;justify-content:center;gap:9px;box-shadow:none;font:inherit;font-weight:680}
.btn.primary-button{background:var(--accent-strong);color:#fff;border:1px solid transparent}
.btn.primary-button:hover,.btn.primary-button:focus-visible{background:var(--accent);color:#fff}
.btn.outline-button{background:var(--surface);color:var(--text);border:1px solid var(--line-strong)}
.btn.outline-button:hover,.btn.outline-button:focus-visible{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-border)}
.btn:focus-visible,.form-control:focus,.form-select:focus{box-shadow:0 0 0 3px var(--accent-soft);outline:0}
.form-control.field,.form-select.field{font-size:14px;line-height:1.5;background-color:var(--surface);color:var(--text);border-color:var(--line-strong);border-radius:11px}
.form-control.field:focus,.form-select.field:focus{background-color:var(--surface);color:var(--text);border-color:var(--accent)}
.form-control.field::placeholder{color:var(--muted)}
.form-select.field{padding-right:36px;background-image:var(--bs-form-select-bg-img);background-repeat:no-repeat;background-position:right .75rem center;background-size:16px 12px}
@media(max-width:680px){.form-control.field,.form-select.field{font-size:16px}}
.aster-bs-modal{z-index:1055;color:var(--text);}
.aster-bs-modal .modal-dialog{max-width:min(500px,calc(100vw - 28px));width:100%;margin:14px auto;}
.aster-bs-modal.settings-modal .modal-dialog{max-width:min(610px,calc(100vw - 28px))}
.aster-bs-modal .modal-content{background:var(--surface);color:var(--text);border:1px solid var(--line-strong);border-radius:19px;box-shadow:var(--shadow);overflow:hidden;max-height:calc(100dvh - 28px)}
.aster-bs-modal .modal-body{overflow-y:auto;overscroll-behavior:contain;flex:1 1 auto}
.aster-bs-modal .modal-head{flex:none}
.aster-bs-modal .modal-footer{margin:0;flex:none}
.modal-backdrop.show{background:var(--overlay);opacity:1;z-index:1050}

/* Keep the standalone layout readable with Bootstrap's typography resets. */
button .ico{pointer-events:none}
@media(prefers-reduced-motion:reduce){.aster-bs-modal .modal-dialog{transition:none!important}}

.member-offcanvas{--bs-offcanvas-width:min(360px,92vw);background:var(--side);color:var(--text);box-shadow:var(--shadow);border-left:1px solid var(--line);display:flex;flex-direction:column}.member-offcanvas .drawer-body{min-height:0}.offcanvas-backdrop.show{background:var(--overlay);opacity:1}.stats.bs-stats{display:flex;gap:0;margin-left:calc(-.5 * var(--bs-gutter-x));margin-right:calc(-.5 * var(--bs-gutter-x))}.stats.bs-stats>.col-4>.stat{height:100%}

/* App notifications: separate from Bootstrap's native .toast component. */
@media(max-width:680px){
 .toast-zone{left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));align-items:stretch}
 .aster-toast{max-width:none;width:100%;overflow-wrap:anywhere}
}


/* Aster v7 — channel mode (+m), speaking rights, and clickable channel mentions */
.channel-mention{display:inline;font:inherit;font-weight:720;color:var(--accent);background:transparent;border:0;border-radius:4px;padding:0 2px;margin:0;cursor:pointer;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
.channel-mention:hover,.channel-mention:focus-visible{background:var(--accent-soft);text-decoration-thickness:2px;outline:2px solid transparent}
.channel-mode-badge,.channel-side-mode{display:inline-flex;align-items:center;border:1px solid var(--accent-border);background:var(--accent-soft);color:var(--accent);border-radius:6px;padding:2px 6px;font:800 10px/1.25 var(--mono);white-space:nowrap;vertical-align:middle;margin-left:6px}
.channel-side-mode{padding:2px 4px;margin:0;font-size:9px}
.moderated-notice{display:flex;gap:14px;align-items:center;padding:17px 20px;background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:15px;min-height:97px;color:var(--text)}
.moderated-notice-icon{width:41px;height:41px;flex:none;border:1px solid var(--accent-border);background:var(--surface);color:var(--accent);border-radius:12px;display:grid;place-items:center}
.moderated-notice-copy{min-width:0;flex:1}.moderated-notice-copy strong{color:var(--text-strong);font-size:13px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}.moderated-notice-copy p{color:var(--secondary);font-size:12px;margin:5px 0 3px;line-height:1.45}.moderated-notice-copy small{color:var(--muted);font-size:11px}
.channel-mode-settings{display:grid;gap:12px;margin:14px 0}.channel-mode-settings .switch-row{margin:0}.channel-mode-settings .switch-row>span{align-items:flex-start}.channel-mode-settings .switch-row>span>span{display:flex;flex-direction:column;gap:5px}.channel-mode-settings .switch-row b{font-size:12px}.channel-mode-settings code{font:700 11px var(--mono);color:var(--accent);background:var(--accent-soft);padding:2px 4px;border-radius:4px}.mode-explanation{display:block;font-size:11px;line-height:1.45;color:var(--secondary);font-weight:400}
.role-preview-block{background:var(--surface-alt);border:1px solid var(--line);border-radius:12px;padding:15px}.role-preview-block .form-helper{margin:0 0 12px}.mode-privilege-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.mode-privilege{background:var(--surface);border:1px solid var(--line-strong);color:var(--secondary);border-radius:9px;text-align:center;padding:10px 8px;font:650 12px var(--font);cursor:pointer}.mode-privilege:hover,.mode-privilege:focus-visible{border-color:var(--accent)}.mode-privilege.selected{background:var(--accent-soft);border-color:var(--accent);color:var(--text-strong)}
.channel-mention-preview{display:flex;align-items:flex-start;gap:16px;padding:17px;background:var(--surface-alt);border:1px solid var(--line);border-radius:13px}.channel-mention-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;flex:none;color:var(--accent);background:var(--accent-soft)}.channel-mention-preview strong{display:block;font-size:18px;color:var(--text-strong);line-height:1.5}.channel-mention-preview p{font-size:13px;color:var(--secondary);line-height:1.6;margin:5px 0 0}.channel-mention-preview .ico{height:25px;width:25px}
@media(max-width:680px){.moderated-notice{padding:13px;gap:10px;min-height:88px}.moderated-notice-icon{width:36px;height:36px}.moderated-notice-copy strong{font-size:12px}.moderated-notice-copy p{font-size:11px}.moderated-notice-copy small{font-size:10px}.channel-mention-preview{padding:12px;gap:11px}.mode-privilege{font-size:11px;padding:9px 5px}}

/* v8: consistent active home marker, app branding and network creation */
.brand-mini.brand-button{position:relative;width:48px;height:48px;border-radius:16px;letter-spacing:-4px;line-height:1;transition:background .17s,color .17s,box-shadow .17s;margin-bottom:4px}
.brand-mini.brand-button.active{background:var(--accent-strong);color:#fff;box-shadow:0 4px 13px rgba(20,127,155,.19)}
.brand-mini.brand-button.active b{color:#d6f9ff}
html[data-theme=dark] .brand-mini.brand-button.active{color:#092837}
html[data-theme=dark] .brand-mini.brand-button.active b{color:#092837}
.brand-mini.brand-button.active::before{left:-14px;top:calc(50% - 15px);height:30px;width:4px;background:var(--accent);border-radius:0 5px 5px 0}
.brand-mini.brand-button:hover:not(.active){background:var(--accent-soft)}
.start-brand-tagline{font-size:12px;color:var(--secondary);margin:-9px 0 16px;line-height:1.5}
.start-network-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px}
.start-network-actions .start-join{margin:0;min-width:0;padding:12px;align-items:center;gap:11px;text-align:left}
.start-network-actions .start-join>span:nth-child(2){min-width:0;flex:1}
.start-network-actions .start-join b{font-size:13px;line-height:1.3;display:block}
.start-network-actions .start-join small{font-size:11px;line-height:1.45;display:block;white-space:normal}
.start-network-actions .start-join>.ico{width:16px;height:16px}
.start-create-glyph{background:var(--accent-soft)!important;color:var(--accent)!important}
.network-choice-grid{display:grid;gap:10px}
.network-choice{width:100%;display:flex;align-items:center;gap:13px;text-align:left;color:var(--text);background:var(--surface-alt);border:1px solid var(--line-strong);border-radius:14px;padding:16px;transition:background .15s,border-color .15s,transform .15s}
.network-choice:hover,.network-choice:focus-visible{background:var(--accent-soft);border-color:var(--accent-border)}
.network-choice>span:nth-child(2){min-width:0;flex:1}
.network-choice strong{display:block;color:var(--text-strong);font-size:15px;margin-bottom:3px}
.network-choice small{display:block;font-size:12px;color:var(--secondary)}
.network-choice>.ico{color:var(--secondary)}
.network-choice-glyph{width:47px;height:47px;display:grid;place-items:center;flex:none;border-radius:13px;background:var(--accent-soft);color:var(--accent)}
.network-choice-glyph.join{background:var(--surface);color:var(--accent-strong)}
.app-identity-preview{display:flex;align-items:center;gap:14px;padding:15px;border-radius:14px;background:var(--surface-alt);border:1px solid var(--line);margin:0 0 20px}
.app-identity-symbol{font:900 26px var(--mono);letter-spacing:-3px;display:flex;align-items:center;justify-content:center;width:55px;height:55px;background:var(--accent-soft);color:var(--text-strong);border-radius:15px;flex:none}
.app-identity-symbol b{color:var(--accent)}
.app-identity-preview>div{min-width:0}
.app-identity-preview small{font:800 10px var(--mono);letter-spacing:1px;color:var(--muted);display:block}
.app-identity-preview strong{display:block;color:var(--text-strong);font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.app-identity-preview p{margin:2px 0 0;color:var(--secondary);font-size:12px;overflow-wrap:anywhere}
.app-identity-fields{display:grid;grid-template-columns:minmax(105px,1fr) minmax(0,2fr);gap:12px}
.app-identity-fields .form-group{min-width:0}
.invite-link-field{display:flex;gap:8px;align-items:stretch}
.invite-link-field input{min-width:0;flex:1;font:12px var(--mono)}
.invite-link-field button{flex:none}
.invite-form-preview{padding:11px 0 0;font-size:12px;min-height:38px}
.invite-valid{color:var(--green);display:inline-flex;align-items:center;gap:6px}
.invite-invalid{color:var(--pink);display:inline-flex;align-items:center;gap:6px}
@media(max-width:680px){.brand-mini.brand-button.active::before{left:-11px}.start-network-actions{grid-template-columns:1fr}.start-network-actions .start-join{padding:12px 14px}.app-identity-fields{grid-template-columns:1fr}.invite-link-field{flex-direction:column}.invite-link-field button{width:100%}}
@media(max-width:400px){.brand-mini.brand-button.active::before{left:-9px}.start-brand-tagline{font-size:11px}}

.app-settings-modal .modal-dialog{max-width:min(610px,calc(100vw - 28px))}
.app-settings-modal .modal-body{padding:22px 26px 10px}
.app-settings-modal .settings-section{border-bottom:0;margin-bottom:0}
@media(max-width:680px){.app-settings-modal .modal-body{padding:18px 17px 7px}.settings-destination{min-height:80px;padding:12px 13px}.settings-destination-icon{width:44px;height:44px}}

/* v8.2 — account profile control in rail and app settings on the app start page */
.rail-profile-trigger{position:relative;isolation:isolate;display:grid;place-items:center;width:47px;height:47px;flex:none;background:var(--surface);color:var(--text-strong);border:1px solid var(--line-strong);border-radius:16px;box-shadow:0 2px 9px rgba(13,45,66,.04);font-family:var(--mono);transition:background .16s,transform .16s,border-color .16s}
.rail-profile-trigger:hover{background:var(--accent-soft);border-color:var(--accent-border);transform:translateY(-1px);color:var(--text-strong)}
.rail-profile-trigger:focus-visible{outline:3px solid var(--accent-border);outline-offset:3px}
.rail-profile-initials{font-size:15px;font-weight:850;letter-spacing:-.8px;line-height:1}
.rail-profile-trigger .presence-dot{position:absolute;right:-3px;bottom:-2px;width:13px;height:13px;border:2px solid var(--rail);box-shadow:0 0 0 1px var(--rail)}
.start-brand-row{display:flex;align-items:center;justify-content:space-between;gap:10px 14px;flex-wrap:wrap}
.start-brand-row .accent-eyebrow{min-width:0;overflow-wrap:anywhere;flex:1 1 170px}
.start-app-settings-trigger{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:7px 12px;flex:none;white-space:nowrap;text-align:center;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface-alt);color:var(--text-strong);font-size:12px;font-weight:750;line-height:1.2;transition:background .16s,border-color .16s,color .16s}
.start-app-settings-trigger>.ico{color:var(--accent)}
.start-app-settings-trigger:hover{background:var(--accent-soft);border-color:var(--accent-border);color:var(--text-strong)}
.start-app-settings-trigger:focus-visible{outline:3px solid var(--accent-border);outline-offset:2px}
@media(max-width:680px){.rail-profile-trigger{width:43px;height:43px;border-radius:14px}.rail-profile-initials{font-size:13px}.start-app-settings-trigger{font-size:11px;padding:7px 10px;min-height:34px}}