.tilt{flex-direction:column;width:100%;height:100%;display:flex}.tilt__viewport{perspective:900px;perspective-origin:50%;flex:1;min-height:0;overflow:hidden;container-type:inline-size}.tilt__scene{width:100%;height:100%;transform-style:preserve-3d;position:relative}.tilt__layer{transform-style:preserve-3d;position:absolute;inset:0}.tilt__layer--front{place-items:center;display:grid;transform:translateZ(80px)}.tilt__shape{display:block;position:absolute;translate:-50% -50%}.tilt__shape svg{width:100%;height:100%;display:block}.tilt__logo{pointer-events:none;width:min(44%,15rem);height:auto}.tilt--still{pointer-events:none}.tilt--still .tilt__scene{transform:rotateX(9deg)rotateY(-16deg)}.tilt__viewport{touch-action:pan-y}
.pe{flex-direction:column;width:100%;height:100%;display:flex}.pe__stage{flex:1;min-height:0;position:relative}.pe__svg{width:100%;height:100%;display:block;overflow:visible}.pe__path{fill:none;stroke:var(--demo-hue);stroke-width:2px;stroke-linecap:round}.pe__marker{fill:var(--colour-solstice)}.pe--still{pointer-events:none}.pe--still .pe__marker{transform:translate(33px,223px)}
.loop{flex-direction:column;width:100%;height:100%;display:flex}.loop__stage{flex:1;min-height:0;overflow:hidden}.loop__svg{width:100%;height:100%;display:block}.loop__ribbon{stroke:var(--demo-hue);cursor:default}.loop__text{font-family:var(--font-sans);letter-spacing:2px;fill:var(--ink-on-colour);-webkit-user-select:none;user-select:none;pointer-events:none;font-size:46px;font-weight:800}.loop__measure{font-family:var(--font-sans);letter-spacing:2px;visibility:hidden;pointer-events:none;font-size:46px;font-weight:800}.loop--still{pointer-events:none}
.press{flex-direction:column;width:100%;height:100%;display:flex}.press__stage{min-height:0;padding:var(--space-4);flex:1;place-items:center;display:grid;container-type:inline-size}.press__title{width:100%;font-family:var(--font-sans);white-space:nowrap;-webkit-user-select:none;user-select:none;justify-content:space-between;font-size:clamp(1.75rem,15cqw,6rem);line-height:1;display:flex}.press__char{font-variation-settings:"wght" 300;color:var(--colour-aurora);will-change:font-variation-settings, color;display:inline-block}.press--still{pointer-events:none}.press__stage{touch-action:pan-y}
.pit{width:100%;height:100%;position:relative;overflow:hidden}.pit__stage{inset:var(--pit-inset,0);cursor:grab;position:absolute}.pit__stage:active{cursor:grabbing}.pit canvas{width:100%;height:100%;display:block}.pit--still{pointer-events:none}.pit--still .pit__stage{cursor:default}.pit canvas{touch-action:none}
.scramble{flex-direction:column;width:100%;height:100%;display:flex;container-type:inline-size}.scramble__stage{min-height:0;padding:var(--space-4);flex:1;place-items:center;display:grid}.scramble__phrase{font-family:var(--font-mono);letter-spacing:-.02em;color:var(--ink-primary);font-size:clamp(1.25rem,9cqw,3.5rem);font-weight:600;line-height:1.1;display:flex}.scramble__char{cursor:default}.scramble--still{pointer-events:none}
.flow{background:var(--snip-panel,var(--surface-raised));width:100%;height:100%;position:relative;overflow:hidden}.flow__canvas{width:100%;height:100%;display:block}.flow--still{pointer-events:none}.flow__canvas{touch-action:pan-y}
.goo{place-items:center;width:100%;height:100%;display:grid;position:relative;overflow:hidden}.goo__svg{width:100%;height:100%}.goo__blob{will-change:cx, cy}.goo--still{pointer-events:none}
.spring{width:100%;height:100%;position:relative;overflow:hidden}.spring__stage{place-items:center;display:grid;position:absolute;inset:0}.spring__rest{background:var(--colour-void-40,#ffffff4d);border-radius:50%;width:.5rem;height:.5rem;position:absolute}.spring__handle{background:radial-gradient(circle at 35% 30%, var(--colour-solstice), var(--demo-hue));cursor:grab;touch-action:none;will-change:transform;border:0;border-radius:50%;width:3.4rem;height:3.4rem;padding:0;position:relative;box-shadow:0 10px 24px #00000038}.spring__handle--grabbed{cursor:grabbing}.spring__handle:disabled{cursor:default}.spring--still{pointer-events:none}@media (max-width:40rem){.spring__handle{width:2.9rem;height:2.9rem}}
.cloth{width:100%;height:100%;position:relative;overflow:hidden}.cloth__canvas{cursor:grab;touch-action:none;width:100%;height:100%;display:block}.cloth__canvas:active{cursor:grabbing}.cloth--still{pointer-events:none}.cloth--still .cloth__canvas{cursor:default}
.filings{background:var(--snip-panel,var(--surface-raised));width:100%;height:100%;position:relative;overflow:hidden}.filings__canvas{width:100%;height:100%;display:block}.filings--still{pointer-events:none}.filings__canvas{touch-action:pan-y}
.vm{background:var(--snip-panel,var(--surface-raised));width:100%;height:100%;position:relative;overflow:hidden}.vm__scroller{overscroll-behavior:contain;scrollbar-width:none;position:absolute;inset:0;overflow-y:auto}.vm__scroller::-webkit-scrollbar{display:none}.vm__stage{flex-direction:column;justify-content:center;gap:.35em;height:100%;display:flex;position:sticky;top:0;overflow:hidden}.vm__track{height:800%}.vm__row{font-family:var(--font-sans);white-space:nowrap;will-change:transform;font-size:clamp(2rem,7vw,3.5rem);line-height:1}.vm__row:first-child{color:var(--demo-hue)}.vm__row:nth-child(2){color:var(--demo-hue-light)}.vm__row:nth-child(3){color:var(--demo-hue-dark)}.vm--still{pointer-events:none}.vm--still .vm__row:nth-child(2){transform:translate(-30%)}.vm--still .vm__row:nth-child(3){transform:translate(-12%)}
.ripple{background:var(--snip-panel,var(--surface-raised));width:100%;height:100%;position:relative;overflow:hidden}.ripple__canvas{cursor:crosshair;touch-action:pan-y;width:100%;height:100%;display:block}.ripple--still{pointer-events:none}
.boids{background:var(--snip-panel,var(--surface-raised));width:100%;height:100%;position:relative;overflow:hidden}.boids__canvas{touch-action:pan-y;width:100%;height:100%;display:block}.boids--still{pointer-events:none}