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