@layer base,components;@layer base{:root{--color-white:#ddd;--color-gray:#999;--color-black:#000;--color-text:var(--color-black);--color-sheet:var(--color-white)}@media (prefers-color-scheme:dark){:root{--color-sheet:var(--color-gray)}}:root{--font-main:system-ui, -apple-system, blinkmacsystemfont, avenir next, avenir, segoe ui, sans-serif;--leading:1.4;--space-base:2rem;--space-scale:2;--space-xxs:calc(var(--space-xs) / var(--space-scale));--space-xs:calc(var(--space-s) / var(--space-scale));--space-s:calc(var(--space-m) / var(--space-scale));--space-m:var(--space-base);--space-l:calc(var(--space-m) * var(--space-scale));--space-xl:calc(var(--space-l) * var(--space-scale));--space-xxl:calc(var(--space-xl) * var(--space-scale))}}@layer base{*,::before,::after{box-sizing:border-box;margin:0;padding:0}::selection{color:var(--color-sheet);background-color:var(--color-text)}html{background-color:var(--color-sheet);overflow-x:hidden;overscroll-behavior:none}body{overflow:hidden;overscroll-behavior:none;color:var(--color-text);background-color:var(--color-sheet)}button{font-family:var(--font-main);font-size:inherit}sound-player{display:contents}}@layer components{.button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:10rem;height:2.5rem;color:var(--color-text);background-color:transparent;border:0;appearance:none;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease;text-transform:uppercase;background-image:url(/assets/toggle.gif);background-size:200% 100%;background-position:0 0;background-repeat:no-repeat;image-rendering:pixelated}.button.--active{background-position:100%0}.button.--active:before{left:auto;right:0}.button>span{width:3.125em;height:2.5em;position:absolute;background-size:100% 100%;background-position:0 0;background-repeat:no-repeat;image-rendering:pixelated}.button>span:first-child{left:-33%;background-image:url(/assets/off.gif)}.button>span:last-child{right:-30%;background-image:url(/assets/on.gif)}.button__icon{width:var(--space-l);height:var(--space-l);background-color:var(--color-text);clip-path:polygon(10%0,50% 25%,90% 50%,10% 100%);transform:translateX(.25em);opacity:.7;transition:clip-path .2s ease,transform .2s ease,opacity .2s ease}.button.--active .button__icon{clip-path:polygon(0 0,100%0,100% 100%,0 100%);transform:translateX(0);opacity:.8}@media (hover:hover){.button:hover .button__icon{opacity:.8}}}@layer components{@keyframes fan-spin{0%{background-position:0 0}50%{background-position:100%0}}@keyframes open-louvers{0%{transform:scaleY(100%)}50%{transform:scaleY(75%)}to{transform:scaleY(50%)}}.fan{aspect-ratio:1/1;width:min(400px,80vw);height:auto;position:relative}.fan .frame{position:absolute;inset:0;background-image:url(/assets/frame.gif);background-size:100% 100%;background-position:0 0;background-repeat:no-repeat;image-rendering:pixelated;z-index:3}.fan .blades{z-index:1;position:absolute;aspect-ratio:1/1;inset:0;background-image:url(/assets/blades.gif);background-size:200% 100%;background-position:0 0;background-repeat:no-repeat;image-rendering:pixelated}.fan .blades.--active{animation:fan-spin .1s step-start infinite}@media (prefers-reduced-motion){.fan .blades.--active{animation:none}}.fan .louvers{z-index:2;position:absolute;inset-block:6.5%;inset-inline:6.5%;display:flex;flex-direction:column}.fan .louvers .louver{position:relative;flex-grow:1;background-color:var(--color-sheet);border:2px solid var(--color-text);border-left:none!important;border-right:none!important;transition:all .1s steps(3,start);background-image:url(/assets/louvers.gif);background-size:140%;background-position:0-1rem;background-repeat:no-repeat;image-rendering:pixelated}.fan.--active :is(.fan .louvers .louver){margin-top:10%;background-position:0 0}}@layer components{.layout{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh;height:100dvh;gap:var(--space-l)}}
/*# sourceMappingURL=main.css.map */