/* Klan (clan.js) a world boss (worldboss.js) */
.netAv{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex:none;border-radius:50%;font:700 12px var(--font-mono);color:#fff;background:linear-gradient(135deg,hsl(var(--h,200) 70% 45%),hsl(calc(var(--h,200) + 40) 70% 28%));border:2px solid rgba(255,255,255,.35);text-shadow:0 1px 2px #000}
.netAv.you{--h:190;border-color:var(--cyan);box-shadow:0 0 10px rgba(var(--c1),.6)}
.clBody{margin-top:8px}
.clIntro h3{margin:0 0 4px}.clIntro p{margin:0 0 10px;color:var(--muted);font-size:13px}
.clCols{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:12px;margin-top:10px}
.clBox{padding:12px;border-radius:var(--radius-md);border:1px solid var(--line-hi);background:rgba(var(--ink),.55)}
.clBox h4{margin:0 0 8px}.clBox h4 small{color:var(--muted);font-weight:500}.clBox h5{margin:12px 0 6px}
.clBox label{display:flex;flex-direction:column;gap:3px;margin-bottom:8px;font-size:12px;color:var(--muted)}
.clBox input[type=text]{background:rgba(var(--ink),.8);color:var(--text);border:1px solid var(--line-hi);border-radius:8px;padding:7px 9px}
.clPick{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-bottom:8px}.clPick>b{width:54px;font-size:12px;color:var(--muted)}
.clPick button{width:34px;height:34px;padding:0;font-size:18px;border-radius:8px}.clPick button.on{border-color:var(--cyan);box-shadow:0 0 10px rgba(var(--c1),.5)}
.clCol{background:var(--cc);border:2px solid transparent!important}.clCol.on{border-color:#fff!important}
.clPrev{display:flex;align-items:center;gap:10px;margin:6px 0 10px}
.clList{display:flex;flex-direction:column;gap:6px}
.clNpc{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--radius-sm);background:rgba(var(--ink),.6);border:1px solid var(--line)}.clNpc>div{flex:1;min-width:0}.clNpc small{display:block;color:var(--muted)}
.clHead{display:flex;gap:14px;align-items:center;padding:14px;border-radius:var(--radius-md);border:var(--bw) solid color-mix(in srgb,var(--cc) 60%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--cc) 20%,transparent),rgba(var(--ink),.75))}
.clEmblem{flex:none;filter:drop-shadow(0 0 10px rgba(255,255,255,.2))}
.clHeadInfo{flex:1;min-width:0}.clHeadInfo h3{margin:0 0 6px}.clHeadInfo h3 small{color:var(--muted);font-weight:500}.clHeadInfo .bar{margin-top:8px}
.clMembers{display:flex;flex-direction:column;gap:6px}
.clMember{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:var(--radius-sm);background:rgba(var(--ink),.6);border:1px solid var(--line)}
.clMember.you{border-color:var(--cyan)}.clMember.free{opacity:.55;border-style:dashed}.clMember>div{flex:1;min-width:0}.clMember small{display:block;color:var(--muted);font-size:11.5px}
.clMember button{padding:3px 10px;font-size:12px}
.clPerks{display:flex;flex-direction:column;gap:5px}
.clPerk{display:flex;gap:8px;align-items:center;padding:5px 8px;border-radius:8px;background:rgba(var(--ink),.55);font-size:12.5px}.clPerk>span{font-size:16px;min-width:34px}.clPerk>div{flex:1}.clPerk b{color:var(--gold)}
.clDonate{display:flex;flex-wrap:wrap;gap:6px}.clDonate button{padding:5px 10px;font-size:12px}
.clChat{display:flex;flex-direction:column;gap:5px;max-height:240px;overflow:auto}
.clMsg{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:baseline;padding:5px 8px;border-radius:8px;background:rgba(var(--ink),.55);font-size:12.5px}.clMsg.you{background:rgba(var(--c1),.1)}.clMsg b{color:var(--c1l)}.clMsg small{color:var(--dim)}
.clSay{display:flex;gap:6px;margin-top:8px}.clSay input{flex:1;background:rgba(var(--ink),.8);color:var(--text);border:1px solid var(--line-hi);border-radius:8px;padding:7px 9px}
.clLog{display:flex;flex-direction:column;gap:3px;font-size:12.5px;margin-bottom:10px;max-height:200px;overflow:auto}.clLog small{color:var(--dim)}
.clRank{display:flex;flex-direction:column;gap:6px}.clRankRow{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:var(--radius-sm);background:rgba(var(--ink),.55);border:1px solid var(--line)}.clRankRow.you{border-color:var(--cyan);background:rgba(var(--c1),.08)}.clRankRow>div{flex:1}.clRankRow small{color:var(--muted)}
.hbBadge.inl{position:static;display:inline-flex;margin-left:4px}
/* world boss */
.wbHero{display:grid;grid-template-columns:minmax(220px,320px) 1fr;gap:14px;align-items:center;padding:14px;border-radius:var(--radius-md);border:var(--bw) solid hsl(var(--bh) 60% 50% / .6);background:radial-gradient(ellipse at 20% 40%,hsl(var(--bh) 60% 35% / .45),rgba(var(--ink),.85))}
.wbBossArt{max-width:340px}.wbBossSvg{width:100%;height:auto;filter:drop-shadow(0 0 18px hsl(var(--bh,200) 80% 55% / .6))}
.wbBreathe{animation:wbBreathe 3.2s ease-in-out infinite;transform-origin:150px 190px;transform-box:fill-box}@keyframes wbBreathe{50%{transform:scale(1.035)}}
.wbBolt{animation:wbBolt 1.4s steps(2,end) infinite}.wbBolt.b2{animation-delay:-.4s}.wbBolt.b3{animation-delay:-.9s}@keyframes wbBolt{50%{opacity:.2}}
.wbFlame{animation:wbFlame .8s ease-in-out infinite alternate;transform-origin:150px 150px;transform-box:fill-box}@keyframes wbFlame{to{transform:scale(1.2,.85)}}
.wbWisp{animation:wbWisp 3s ease-in-out infinite}@keyframes wbWisp{50%{transform:translateY(-10px);opacity:.5}}
.wbBossSvg.hit{animation:wbHit .5s ease 3}@keyframes wbHit{25%{transform:translateX(-8px) rotate(-2deg)}75%{transform:translateX(8px) rotate(2deg)}}
.wbHeroInfo h3{margin:2px 0 4px;font-size:22px}.wbHeroInfo p{margin:0 0 8px;color:var(--muted);font-size:12.5px}.wbKicker{color:var(--gold)}
.wbHp{position:relative;height:22px;border-radius:99px;background:rgba(0,0,0,.55);border:2px solid #06080f;overflow:hidden;margin:6px 0 8px}
.wbHp i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#ff3b5c,#ff8a3d);transition:width .8s}.wbHp.dead i{background:#555}
.wbHp span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:700 12px var(--font-mono);text-shadow:0 1px 2px #000}
.wbAttack{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:12px}
.wbElx{display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:var(--radius-md);border:1px solid rgba(var(--c4),.45);background:rgba(var(--c4),.06)}
.wbElx select{background:rgba(var(--ink),.8);color:var(--text);border:1px solid var(--line-hi);border-radius:8px;padding:6px 8px;max-width:100%}.wbElx small{color:var(--muted)}
.wbGo{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:var(--radius-md);border:1px solid var(--line-hi);background:rgba(var(--ink),.55)}.wbGo small{color:var(--muted)}
.wbEff{font-size:13px}.wbBtn{padding:12px;font-size:15px}
.wbPends{margin-top:12px}.wbPend{display:flex;gap:10px;align-items:center;padding:8px 10px;margin-bottom:6px;border-radius:var(--radius-sm);border:1px solid var(--gold);background:rgba(var(--c3),.08)}.wbPend>div{flex:1}.wbPend small{display:block;color:var(--muted)}.wbPendE{font-size:28px}
.wbBoard{margin-top:12px}.wbRows{display:flex;flex-direction:column;gap:4px}
.wbRow{display:flex;align-items:center;gap:10px;padding:5px 10px;border-radius:var(--radius-sm);background:rgba(var(--ink),.55);border:1px solid var(--line)}.wbRow.you{border-color:var(--cyan);background:rgba(var(--c1),.1)}.wbRow b{flex:1}
.wbRank{min-width:30px;color:var(--gold);font-weight:700}.wbDmg{font-family:var(--font-mono);color:var(--c1l)}.wbSep{text-align:center;color:var(--dim)}
.wbDialog{border:var(--bw) solid var(--gold);border-radius:var(--radius);background:linear-gradient(180deg,var(--panel-solid),#05080f);color:var(--text);padding:0;max-width:min(94vw,520px);box-shadow:0 0 40px rgba(var(--c3),.4)}.wbDialog::backdrop{background:rgba(0,0,0,.75)}
.wbAtk{padding:16px;text-align:center}.wbAtkBoss{max-width:240px;margin:0 auto}.wbTotal{font:700 42px var(--font-mono);color:var(--gold);text-shadow:0 0 16px rgba(var(--c3),.7)}
.wbHits{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;margin:10px 0 14px;max-height:120px;overflow:auto}
.wbHits i{font-style:normal;padding:2px 7px;border-radius:99px;font-size:11px;background:rgba(var(--ink),.8);border:1px solid var(--line-hi);animation:expPop .3s ease both;animation-delay:var(--d)}.wbHits i.crit{border-color:var(--gold);color:var(--gold)}
.wbRwTitle{font:700 18px var(--font-hd);color:var(--gold);letter-spacing:.1em}
@media(max-width:720px){.wbHero{grid-template-columns:1fr}.clHead{flex-direction:column;text-align:center}}