/* ---------- rich profiles ---------- */
.ri .icon.home .ico{width:28px;height:28px}
.pcard{--p1:#7b47f0;--p2:#2a1660}
.pcard.themed{background:linear-gradient(180deg,var(--p1) 0%,var(--p2) 100%);border:2px solid color-mix(in srgb,var(--p1) 70%,#fff);color:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.25),0 18px 50px -12px color-mix(in srgb,var(--p1) 45%,transparent)}
.dm-profile .pcard.themed{border-radius:0;border-width:0 0 0 2px}
.pcard.themed .pav{border-color:color-mix(in srgb,var(--p1) 80%,#000)}
.pcard.themed .pav .av .st{border-color:color-mix(in srgb,var(--p1) 80%,#000)}
.pcard.themed .phead,.pcard.themed .pinner,.pcard.themed .pmenu{background:rgba(10,6,24,.42);border:1px solid rgba(255,255,255,.08);color:#fff}
.pcard.themed .u,.pcard.themed h6,.pcard.themed .about,.pcard.themed .since{color:rgba(255,255,255,.82)}
.pcard.themed .pinner h6{border-top-color:rgba(255,255,255,.12)}
.pcard.themed .chip{background:rgba(0,0,0,.3);border-color:rgba(255,255,255,.12);color:#fff}
.pcard .phead{background:var(--bg-2);border-radius:8px;padding:10px 12px;margin-bottom:8px}
[data-theme="light"] .pcard:not(.themed) .phead{background:var(--bg-3)}
.pcard .pinner h6.first{margin-top:0;padding-top:0;border-top:0}
.pbubble{position:absolute;left:104px;top:80px;max-width:calc(100% - 118px);background:var(--bg-2);color:var(--text);border:1px solid var(--line-2);border-radius:14px;padding:6px 11px;font-size:.82rem;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 4px 14px -6px rgba(0,0,0,.5);z-index:2}
.pbubble.add{display:flex;align-items:center;gap:5px;color:var(--muted);cursor:pointer}
.pbubble.add:hover{color:var(--text)}
.pbubble.add .ico{width:14px;height:14px}
.pcard.themed .pbubble{background:rgba(14,9,30,.85);border-color:rgba(255,255,255,.15);color:#fff}
.pcard .pacts{position:absolute;right:12px;top:108px}
.pcard:has(.pbubble) .pacts{top:124px}
.badges{display:inline-flex;flex-wrap:wrap;gap:3px;margin-top:8px;background:rgba(0,0,0,.18);border-radius:7px;padding:3px}
[data-theme="light"] .pcard:not(.themed) .badges{background:var(--bg-4)}
.badge{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;color:var(--b);background:color-mix(in srgb,var(--b) 18%,transparent);font-size:13px;cursor:default}
.badge .ico{width:14px;height:14px}
.badge.lg{width:36px;height:36px;border-radius:10px;font-size:20px}.badge.lg .ico{width:20px;height:20px}
.pmenu{background:var(--bg-2);border-radius:8px;padding:4px;margin-top:8px}
[data-theme="light"] .pcard:not(.themed) .pmenu{background:var(--bg-3)}
.pmenu>button,.subl>button,.pmenu .acct-sw{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:5px;text-align:left;font-size:.9rem;font-weight:500;color:inherit}
.pmenu>button:hover,.subl>button:hover,.pmenu .acct-sw:hover{background:rgba(127,127,127,.14)}
.pmenu>button>span:not(.dotc){flex:1}
.pmenu .dotc,.subl .dotc{flex:none;width:12px;height:12px}
.subl>button>span:not(.dotc){flex:1}
.pmenu .ico{width:18px;height:18px;opacity:.85}
.pmenu .chev{font-style:normal;display:grid;opacity:.7}
.pmenu .chev .ico{width:16px;height:16px;transition:transform .15s}
.pmenu>button.open .chev .ico{transform:rotate(180deg)}
.pmenu .chev.cnt{font-size:.75rem;font-weight:700;background:rgba(127,127,127,.2);border-radius:8px;padding:0 6px;opacity:1}
.subl{margin:2px 0 4px 18px;border-left:2px solid rgba(127,127,127,.25);padding-left:6px}
.subl>button small{display:block;font-size:.75rem;opacity:.7;font-weight:400}
.subl>button.on{background:rgba(127,127,127,.14)}
.acct{display:flex;align-items:center;gap:6px;padding:2px 0}
.acct.cur{padding:6px 10px;gap:10px;font-size:.9rem}
.acct span{flex:1;min-width:0}.acct b{display:block;font-weight:600}.acct small{display:block;font-size:.75rem;opacity:.7}
.acct>.ico{width:16px;height:16px;color:var(--green)}
.me-pop .pcard{width:330px}
/* avatar decorations */
.av.deco::before,.av.deco::after{content:"";position:absolute;pointer-events:none;z-index:1}
.av .st{z-index:2}
.deco-ring::before{inset:-12%;border-radius:50%;background:conic-gradient(from 0deg,#9b6bff,#ff7ac6,#ffd36b,#6be3ff,#9b6bff);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 3px));animation:lb-spin 5s linear infinite}
.deco-glow::before{inset:-6%;border-radius:50%;box-shadow:0 0 0 2px color-mix(in srgb,var(--d1,#9b6bff) 70%,#fff),0 0 16px 4px var(--d1,#9b6bff);animation:lb-pulse 2.4s ease-in-out infinite}
.deco-sparkle::before{content:"\2726";color:#ffe27a;font-size:14px;line-height:1;right:-12%;top:-14%;text-shadow:0 0 6px #ffd36b;animation:lb-twinkle 1.8s ease-in-out infinite}
.deco-sparkle::after{content:"\2727";color:#fff;font-size:11px;line-height:1;left:-10%;bottom:-6%;text-shadow:0 0 6px #b48bff;animation:lb-twinkle 1.8s ease-in-out .9s infinite}
.deco-halo::before{left:14%;right:14%;top:-20%;height:22%;border-radius:50%;border:3px solid #ffd36b;box-shadow:0 0 10px #ffd36b,inset 0 0 6px #ffd36b;animation:lb-bob 3s ease-in-out infinite}
.deco-flame::before{inset:-12%;border-radius:50%;background:conic-gradient(from 200deg,#ff3d2e,#ff8a1f,#ffe36b,#ff8a1f,#ff3d2e);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 4px));filter:drop-shadow(0 0 5px #ff7a1f);animation:lb-flick 1.2s ease-in-out infinite alternate}
.deco-orbit::before{inset:-16%;border-radius:50%;border:2px dashed #6be3ff;animation:lb-spin 9s linear infinite}
.deco-pixel::before{inset:-10%;border-radius:24%;border:3px solid var(--d1,#3fb68b);box-shadow:3px 3px 0 0 color-mix(in srgb,var(--d1,#3fb68b) 50%,#000)}
@keyframes lb-spin{to{transform:rotate(360deg)}}
@keyframes lb-pulse{50%{opacity:.55}}
@keyframes lb-twinkle{50%{opacity:.25;transform:scale(.7)}}
@keyframes lb-bob{50%{transform:translateY(-3px)}}
@keyframes lb-flick{to{filter:drop-shadow(0 0 9px #ffb02e);opacity:.85}}
/* name effects */
.nfx-gradient{background:linear-gradient(90deg,var(--n1),var(--n2));-webkit-background-clip:text;background-clip:text;color:transparent}
.nfx-rainbow{background:linear-gradient(90deg,#ff6b6b,#ffd36b,#6bff95,#6be3ff,#b46bff,#ff6b6b);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:lb-slide 4s linear infinite}
.nfx-glow{color:color-mix(in srgb,var(--n1) 60%,#fff);text-shadow:0 0 10px var(--n1)}
.nfx-neon{color:#fff;text-shadow:0 0 3px #fff,0 0 9px var(--n1),0 0 18px var(--n1)}
@keyframes lb-slide{to{background-position:200% 0}}
[data-theme="light"] .nfx-neon{color:var(--n1);text-shadow:0 0 6px color-mix(in srgb,var(--n1) 50%,transparent)}
/* suggestions */
.sugg{margin-bottom:14px}
.sugg-h{display:flex;align-items:center;justify-content:space-between}
.sugg-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.scard{background:var(--bg-1);border:1px solid var(--line);border-radius:10px;padding:14px 10px 10px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;cursor:pointer}
.scard:hover{border-color:var(--line-2)}
.scard b{margin-top:6px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.scard small{color:var(--muted);font-size:.78rem;min-height:2.2em}
.scard .row-actions{margin-top:4px}
.active-now .an .icon-btn{flex:none}
/* profile editor pickers */
.pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:8px}
.pick-grid.names{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
.pick{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px 8px;border:2px solid var(--line);border-radius:10px;background:var(--bg-1)}
.pick:hover{border-color:var(--line-2)}
.pick.on{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 10%,var(--bg-1))}
.pick small{font-size:.75rem;color:var(--muted)}
.pick b{font-size:1rem}
.colorpick{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--text-2);cursor:pointer}
.colorpick input{width:34px;height:34px;border:0;border-radius:8px;padding:0;background:none;cursor:pointer}
.preset{width:28px;height:28px;border-radius:50%;border:2px solid var(--line-2)}
.prev-col{position:sticky;top:0}
/* channels */
.ch.muted{opacity:.5}
.ch.muted:hover,.ch.muted.on{opacity:1}
.ch .mut{display:grid;color:var(--muted)}.ch .mut .ico{width:14px;height:14px}
.ch.ann>.ico{color:var(--amber);opacity:.95}
.staff-badge{color:var(--accent)}
/* channel permission tri-state */
.tri{display:inline-flex;border:1px solid var(--line-2);border-radius:7px;overflow:hidden;flex:none}
.tri button{width:34px;height:30px;font-weight:700;color:var(--muted);border-right:1px solid var(--line)}
.tri button:last-child{border-right:0}
.tri button:hover{background:var(--hover);color:var(--text)}
.tri .d.on{background:var(--red);color:#fff}.tri .i.on{background:var(--bg-4);color:var(--text)}.tri .a.on{background:var(--green);color:#fff}
.role-list i{width:12px;height:12px;border-radius:50%;flex:none}
/* message hover toolbar */
.acts{padding:2px;gap:1px;border-radius:8px}
.acts button{border-radius:6px}
.acts button.qr{font-size:1.1rem;transition:transform .1s}
.acts button.qr:hover{transform:scale(1.18);background:var(--hover)}
.acts-sep{width:1px;align-self:stretch;margin:5px 3px;background:var(--line-2)}
/* polls */
.poll{background:var(--bg-1);border:1px solid var(--line);border-radius:10px;padding:14px;margin-top:6px;max-width:480px}
.poll .pq{font-weight:700;font-size:1.02rem}
.poll .ph{font-size:.78rem;color:var(--muted);margin:2px 0 10px}
.po{position:relative;display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--line-2);border-radius:8px;margin-bottom:6px;overflow:hidden;background:var(--bg-2)}
.po:hover:not(:disabled){border-color:var(--accent)}
.po i{position:absolute;inset:0 auto 0 0;background:color-mix(in srgb,var(--accent) 20%,transparent);transition:width .3s}
.po span{position:relative}
.po .pt{flex:1;font-weight:500}
.po .pp{font-size:.8rem;color:var(--text-2);font-variant-numeric:tabular-nums}
.po .pc{width:20px;height:20px;border-radius:50%;border:2px solid var(--line-2);display:grid;place-items:center;flex:none}
.po.on{border-color:var(--accent)}.po.on .pc{background:var(--accent);border-color:var(--accent);color:#fff}
.po .pc .ico{width:12px;height:12px}
.po.win{border-color:var(--green)}.po.win i{background:color-mix(in srgb,var(--green) 22%,transparent)}
.po:disabled{cursor:default}
.poll .pf{display:flex;gap:12px;align-items:center;font-size:.8rem;color:var(--muted);margin-top:4px}
.poll .pf span{flex:1}
/* invite card */
.invite-card{background:var(--bg-1);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-top:6px;max-width:430px}
.invite-card .ic-h{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:10px}
.invite-card .ic-b{display:flex;align-items:center;gap:12px}
.invite-card .ic-i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:#fff;font-weight:700;overflow:hidden;flex:none}
.invite-card .ic-i img{width:100%;height:100%;object-fit:cover}
.invite-card b{display:block}
.invite-card small{color:var(--muted);font-size:.8rem;display:flex;align-items:center;gap:5px}
.invite-card .dot{width:8px;height:8px;border-radius:50%;background:var(--faint);display:inline-block}.invite-card .dot.on{background:var(--green)}
/* misc */
.jump-present{position:absolute;left:50%;transform:translateX(-50%);bottom:86px;z-index:6;background:var(--accent);color:#fff;border-radius:999px;padding:7px 14px;font-size:.83rem;display:flex;gap:10px;align-items:center;box-shadow:var(--shadow);animation:pop .15s}
.jump-present b{display:flex;align-items:center;gap:4px}.jump-present .ico{width:14px;height:14px}
.mention.role{background:color-mix(in srgb,var(--rc,var(--accent)) 22%,transparent);color:color-mix(in srgb,var(--rc,var(--accent)) 70%,var(--text))}
.content .li{display:inline-block;min-width:18px;color:var(--muted)}
.kb{font:600 .78rem Inter,sans-serif;background:var(--bg-4);border:1px solid var(--line-2);border-bottom-width:2px;border-radius:5px;padding:1px 7px}
/* layout fix: keep columns at window height so the message list scrolls instead of the page */
.app{grid-template-rows:minmax(0,1fr)}
.main,.side,.rail,.chat,.body,.homeview,.discover,.vroom{min-height:0}
.main{overflow:hidden}
