.view-toggle{align-items:center;display:flex;gap:.625rem}.view-toggle-label{color:#4a5568;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}.view-toggle-buttons{gap:.375rem}.view-toggle-buttons,.vt-btn{align-items:center;display:flex}.vt-btn{background:linear-gradient(180deg,#1a2235,#0f1724);border:1px solid rgba(30,46,82,.5);color:#8b7a56;cursor:pointer;height:36px;justify-content:center;overflow:hidden;padding:0;position:relative;transform:skewX(-6deg);transition:background .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease;width:42px}.vt-btn svg{flex-shrink:0;opacity:.6;transform:skewX(6deg);transition:opacity .2s}.vt-btn:hover{background:linear-gradient(180deg,#1e2d42,#152238);border-color:rgba(139,122,86,.4);box-shadow:0 0 8px rgba(139,122,86,.1);color:#b8a472}.vt-btn:hover svg{opacity:1}.vt-btn--active{background:linear-gradient(180deg,#1a2a30,#0e1e24);border-color:rgba(92,158,173,.5);box-shadow:0 0 12px rgba(92,158,173,.15);color:#8b7a56}.vt-btn--active svg{opacity:1}.vt-btn-bar{background:linear-gradient(90deg,#5c9ead,#7ec8d8);border-radius:0 0 2px 2px;height:3px;left:0;position:absolute;right:0;top:0}.filter-bar-container{align-items:center;background-color:transparent;box-sizing:border-box;display:flex;gap:1rem;justify-content:space-between;padding-bottom:1rem;padding-top:1rem;width:100%}.filter-group{gap:.375rem}.filter-button,.filter-group{align-items:center;display:flex}.filter-button{background:linear-gradient(180deg,#1a2235,#0f1724);border:1px solid rgba(30,46,82,.5);border-radius:0;color:#4a5568;cursor:pointer;height:32px;justify-content:center;overflow:hidden;padding:0;position:relative;transform:skewX(-6deg);transition:background .25s ease,border-color .25s ease,color .25s ease,box-shadow .25s ease;width:36px}.filter-button:hover:not(:disabled){background:linear-gradient(180deg,#1e2d42,#152238);border-color:rgba(92,158,173,.4);box-shadow:0 0 8px rgba(92,158,173,.1)}.filter-button.active{background:linear-gradient(180deg,#1a3040,#0e2030);border-color:rgba(92,158,173,.5);box-shadow:0 0 12px rgba(92,158,173,.15)}.filter-button.active:before{background:linear-gradient(90deg,#5c9ead,#7ec8d8);border-radius:0 0 2px 2px;content:"";height:3px;left:0;position:absolute;right:0;top:0}.filter-button:disabled{cursor:not-allowed;opacity:.4}.role-button img{height:16px;opacity:.6;transform:skewX(6deg);transition:opacity .2s;width:16px}.filter-button.active .role-button img,.filter-button:hover:not(:disabled) .role-button img{opacity:1}.search-bar{position:relative}.search-bar input{background:linear-gradient(180deg,rgba(20,30,50,.8),rgba(12,20,36,.9));border:none;border-bottom:1px solid rgba(100,90,70,.2);border-radius:0;border-top:1px solid hsla(40,24%,51%,.3);color:#b8cce0;font-size:.8125rem;font-weight:500;letter-spacing:.02em;padding:.55rem 1rem .55rem 2.5rem;transform:skewX(-6deg);transition:border-color .2s ease,box-shadow .2s ease,width .2s ease;width:200px}.search-bar input:focus{border-bottom-color:rgba(92,158,173,.3);border-top-color:rgba(92,158,173,.5);box-shadow:0 0 8px rgba(92,158,173,.15);outline:none;width:240px}.search-bar input::placeholder{color:#4a5568;font-weight:400}.search-bar-icon{color:#4a5568;left:.85rem;opacity:.8;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%) skewX(-6deg)}.filter-bar-right{gap:1rem}.filter-bar-right,.patch-label{align-items:center;display:flex}.patch-label{background:linear-gradient(180deg,rgba(157,77,187,.25),rgba(120,50,160,.15));border:none;border-bottom:1px solid rgba(120,60,160,.2);border-radius:0;border-top:1px solid rgba(180,120,220,.4);box-shadow:none;color:#d9a1f0;font-size:.6875rem;font-weight:600;gap:6px;height:fit-content;justify-content:center;letter-spacing:.04em;margin-left:10px;padding:6px 16px;transform:skewX(-6deg);white-space:nowrap}.patch-label-emblem{height:20px;object-fit:contain;transform:skewX(6deg);width:20px}.patch-label-info{align-items:center;background:rgba(180,120,220,.25);border-radius:50%;color:#c084d8;cursor:help;display:inline-flex;flex-shrink:0;font-size:9px;font-weight:700;height:14px;justify-content:center;line-height:1;margin-left:2px;position:relative;transform:skewX(6deg);width:14px}.patch-label-info:hover{background:rgba(180,120,220,.4);color:#e0b0f0}.patch-label-tooltip{background:#1a1f2e;border:1px solid rgba(180,120,220,.3);border-radius:6px;bottom:calc(100% + 8px);box-shadow:0 4px 12px rgba(0,0,0,.4);color:#c8d6e5;display:none;font-size:11px;font-weight:400;letter-spacing:.01em;line-height:1.45;padding:8px 10px;pointer-events:none;position:absolute;right:-8px;transform:skewX(-6deg);white-space:normal;width:240px;z-index:100}.patch-label-tooltip:after{border:5px solid transparent;border-top-color:rgba(180,120,220,.3);content:"";position:absolute;right:14px;top:100%}.patch-label-info:hover .patch-label-tooltip{display:block}@media (max-width:768px){.filter-bar-container{gap:12px;padding:8px}.filter-button{border-radius:.375rem;height:32px;transform:none;width:32px}.role-button img{height:18px;transform:none;width:18px}.search-bar input{border:1px solid rgba(30,46,82,.6);border-radius:9999px;font-size:12px;transform:none;width:100px}.search-bar-icon{transform:translateY(-50%)}.patch-label{border:1px solid rgba(157,77,187,.5);border-radius:9999px}.patch-label,.patch-label-emblem{transform:none}.rank-button{display:none}}.amazon-affiliate-links-container{width:15.625rem}.amazon-affiliate-links-container.left{margin-left:1.25rem;margin-right:.625rem}.amazon-affiliate-links-container.right{margin-left:.625rem;margin-right:1.25rem}.lol-matchups-net-is-reader-supported-we-may-earn-a-commission-when-you-buy-through-links-on-this-page{color:var(--color-text-secondary,#b8cce0);font-size:.75rem;margin-bottom:10px;text-align:center}@media (max-width:768px){.amazon-affiliate-links-container{display:none}}.counters-container{display:flex;flex-wrap:nowrap;gap:16px;justify-content:space-between;min-width:1000px;overflow-x:auto;padding:16px 16px 16px 0}.counter-column{background-color:rgba(26,32,53,.7);display:flex;flex:1 1 0;flex-direction:column;min-height:500px;padding:0 0 8px}.counter-header{align-items:center;color:#fff;display:flex;font-size:.75rem;font-weight:700;gap:8px;padding:0 8px 8px;position:relative;user-select:none}.counter-header-line{height:1.2em;margin:0;width:3px}.counter-description{color:#a0b3d6;font-size:.7rem;height:50px;line-height:1.5;margin-top:0;padding:0 8px}.counter-list{flex-grow:1;list-style:none;margin:0;padding:0 0 8px}.counter-item{align-items:center;background-color:#1a2035;border-radius:6px;color:#ddd;display:flex;justify-content:space-between;margin-bottom:6px;padding:6px 8px;user-select:none}.counter-champion-icon{border-radius:4px;flex-shrink:0;height:38px;object-fit:cover;width:38px}.counter-champion-details{flex-grow:1;padding-left:8px}.counter-champion-name{font-size:.9rem;font-weight:600}.counter-bar-container{background-color:#1b2a48;border-radius:4px;height:8px;margin-top:4px;overflow:hidden;width:100%}.counter-bar{border-radius:4px;height:100%}.counter-stats{font-size:.9rem;font-weight:600;text-align:right;width:100px}.counter-games-played{color:#a0b3d6;font-size:.8rem}@media (max-width:768px){.counters-container{flex-direction:column;min-width:100%;padding:0}.counter-column{width:100%}.counter-list{max-height:25rem;overflow-y:auto}}.global-tip-notification{animation:globalTipSlideIn .3s ease-out}@keyframes globalTipSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.global-tip-close{background:none;border:none;color:var(--color-text-muted,#a0aec0);cursor:pointer;font-size:14px;line-height:1;padding:2px 4px;position:absolute;right:8px;top:8px}.global-tip-close:hover,.global-tip-snippet{color:var(--color-text-primary,#f0f4f8)}.global-tip-snippet{font-size:13px;line-height:1.4;margin:0 0 8px;padding-right:16px}.global-tip-meta{align-items:center;display:flex;font-size:11px;justify-content:space-between}.global-tip-user{color:var(--color-accent,#ffc107)}.global-tip-matchup{color:var(--color-text-muted,#a0aec0)}@media (max-width:767px){.global-tip-notification{display:none!important}}.global-tip-dismissing{animation:globalTipFadeOut .3s ease-in forwards}@keyframes globalTipFadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(10px)}}.error-boundary-container{align-items:center;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;justify-content:center;min-height:100vh;padding:20px}.error-boundary-card{background:#0f1419;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.3);max-width:600px;padding:40px;text-align:center;width:100%}.error-boundary-icon{color:#ef4444;display:flex;justify-content:center;margin-bottom:24px}.error-boundary-title{color:#fff;font-size:28px;font-weight:600;margin:0 0 16px}.error-boundary-message{color:#9ca3af;font-size:16px;line-height:1.6;margin:0 0 32px}.error-boundary-details{background:#1a1f2e;border:1px solid #2d3748;border-radius:8px;margin:24px 0;padding:16px;text-align:left}.error-boundary-details summary{color:#9ca3af;cursor:pointer;font-size:14px;font-weight:500;user-select:none}.error-boundary-details summary:hover{color:#fff}.error-boundary-stack{color:#ef4444;font-family:Courier New,monospace;font-size:12px;line-height:1.5;margin:12px 0 0;overflow-x:auto;white-space:pre-wrap;word-break:break-word}.error-boundary-actions{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.error-boundary-btn{border:none;border-radius:8px;cursor:pointer;font-size:16px;font-weight:600;padding:12px 24px;transition:all .2s ease}.error-boundary-btn-primary{background:#3b82f6;color:#fff}.error-boundary-btn-primary:hover{background:#2563eb;box-shadow:0 4px 12px rgba(59,130,246,.4);transform:translateY(-2px)}.error-boundary-btn-secondary{background:#374151;color:#fff}.error-boundary-btn-secondary:hover{background:#4b5563;transform:translateY(-2px)}.error-boundary-btn:active{transform:translateY(0)}