*,:before,:after{box-sizing:border-box}body{color:#e8e8e8;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#0a0a13;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}#root{min-height:100vh}.compare-form{background:#1a1a2e;border:1px solid #2a2a4a;border-radius:12px;margin-bottom:2rem;padding:2rem}.form-players{align-items:center;gap:1.5rem;margin-bottom:1.5rem;display:flex}.player-input-group{flex-direction:column;flex:1;gap:.5rem;display:flex}.player-input-group label{text-transform:uppercase;letter-spacing:.05em;color:#8888a0;font-size:.75rem;font-weight:600}.player-input-group input,.player-input-group select{color:#e8e8e8;background:#0f0f1a;border:1px solid #2a2a4a;border-radius:8px;width:100%;padding:.625rem .75rem;font-family:inherit;font-size:.95rem;transition:border-color .2s}.player-input-group select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%238888a0' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;padding-right:2rem}.player-input-group select option{color:#e8e8e8;background:#0f0f1a;padding:.5rem}.player-input-group select optgroup{color:#8888a0;background:#13131f;font-style:normal;font-weight:600}.player-input-group input:focus,.player-input-group select:focus{border-color:#c89b3c;outline:none}.player-input-group input::placeholder{color:#555570}.vs-divider{color:#c89b3c;flex-shrink:0;padding-top:1.25rem;font-size:1.25rem;font-weight:700}.form-options{justify-content:space-between;align-items:flex-end;gap:1rem;display:flex}.sample-size label{text-transform:uppercase;letter-spacing:.05em;color:#8888a0;margin-bottom:.5rem;font-size:.75rem;font-weight:600;display:block}.segmented-control{background:#0f0f1a;border:1px solid #2a2a4a;border-radius:8px;display:flex;overflow:hidden}.segmented-control button{color:#8888a0;cursor:pointer;background:0 0;border:none;padding:.5rem 1rem;font-family:inherit;font-size:.875rem;transition:all .2s}.segmented-control button:not(:last-child){border-right:1px solid #2a2a4a}.segmented-control button.active{color:#0a0a13;background:#c89b3c;font-weight:600}.segmented-control button:hover:not(.active){color:#e8e8e8}.compare-btn{color:#0a0a13;cursor:pointer;background:#c89b3c;border:none;border-radius:8px;padding:.625rem 2rem;font-family:inherit;font-size:1rem;font-weight:700;transition:background .2s}.compare-btn:hover:not(:disabled){background:#ddb04a}.compare-btn:disabled{opacity:.6;cursor:not-allowed}@media (width<=768px){.form-players{flex-direction:column}.player-input-group{width:100%}.vs-divider{padding-top:0}.form-options{flex-direction:column;align-items:stretch}.sample-size,.segmented-control{width:100%}.segmented-control button{flex:1}.compare-btn{width:100%}}.player-card{background:#1a1a2e;border:1px solid #2a2a4a;border-radius:12px;flex:1;padding:1.25rem}.player-identity{flex-wrap:wrap;align-items:baseline;gap:.25rem;margin-bottom:.75rem;display:flex}.player-name{color:#e8e8e8;font-size:1.25rem;font-weight:700}.player-tag{color:#8888a0;font-size:.9rem}.player-region{text-transform:uppercase;color:#0ac8b9;background:#0ac8b91a;border-radius:4px;margin-left:.5rem;padding:.15rem .4rem;font-size:.7rem;font-weight:600}.player-rank{color:#8888a0;background:#8888a01a;border-radius:6px;margin-bottom:.75rem;padding:.3rem .6rem;font-size:.85rem;font-weight:700;display:inline-block}.player-rank.unranked{color:#666680;font-style:italic;font-weight:400}.player-rank.rank-iron{color:#8c8c8c;background:#8c8c8c1a}.player-rank.rank-bronze{color:#cd7f32;background:#cd7f321a}.player-rank.rank-silver{color:silver;background:#c0c0c01a}.player-rank.rank-gold{color:#c89b3c;background:#c89b3c1a}.player-rank.rank-platinum{color:#4eb5a0;background:#4eb5a01a}.player-rank.rank-emerald{color:#50c878;background:#50c8781a}.player-rank.rank-diamond{color:#b9f2ff;background:#b9f2ff1a}.player-rank.rank-master{color:#9d4dc5;background:#9d4dc51a}.player-rank.rank-grandmaster{color:#ef4444;background:#ef44441a}.player-rank.rank-challenger{color:khaki;background:#f0e68c26}.player-record{gap:.75rem;margin-bottom:.5rem;font-size:.95rem;display:flex}.player-record .wins{color:#2ecc71;font-weight:600}.player-record .losses{color:#e74c3c;font-weight:600}.player-record .winrate{color:#e8e8e8;font-weight:700}.winrate-bar{background:#e74c3c;border-radius:2px;height:4px;margin-bottom:1rem;overflow:hidden}.winrate-fill{background:#2ecc71;border-radius:2px;height:100%;transition:width .6s}.top-champions{flex-wrap:wrap;gap:.75rem;display:flex}.champion-badge{background:#0f0f1a;border-radius:8px;align-items:center;gap:.4rem;padding:.35rem .6rem;display:flex}.champion-icon{border-radius:50%;width:28px;height:28px}.champion-info{flex-direction:column;display:flex}.champion-info .champion-name{color:#e8e8e8;font-size:.75rem;font-weight:600}.champion-info .champion-stats{color:#8888a0;font-size:.65rem}.no-matches{color:#8888a0;font-size:.9rem;font-style:italic}.stat-row{border-bottom:1px solid #1a1a2e;grid-template-columns:1fr auto auto auto 1fr;align-items:center;gap:.75rem;padding:.5rem 0;display:grid}.stat-row:last-child{border-bottom:none}.stat-bar-container{background:#13131f;border-radius:2px;height:4px;overflow:hidden}.stat-bar-container.left{direction:rtl}.stat-bar{background:#3a3a5a;border-radius:2px;height:100%;transition:width .6s}.stat-bar.winner{background:#c89b3c}.stat-value{color:#8888a0;font-variant-numeric:tabular-nums;min-width:3.5rem;font-size:.95rem}.stat-value.left{text-align:right}.stat-value.right{text-align:left}.stat-value.winner{color:#c89b3c;font-weight:600}.stat-label{color:#666680;text-transform:uppercase;letter-spacing:.03em;text-align:center;white-space:nowrap;min-width:8rem;font-size:.8rem}@media (width<=768px){.stat-bar-container{display:none}.stat-row{grid-template-columns:auto auto auto;gap:.5rem}.stat-label{min-width:6rem;font-size:.7rem}}.comparison-table{animation:.4s fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.player-cards{gap:1.5rem;margin-bottom:1.5rem;display:flex}.stats-sections{flex-direction:column;gap:1rem;display:flex}.stats-section{background:#1a1a2e;border:1px solid #2a2a4a;border-radius:12px;padding:1rem 1.5rem}.section-title{text-transform:uppercase;letter-spacing:.08em;color:#555570;margin:0 0 .5rem;font-size:.7rem;font-weight:700}@media (width<=768px){.player-cards{flex-direction:column}.stats-section{padding:.75rem 1rem}}.loading-container{flex-direction:column;align-items:center;padding:3rem;display:flex}.loading-spinner{border:3px solid #2a2a4a;border-top-color:#c89b3c;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{color:#8888a0;margin-top:1rem;font-size:.9rem}.error-message{color:#e74c3c;background:#e74c3c1a;border:1px solid #e74c3c4d;border-radius:8px;align-items:center;gap:.75rem;padding:1rem 1.25rem;display:flex}.error-icon{color:#0a0a13;background:#e74c3c;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;font-size:.85rem;font-weight:700;display:flex}.error-message p{margin:0;font-size:.9rem}.app{min-height:100vh;padding:2rem 1rem}.app-header{text-align:center;margin-bottom:2rem}.logo{color:#e8e8e8;letter-spacing:-.02em;margin:0;font-size:2rem;font-weight:800}.logo-tld{color:#c89b3c}.tagline{color:#8888a0;margin:.25rem 0 0;font-size:.9rem}.app-main{max-width:960px;margin:0 auto}
