.experiment-catalog>div{border-bottom:1px solid var(--border);grid-template-columns:minmax(5rem,1fr) minmax(0,3fr);gap:1.5rem;padding-block:1rem;display:grid}.experiment-catalog dt,.experiment-options legend,.waiting-examples h2{letter-spacing:normal;font-size:16px;font-weight:400}.experiment-catalog dd,.experiment-note{color:var(--muted-foreground);font-size:16px;line-height:1.45}.experiment-playground{border:1px solid var(--border)}.experiment-disclosure{text-align:left;cursor:pointer;align-items:center;gap:.75rem;width:100%;min-height:76px;padding:1rem;transition:background-color .24s;display:flex}.experiment-disclosure:hover{background:var(--muted)}.experiment-disclosure>svg{flex-shrink:0}.experiment-disclosure-copy{flex:1;gap:.25rem;min-width:0;display:grid}.experiment-disclosure-description,.experiment-disclosure-action{color:var(--muted-foreground);font-size:14px;line-height:1.4}.experiment-panel{height:var(--collapsible-panel-height);transition:height .3s,opacity .24s;overflow:clip}.experiment-panel[data-starting-style],.experiment-panel[data-ending-style]{opacity:0;height:0}.experiment-controls{border-top:1px solid var(--border);gap:1.5rem;padding:1.5rem;display:grid}.experiment-controls>*{min-width:0}.experiment-controls .experiment-note{font-size:14px}.experiment-controls output:empty{display:none}.experiment-options{border:0;flex-wrap:wrap;column-gap:1.5rem;min-width:0;display:flex}.experiment-options legend{margin-bottom:.5rem}.experiment-options label{cursor:pointer;align-items:center;gap:.5rem;min-height:44px;display:inline-flex}.experiment-options input{accent-color:var(--foreground)}.experiment-button,.experiment-select select{border:1px solid var(--border);background:var(--background);min-height:44px;color:var(--foreground);padding:.6rem .9rem;font-size:16px;font-weight:400;line-height:1.45}.experiment-button{cursor:pointer;justify-self:start;transition:border-color .24s}.experiment-button:hover:not(:disabled):not([aria-disabled=true]){border-color:var(--foreground)}.experiment-button:disabled,.experiment-button[aria-disabled=true],.experiment-select select:disabled{opacity:.6;cursor:default}.experiment-playground :is(button,select,input,summary,[tabindex]):focus-visible,.experiment-disclosure:focus-visible{outline:2px solid var(--foreground);outline-offset:4px}.experiment-select{justify-items:start;gap:.5rem;display:grid}.experiment-actions{flex-wrap:wrap;gap:.75rem;display:flex}.spring-track{border-block:1px solid var(--border);justify-content:center;align-items:center;min-width:0;height:144px;display:flex;position:relative}.spring-track:before{content:"";background:var(--border);height:1px;position:absolute;inset-inline:0}.spring-origin{background:var(--border);width:1px;height:64px;position:absolute}.spring-puck{background:var(--foreground);width:48px;height:48px;color:var(--background);cursor:grab;touch-action:pan-y;border-radius:50%;place-items:center;display:grid}.spring-puck:active{cursor:grabbing}.ink-swatch{border-radius:50%;width:12px;height:12px}.ink-sample{border-block:1px solid var(--border);padding-block:1.5rem;line-height:1.45}.ink-sample::selection,.selection-ink-ready .ink-sample[data-highlight-exclude]::selection{background:color-mix(in srgb, var(--selection-color) 40%, var(--background));color:var(--foreground)}.waiting-examples{gap:1.5rem;display:grid}.waiting-examples section{border-bottom:1px solid var(--border);padding-bottom:1rem}.waiting-preview{align-items:center;min-height:90px;display:flex}.waiting-skeleton{gap:.5rem;width:100%;display:grid}.waiting-skeleton [data-slot=skeleton]{background:var(--border);height:10px}.waiting-skeleton [data-slot=skeleton]:nth-child(2){width:80%}.waiting-skeleton [data-slot=skeleton]:last-child{width:55%}.waiting-progress{align-items:center;gap:1rem;width:100%;display:flex}.waiting-progress progress{appearance:none;background:var(--border);border:none;width:100%;height:6px}.waiting-progress progress::-webkit-progress-bar{background:var(--border)}.waiting-progress progress::-webkit-progress-value{background:var(--foreground)}.waiting-progress progress::-moz-progress-bar{background:var(--foreground)}.waiting-progress span{font-variant-numeric:tabular-nums;min-width:4ch;font-size:16px}@media (max-width:360px){.experiment-catalog>div{grid-template-columns:1fr;gap:.5rem}}@media (prefers-reduced-motion:reduce){.experiment-button{transition:none}}@media (forced-colors:active){.ink-sample::selection,.selection-ink-ready .ink-sample[data-highlight-exclude]::selection{color:highlighttext;background:highlight}.spring-puck{border:1px solid buttontext}.waiting-skeleton [data-slot=skeleton]{background:graytext}}.experiment-chevron{transition:transform .24s}.experiment-disclosure[data-panel-open] .experiment-chevron{transform:rotate(180deg)}.waiting-progress [data-slot=progress-track]{background:var(--border);height:6px}.waiting-progress [data-slot=progress-indicator]{background:var(--foreground);transition:none}.easing-lanes{gap:1.5rem;display:grid}.easing-lane{gap:1rem;display:grid}.easing-track{height:32px;margin-right:32px;position:relative}.easing-track:before{content:"";background:var(--border);height:1px;position:absolute;top:15px;left:0;right:-32px}.easing-traveler{background:var(--foreground);border-radius:50%;width:32px;height:32px;transition-property:left;position:absolute}.reordering-list{padding:0;list-style:none}.reordering-list li{border-bottom:1px solid var(--border);background:var(--background);align-items:center;gap:.75rem;min-height:64px;display:flex}.reordering-position{color:var(--muted-foreground);font-variant-numeric:tabular-nums;font-size:14px}.reordering-thought{flex:1;min-width:0}.reordering-actions{flex-shrink:0;display:flex}.reordering-arrow{cursor:pointer;width:44px;height:44px;color:var(--foreground);place-items:center;transition:background-color .24s;display:grid}.reordering-arrow:hover:not([aria-disabled=true]){background:var(--muted)}.reordering-arrow[aria-disabled=true]{opacity:.4;cursor:default}.rhythm-sample{border-block:1px solid var(--border);gap:1em;padding-block:1.5rem;display:grid}@media (prefers-reduced-motion:reduce){.easing-traveler,.reordering-arrow{transition:none}}@media (forced-colors:active){.easing-traveler{background:canvastext}}.experiment-options [data-slot=radio-group]{gap:.5rem}.experiment-options label{border:1px solid var(--border);padding:.5rem .75rem;transition:background-color .24s,border-color .24s}.experiment-options label:has([data-checked]){background:var(--muted);border-color:var(--foreground)}.experiment-options label:hover{background:var(--muted)}.experiment-options legend{color:var(--muted-foreground);font-size:14px}.sliding-tabs-list{border-bottom:1px solid var(--border);display:flex;position:relative}.sliding-tab{min-height:48px;color:var(--muted-foreground);cursor:pointer;flex:1;padding:.75rem;transition:color .24s}.sliding-tab[data-active],.sliding-tab:hover{color:var(--foreground)}.sliding-tab-indicator{height:2px;width:var(--active-tab-width);background:var(--foreground);transform:translateX(var(--active-tab-left));transition:transform .3s cubic-bezier(.16,1,.3,1),width .3s cubic-bezier(.16,1,.3,1);position:absolute;bottom:-1px;left:0}.sliding-tab-panel{min-height:200px;padding-block:1.5rem;line-height:1.45}.sliding-tab-panel h2{margin-bottom:.75rem;font-size:16px;font-weight:400}.sliding-tab-panel p{color:var(--muted-foreground)}@media (max-width:480px){.experiment-controls{padding:1rem}.experiment-disclosure-action{display:none}.experiment-disclosure{gap:.5rem}.sliding-tab-panel{min-height:248px}}@media (prefers-reduced-motion:reduce){.experiment-panel,.experiment-disclosure,.experiment-chevron,.experiment-options label,.sliding-tab,.sliding-tab-indicator{transition:none}}
.liquid-glass{--lg-primary:#8875e8;--lg-track:#e2e2e5;--lg-plinth:#fff;--lg-text:#272431;--lg-stage:#f0edff;--lg-stage-end:#dfd7fb;--lg-glass-tint:#fff;line-height:1.4}.lg-intro,.lg-caption p,.lg-status,.lg-note,.lg-credit{color:var(--muted-foreground);font-size:16px}.lg-intro{margin-bottom:24px}.lg-specimen{border-top:1px solid var(--border);padding-block:24px}.lg-caption{margin-bottom:20px}.lg-caption h2{letter-spacing:normal;gap:14px;font-size:16px;font-weight:400;display:flex}.lg-caption h2>span{color:var(--muted-foreground);font-variant-numeric:tabular-nums;font-size:16px}.lg-caption p{margin-top:8px}.lg-stage{isolation:isolate;background:radial-gradient(ellipse at 30% 75%, #ffffffa0, transparent 65%), linear-gradient(140deg, var(--lg-stage), var(--lg-stage-end));min-height:228px;color:var(--lg-text);border-radius:16px;place-items:center;padding:44px 24px;display:grid;position:relative}.lg-stage:before{content:"";pointer-events:none;z-index:-1;background-image:linear-gradient(90deg,#80749f20 1px,#0000 1px),linear-gradient(#80749f20 1px,#0000 1px);background-size:40px 40px;position:absolute;inset:20px;-webkit-mask-image:radial-gradient(#000,#0000 72%);mask-image:radial-gradient(#000,#0000 72%)}.lg-switch-plinth,.lg-slider-plinth,.lg-segment-plinth{background:var(--lg-plinth);border-radius:24px;padding:24px 36px;box-shadow:0 2px 12px #67588704}.lg-slider-plinth{width:min(100%,360px)}.lg-segment-plinth{border-radius:32px;width:min(100%,430px);padding:12px}.lg-status{margin-top:12px;display:block}.lg-switch{cursor:pointer;touch-action:pan-y;-webkit-tap-highlight-color:transparent;border-radius:24px;width:76px;height:44px;display:block;position:relative}.lg-switch-track{background:var(--lg-track);border-radius:30px;transition:background .24s;position:absolute;inset:7px 0}.lg-switch-track[data-on=true],.lg-switch-refraction[data-on=true]{background:var(--lg-primary)}.lg-switch>.lg-lens{top:10px}.lg-switch-refraction{background:var(--lg-track);border-radius:30px;height:22px;margin-top:-11px;transition:background .24s;position:absolute;top:50%;left:0;right:0}.lg-lens{pointer-events:none;border-radius:999px;display:block;position:absolute;top:0;left:0;box-shadow:0 2px 6px #00000029,inset 0 -4px 10px #00000014}.lg-lens-clip{border-radius:inherit;position:absolute;inset:0;overflow:clip}.lg-source{position:absolute;top:0;left:0;overflow:visible}.lg-filter{pointer-events:none;position:absolute}.lg-rim{border-radius:inherit;background:linear-gradient(135deg,#ffffff14,#0000 45%,#ffffff08);position:absolute;inset:0;box-shadow:inset 0 1px 1px #ffffffb0,inset 0 -1px 1px #655c7620,inset 1px 0 1px #ffffff50}.lg-tint{border-radius:inherit;background:var(--lg-glass-tint);position:absolute;inset:0;box-shadow:inset 0 0 0 1px #00000005}.lg-slider{height:44px;position:relative}.lg-slider-track{inset-inline:0;background:var(--lg-track);border-radius:12px;height:6px;position:absolute;top:19px;overflow:clip}.lg-slider-track>span,.lg-slider-refraction>span{background:var(--lg-primary);border-radius:inherit;height:100%;display:block}.lg-slider>.lg-lens{top:10px}.lg-slider-refraction{inset-inline:0;background:var(--lg-track);border-radius:12px;height:18px;margin-top:-9px;position:absolute;top:50%;overflow:clip}.lg-slider input,.lg-optical>input{appearance:none;cursor:ew-resize;background:0 0;border-radius:24px;width:100%;height:100%;margin:0;position:absolute;inset:0}.lg-slider input::-webkit-slider-thumb{appearance:none;background:0 0;width:44px;height:44px}.lg-slider input::-moz-range-thumb{background:0 0;border:0;width:44px;height:44px}.lg-slider input::-moz-range-track{background:0 0}.lg-optical>input::-moz-range-track{background:0 0}.lg-segments{grid-template-columns:repeat(3,1fr);height:44px;display:grid;position:relative}.lg-segments button{cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:24px;min-width:0;min-height:44px;font-size:16px;position:relative}.lg-segments button[aria-pressed=true]{font-weight:400}.lg-selection-fill{background:#b1a7db35;border-radius:30px;height:30px;margin-top:-15px;transition:left .3s cubic-bezier(.2,.8,.2,1);position:absolute;top:50%}.lg-playground{border-block:1px solid var(--border);margin-top:8px}.lg-playground summary{padding-block:16px}.lg-note{margin-top:12px}.lg-expanded{cursor:pointer;align-items:center;gap:10px;min-height:44px;margin-block:16px;font-size:16px;display:flex}.lg-expanded input{accent-color:var(--foreground)}.lg-optical{background:var(--background);border-radius:16px;height:120px;margin:24px 12px 32px;position:relative}.lg-optical>.lg-lens{top:20px}.lg-optical-source{color:var(--foreground);background-image:repeating-linear-gradient(90deg,#0000 0 15px,#8875e84a 15px 17px);justify-content:space-around;align-items:center;gap:12px;display:flex;position:absolute;inset:0}.lg-optical-source>span{background:var(--background);white-space:nowrap;padding:8px 4px;font-size:16px}.lg-optical>input::-webkit-slider-thumb{appearance:none;background:0 0;width:120px;height:80px}.lg-optical>input::-moz-range-thumb{background:0 0;border:0;width:120px;height:80px}.lg-material{gap:12px;padding-bottom:24px;display:grid}.lg-material>label{justify-content:space-between;font-size:16px;display:flex}.lg-material>input{width:100%;height:44px;accent-color:var(--foreground)}.lg-material output{font-variant-numeric:tabular-nums}.lg-credit{margin-top:24px}.lg-credit a{color:var(--foreground);text-decoration:none}.lg-credit a:hover,.lg-credit a:focus-visible{text-underline-offset:3px;text-decoration:underline}.liquid-glass :is(button,input):focus-visible{outline:2px solid var(--foreground);outline-offset:5px}.dark .liquid-glass{--lg-stage:#242033;--lg-stage-end:#39304f;--lg-track:#45414d;--lg-plinth:#201e27;--lg-text:#f3efff;--lg-glass-tint:#f6f4fa}.dark .lg-stage{background:radial-gradient(ellipse at 30% 75%, #8170ae20, transparent 65%), linear-gradient(140deg, var(--lg-stage), var(--lg-stage-end))}.dark .lg-selection-fill{background:#b6a7e64d}@media (max-width:480px){.lg-stage{min-height:200px;padding:36px 16px}.lg-slider-plinth{padding-inline:28px}.lg-segment-plinth{padding-inline:8px}.lg-segments button{font-size:16px}}@media (prefers-reduced-motion:reduce){.liquid-glass *,.liquid-glass :before{transition:none!important}}@media (prefers-reduced-transparency:reduce){.lg-lens-clip{visibility:hidden}.lg-tint{opacity:1!important}.lg-segments .lg-tint{background:var(--lg-track)}}@media (forced-colors:active){.lg-lens,.lg-switch{border:1px solid buttontext}.lg-lens-clip,.lg-rim{display:none}.lg-tint{background:canvas;opacity:1!important}.lg-slider input,.lg-optical>input{appearance:auto}.lg-slider input::-webkit-slider-thumb{appearance:auto}.lg-optical>input::-webkit-slider-thumb{appearance:auto}.lg-slider input::-moz-range-thumb{background:buttontext}.lg-optical>input::-moz-range-thumb{background:buttontext}.lg-slider-track{background:graytext}.lg-segments button[aria-pressed=true]{outline:2px solid highlight}}.lg-source{background:var(--lg-plinth)}.lg-optical .lg-source{background:var(--background)}.lg-source-content{transform-origin:50%;display:block;position:absolute}.lg-slider input,.lg-optical>input{box-shadow:none;border:0;padding:0}.lg-lens{box-shadow:0 2px 5px #00000018}.lg-lens[data-active=true]{box-shadow:0 4px 9px #00000020}.lg-rim{background:0 0;box-shadow:inset 0 0 0 .5px #00000012,inset 0 1px 1px #ffffff80}.lg-selection-source{color:#6042bd;grid-template-columns:repeat(3,1fr);align-items:center;display:grid;position:absolute;inset:0}.lg-selection-source>span{background:#a690ed18;place-items:center;height:100%;display:grid}.lg-segments>.lg-lens{z-index:1}.lg-segments button[aria-pressed=true]{color:#0000}.dark .lg-selection-source{color:#d0bfff}@media (forced-colors:active),(prefers-reduced-transparency:reduce){.lg-segments>.lg-lens{z-index:0}.lg-segments button[aria-pressed=true]{color:inherit}}