.alert-wrapper{position:fixed;top:0;width:100%;height:100vh;display:flex;justify-content:center;pointer-events:none;overflow:hidden}.alert-relative{position:relative}.alert{position:absolute;pointer-events:all;display:flex;align-items:center;background-color:var(--background);bottom:-400px;transform:translate(-50%);border-radius:4px;box-shadow:0 3px 5px var(--contrast);min-width:350px;padding:.5rem;gap:.5rem;background-color:var(--alert-primary)}.alert-content{padding:.5rem;flex:1;font-weight:700}.slide-up{animation:SlideUp var(--alert-transition-time) ease 0s 1 forwards}@keyframes SlideUp{0%{bottom:-200px}50%{bottom:2.5rem}75%{bottom:1.75rem}90%{bottom:2.2rem}to{bottom:2rem}}.slide-down{animation:SlideDown var(--alert-transition-time) ease 0s 1 forwards}@keyframes SlideDown{0%{bottom:2rem}to{bottom:-200px}}.alert-close-button{display:flex;justify-content:center;align-items:center;width:2rem;height:2rem;border-radius:4px;border:2px solid var(--contrast);color:var(--contrast);margin-right:.5rem;cursor:pointer;transition:all .1s ease;opacity:.75}.alert-close-button:hover{color:var(--alert-primary);background-color:var(--contrast);opacity:.5}.code-snippet{border-radius:8px;background-color:var(--bg-offset);font-family:monospace;padding:1rem;gap:.25rem;display:flex;flex-direction:column;position:relative}.code-snippet .copy{position:absolute;z-index:2;right:0;top:0;padding:1rem;background-color:transparent;border:none;color:var(--primary-66);cursor:pointer;transition:all .1s ease}.code-snippet .copy:hover{color:var(--primary)}.code-snippet p{color:var(--primary-bb);padding:0;margin:0}.about-app{width:min(100vw,600px);padding:.5rem}.about-app .code-snippet{margin-bottom:.5rem}.about-app p{margin-top:0}.about-app h1{margin-top:2rem;margin-bottom:1rem}.about-app .birbs{padding:.5rem;width:100%;justify-content:center;display:flex;font-size:1rem}.about-app .birbs .cage{position:relative;width:10px;height:2rem}.about-app .birbs .cage svg{position:absolute;z-index:10;color:var(--background)}.about-app .birbs .cage svg:nth-child(1){color:var(--palette-5);left:5px;z-index:5;opacity:.5}.about-app .birbs .cage svg:nth-child(2){color:var(--palette-4);left:10px;z-index:4;opacity:.5}.about-app .birbs .cage svg:nth-child(3){color:var(--palette-3);left:15px;z-index:3;opacity:.5}.about-app .birbs .cage svg:nth-child(4){color:var(--palette-2);left:20px;z-index:2;opacity:.5}.about-app .birbs .cage svg:nth-child(5){color:var(--palette-1);left:25px;z-index:1;opacity:.5}.about-app .birbs .cage svg:nth-child(6){color:var(--palette-5);right:-5px;z-index:5;opacity:.5}.about-app .birbs .cage svg:nth-child(7){color:var(--palette-4);right:0;z-index:4;opacity:.5}.about-app .birbs .cage svg:nth-child(8){color:var(--palette-3);right:5px;z-index:3;opacity:.5}.about-app .birbs .cage svg:nth-child(9){color:var(--palette-2);right:10px;z-index:2;opacity:.5}.about-app .birbs .cage svg:nth-child(10){color:var(--palette-1);right:15px;z-index:1;opacity:.5}.number-container{font-size:.75rem}.number-container input[type=number]{width:100%;text-align:end;background-color:var(--background);color:var(--primary);border:none}.number-container input[type=number]:focus{background-color:var(--primary-22);border:none;outline:1px solid var(--primary)}.number-container input::-webkit-outer-spin-button,.number-container input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-container input[type=number]{-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.range-container{position:relative;display:flex;width:100%;font-size:.75rem;--button-width: 1rem;--right-gap: .25rem;overflow:hidden}.range-container .left{width:33.3%}.range-container .right{position:relative;width:66.6%;display:flex;gap:var(--right-gap)}.range-container .right button{border:none;background-color:transparent;color:var(--primary);width:var(--button-width);cursor:pointer;transition:all .1s ease}.range-container .right button:active{scale:.9}.range-container .value-bar{position:absolute;left:calc(var(--button-width) + var(--right-gap));top:0;height:100%;background-color:var(--palette-1);z-index:0;border-right:1px solid var(--primary)}.range-container .value-text{width:2rem;text-align:end}.range-container input[type=range]{z-index:1;position:relative;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;cursor:pointer;width:75%;margin:1px 0}.range-container input[type=range]:focus{background-color:var(--primary-22);border:none;outline:1px solid var(--primary)}.range-container input[type=range]::-webkit-slider-runnable-track{background:var(--background);height:2px;border-radius:4px;background-color:var(--offset)}.range-container input[type=range]::-moz-range-track{background:var(--background);height:2px;border-radius:4px;background-color:var(--offset)}.range-container input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:100%;width:1px;background-color:var(--primary)}.range-container input[type=range]::-moz-range-thumb{border:none;border-radius:100px;height:10px;width:10px;background-color:var(--primary)}.range-container.no-increment .value-bar{left:0}.select{position:relative;width:100%}.select .selected{display:flex;align-items:center;gap:.5rem;background-color:var(--primary);color:var(--background);border-radius:4px;border:2px solid var(--offset);padding:.5rem;cursor:pointer}.select .options-container{position:absolute;opacity:0;pointer-events:none;transition:all .25s ease;display:flex;flex-direction:column;width:100%;z-index:3;color:var(--background)}.select .options-container .options{background-color:var(--primary);border-radius:4px;box-shadow:1px 1px 5px var(--background);overflow-y:auto}.select .options-container .options .option{width:100%;cursor:pointer;text-align:end;padding:.5rem;border-bottom:1px solid var(--offset);transition:all .1s ease;display:flex;align-items:center}.select .options-container .options .option:last-of-type{border-bottom:none}.select .options-container .options .option:hover{background-color:var(--offset)}.select .options-container.active{pointer-events:all;opacity:1}.select.up .options-container{bottom:100%;padding:.5rem 0rem}.select.down .options-container{top:100%;padding:.5rem 0rem}.select.left-up .options-container{right:100%;bottom:0;padding:0rem .5rem}.select.left-down .options-container{right:100%;top:0;padding:0rem .5rem}.select.right-up .options-container{left:100%;bottom:0;padding:0rem .5rem}.select.right-down .options-container{left:100%;top:0;padding:0rem .5rem}.Animautomatons{display:flex;flex-direction:column;align-items:center;gap:1rem;width:min(100vw,600px);padding:1rem 0rem}.animautomaton-container{padding:0rem .5rem;display:flex;flex-direction:column}.animautomaton-container .select{font-size:75%}.animautomaton-container .animautomaton-wrapper .animautomaton{position:relative;display:flex;margin:.5rem}.animautomaton-container .animautomaton-wrapper .animautomaton canvas{background-color:var(--canvas-colour);border-radius:8px;overflow:hidden}.animautomaton-container h1{width:100%;font-size:1.25rem;text-transform:lowercase;font-weight:700;margin-bottom:.5rem}.animautomaton-container .about{padding:.5rem;width:100%;display:flex;flex-wrap:wrap;gap:.5rem;column-gap:1rem}.animautomaton-container .about .even{font-size:.75rem;align-items:center}.animautomaton-container .about .selected{padding:0rem;border:none;background-color:var(--background);color:var(--primary)}.animautomaton-container .about .selected .value{font-weight:700}@media only screen and (max-width: 599px){.animautomaton-container .about>*{width:100%}}@media only screen and (min-width: 600px){.animautomaton-container .about>*{width:calc(50% - .5rem)}}.ffmpreg{width:100%;padding:0 .5rem;display:flex;justify-content:flex-end}.ffmpreg button{cursor:pointer;padding:.5rem;border:2px solid var(--offset);border-radius:4px;display:flex;align-items:center;gap:.5rem;color:var(--primary);background-color:var(--background)}.rel-icon{position:relative}.rel-icon .text{width:100%;height:100%;text-align:center;display:flex;justify-content:center;font-weight:700;align-items:center;position:absolute;z-index:2;font-size:.5rem;left:0;top:2px;color:var(--background)}.rel-icon .error,.rel-icon .warning{font-size:50%;position:absolute;top:0;right:0;z-index:3}.rel-icon .error{color:var(--danger)}.rel-icon .warning{color:var(--warning)}.rel-icon .sub-icon{position:absolute;bottom:0;right:0;font-size:1.5rem;z-index:2;color:#0008}.anim-ops{width:100%;position:absolute;padding:.5rem;left:0;bottom:0;display:flex;flex-direction:row;justify-content:flex-start}.anim-ops button{cursor:pointer;background-color:transparent;font-size:2rem;border:none;color:var(--offset);transition:all .1s ease}.anim-ops button:hover,.anim-ops button:focus{color:gray}.anim-ops button:active{scale:.9}.anim-ops .stack{position:relative}.anim-ops .stack .above{position:absolute;bottom:100%;left:0}.anim-ops .stack .above button{font-size:.75rem}.anim-ops .copy-buttons button,.anim-ops .export-buttons button{font-size:1.5rem}.colour-picker{cursor:pointer;flex:1;min-width:3rem;display:flex;position:relative;--border-colour: #99999988}.colour-picker input[type=color]{cursor:pointer;border-radius:4px;padding:0;border:none;width:100%}.colour-picker input[type=color]::-webkit-color-swatch{border:2px solid var(--border-colour);border-radius:4px;width:100%;height:100%}.colour-picker input[type=color]::-moz-color-swatch{border:2px solid var(--border-colour);border-radius:4px;width:100%;height:100%}.colour-picker .icon{position:absolute;z-index:2;width:100%;height:100%;left:0;top:0;display:flex;justify-content:center;align-items:center;pointer-events:none;color:var(--border-colour)}.colour-picker .delete-button{position:absolute;bottom:-.5rem;right:-.5rem;border-radius:1000px;background-color:red;color:#222;opacity:0;transition:all .1s ease;border:none;cursor:pointer}.colour-picker:hover .delete-button{opacity:1}.animaSelect{display:flex;flex-direction:column;align-items:center;gap:1rem;width:min(100vw,600px);padding:1rem 0rem}.animaSelect .colours{width:100%;padding:0rem .5rem;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.animaSelect .colours .separator{height:2rem;width:1px;background-color:var(--offset);margin:0rem .5rem}.animaSelect .colours .select{flex:3;font-size:.75rem;font-weight:700}.animaSelect .colours button:not(.delete-button){cursor:pointer;border-radius:4px;border:2px solid var(--offset);background-color:transparent;color:var(--offset);transition:all .1s ease}.animaSelect .colours button:active{scale:.9}.ui-float-animation-preview .demo .animautomaton{display:none}.carousel-select{position:relative;display:flex;padding:0rem .5rem;gap:.5rem;justify-content:flex-start;width:100%;overflow-x:auto;scrollbar-width:none}.carousel-select ::-webkit-scrollbar{width:0;height:0}.carousel-select .tile{transition:all .2s ease;translate:var(--tile-translate);min-width:100px;width:max(100px,20% - .4rem);height:100px;border-radius:8px;display:flex;position:relative;justify-content:center;align-items:center;background-color:var(--bg-offset);border:2px solid transparent;cursor:pointer}.carousel-select .tile .label{font-weight:700;font-size:.75rem;color:var(--primary);z-index:3;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center}.carousel-select .tile canvas{position:absolute;z-index:2}.carousel-select .tile:hover,.carousel-select .tile:focus{border-color:var(--primary)}.carousel-select .tile.active{background-color:var(--primary);border-color:var(--primary)}.carousel-select .tile.active .label{color:var(--background)}.carousel-select .seekers{pointer-events:none;position:absolute;display:flex;gap:.5rem;bottom:0;z-index:2;height:100%;transition:all .2s ease;width:50%}.carousel-select .seekers .tile{translate:0 0}.carousel-select .seekers button{opacity:0;pointer-events:all;padding:0;height:100%;display:flex;align-items:center;background-color:#00000080;border:2px solid var(--primary);color:var(--primary);cursor:pointer}.carousel-select .seekers button svg{transition:all .1s ease;font-size:2rem;translate:0 0}.carousel-select .seekers button:hover{opacity:1}.carousel-select .seekers.left{left:0}.carousel-select .seekers.left button:active svg{translate:-10px 0}.carousel-select .seekers.right{right:0;justify-content:flex-end}.carousel-select .seekers.right button:active svg{translate:10px 0}.ui-float-animation-preview .floating-animation-preview{display:flex}.floating-animation-preview{display:none;position:fixed;top:var(--toolbar-height);left:0;height:calc(100vh - var(--toolbar-height));width:calc(99vw - 600px - 1rem)}.floating-animation-preview .about,.floating-animation-preview h1{display:none}.body{margin-top:var(--toolbar-height);min-height:calc(100vh - var(--toolbar-height));width:100%;background-color:var(--background);display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1rem 0rem}.ui-float-animation-preview .body{align-items:flex-end;padding-right:1rem}.dialogue{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000bf;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;z-index:100;padding-top:4rem;padding-bottom:2rem}.dialogue h1{display:flex;gap:.5rem;padding-bottom:.5rem}.dialogue .close-button{font-size:1.5rem;background-color:transparent;cursor:pointer;border:none;color:var(--danger)}.dialogue-internal{position:relative;border-radius:4px;transition:all .25s ease;box-shadow:0 3px 5px var(--contrast)}.dialogue-content{width:min(95vw,570px);display:flex;flex-direction:column;background-color:var(--background);color:var(--contrast);padding:2rem;gap:1rem;z-index:2;border-radius:inherit}.dialogue-section{display:flex;width:100%}.dialogue.initial{opacity:0;display:none!important}.dialogue.asleep{opacity:0;pointer-events:none;display:flex}.dialogue.asleep .dialogue-content{height:1px!important;overflow:hidden}.dialogue.waking{opacity:1}.dialogue.awake{opacity:1;pointer-events:all}.dialogue.dozing{opacity:0}.toolbar{position:fixed;top:0;width:100vw;display:flex;flex-direction:column;height:var(--toolbar-height);align-items:center;font-size:1.5rem;color:var(--offset);z-index:100;color:var(--primary);background-color:var(--background);--toolbar-shadow: 0px 0px 3px var(--bg-offset);box-shadow:var(--toolbar-shadow)}.toolbar .controls{position:relative;padding:0rem .5rem;background-color:inherit;height:100%;width:100vw;display:flex;justify-content:flex-start;align-items:center}.toolbar .controls a.active:hover,.toolbar .controls button.active:hover{color:var(--primary)}.toolbar .controls .items{display:flex}.toolbar .controls .space{width:2rem}.toolbar .title{cursor:pointer;font-weight:700;color:var(--primary)}.toolbar .title p{margin:0}.toolbar .controls .home{font-size:1.4rem}.toolbar .controls .items>*{padding:.5rem;background-color:transparent;border:none;font-size:1.5rem;color:var(--primary);display:flex;justify-content:center;align-items:center;transition:all .25s ease}.toolbar .controls .items>*:hover{color:gray}.toolbar .controls .items>*:active{scale:.9}.toolbar .controls .items>*.active{color:var(--offset)}.toolbar .controls .items>*.active:hover{color:gray}.toolbar .controls .dropdown{background-color:var(--background);position:absolute;left:0;top:100%;height:calc(var(--toolbar-height) + 4px);display:none;width:100%;height:100%;border-top:1px solid var(--bg-offset);box-shadow:var(--toolbar-shadow);z-index:-1}.toolbar .controls .dropdown.open{display:flex}.dropdown .items{width:100%;justify-content:space-around}.nav-logo{height:100%;padding:10px;object-fit:contain}@font-face{font-family:openSans;src:url(fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf)}@font-face{font-family:playwriteUS;src:url(fonts/Playwrite_US_Modern/PlaywriteUSModern-VariableFont_wght.ttf)}*{box-sizing:border-box}body{margin:0;font-family:openSans,Open Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--toolbar-height: 50px;--standard-font: openSans;--fancy-font: playwriteUS;background-color:#222}button{cursor:pointer}h1,h2,h3,h4,h5,h6{padding:0;margin:0;font-family:openSans,monospace}h1{font-size:1.25rem;border-bottom:1px solid var(--primary)}h2{font-size:1rem;padding:.5rem 0rem}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{position:relative;width:100%;display:flex;justify-content:center;background-color:var(--background);color:var(--primary);transition:background-color .25s ease,color .25s ease}.App a{font-weight:700;color:var(--palette-1)}.App a:visited{color:var(--palette-2)}.nodisplay{display:none!important}.Animautomaton-disabled{animation:none!important}.wait *{cursor:wait!important}.flex-fill{flex:1 1}.flex-col{flex-direction:column}.even{width:100%;display:flex}.even>*{flex:1;width:50%}.input-container{width:100%;display:flex;justify-content:space-between;align-items:center}.input-container .right,.input-container .left{display:flex;align-items:center;justify-content:space-between}.ui-wide .only-tall,.ui-tall .only-wide{display:none!important}