[data-v-ee4d8996],[data-v-ee4d8996]:after,[data-v-ee4d8996]:before{box-sizing:border-box}button[data-v-ee4d8996]{background:#000;border:2px solid #000;border-radius:8px;color:#fff;cursor:pointer;display:grid;height:48px;letter-spacing:.25px;outline-color:#00e930;outline-offset:.25rem;padding:0;position:relative}button[data-v-ee4d8996]:is(:hover,:focus-visible){--active:1}button[data-v-ee4d8996]:active{--pressed:1}button>span[data-v-ee4d8996]:first-of-type{border-radius:8px;height:100%;inset:0;position:absolute;scale:calc(1 - var(--pressed, 0)*.05);transition:scale .1s;width:100%}button:is(:hover,:focus-visible) .container[data-v-ee4d8996]{width:100%}.container[data-v-ee4d8996]{--mask-image:url(https://assets.codepen.io/605876/chev-mask_1.png);--spread:24px;--size:28px;background:#00e930;border-radius:6px;box-shadow:0 10px 10px -5px #00000080;height:100%;left:0;transition:width .25s;width:58px}.container[data-v-ee4d8996],.primary[data-v-ee4d8996]{container-type:inline-size;position:absolute}.primary[data-v-ee4d8996]{background:#00000026;content:"";inset:0;-webkit-mask:var(--mask-image) 50% 50% /var(--size) var(--size) no-repeat;mask:var(--mask-image) 50% 50% /var(--size) var(--size) no-repeat;z-index:2}:where(.primary[data-v-ee4d8996],.complimentary[data-v-ee4d8996]):after{--distance: calc(100cqi + 100%) ;animation:fly-by-ee4d8996 calc((2 - var(--active, 0))*1s) infinite linear;aspect-ratio:1;background:radial-gradient(#000,transparent);content:"";height:calc(var(--size)*4);left:0;position:absolute;top:50%;translate:-50% -50%}@keyframes fly-by-ee4d8996{0%{translate:-100% -50%}to{translate:var(--distance) -50%}}.complimentary[data-v-ee4d8996]{background:#00000026;content:"";inset:0;-webkit-mask:var(--mask-image) calc(50% - var(--spread)*1) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% - var(--spread)*2) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% - var(--spread)*3) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% + var(--spread)*1) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% + var(--spread)*2) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% + var(--spread)*3) 50% /var(--size) var(--size) no-repeat;mask:var(--mask-image) calc(50% - var(--spread)*1) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% - var(--spread)*2) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% - var(--spread)*3) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% + var(--spread)*1) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% + var(--spread)*2) 50% /var(--size) var(--size) no-repeat,var(--mask-image) calc(50% + var(--spread)*3) 50% /var(--size) var(--size) no-repeat;opacity:var(--active,0);position:absolute;transition:opacity .25s}button>span[data-v-ee4d8996]:nth-of-type(2){display:grid;height:100%;padding:0 1.1rem 0 calc(58px + 1.1rem);place-items:center}