@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700&family=Space+Mono:ital,wght@0,400;0,700;1,400&family=Bebas+Neue&family=Comic+Neue:ital,wght@0,300;0,400;0,700;1,400&family=Oswald:wght@300;400;700&family=VT323&family=Creepster&family=Russo+One&family=Press+Start+2P&family=Rubik+Glitch&family=Montserrat:wght@900&display=swap";body{font-family:Inter,sans-serif;background-color:#09090b;color:#f8fafc}.font-mono{font-family:Space Mono,monospace}.canvas-container{position:relative;width:100%;max-width:380px;aspect-ratio:9 / 16;margin:0 auto;border-radius:1rem;overflow:hidden;box-shadow:0 25px 50px -12px #000c,0 0 40px #d946ef26;background:#000;border:1px solid #27272a}canvas{width:100%;height:100%;object-fit:contain;display:block}main{background-image:url("data:image/svg+xml,<svg width='40' height='40' xmlns='http://www.w3.org/2000/svg'><circle cx='2' cy='2' r='1.5' fill='%236060a0'/></svg>")}main:has(#emptyState.hidden){background-image:url("data:image/svg+xml,<svg width='40' height='40' xmlns='http://www.w3.org/2000/svg'><circle cx='2' cy='2' r='1' fill='%231811b3'/></svg>")}.recording-pulse{animation:pulse 1.5s infinite}@keyframes pulse{0%{transform:scale(.95);box-shadow:0 0 #ef4444b3}70%{transform:scale(1);box-shadow:0 0 0 10px #ef444400}to{transform:scale(.95);box-shadow:0 0 #ef444400}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#18181b}::-webkit-scrollbar-thumb{background:#3f3f46;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#52525b}input[type=range]{-webkit-appearance:none;background:transparent}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:14px;width:14px;border-radius:50%;background:#d946ef;cursor:pointer;margin-top:-5px}input[type=range]::-webkit-slider-runnable-track{width:100%;height:4px;cursor:pointer;background:#3f3f46;border-radius:2px}.glitch-active{animation:flash-border .2s infinite}@keyframes flash-border{0%,to{border-color:#27272a}50%{border-color:#ef4444}}.range-audio::-webkit-slider-thumb{background:#a855f7}.range-glitch::-webkit-slider-thumb{background:#ef4444}.range-speed::-webkit-slider-thumb{background:#3b82f6}.range-words::-webkit-slider-thumb{background:#10b981}#appToast.hidden{display:none}#appToast{transition:opacity .3s ease,transform .3s ease}#appToast.fade-out{opacity:0;transform:translate(-10px)}@keyframes slide-right{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.animate-in{animation:slide-right .5s ease-out forwards}.donation-highlight{animation:donation-pulse 2s infinite;border-color:#eab308cc!important;box-shadow:0 0 15px #eab30866}@keyframes donation-pulse{0%{transform:scale(1)}50%{transform:scale(1.1);background-color:#eab30833}to{transform:scale(1)}}#caption-display{position:absolute;inset:0;width:100%;height:100%;perspective:1000px;overflow:hidden;pointer-events:none;z-index:30}.kinetic-word{position:absolute;transform-style:preserve-3d;font-family:Montserrat,sans-serif;font-weight:900;font-size:4rem;color:#fff;text-transform:uppercase;opacity:0;pointer-events:none;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.animate-active{opacity:1;transform:translate(-50%,-50%) translateZ(0) scale(1) rotate(var(--rot, 0deg));filter:blur(0)}.kinetic-word:not(.animate-active):not(.animate-exit){transform:translate(-50%,-50%) translateZ(-500px) scale(.5);filter:blur(10px)}.animate-exit{opacity:0;transform:translate(-50%,-50%) translateZ(200px) scale(1.5);filter:blur(5px)}.motion-3d-container{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;perspective:1200px;pointer-events:none}.motion-3d-word{position:absolute;font-family:Arial Black,Montserrat,sans-serif;font-weight:900;color:#fff;text-transform:uppercase;opacity:0;pointer-events:none;transform-style:preserve-3d}.animate-motion-3d{animation:zoomVanish .8s ease-out forwards}@keyframes zoomVanish{0%{transform:translateZ(-800px) scale(.2);opacity:0;filter:blur(8px)}15%{opacity:1;filter:blur(0)}85%{opacity:1;filter:blur(0)}to{transform:translateZ(800px) scale(3.5);opacity:0}}#mp4SettingsPanel{transition:all .3s cubic-bezier(.4,0,.2,1)}#mp4SettingsPanel.hidden{display:none;opacity:0;transform:translateY(-10px)}#mp4SettingsPanel:not(.hidden){display:block;opacity:1;transform:translateY(0)}select:focus{box-shadow:0 0 0 2px #a855f733}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin-slow{animation:spin-slow 3s linear infinite}
