.studio-warn-tip{z-index:60;border:1px solid var(--border);border-left:3px solid var(--warning);border-radius:var(--radius-control);background:var(--card);color:var(--foreground);flex-direction:column;gap:.375rem;padding:.625rem .75rem;font-size:12.5px;line-height:1.4;display:flex;position:fixed;box-shadow:0 10px 28px -12px #00000059}.studio-warn-tip>p{margin:0}.studio-warn-tip-head{font-weight:600}.studio-warn-tip-advice{color:var(--muted-foreground)}.studio-layer-warn{z-index:11;background:var(--warning);width:1.0625rem;height:1.0625rem;color:var(--warning-foreground);box-shadow:0 0 0 2px var(--card);font-family:var(--font-sans);cursor:help;border-radius:9999px;place-items:center;font-size:11px;font-weight:800;line-height:1;display:grid;position:absolute;top:.25rem;right:.25rem}[data-locked=true]>.studio-layer-warn{right:1.625rem}.studio-selvedge-dot>.studio-layer-warn,.studio-book-thumb>.studio-layer-warn{width:.9375rem;height:.9375rem;font-size:10px;top:-.4375rem;right:-.4375rem}.studio-selvedge-dot[data-locked=true]>.studio-layer-warn,.studio-book-thumb[data-locked=true]>.studio-layer-warn{left:-.4375rem;right:auto}[data-swap=true] [data-swap-target]{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;touch-action:manipulation}[data-dragging=true] [data-swap-target]{cursor:grabbing}[data-swap-target][data-dragged=true]{opacity:.35}[data-swap-target][data-drop=true]{z-index:12;outline:2px dashed var(--primary);outline-offset:3px}[data-swap-target][data-drop=true][data-swatch],[data-swap-target][data-drop=true] [data-swatch]{filter:brightness(1.15)}.studio-layer-tile[data-drop=true]{outline-offset:-5px}.studio-swap-ghost{z-index:80;pointer-events:none;width:2.5rem;height:2.5rem;box-shadow:0 0 0 3px var(--card), 0 6px 16px #0000004d;border-radius:9999px;margin:-1.25rem 0 0 -1.25rem;position:fixed}.studio-landing{z-index:70;pointer-events:none;width:100%;height:100%;position:fixed;inset:0}[data-landing=true] .studio-ring-arc,[data-landing=true] .studio-ring-open,[data-landing=true] .studio-ring-value,[data-landing=true] .studio-ring-marks,[data-landing=true] .studio-ring-focus{opacity:0}[data-layerbar=bar][data-sized=true]{interpolate-size:allow-keywords}[data-layerbar=bar][data-sized=true]>.studio-layer-tile{min-width:1.75rem;transition:min-width .2s,flex-grow .2s;overflow:hidden}[data-layerbar=bar][data-sized=true]>.studio-layer-tile[aria-expanded=true]{min-width:max-content}[data-layerbar=bar][data-sized=true] .studio-layer-label{max-width:min(50cqw - 1rem, 100cqw - var(--bar-rest,0rem) - 1rem)}@media (prefers-reduced-motion:reduce){[data-layerbar=bar][data-sized=true]>.studio-layer-tile{transition:none}}.studio-bar-value{inset-inline:0;border-top:2px solid var(--card);pointer-events:none;height:22%;min-height:.625rem;position:absolute;bottom:0}.studio-layer-tile[aria-expanded=true]>.studio-bar-value{inset-inline:4px;bottom:4px}[data-layer-value=true] .studio-layer-tile{padding-bottom:1rem}.studio-chips{grid-template-columns:repeat(auto-fit,minmax(5.25rem,1fr));gap:.5rem;padding-top:.25rem;display:grid}.studio-chip-swatch{height:4.5rem}.studio-chip-value{width:.875rem;height:.875rem;box-shadow:0 0 0 2px var(--card);border-radius:9999px;position:absolute;bottom:.375rem;right:.375rem}@container layers (width<=24rem){.studio-chips{scroll-snap-type:x mandatory;padding:.375rem .125rem .5rem;display:flex;overflow-x:auto}.studio-chip{scroll-snap-align:start;flex:none;width:5.25rem}}@container studio (height<=32rem){.studio-chips{scroll-snap-type:x mandatory;padding:.375rem .125rem .5rem;display:flex;overflow-x:auto}.studio-chip{scroll-snap-align:start;flex:none;width:5.25rem}.studio-chip-swatch{height:2.25rem}}[data-compact=true] .studio-chips{scroll-snap-type:x mandatory;padding:.375rem .125rem .5rem;display:flex;overflow-x:auto}[data-compact=true] .studio-chip{scroll-snap-align:start;flex:none;width:5.25rem}[data-compact=true] .studio-chip-swatch{height:2.25rem}.studio-fan{--fan-w:4.5rem;--fan-step:min(calc(var(--fan-w) - 1.125rem), calc((100cqw - var(--fan-w) - 2rem) / max(1, var(--fan-n) - 1)));--fan-turn:min(3deg, calc(30deg / var(--fan-n)));justify-content:center;align-items:flex-end;height:10rem;padding:1.5rem 1rem .375rem;display:flex}.studio-fan-card{width:var(--fan-w);height:7.5rem;transform-origin:50% 100%;transform:rotate(calc(var(--fan-i) * var(--fan-turn)));flex:none;margin-inline-start:calc(var(--fan-step) - var(--fan-w));transition:transform .2s,box-shadow .2s}.studio-fan-card:first-child{margin-inline-start:0}.studio-fan-value{border-top:2px solid var(--card);flex:none;height:.875rem}@container layers (width<=24rem){.studio-fan-value{height:.75rem}}@container studio (height<=32rem){.studio-fan-value{height:.5rem}}[data-compact=true] .studio-fan-value{height:.5rem}button.studio-fan-card:focus-visible{z-index:10;transform:translateY(-.375rem) rotate(calc(var(--fan-i) * var(--fan-turn)))}@media (hover:hover){button.studio-fan-card:hover{z-index:10;transform:translateY(-.375rem) rotate(calc(var(--fan-i) * var(--fan-turn)))}}.studio-fan-card[aria-expanded=true],button.studio-fan-card[aria-expanded=true]:hover,button.studio-fan-card[aria-expanded=true]:focus-visible{z-index:20;transform:translateY(-.875rem)}@container studio (height<=32rem){.studio-fan{scroll-snap-type:x mandatory;justify-content:flex-start;gap:.5rem;height:auto;padding:.375rem .25rem;overflow-x:auto}.studio-fan-card{scroll-snap-align:start;height:4rem;margin-inline-start:0;transform:none}.studio-fan-name{display:none}button.studio-fan-card:hover,button.studio-fan-card:focus-visible{transform:none}.studio-fan-card[aria-expanded=true],button.studio-fan-card[aria-expanded=true]:hover,button.studio-fan-card[aria-expanded=true]:focus-visible{transform:translateY(-.25rem)}}[data-compact=true] .studio-fan{scroll-snap-type:x mandatory;justify-content:flex-start;gap:.5rem;height:auto;padding:.375rem .25rem;overflow-x:auto}[data-compact=true] .studio-fan-card{scroll-snap-align:start;height:4rem;margin-inline-start:0;transform:none}[data-compact=true] .studio-fan-name{display:none}[data-compact=true] button.studio-fan-card:hover,[data-compact=true] button.studio-fan-card:focus-visible{transform:none}[data-compact=true] .studio-fan-card[aria-expanded=true],[data-compact=true] button.studio-fan-card[aria-expanded=true]:hover,[data-compact=true] button.studio-fan-card[aria-expanded=true]:focus-visible{transform:translateY(-.25rem)}@container layers (width<=24rem){.studio-fan{scroll-snap-type:x mandatory;justify-content:flex-start;gap:.5rem;height:auto;padding:.75rem .25rem .5rem;overflow-x:auto}.studio-fan-card{scroll-snap-align:start;height:6.75rem;margin-inline-start:0;transform:none}button.studio-fan-card:hover,button.studio-fan-card:focus-visible{transform:none}.studio-fan-card[aria-expanded=true],button.studio-fan-card[aria-expanded=true]:hover,button.studio-fan-card[aria-expanded=true]:focus-visible{transform:translateY(-.25rem)}}@media (prefers-reduced-motion:reduce){.studio-fan-card{transition:none}}.studio-ring{--ring-size:clamp(8.5rem, 32cqw, 10.5rem);flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 1.5rem;display:flex}.studio-ring-figure{width:var(--ring-size);height:var(--ring-size);flex:none}.studio-ring-layer{max-width:calc(var(--ring-size) * .46);font-size:max(8px, calc(var(--ring-size) * .034));letter-spacing:.1em;text-transform:uppercase;margin-bottom:.15em;font-weight:600}.studio-ring-number{max-width:calc(var(--ring-size) * .5);font-size:max(10px, calc(var(--ring-size) * .05))}.studio-ring-name{max-width:calc(var(--ring-size) * .5);font-size:max(9px, calc(var(--ring-size) * .04));text-wrap:balance;overflow-wrap:anywhere;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.studio-ring-share{font-size:max(9px, calc(var(--ring-size) * .04));margin-top:.1em}.studio-ring-count{font-size:max(16px, calc(var(--ring-size) * .08))}.studio-ring-unit{font-size:max(9px, calc(var(--ring-size) * .042));margin-top:.2em}.studio-ring-slot{display:contents}[data-fit=true]{flex-direction:column;flex:1;min-height:0;display:flex}[data-fit=true]>.studio-ring{flex:1;grid-template-rows:minmax(0,1fr) auto;justify-items:center;gap:.75rem;min-height:0;display:grid}[data-fit=true] .studio-ring-slot{place-items:center;width:100%;height:100%;min-height:0;display:grid;container-type:size}[data-fit=true] .studio-ring-figure{--ring-size:clamp(6.5rem, calc(min(100cqw, 100cqh) / var(--ring-k,1)), 26rem)}[data-fit=true][data-reach=marks]{--ring-k:1.14}[data-fit=true][data-reach=hue]{--ring-k:1.3}[data-fit=true] .studio-ring-side{text-align:center;flex:none;align-items:center;width:100%;max-width:26rem}[data-fit=true] .studio-ring-tools{justify-content:center}[data-fit=true] .studio-ring-note{text-align:left;width:100%}[data-editable=false] .studio-ring{--ring-size:7rem;justify-content:flex-start}.studio-ring-inks{flex:14rem;min-width:0}.studio-ring-arc{outline:none}.studio-ring-arc-fill{stroke:color-mix(in srgb, var(--foreground) 12%, transparent);stroke-width:.5px}.studio-ring-open{pointer-events:none;fill:none;stroke:var(--foreground);stroke-width:2px;stroke-linejoin:round;vector-effect:non-scaling-stroke}[data-fading=true] .studio-ring-arc-fill{transition:fill .35s}.studio-ring-focus{pointer-events:none;fill:none}.studio-ring-focus-band{stroke:var(--background);stroke-width:6px;stroke-linejoin:round;vector-effect:non-scaling-stroke}.studio-ring-focus-line{stroke:var(--ring);stroke-width:2.5px;stroke-linejoin:round;vector-effect:non-scaling-stroke}@container layers (width<=26rem){.studio-ring{--ring-size:8rem}.studio-ring-name{-webkit-line-clamp:1;line-clamp:1}.studio-ring-layer{display:none}}@container studio (height<=32rem){[data-editable=true] .studio-ring{--ring-size:6.5rem}[data-editable=true] .studio-ring-name{-webkit-line-clamp:1;line-clamp:1}[data-editable=true] .studio-ring-layer{display:none}}[data-compact=true][data-editable=true] .studio-ring{--ring-size:6.5rem}[data-compact=true][data-editable=true] .studio-ring-name{-webkit-line-clamp:1;line-clamp:1}[data-compact=true][data-editable=true] .studio-ring-layer{display:none}@media (prefers-reduced-motion:reduce){[data-fading=true] .studio-ring-arc-fill{transition:none}}.studio-ring-side{flex:8.5rem;max-width:22rem}[data-reach=marks] .studio-ring-figure{margin:calc(var(--ring-size) * .066)}[data-reach=hue] .studio-ring-figure{margin:calc(var(--ring-size) * .14)}.studio-ring-figure{--ring-lock:clamp(1rem, calc(var(--ring-size) * .11), 1.25rem);-webkit-user-select:none;user-select:none}[data-value=true] .studio-ring-number,[data-value=true] .studio-ring-name{max-width:calc(var(--ring-size) * .46)}[data-small=true] .studio-ring-value-label[data-open=true],[data-small=true] .studio-ring-layer{display:none}.studio-ring-value-label{top:calc(50% + var(--ring-size) * .233);font-size:max(7.5px, calc(var(--ring-size) * .034));letter-spacing:.1em;text-transform:uppercase;font-weight:600;position:absolute;left:50%;translate:-50% -50%}.studio-ring-value path{stroke:color-mix(in srgb, var(--foreground) 12%, transparent);stroke-width:.4px}[data-fading=true] .studio-ring-value path{transition:fill .35s}[data-hold-touch=true] .studio-ring-figure>svg{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.studio-ring-dot{touch-action:none}.studio-ring-arc[data-dragged=true]{opacity:.5}[data-dragging=true] .studio-ring-arc{cursor:grabbing}.studio-ring-drop{pointer-events:none;fill:none;stroke:var(--primary);stroke-width:3px;stroke-linejoin:round;vector-effect:non-scaling-stroke}.studio-ring-ghost{z-index:80;pointer-events:none;width:2.125rem;height:2.125rem;box-shadow:0 0 0 3px var(--card), 0 6px 16px #0000004d;border-radius:9999px;margin:-1.0625rem 0 0 -1.0625rem;position:fixed}.studio-ring-mark{cursor:help}.studio-ring-mark>circle{fill:var(--warning);stroke:var(--card);stroke-width:.8px}.studio-ring-mark-bang{fill:var(--warning-foreground);font-family:var(--font-sans);font-size:5px;font-weight:800}.studio-ring-lock,.studio-ring-hole-lock{border:1px solid color-mix(in srgb, var(--foreground) 24%, transparent);background:var(--card);color:var(--muted-foreground);cursor:pointer;border-radius:9999px;place-items:center;transition:opacity .15s,background-color .15s,color .15s;display:grid;box-shadow:0 1px 2px #0000002e}.studio-ring-lock{z-index:1;width:var(--ring-lock);height:var(--ring-lock);opacity:0;pointer-events:none;position:absolute;translate:-50% -50%}.studio-ring-lock[data-shown=true]{opacity:1;pointer-events:auto}@media (hover:hover){.studio-ring-lock:hover,.studio-ring-hole-lock:hover{color:var(--foreground)}}.studio-ring-lock[aria-pressed=true],.studio-ring-hole-lock[aria-pressed=true]{border-color:var(--card);background:var(--selected);color:var(--on-selected)}.studio-ring-lock svg,.studio-ring-hole-lock svg{width:58%;height:58%}.studio-ring-lock:focus-visible,.studio-ring-hole-lock:focus-visible{outline:2px solid var(--ring);outline-offset:1px}.studio-ring-hole-lock{width:clamp(1.125rem, calc(var(--ring-size) * .12), 1.375rem);height:clamp(1.125rem, calc(var(--ring-size) * .12), 1.375rem);margin-bottom:.2rem}.studio-ring-side-lock{display:none}.studio-ring-hue path{stroke:none}.studio-ring-dot{cursor:grab;outline:none}.studio-ring-dot:active{cursor:grabbing}.studio-ring-dot-hit{fill:#0000}.studio-ring-dot-ring{fill:none;stroke:#0000;stroke-width:1.4px}.studio-ring-dot:focus-visible .studio-ring-dot-ring{stroke:var(--ring)}.studio-ring-dot-face{stroke:var(--card);stroke-width:1.2px}[data-fading=true] .studio-ring-dot-face{transition:fill .35s}.studio-ring-dot[data-flat] .studio-ring-dot-face{fill:var(--card);stroke:var(--muted-foreground);stroke-width:1px}.studio-ring-line{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;height:2.125rem;line-height:1.0625rem;display:-webkit-box;overflow:hidden}.studio-ring-line[data-said=true]{color:var(--foreground);font-weight:500}.studio-ring-note{height:3.9375rem;line-height:1.0625rem;overflow:hidden}.studio-ring-note>span{-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.studio-ring-short{display:none}@container layers (width<=26rem){.studio-ring-with-tools{gap:.5rem .75rem}.studio-ring-tool-word,.studio-color-tools .studio-step-group[data-icon=narrow] .studio-step-word,.studio-ring-wide,.studio-ring-hole-lock,.studio-ring-note>svg{display:none}.studio-ring-tool{width:2rem;padding-inline:0}.studio-color-tools .studio-step-group[data-icon=narrow] .studio-step-icon{display:inline-flex}.studio-color-tools .studio-step-group[data-icon=narrow]{--step-group-inset:2px;--step-group-gap:1px;--step-cap-width:1.25rem;--step-cap-ratio:auto;--step-action-pad:.1875rem}.studio-ring-short{display:inline}.studio-ring-side-lock{display:inline-flex}.studio-ring-lock:not([aria-pressed=true]),.studio-ring-value-label[data-open=true]{display:none}.studio-ring-note{height:2.875rem}.studio-ring-note>span{-webkit-line-clamp:2;line-clamp:2}}@media (pointer:coarse){.studio-ring-hole-lock{display:none}.studio-ring-side-lock{display:inline-flex}.studio-ring-lock:not([aria-pressed=true]){display:none}}@container studio (height<=32rem){[data-editable=true] .studio-ring-with-tools{gap:.5rem .75rem}[data-editable=true] .studio-ring-tool-word,[data-editable=true] .studio-color-tools .studio-step-group[data-icon=narrow] .studio-step-word,[data-editable=true] .studio-ring-wide,[data-editable=true] .studio-ring-note>svg,[data-editable=true] .studio-ring-value-label,[data-editable=true] .studio-ring-hole-lock,[data-editable=true] .studio-ring-hue,[data-editable=true] .studio-ring-dots,[data-editable=true] .studio-ring-lock:not([aria-pressed=true]){display:none}[data-editable=true] .studio-ring-tool{width:2rem;padding-inline:0}[data-editable=true] .studio-color-tools .studio-step-group[data-icon=narrow] .studio-step-icon{display:inline-flex}[data-editable=true] .studio-color-tools .studio-step-group[data-icon=narrow]{--step-group-inset:2px;--step-group-gap:1px;--step-cap-width:1.25rem;--step-cap-ratio:auto;--step-action-pad:.1875rem}[data-editable=true] .studio-ring-short{display:inline}[data-editable=true] .studio-ring-side-lock{display:inline-flex}[data-editable=true][data-reach] .studio-ring-figure{margin:0}[data-editable=true] .studio-ring-side{gap:.25rem}[data-editable=true][data-value=true] .studio-ring-number{max-width:calc(var(--ring-size) * .48)}[data-editable=true][data-value=true] .studio-ring-name{max-width:calc(var(--ring-size) * .5)}[data-editable=true] .studio-ring-line{-webkit-line-clamp:1;line-clamp:1;height:1.0625rem}[data-editable=true] .studio-ring-note{height:2.875rem}[data-editable=true] .studio-ring-note>span{-webkit-line-clamp:2;line-clamp:2}}[data-compact=true] .studio-ring-with-tools{gap:.5rem .75rem}[data-compact=true] .studio-ring-tool-word,[data-compact=true] .studio-color-tools .studio-step-group[data-icon=narrow] .studio-step-word,[data-compact=true] .studio-ring-wide,[data-compact=true] .studio-ring-note>svg,[data-compact=true] .studio-ring-value-label,[data-compact=true] .studio-ring-hole-lock,[data-compact=true] .studio-ring-hue,[data-compact=true] .studio-ring-dots,[data-compact=true] .studio-ring-lock:not([aria-pressed=true]){display:none}[data-compact=true] .studio-ring-tool{width:2rem;padding-inline:0}[data-compact=true] .studio-color-tools .studio-step-group[data-icon=narrow] .studio-step-icon{display:inline-flex}[data-compact=true] .studio-color-tools .studio-step-group[data-icon=narrow]{--step-group-inset:2px;--step-group-gap:1px;--step-cap-width:1.25rem;--step-cap-ratio:auto;--step-action-pad:.1875rem}[data-compact=true] .studio-ring-short{display:inline}[data-compact=true] .studio-ring-side-lock{display:inline-flex}[data-compact=true][data-reach] .studio-ring-figure{margin:0}[data-compact=true] .studio-ring-side{gap:.25rem}[data-compact=true][data-value=true] .studio-ring-number{max-width:calc(var(--ring-size) * .48)}[data-compact=true][data-value=true] .studio-ring-name{max-width:calc(var(--ring-size) * .5)}[data-compact=true] .studio-ring-line{display:none}[data-compact=true] .studio-ring-note{height:1.8125rem}[data-compact=true] .studio-ring-note>span{-webkit-line-clamp:1;line-clamp:1}@media (prefers-reduced-motion:reduce){[data-fading=true] .studio-ring-value path,.studio-ring-lock,.studio-ring-hole-lock,[data-fading=true] .studio-ring-dot-face{transition:none}}[data-icons=true] .studio-step-group[data-icon=narrow] .studio-step-icon{display:inline-flex}[data-icons=true] .studio-step-group[data-icon=narrow] .studio-step-word,[data-icons=true] .studio-ring-tool-word{display:none}[data-icons=true] .studio-ring-tool-worded{width:2rem;padding-inline:0}[data-icons=true] .studio-step-group[data-icon=narrow]{--step-group-inset:2px;--step-group-gap:1px;--step-cap-width:1.25rem;--step-cap-ratio:auto;--step-action-pad:.1875rem}.studio-color-tools{align-self:stretch}.studio-color-tools-arrows{align-items:center;justify-content:inherit;flex-wrap:wrap;flex:none;gap:.375rem;display:inline-flex}.studio-color-tools[data-fit=stack]>.studio-color-tools-arrows,.studio-color-tools[data-fit=icons]>.studio-color-tools-arrows{flex-basis:100%;order:-1}.studio-color-tools[data-fit=icons] .studio-step-group[data-icon=narrow] .studio-step-icon{display:inline-flex}.studio-color-tools[data-fit=icons] .studio-step-group[data-icon=narrow] .studio-step-word{display:none}.studio-color-tools[data-fit=icons] .studio-step-group[data-icon=narrow]{--step-group-inset:2px;--step-group-gap:1px;--step-cap-width:1.25rem;--step-cap-ratio:auto;--step-action-pad:.1875rem}.studio-color-tools-count:empty{min-width:0}.studio-layer-panel[data-compact=true]{container:layer-panel/inline-size}@container layer-panel (width>=26.25rem){.studio-layer-panel:not([data-reset=true]) .studio-panel-card-compact{flex-direction:row;align-items:center;gap:.625rem}.studio-layer-panel:not([data-reset=true]) .studio-panel-card-compact>:first-child{flex:1;min-width:0}.studio-layer-panel:not([data-reset=true]) .studio-panel-card-compact>.studio-panel-tools{flex-wrap:nowrap;flex:none}}@container layer-panel (width>=28.625rem){.studio-layer-panel[data-reset=true] .studio-panel-card-compact{flex-direction:row;align-items:center;gap:.625rem}.studio-layer-panel[data-reset=true] .studio-panel-card-compact>:first-child{flex:1;min-width:0}.studio-layer-panel[data-reset=true] .studio-panel-card-compact>.studio-panel-tools{flex-wrap:nowrap;flex:none}}@container layer-panel (width>=16rem){.studio-layer-panel[data-tools=undo]:not([data-reset=true]) .studio-panel-card-compact{flex-direction:row;align-items:center;gap:.625rem}.studio-layer-panel[data-tools=undo]:not([data-reset=true]) .studio-panel-card-compact>:first-child{flex:1;min-width:0}.studio-layer-panel[data-tools=undo]:not([data-reset=true]) .studio-panel-card-compact>.studio-panel-tools{flex-wrap:nowrap;flex:none}}@container layer-panel (width>=18.375rem){.studio-layer-panel[data-tools=undo][data-reset=true] .studio-panel-card-compact{flex-direction:row;align-items:center;gap:.625rem}.studio-layer-panel[data-tools=undo][data-reset=true] .studio-panel-card-compact>:first-child{flex:1;min-width:0}.studio-layer-panel[data-tools=undo][data-reset=true] .studio-panel-card-compact>.studio-panel-tools{flex-wrap:nowrap;flex:none}}.studio-selvedge{--selvedge-band:.625rem;background-color:color-mix(in srgb, var(--card) 88%, var(--muted-foreground));background-image:radial-gradient(circle, color-mix(in srgb, var(--foreground) 34%, transparent) 0 1px, transparent 1.5px), linear-gradient(to bottom, color-mix(in srgb, var(--foreground) 7%, transparent) 0 var(--selvedge-band), color-mix(in srgb, var(--foreground) 12%, transparent) var(--selvedge-band) calc(var(--selvedge-band) + 1px), transparent calc(var(--selvedge-band) + 1px)), repeating-conic-gradient(color-mix(in srgb, var(--foreground) 5%, transparent) 0 25%, transparent 0 50%), repeating-linear-gradient(90deg, color-mix(in srgb, var(--foreground) 6%, transparent) 0 1px, transparent 1px 4px);background-size:.75rem var(--selvedge-band), auto, 4px 4px, auto;background-position:.375rem 0,0 0,0 0,0 0;background-repeat:repeat-x,no-repeat,repeat,repeat}.studio-selvedge-print{padding:calc(var(--selvedge-band) + .5rem * var(--studio-pad)) calc(.875rem * var(--studio-pad)) 0;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-foreground);font-size:9.5px;font-weight:600;line-height:1.2}.studio-selvedge-dots{--dot-gap:.75rem;--dot-pad:calc(.875rem * var(--studio-pad));--dot:clamp(1.5rem, calc((100cqw - 2 * var(--dot-pad) - 2 * var(--studio-border-width) - (var(--dot-n) - 1) * var(--dot-gap)) / var(--dot-n)), 2.25rem);align-items:center;gap:var(--dot-gap);scroll-snap-type:x proximity;scroll-padding-inline:var(--dot-pad);padding:.625rem var(--dot-pad) .75rem;display:flex;overflow-x:auto}.studio-selvedge-dot{width:var(--dot);height:var(--dot);font-size:calc(var(--dot) * .36);scroll-snap-align:center;flex:none;line-height:1;transition:transform .15s;box-shadow:0 1px 3px #00000040}@media (hover:hover){button.studio-selvedge-dot:hover{transform:scale(1.1)}}.studio-selvedge-dot[aria-expanded=true],button.studio-selvedge-dot[aria-expanded=true]:hover{z-index:1;box-shadow:0 0 0 2px var(--primary), 0 2px 6px #00000040;position:relative;transform:scale(1.3)}[data-layer-value=true] .studio-selvedge-dots{--dot-gap:1.125rem}[data-layer-value=true] .studio-selvedge-dot[style*=--layer-value]{box-shadow:0 0 0 3px var(--layer-value), 0 0 0 4px color-mix(in srgb, var(--foreground) 22%, transparent), 0 1px 3px #00000040}[data-layer-value=true] .studio-selvedge-dot[style*=--layer-value][aria-expanded=true]{box-shadow:0 0 0 3px var(--layer-value), 0 0 0 5px var(--primary), 0 2px 6px #00000040}[data-layer-value=true] [data-compact=true] .studio-selvedge-dots{--dot-gap:.875rem}@container layers (width<=24rem){[data-layer-value=true] .studio-selvedge-dots{--dot-gap:.875rem}}@container studio (height<=32rem){[data-layer-value=true] .studio-selvedge-dots{--dot-gap:.875rem}}@container layers (width<=24rem){.studio-selvedge-dots{--dot-gap:.5rem;scroll-snap-type:x mandatory}}@container studio (height<=32rem){.studio-selvedge-print{display:none}.studio-selvedge{--selvedge-band:.5rem}.studio-selvedge-dots{--dot-gap:.5rem;--dot:clamp(1.375rem, calc((100cqw - 2 * var(--dot-pad) - (var(--dot-n) - 1) * var(--dot-gap)) / var(--dot-n)), 1.75rem);padding-block:calc(var(--selvedge-band) + .375rem) .5rem;scroll-snap-type:x mandatory}}[data-compact=true] .studio-selvedge-print{display:none}[data-compact=true] .studio-selvedge{--selvedge-band:.5rem}[data-compact=true] .studio-selvedge-dots{--dot-gap:.5rem;--dot:clamp(1.375rem, calc((100cqw - 2 * var(--dot-pad) - (var(--dot-n) - 1) * var(--dot-gap)) / var(--dot-n)), 1.75rem);padding-block:calc(var(--selvedge-band) + .375rem) .5rem;scroll-snap-type:x mandatory}@media (prefers-reduced-motion:reduce){.studio-selvedge-dot{transition:none}}.studio-skeins{grid-template-columns:repeat(auto-fill,minmax(4.75rem,1fr));justify-items:center;gap:.5rem .25rem;padding-top:.25rem;display:grid}.studio-skein{width:100%;max-width:6rem}.studio-skein-art{aspect-ratio:16/9;width:4.5rem}.studio-skein-yarn{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 36'%3E%3Cpath d='M4 18C4 10 9 5 16.5 5C23 5 27 7.6 32 7.6C37 7.6 41 5 47.5 5C55 5 60 10 60 18C60 26 55 31 47.5 31C41 31 37 28.4 32 28.4C27 28.4 23 31 16.5 31C9 31 4 26 4 18Z'/%3E%3C/svg%3E") 50%/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 36'%3E%3Cpath d='M4 18C4 10 9 5 16.5 5C23 5 27 7.6 32 7.6C37 7.6 41 5 47.5 5C55 5 60 10 60 18C60 26 55 31 47.5 31C41 31 37 28.4 32 28.4C27 28.4 23 31 16.5 31C9 31 4 26 4 18Z'/%3E%3C/svg%3E") 50%/100% 100% no-repeat}.studio-skein-light{background:linear-gradient(#ffffff6b 8%,#fff0 38%,#0000 58%,#00000052 92%),radial-gradient(50% 22% at 30% 30%,#ffffff4d,#0000)}.studio-skein-band{fill:var(--card);stroke:color-mix(in srgb, var(--foreground) 28%, transparent);stroke-width:.6px}.studio-skein-band-print{stroke:color-mix(in srgb, var(--foreground) 35%, transparent);stroke-width:.9px;stroke-dasharray:2.4 1.6}.studio-skein-shadow{background:radial-gradient(closest-side,#0000004d,#0000);height:6px;transition:transform .18s,opacity .18s;bottom:-1px;left:12%;right:12%}.studio-skein-body{transition:transform .18s}.studio-skein-mark{opacity:0;transition:opacity .18s}.studio-skein-tag{z-index:1;pointer-events:none;position:absolute;top:100%;left:50%;translate:-50%}[data-layer-value=true] .studio-skein-words{padding-top:1.5rem}.studio-skein-string{background:var(--muted-foreground);width:1px;height:.3125rem}.studio-skein-tag-face{width:2.25rem;height:.8125rem;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--foreground) 14%, transparent);border-radius:3px}@media (hover:hover){button.studio-skein:hover .studio-skein-body{transform:translateY(-2px)}}.studio-skein[aria-expanded=true] .studio-skein-body{transform:translateY(-6px)scale(1.06)}.studio-skein[aria-expanded=true] .studio-skein-shadow{opacity:.55;transform:scaleX(.8)}.studio-skein[aria-expanded=true] .studio-skein-words{color:var(--foreground)}.studio-skein[aria-expanded=true] .studio-skein-mark{opacity:1}@container layers (width<=24rem){.studio-skein-tag{inset:auto -.375rem -.25rem auto;translate:none}.studio-skein-string{display:none}[data-layer-value=true] .studio-skein-words{padding-top:.375rem}.studio-skeins{scroll-snap-type:x mandatory;gap:.25rem;padding:.5rem .125rem .375rem;display:flex;overflow-x:auto}.studio-skein{scroll-snap-align:start;flex:none;width:4.75rem}.studio-skein-art{width:4rem}}@container studio (height<=32rem){.studio-skein-tag{inset:auto -.375rem -.25rem auto;translate:none}.studio-skein-string{display:none}[data-layer-value=true] .studio-skein-words{padding-top:.375rem}.studio-skeins{scroll-snap-type:x mandatory;gap:.25rem;padding:.5rem .125rem .375rem;display:flex;overflow-x:auto}.studio-skein{scroll-snap-align:start;flex:none;width:4.25rem}.studio-skein-art{width:3.25rem}.studio-skein-number{font-size:10px}.studio-skein-name{display:none}.studio-skein[aria-expanded=true] .studio-skein-body{transform:translateY(-4px)scale(1.04)}}[data-compact=true] .studio-skein-tag{inset:auto -.375rem -.25rem auto;translate:none}[data-compact=true] .studio-skein-string{display:none}[data-layer-value=true] [data-compact=true] .studio-skein-words{padding-top:.375rem}[data-compact=true] .studio-skeins{scroll-snap-type:x mandatory;gap:.25rem;padding:.5rem .125rem .375rem;display:flex;overflow-x:auto}[data-compact=true] .studio-skein{scroll-snap-align:start;flex:none;width:4.25rem}[data-compact=true] .studio-skein-art{width:3.25rem}[data-compact=true] .studio-skein-number{font-size:10px}[data-compact=true] .studio-skein-name{display:none}[data-compact=true] .studio-skein[aria-expanded=true] .studio-skein-body{transform:translateY(-4px)scale(1.04)}@media (prefers-reduced-motion:reduce){.studio-skein-shadow,.studio-skein-body,.studio-skein-mark{transition:none}}.studio-book{grid-template-columns:12rem minmax(0,1fr);align-items:center;gap:.75rem 1.25rem;display:grid}.studio-book-page{box-shadow:3px 3px 0 -1px var(--card), 3px 3px 0 0 var(--border), 6px 6px 0 -1px var(--card), 6px 6px 0 0 var(--border);margin:0 6px 6px 0}.studio-book-swatch{height:6.5rem}.studio-book-words{padding:calc(.5rem * var(--studio-pad)) calc(.625rem * var(--studio-pad)) calc(.625rem * var(--studio-pad))}.studio-book-side{flex-direction:column;gap:.625rem;display:flex}.studio-book-thumbs{flex-wrap:wrap;gap:.5rem;margin:-.25rem;padding:.25rem;display:flex}.studio-book-thumb{width:2.25rem;height:2.25rem;transition:transform .12s}.studio-book-page-value{inset-block:0;border-left:2px solid var(--card);width:1.125rem;position:absolute;right:0}.studio-book-page-warn{top:.375rem;right:1.5rem}.studio-book-cover-value{inset-inline:0;border-top:2px solid var(--card);height:18%;position:absolute;bottom:0}.studio-book-thumb-value{inset-inline:0;pointer-events:none;border-radius:9999px;height:.25rem;position:absolute;bottom:-.4375rem}[data-layer-value=true] .studio-book-thumbs{row-gap:.875rem;padding-bottom:.625rem}.studio-book-thumbs:has(.studio-layer-warn){padding-top:.5rem}@container layers (width<=30rem){.studio-book{grid-template-columns:minmax(0,1fr)}.studio-book-page{grid-template-columns:5rem minmax(0,1fr);display:grid}.studio-book-swatch{height:auto;min-height:5rem}.studio-book-words{align-self:center}.studio-book-side{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem;display:grid}.studio-book-side>:not(.studio-book-thumbs,.studio-book-flip){grid-column:1/-1}.studio-book-thumbs{scroll-snap-type:x mandatory;flex-wrap:nowrap;scroll-padding-inline:.25rem;overflow-x:auto}.studio-book-thumb{scroll-snap-align:start}.studio-book-flip-word{display:none}.studio-book-flip-button{padding:.375rem}}@container studio (height<=32rem){.studio-book{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}.studio-book-page{grid-template-columns:3.25rem minmax(0,1fr);display:grid}.studio-book-swatch{height:auto;min-height:3.25rem}.studio-book-words{align-self:center;padding-block:.375rem}.studio-book-match{margin-top:0}.studio-book-match-label,.studio-book-heading{display:none}.studio-book-side{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem;display:grid}.studio-book-side>:not(.studio-book-thumbs,.studio-book-flip){grid-column:1/-1}.studio-book-thumbs{scroll-snap-type:x mandatory;flex-wrap:nowrap;scroll-padding-inline:.25rem;overflow-x:auto}.studio-book-thumb{scroll-snap-align:start;width:2rem;height:2rem}.studio-book-flip-word{display:none}.studio-book-flip-button{padding:.375rem}}[data-compact=true] .studio-book{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center}[data-compact=true] .studio-book-page{grid-template-columns:3.25rem minmax(0,1fr);display:grid}[data-compact=true] .studio-book-swatch{height:auto;min-height:3.25rem}[data-compact=true] .studio-book-words{align-self:center;padding-block:.375rem}[data-compact=true] .studio-book-match{margin-top:0}[data-compact=true] .studio-book-match-label,[data-compact=true] .studio-book-heading{display:none}[data-compact=true] .studio-book-side{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.5rem;display:grid}[data-compact=true] .studio-book-side>:not(.studio-book-thumbs,.studio-book-flip){grid-column:1/-1}[data-compact=true] .studio-book-thumbs{scroll-snap-type:x mandatory;flex-wrap:nowrap;scroll-padding-inline:.25rem;overflow-x:auto}[data-compact=true] .studio-book-thumb{scroll-snap-align:start;width:2rem;height:2rem}[data-compact=true] .studio-book-flip-word{display:none}[data-compact=true] .studio-book-flip-button{padding:.375rem}@container layers (width<=15rem){[data-compact=true] .studio-book{grid-template-columns:minmax(0,1fr);gap:.5rem}}@media (prefers-reduced-motion:reduce){.studio-book-thumb{transition:none}}