:root{
  /* Layout: trilho de servidores | canais ou DMs | conversa | membros. Tema escuro único, ardósia com acento âmbar. */
  --rail:#0c1114; --side:#131a1e; --me:#0f1518; --main:#192227; --elev:#212c32; --hover:#253239; --line:#2a373e;
  --text:#e3eaec; --muted:#8a9ca4; --faint:#5c6e77;
  --accent:#f2a541; --accent-ink:#1d1405; --accent-soft:rgba(242,165,65,.13);
  --ok:#47c187; --idle:#e9c46a; --dnd:#e5534b; --off:#6b7c85;
  --f-display:"Bricolage Grotesque", system-ui, sans-serif;
  --f-body:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--main);color:var(--text);font:15px/1.45 var(--f-body);-webkit-font-smoothing:antialiased;overflow:hidden}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.55}
input,textarea{font:inherit;color:inherit}
a{color:#7cc4ff}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
[hidden]{display:none!important}
svg.i{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.muted{color:var(--muted)}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#0b0f12;border-radius:8px;border:2px solid transparent;background-clip:padding-box}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- Auth ---------- */
.auth{height:100%;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,1fr);background:var(--rail)}
.auth-brand{position:relative;padding:56px clamp(24px,6vw,88px);display:flex;flex-direction:column;justify-content:center;gap:22px;overflow:hidden}
.auth-brand canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.55}
.auth-brand>*:not(canvas){position:relative}
.brand{display:flex;align-items:center;gap:12px;color:var(--accent)}
.brand svg{width:44px;height:44px;stroke-width:1.8}
.brand b{font:800 34px/1 var(--f-display);color:var(--text);letter-spacing:-.02em}
.auth-brand h1{font:800 clamp(30px,4vw,48px)/1.05 var(--f-display);margin:0;letter-spacing:-.025em;max-width:14ch;text-wrap:balance}
.auth-brand p{margin:0;color:var(--muted);max-width:44ch;font-size:16px}
.feat{display:grid;gap:10px;margin:6px 0 0;padding:0;list-style:none;max-width:44ch}
.feat li{display:flex;gap:10px;align-items:flex-start;color:var(--text)}
.feat li svg{color:var(--accent);margin-top:2px}
.auth-card{background:var(--side);display:flex;align-items:center;justify-content:center;padding:32px 20px;overflow-y:auto}
.auth-form{width:100%;max-width:400px;display:grid;gap:16px}
.auth-form h2{font:700 26px/1.15 var(--f-display);margin:0}
.auth-form .sub{margin:-8px 0 4px;color:var(--muted)}
.fld{display:grid;gap:6px}
.lbl{font:600 11.5px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);display:block}
.inp,.modal input[type=text],.modal input:not([type]),.modal input[type=password],.modal textarea,.pop input{width:100%;height:42px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:var(--rail);outline:none;transition:border-color .15s}
.modal textarea{height:auto;padding:10px 12px;resize:vertical;min-height:84px}
.inp:focus,.modal input:focus,.modal textarea:focus,.pop input:focus{border-color:var(--accent)}
.chk{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;cursor:pointer}
.chk input{accent-color:var(--accent);width:16px;height:16px}
.err{color:#ff8a83;font-size:14px;margin:0;min-height:1.2em}
.switch{color:var(--muted);font-size:14px;margin:0}
.switch button{color:var(--accent);font-weight:600}
.note{font-size:12.5px;color:var(--faint);margin:0;border-top:1px solid var(--line);padding-top:14px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 16px;border-radius:8px;background:var(--accent);color:var(--accent-ink);font-weight:600;white-space:nowrap;transition:filter .15s,background .15s}
.btn:hover:not(:disabled){filter:brightness(1.08)}
.btn.sm{height:32px;padding:0 12px;font-size:13.5px}
.btn.ghost{background:var(--hover);color:var(--text)}
.btn.ghost:hover:not(:disabled){background:#2d3b43;filter:none}
.btn.ok{background:var(--ok);color:#06190f}
.btn.danger{background:var(--dnd);color:#fff}
.btn.block{width:100%;height:44px}
.danger-t{color:#ff8a83!important}
.link{color:var(--accent);font-size:13.5px;font-weight:600}

/* ---------- App shell ---------- */
.app{display:grid;grid-template-columns:auto minmax(0,1fr);height:100%}
.app.has-members{grid-template-columns:auto minmax(0,1fr) 248px}
.nav{display:flex;height:100%;min-height:0}
.rail{width:72px;background:var(--rail);display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 0;overflow-y:auto;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail-item{position:relative;width:72px;display:flex;justify-content:center;flex:none}
.pill{position:absolute;left:0;top:50%;width:4px;height:0;background:var(--text);border-radius:0 4px 4px 0;transform:translateY(-50%);transition:height .15s}
.rail-item.unread .pill{height:8px}.rail-item:hover .pill{height:20px}.rail-item.active .pill{height:40px}
.rail-btn{position:relative;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--elev);color:var(--text);font:700 16px var(--f-display);transition:border-radius .15s,background .15s,color .15s;flex:none}
.rail-btn:hover,.rail-item.active .rail-btn{border-radius:15px}
.rail-btn svg{width:26px;height:26px}
.rail-btn.home{color:var(--accent)}
.rail-item.active .rail-btn.home,.rail-btn.home:hover{background:var(--accent);color:var(--accent-ink)}
.rail-btn.srv{background:color-mix(in srgb,var(--c) 20%,var(--elev));color:var(--c)}
.rail-item.active .rail-btn.srv,.rail-btn.srv:hover{background:var(--c);color:#111}
.rail-btn.add{color:var(--ok)}
.rail-btn.add:hover{background:var(--ok);color:#06190f}
.rail-sep{width:32px;height:2px;background:var(--line);border-radius:1px;flex:none}
.badge{position:absolute;right:-5px;bottom:-5px;min-width:22px;height:22px;padding:0 5px;border-radius:11px;background:var(--dnd);color:#fff;font:700 12px/16px var(--f-body);text-align:center;border:3px solid var(--rail)}

.side{width:248px;background:var(--side);display:flex;flex-direction:column;min-height:0}
.side-body{flex:1;overflow-y:auto;min-height:0;padding-bottom:12px}
.side-hdr{height:52px;flex:none;display:flex;align-items:center;padding:0 10px;border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(0,0,0,.2)}
.find{width:100%;height:30px;border-radius:6px;background:var(--rail);color:var(--muted);font-size:13px;text-align:left;padding:0 10px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.srv-hdr{width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 8px;border-radius:6px;font:700 15px var(--f-display);text-align:left}
.srv-hdr:hover{background:var(--hover)}
.srv-hdr span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.sec{display:flex;align-items:center;justify-content:space-between;padding:18px 10px 4px 16px;font:600 11.5px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ibtn{display:grid;place-items:center;width:32px;height:32px;border-radius:6px;color:var(--muted);flex:none}
.ibtn:hover,.ibtn.on{color:var(--text);background:var(--hover)}
.ibtn.xs{width:22px;height:22px}.ibtn.xs svg{width:16px;height:16px}
.pad{padding:8px 0 0}
.row{display:flex;align-items:center;margin:1px 8px;border-radius:6px;color:var(--muted);position:relative;min-height:40px}
.row:hover{background:var(--hover);color:var(--text)}
.row.on{background:var(--elev);color:var(--text)}
.row.unread{color:var(--text)}
.row.unread .rname{font-weight:700}
.row-main{flex:1;min-width:0;display:flex;align-items:center;gap:10px;padding:5px 8px;text-align:left;border-radius:6px;min-height:40px}
.row.ch{min-height:34px}.row.ch .row-main{min-height:34px;gap:6px}
.row.ch .hash{color:var(--faint)}.row.ch.on .hash,.row.ch:hover .hash{color:var(--muted)}
.row.big .row-main{font-weight:600}
.rtext{display:grid;min-width:0;line-height:1.2}
.rname{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.rtext small{color:var(--faint);font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.row-x{display:none;width:24px;height:24px;margin-right:6px;border-radius:4px;color:var(--muted);place-items:center}
.row-x svg{width:15px;height:15px}
.row:hover .row-x,.row-x:focus-visible{display:grid}
.row-x:hover{color:var(--text)}
.nbadge{min-width:18px;height:18px;padding:0 5px;margin-right:8px;border-radius:9px;background:var(--dnd);color:#fff;font:700 11.5px/18px var(--f-body);text-align:center;flex:none}
.row:hover .nbadge{display:none}
.row.big:hover .nbadge{display:block}
.side-empty{color:var(--faint);font-size:13px;padding:6px 16px;margin:0}
.inv-quick{margin:10px 8px 0;display:flex;align-items:center;gap:8px;width:calc(100% - 16px);padding:8px 10px;border-radius:8px;background:var(--accent-soft);color:var(--accent);font-weight:600;font-size:13.5px}
.inv-quick:hover{background:rgba(242,165,65,.22)}

.me{flex:none;height:56px;background:var(--me);display:flex;align-items:center;gap:2px;padding:0 8px}
.me-id{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:4px 6px;border-radius:6px;text-align:left}
.me-id:hover{background:var(--hover)}
.me-id .rname{font-weight:600;font-size:14px}

/* avatars */
.av{--s:32px;position:relative;width:var(--s);height:var(--s);border-radius:50%;display:inline-grid;place-items:center;flex:none;color:#111;font:700 calc(var(--s)*.4)/1 var(--f-display);text-transform:uppercase;user-select:none}
.av.grp{border-radius:30%;color:#111}
.av.grp svg{width:55%;height:55%}
.dot{--d:calc(var(--s)*.34);position:absolute;right:calc(var(--d)*-.18);bottom:calc(var(--d)*-.18);width:var(--d);height:var(--d);min-width:10px;min-height:10px;border-radius:50%;border:3px solid var(--ring,var(--side));box-sizing:content-box}
.dot.online{background:var(--ok)}
.dot.idle{background:var(--idle);-webkit-mask:radial-gradient(circle at 25% 25%,transparent 32%,#000 34%);mask:radial-gradient(circle at 25% 25%,transparent 32%,#000 34%)}
.dot.idle{-webkit-mask:none;mask:none;background:radial-gradient(circle at 28% 28%,var(--ring,var(--side)) 0 30%,var(--idle) 32%)}
.dot.dnd{background:linear-gradient(var(--dnd),var(--dnd)) ;background:radial-gradient(ellipse 34% 12% at 50% 50%,var(--ring,var(--side)) 98%,transparent 100%),var(--dnd)}
.dot.off,.dot.invisible{background:radial-gradient(circle,var(--ring,var(--side)) 0 36%,var(--off) 38%)}

/* ---------- Main ---------- */
.main{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--main)}
.mhdr{height:52px;flex:none;display:flex;align-items:center;gap:8px;padding:0 12px 0 16px;border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(0,0,0,.2);min-width:0}
.mhdr .ttl{font:700 16px var(--f-display);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mhdr .ttl-ic,.mhdr .hash{color:var(--faint);display:grid}
.ttl-sub{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.vsep{width:1px;height:24px;background:var(--line);margin:0 6px;flex:none}
.hdr-act{margin-left:auto;display:flex;gap:4px;flex:none}
.burger{display:none}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;min-width:0}
.tabs::-webkit-scrollbar{display:none}
.tab{height:28px;padding:0 10px;border-radius:6px;color:var(--muted);font-weight:500;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.tab:hover{background:var(--hover);color:var(--text)}
.tab.on{background:var(--elev);color:var(--text)}
.tab.add{background:var(--ok);color:#06190f;font-weight:600}
.tab.add.on{background:transparent;color:var(--ok)}
.cnt{background:var(--dnd);color:#fff;border-radius:9px;min-width:18px;height:18px;padding:0 5px;font:700 11.5px/18px var(--f-body)}

/* friends */
.fbody{flex:1;overflow-y:auto;padding:16px 20px 24px}
.fsearch{margin-bottom:14px}
.fsearch input{width:100%;height:36px;border-radius:6px;border:1px solid var(--line);background:var(--rail);padding:0 12px;outline:none}
.fsearch input:focus{border-color:var(--accent)}
.fcount{font:600 11.5px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:4px 10px 8px;border-bottom:1px solid var(--line)}
.frow{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;border-top:1px solid var(--line);margin-top:-1px}
.frow:hover{background:var(--hover);border-color:transparent}
.frow:hover+.frow{border-color:transparent}
.frow-main{flex:1;min-width:0;display:flex;align-items:center;gap:12px;text-align:left}
.frow .rname{font-weight:600}
.frow small{color:var(--muted);font-size:13px}
.fact{display:flex;gap:8px}
.cbtn{width:36px;height:36px;border-radius:50%;background:var(--side);color:var(--muted);display:grid;place-items:center}
.cbtn:hover{color:var(--text)}.cbtn.yes:hover{color:var(--ok)}.cbtn.no:hover{color:var(--dnd)}
.empty{display:grid;justify-items:center;text-align:center;gap:10px;padding:60px 20px;color:var(--muted)}
.empty svg{width:64px;height:64px;color:var(--faint);stroke-width:1.4}
.add-sec h2{font:700 18px var(--f-display);margin:0 0 4px}
.add-form{display:flex;gap:8px;align-items:center;margin-top:14px;padding:6px 6px 6px 14px;border-radius:10px;background:var(--rail);border:1px solid var(--line)}
.add-form:focus-within{border-color:var(--accent)}
.add-form.ok{border-color:var(--ok)}.add-form.err{border-color:var(--dnd)}
.add-form input{flex:1;min-width:0;height:40px;border:0;background:transparent;outline:none;font-size:16px}
.add-msg{font-size:14px;margin:8px 2px 0}.add-msg.ok{color:var(--ok)}.add-msg.err{color:#ff8a83}
.sec2{font:600 11.5px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:32px 0 6px;padding-bottom:8px;border-bottom:1px solid var(--line)}

/* chat */
.chat{flex:1;display:flex;flex-direction:column;min-height:0}
.msgs{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 0 14px}
.intro{padding:40px 16px 12px;display:grid;gap:8px;justify-items:start}
.intro .big-ic{width:68px;height:68px;border-radius:50%;background:var(--elev);display:grid;place-items:center;color:var(--text)}
.intro .big-ic svg{width:38px;height:38px}
.intro h2{font:800 28px/1.15 var(--f-display);margin:4px 0 0;letter-spacing:-.015em;text-wrap:balance}
.intro p{margin:0;color:var(--muted)}
.intro .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.day{display:flex;align-items:center;gap:8px;margin:18px 16px 6px;color:var(--faint);font:600 12px var(--f-body)}
.day::before,.day::after{content:"";flex:1;height:1px;background:var(--line)}
.msg{position:relative;display:grid;grid-template-columns:56px minmax(0,1fr);padding:2px 48px 2px 16px;margin-top:14px}
.msg.cont{margin-top:0}
.msg:hover{background:rgba(0,0,0,.12)}
.msg.mention{background:var(--accent-soft);box-shadow:inset 2px 0 var(--accent)}
.msg.flash{animation:flash 1.2s}
@keyframes flash{0%,40%{background:rgba(242,165,65,.28)}100%{background:transparent}}
.gut{padding-top:2px}
.gut .av{cursor:pointer}
.hov-time{display:none;font-size:11px;color:var(--faint);padding-top:4px;font-variant-numeric:tabular-nums}
.msg.cont:hover .hov-time{display:block}
.mhead{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.uname{font-weight:600;font-size:15px}
.uname:hover{text-decoration:underline}
.mhead time{font-size:12px;color:var(--faint)}
.tag{display:inline-block;font:700 10px/16px var(--f-body);letter-spacing:.04em;padding:0 5px;border-radius:4px;background:var(--accent);color:var(--accent-ink);vertical-align:2px}
.tag.own{background:var(--elev);color:var(--accent)}
.mtext{white-space:normal;word-wrap:break-word;overflow-wrap:anywhere}
.mtext.big{font-size:40px;line-height:1.2}
.mtext code{font:13.5px var(--f-mono);background:var(--rail);padding:1px 5px;border-radius:4px}
.mtext pre{background:var(--rail);border:1px solid var(--line);border-radius:6px;padding:10px 12px;overflow-x:auto;margin:4px 0;max-width:100%}
.mtext pre code{background:none;padding:0;white-space:pre}
.edited{font-size:11px;color:var(--faint);margin-left:4px}
.mention-chip,.ch-chip{background:var(--accent-soft);color:var(--accent);border-radius:4px;padding:0 3px;font-weight:600}
.mention-chip:hover,.ch-chip:hover{background:var(--accent);color:var(--accent-ink)}
.sysmsg{display:flex;align-items:center;gap:12px;padding:6px 48px 6px 16px;margin-top:10px;color:var(--muted);font-size:14px}
.sysmsg svg{color:var(--ok);margin-left:18px;margin-right:6px}
.sysmsg time{font-size:12px;color:var(--faint)}
.sysmsg b{color:var(--text)}
.blocked-msg{padding:4px 16px 4px 72px;color:var(--faint);font-size:13px;font-style:italic;margin-top:6px}
.rep{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted);margin:0 0 2px;min-width:0;text-align:left;max-width:100%}
.rep::before{content:"";width:28px;height:10px;border:2px solid var(--line);border-right:0;border-bottom:0;border-radius:6px 0 0 0;margin-left:-36px;margin-top:8px;flex:none}
.rep b{color:var(--text);font-weight:600;flex:none}
.rep span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.rep:hover span{color:var(--text)}
.rx{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.rxb{height:26px;padding:0 8px;border-radius:8px;background:var(--elev);border:1px solid transparent;display:inline-flex;align-items:center;gap:5px;font-size:14px}
.rxb b{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.rxb.me{background:var(--accent-soft);border-color:var(--accent)}.rxb.me b{color:var(--accent)}
.rxb:hover{border-color:var(--muted)}
.mact{position:absolute;right:16px;top:-14px;display:none;background:var(--elev);border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.25);z-index:2}
.msg:hover .mact,.mact:focus-within{display:flex}
.mact button{width:32px;height:30px;display:grid;place-items:center;color:var(--muted)}
.mact button:hover{color:var(--text);background:var(--hover)}
.mact button.del:hover{color:var(--dnd)}
.mact svg{width:18px;height:18px}
.edit-box{width:100%;min-height:44px;border-radius:8px;border:1px solid var(--line);background:var(--elev);padding:10px 12px;resize:none;outline:none;margin-top:2px}
.edit-hint{font-size:12px;color:var(--muted);margin-top:2px}
.edit-hint button{color:#7cc4ff}
.inv{margin-top:6px;background:var(--side);border:1px solid var(--line);border-radius:10px;padding:12px 14px;max-width:430px}
.inv-k{font:600 11.5px var(--f-body);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.inv-row{display:flex;align-items:center;gap:12px}
.srv-ic{width:48px;height:48px;border-radius:15px;background:var(--c);color:#111;display:grid;place-items:center;font:700 17px var(--f-display);flex:none}
.inv-meta{flex:1;min-width:0;display:grid}
.inv-meta small{color:var(--muted)}

.cwrap{flex:none;padding:0 16px 4px}
.replybar{display:flex;align-items:center;gap:8px;background:var(--side);border-radius:8px 8px 0 0;padding:8px 8px 8px 14px;font-size:13.5px;color:var(--muted)}
.replybar b{color:var(--text)}
.replybar .ibtn{margin-left:auto;width:24px;height:24px}
.composer{display:flex;align-items:flex-end;gap:4px;background:var(--elev);border-radius:10px;padding:6px}
.replybar+.composer{border-radius:0 0 10px 10px}
.composer textarea{flex:1;min-width:0;border:0;background:transparent;outline:none;resize:none;padding:7px 4px;max-height:40vh;line-height:1.4;min-height:34px;font-size:15px}
.composer textarea::placeholder{color:var(--faint)}
.composer .ibtn{width:34px;height:34px}
.composer .send{color:var(--accent)}
.composer.locked{justify-content:center;padding:14px;color:var(--muted);font-size:14px}
.typing{height:22px;font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:6px;padding:0 4px}
.typing b{color:var(--text);font-weight:600}
.dots{display:inline-flex;gap:3px}
.dots i{width:5px;height:5px;border-radius:50%;background:var(--muted);animation:bob 1s infinite}
.dots i:nth-child(2){animation-delay:.15s}.dots i:nth-child(3){animation-delay:.3s}
@keyframes bob{0%,60%,100%{transform:none;opacity:.5}30%{transform:translateY(-3px);opacity:1}}

/* members */
.members{background:var(--side);overflow-y:auto;padding:4px 0 16px;display:none;min-height:0}
.app.has-members .members{display:block}
.members .sec{padding-top:20px}
.mrow{display:flex;align-items:center;gap:10px;margin:1px 8px;padding:5px 8px;border-radius:6px;width:calc(100% - 16px);text-align:left}
.mrow:hover{background:var(--hover)}
.mrow.off{opacity:.42}.mrow.off:hover{opacity:1}
.mrow .rname{font-weight:500}

/* overlays */
.overlay{position:fixed;inset:0;background:rgba(3,6,8,.72);display:grid;place-items:center;z-index:50;padding:16px;animation:fade .12s}
@keyframes fade{from{opacity:0}}
.modal{width:min(460px,100%);max-height:calc(100% - 16px);overflow-y:auto;background:var(--elev);border-radius:12px;padding:24px;display:grid;gap:14px;box-shadow:0 20px 60px rgba(0,0,0,.5);animation:pop .14s}
@keyframes pop{from{transform:scale(.97);opacity:0}}
.modal.wide{width:min(860px,100%);padding:0;height:min(620px,100%)}
.modal h2{font:700 21px/1.2 var(--f-display);margin:0;text-wrap:balance}
.modal .sub{margin:-8px 0 0;color:var(--muted)}
.modal p{margin:0}
.mfoot{display:flex;justify-content:flex-end;gap:8px;margin:6px -24px -24px;padding:14px 24px;background:var(--side);border-radius:0 0 12px 12px}
.mfoot.split{justify-content:space-between}
.choice{display:grid;gap:10px}
.choice-btn{display:flex;align-items:center;gap:14px;padding:14px;border-radius:10px;border:1px solid var(--line);background:var(--side);text-align:left}
.choice-btn:hover{border-color:var(--accent)}
.choice-btn svg{width:28px;height:28px;color:var(--accent)}
.choice-btn span{display:grid}.choice-btn small{color:var(--muted)}
.swatches{display:flex;flex-wrap:wrap;gap:8px}
.swc{position:relative;cursor:pointer}
.swc input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.swc span{display:block;width:32px;height:32px;border-radius:50%;background:var(--c);border:3px solid transparent}
.swc input:checked+span{border-color:var(--text);box-shadow:0 0 0 2px var(--elev) inset}
.swc input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.preview-row{display:flex;align-items:center;gap:14px}
.list{display:grid;gap:2px;max-height:260px;overflow-y:auto;margin:0 -8px}
.lrow{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:8px}
.lrow:hover{background:var(--hover)}
.lname{flex:1;min-width:0;display:grid;font-weight:500;overflow:hidden}
.lname small{color:var(--muted);font-weight:400}
.pickrow{cursor:pointer}
.pickrow input{position:absolute;opacity:0;pointer-events:none}
.cbx{width:22px;height:22px;border-radius:6px;border:2px solid var(--muted);flex:none;display:grid;place-items:center}
.pickrow input:checked~.cbx{background:var(--accent);border-color:var(--accent)}
.pickrow input:checked~.cbx::after{content:"";width:6px;height:11px;border:solid var(--accent-ink);border-width:0 2.5px 2.5px 0;transform:rotate(45deg) translate(-1px,-1px)}
.pickrow input:focus-visible~.cbx{outline:2px solid var(--accent);outline-offset:2px}
.pickrow.dis{opacity:.4;cursor:not-allowed}
.codebox{display:flex;gap:8px;align-items:center;background:var(--rail);border:1px solid var(--line);border-radius:8px;padding:6px 6px 6px 14px}
.codebox code{flex:1;font:600 17px var(--f-mono);letter-spacing:.12em}
.inline{display:flex;gap:8px}
.inline input{flex:1}
.hint{font-size:13px;color:var(--muted)}
.ferr{color:#ff8a83;font-size:13.5px;min-height:1.2em}

.set{display:grid;grid-template-columns:220px minmax(0,1fr);height:100%;position:relative}
.set-nav{background:var(--side);padding:28px 10px;display:flex;flex-direction:column;gap:2px;border-radius:12px 0 0 12px}
.set-k{font:600 11.5px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:0 10px 8px}
.set-nav button{text-align:left;padding:7px 10px;border-radius:6px;color:var(--muted);font-weight:500}
.set-nav button:hover{background:var(--hover);color:var(--text)}
.set-nav button.on{background:var(--hover);color:var(--text)}
.set-body{padding:28px 32px;overflow-y:auto;display:grid;gap:16px;align-content:start}
.set-body h3{font:700 20px var(--f-display);margin:0}
.set-x{position:absolute;top:14px;right:14px}
.card-prev{border-radius:12px;overflow:hidden;background:var(--rail);max-width:340px}
.card-prev .bn{height:64px}
.card-prev .bd{padding:0 16px 16px;margin-top:-30px;display:grid;gap:4px}
.card-prev .bd .av{border:5px solid var(--rail);box-sizing:content-box}
.card-prev b{font:700 18px var(--f-display)}
.dangerbox{border:1px solid rgba(229,83,75,.5);background:rgba(229,83,75,.07);border-radius:10px;padding:16px;display:grid;gap:12px}

.pop{position:fixed;z-index:60;background:var(--elev);border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 40px rgba(0,0,0,.5);animation:pop .1s;max-width:calc(100vw - 16px)}
.pop-menu{padding:6px;width:260px;display:grid;gap:2px}
.pm-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;text-align:left;width:100%;color:var(--text);font-size:14px}
.pm-item:hover{background:var(--accent);color:var(--accent-ink)}
.pm-item:hover small{color:var(--accent-ink)}
.pm-item.dz{color:#ff8a83}.pm-item.dz:hover{background:var(--dnd);color:#fff}
.pm-item span{display:grid}.pm-item small{color:var(--muted);font-size:12px}
.pm-item svg{width:18px;height:18px;margin-left:auto}
.pm-sep{height:1px;background:var(--line);margin:4px 6px}
.pm-custom{display:flex;gap:6px;padding:4px}
.pm-custom input{height:34px}
.pop .lbl{padding:6px 10px 0}
.dot-l{width:12px;height:12px;border-radius:50%;flex:none;position:relative}
.dot-l.online{background:var(--ok)}.dot-l.idle{background:var(--idle)}.dot-l.dnd{background:var(--dnd)}.dot-l.invisible{background:transparent;border:3px solid var(--off)}
.emo{width:296px;padding:10px;display:grid;grid-template-columns:repeat(8,1fr);gap:2px}
.emo button{height:34px;font-size:21px;border-radius:6px}
.emo button:hover{background:var(--hover)}
.prof{width:300px;overflow:hidden;border-radius:10px}
.prof-banner{height:60px}
.prof-av{padding:0 16px;margin-top:-40px}
.prof-av .av{border:6px solid var(--elev);box-sizing:content-box}
.prof-body{padding:8px 16px 16px;display:grid;gap:2px}
.prof-name{font:700 20px var(--f-display)}
.prof-user{color:var(--muted);font-size:14px}
.prof-custom{font-size:14px;margin-top:6px}
.prof-sep{height:1px;background:var(--line);margin:12px 0}
.prof-k{font:600 11px var(--f-body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.prof-about{margin:2px 0 8px;font-size:14px;white-space:pre-wrap}
.prof-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}

.toasts{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);display:grid;gap:8px;z-index:70;width:max-content;max-width:calc(100vw - 32px)}
.toast{background:#f4f1ea;color:#15191b;padding:10px 16px;border-radius:10px;font-weight:500;font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.4);animation:pop .15s;text-align:left}
.scrim{display:none}

@media (max-width:1100px){.app.has-members{grid-template-columns:auto minmax(0,1fr) 220px}}
@media (max-width:820px){
  .app,.app.has-members{grid-template-columns:minmax(0,1fr)}
  .nav{position:fixed;inset:0 auto 0 0;z-index:40;transform:translateX(-102%);transition:transform .2s;box-shadow:8px 0 30px rgba(0,0,0,.5)}
  .app.nav-open .nav{transform:none}
  .app.has-members .members{position:fixed;inset:0 0 0 auto;width:min(270px,85vw);z-index:40;box-shadow:-8px 0 30px rgba(0,0,0,.5)}
  .scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:35}
  .app.nav-open .scrim,.app.has-members .scrim{display:block}
  .burger{display:grid}
  .mhdr{padding-left:6px}
  .msg{padding-right:16px;grid-template-columns:52px minmax(0,1fr)}
  .mact{top:-30px}
  .set{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .set-nav{flex-direction:row;overflow-x:auto;padding:12px 48px 12px 10px;border-radius:12px 12px 0 0}
  .set-k{display:none}
  .set-body{padding:20px}
  .auth{grid-template-columns:1fr;overflow-y:auto}
  .auth-brand{padding:32px 24px 8px;gap:12px}
  .auth-brand h1,.feat{display:none}
  .auth-card{align-items:flex-start}
  .fbody{padding:12px}
  .fact .cbtn{width:34px;height:34px}
}

/* ======================= Versão com servidor: acréscimos ======================= */
.boot{height:100%;display:grid;place-content:center;justify-items:center;gap:14px;background:var(--rail);color:var(--muted)}
.boot .brand svg{animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.4}}
.conn{position:fixed;top:0;left:0;right:0;z-index:80;background:var(--dnd);color:#fff;text-align:center;font-weight:600;font-size:13.5px;padding:6px}

/* imagens em avatares, ícones e banners */
.av img,.rail-btn img,.srv-ic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.av{overflow:visible}
.av>img{border-radius:50%}
.srv-ic{position:relative;overflow:hidden}
.rail-btn.img{background:var(--elev);overflow:hidden}
.rail-btn .badge{z-index:1}
.prof-banner{background-size:cover!important;background-position:center!important}
.card-prev .bn{background-size:cover!important;background-position:center!important}

/* campos de mídia */
.mbtns{display:flex;flex-wrap:wrap;gap:8px}
.mbtns label.btn{cursor:pointer}
.mbtns svg,.btn svg{width:17px;height:17px}

/* canais de voz na lateral */
.row.vc .hash{color:var(--faint)}
.row.vc.in-call .hash{color:var(--ok)}
.vlist{margin:0 8px 6px 38px;display:grid;gap:1px}
.vrow{display:flex;align-items:center;gap:8px;padding:3px 6px;border-radius:6px;color:var(--muted);font-size:13.5px;min-width:0}
.vrow:hover{background:var(--hover);color:var(--text)}
.vrow .rname{flex:1;min-width:0}
.vrow svg{width:15px;height:15px;color:var(--faint)}
.vrow .av,.tile .av,.cb-avs .av{transition:box-shadow .12s}
.vrow.speaking .av{box-shadow:0 0 0 2px var(--side),0 0 0 4px var(--ok)}
.live{background:var(--dnd);color:#fff;font:700 10px/16px var(--f-body);letter-spacing:.04em;padding:0 5px;border-radius:4px;flex:none}

/* painel de voz conectada */
.voice-panel{flex:none;background:var(--me);border-bottom:1px solid var(--line);padding:8px 8px 10px;display:grid;gap:8px}
.vp-top{display:flex;align-items:center;gap:6px}
.vp-info{flex:1;min-width:0;display:grid;text-align:left;padding:2px 6px;border-radius:6px}
.vp-info:hover{background:var(--hover)}
.vp-info b{font-size:13.5px}
.vp-info b.ok{color:var(--ok)}.vp-info b.wait{color:var(--idle)}
.vp-info small{color:var(--muted);font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.vp-btns{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.vbtn{display:flex;align-items:center;justify-content:center;gap:6px;height:32px;border-radius:6px;background:var(--elev);color:var(--text);font-size:13px;font-weight:500}
.vbtn:hover{background:var(--hover)}
.vbtn.on{background:var(--accent);color:var(--accent-ink)}
.vbtn svg{width:17px;height:17px}
.ibtn.hang,.ibtn.danger{color:var(--dnd)}
.ibtn.danger:hover{background:rgba(229,83,75,.15);color:#ff8a83}
.i.hang{transform:rotate(135deg)}
.me .ibtn.off{color:var(--dnd)}
.me .ibtn.off::after{content:""}

/* área de chamada */
.callArea{flex:none;display:flex;flex-direction:column;min-height:0}
.callArea.full{flex:1}
.callArea.dm.on{height:clamp(240px,46vh,520px);border-bottom:1px solid var(--line)}
.stage{flex:1;display:flex;flex-direction:column;min-height:0;background:#0a0e10;position:relative}
.tiles{flex:1;min-height:0;display:grid;gap:8px;padding:12px;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));grid-auto-rows:auto;align-content:center;overflow-y:auto}
.tiles[data-n="1"]{grid-template-columns:min(720px,100%);justify-content:center}
.tiles.has-focus{display:flex;flex-wrap:wrap;align-content:flex-start;justify-content:center}
.tiles.has-focus .tile{flex:0 0 180px;height:104px;aspect-ratio:auto;width:auto}
.tiles.has-focus .tile.focus{flex:1 1 100%;height:calc(100% - 116px);min-height:200px}
.tile{position:relative;aspect-ratio:16/9;width:100%;max-height:100%;background:var(--elev);border-radius:12px;overflow:hidden;display:grid;place-items:center;cursor:pointer;min-height:110px;outline:2px solid transparent;outline-offset:-2px;transition:outline-color .12s}
.tile.speaking{outline-color:var(--ok)}
.tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;display:none}
.tile.screen video{object-fit:contain}
.tile.has-video video{display:block}
.tile.has-video .tile-av{display:none}
.tile video.mirror{transform:scaleX(-1)}
.tile-av{display:grid;place-items:center}
.tile-wait{display:grid;justify-items:center;gap:6px;color:var(--muted);font-size:13px}
.tile-wait svg{width:40px;height:40px}
.tile-lbl{position:absolute;left:8px;bottom:8px;display:flex;align-items:center;gap:6px;max-width:calc(100% - 56px);background:rgba(0,0,0,.6);color:#fff;border-radius:6px;padding:3px 8px;font-size:13px;font-weight:500}
.tile-lbl span:not(.live){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.tile-lbl svg{width:15px;height:15px;color:#ff8a83;flex:none}
.tile-fs{position:absolute;right:8px;bottom:8px;width:32px;height:32px;border-radius:6px;background:rgba(0,0,0,.6);color:#fff;display:none;place-items:center}
.tile:hover .tile-fs,.tile-fs:focus-visible{display:grid}
.tile-fs svg{width:17px;height:17px}
.tile:fullscreen{border-radius:0;outline:0}
.tile:fullscreen video{object-fit:contain}
.stage-note{position:absolute;top:12px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.6);color:#fff;padding:5px 12px;border-radius:20px;font-size:13px;z-index:1;white-space:nowrap}
.stage-bar{flex:none;display:flex;justify-content:center;gap:10px;padding:10px 12px 14px;flex-wrap:wrap}
.cbig{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:var(--elev);color:var(--text);transition:background .12s}
.cbig:hover{background:var(--hover)}
.cbig.on{background:var(--text);color:#111}
.cbig.off{background:rgba(229,83,75,.18);color:#ff8a83}
.cbig.hang{background:var(--dnd);color:#fff;width:64px;border-radius:25px}
.cbig.hang:hover{filter:brightness(1.1)}
.cbig svg{width:22px;height:22px}
.vlobby{flex:1;display:grid;place-content:center;justify-items:center;text-align:center;gap:10px;padding:24px;background:#0a0e10}
.vlobby h2{font:800 26px var(--f-display);margin:6px 0 0}
.vlobby p{margin:0}
.vlobby .big-ic{width:80px;height:80px;border-radius:50%;background:var(--elev);display:grid;place-items:center}
.vlobby .big-ic svg{width:40px;height:40px}
.vl-avs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.callbanner{display:flex;align-items:center;gap:12px;padding:10px 16px;background:rgba(71,193,135,.1);border-bottom:1px solid var(--line)}
.callbanner>span:nth-child(2){flex:1;min-width:0;display:grid}
.callbanner small{color:var(--muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cb-avs{display:flex}
.cb-avs .av{margin-right:-8px;border:2px solid var(--main);box-sizing:content-box}

/* chamada recebida */
.ring{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:75;width:min(340px,calc(100vw - 24px));background:var(--elev);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.6);padding:20px;display:grid;justify-items:center;gap:8px;text-align:center;animation:pop .15s}
.ring .av{animation:ringpulse 1.4s ease-in-out infinite}
@keyframes ringpulse{0%,100%{box-shadow:0 0 0 0 rgba(71,193,135,.5)}50%{box-shadow:0 0 0 14px rgba(71,193,135,0)}}
.ring b{font:700 19px var(--f-display)}
.ring .acts{margin-top:6px}

/* anexos */
.att{margin-top:6px;max-width:min(420px,100%)}
.att-img{display:block;max-width:min(420px,100%);max-height:340px;border-radius:8px;cursor:zoom-in;background:var(--elev)}
.att video{max-width:100%;max-height:340px;border-radius:8px;background:#000}
.att audio{width:100%}
.att-file{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--side);border:1px solid var(--line);border-radius:10px}
.att-file svg{width:30px;height:30px;color:var(--accent);flex:none}
.att-file span{flex:1;min-width:0;display:grid}
.att-file b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600}
.att-file small{color:var(--muted)}
.att-file a{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;color:var(--muted)}
.att-file a:hover{background:var(--hover);color:var(--text)}
.lightbox{width:auto;max-width:min(96vw,1200px);padding:12px;background:transparent;box-shadow:none}
.lightbox img{max-width:100%;max-height:82vh;border-radius:8px;display:block;margin:auto}
.lightbox a{color:var(--text);font-size:14px;justify-self:start}
.drop-hint{position:absolute;inset:8px;border:2px dashed var(--accent);border-radius:12px;background:rgba(242,165,65,.08);display:grid;place-items:center;color:var(--accent);font:700 20px var(--f-display);z-index:5;pointer-events:none}
.chat{position:relative}
.loadmore{display:block;margin:12px auto;color:var(--muted);font-size:13px}
@media (max-width:820px){.callArea.dm.on{height:clamp(220px,40vh,420px)}.cbig{width:46px;height:46px}.tiles{padding:8px;gap:6px}}

/* ======================= v1.1: temas ======================= */
:root{--chat-fs:15px;--plus1:#a99bff;--plus2:#7ce0c3}
:root[data-theme="meia-noite"]{--rail:#050708;--side:#0a0d0f;--me:#07090b;--main:#0e1214;--elev:#151b1e;--hover:#1a2226;--line:#1c2529}
:root[data-theme="claro"]{--rail:#dfe4e8;--side:#eef1f3;--me:#e5e9ec;--main:#ffffff;--elev:#f4f6f7;--hover:#e3e8eb;--line:#d5dce0;--text:#172024;--muted:#55666e;--faint:#86959c;--accent:#d9861c;--accent-ink:#ffffff;--accent-soft:rgba(217,134,28,.12);color-scheme:light}
:root[data-theme="claro"] .stage,:root[data-theme="claro"] .vlobby{background:#1b2328}
:root[data-theme="claro"] .msg:hover{background:rgba(0,0,0,.035)}
:root[data-theme="claro"] .rail-btn.srv{color:#111}
:root[data-theme="aurora"]{--rail:#110d1e;--side:#171228;--me:#130f22;--main:#1d1830;--elev:#272040;--hover:#2d2549;--line:#352c55;--muted:#a49cc0;--faint:#71699a;--accent:#7ce0c3;--accent-ink:#0b1f19;--accent-soft:rgba(124,224,195,.13)}
:root[data-theme="aurora"] body,:root[data-theme="aurora"] .main{background:linear-gradient(160deg,#1d1830,#13202a)}
:root[data-theme="brasa"]{--rail:#140b09;--side:#1f100e;--me:#180c0b;--main:#2a1714;--elev:#361e1a;--hover:#40241f;--line:#4a2a24;--muted:#c09a90;--faint:#8c6a62;--accent:#ff8c5a;--accent-ink:#2a0e03;--accent-soft:rgba(255,140,90,.14)}
:root[data-theme="brasa"] .main{background:linear-gradient(170deg,#2a1714,#1e1210)}
:root[data-theme="oceano"]{--rail:#060e17;--side:#0a1522;--me:#08111c;--main:#0f1d2e;--elev:#16283d;--hover:#1b3049;--line:#203853;--muted:#8fa8c2;--faint:#5f7a96;--accent:#5cc8ff;--accent-ink:#04182a;--accent-soft:rgba(92,200,255,.13)}
:root[data-theme="oceano"] .main{background:linear-gradient(170deg,#0f1d2e,#0b2230)}
.mtext{font-size:var(--chat-fs)}
.underline-links a{text-decoration:underline}
.reduce-motion *,.reduce-motion *::before,.reduce-motion *::after{animation:none!important;transition:none!important}
/* modo compacto */
.compact .msg{grid-template-columns:minmax(0,1fr);margin-top:2px;padding-top:1px;padding-bottom:1px}
.compact .msg .gut{display:none}
.compact .mhead{display:inline-flex;margin-right:6px;flex-wrap:nowrap}
.compact .mhead time{order:-1;font-size:11px}
.compact .msg .mtext{display:inline}
.compact .msg.cont .mbody::before{content:"";display:inline-block;width:0}

/* ======================= configurações em tela cheia ======================= */
.modal.full{position:fixed;inset:0;width:100%;height:100%;max-height:none;border-radius:0;padding:0;background:var(--main);animation:setin .18s;display:block}
@keyframes setin{from{opacity:0;transform:scale(1.03)}}
.overlay:has(.modal.full){padding:0}
.setf{display:flex;height:100%}
.setf-nav{flex:1 0 220px;background:var(--side);display:flex;justify-content:flex-end;overflow-y:auto}
.setf-nav-in{width:232px;padding:56px 8px 24px 20px;display:flex;flex-direction:column;gap:2px}
.setf-nav .set-k{padding:0 10px 6px;margin-top:4px}
.setf-nav button{text-align:left;padding:7px 10px;border-radius:6px;color:var(--muted);font-weight:500;display:flex;align-items:center;justify-content:space-between;gap:8px}
.setf-nav button:hover{background:var(--hover);color:var(--text)}
.setf-nav button.on{background:var(--elev);color:var(--text)}
.setf-nav button svg{width:16px;height:16px}
.setf-nav .nav-plus{background:linear-gradient(90deg,rgba(169,155,255,.18),rgba(124,224,195,.12));color:var(--text);justify-content:flex-start}
.setf-nav .nav-plus svg{color:var(--plus1)}
.set-sep{height:1px;background:var(--line);margin:8px 10px}
.set-sep.big{margin:28px 0}
.set-ver{color:var(--faint);font-size:12px;padding:8px 10px}
.setf-main{flex:1 1 800px;display:flex;min-width:0;position:relative}
.setf-body{flex:1;max-width:760px;padding:56px 40px 120px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}
.setf-body>*{flex-shrink:0}
.setf-body h2{font:800 22px var(--f-display);margin:0 0 6px}
.setf-body h3{font:700 16px var(--f-display);margin:0}
.setf-body p{margin:0}
.setf-close{flex:none;padding:56px 24px 0 8px;display:grid;justify-items:center;align-content:start;gap:6px;color:var(--muted);font:600 12px var(--f-body)}
.esc-btn{width:36px;height:36px;border-radius:50%;border:2px solid var(--muted);display:grid;place-items:center;color:var(--muted)}
.esc-btn:hover{border-color:var(--text);color:var(--text);background:var(--hover)}
.esc-btn svg{width:18px;height:18px}
.setf-body select.inp{appearance:auto}
.set-row{display:flex;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.set-row-t{flex:1;display:grid;gap:3px}
.set-row-t label{cursor:pointer;display:flex;align-items:center;gap:8px}
.set-row-t small{color:var(--muted);font-size:13.5px}
.switch-t{position:relative;width:44px;height:26px;flex:none;cursor:pointer}
.switch-t input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:1}
.switch-t span{position:absolute;inset:0;border-radius:13px;background:var(--faint);transition:background .15s}
.switch-t span::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .15s}
.switch-t input:checked+span{background:var(--ok)}
.switch-t input:checked+span::after{transform:translateX(18px)}
.switch-t input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.switch-t input:disabled+span{opacity:.5}
.radio-card{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:10px;background:var(--side);border:1px solid var(--line);cursor:pointer}
.radio-card:hover{border-color:var(--muted)}
.radio-card:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.radio-card input{accent-color:var(--accent);margin-top:3px;width:16px;height:16px;flex:none}
.radio-card span{display:grid;gap:2px}.radio-card small{color:var(--muted)}
.choice-btn input[type=radio]{accent-color:var(--accent)}
.choice-btn:has(input:checked){border-color:var(--accent)}
.plus-tag{display:inline-flex;align-items:center;gap:3px;font:700 10px/18px var(--f-body);letter-spacing:.05em;padding:0 6px;border-radius:9px;background:linear-gradient(90deg,var(--plus1),var(--plus2));color:#15122a;vertical-align:middle;white-space:nowrap}
.plus-tag svg{width:11px;height:11px;stroke-width:2.4}
.btn.plus-btn{background:linear-gradient(90deg,var(--plus1),var(--plus2));color:#15122a}
.inline-form{background:var(--side);border-radius:10px;padding:14px;margin:0 16px 12px}
kbd{font:600 12.5px var(--f-mono);background:var(--elev);border:1px solid var(--line);border-bottom-width:3px;border-radius:6px;padding:2px 7px}

/* minha conta */
.acc-card{background:var(--rail);border-radius:12px;overflow:hidden}
.acc-banner{height:100px;background-size:cover!important;background-position:center!important}
.acc-head{display:flex;align-items:flex-end;gap:14px;padding:0 16px;margin-top:-34px;flex-wrap:wrap}
.acc-head .av{border:6px solid var(--rail);box-sizing:content-box}
.acc-name{flex:1;display:flex;align-items:center;gap:8px;padding-bottom:10px;min-width:0}
.acc-name b{font:800 20px var(--f-display)}
.acc-head .btn{margin-bottom:12px}
.acc-rows{margin:14px 16px 16px;background:var(--side);border-radius:10px;padding:4px 16px}
.acc-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.acc-row:last-child{border-bottom:0}
.acc-row span{display:grid}.acc-row small{font:600 11.5px var(--f-body);text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}

/* perfis */
.prof-edit{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;align-items:start}
.prof-prev{position:sticky;top:0;display:grid;gap:8px}
.theme-pick{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.theme-pick label{display:grid;gap:4px;font-size:12.5px;color:var(--muted);text-align:center;cursor:pointer}
.theme-pick input[type=color]{width:64px;height:44px;border:2px solid var(--line);border-radius:10px;background:none;padding:2px;cursor:pointer}
.savebar{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);width:min(700px,calc(100vw - 32px));display:flex;align-items:center;gap:12px;padding:10px 12px 10px 18px;background:var(--rail);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.45);z-index:5;font-weight:500}
.savebar span{flex:1}
.savebar .link{color:var(--text);font-weight:500}
.savebar.shake{animation:shake .4s;background:var(--dnd)}
@keyframes shake{20%,60%{transform:translateX(calc(-50% - 8px))}40%,80%{transform:translateX(calc(-50% + 8px))}}

/* cartão de perfil (popover e prévia) */
.pcard{width:300px;border-radius:12px;overflow:hidden;background:var(--elev);position:relative}
.pcard.themed{background:linear-gradient(180deg,var(--pa),var(--pb));padding:4px}
.pcard.themed .pc-banner{border-radius:9px 9px 0 0}
.pcard.themed .pc-body{background:rgba(10,12,14,.55);border-radius:10px;margin:0 4px 4px;color:#eef2f3}
.pcard.themed .pc-user,.pcard.themed .prof-k{color:rgba(238,242,243,.75)}
.pc-banner{background-size:cover!important;background-position:center!important}
.pc-top{display:flex;align-items:flex-end;justify-content:space-between;padding:0 14px;margin-top:-44px;position:relative}
.pc-av .av{border:6px solid var(--elev);box-sizing:content-box}
.pcard.themed .pc-av .av{border-color:var(--pa)}
.badges{display:flex;gap:4px;background:rgba(0,0,0,.35);border-radius:8px;padding:4px 6px;margin-bottom:6px}
.acc-name .badges{margin:0;background:transparent;padding:0}
.badge-i{display:grid;place-items:center;width:22px;height:22px;border-radius:6px}
.badge-i svg{width:16px;height:16px}
.b-plus{color:var(--plus1)}.b-staff{color:var(--accent)}.b-early{color:var(--idle)}
.pc-body{padding:10px 14px 14px;display:grid;gap:2px}
.pc-name{font:800 20px var(--f-display)}
.pc-user{color:var(--muted);font-size:14px}
.pc-custom{font-size:14px;margin-top:6px}
.pc-sep{height:1px;background:rgba(127,140,148,.3);margin:10px 0}
.pop.pop-prof{background:transparent;border:0;box-shadow:0 14px 44px rgba(0,0,0,.55)}

/* plus */
.plus-hero{border-radius:16px;overflow:hidden;background:radial-gradient(120% 140% at 0% 0%,#5b4bd6 0,#2c2366 45%,#11233a 100%);color:#fff;position:relative}
.plus-hero::after{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 90% 120%,rgba(255,255,255,.07) 0 2px,transparent 2px 28px);pointer-events:none}
.ph-in{position:relative;z-index:1;padding:32px 28px;display:grid;gap:10px;justify-items:start}
.ph-in h2{font:800 34px var(--f-display);margin:0;letter-spacing:-.02em}
.ph-in p{color:rgba(255,255,255,.8);max-width:44ch}
.ph-gem{width:56px;height:56px;border-radius:16px;background:linear-gradient(135deg,var(--plus1),var(--plus2));display:grid;place-items:center;color:#15122a}
.ph-gem svg{width:32px;height:32px}
.ph-status{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.14);padding:6px 12px;border-radius:20px;font-size:14px}
.ph-status svg{width:16px;height:16px;color:var(--plus2)}
.ph-status.off{background:rgba(0,0,0,.25)}
.perks{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.perk{background:var(--side);border:1px solid var(--line);border-radius:12px;padding:14px;display:grid;gap:4px;align-content:start}
.perk span{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(169,155,255,.25),rgba(124,224,195,.2));color:var(--plus1);margin-bottom:4px}
.perk span svg{width:20px;height:20px}
.perk small{color:var(--muted)}
.cmp{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cmp-h,.cmp-r{display:grid;grid-template-columns:1.4fr 1fr 1fr;padding:10px 14px;gap:8px}
.cmp-h{background:var(--side);font-size:13px}
.cmp-r{border-top:1px solid var(--line);font-size:14px}
.cmp-r span:not(:first-child){font-variant-numeric:tabular-nums}
.cmp .pl{color:var(--plus2);font-weight:600}
.howto{background:var(--side);border-radius:12px;padding:14px 16px;display:grid;gap:4px}
.price{font:800 24px var(--f-display);background:linear-gradient(90deg,var(--plus1),var(--plus2));-webkit-background-clip:text;background-clip:text;color:transparent}
.confetti{position:fixed;inset:0;pointer-events:none;z-index:90;overflow:hidden}
.confetti i{position:absolute;top:-20px;left:var(--x);width:var(--w);height:14px;background:var(--c);border-radius:2px;animation:fall var(--d) ease-in forwards}
@keyframes fall{to{transform:translateY(105vh) rotate(var(--r))}}
.gift{margin-top:6px;max-width:430px;border-radius:12px;padding:12px 14px;background:linear-gradient(135deg,rgba(169,155,255,.16),rgba(124,224,195,.1));border:1px solid rgba(169,155,255,.35)}
.gift.used{opacity:.75}
.gift-ic{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,var(--plus1),var(--plus2));display:grid;place-items:center;color:#15122a;flex:none}
.gift-ic svg{width:26px;height:26px}

/* aparência */
.ap-prev{background:var(--main);border:1px solid var(--line);border-radius:12px;padding:6px 0 14px}
.themes{display:flex;flex-wrap:wrap;gap:14px}
.theme-c{display:grid;justify-items:center;gap:6px;font-size:13px;color:var(--muted)}
.theme-c span:last-child{display:flex;align-items:center;gap:4px}
.theme-c span:last-child svg{width:13px;height:13px;color:var(--plus1)}
.tc-sw{width:64px;height:64px;border-radius:50%;border:3px solid var(--line);display:block}
.theme-c.on .tc-sw{border-color:var(--accent);box-shadow:0 0 0 3px var(--main),0 0 0 5px var(--accent)}
.theme-c.on{color:var(--text)}
.theme-c.locked .tc-sw{opacity:.45}
.range-row{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px}
.range-row input{flex:1;accent-color:var(--accent)}
.range-row b{color:var(--text);min-width:40px;text-align:right}

/* atalhos, dispositivos, admin */
.kb{display:grid;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.kb-r{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;border-top:1px solid var(--line)}
.kb-r:first-child{border-top:0}
.dev-list{display:grid;gap:4px}
.dev{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.dev-ic{width:40px;height:40px;border-radius:50%;background:var(--elev);display:grid;place-items:center;flex:none}
.dev-t{flex:1;display:grid;min-width:0}.dev-t small{color:var(--muted)}
.dev .cur{color:var(--ok);font-weight:600}
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.stat{background:var(--side);border:1px solid var(--line);border-radius:12px;padding:14px;display:grid}
.stat b{font:800 26px var(--f-display);font-variant-numeric:tabular-nums}
.stat small{color:var(--muted)}
.cg{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.cg .fld{flex:1;min-width:120px}
.codes{display:grid;gap:4px}
.code-r{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:var(--side);flex-wrap:wrap}
.code-r>span:nth-child(2){flex:1;min-width:160px;display:grid}
.code-r small{color:var(--muted)}
.code-r code{font:600 14px var(--f-mono);letter-spacing:.06em;color:var(--plus2)}
.code-r.used{opacity:.6}.code-r.used code{text-decoration:line-through;color:var(--muted)}
.inp{appearance:none}
select.inp{appearance:auto}

@media (max-width:900px){
  .setf{flex-direction:column}
  .setf-nav{flex:none;max-height:none;justify-content:flex-start;overflow-x:auto}
  .setf-nav-in{width:auto;flex-direction:row;padding:12px 60px 12px 12px;align-items:center}
  .setf-nav .set-k,.setf-nav .set-sep,.set-ver{display:none}
  .setf-nav button{white-space:nowrap}
  .setf-body{padding:20px 16px 120px}
  .setf-close{position:absolute;top:-52px;right:8px;padding:0}
  .setf-close span{display:none}
  .prof-edit{grid-template-columns:1fr}
  .prof-prev{position:static}
}

/* ======================= v1.2: servidor, cargos, expressões ======================= */
.overlay.inner{z-index:56}
.i.rot{transform:rotate(-90deg)}
.sec.cat{padding:16px 6px 2px 4px}
.cat-t{flex:1;display:flex;align-items:center;gap:2px;min-width:0;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;text-align:left}
.cat-t:hover{color:var(--text)}
.cat-t svg{width:12px;height:12px;stroke-width:3;transition:transform .12s}
.cat-t span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.cat-a{display:none;gap:2px}.sec.cat:hover .cat-a,.cat-a:focus-within{display:flex}
.row .lk{display:grid;margin-left:auto}.row .lk svg{width:14px;height:14px}
.side-hdr.has-banner{height:110px;align-items:flex-start;padding-top:8px;background-size:cover;background-position:center;border-bottom:0}
.side-hdr.has-banner .srv-hdr{height:36px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.side-hdr.has-banner .srv-hdr:hover{background:rgba(0,0,0,.25)}
.pm-item.acc{color:var(--accent)}
.crown svg{width:13px;height:13px;color:var(--idle);vertical-align:-1px}
.ttl-sub.topic{max-width:40vw;text-align:left}
.ttl-sub.topic:hover{color:var(--text)}
.slow{font-size:12.5px;color:var(--muted);padding:0 6px;white-space:nowrap}
.pinned{display:inline-grid;color:var(--accent)}.pinned svg{width:14px;height:14px}
.mention-chip:not(button){cursor:default}
.cemoji{width:1.375em;height:1.375em;object-fit:contain;vertical-align:-.3em;display:inline-block}
.cemoji.big{width:48px;height:48px;vertical-align:middle}
.rxb .cemoji{width:18px;height:18px;vertical-align:middle}
.sticker img{width:160px;height:160px;object-fit:contain;margin-top:4px;display:block}
.gifwrap{position:relative;width:fit-content}
.favb{position:absolute;top:6px;right:6px;width:32px;height:32px;border-radius:8px;background:rgba(0,0,0,.6);color:#fff;display:none;place-items:center}
.gifwrap:hover .favb,.favb:focus-visible,.favb.on{display:grid}
.favb.on{color:#ffd166}.favb.on svg{fill:#ffd166}
.favb svg{width:18px;height:18px}
/* seletor */
.pop.pop-expr{padding:0}
.expr{width:min(440px,calc(100vw - 16px));height:min(460px,70vh);display:flex;flex-direction:column}
.expr-tabs{display:flex;gap:4px;padding:8px 8px 0}
.expr-tabs button{padding:6px 12px;border-radius:6px;color:var(--muted);font-weight:600;font-size:14px}
.expr-tabs button:hover{color:var(--text);background:var(--hover)}
.expr-tabs button[aria-selected=true]{background:var(--hover);color:var(--text)}
.expr-body{flex:1;display:flex;flex-direction:column;min-height:0;padding:8px}
.expr-q{height:36px;border-radius:6px;border:1px solid var(--line);background:var(--rail);padding:0 10px;outline:none;margin-bottom:6px}
.expr-q:focus{border-color:var(--accent)}
.expr-scroll{flex:1;overflow-y:auto;min-height:0}
.expr-h{font:600 11.5px var(--f-body);letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:10px 4px 6px;display:flex;align-items:center;gap:6px}
.egrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr))}
.eb{height:40px;font-size:24px;border-radius:6px;display:grid;place-items:center}
.eb:hover{background:var(--hover)}
.eb .cemoji{width:30px;height:30px}
.eb.locked,.sb.locked{opacity:.4;filter:grayscale(.6)}
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:4px}
.sb{aspect-ratio:1;border-radius:8px;padding:6px}.sb:hover{background:var(--hover)}
.sb img{width:100%;height:100%;object-fit:contain}
.ggrid{columns:2;column-gap:6px}
.gb{display:block;width:100%;margin-bottom:6px;border-radius:8px;overflow:hidden;background:var(--hover);break-inside:avoid}
.gb img{width:100%;display:block}
.gb:hover{outline:2px solid var(--accent)}
/* cargos */
.rchips{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.rchip{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 8px;border-radius:6px;background:var(--rail);font-size:12.5px;font-weight:500;color:var(--text)}
.rchip i{width:10px;height:10px;border-radius:50%;background:var(--rc)}
.rchip button{display:grid;color:var(--muted)}.rchip button svg{width:12px;height:12px}
.rchip.add{width:24px;padding:0;justify-content:center;color:var(--muted)}.rchip.add svg{width:14px;height:14px}
.rsel{height:24px;border-radius:6px;background:var(--rail);border:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.roles{display:grid;grid-template-columns:200px minmax(0,1fr);gap:20px;align-items:start}
.role-list{display:grid;gap:2px;position:sticky;top:0}
.role-list .btn{margin-bottom:8px}
.role-it{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;color:var(--muted);text-align:left}
.role-it:hover{background:var(--hover);color:var(--text)}.role-it.on{background:var(--elev);color:var(--text)}
.role-it i{width:12px;height:12px;border-radius:50%;flex:none}
.role-it span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.role-it small{color:var(--faint)}
.role-ed{display:grid;gap:12px}
.role-hd{display:flex;align-items:center;gap:8px}.role-hd h3{flex:1}
.role-mv{display:flex}.role-mv .i{transform:rotate(180deg)}
.role-fs{border:0;padding:0;margin:0;display:grid;gap:12px;min-width:0}
.role-fs:disabled{opacity:.6}
.rcol{width:30px;height:30px;border-radius:8px;background:var(--c);display:grid;place-items:center;color:#fff;border:2px solid transparent;position:relative}
.rcol.on{border-color:var(--text)}.rcol svg{width:14px;height:14px}
.rcol.custom{background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red);overflow:hidden;cursor:pointer}
.rcol.custom input{position:absolute;inset:0;opacity:0;cursor:pointer}
.tri{display:flex;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.tri-b{width:36px;height:30px;font-weight:700;color:var(--muted)}
.tri-b+.tri-b{border-left:1px solid var(--line)}
.tri-b:hover{background:var(--hover)}
.tri-b.deny.on{background:var(--dnd);color:#fff}.tri-b.none.on{background:var(--hover);color:var(--text)}.tri-b.allow.on{background:var(--ok);color:#06190f}
/* servidor */
.srv-prev{border-radius:12px;overflow:hidden;background:var(--side);max-width:420px}
.sp-banner{height:110px;background-size:cover!important}
.sp-row{display:flex;align-items:center;gap:12px;padding:0 14px 14px;margin-top:-30px}
.sp-row .srv-ic{border:5px solid var(--side);box-sizing:content-box}
.sp-row span{display:grid;padding-top:28px}.sp-row small{color:var(--muted)}
.emgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.stgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px}
.ex-it{display:grid;justify-items:center;gap:4px;padding:12px;border-radius:10px;background:var(--side);position:relative;text-align:center}
.ex-it img{width:48px;height:48px;object-fit:contain}.stgrid .ex-it img{width:110px;height:110px}
.ex-it b{font-size:13.5px;word-break:break-all}.ex-it small{color:var(--muted);font-size:12px}
.ex-it .ibtn{position:absolute;top:4px;right:4px}
.mem-r{align-items:flex-start}.mem-r>span:nth-child(2){gap:2px}
.mem-acts{display:flex;gap:6px;flex-wrap:wrap}
.ivopts summary{cursor:pointer;color:var(--muted);font-size:14px;padding:4px 0}
.ivopts .cg{margin-top:10px}
/* fixadas */
.pins{width:min(420px,calc(100vw - 16px));max-height:min(520px,70vh);display:flex;flex-direction:column}
.pins-h{display:flex;align-items:center;gap:8px;padding:12px 14px;font:700 15px var(--f-display);border-bottom:1px solid var(--line)}
.pins-h svg{width:18px;height:18px}
.pins-l{overflow-y:auto;padding:8px;display:grid;gap:6px}
.pin-it{display:flex;gap:10px;padding:10px;border-radius:10px;background:var(--side)}
.pin-it>div{min-width:0;flex:1}
.pin-it .mhead b{font-weight:600}.pin-it .mtext{font-size:14px}
.pin-acts{display:flex;gap:12px;margin-top:4px}
@media (max-width:900px){.roles{grid-template-columns:1fr}.role-list{position:static;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}}

/* ======================= v1.3: menus, threads, impulsos, busca ======================= */
.pop.ctx{padding:6px;min-width:220px;max-width:280px;display:grid;gap:1px}
.pop.ctx .pm-item{padding:7px 10px;font-size:14px;gap:10px}
.pop.ctx .pm-item svg{width:16px;height:16px;flex:none}
.pop.ctx .i.rot{transform:rotate(-90deg)}
.ctx.sub{position:absolute;z-index:61}
.ctx-quick{display:flex;gap:2px;padding:2px 2px 6px;border-bottom:1px solid var(--line);margin-bottom:4px}
.ctx-quick button{flex:1;height:36px;border-radius:8px;font-size:20px;background:var(--side)}
.ctx-quick button:hover{background:var(--hover);transform:scale(1.08)}
.ctx-dot{width:10px;height:10px;border-radius:50%;flex:none}
.ctx-cb{width:18px;height:18px;border-radius:5px;border:2px solid var(--muted);display:grid;place-items:center;flex:none}
.ctx-cb.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.ctx-cb svg{width:12px!important;height:12px!important;margin:0!important;stroke-width:3}
.pm-item:hover .ctx-cb{border-color:var(--accent-ink)}
/* threads */
.row.th{min-height:30px;margin-left:22px}
.row.th .row-main{min-height:30px;padding:4px 8px 4px 4px;gap:6px;font-size:14px}
.th-line{width:12px;height:14px;border:2px solid var(--line);border-top:0;border-right:0;border-radius:0 0 0 6px;margin-top:-10px;flex:none}
.thread-card{display:flex;align-items:center;gap:10px;margin-top:6px;padding:8px 12px;border-radius:10px;background:var(--side);border:1px solid var(--line);max-width:430px;text-align:left;width:100%}
.thread-card:hover{border-color:var(--accent)}
.thread-card>svg:first-child{color:var(--accent)}
.thread-card span{flex:1;min-width:0;display:grid}
.thread-card b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.thread-card small{color:var(--muted)}
.thread-card>svg:last-child{width:16px;height:16px;color:var(--muted)}
.crumb{display:flex;align-items:center;gap:4px;color:var(--muted);font-weight:600;white-space:nowrap}
.crumb:hover{color:var(--text)}
.crumb .hash svg{width:18px;height:18px}
.crumb-sep{color:var(--faint)}
.th-row{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:var(--side);text-align:left;width:100%}
.th-row:hover{background:var(--hover)}
.th-row>svg{color:var(--accent);flex:none}
.th-row span{display:grid;min-width:0}.th-row small{color:var(--muted)}
.th-prev{display:flex;align-items:center;gap:8px;padding:10px;border-radius:8px;background:var(--side);font-size:14px;min-width:0}
.th-prev span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--muted)}
/* novas mensagens */
.newdiv{display:flex;align-items:center;margin:14px 16px 4px;height:0;border-top:1px solid var(--dnd);position:relative}
.newdiv span{position:absolute;right:0;top:-9px;background:var(--dnd);color:#fff;font:700 10px/18px var(--f-body);padding:0 6px;border-radius:4px;letter-spacing:.05em;text-transform:uppercase}
/* markdown extra */
.spoiler{background:var(--faint);color:transparent;border-radius:4px;padding:0 2px;cursor:pointer;transition:background .15s}
.spoiler *{visibility:hidden}
.spoiler:hover{background:var(--muted)}
.spoiler.shown{background:var(--hover);color:inherit;cursor:text}.spoiler.shown *{visibility:visible}
.quote{display:block;border-left:4px solid var(--faint);padding-left:10px;margin:2px 0}
.mh{display:block;font-family:var(--f-display);font-weight:800;line-height:1.25;margin:4px 0}
.mh1{font-size:1.6em}.mh2{font-size:1.3em}.mh3{font-size:1.1em}
.subtext{display:block;font-size:12.5px;color:var(--muted)}
.li{display:block;padding-left:18px;position:relative}.li::before{content:"•";position:absolute;left:6px}
/* busca no topo */
.hsearch{position:relative;width:170px;transition:width .15s}
.hsearch:focus-within{width:240px}
.hsearch input{width:100%;height:28px;border-radius:6px;border:0;background:var(--rail);padding:0 28px 0 8px;font-size:13.5px;outline:none}
.hsearch input:focus{box-shadow:0 0 0 2px var(--accent)}
.hsearch svg{position:absolute;right:6px;top:6px;width:16px;height:16px;color:var(--muted);pointer-events:none}
.search-res{width:min(460px,calc(100vw - 16px))}
.pin-it.sr{text-align:left;width:100%}.pin-it.sr:hover{background:var(--hover)}
.pin-it .mhead small{color:var(--accent);font-size:12px}
/* impulsos */
.lvl{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,#ff73fa,#a99bff);color:#2a0b2f;flex:none}
.lvl svg{width:14px;height:14px}
.srv-hdr .lvl+span{flex:1}
.booster svg,.pm-item.boostc svg{color:#ff73fa}
.booster svg{width:13px;height:13px;vertical-align:-1px}
.ricon{display:inline-block;width:18px;height:18px;margin-left:4px;vertical-align:-3px;font-size:15px;line-height:18px;object-fit:contain}
.ricon-pick{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ricon-cur{width:36px;height:36px;border-radius:8px;background:var(--side);display:grid;place-items:center;font-size:20px}
.ricon-cur img{width:24px;height:24px;object-fit:contain}
.boost-hero{margin:-24px -24px 0;padding:28px 24px 20px;background:radial-gradient(120% 140% at 100% 0,#ff73fa 0,#7a3cff 45%,#24145a 100%);color:#fff;border-radius:12px 12px 0 0;display:grid;justify-items:center;text-align:center;gap:6px}
.boost-hero h2{color:#fff}.boost-hero p{color:rgba(255,255,255,.85)}
.bh-ic{width:56px;height:56px;border-radius:16px;background:rgba(255,255,255,.18);display:grid;place-items:center}
.bh-ic svg{width:30px;height:30px}
.bh-bar{width:100%;height:10px;border-radius:5px;background:rgba(0,0,0,.3);overflow:hidden;margin-top:6px}
.bh-bar i{display:block;height:100%;background:linear-gradient(90deg,#ffd1ff,#fff);border-radius:5px}
.boost-hero small{color:rgba(255,255,255,.8)}
.lvls{display:grid;gap:8px}
.lvl-c{border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:var(--side)}
.lvl-c.on{border-color:#ff73fa;background:rgba(255,115,250,.07)}
.lvl-c b{display:flex;align-items:center;gap:8px}.lvl-c b small{margin-left:auto;color:var(--muted);font-weight:500}
.lvl-c b svg{width:16px;height:16px;color:#ff73fa}
.lvl-c ul{margin:6px 0 0;padding-left:22px;color:var(--muted);font-size:14px}
.boosters{display:flex;flex-wrap:wrap;gap:6px}
@media (max-width:820px){.hsearch{display:none}}

/* ======================= v1.4: atividade, enquetes, fóruns, eventos, webhooks ======================= */
.dot.streaming{background:#9b59ff}
.act-card{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:rgba(0,0,0,.18);margin:4px 0 8px}
.act-card.live{background:linear-gradient(135deg,rgba(155,89,255,.28),rgba(155,89,255,.08))}
.act-ic{width:40px;height:40px;border-radius:10px;background:var(--hover);display:grid;place-items:center;flex:none}
.act-card.live .act-ic{background:#9b59ff;color:#fff}
.act-t{display:grid;min-width:0}.act-t small{color:var(--muted);font-size:12.5px}
.btn.live-btn{background:#9b59ff;color:#fff;margin-bottom:8px;width:100%}
.act-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:6px}
.act-types .radio-card{padding:8px 10px}
/* enquetes */
.poll{margin-top:6px;max-width:460px;border:1px solid var(--line);border-radius:12px;padding:14px;background:var(--side)}
.poll-q{font:700 16px var(--f-display);margin-bottom:2px}
.poll-sub{font-size:12.5px;color:var(--muted);margin-bottom:10px}
.poll-opts{display:grid;gap:6px}
.poll-o{position:relative;display:flex;align-items:center;gap:8px;min-height:42px;padding:8px 12px;border-radius:8px;border:1px solid var(--line);background:var(--elev);text-align:left;overflow:hidden}
.poll-o:hover:not(:disabled){border-color:var(--muted)}
.poll-o i{position:absolute;inset:0 auto 0 0;background:var(--accent-soft);transition:width .3s}
.poll-o.sel{border-color:var(--accent)}.poll-o.sel i{background:rgba(242,165,65,.28)}
.poll-o.win{border-color:var(--ok)}.poll-o.win i{background:rgba(71,193,135,.25)}
.poll-o>span{position:relative}
.po-e{font-size:18px}.po-t{flex:1;font-weight:500}.po-n{font-weight:700;font-variant-numeric:tabular-nums}.po-n small{color:var(--muted);font-weight:400}
.po-ck{width:20px;height:20px;border-radius:50%;border:2px solid var(--muted);display:grid;place-items:center;flex:none}
.poll-o.sel .po-ck{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.po-ck svg{width:12px;height:12px;stroke-width:3}
.poll-o:disabled{cursor:default;opacity:1}
.poll-f{display:flex;gap:14px;align-items:center;margin-top:10px;font-size:13px;color:var(--muted);flex-wrap:wrap}
.popts{display:grid;gap:6px}
.popt{display:flex;gap:6px;align-items:center}
.popt .pe{width:56px!important;text-align:center}
.popt .pt{flex:1}
/* fórum */
.forum{flex:1;overflow-y:auto;padding:16px 20px 24px;display:flex;flex-direction:column;gap:12px}
.fo-top{display:flex;gap:10px;align-items:center}
.fo-sort{width:auto;height:38px;margin-left:auto}
.fo-guide{background:var(--side);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px}
.fo-guide b{display:flex;align-items:center;gap:6px;margin-bottom:4px}.fo-guide svg{width:16px;height:16px;color:var(--accent)}
.fo-tags{display:flex;flex-wrap:wrap;gap:6px}
.ftag{height:28px;padding:0 10px;border-radius:14px;background:var(--side);border:1px solid var(--line);font-size:13px;display:inline-flex;align-items:center;gap:4px;cursor:pointer}
.ftag:hover{border-color:var(--muted)}.ftag.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.fo-list{display:grid;gap:8px}
.fo-card{display:flex;gap:14px;padding:14px 16px;border-radius:12px;background:var(--side);border:1px solid var(--line);text-align:left;width:100%}
.fo-card:hover{border-color:var(--muted);background:var(--hover)}
.fo-card.unread .fo-title{color:var(--text)}
.fo-main{flex:1;min-width:0;display:grid;gap:4px}
.fo-title{font:700 16px var(--f-display);display:flex;align-items:center;gap:6px;color:var(--muted)}
.fo-card:not(.unread) .fo-title{color:var(--text)}
.fo-title svg{width:15px;height:15px}
.fo-prev{margin:0;color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fo-prev b{color:var(--text);font-weight:600}
.fo-meta{display:flex;align-items:center;gap:6px;color:var(--faint);font-size:12.5px}.fo-meta svg{width:14px;height:14px}
.fo-img{width:96px;height:96px;object-fit:cover;border-radius:8px;flex:none}
.fo-ctags{display:flex;flex-wrap:wrap;gap:4px}.fo-ctags span{font-size:12px;padding:1px 8px;border-radius:10px;background:var(--hover);color:var(--muted)}
/* eventos */
.ev-row .row-main{color:var(--muted)}
.ev-live{display:flex;align-items:center;gap:10px;margin:8px 8px 0;width:calc(100% - 16px);padding:8px 10px;border-radius:8px;background:rgba(71,193,135,.12);text-align:left}
.ev-live span:last-child{display:grid;min-width:0}.ev-live small{color:var(--ok);font-weight:600;font-size:11.5px}.ev-live b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.dotlive{width:10px;height:10px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(71,193,135,.6);animation:ringpulse 1.6s infinite;flex:none;display:inline-block}
.ev-hd{display:flex;align-items:center;justify-content:space-between;gap:10px}.ev-hd h2{display:flex;align-items:center;gap:8px}
.ev-list{display:grid;gap:10px;max-height:60vh;overflow-y:auto;margin:0 -6px;padding:0 6px}
.ev-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--side)}
.ev-card.active{border-color:var(--ok)}.ev-card.ended{opacity:.6}
.ev-cover{height:120px;background-size:cover;background-position:center}
.ev-body{padding:12px 14px;display:grid;gap:6px}
.ev-body h3{font:700 17px var(--f-display);margin:0}
.ev-when{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--accent)}.ev-when svg{width:15px;height:15px}
.ev-when.live{color:var(--ok)}
.ev-meta{display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--muted)}.ev-meta span{display:flex;align-items:center;gap:5px}.ev-meta svg{width:15px;height:15px}
.ev-acts{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:4px}
/* embeds de webhook */
.embed{display:flex;gap:12px;margin-top:6px;max-width:520px;background:var(--side);border-left:4px solid var(--ec);border-radius:6px;padding:10px 14px 12px}
.em-in{flex:1;min-width:0;display:grid;gap:6px}
.em-author{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.em-author img{width:22px;height:22px;border-radius:50%}
.em-title{font-weight:700}.em-title a{color:#7cc4ff}
.em-desc{font-size:14px}
.em-fields{display:flex;flex-wrap:wrap;gap:8px 16px}
.em-f{flex:1 1 100%;min-width:0;font-size:14px}.em-f.inl{flex:1 1 30%}
.em-f b{display:block;font-size:13px}
.em-img{max-width:100%;border-radius:6px;cursor:zoom-in}
.em-thumb{width:80px;height:80px;object-fit:cover;border-radius:6px;flex:none}
.em-foot{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted)}.em-foot img{width:18px;height:18px;border-radius:50%}
.wh-ex{background:var(--rail);border:1px solid var(--line);border-radius:8px;padding:12px;font:12.5px var(--f-mono);overflow-x:auto;white-space:pre;margin:8px 0 0}
