/* Database: estilos. Usa os tokens do :root do site (--bg --panel --hi --gold --gb --gd --bz --tx --dim --line, escala --s1..--s9). */
.dbx{--rc:#d4cdb8;--ru:#7fdc7f;--rr:#7db4ff;--re:#cf9bff;--rl:#ffb454;--bad:#ff8f7a;--ok:#8fdc8f;padding-bottom:var(--s8);font-size:1rem}
.dbx a{text-underline-offset:3px}
.dbx h2,.dbx h3{scroll-margin-top:calc(var(--hdr) + 12px)}
.dbx h2{font-size:clamp(2.25rem,6vw,3.25rem)}
.dbx h3{font-size:1.6rem;margin:var(--s5) 0 var(--s2)}
.dbx h2:focus{outline:none}
.dbx .muted{color:var(--dim)}.dbx .note{color:var(--dim);font-size:.9rem;margin:var(--s3) 0 0}
.dbx code,.dbx kbd{font:.9em ui-monospace,Consolas,monospace;background:var(--hi);padding:1px 6px;border:1px solid var(--line)}
.dbx mark{background:#c8a24a55;color:var(--gb);padding:0 1px}
.dbx .lead{font-family:var(--serif);font-size:1.125rem;color:var(--tx);max-width:68ch}
.dbx .num{font-family:Jersey,monospace;font-size:1.9rem;color:var(--gb);line-height:1}

/* barra: busca + abas */
.dbar{padding:var(--s4) 0 var(--s3);border-bottom:2px solid var(--line);margin-bottom:var(--s5)}
.dsearch{position:relative;display:flex;gap:var(--s2);align-items:stretch}
.dsearch input{flex:1;min-width:0;min-height:52px;padding:0 44px 0 var(--s4);background:var(--panel);color:var(--tx);border:2px solid var(--gd);font:inherit;font-size:1.0625rem;border-radius:0}
.dsearch input::placeholder{color:var(--dim);opacity:.9}
.dsearch input:focus{outline:3px solid var(--gb);outline-offset:0}
.dsearch kbd{position:absolute;right:calc(var(--s2) + 92px);top:50%;transform:translateY(-50%);pointer-events:none;color:var(--dim)}
@media(max-width:560px){.dsearch kbd{display:none}}
.dsearch .btn{min-height:52px;font-size:1.3rem;padding:0 var(--s4)}
#dlist{position:absolute;z-index:40;left:0;right:0;top:100%;margin:2px 0 0;padding:var(--s1) 0;list-style:none;background:var(--panel);border:2px solid var(--gd);box-shadow:0 12px 32px #000c;max-height:min(70vh,520px);overflow:auto}
#dlist[hidden]{display:none}
#dlist .gh{font:1.05rem Jersey,monospace;color:var(--gold);padding:var(--s2) var(--s4) 2px;letter-spacing:.05em;text-transform:uppercase}
#dlist .none,#dlist .more{padding:var(--s3) var(--s4);color:var(--dim)}
#dlist li[role=option] a,#dlist .more a{display:flex;gap:var(--s3);align-items:center;padding:6px var(--s4);min-height:44px;color:var(--tx);text-decoration:none}
#dlist li.act a,#dlist li[role=option] a:hover{background:var(--bz);color:#fff}
.dtabs{display:flex;gap:var(--s1);margin-top:var(--s3);overflow-x:auto;scrollbar-width:thin;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.dtabs a{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s3);font:1.3rem Jersey,monospace;letter-spacing:.03em;color:var(--tx);text-decoration:none;background:var(--hi);border:2px solid transparent;border-bottom-color:var(--line)}
.dtabs a:hover{color:var(--gb);border-bottom-color:var(--gd)}
.dtabs a[aria-current]{background:var(--gold);color:var(--ink);border-color:#000}

/* cabecalhos de pagina */
.rh{margin:0 0 var(--s4)}.rh h2{margin:0 0 var(--s2)}
.bk{margin:0 0 var(--s3)}.bk a{color:var(--dim);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}.bk a:hover{color:var(--gb)}
.hero2{display:flex;gap:var(--s4);align-items:flex-start;margin-bottom:var(--s5)}
.hero2 h2{margin:0 0 var(--s2);word-break:break-word}
.hero2 .eyebrow{font:1.15rem Jersey,monospace;color:var(--gold);margin:0;letter-spacing:.06em;text-transform:uppercase}
.hero2 .desc{font-family:var(--serif);font-size:1.125rem;margin:var(--s3) 0 0;max-width:62ch}
.bigico{flex:none;padding:var(--s2);background:var(--panel);box-shadow:0 0 0 2px #000,0 0 0 4px var(--gd),0 0 0 6px #000}
.bigico .big{display:block;width:96px;height:96px}
@media(max-width:560px){.hero2{flex-direction:column;gap:var(--s3)}.bigico .big{width:72px;height:72px}.bigico .fb.big{--z:72px}}
.chips{display:flex;flex-wrap:wrap;gap:var(--s2)}

/* icones */
.di{display:inline-block;flex:none;vertical-align:middle;image-rendering:pixelated;image-rendering:crisp-edges;object-fit:contain}
.di.fb{width:var(--z,32px);height:var(--z,32px);background:var(--hi);border:2px solid var(--gd);color:var(--gold);font:calc(var(--z,32px)*.55)/calc(var(--z,32px) - 4px) Jersey,monospace;text-align:center;box-sizing:border-box;overflow:hidden}
.di.big.fb{width:96px;height:96px;font-size:56px;line-height:92px}
@media(max-width:560px){.di.big.fb{width:72px;height:72px;font-size:42px;line-height:68px}}
.dl{display:inline-flex;align-items:center;gap:var(--s2);min-height:32px;color:var(--gb);text-decoration:none;vertical-align:middle}
.dl:hover span{text-decoration:underline}
.dl span{overflow-wrap:anywhere}

/* chips e tags */
.chip2{display:inline-flex;align-items:center;gap:var(--s1);min-height:30px;padding:2px var(--s3);background:var(--hi);color:var(--tx);border:1px solid var(--gd);font-size:.95rem;text-decoration:none}
a.chip2:hover{border-color:var(--gb);color:var(--gb)}
.chip2.lg{min-height:44px;font-size:1.05rem;padding:0 var(--s4)}
.chip2.t{color:var(--ink);border-color:#000}
.t1,.t2{background:#c9c2b0}.t3,.t4{background:#8fd98f}.t5,.t6{background:#7db4ff}.t7,.t8{background:#cf9bff}.t9,.t10{background:#ffb454}.t11{background:#ff8f7a}
.chip2.el{border-color:currentColor}
.el-fire{color:#ff9a6b}.el-ice{color:#8fd6ff}.el-lightning{color:#ffe36b}.el-holy{color:#fff0a8}.el-shadow{color:#c4a6ff}.el-poison{color:#a6e86b}.el-bleed{color:#ff8f9a}.el-arcane{color:#d98fff}.el-wind{color:#a8f0d8}.el-earth{color:#d9b27c}.el-water{color:#7dc4ff}
.tag{display:inline-block;padding:0 6px;font-size:.82rem;line-height:1.5;background:var(--hi);border:1px solid var(--gd);color:var(--tx);white-space:nowrap}
.s-drop{color:#ff9a6b}.s-loja{color:#ffe36b}.s-craft{color:#8fd98f}.s-quest{color:#7db4ff}.s-coleta{color:#a6e86b}.s-pool{color:#cf9bff}
.rk-elite{color:#7db4ff}.rk-alpha{color:#cf9bff}.rk-miniboss{color:#ffb454}.rk-boss{color:#ff8f7a}
.rar{display:inline-block;padding:0 6px;margin:1px 0;background:var(--bg);border:1px solid currentColor;font-size:.88rem}
.r-common{color:var(--rc)}.r-uncommon{color:var(--ru)}.r-rare{color:var(--rr)}.r-epic{color:var(--re)}.r-legendary{color:var(--rl)}
.co{white-space:nowrap}.co.g{color:#ffd45c}.co.s{color:#d6dde6}.co.c{color:#e39a65}

/* cartoes */
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--s3);margin:var(--s3) 0 var(--s5)}
.cgrid.big{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.cd{display:flex;flex-direction:column;gap:var(--s1);align-items:flex-start;padding:var(--s4);background:var(--panel);color:var(--tx);text-decoration:none;border:2px solid var(--line);min-height:96px;transition:border-color .15s,transform .15s}
.cd b{font:1.6rem/1.1 Jersey,monospace;color:var(--gb);letter-spacing:.03em}
.cd span{color:var(--tx)}.cd i{font-style:normal;color:var(--dim);font-size:.92rem}
.cd:hover{border-color:var(--gold);transform:translateY(-2px)}
.strip{display:flex;flex-wrap:wrap;gap:var(--s2);margin-bottom:var(--s4)}

/* paineis */
.pn{background:var(--panel);border:2px solid var(--line);padding:var(--s4);margin:0 0 var(--s4);min-width:0}
.pn h3{margin:0 0 var(--s3);font-size:1.5rem;color:var(--gold)}
.pn h4{margin:var(--s4) 0 var(--s2)}
.pn .n{font-size:1rem;color:var(--dim);margin-left:var(--s2)}
.pn p:last-child{margin-bottom:0}
.cols2{display:grid;gap:var(--s4);grid-template-columns:minmax(0,1fr)}
@media(min-width:900px){.cols2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.cols2>.pn{margin-bottom:0}.cols2{margin-bottom:var(--s4)}
.dbx dl.kv{margin:0;display:block}
.kv>div{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:var(--s3);padding:7px 0;border-bottom:1px solid var(--line)}
.kv>div:last-child{border-bottom:0}
.kv dt{font:1.15rem/1.3 Jersey,monospace;color:var(--dim);letter-spacing:.03em}
.kv dd{margin:0;min-width:0;overflow-wrap:anywhere;text-align:left}
.kv dt{color:var(--dim)}
@media(max-width:480px){.kv>div{grid-template-columns:1fr;gap:0}}
.ul{margin:0;padding-left:1.2em}.ul li{margin:4px 0}
.chips2{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s3);align-items:center}
.rl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:var(--s1) var(--s3)}
blockquote{margin:0 0 var(--s3);padding:var(--s2) var(--s4);border-left:4px solid var(--gd);font-family:var(--serif);color:var(--tx)}blockquote.done{border-left-color:var(--ok)}

/* tabelas */
.tw{overflow-x:auto;margin:0 0 var(--s2);-webkit-overflow-scrolling:touch}
.dbx .tb{width:100%;min-width:0;border-collapse:collapse;font-size:.95rem}
.dbx .tb th,.dbx .tb td{white-space:normal;text-align:left;font-variant-numeric:tabular-nums}.dbx .tb th{white-space:nowrap}
.dbx .tb th:first-child,.dbx .tb td:first-child{position:static;background:transparent}.dbx .tb th:first-child{background:var(--hi)}
.dbx .tb td.r,.dbx .tb th.r{text-align:right}
.dbx .tb.wide{min-width:640px}.dbx .tw.wide .tb td{white-space:nowrap}
.tb th,.tb td{padding:8px var(--s3);text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.tb th{font:1.15rem Jersey,monospace;color:var(--gold);letter-spacing:.03em;background:var(--hi);position:sticky;top:0;white-space:nowrap}
.tb th button{all:unset;cursor:pointer;color:inherit;font:inherit;letter-spacing:inherit;display:inline-flex;align-items:center;gap:4px;min-height:32px}
.tb th button:focus-visible{outline:3px solid var(--gb);outline-offset:2px}
.tb th[aria-sort=ascending] button::after{content:"▲";font-size:.7em}.tb th[aria-sort=descending] button::after{content:"▼";font-size:.7em}
.tb th[aria-sort=none] button::after{content:"↕";font-size:.8em;opacity:.45}
.tb td.r,.tb th.r{text-align:right}
.tb tbody tr:hover td{background:#ffffff08}
.tb.narrow{width:auto;min-width:240px}
@media(max-width:760px){
 .tw:not(.wide):not(.narrow){overflow:visible}
 .tw:not(.wide):not(.narrow) .tb,.tw:not(.wide):not(.narrow) .tb tbody{display:block}
 .tw:not(.wide):not(.narrow) .tb thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
 .tw:not(.wide):not(.narrow) .tb tr{display:block;background:var(--panel);border:2px solid var(--line);margin:0 0 var(--s2);padding:var(--s2) var(--s3)}
 .tw:not(.wide):not(.narrow) .tb td{display:block;padding:5px 0;border:0;text-align:right;overflow:hidden}
 .tw:not(.wide):not(.narrow) .tb td::before{content:attr(data-l);float:left;margin-right:var(--s3);font:1.05rem Jersey,monospace;color:var(--dim);text-align:left}
 .tw:not(.wide):not(.narrow) .tb td:first-child{display:block;text-align:left;padding:2px 0 6px;border-bottom:1px solid var(--line);margin-bottom:4px;font-size:1.05rem}
 .tw:not(.wide):not(.narrow) .tb td:first-child::before{display:none}
 .tw:not(.wide):not(.narrow) .tb td>*{max-width:100%}
 .tb td.r{text-align:right}
}

/* filtros */
.fl-btn{display:none;align-items:center;gap:var(--s2);min-height:48px;padding:0 var(--s4);background:var(--hi);color:var(--gb);border:2px solid var(--gd);font:1.4rem Jersey,monospace;cursor:pointer;width:100%;justify-content:center;margin-bottom:var(--s3)}
.fl-n{background:var(--gold);color:var(--ink);min-width:24px;padding:0 6px;font-size:1.1rem;text-align:center}
.fl{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:var(--s3);padding:var(--s4);background:var(--panel);border:2px solid var(--line);margin-bottom:var(--s3);align-items:end}
.ff{display:flex;flex-direction:column;gap:4px;min-width:0}.ff.wide{grid-column:span 2}
.ff label,.fl-l{font:1.1rem Jersey,monospace;color:var(--dim);letter-spacing:.03em}
.fl input,.fl select{min-height:44px;width:100%;background:var(--bg);color:var(--tx);border:2px solid var(--line);padding:0 var(--s2);font:inherit;font-size:1rem;border-radius:0}
.fl select{padding-right:var(--s1)}
.fl input:focus,.fl select:focus{border-color:var(--gb);outline:2px solid var(--gb);outline-offset:0}
.ff.rg div{display:flex;gap:6px;align-items:center}.ff.rg input{min-width:0}
.ff.act{align-self:end}.ff.act .btn{min-height:44px;font-size:1.2rem;padding:0 var(--s4);width:100%}
.btn.ghost{background:transparent;color:var(--gb);box-shadow:0 0 0 2px var(--gd)}
@media(max-width:800px){.fl-btn{display:flex}.fl{display:none;grid-template-columns:1fr 1fr}.fl.open{display:grid}.ff.wide{grid-column:1/-1}}
@media(max-width:420px){.fl{grid-template-columns:1fr}}
.cnt{margin:var(--s3) 0;color:var(--dim)}.cnt b{color:var(--gb);font:1.4rem Jersey,monospace}
.none{padding:var(--s6) var(--s4);text-align:center;background:var(--panel);border:2px dashed var(--line)}
.pg{display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:center;margin:var(--s4) 0}
.pg button{min-width:44px;min-height:44px;padding:0 var(--s3);background:var(--hi);color:var(--tx);border:2px solid var(--line);font:1.2rem Jersey,monospace;cursor:pointer}
.pg button[aria-current]{background:var(--gold);color:var(--ink);border-color:#000}
.pg button:disabled{opacity:.4;cursor:default}
.pg button:not(:disabled):hover{border-color:var(--gb)}
.pg span{align-self:center;color:var(--dim)}

/* estados */
.ld,.err{padding:var(--s6) var(--s4);text-align:center;color:var(--dim)}
.err{background:var(--panel);border:2px solid var(--bad)}.err h2{color:var(--bad)}
.dfoot{margin-top:var(--s6);padding-top:var(--s4);border-top:2px solid var(--line);font-size:.9rem}
@media(prefers-reduced-motion:reduce){.cd{transition:none}.cd:hover{transform:none}}
.dbx .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media print{.dbar,.fl,.fl-btn,.pg{display:none}}

.dbhead{padding-top:var(--s5)}.dbhead h1{font-size:clamp(2.75rem,7vw,4rem);margin-bottom:var(--s2)}.dbhead .lead{margin:0;color:var(--dim)}

.dbx .note{margin:var(--s3) 0}.dbx .muted small,.dbx small.muted{font-size:.8em}
@media(max-width:560px){.cgrid.big{grid-template-columns:repeat(2,minmax(0,1fr))}.cgrid.big .cd{padding:var(--s3);min-height:0}.cgrid.big .cd b{font-size:1.4rem}}