/* Navegação compacta do produto, alinhada com a referência do Blitz. */
.global-header{gap:22px}
.product-nav{order:0;gap:22px;height:48px;padding:0;background:transparent;border:0;overflow:visible;white-space:nowrap}
.product-nav a{height:48px}
/* Item do menu que ainda não abre (a Tier List): apagado, sem link, com a etiqueta "em breve". */
.product-nav .nav-em-breve{display:flex;align-items:center;gap:6px;height:48px;color:#6b717c;font-weight:500;cursor:default;white-space:nowrap}
.product-nav .nav-em-breve small{border-radius:4px;padding:2px 5px;background:#2a2f3a;color:#a5a9b2;font-size:9px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
@media(max-width:1100px){.global-header{gap:14px}.product-nav{gap:18px}.product-nav a,.product-nav .nav-em-breve{font-size:12px}}
@media(max-width:1460px){.product-nav{position:absolute;top:48px;right:0;left:0;z-index:3;height:40px;padding:0 18px;background:#15181e;border-bottom:1px solid #282c34;overflow:auto}.product-nav a,.product-nav .nav-em-breve{height:40px}.page{padding-top:57px}}

/* A Home usa a estrutura aprovada no wireframe; os acabamentos continuam do sistema Blitz. */
.home-wire{max-width:1220px;margin:10px auto 0}.home-banner{display:grid;grid-template-columns:minmax(0,1fr) 260px;min-height:178px;padding:10px;gap:12px}.banner-image,.wire-image,.wide-image{display:grid;place-items:center;border:1px solid #303641;border-radius:5px;background:linear-gradient(135deg,#20242c,#171a21);color:#69707c;font-size:11px;font-weight:700;text-transform:uppercase}.banner-image{min-height:156px}.banner-image span{text-transform:none;font-size:13px}.banner-cta{display:flex;flex-direction:column;justify-content:center;padding:8px}.banner-cta h1{font-size:22px}.banner-cta p{margin-top:5px;color:var(--muted);font-size:12px}.banner-cta .primary{margin-top:18px}.wire-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}.wire-quick{display:flex;min-height:316px;flex-direction:column;padding:14px}.wire-quick h2{font-size:16px}.wire-quick p,.wire-wide p{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.45}.wire-image{flex:1;min-height:132px;margin:12px 0}.wire-quick .secondary{width:100%;margin-top:auto}.wire-bottom{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.wire-wide{display:flex;justify-content:space-between;gap:20px;min-height:135px;padding:16px}.wire-wide h2{font-size:16px}.wire-wide .badge{margin-left:6px;vertical-align:2px}.wire-wide .secondary{margin-top:14px}.wide-image{width:155px;min-height:100px}@media(max-width:760px){.home-banner{grid-template-columns:1fr}.banner-cta{padding:8px 4px}.wire-quick-grid{grid-template-columns:repeat(2,1fr)}.wire-bottom{grid-template-columns:1fr}.banner-image{min-height:120px}}@media(max-width:460px){.wire-quick-grid{grid-template-columns:1fr}.wire-wide{flex-direction:column}.wide-image{width:100%;min-height:92px}}

/* Banner desktop 3200 × 700: relação 32:7, com CTA sobre a imagem. */
.home-banner{position:relative;display:block;min-height:0;aspect-ratio:32 / 7;overflow:hidden;padding:10px}
.banner-image{position:absolute;inset:10px;min-height:0;overflow:hidden;border-radius:6px}.banner-image span{display:none!important}
.banner-cta{position:absolute;top:50%;right:26px;width:270px;min-height:150px;transform:translateY(-50%);border:1px solid #383e49;border-radius:8px;padding:18px;background:rgba(21,24,30,.95);box-shadow:0 4px 34px rgba(7,9,14,.75)}
.banner-cta .primary{width:100%}
@media(max-width:760px){.home-banner{aspect-ratio:auto;min-height:275px}.banner-image{inset:10px}.banner-cta{right:20px;bottom:20px;left:20px;top:auto;width:auto;min-height:0;transform:none}}

/* Imagem como base: textos e ações ficam sobrepostos em todos os cards da Home. */
.home-banner{aspect-ratio:32 / 7}
.wire-quick,.wire-wide{position:relative;isolation:isolate;overflow:hidden;background:#171a21}
.wire-quick .wire-image,.wire-wide .wide-image{position:absolute;inset:0;z-index:-2;width:auto;height:auto;min-height:0;margin:0;border:0;border-radius:0}
.wire-quick:after,.wire-wide:after{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(21,24,30,.96) 0%,rgba(21,24,30,.78) 56%,rgba(21,24,30,.42) 100%);content:""}
.wire-quick h2,.wire-quick p,.wire-quick .secondary,.wire-wide>div:first-child{position:relative;z-index:1}
.wire-quick .secondary{margin-top:auto;background:rgba(31,35,44,.9)}
.wire-wide>div:first-child{max-width:72%}
@media(max-width:760px){.home-banner{aspect-ratio:auto;min-height:235px}.wire-wide>div:first-child{max-width:100%}}

.discord-cta{display:inline-flex;align-items:center;gap:9px;height:36px!important;border:0!important;border-radius:7px!important;padding:0 17px!important;background:#f2295e!important;color:#fff!important;font-size:12px!important;font-weight:700!important;box-shadow:none;text-decoration:none!important}.discord-cta svg{width:18px;height:18px;flex:none}.discord-cta:hover{background:#ff3c70!important}
.play-now-cta{display:inline-flex;align-items:center;gap:6px;height:36px!important;border:0!important;border-radius:7px!important;padding:0 18px!important;background:linear-gradient(135deg,#f4af25 0%,#ff8c00 100%)!important;color:#15181e!important;font-size:12px!important;font-weight:850!important;letter-spacing:.03em;text-transform:uppercase;text-decoration:none!important;box-shadow:0 0 12px rgba(244,175,37,.35);transition:all .15s ease}.play-now-cta:hover{background:linear-gradient(135deg,#ffbe38 0%,#ffa01a 100%)!important;box-shadow:0 0 18px rgba(244,175,37,.6);transform:translateY(-1px)}
/* O topo inteiro (9 abas, a Tier List "em breve" e "Entre em nosso Discord") pede ~1480 px, e com "Discord" curto,
   ~1385 px (medido em 10/11/2026, com 22 px entre os itens). Para nada quebrar linha, abaixo de 1560 px o botão diz
   só "Discord" e abaixo de 1460 px o menu desce para a 2ª linha; a folga (~76 px) cobre a barra de rolagem do
   Windows, que conta na largura da media query. */
.header-tools>a{flex:none;white-space:nowrap}
@media(max-width:1560px){.discord-cta-extra{display:none}}
/* Apoie o dev!: o dourado do botão do /hunt da extensão, só o ícone porque o topo já aperta o Discord e o Jogue Agora. */
.header-tools{position:relative}.apoio-cta{flex:none;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;border-radius:6px;padding:0;background:linear-gradient(180deg,#ffe9a8 0 4px,#d09a17 4px 100%);box-shadow:inset 0 0 0 2px #480e1e;color:#000;cursor:pointer}.apoio-cta svg{width:15px;height:15px;filter:drop-shadow(0 1px 0 rgba(255,255,255,.35))}.apoio-cta:hover{filter:brightness(1.06)}.apoio-cta[aria-expanded="true"]{filter:brightness(.9)}.apoio-cta:focus-visible,.apoio-link:focus-visible{outline:2px solid #f4af25;outline-offset:2px}
.apoio-balao{position:absolute;top:calc(100% + 9px);right:0;z-index:20;display:flex;gap:12px;align-items:center;width:420px;max-width:calc(100vw - 28px);padding:12px;border:1px solid #30343d;border-radius:8px;background:#1a1d23;box-shadow:0 12px 32px rgba(0,0,0,.45);color:#ebeef0;font-size:12px;line-height:1.45}.apoio-balao[hidden]{display:none}.apoio-qr{flex:none;display:block;width:112px;height:112px;border-radius:6px;overflow:hidden;box-shadow:0 0 0 2px #d09a17}.apoio-qr img{display:block;width:100%;height:100%}.apoio-balao b{font-size:14px}.apoio-balao p{margin:4px 0 8px;color:#a5a9b2}.apoio-link{display:inline-flex;align-items:center;height:30px;border-radius:6px;padding:0 10px;background:linear-gradient(180deg,#ffe9a8 0 4px,#d09a17 4px 100%);box-shadow:inset 0 0 0 2px #480e1e;color:#000;font-weight:700;text-decoration:none}.apoio-link:hover{filter:brightness(1.06)}

.filter-search-icon{font-size:22px;line-height:0;font-weight:400}.control.dropdown{min-width:104px;justify-content:space-between}.control .caret{margin-left:8px;color:#a7adb7;font-size:15px}.data-panel{max-height:none!important;overflow-x:auto;overflow-y:visible!important}

.filter-groups{position:relative!important;display:flex!important;flex-direction:column!important;gap:10px!important;margin:16px 0 16px!important;width:100%!important;overflow:visible!important}.filter-group{display:flex;align-items:center;gap:7px}.group-label{margin-right:1px;color:#838a95;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.ball-group .control{min-width:0;padding:0 10px}.boost-options{display:inline-flex!important;align-items:center!important;gap:4px!important;flex-shrink:0!important;border:none!important;border-top:none!important;padding-top:0!important;margin:0!important}.boost-options .control{background:#181b22}.boost-options .group-label{margin-right:5px}
.filter-row-top{position:relative!important;display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:6px!important;width:100%!important;overflow:visible!important}
.filter-groups--capture .filter-row-top{flex-wrap:nowrap!important;overflow-x:auto!important;padding-bottom:2px}
.filter-groups--capture .search-field{width:172px}
.filter-groups--capture .control.dropdown{min-width:90px}
.filter-groups--capture #dex-apenas-shiny{padding:0 8px}
.filter-groups--capture .ball-group .control{padding:0 5px}
.filter-groups--capture .boost-options .control{padding:0 8px}
.level-range-control{display:inline-flex;align-items:center;gap:4px;height:36px;flex-shrink:0}
.level-range-control .group-label{margin-right:0}
.level-range-control .control{width:46px;min-width:46px;padding:0 4px;text-align:center}
.level-range-control .control::-webkit-inner-spin-button,.level-range-control .control::-webkit-outer-spin-button{opacity:.6}
.level-range-separator{color:#858b95;font-size:13px;font-weight:700}
.cols-toggle-container{position:relative!important;display:inline-flex!important;margin-left:auto!important;flex-shrink:0!important}
.cols-popover{position:absolute!important;top:calc(100% + 6px)!important;right:0!important;width:220px!important;background:#191c22!important;border:1px solid #323843!important;border-radius:10px!important;padding:12px!important;box-shadow:0 10px 30px rgba(0,0,0,0.8)!important;z-index:9999!important;display:none}
.cols-popover.open{display:block!important}
select, select.control, .select-control, .field select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-color: #1d2027 !important;
  color: #ebeef0 !important;
  border: 1px solid #3a3f48 !important;
  border-radius: 6px !important;
  padding: 0 28px 0 10px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23a7adb7' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  height: 36px !important;
  font-size: 12px !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
}

select option {
  background-color: #181b21 !important;
  color: #ebeef0 !important;
  padding: 6px 10px !important;
}

.field input, .field select {
  background-color: #1d2027 !important;
  color: #ebeef0 !important;
  border: 1px solid #3a3f48 !important;
  border-radius: 6px !important;
  padding: 0 10px !important;
  height: 36px !important;
  font-size: 12px !important;
}

.field input:focus, select:focus, input.control:focus {
  outline: none !important;
  border-color: #7984f4 !important;
  box-shadow: 0 0 0 2px rgba(121, 132, 244, 0.25) !important;
}

.control.selected{border-color:#6973ed!important;background:#6873e9!important;color:#fff!important}
.control.check:before{width:14px!important;height:14px!important;border-radius:4px!important;border:1.5px solid #4a505d!important;background:#222630!important;content:""!important;display:inline-block!important;box-sizing:border-box!important;flex-shrink:0!important;transition:all 0.15s ease!important}
.control.check.selected:before{background:#ffffff!important;border-color:#ffffff!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236873e9'%3E%3Cpath d='M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z'/%3E%3C/svg%3E")!important;background-position:center!important;background-repeat:no-repeat!important;background-size:11px 11px!important}

/* Dark Custom Scrollbars */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #12141a;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb {
  background: #2d3340;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #434b5c;
}

.form-card, .data-panel {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
