.tb{--tS:var(--warn);--tA:var(--water);--tB:var(--gold);--tC:#c9868a;--rdamage:#d8d0da;--rtank:var(--water);--rhealer:#7fcf94;--rsupport:var(--warn)}.tb-hint{color:var(--mut);margin:0 0 18px;font-size:13px}.tb-bar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 22px;margin-bottom:18px;padding:12px 0;display:flex}.tb-seg{border:1px solid var(--line2);border-radius:999px;flex-wrap:wrap;display:flex;overflow:hidden}.tb-seg button{color:var(--mut);font:600 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;padding:10px 16px}.tb-seg button[aria-pressed=true]{background:var(--gold);color:#16121a}.tb-seg button:focus-visible{outline:2px solid var(--water);outline-offset:-2px}.tb-lg{color:var(--mut);flex-wrap:wrap;gap:6px 16px;font-size:11.5px;display:flex}.tb-lg span{align-items:center;gap:7px;display:flex}.tb-lg i{border:2px solid var(--rc);border-radius:50%;width:10px;height:10px}.tb-desc{color:var(--mut);max-width:70ch;margin:0 0 18px;font-size:13px}.tb-note{color:var(--mut);max-width:70ch;margin:18px 0 0;font-size:12.5px}.tb-tier{margin-bottom:26px}.tb-th{align-items:baseline;gap:12px;margin-bottom:12px;display:flex}.tb-tl{font-family:var(--disp);color:var(--tc);font-size:30px;font-weight:600;line-height:1}.tb-tn{letter-spacing:.14em;text-transform:uppercase;color:var(--mut);font-size:11px}.tb-rule{background:linear-gradient(90deg,var(--tc) 0,var(--line) 40%,transparent);flex:1;height:1px}.tb-S{--tc:var(--tS)}.tb-A{--tc:var(--tA)}.tb-B{--tc:var(--tB)}.tb-C{--tc:var(--tC)}.tb-grid{grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:10px 6px;display:grid}.tb-tile{cursor:pointer;color:inherit;font:inherit;background:0 0;border:0;border-radius:10px;flex-direction:column;align-items:center;gap:5px;margin:0;padding:4px 0 2px;display:flex}.tb-ring{border:2px solid var(--rc);background:radial-gradient(circle at 50% 40%,#1a1620,#0e0c11 70%);border-radius:50%;place-items:center;width:64px;height:64px;transition:transform .15s,box-shadow .15s;display:grid}.tb-ring img{filter:drop-shadow(0 1px 2px #0009);width:54px;height:54px;display:block}.tb-r-damage{--rc:var(--rdamage)}.tb-r-tank{--rc:var(--rtank)}.tb-r-healer{--rc:var(--rhealer)}.tb-r-support{--rc:var(--rsupport)}.tb-tile:hover .tb-ring,.tb-tile:focus-visible .tb-ring,.tb-tile[aria-expanded=true] .tb-ring{transform:translateY(-2px);box-shadow:0 0 0 3px #eee6ee1f,0 8px 18px #00000080}.tb-tile:focus-visible{outline:2px solid var(--water);outline-offset:2px}.tb-sc{font:500 11.5px/1 var(--mono);color:var(--mut);font-variant-numeric:tabular-nums}.tb-card{z-index:75;border:1px solid var(--line2);pointer-events:none;opacity:0;background:#110e14;border-radius:12px;width:236px;max-width:calc(100vw - 16px);padding:12px 14px;transition:opacity .12s;position:fixed;box-shadow:0 14px 34px #0009}.tb-card.on{opacity:1;pointer-events:auto}.tb-card h3{font-family:var(--disp);letter-spacing:.02em;color:var(--gold2);margin:0;font-size:15px;font-weight:600}.tb-card .r{letter-spacing:.1em;text-transform:uppercase;color:var(--mut);align-items:center;gap:7px;margin:4px 0 10px;font-size:11px;display:flex}.tb-card .r i{background:var(--rc);border-radius:50%;width:8px;height:8px}.tb-card dl{grid-template-columns:1fr auto;gap:4px 12px;margin:0;font-size:12.5px;display:grid}.tb-card dt{color:var(--mut)}.tb-card dd{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;color:var(--ink);margin:0}.tb-card dd.hot{color:var(--gold2);font-weight:600}.tb-card dd.na{color:var(--mut)}.tb-how{border-top:1px solid var(--line);gap:12px;margin-top:36px;padding-top:22px;display:grid}.tb-how h2{font-family:var(--disp);letter-spacing:.03em;color:var(--gold);margin:0 0 2px;font-size:16px;font-weight:600}.tb-how p{color:var(--mut);max-width:70ch;margin:0;font-size:13px}.tb-how p b{color:var(--ink);font-weight:500}@media (width<=520px){.tb-crumbs{padding-right:64px}.tb-grid{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))}.tb-ring{width:54px;height:54px}.tb-ring img{width:46px;height:46px}.tb-tl{font-size:26px}}@media (prefers-reduced-motion:reduce){.tb-ring,.tb-card{transition:none}}
