.shape{display:flex;align-items:center;justify-content:center;color:var(--on-primary);background-color:var(--primary);mask-repeat:no-repeat;mask-position:center;mask-size:contain;border-radius:0;block-size:3.5rem;inline-size:3.5rem;margin:0!important;padding:0!important;border:0!important}.transparent>.shape>i{filter:invert(1)}.shape.tiny-space{mask-size:90%}.shape.small-space,.shape.space{mask-size:80%}.shape.medium-space{mask-size:70%}.shape.large-space{mask-size:60%}.shape.extra-space{mask-size:50%}.shape.tiny{block-size:2.5rem;inline-size:2.5rem}.shape.medium{block-size:4.5rem;inline-size:4.5rem}.shape.large{block-size:5.5rem;inline-size:5.5rem}.shape.extra{block-size:6.5rem;inline-size:6.5rem}.shape.max,.shape>.responsive,.shape>.responsive>.responsive{position:absolute;inset:0;block-size:100%;inline-size:100%;margin:0!important;padding:0!important;border:0!important}.shape>.responsive{background:inherit;color:inherit}.shape.rotate{animation:to-rotate 12s linear infinite}.shape.rotate>*{animation:to-rotate 12s linear infinite reverse}.shape.fast-rotate{animation:to-rotate 6s linear infinite}.shape.fast-rotate>*{animation:to-rotate 6s linear infinite reverse}.shape.slow-rotate{animation:to-rotate 24s linear infinite}.shape.slow-rotate>*{animation:to-rotate 24s linear infinite reverse}:is(button,.button,.chip):has(>.shape)>.responsive{border:none}.shape.arch{mask-image:url(../arch.svg)}.shape.arrow{mask-image:url(../arrow.svg)}.shape.boom{mask-image:url(../boom.svg)}.shape.bun{mask-image:url(../bun.svg)}.shape.burst{mask-image:url(../burst.svg)}.shape.circle{mask-image:url(../circle.svg)}.shape.clamshell{mask-image:url(../clamshell.svg)}.shape.diamond{mask-image:url(../diamond.svg)}.shape.fan{mask-image:url(../fan.svg)}.shape.flower{mask-image:url(../flower.svg)}.shape.gem{mask-image:url(../gem.svg)}.shape.ghost-ish{mask-image:url(../ghost-ish.svg)}.shape.heart{mask-image:url(../heart.svg)}.shape.leaf-clover4{mask-image:url(../leaf-clover4.svg)}.shape.leaft-clover8{mask-image:url(../leaf-clover8.svg)}.shape.loading-indicator{mask-image:url(../loading-indicator.svg)}.shape.oval{mask-image:url(../oval.svg)}.shape.pentagon{mask-image:url(../pentagon.svg)}.shape.pill{mask-image:url(../pill.svg)}.shape.pixel-circle{mask-image:url(../pixel-circle.svg)}.shape.pixel-triangle{mask-image:url(../pixel-triangle.svg)}.shape.puffy{mask-image:url(../puffy.svg)}.shape.puffy-diamond{mask-image:url(../puffy-diamond.svg)}.shape.semicircle{mask-image:url(../semicircle.svg)}.shape.sided-cookie4{mask-image:url(../sided-cookie4.svg)}.shape.sided-cookie6{mask-image:url(../sided-cookie6.svg)}.shape.sided-cookie7{mask-image:url(../sided-cookie7.svg)}.shape.sided-cookie9{mask-image:url(../sided-cookie9.svg)}.shape.sided-cookie12{mask-image:url(../sided-cookie12.svg)}.shape.slanted{mask-image:url(../slanted.svg)}.shape.soft-boom{mask-image:url(../soft-boom.svg)}.shape.soft-burst{mask-image:url(../soft-burst.svg)}.shape.square{mask-image:url(../square.svg)}.shape.sunny{mask-image:url(../sunny.svg)}.shape.triangle{mask-image:url(../triangle.svg)}.shape.very-sunny{mask-image:url(../very-sunny.svg)}