:root{color-scheme:light}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:linear-gradient(135deg,#1e1b4b,#312e81,#4c1d95);color:#e0e7ff;min-height:100vh}.title-card{text-align:center;padding:40px 24px;background:linear-gradient(135deg,#1e1b4bf2,#312e81e6);border-radius:0 0 32px 32px;box-shadow:0 8px 32px #a855f766;border-bottom:3px solid #a855f7}.title-card h1{font-size:clamp(2.5rem,6vw,4rem);font-weight:900;background:linear-gradient(135deg,#fbbf24,#f59e0b,#d97706);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:3px;text-transform:uppercase;margin-bottom:12px;text-shadow:0 4px 16px rgba(251,191,36,.6)}.title-card p{font-size:16px;opacity:.9;letter-spacing:2px;color:#fbbf24;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.5)}.tabs{display:flex;justify-content:center;gap:12px;padding:24px;background:#1e1b4b99;backdrop-filter:blur(10px);border-bottom:2px solid rgba(168,85,247,.3)}.tab{padding:14px 40px;background:#312e81cc;border:2px solid rgba(168,85,247,.4);border-radius:20px;cursor:pointer;font-weight:700;transition:all .3s;box-shadow:0 2px 8px #0000004d;color:#c4b5fd}.tab:hover{background:#4c1d95e6;transform:translateY(-2px);box-shadow:0 4px 12px #a855f780;color:#e9d5ff}.tab.active{background:linear-gradient(135deg,#a855f7,#7c3aed);color:#fff;border-color:#a855f7;box-shadow:0 6px 20px #a855f799}.tab-content{display:none;padding:32px;max-width:1400px;margin:0 auto}.tab-content.active{display:block}button,select,input{background:#312e81e6;color:#e0e7ff;border:2px solid rgba(168,85,247,.4);border-radius:16px;padding:12px 20px;cursor:pointer;font:inherit;transition:all .2s}button:hover{background:#4c1d95f2;border-color:#a855f7;transform:translateY(-1px);box-shadow:0 4px 8px #a855f74d}button.primary{background:linear-gradient(135deg,gold,gold);color:#1e1b4b;border:none;font-weight:700;box-shadow:0 4px 12px #ffd70080}button.primary:hover{transform:translateY(-2px);box-shadow:0 6px 16px #ffd700b3}button.primary:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}.card{border:3px solid rgba(168,85,247,.3);border-radius:20px;overflow:hidden;background:#312e81e6;cursor:pointer;transition:all .3s;box-shadow:0 4px 12px #0006}.card:hover{transform:translateY(-6px);border-color:#fbbf24;box-shadow:0 12px 32px #fbbf2499}.card img{width:100%;aspect-ratio:1;object-fit:cover}.card-meta{padding:16px;background:#1e1b4bb3}.card-name{font-weight:800;font-size:18px;margin-bottom:6px;color:#fbbf24}.card-actions{padding:12px;display:flex;gap:8px;background:#1e1b4be6;border-top:2px solid rgba(168,85,247,.2)}.card-actions button{flex:1;padding:8px;font-size:12px}.card.active-hero{border-color:#10b981;box-shadow:0 0 20px #10b98199}.card.active-hero:before{content:"✓ ACTIVE";position:absolute;top:8px;right:8px;background:#10b981;color:#fff;padding:4px 8px;border-radius:4px;font-size:10px;font-weight:700;z-index:10}.card-info{font-size:13px;opacity:.8;color:#c4b5fd;font-weight:600}.hero-detail{display:grid;grid-template-columns:300px 1fr;gap:24px}@media (max-width: 768px){.hero-detail{grid-template-columns:1fr}}.hero-image{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;border:3px solid rgba(251,191,36,.5);box-shadow:0 4px 16px #00000080}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:16px 0}.stat-box{background:#312e8199;padding:12px;border-radius:8px;border:2px solid rgba(168,85,247,.3)}.stat-label{font-size:11px;opacity:.7;text-transform:uppercase;letter-spacing:1px;color:#c4b5fd}.stat-value{font-size:24px;font-weight:700;color:#fbbf24}.section{background:#1e1b4bcc;border:2px solid rgba(168,85,247,.4);border-radius:24px;padding:24px;margin-bottom:24px;box-shadow:0 4px 16px #00000080}.section-title{font-size:22px;font-weight:800;margin-bottom:16px;color:#fbbf24;text-shadow:0 2px 4px rgba(0,0,0,.5)}.chips{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0}.chip{padding:10px 18px;border-radius:999px;background:#312e81cc;cursor:pointer;border:2px solid rgba(168,85,247,.4);font-size:14px;transition:all .3s;font-weight:600;color:#e0e7ff}.chip:hover{background:#4c1d95e6;border-color:#a855f7;transform:scale(1.05);box-shadow:0 4px 8px #a855f766}.chip.selected{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e1b4b;border-color:#fbbf24;transform:scale(1.05);box-shadow:0 4px 12px #fbbf2499}.fight-select{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.fight-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;max-height:400px;overflow-y:auto;padding:8px;background:#1e1b4b80;border-radius:16px;border:2px solid rgba(168,85,247,.3)}.fight-gallery .card{border-width:3px}.fight-gallery .card.selected-fighter{border-color:#fbbf24;box-shadow:0 0 0 3px #fbbf2480}.favor-bar-container{background:#1e1b4bb3;border-radius:999px;height:40px;position:relative;overflow:hidden;border:3px solid rgba(251,191,36,.5)}.favor-bar-fill{height:100%;transition:all .5s;display:flex;align-items:center;justify-content:space-between;padding:0 16px;font-weight:800;font-size:14px}.narrative{background:#1e1b4bd9;padding:24px;border-radius:20px;border:3px solid #fbbf24;line-height:2;font-size:15px;box-shadow:0 8px 24px #00000080}.narrative-line{margin-bottom:12px;padding:8px 12px;background:#312e8199;border-radius:12px;border-left:4px solid #fbbf24;font-weight:500;color:#e0e7ff}.winner-announce{text-align:center;padding:20px;margin-top:16px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:20px;font-size:24px;font-weight:900;box-shadow:0 8px 24px #10b98166}.exp-reward{text-align:center;padding:16px;margin-top:12px;background:#8b5cf64d;border:2px solid #a78bfa;border-radius:16px;font-weight:700;color:#e9d5ff}.back-btn{margin-bottom:16px}.fight-history{max-height:300px;overflow-y:auto}.fight-record{background:#ffffff0d;padding:12px;margin-bottom:8px;border-radius:8px;border-left:3px solid #10b981}.fight-record.loss{border-left-color:#ef4444}.category-label{display:block;font-size:12px;font-weight:700;margin-bottom:6px;color:#fbbf24;text-transform:uppercase;letter-spacing:1px;text-shadow:0 2px 4px rgba(0,0,0,.5)}.hidden{display:none}.preview-overlay{position:absolute;inset:0;background:#000000b3;display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px;backdrop-filter:blur(4px)}.preview-overlay.active{display:flex}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.8}}.abilities-grid{display:grid;gap:12px}.ability-card{background:#312e81cc;border:2px solid rgba(168,85,247,.4);border-radius:16px;padding:12px;display:grid;grid-template-columns:60px 1fr;gap:12px;align-items:center;transition:all .3s}.ability-card:hover{border-color:#a855f7;transform:translate(4px);box-shadow:0 4px 12px #a855f766}.ability-card.ultimate{border:3px solid #fbbf24;background:linear-gradient(135deg,#fbbf2433,#f59e0b33);box-shadow:0 0 20px #fbbf244d}.ability-card.ultimate:hover{box-shadow:0 0 30px #fbbf2480}.ability-icon{width:60px;height:60px;border-radius:12px;object-fit:cover;border:2px solid #a855f7}.ability-card.ultimate .ability-icon{border:3px solid #fbbf24;box-shadow:0 0 15px #fbbf2480}.ability-name{font-weight:800;font-size:14px;color:#e0e7ff;margin-bottom:4px}.ability-card.ultimate .ability-name{color:#fbbf24;font-size:15px}.ability-desc{font-size:11px;color:#c4b5fd;line-height:1.4;margin-bottom:4px}.ability-effect{font-size:10px;color:#f87171;font-weight:700}.ability-card.ultimate .ability-effect{color:#fbbf24}