@property --text-animations{syntax: "<angle>"; inherits: true; initial-value: 0deg;}h1.svelte-8ddee2{text-align:center;margin-bottom:1em;animation:svelte-8ddee2-growshrink .7s ease-in-out;animation-iteration-count:5;transform:rotate(var(--text-animations))}@keyframes svelte-8ddee2-growshrink{to{--text-animations: 360deg}}ul.svelte-8ddee2{list-style-type:none;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:2em}@media (min-width: 1080px){ul.svelte-8ddee2{grid-template-columns:repeat(auto-fill,minmax(400px,1fr))}}@property --card-content{syntax: "<number> | <color> | <angle>"; inherits: false; initial-value: red;}li.svelte-8ddee2{--card-content: 20deg;text-align:center;padding:.5em;border-radius:8px;animation:svelte-8ddee2-fadeIn 1s forwards;animation-delay:.5s;position:relative;transition:transform .3s ease}li.svelte-8ddee2 p:where(.svelte-8ddee2){color:var(--card-content)}@keyframes svelte-8ddee2-fadeIn{0%{opacity:0}to{opacity:1}}@supports (animation-timeline: view()){img.svelte-8ddee2{--card-content: 10deg;animation:svelte-8ddee2-straighten linear both;animation-timeline:view();transform:rotate(var(--card-content))}@keyframes svelte-8ddee2-straighten{0%{--card-content: 10deg;scale:.8}50%{--card-content: 0deg;scale:1}to{--card-content: 10deg;scale:.8}}}img.svelte-8ddee2{aspect-ratio:300 / 419;height:auto;width:200px;position:relative}@media (min-width: 1080px){img.svelte-8ddee2{width:400px}}.hover-blocks.svelte-8ddee2{position:absolute;top:0;left:0;width:100%;height:100%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);pointer-events:all}.hover-block.svelte-8ddee2{z-index:100;pointer-events:all}li.svelte-8ddee2:has(.hover-block.number0:where(.svelte-8ddee2):hover){transform:rotateX(var(--card-content)) rotateY(calc(-1 * var(--card-content)))}li.svelte-8ddee2:has(.hover-block.number1:where(.svelte-8ddee2):hover){transform:rotateX(var(--card-content)) rotateY(0)}li.svelte-8ddee2:has(.hover-block.number2:where(.svelte-8ddee2):hover){transform:rotateX(var(--card-content)) rotateY(var(--card-content))}li.svelte-8ddee2:has(.hover-block.number3:where(.svelte-8ddee2):hover){transform:rotateX(0) rotateY(calc(-1 * var(--card-content)))}li.svelte-8ddee2:has(.hover-block.number4:where(.svelte-8ddee2):hover){transform:rotateX(0) rotateY(0)}li.svelte-8ddee2:has(.hover-block.number5:where(.svelte-8ddee2):hover){transform:rotateX(0) rotateY(var(--card-content))}li.svelte-8ddee2:has(.hover-block.number6:where(.svelte-8ddee2):hover){transform:rotateX(calc(-1 * var(--card-content))) rotateY(calc(-1 * var(--card-content)))}li.svelte-8ddee2:has(.hover-block.number7:where(.svelte-8ddee2):hover){transform:rotateX(calc(-1 * var(--card-content))) rotateY(0)}li.svelte-8ddee2:has(.hover-block.number8:where(.svelte-8ddee2):hover){transform:rotateX(calc(-1 * var(--card-content))) rotateY(var(--card-content))}
