.hero-selector-root .dyn-hero-card{opacity:var(--hero-selector-card-opacity);border-color:rgba(255, 255, 255, var(--hero-selector-card-border-unselected-opacity));background-color:var(--hero-selector-card-bg);box-shadow:none;transition:opacity .2s,filter .2s,transform .2s,border-color .2s,box-shadow .2s}.hero-selector-root .deadlock-hero-list-container{--hero-panel-bg:#00000013;z-index:10;perspective:1400px;flex-shrink:0;width:clamp(240px,18vw,320px);height:fit-content;position:relative}.hero-selector-root .deadlock-hero-list-inner{background-color:var(--hero-panel-bg);transform-origin:100%;border:1px solid #0000008c;border-top-color:#ffffff24;border-left:2px solid #fff3;border-radius:10px;flex-direction:column;width:100%;height:fit-content;padding:clamp(8px,.8vw,12px);display:flex;position:relative;overflow:hidden;transform:perspective(1400px)rotateY(9deg)rotateX(1deg);box-shadow:8px 14px 40px #000000d9,-1px 0 6px #0000004d}.hero-selector-root .hero-sidebar-search-wrapper{flex-shrink:0;width:100%;margin-bottom:8px;position:relative}.hero-selector-root .hero-sidebar-search-box{width:100%;box-shadow:none;backdrop-filter:blur(8px);background:#ffffff17;border:none;border-radius:6px;align-items:center;padding:7px 10px;transition:all .2s;display:flex;position:relative}.hero-selector-root .hero-sidebar-search-box:hover{background:#ffffff24}.hero-selector-root .hero-sidebar-search-box:focus-within{background:#ffffff2e}.hero-selector-root .hero-sidebar-search-icon{color:#fff;opacity:.85;flex-shrink:0;width:15px;height:15px;margin-right:8px;transition:color .2s,opacity .2s}.hero-selector-root .hero-sidebar-search-box:focus-within .hero-sidebar-search-icon{color:rgba(var(--primary-rgb,196, 131, 42), 1);opacity:1}.hero-selector-root .hero-sidebar-search-input{letter-spacing:.01em;color:#fff;background:0 0;border:none;outline:none;width:100%;padding:0;font-size:13px;font-weight:600}.hero-selector-root .hero-sidebar-search-input::placeholder{letter-spacing:normal;text-transform:none;color:#fff;opacity:.85;font-size:13px;font-weight:500}.hero-selector-root .hero-sidebar-search-clear{color:#fff;cursor:pointer;background:#ffffff40;border:none;border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;width:16px;height:16px;margin-left:6px;padding:0;font-size:10px;line-height:1;transition:all .15s;display:inline-flex}.hero-selector-root .hero-sidebar-search-clear:hover{color:#fff;background:#ffffff73}.hero-selector-root .deadlock-hero-list-inner>.overflow-y-auto{position:relative;overflow:visible}.hero-selector-root .dyn-hero-card:hover{opacity:1!important;border-color:rgba(var(--primary-rgb,196, 131, 42), .5)!important}.hero-selector-root .dyn-hero-card-sel{opacity:1;border-color:rgba(var(--primary-rgb,196, 131, 42), var(--hero-selector-card-border-selected-opacity));background-color:var(--hero-selector-card-bg);box-shadow:0 0 var(--hero-selector-card-shadow-size) color-mix(in srgb, var(--hero-selector-card-shadow-color) var(--hero-selector-card-shadow-opacity), transparent)}.hero-selector-root [data-hero-card][data-search-state=dimmed]{pointer-events:none;opacity:.15!important;filter:grayscale(85%)brightness(.4)!important;transform:none!important}.hero-selector-root [data-hero-card][data-search-state=matched]{z-index:2;opacity:1!important;filter:brightness(1.15)!important;border-color:rgba(var(--primary-rgb,196, 131, 42), .9)!important;box-shadow:0 0 8px rgba(var(--primary-rgb,196, 131, 42), .6)!important;transform:none!important}.hero-selector-root .dyn-ability-icon{background-color:var(--hero-selector-ability-icon-bg);border-color:rgba(0, 0, 0, var(--hero-selector-ability-icon-border-opacity));padding:var(--hero-selector-ability-icon-padding)}.hero-selector-root .dyn-ability-icon:hover{background-color:color-mix(in srgb, var(--text-inverse) 10%, transparent);border-color:color-mix(in srgb, var(--text-inverse) 20%, transparent)}.pro-player-ability-icon{filter:brightness(0)invert()}.hero-selector-root .hero-matchup-action:hover{color:var(--matchup-action-hover-color)}.hero-selector-root .hero-main-content-borderless,.hero-selector-root .hero-main-content-borderless .border,.hero-selector-root .hero-main-content-borderless [class*=border-],.hero-selector-root .hero-main-content-borderless [class^=border],.hero-selector-root .hero-main-content-borderless [class*=\ border]{border-color:#0000!important}.hero-empty-arrow-left{animation:1.8s ease-in-out infinite hero-empty-arrow-left}.hero-empty-arrow-up{animation:1.8s ease-in-out infinite hero-empty-arrow-up}.animate-fade-in{animation:.8s ease-out forwards hero-selector-fade-in}@keyframes hero-empty-arrow-left{0%,to{opacity:.45;transform:translate(0,0)}50%{opacity:1;transform:translate(-10px)}}@keyframes hero-empty-arrow-up{0%,to{opacity:.45;transform:translate(0,0)}50%{opacity:1;transform:translateY(-10px)}}@keyframes hero-selector-fade-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
