/* /js/jogos/hsr/builds.css -- tela Builds do Honkai: Star Rail (mockup aprovado docs/mockups/hsr/builds.html, 07/11/2026).
   Blocos .gs-bl (cenário do HSR e feixe de luz, regras 11 e 20); letra mínima 15px (regra 18); cartões da mesma fileira alinhados por subgrid (regra 25).
   Prefixo hbd- (o hb- é da tela Banners). */
#hsrApp .hbd-cabeca{padding:16px 20px}
#hsrApp .hbd-selos{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}
#hsrApp .hbd-selo{display:inline-flex;gap:8px;align-items:center;border-radius:999px;padding:4px 14px;border:1px solid;font-weight:600;font-size:15px}
#hsrApp .hbd-selo i{width:9px;height:9px;border-radius:3px;background:currentColor}
#hsrApp .hbd-obra{color:var(--gs-ouro,#f0d080);border-color:rgba(240,208,128,.5);background:rgba(36,26,4,.6)}
#hsrApp .hbd-atual{color:#38d6a0;border-color:rgba(56,214,160,.5);background:rgba(5,24,18,.6)}
#hsrApp .hbd-rot{font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t-low,#8a93a3)}
#hsrApp .hbd-ferr{display:grid;gap:12px;padding:16px 20px}
#hsrApp .hbd-ferr > :not(.gs-ceu){position:relative;z-index:1;margin:0}
#hsrApp .hbd-chips{display:flex;gap:8px;flex-wrap:wrap;max-height:196px;overflow-y:auto;padding:2px}
#hsrApp .hbd-chip{display:inline-flex;gap:10px;align-items:center;background:var(--s-800,#171c36);border:1px solid var(--border,#29313d);border-radius:12px;padding:6px 14px 6px 8px;cursor:pointer;min-height:48px;font-weight:600;font-size:15px;color:var(--t-mid,#a7b0bd)}
#hsrApp .hbd-chip.on{border-color:var(--gs-ouro,#f0d080);color:var(--gs-ouro,#f0d080);background:rgba(232,199,106,.12)}
#hsrApp .hbd-chip img{width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.25);object-fit:cover}
#hsrApp .hbd-chip.hbd-falta{opacity:.5;cursor:default}
#hsrApp .hbd-vazio{padding:16px;color:var(--t-mid,#a7b0bd);font-size:15px;margin:0}
#hsrApp .hbd-ficha{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:6px 18px;align-items:center;padding:16px 20px}
#hsrApp .hbd-ficha > :not(.gs-ceu){position:relative;z-index:1;margin:0}
#hsrApp .hbd-ret{width:84px;height:84px;border-radius:50%;background:rgba(0,0,0,.25);border:2px solid rgba(122,162,255,.45);overflow:hidden;display:block}
#hsrApp .hbd-ret img{width:100%;height:100%;object-fit:cover}
#hsrApp .hbd-ficha h3{margin:0 0 6px;font-size:24px}
#hsrApp .hbd-dica{margin:6px 0 0;font-size:15px;color:var(--t-low,#8a93a3)}
#hsrApp .hbd-btns{display:flex;gap:10px;flex-wrap:wrap}
#hsrApp .hbd-btns .gs-btn-ouro{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
@media (max-width:760px){#hsrApp .hbd-ficha{grid-template-columns:64px minmax(0,1fr)}#hsrApp .hbd-ret{width:64px;height:64px}#hsrApp .hbd-ficha .hbd-btns{grid-column:1/-1}}
#hsrApp .hbd-tags{display:flex;gap:6px;flex-wrap:wrap;align-content:flex-start}
#hsrApp .hbd-tag{font-size:15px;font-weight:600;border:1px solid;border-radius:6px;padding:1px 8px;white-space:nowrap}
#hsrApp .hbd-t-ac{color:#b3c8ff;border-color:rgba(122,162,255,.45)}
#hsrApp .hbd-t-ouro{color:var(--gs-ouro,#f0d080);border-color:rgba(240,208,128,.55)}
#hsrApp .hbd-t-verde{color:#38d6a0;border-color:rgba(56,214,160,.55)}
#hsrApp .hbd-t-rox{color:#b48cff;border-color:rgba(180,140,255,.55)}
#hsrApp .hbd-sec{display:grid;gap:12px}
#hsrApp .hbd-sec > h3{margin:0;font-size:19px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
#hsrApp .hbd-sec small,#hsrApp .hbd-sub small{font-size:15px;font-weight:500;color:var(--t-low,#8a93a3)}
#hsrApp .hbd-sub{margin:4px 0 0;font-size:16px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
#hsrApp .hbd-nota{margin:0;font-size:15px;color:var(--t-mid,#a7b0bd)}
#hsrApp .hbd-lista{display:grid;gap:12px}
#hsrApp .hbd-l4{grid-template-columns:repeat(4,minmax(0,1fr))}
#hsrApp .hbd-l2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:1000px){#hsrApp .hbd-l4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){#hsrApp .hbd-l4,#hsrApp .hbd-l2{grid-template-columns:1fr}}
#hsrApp .hbd-card{display:grid;grid-row:span 5;grid-template-rows:subgrid;gap:10px;align-content:start;min-width:0;padding:14px}
#hsrApp .hbd-card > :not(.gs-ceu){position:relative;z-index:1;margin:0}
#hsrApp .hbd-top{border-color:var(--gs-ouro,#f0d080)}
#hsrApp .hbd-cab-c{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center}
#hsrApp .hbd-cab-c b{font-size:16px;line-height:1.25;overflow-wrap:anywhere}
#hsrApp .hbd-ic{width:48px;height:48px;border-radius:10px;background:rgba(0,0,0,.25);border:1px solid var(--border,#29313d);display:grid;place-items:center;overflow:hidden}
#hsrApp .hbd-ic img{width:100%;height:100%;object-fit:contain}
#hsrApp .hbd-q{display:grid;place-items:center;width:100%;height:100%;font-weight:800;font-size:15px;color:var(--t-low,#8a93a3);background:var(--s-700,#1a2130)}
#hsrApp .hbd-ln{display:flex;justify-content:space-between;gap:8px;font-size:15px;font-variant-numeric:tabular-nums}
#hsrApp .hbd-ln span{color:var(--t-mid,#a7b0bd)}
#hsrApp .hbd-ln b{font-weight:700}
#hsrApp .hbd-barra{height:10px;border-radius:999px;background:rgba(0,0,0,.35);border:1px solid var(--border,#29313d);overflow:hidden}
#hsrApp .hbd-barra i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#7aa2ff,#20d3e0)}
#hsrApp .hbd-top .hbd-barra i{background:linear-gradient(90deg,#f0c35b,#ffe39a)}
#hsrApp .hbd-gav .hbd-efes{display:grid;gap:12px;margin-top:12px}
#hsrApp .hbd-efe{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:start}
#hsrApp .hbd-efe b{color:var(--t-hi,#f1f2fb)}
#hsrApp .hbd-efe p{margin:4px 0 0;font-size:15px;color:var(--t-mid,#a7b0bd)}
#hsrApp .hbd-atr{display:grid;gap:12px;padding:16px 20px}
#hsrApp .hbd-atr > :not(.gs-ceu){position:relative;z-index:1;margin:0}
#hsrApp .hbd-atr h3{font-size:19px}
#hsrApp .hbd-tab{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:900px){#hsrApp .hbd-tab{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){#hsrApp .hbd-tab{grid-template-columns:1fr}}
#hsrApp .hbd-casa{display:grid;grid-template-rows:auto 1fr;gap:6px;padding:12px;border-radius:12px;border:1px solid var(--border,#29313d);background:rgba(0,0,0,.2);min-width:0;font-size:15px}
#hsrApp .hbd-casa > span{color:var(--t-low,#8a93a3)}
#hsrApp .hbd-cad{display:flex;gap:8px;flex-wrap:wrap;align-items:center;align-content:flex-start}
#hsrApp .hbd-st{background:var(--s-800,#171c36);border:1px solid var(--border,#29313d);border-radius:8px;padding:2px 10px;font-weight:600;font-size:15px}
#hsrApp .hbd-op{color:var(--t-low,#8a93a3);font-weight:700;font-size:16px}
#hsrApp .hbd-fonte{margin:0;font-size:15px;color:var(--t-low,#8a93a3)}
@media (prefers-reduced-motion:reduce){#hsrApp .hbd-card *{animation:none!important;transition:none!important}}
