.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}}