@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:block))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-outline-style:solid}}}@layer utilities{.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.relative{position:relative}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}}.ks-example-settings,.ks-example-states,.ks-example-comparison{color:var(--ks-foreground);font-family:var(--ks-font-body)}.ks-example-settings,.ks-example-states,.ks-example-comparison,.ks-example-scopes,.ks-example-scope{gap:var(--ks-spacing);min-inline-size:0;display:grid}.ks-example-settings,.ks-example-states,.ks-example-comparison-toolbar,.ks-example-scope{border-radius:var(--ks-radius);background:var(--ks-background);padding:clamp(1rem,2.5vw,1.75rem)}.ks-example-panel{margin-block-start:var(--ks-spacing)}.ks-example-settings .ks-example-panel{max-inline-size:36rem}.ks-example-settings [data-slot=tabs-list],.ks-example-states [data-slot=tabs-list]{flex-wrap:wrap}.ks-example-settings [data-slot=select-trigger],.ks-example-states [data-slot=select-trigger]{align-self:flex-start;max-inline-size:100%}.ks-example-actions,.ks-example-settings-footer,.ks-example-comparison-toolbar{align-items:center;gap:var(--ks-space-compact);flex-wrap:wrap;display:flex}.ks-example-settings-footer,.ks-example-comparison-toolbar{justify-content:space-between}.ks-example-settings-footer{border-block-start:1px solid var(--ks-border);padding-block-start:var(--ks-spacing)}.ks-example-settings-footer [aria-disabled=true]{color:var(--ks-muted);cursor:default}.ks-example-note{color:var(--ks-muted);font-size:.875rem;line-height:1.45}.ks-example-states,.ks-example-scopes{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}.ks-example-state-group{align-content:start;gap:var(--ks-space-compact);min-inline-size:0;padding:var(--ks-spacing);border-radius:var(--ks-radius);background:var(--ks-surface);display:grid}.ks-example-label,.ks-example-scope h3{font-family:var(--ks-font-display);line-height:1.2}.ks-example-label{font-size:1.125rem}.ks-example-scopes{grid-template-columns:repeat(auto-fit,minmax(min(100%,22rem),1fr))}.ks-example-scope{border:1px solid var(--ks-border);color:var(--ks-foreground);align-content:start}.ks-example-scope h3{color:var(--ks-primary);margin-block-end:var(--ks-space-tight);font-size:1.375rem}.ks-example-scope .ks-example-settings{padding:0}.ks-example-portal:empty{display:none}.ks-example-custom-theme{--studio-action:#285a50;--studio-marble:#285a50;--ks-primary:var(--studio-action);--ks-focus:var(--studio-action);--ks-button-marble-background:var(--studio-marble);--ks-button-radius:1.25rem}.ks-example-custom-theme[data-theme=dark]{--studio-action:#8bdbbf;--studio-marble:#245549}.ks-foundation{justify-items:start;gap:var(--ks-space-compact);padding:var(--ks-spacing);border-radius:var(--ks-radius);background:var(--ks-surface-raised);color:var(--ks-foreground);font-family:var(--ks-font-body);display:grid}.ks-foundation-heading{font-family:var(--ks-font-display);font-size:1.25rem}.ks-foundation-muted{color:var(--ks-muted)}.ks-foundation code{font-family:var(--ks-font-code)}.ks-foundation-statuses,.ks-foundation-series{gap:var(--ks-space-compact);flex-wrap:wrap;display:flex}.ks-foundation-statuses li{padding:var(--ks-space-tight) var(--ks-space-compact);border-radius:var(--ks-radius)}.ks-foundation-statuses [data-tone=success]{background:var(--ks-success-surface);color:var(--ks-success-foreground)}.ks-foundation-statuses [data-tone=warning]{background:var(--ks-warning-surface);color:var(--ks-warning-foreground)}.ks-foundation-statuses [data-tone=danger]{background:var(--ks-danger-surface);color:var(--ks-danger-foreground)}.ks-foundation-series li{border-block-end:.25rem solid var(--ks-data-series-1)}.ks-foundation-series li:nth-child(2){border-color:var(--ks-data-series-2)}.ks-foundation-series li:nth-child(3){border-color:var(--ks-data-series-3)}.ks-foundation-series li:nth-child(4){border-color:var(--ks-data-series-4)}.ks-foundation [data-slot=button]{transition:filter var(--ks-motion-duration) ease-out}@media (prefers-reduced-motion:reduce){.ks-foundation [data-slot=button]{transition:none}}body:has(.workshop){background:var(--ks-background)}.workshop{--workshop-gutter:clamp(1.25rem, 4vw, 4rem);background:var(--ks-background);min-height:100svh;color:var(--ks-foreground);font:1rem / 1.55 var(--ks-font-body);flex-direction:column;display:flex}.workshop-frame{width:min(100% - 2 * var(--workshop-gutter), 80rem);margin-inline:auto}.workshop-header,.workshop-footer,.workshop-brand,.workshop-nav{align-items:center;display:flex}.workshop-header,.workshop-footer{flex-wrap:wrap;justify-content:space-between;gap:.75rem 1.5rem}.workshop-header{min-height:5rem;padding-block:.625rem}.workshop-brand{gap:.6rem;min-height:2.75rem;font-weight:700}.workshop-mark{background:var(--ks-primary);block-size:1.7rem;inline-size:1.7rem;color:var(--ks-background);font:1.15rem / 1 var(--ks-font-display);border-radius:50%;place-items:center;display:grid}.workshop-nav{gap:clamp(.65rem,3vw,2rem)}.workshop-nav>a{align-items:center;min-height:2.75rem;display:grid}.workshop :where(a):focus-visible,.workshop-snippet pre:focus-visible{outline:2px solid var(--ks-focus);outline-offset:3px}.workshop-nav>a:hover,.workshop-inline:hover{text-decoration-thickness:2px}.workshop-nav>a:hover{text-decoration-line:underline}.workshop-skip{z-index:10;inset:0 auto auto var(--workshop-gutter);background:var(--ks-surface-raised);padding:.625rem 1rem;position:absolute;transform:translateY(-150%)}.workshop-skip:focus{transform:translateY(.5rem)}.workshop-main{flex:1;padding-block:clamp(1.5rem,4vw,3.75rem) clamp(4rem,9vw,8rem)}.workshop-hero{background:var(--ks-surface);grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);display:grid}.workshop-hero-copy,.workshop-stage{padding:clamp(1.5rem,4.5vw,4rem)}.workshop-hero-copy{align-self:end}.workshop h1,.workshop-section h2,.workshop-stage h2,.workshop-guide h2{font-family:var(--ks-font-display);letter-spacing:-.035em;font-weight:400;line-height:1.05}.workshop h1{font-size:clamp(2.4rem,5.5vw,5.2rem)}.workshop-hero-copy>p,.workshop-page-intro>p{max-width:39ch;margin-block:1.25rem 1.75rem;font-size:clamp(1.05rem,1.65vw,1.25rem)}.workshop-stage{background:var(--ks-surface-raised);align-content:center;min-width:0}.workshop-stage h2,.workshop-section h2,.workshop-guide h2{font-size:clamp(1.7rem,3vw,2.65rem)}.workshop-stage>p{color:var(--ks-muted);margin-block:.5rem 1.1rem}.workshop-stage .ks-example-settings{border:1px solid var(--ks-border)}.workshop-section{margin-block-start:clamp(3rem,7vw,6.5rem)}.workshop-section-intro{margin-block-end:1.4rem}.workshop-section-intro>p{max-width:52ch;margin-block-start:.65rem}.workshop-board{gap:.4rem;display:grid}.workshop-board-row{background:var(--ks-surface);transition:background-color var(--ks-motion-duration) ease-out;grid-template-columns:minmax(0,.7fr) minmax(0,1fr) auto;align-items:center;gap:.5rem 1.5rem;padding:clamp(.9rem,2.5vw,1.6rem);display:grid}.workshop-board-row:hover{background:var(--ks-surface-raised)}.workshop-board-row strong{font:1.35rem / 1.15 var(--ks-font-display)}.workshop-arrow{color:var(--ks-primary);font-size:1.25rem}.workshop-install{background:var(--ks-surface);grid-template-columns:minmax(0,.7fr) minmax(0,1fr);gap:1rem 2rem;padding:clamp(1.25rem,4vw,3rem);display:grid}.workshop-inline{min-height:2.75rem;color:var(--ks-primary);text-underline-offset:.25em;align-items:center;gap:.35em;text-decoration:underline;display:inline-flex}.workshop-page-intro{margin-block-end:clamp(1.5rem,4vw,3.25rem)}.workshop-page-intro>a{margin-block-end:.625rem}.workshop-page-intro>p{max-width:56ch;margin-block-end:0}.workshop-demo{background:var(--ks-surface);padding:clamp(.65rem,2.5vw,2rem)}.workshop-guide{gap:clamp(2.5rem,5vw,5rem);max-width:58rem;display:grid}.workshop-guide section,.workshop-guide dl{gap:1rem;min-width:0;display:grid}.workshop-guide p,.workshop-guide dd{max-width:66ch}.workshop-guide p code,.workshop-guide dd code{overflow-wrap:anywhere}.workshop-guide dt{font-weight:700}.workshop-snippet{background:var(--ks-surface);grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:.75rem;padding:clamp(.75rem,2vw,1.5rem);display:grid}.workshop-snippet pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.9rem;line-height:1.5}.workshop-footer{color:var(--ks-muted);padding-block:1rem 2rem;font-size:.875rem}@media not all and (min-width:54rem){.workshop-hero{grid-template-columns:minmax(0,1fr)}}@media not all and (min-width:37rem){.workshop-nav{width:100%}.workshop-nav>button{margin-inline-start:auto}.workshop-board-row{grid-template-columns:minmax(0,1fr) auto}.workshop-board-row>span:nth-child(2){grid-area:2/1}.workshop-arrow{grid-area:1/2/3}.workshop-install{grid-template-columns:minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.workshop-board-row{transition:none}}@media (prefers-reduced-motion:no-preference){.workshop-hero-copy>*,.workshop-stage>*,.workshop-section-intro>*,.workshop-hero~section .workshop-board-row{animation:.46s ease-out both workshop-enter}.workshop-hero-copy>:nth-child(2),.workshop-stage>:nth-child(2),.workshop-section-intro>:nth-child(2){animation-delay:60ms}.workshop-hero-copy>:nth-child(3),.workshop-stage>:nth-child(3){animation-delay:.12s}}@keyframes workshop-enter{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:translateY(0)}}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}