.heroes-page{color:#1f2937;max-width:1100px;margin:0 auto;padding:12px;font:13px system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.section{background:#fff;border-radius:14px;margin-bottom:12px;padding:12px;box-shadow:0 2px 8px #0000000f}.section-title{margin-bottom:10px;font-size:14px;font-weight:600}.filter-row{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.filter-btn{cursor:pointer;background:#f8fafc;border:1px solid #0000;border-radius:999px;min-width:48px;padding:4px 6px;font-size:11px;font-weight:500;transition:all .15s}.filter-btn:hover{filter:brightness(.96)}.filter-btn.active{box-shadow:0 0 0 1px #ffffff59,0 0 8px #0000001f}.faction{--c-bg:#8b5cf6;--c-border:#8b5cf6;--c-text:#5b21b6;color:var(--c-text);background:#f3f0ff;border-color:#dcd7fe}.class{--c-bg:#14b8a6;--c-border:#14b8a6;--c-text:#065f73;color:var(--c-text);background:#ecfeff;border-color:#c7f0f4}.star{--c-bg:#f59e0b;--c-border:#f59e0b;--c-text:#92400e;color:var(--c-text);background:#fff7ed;border-color:#fde68a}.filter-btn.active{background:var(--c-bg);border-color:var(--c-border);color:#fff;box-shadow:0 0 0 1px color-mix(in srgb,var(--c-bg)60%,transparent),0 0 10px color-mix(in srgb,var(--c-bg)60%,transparent)}.hero-list{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.hero-card{text-align:center;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:14px;padding:10px 8px;transition:all .12s}.hero-card:hover{background:#f1f5f9;border-color:#6d6d6d;transform:translateY(-1px);box-shadow:0 0 2px #64748b59}.hero-card.selected{background:#e2e8f0;border-color:#999;box-shadow:0 0 2px #4755698c}.hero-name{color:#5a5a5a;font-size:14px;font-weight:700}.hero-card.selected .hero-name{color:#292929}.hero-meta{color:#64748b;font-size:11px}.hero-stars{color:#b45309;font-size:12px;font-weight:600}.hero-card.selected .hero-stars{color:#d97706;text-shadow:0 0 6px #f59e0b73}.stats-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;margin-bottom:14px;display:grid}.stat-btn{cursor:pointer;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;justify-content:space-between;align-items:center;padding:6px 10px;font-size:12px;transition:all .12s;display:flex}.stat-btn:hover{background:#f1f5f9;border-color:#c7d2fe}.stat-btn:active{transform:translateY(1px)}.stat-btn.active{background:#e0e7ff;border-color:#6366f1;box-shadow:0 0 0 2px #6366f159}.stat-name{color:#64748b}.stat-value{color:#1e293b;font-weight:600}.stat-btn.active .stat-name{color:#3730a3}.stat-btn.active .stat-value{color:#1e1b4b}.skills{margin-top:8px}.skill-block{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;margin-top:6px;padding:8px 10px}.skill-block.depth-1{background:#fff;border-left:3px solid #10b981;border-radius:4px;margin-left:12px}.skill-block.depth-2{background:#d1fae5;border-left:3px solid #059669;border-radius:4px;margin-left:24px}.skill-title{color:#064e3b;font-size:13px;font-weight:700}.skill-desc{font-size:11.5px;line-height:1.45}.skill-desc p{margin:6px 0}.skill-strong,.skill-highlight{font-weight:450;transition:all .15s}.skills.stats-active .skill-strong{background:#fb923c59;border-bottom:2px solid #fb923cd9}.skills.stats-active .skill-highlight{background:#a855f759;border-bottom:2px solid #a855f7d9}