/* /js/jogos/hsr/codigos.css -- tela Códigos de resgate do Honkai: Star Rail (mockup aprovado docs/mockups/hsr/codigos.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). */
#hsrApp .hc-cab{padding:16px 20px}
#hsrApp .hc-selos{display:flex;gap:10px;flex-wrap:wrap;position:relative;z-index:1}
#hsrApp .hc-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 .hc-selo i{width:9px;height:9px;border-radius:3px;background:currentColor}
#hsrApp .hc-obra{color:var(--gs-ouro,#f0d080);border-color:rgba(240,208,128,.5);background:rgba(36,26,4,.6)}
#hsrApp .hc-atual{color:#38d6a0;border-color:rgba(56,214,160,.5);background:rgba(5,24,18,.6)}
#hsrApp .hc-ferr{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;padding:16px 20px}
#hsrApp .hc-grupo{display:flex;gap:10px;flex-wrap:wrap;align-items:center;position:relative;z-index:1}
#hsrApp .hc-grupo .gs-chips{margin:0}
#hsrApp .hc-rot{font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--t-low,#8a93a3)}
#hsrApp .hc-qtd{font-size:15px;color:var(--t-low,#8a93a3);font-variant-numeric:tabular-nums}
#hsrApp .hc-dica{flex:1 1 100%;margin:0;font-size:15px;color:var(--t-mid,#a7b0bd);position:relative;z-index:1}
#hsrApp .hc-sec{display:grid;gap:12px}
#hsrApp .hc-sec > h3{margin:0;font-size:19px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
#hsrApp .hc-sec > h3 small{font-size:15px;font-weight:500;color:var(--t-low,#8a93a3)}
#hsrApp .hc-lista{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:980px){#hsrApp .hc-lista{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){#hsrApp .hc-lista{grid-template-columns:1fr}}
#hsrApp .hc-card{display:grid;grid-row:span 5;grid-template-rows:subgrid;gap:10px;align-content:start;min-width:0;padding:14px}
#hsrApp .hc-card > :not(.gs-ceu){position:relative;z-index:1;margin:0}
#hsrApp .hc-ja{opacity:.62}
#hsrApp .hc-cod{display:flex;gap:10px;align-items:center;justify-content:space-between;min-width:0}
#hsrApp .hc-cod code{font-size:17px;font-weight:600;letter-spacing:.04em;overflow-wrap:anywhere}
#hsrApp .hc-cop{background:rgba(0,0,0,.25);border:1px solid var(--border,#29313d);border-radius:10px;padding:6px 14px;min-height:44px;min-width:104px;cursor:pointer;font-size:15px;font-weight:700;color:#b3c8ff}
#hsrApp .hc-cop.ok{border-color:#38d6a0;color:#38d6a0}
#hsrApp .hc-tags{display:flex;gap:6px;flex-wrap:wrap;align-content:flex-start}
#hsrApp .hc-tag{font-size:15px;font-weight:600;border:1px solid;border-radius:6px;padding:1px 8px;white-space:nowrap}
#hsrApp .hc-vivo{color:#38d6a0;border-color:rgba(56,214,160,.55)}
#hsrApp .hc-exp{color:#ff7a7a;border-color:rgba(255,122,122,.55)}
#hsrApp .hc-feito{color:var(--gs-ouro,#f0d080);border-color:rgba(240,208,128,.55)}
#hsrApp .hc-quando{font-size:15px;color:var(--t-low,#8a93a3)}
#hsrApp .hc-premios{display:grid;gap:6px;align-content:start}
#hsrApp .hc-pr{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:15px}
#hsrApp .hc-pr b{font-weight:600;font-variant-numeric:tabular-nums}
#hsrApp .hc-ic{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;overflow:hidden;background:rgba(0,0,0,.25);border:1px solid var(--border,#29313d)}
#hsrApp .hc-ic img{width:100%;height:100%;object-fit:contain}
#hsrApp .hc-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 .hc-marca{display:flex;gap:10px;align-items:center;min-height:44px;cursor:pointer;font-size:15px;font-weight:600}
#hsrApp .hc-marca input{width:22px;height:22px;accent-color:var(--gs-ouro,#f0d080)}
#hsrApp .hc-vazio{padding:16px;color:var(--t-mid,#a7b0bd);font-size:15px}
#hsrApp .hc-soma-bl{display:grid;gap:12px;padding:16px 20px}
#hsrApp .hc-soma-bl > :not(.gs-ceu){position:relative;z-index:1;margin:0}
#hsrApp .hc-soma-bl h3{font-size:19px}
#hsrApp .hc-notas{font-size:15px;color:var(--t-mid,#a7b0bd)}
#hsrApp .hc-soma{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:900px){#hsrApp .hc-soma{grid-template-columns:repeat(2,minmax(0,1fr))}}
#hsrApp .hc-item{display:grid;grid-template-columns:36px minmax(0,1fr);gap:4px 10px;align-items:center;padding:12px;border-radius:12px;border:1px solid var(--border,#29313d);background:rgba(0,0,0,.2);font-size:15px}
#hsrApp .hc-item .hc-ic{grid-row:span 2}
#hsrApp .hc-item span{color:var(--t-mid,#a7b0bd)}
#hsrApp .hc-item b{font-size:20px;font-variant-numeric:tabular-nums}
#hsrApp .hc-res{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px 20px}
#hsrApp .hc-res > :not(.gs-ceu){position:relative;z-index:1}
#hsrApp .hc-res h3{margin:0 0 4px;font-size:19px}
#hsrApp .hc-res p{margin:0;font-size:15px;color:var(--t-mid,#a7b0bd)}
#hsrApp .hc-btns{display:flex;gap:10px;flex-wrap:wrap}
#hsrApp .hc-btns a.gs-btn-ouro{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
@media (max-width:640px){#hsrApp .hc-res{grid-template-columns:1fr}}
#hsrApp .hc-gav > div{display:grid;gap:8px;margin-top:12px}
#hsrApp .hc-gav p{margin:0;font-size:15px;color:var(--t-mid,#a7b0bd)}
#hsrApp .hc-fonte{margin:0;font-size:15px;color:var(--t-low,#8a93a3)}
@media (prefers-reduced-motion:reduce){#hsrApp .hc-card *{animation:none!important;transition:none!important}}