.fabric-lab{background:#e8e4da;overflow:hidden;scroll-margin-top:20px}.fabric-heading{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:35px}.fabric-heading h2{font-size:clamp(36px,4.2vw,59px);line-height:1.12;letter-spacing:-2px}.fabric-heading>p{max-width:360px;font-size:13px;color:#687164;line-height:1.9;margin-bottom:8px}.fabric-tabs{display:flex;gap:30px;border-bottom:1px solid #bfc5b6;margin-bottom:45px}.fabric-tabs button{border:0;border-bottom:3px solid transparent;background:none;padding:15px 0;color:#72806b;font:11px Manrope,Arial;letter-spacing:.5px;cursor:pointer}.fabric-tabs button[aria-pressed=true]{border-color:#ac7856;color:#263b32}.fabric-workbench{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:start}.swatch-stage{position:relative;min-height:580px;perspective:1100px;padding:18px 30px 85px}.swatch-back{position:absolute;top:38px;left:45px;width:calc(100% - 80px);height:405px;background:#c4c6b7;box-shadow:0 10px 25px #17231918;border:1px solid #a7afa0}.swatch-back-one{transform:rotate(8deg)}.swatch-back-two{transform:rotate(2deg);background:#d0c2ab}.fabric-sample{position:relative;z-index:2;transform:rotate(-4deg);transform-origin:50% 15px;transition:transform .4s;box-shadow:0 25px 35px #24362526;background:#f2eee4;padding:0 0 14px}.fabric-sample:before{content:'';position:absolute;top:15px;left:calc(50% - 4px);width:8px;height:8px;background:#5b6256;border-radius:50%;box-shadow:inset 1px 1px 2px #0006;z-index:3}.fabric-sample-label{display:flex;justify-content:space-between;align-items:center;height:58px;padding:12px 18px 0;font-size:8px;letter-spacing:1.5px;color:#74816d}.fabric-sample-label span:last-child{font-size:6px;letter-spacing:1px}.fabric-texture{height:330px;margin:0 13px;clip-path:polygon(0 0,100% 0,100% 96%,98% 98%,96% 96%,94% 98%,92% 96%,90% 98%,88% 96%,86% 98%,84% 96%,82% 98%,80% 96%,78% 98%,76% 96%,74% 98%,72% 96%,70% 98%,68% 96%,66% 98%,64% 96%,62% 98%,60% 96%,58% 98%,56% 96%,54% 98%,52% 96%,50% 98%,48% 96%,46% 98%,44% 96%,42% 98%,40% 96%,38% 98%,36% 96%,34% 98%,32% 96%,30% 98%,28% 96%,26% 98%,24% 96%,22% 98%,20% 96%,18% 98%,16% 96%,14% 98%,12% 96%,10% 98%,8% 96%,6% 98%,4% 96%,2% 98%,0 96%)}.fabric-texture svg{width:100%;height:100%;display:block}.fabric-sample-foot{display:flex;justify-content:space-between;align-items:center;padding:13px 18px 2px;font-size:14px}.fabric-sample-foot small{font-size:7px;color:#7a836e;letter-spacing:1px}.fabric-zoom{position:absolute;z-index:5;bottom:65px;left:50%;transform:translateX(-50%);border:1px solid #b1b9a7;background:#f2eee4cc;padding:11px 18px;font-size:10px;cursor:pointer;white-space:nowrap}.fabric-visual-note{position:absolute;bottom:5px;left:0;right:0;text-align:center;color:#7b8372;font-size:9px;line-height:1.7}.fabric-options{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:25px}.fabric-options button{font:10px Manrope,Arial;padding:11px 13px;border:1px solid #bac3b1;background:transparent;cursor:pointer;color:#52634b}.fabric-options button[aria-pressed=true]{background:#213e36;border-color:#213e36;color:#f0eee3}.fabric-info h3{font-size:34px;font-weight:500;letter-spacing:-1px;line-height:1.2;margin:10px 0 16px}.fabric-info .eyebrow{font-size:8px;margin:0;color:#9f704e}.fabric-description{color:#66745d;font-size:13px;line-height:1.95}.fabric-features{padding:0;list-style:none;margin:22px 0}.fabric-features li{display:flex;gap:14px;align-items:baseline;border-top:1px solid #c4ccbc;padding:12px 0;font-size:11px;color:#4f6247}.fabric-features li>span{color:#a97a56;font-size:14px}.fabric-info dl{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.fabric-info dt{font-size:7px;letter-spacing:1.2px;color:#8a927f;margin-bottom:7px}.fabric-info dd{margin:0;font-size:11px;line-height:1.8;color:#41583a}.fabric-consider{font-size:11px;line-height:1.9;color:#7e8774;border-left:2px solid #b58b66;padding-left:13px}.fabric-sources{font-size:9px;color:#7b8771;margin:15px 0 22px}.fabric-sources summary{cursor:pointer;display:inline-block;border-bottom:1px solid #aab49e;padding-bottom:4px}.fabric-sources a{display:block;margin-top:10px;text-decoration:underline;text-underline-offset:3px}.fabric-colors{display:flex;gap:25px;align-items:center;border-top:1px solid #c2cbbb;padding-top:18px;margin:18px 0 25px}.fabric-colors>span{font-size:7px;letter-spacing:1px;color:#7e8973}.fabric-colors>div{display:flex;gap:12px}.fabric-colors button{width:22px;height:22px;border-radius:50%;background:var(--swatch-color);border:2px solid #eeeade;outline:1px solid transparent;cursor:pointer}.fabric-colors button[aria-pressed=true]{outline-color:#475e3e;outline-offset:3px}.fabric-info .button{font-size:11px;padding:15px 18px;line-height:1.6}.fabric-selection-note{font-size:9px;color:#87917e;line-height:1.9;margin-top:15px}.fabric-bottom{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #bec7b6;margin-top:45px;padding-top:20px;font-size:9px;color:#7d8971}.fabric-bottom span{font-size:7px;letter-spacing:1.3px}.fabric-lab button:focus-visible,.fabric-lab a:focus-visible{outline:2px solid #a77650;outline-offset:4px}@media(max-width:900px){.fabric-workbench{gap:5%}.swatch-stage{padding-left:10px;padding-right:10px}.swatch-back{left:25px;width:calc(100% - 40px)}.fabric-texture{height:290px}.fabric-info h3{font-size:28px}.fabric-sample-label span:last-child{display:none}}@media(max-width:700px){.fabric-heading{display:block;margin-bottom:20px}.fabric-heading>p{margin-top:23px;font-size:12px}.fabric-tabs{gap:22px;margin-bottom:30px}.fabric-tabs button{font-size:10px}.fabric-workbench{grid-template-columns:1fr;gap:25px}.swatch-stage{min-height:500px;max-width:380px;width:100%;margin:0 auto;padding:0 20px 75px}.fabric-texture{height:300px}.swatch-back{left:35px;top:20px;width:calc(100% - 60px);height:365px}.fabric-zoom{bottom:53px}.fabric-info dl{gap:15px}.fabric-bottom{display:block;line-height:1.8}.fabric-bottom a{display:block;margin-top:15px}.fabric-options button{flex:1;padding:11px 8px}.fabric-info .button{width:100%;justify-content:center}.fabric-visual-note{font-size:8px}}@media(prefers-reduced-motion:reduce){.fabric-sample{transition:none}}

.fabric-options button{min-width:110px}.fabric-options{align-items:stretch}@media(max-width:700px){.fabric-options button{flex:1 1 30%;min-width:95px}}

/* Clear category selectors */
.fabric-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;border:0;margin-bottom:40px}.fabric-tabs button{display:flex;align-items:center;gap:15px;text-align:left;background:#f8f5ed;border:1px solid #9eac94;border-left:4px solid #aab69f;padding:20px 23px;color:#203c31;min-height:75px}.fabric-tabs button strong{font:700 19px Manrope,Arial;letter-spacing:-.3px;line-height:1.4;color:#203c31}.fabric-family-index{font:600 12px Manrope,Arial;color:#8b674b}.fabric-tabs button[aria-pressed=true]{background:#203f35;border-color:#203f35;border-left-color:#c7976c;box-shadow:0 5px 14px #203f3515}.fabric-tabs button[aria-pressed=true] strong{color:#fff}.fabric-tabs button[aria-pressed=true] .fabric-family-index{color:#e3ba91}.fabric-tabs button:hover:not([aria-pressed=true]){background:#f0efe2;border-color:#637a58}@media(max-width:700px){.fabric-tabs{gap:10px;margin-bottom:30px}.fabric-tabs button{padding:15px 12px;gap:10px;min-height:80px}.fabric-tabs button strong{font-size:16px}.fabric-family-index{font-size:10px}}

/* Compact, legible family headings */
.fabric-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:25px}.fabric-tabs button{flex:0 1 auto;min-height:44px;padding:11px 18px;gap:10px;border-left-width:3px}.fabric-tabs button strong{font-size:15px;line-height:1.3}.fabric-family-index{font-size:10px}@media(max-width:700px){.fabric-tabs{gap:8px;margin-bottom:22px}.fabric-tabs button{min-height:42px;padding:10px 12px;gap:7px}.fabric-tabs button strong{font-size:13px}.fabric-family-index{font-size:9px}}

.fabric-garment{margin-top:65px;border-top:1px solid #a8b3a5;padding-top:40px}.fabric-garment-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:25px}.fabric-garment-head h3{font:500 clamp(30px,4vw,48px)/1.15 Manrope,Arial;letter-spacing:-1.5px;margin:0}.fabric-garment-head>p{max-width:300px;font-size:14px;line-height:1.8;color:#586759}.fabric-garment-head .eyebrow{margin-bottom:14px}.garment-window{position:relative;height:620px;overflow:hidden;border-radius:20px;background:radial-gradient(ellipse at 50% 38%,#f7f5ee,#c7cfbf);display:flex;align-items:center;justify-content:center;isolation:isolate}.garment-window canvas{width:600px;height:600px;max-width:100%;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 20px 15px #16352a30);transform-origin:center;will-change:transform}.garment-window.is-zoomed{cursor:grab;touch-action:none}.garment-window.is-zoomed:active{cursor:grabbing}.garment-hint{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:#173c32e8;color:#fff;border-radius:30px;padding:10px 18px;font-size:11px;white-space:nowrap;pointer-events:none}.garment-tools{display:flex;align-items:center;justify-content:center;gap:15px;flex-wrap:wrap;margin:20px 0}.garment-tools button{border:1px solid #a3b29f;background:#f5f3ee;border-radius:7px;min-height:44px;min-width:44px;padding:10px 14px;color:#173c32}.garment-tools label{display:flex;align-items:center;gap:12px;font-size:13px}.garment-tools input{accent-color:#285247;width:160px}.garment-caption{text-align:center;font-weight:600;font-size:15px}.fabric-garment>.fabric-selection-note{max-width:650px;text-align:center;margin:15px auto;line-height:1.8}@media(max-width:700px){.fabric-garment-head{display:block}.fabric-garment-head>p{margin-top:18px}.garment-window{height:440px}.garment-window canvas{width:420px;height:420px}.garment-tools{gap:8px}.garment-tools input{width:120px}}

.garment-picker{background:#f7f5ef;border:1px solid #c3cbbb;border-radius:16px;padding:24px;margin-bottom:20px;display:grid;grid-template-columns:1fr 2fr 1fr;gap:25px}.garment-step>span{display:block;font-size:10px;letter-spacing:1.4px;color:#586c5c;font-weight:700;margin-bottom:14px}.garment-families{display:flex;flex-direction:column;gap:7px}.garment-families button{padding:11px 13px;border:1px solid #bac7b6;background:transparent;color:#274b3c;border-radius:6px;text-align:left;font-size:13px}.garment-families button[aria-pressed=true],.garment-picker .fabric-options button[aria-pressed=true]{background:#254a3c;color:#fff;border-color:#254a3c}.garment-picker .fabric-options{margin:0;gap:7px}.garment-picker .fabric-options button{font-size:12px;padding:11px;border-radius:6px}.garment-colors{display:flex;flex-wrap:wrap;gap:10px}.garment-colors button{width:34px;height:34px;border-radius:50%;background:var(--swatch-color);border:3px solid #f7f5ef;outline:1px solid #a9b7a4}.garment-colors button[aria-pressed=true]{outline:3px solid #254a3c;outline-offset:2px}.garment-choice{grid-column:1/-1;border-top:1px solid #d4dace;padding-top:15px;font-size:14px;font-weight:600;color:#254a3c}.garment-mini{display:flex;max-width:650px;margin:20px auto;gap:22px;align-items:center;padding:22px;border:1px solid #bbc8b3;border-radius:12px;background:#f5f3eb}.garment-mini-texture{width:100px;height:110px;flex:none;border-radius:7px;overflow:hidden}.garment-mini-texture svg{width:100%;height:100%;display:block}.garment-mini strong{font-size:18px}.garment-mini p{font-size:12px;line-height:1.7;color:#5f715e;margin:8px 0 14px}.garment-mini .button{font-size:12px;padding:12px 15px}@media(max-width:850px){.garment-picker{grid-template-columns:1fr 2fr}.garment-step:last-of-type{grid-column:1/-1}.garment-families{flex-direction:row;flex-wrap:wrap}}@media(max-width:550px){.garment-picker{grid-template-columns:1fr;padding:18px;gap:20px}.garment-step:last-of-type{grid-column:auto}.garment-mini{padding:16px;gap:15px}.garment-mini-texture{width:70px;height:90px}}

.garment-visual-pair{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:20px;align-items:stretch}.garment-visual-pair .garment-mini{margin:0;display:flex;flex-direction:column;align-items:stretch;padding:20px;background:#f7f5ef}.garment-visual-pair .garment-mini-texture{width:100%;height:260px;border:1px solid #a3ad9d;box-shadow:inset 0 0 25px #0002}.garment-visual-pair .garment-mini strong{display:block;margin-top:16px;font-size:19px;line-height:1.4}.garment-visual-pair .garment-mini p{font-size:13px;line-height:1.8}.garment-visual-pair .garment-window{height:560px}.garment-visual-pair canvas{width:550px;height:550px}.fabric-changed{animation:fabricChange .4s ease-out}@keyframes fabricChange{from{opacity:.3}to{opacity:1}}@media(max-width:1000px){.garment-visual-pair{grid-template-columns:minmax(0,1fr) 210px}.garment-visual-pair .garment-mini-texture{height:210px}.garment-visual-pair .garment-window{height:480px}.garment-visual-pair canvas{width:460px;height:460px}}@media(max-width:650px){.garment-visual-pair{grid-template-columns:1fr}.garment-visual-pair .garment-mini{display:grid;grid-template-columns:120px 1fr;gap:18px}.garment-visual-pair .garment-mini-texture{height:160px}.garment-visual-pair .garment-mini strong{margin-top:0;font-size:16px}.garment-visual-pair .garment-window{height:420px}.garment-visual-pair canvas{width:420px;height:420px}}@media(prefers-reduced-motion:reduce){.fabric-changed{animation:none}}
