.heroes-hero{text-align:center;padding:3rem 0 2rem}.heroes-hero h1{font-size:2rem;color:var(--accent);margin-bottom:.5rem}.heroes-hero p{color:var(--text-secondary);font-size:1rem;max-width:600px;margin:0 auto}.heroes-meta{font-size:.85rem!important;margin-top:.5rem!important;opacity:.7}.heroes-view-toggle{display:flex;gap:.5rem;justify-content:center;margin-bottom:2rem}.heroes-view-toggle button{background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border);padding:.6rem 1.5rem;border-radius:8px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s}.heroes-view-toggle button:hover{border-color:var(--accent);color:var(--text-primary)}.heroes-view-toggle button.active{background:var(--accent);color:var(--bg-primary);border-color:var(--accent)}.mode-selector{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1rem}.mode-selector button{background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border);padding:.5rem 1rem;border-radius:8px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s}.mode-selector button:hover{border-color:var(--accent);color:var(--text-primary)}.mode-selector button.active{background:var(--accent);color:var(--bg-primary);border-color:var(--accent)}.mode-description{text-align:center;color:var(--text-secondary);font-size:.9rem;margin-bottom:1rem;font-style:italic}.type-advantage{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:1.5rem;padding:.6rem 1rem;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;font-size:.82rem;color:var(--text-secondary);flex-wrap:wrap}.adv-arrow{color:var(--accent);font-weight:700}.tier-row{display:flex;margin-bottom:.5rem;border-radius:10px;overflow:hidden;border:1px solid var(--border)}.tier-label{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:60px;padding:.75rem .5rem;color:var(--bg-primary);font-weight:800}.tier-letter{font-size:1.5rem;line-height:1}.tier-heroes{display:flex;flex-wrap:wrap;gap:.4rem;padding:.6rem .75rem;background:var(--bg-card);flex:1 1;align-items:center}.tier-empty{color:var(--text-secondary);opacity:.5}.tier-hero-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .7rem;border-radius:6px;font-size:.82rem;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);transition:all .15s}.tier-hero-chip:hover{border-color:var(--accent);transform:translateY(-1px)}.tier-hero-chip .chip-type-icon{font-size:.75rem}.rarity-ur{color:#f59e0b!important}.rarity-ssr{color:#a855f7!important}.rarity-sr{color:#3b82f6!important}.tier-hero-chip.rarity-ur{border-color:#f59e0b44;background:#f59e0b11}.tier-hero-chip.rarity-ssr{border-color:#a855f744;background:#a855f711}.tier-hero-chip.rarity-sr{border-color:#3b82f644;background:#3b82f611}.tier-legend{margin-top:1.5rem;padding:1rem;background:var(--bg-card);border-radius:10px;border:1px solid var(--border);margin-bottom:3rem}.tier-legend-item{display:flex;align-items:center;gap:.75rem;padding:.3rem 0;font-size:.85rem;color:var(--text-secondary)}.tier-legend-badge{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;font-weight:800;font-size:.85rem;color:var(--bg-primary);flex-shrink:0}.db-controls{margin-bottom:1rem}.db-search{width:100%;padding:.75rem 1rem;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;color:var(--text-primary);font-size:.95rem;margin-bottom:.75rem;transition:border-color .2s}.db-search:focus{outline:none;border-color:var(--accent)}.db-search::placeholder{color:var(--text-secondary);opacity:.7}.db-filters{display:flex;flex-wrap:wrap;gap:.5rem}.db-filters select{padding:.5rem .75rem;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;color:var(--text-primary);font-size:.85rem;cursor:pointer;flex:1 1;min-width:120px}.db-filters select:focus{outline:none;border-color:var(--accent)}.db-count{font-size:.85rem;margin-bottom:1rem}.db-count,.db-no-results{color:var(--text-secondary)}.db-no-results{text-align:center;padding:3rem 0;font-size:1rem}.hero-cards{display:flex;flex-direction:column;gap:.75rem;margin-bottom:3rem}.hero-card{background:var(--bg-card);border-radius:10px;overflow:hidden;transition:all .2s}.hero-card.rarity-border-ur{border:1px solid #f59e0b44}.hero-card.rarity-border-ssr{border:1px solid #a855f744}.hero-card.rarity-border-sr{border:1px solid #3b82f644}.hero-card.expanded{border-color:var(--accent)}.hero-card-header{width:100%;text-align:left;background:none;border:none;color:inherit;padding:1rem;cursor:pointer;display:flex;flex-direction:column;gap:.5rem}.hero-card-title{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.hero-name{font-size:1.1rem;font-weight:700;color:var(--text-primary)}.hero-title{font-size:.8rem;color:var(--text-secondary);font-style:italic}.hero-rarity{font-size:.75rem;font-weight:600;padding:.15rem .5rem;border-radius:4px}.hero-rarity.rarity-ur{background:#f59e0b22;color:#f59e0b}.hero-rarity.rarity-ssr{background:#a855f722;color:#a855f7}.hero-rarity.rarity-sr{background:#3b82f622;color:#3b82f6}.hero-card-tags{display:flex;gap:.4rem;flex-wrap:wrap}.hero-tag{font-size:.75rem;padding:.2rem .5rem;border-radius:4px;font-weight:500}.type-tag{background:#374151;color:var(--text-primary)}.role-tag{background:#1e3a5f;color:#93c5fd}.dmg-tag{background:#3b1f0b;color:#fdba74}.dmg-energy{background:#1f2b3b;color:#a78bfa}.dmg-physical{background:#3b1f0b;color:#fdba74}.promo-tag{background:#1a3a1a;color:#86efac;font-style:italic}.hero-card-tiers{display:flex;flex-wrap:wrap;gap:.35rem}.hero-tier-badge{font-size:.7rem;font-weight:700;padding:.15rem .45rem;border-radius:4px;border:1px solid;white-space:nowrap}.hero-card-body{padding:.75rem 1rem 1.25rem;display:flex;flex-direction:column;gap:1.25rem;border-top:1px solid var(--border)}.hero-card-body h4{font-size:.9rem;color:var(--accent);margin-bottom:.5rem;font-weight:700}.skill-list{display:flex;flex-direction:column;gap:.5rem}.skill-item{display:flex;gap:.5rem;font-size:.85rem;line-height:1.4}.skill-type{font-weight:700;color:var(--text-secondary);white-space:nowrap;min-width:85px;font-size:.75rem;padding-top:1px}.skill-type.auto-skill{color:#60a5fa}.skill-item.active-skill .skill-type{color:var(--accent)}.hero-placement p,.skill-text{color:var(--text-primary)}.hero-placement p{font-size:.9rem}.synergy-chips{display:flex;flex-wrap:wrap;gap:.4rem}.synergy-chip{padding:.3rem .65rem;border-radius:6px;font-size:.82rem;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);transition:all .15s}.synergy-chip:hover{border-color:var(--accent);transform:translateY(-1px)}.synergy-chip.rarity-ur{border-color:#f59e0b44;color:#f59e0b}.synergy-chip.rarity-ssr{border-color:#a855f744;color:#a855f7}.synergy-chip.rarity-sr{border-color:#3b82f644;color:#3b82f6}.hero-notes p{font-size:.9rem;color:var(--text-secondary);line-height:1.5}.squads-section{margin-bottom:3rem}.squads-intro{text-align:center;color:var(--text-secondary);font-size:.95rem;max-width:600px;margin:0 auto 2rem}.squad-card{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:1.25rem;margin-bottom:1rem}.squad-card h3{font-size:1.1rem;color:var(--accent);margin-bottom:.75rem}.squad-heroes{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.75rem}.squad-hero-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .8rem;border-radius:6px;font-size:.85rem;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);transition:all .15s}.squad-hero-chip:hover{border-color:var(--accent);transform:translateY(-1px)}.squad-hero-chip.rarity-ur{border-color:#f59e0b44;color:#f59e0b}.squad-hero-chip.rarity-ssr{border-color:#a855f744;color:#a855f7}.squad-hero-chip .chip-type-icon{font-size:.75rem}.squad-notes{font-size:.85rem;color:var(--text-secondary);line-height:1.5}@media (max-width:768px){.heroes-hero h1{font-size:1.5rem}.tier-row{flex-direction:column}.tier-label{flex-direction:row;gap:.5rem;min-width:unset;padding:.5rem .75rem}.tier-letter{font-size:1.2rem}.tier-heroes{padding:.5rem}.db-filters select{min-width:0}.hero-card-tiers{gap:.25rem}.hero-tier-badge{font-size:.65rem;padding:.1rem .35rem}.skill-item{flex-direction:column;gap:.15rem}.skill-type{min-width:unset}.type-advantage{font-size:.75rem}}