.tn-pills__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}.tn-pill{--cat-ink: color-mix(in oklab, var(--cat), #000 45%);--cat-tint: color-mix(in srgb, var(--cat) 12%, #fff);--cat-fill: var(--cat-ink);--cat-on-fill: #fff;position:relative;display:inline-flex;align-items:center;gap:9px;padding:9px 16px 9px 13px;border-radius:999px;text-decoration:none;color:var(--cat-ink);background:var(--cat-tint);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cat) 20%,transparent),0 0 0 0 transparent;transition:box-shadow .2s cubic-bezier(.2,.7,.2,1),transform .2s cubic-bezier(.2,.7,.2,1)}@supports (color: oklch(from red l c h)){.tn-pill{--cat-ink: oklch(from var(--cat) min(l, .48) c h);--cat-fill: oklch( from var(--cat) calc(clamp(0, (l - .6) * 1000000, 1)*max(l, .72) + clamp(0, (.6 - l) * 1000000, 1)*min(l, .5)) min(c, .2) h );--cat-on-fill: oklch( from var(--cat) calc(1 - (clamp(0, (l - .6) * 1000000, 1)*.75)) calc(min(c, .06)*clamp(0, (l - .6) * 1000000, 1)) h )}}.tn-pill:hover:after{content:"";position:absolute;top:0;right:0;bottom:-2px;left:0;border-radius:inherit}.tn-pill svg{width:18px;height:18px;flex:none;stroke:currentcolor;stroke-width:1.5;fill:none;stroke-linecap:round;stroke-linejoin:round}.tn-pill svg [fill=currentColor]{stroke:none}.tn-pills .tn-pill__lab{font-weight:600;font-size:14px;line-height:1;letter-spacing:-.003em;color:inherit;white-space:nowrap}.tn-pill:hover,.tn-pill:focus-visible{color:var(--cat-on-fill);background:var(--cat-fill);transform:translateY(-2px);box-shadow:inset 0 0 0 1px transparent,0 6px 16px color-mix(in srgb,var(--cat-fill) 35%,transparent)}.tn-pill:active{transform:translateY(0);box-shadow:inset 0 0 0 1px transparent,0 2px 6px color-mix(in srgb,var(--cat-fill) 30%,transparent)}.tn-pill:focus-visible{outline:2px solid var(--cat-ink);outline-offset:2px}@media(forced-colors:active){.tn-pill{border:1px solid CanvasText}.tn-pill:focus-visible{outline-color:CanvasText}}@media(max-width:749px){.tn-pills__list{flex-wrap:nowrap;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:none;padding:4px 4px 16px;margin:-4px -4px -16px;scroll-padding-inline:4px}.tn-pills__list::-webkit-scrollbar{display:none}.tn-pill{flex:none;scroll-snap-align:start}}@media(prefers-reduced-motion:reduce){.tn-pill{transition:none}.tn-pill:hover,.tn-pill:focus-visible{transform:none}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/component-collection-pills.css.map */