.thread-picker-wrap{--tp-gap: var(--thread-picker-gap, 4rem);--tp-scale: var(--thread-picker-photo-scale, 1);--tp-column: calc((var(--thread-picker-max-width, 67.5rem) - var(--tp-gap)) / 2);--tp-photo: calc(var(--tp-column) * var(--tp-scale));width:100%;max-width:calc(var(--tp-photo) + var(--tp-gap) + var(--tp-column));margin-inline:auto}@media screen and (min-width:750px){.thread-picker-wrap--fit{--tp-photo: max( var(--tp-column), min(calc(var(--tp-column) * var(--tp-scale)), calc((100vh - 10rem) * var(--thread-picker-ratio-n, .8))) )}}@supports (height: 100svh){@media screen and (min-width:750px){.thread-picker-wrap--fit{--tp-photo: max( var(--tp-column), min(calc(var(--tp-column) * var(--tp-scale)), calc((100svh - 10rem) * var(--thread-picker-ratio-n, .8))) )}}}thread-picker{display:grid;grid-template-columns:minmax(0,var(--tp-photo, 1fr)) minmax(0,var(--tp-column, 1fr));gap:var(--tp-gap, 4rem);align-items:start;width:100%}.thread-picker__intro--mobile{display:none}.thread-picker__intro--center{text-align:center}.thread-picker__intro--left{text-align:left}.thread-picker__title{margin:0;font-family:var(--font-heading--family);font-size:2.5rem;font-weight:var(--font-heading--weight, 400);line-height:normal;letter-spacing:normal;text-transform:none;text-wrap:pretty;color:inherit}@media screen and (min-width:750px){.thread-picker__intro--desktop .thread-picker__title{padding-top:2.5rem}}.thread-picker__intro-text{max-width:46rem;margin:1rem auto 0}.thread-picker__intro-text,.thread-picker__intro-text p{font-family:var(--font-heading--family);font-size:1rem;font-weight:var(--font-heading--weight, 400);line-height:var(--line-height--body-normal, 1.6);letter-spacing:var(--letter-spacing--body-normal, 0em);text-transform:none;text-wrap:pretty}.thread-picker__title+.thread-picker__intro-text{margin-top:1rem}.thread-picker__intro-text:first-child{margin-top:0}.thread-picker__intro--left .thread-picker__intro-text{margin-inline:0}.thread-picker__intro-text p{margin:0 0 .75em}.thread-picker__intro-text>:last-child{margin-bottom:0}.thread-picker__media{position:sticky;top:24px}.thread-picker__photo{position:relative;aspect-ratio:var(--thread-picker-ratio, 4 / 5);overflow:hidden;background:rgb(var(--color-foreground-rgb, 0 0 0) / .04)}.thread-picker__photo img{display:block;width:100%;height:100%;object-fit:cover;transition:opacity .2s ease}.thread-picker__photo.is-changing img{opacity:0}.thread-picker__caption{min-height:1.4em;margin:14px 0 0;text-align:center;font-size:1rem}.thread-picker__soon{margin:14px 0 0;font-size:.875rem;opacity:.7}.thread-picker__soon[hidden]{display:none}.thread-picker__controls{display:flex;flex-direction:column;gap:2.5rem}.thread-picker__divider{height:0;margin:0;padding:0;border:0;border-top:1px solid rgb(var(--color-foreground-rgb, 0 0 0) / .1)}.thread-picker__label{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:.875rem;margin:0 0 14px}.thread-picker__heading{margin:0;font-family:var(--font-heading--family);font-size:1.5rem;font-weight:var(--font-heading--weight, 400);line-height:1.2;letter-spacing:normal;text-transform:none;color:inherit}.thread-picker__selected{font-size:1rem;line-height:1.2;text-transform:capitalize;color:var(--color-foreground-subdued, rgb(var(--color-foreground-rgb, 0 0 0) / .8))}.thread-picker__selected:empty,.thread-picker--names-below .thread-picker__selected{display:none}.thread-picker__pouches,.thread-picker__threads{display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px var(--tp-swatch-gap, 12px);margin:0;padding:0;list-style:none}.thread-picker__pouch,.thread-picker__thread{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:center;cursor:pointer}.thread-picker__pouch:after,.thread-picker__thread:after{content:"";position:absolute;top:-5px;right:-5px;bottom:-5px;left:-5px}.thread-picker__swatch{position:relative;display:block;box-sizing:border-box;width:var(--tp-swatch, 24px);height:var(--tp-swatch, 24px);border:1px solid rgb(0 0 0 / .2);border-radius:var(--tp-radius, 0);background:var(--swatch, transparent);overflow:hidden;transition:box-shadow .15s ease}.thread-picker__pouch-name,.thread-picker__thread-name{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.thread-picker--names-below .thread-picker__pouches,.thread-picker--names-below .thread-picker__threads{column-gap:calc(var(--tp-swatch-gap, 12px) / 2)}.thread-picker--names-below .thread-picker__pouch,.thread-picker--names-below .thread-picker__thread{min-width:3.25rem}.thread-picker--names-below .thread-picker__pouch-name,.thread-picker--names-below .thread-picker__thread-name{position:static;width:auto;height:auto;margin:0;overflow:visible;clip-path:none;white-space:normal;font-size:.75rem;line-height:1.25}.thread-picker__pouch-name{text-transform:capitalize}.thread-picker__pouch:not([aria-pressed=true]):hover .thread-picker__swatch,.thread-picker__thread:not([aria-disabled=true],[aria-pressed=true]):hover .thread-picker__swatch{box-shadow:0 0 0 2px var(--thread-picker-bg, var(--color-background, #ffffff)),0 0 0 3.5px #00000059}.thread-picker__pouch[aria-pressed=true] .thread-picker__swatch,.thread-picker__thread[aria-pressed=true] .thread-picker__swatch{box-shadow:0 0 0 2px var(--thread-picker-bg, var(--color-background, #ffffff)),0 0 0 3.5px #000}.thread-picker__pouch[aria-pressed=true] .thread-picker__pouch-name,.thread-picker__thread[aria-pressed=true] .thread-picker__thread-name{font-weight:700;color:#000}.thread-picker__thread[aria-disabled=true]{cursor:not-allowed;opacity:.4}.thread-picker__thread[aria-disabled=true] .thread-picker__swatch:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top right,transparent calc(50% - 1.5px),#ffffff calc(50% - 1.5px),#ffffff calc(50% - .5px),#000000 calc(50% - .5px),#000000 calc(50% + .5px),#ffffff calc(50% + .5px),#ffffff calc(50% + 1.5px),transparent calc(50% + 1.5px))}.thread-picker__pouch:focus-visible,.thread-picker__thread:focus-visible{outline:2px solid #000000;outline-offset:6px}@media screen and (max-width:749px){.thread-picker-wrap{max-width:none}thread-picker{display:block}.thread-picker__intro--desktop{display:none}.thread-picker__intro--mobile{display:block;margin-bottom:1.5rem}.thread-picker__title{font-size:1.75rem}.thread-picker__media{position:sticky;top:0;z-index:var(--layer-raised, 2);padding-block:8px 4px;background:var(--thread-picker-bg, var(--color-background, #ffffff))}body:has(header-component[sticky]) .thread-picker__media{top:var(--header-height, 0px)}.thread-picker__photo{width:min(100%,calc(42vh * var(--thread-picker-ratio-n, .8)));width:min(100%,calc(42svh * var(--thread-picker-ratio-n, .8)));margin-inline:auto}.thread-picker__caption{margin-top:8px;font-size:.9375rem}.thread-picker__controls{gap:1.75rem;margin-top:1.25rem}.thread-picker__heading{font-size:1.25rem}.thread-picker__selected{font-size:.9375rem}}@media(prefers-reduced-motion:reduce){.thread-picker__photo img,.thread-picker__swatch{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/thread-picker.css.map */