.menu-toggle[data-astro-cid-2xuovs6t]{position:fixed;bottom:1.5rem;left:1.5rem;width:3.5rem;height:3.5rem;border-radius:50%;background:#1e1e23f2;border:1px solid rgba(255,255,255,.1);cursor:pointer;z-index:10002;align-items:center;justify-content:center;padding:0;margin:0;transition:background .2s;display:flex;&[data-astro-cid-2xuovs6t]:hover{background:#28282df2}&.is-open .hamburger[data-astro-cid-2xuovs6t]{background:transparent;&[data-astro-cid-2xuovs6t]:before{transform:rotate(45deg);top:0}&[data-astro-cid-2xuovs6t]:after{transform:rotate(-45deg);bottom:0}}@media(min-width:1024px){display:none;&.visible{display:flex;top:1.5rem;bottom:auto}}}.hamburger[data-astro-cid-2xuovs6t]{position:relative;width:1.5rem;height:2px;background:#ffffffe6;display:block;transition:background .2s;&[data-astro-cid-2xuovs6t]:before,&[data-astro-cid-2xuovs6t]:after{content:"";position:absolute;width:100%;height:2px;background:#ffffffe6;left:0;transition:transform .2s,top .2s,bottom .2s}&[data-astro-cid-2xuovs6t]:before{top:-.5rem}&[data-astro-cid-2xuovs6t]:after{bottom:-.5rem}}.menu-close[data-astro-cid-2xuovs6t]{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;background:transparent;border:none;cursor:pointer;padding:0;margin:0;align-items:center;justify-content:center;display:none;&[data-astro-cid-2xuovs6t]:hover{background:#ffffff1a;border-radius:4px}&.visible{display:flex}}.close-icon[data-astro-cid-2xuovs6t]{position:relative;width:1.25rem;height:1.25rem;&[data-astro-cid-2xuovs6t]:before,&[data-astro-cid-2xuovs6t]:after{content:"";position:absolute;width:1.25rem;height:2px;background:#ffffffb3;top:50%;left:0}&[data-astro-cid-2xuovs6t]:before{transform:rotate(45deg)}&[data-astro-cid-2xuovs6t]:after{transform:rotate(-45deg)}}.menu-overlay[data-astro-cid-2xuovs6t]{display:none;position:fixed;inset:0;background:#00000080;z-index:9999;&.visible{display:block}}.demo-nav[data-astro-cid-2xuovs6t]{position:fixed;top:0;left:0;height:100dvh;width:280px;background:#141419fa;backdrop-filter:blur(10px);border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column;gap:2rem;padding:3rem 1.5rem 2rem;z-index:10001;overflow-y:auto}.home-link[data-astro-cid-2xuovs6t]{color:#667eea;text-decoration:none;font-weight:600;font-size:1.1rem;padding:0rem 1rem}.demo-links[data-astro-cid-2xuovs6t]{display:flex;flex-direction:column;gap:.5rem;width:100%}.demo-link[data-astro-cid-2xuovs6t]{color:#ffffffb3;text-decoration:none;padding:.75rem 1rem;border-radius:6px;transition:all .2s;font-size:.95rem;&[data-astro-cid-2xuovs6t]:hover{color:#fff;background:#ffffff14}&.active{color:#fff;background:#667eea4d;border-left:3px solid #667eea}}@media(max-width:1023px){.demo-nav[data-astro-cid-2xuovs6t]{transform:translate(-100%);width:90%;&.user-opened{transform:translate(0)}}}@media(min-width:1024px){.demo-nav[data-astro-cid-2xuovs6t]{position:relative;height:auto;transform:translate(0);&.user-closed{transform:translate(-100%);width:0;padding:0;border:none;overflow:hidden}}}:root{--col-gray-0: #111113;--col-gray-1: #141419;--col-gray-2: #1b1b1e;--col-gray-3: #252529;--col-blue-0: #183279;--col-blue-1: #2d58b4;--col-blue-2: #3b82f6}html{font-family:system-ui,sans-serif;color:#fff;background-color:var(--col-gray-3);box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{margin:0}main{display:flex;flex-direction:column;text-align:center;width:100%;margin:0 auto;position:relative;align-items:center;padding-bottom:1.5rem}.app{min-height:100dvh;display:flex}canvas{display:block}code{font-family:Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace}p{margin:.5rem}button{padding:.75rem 1.5rem;background-color:var(--col-blue-1);color:#fff;border:none;border-radius:.375rem;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease}button:hover{background-color:var(--col-blue-0)}button:active{transform:scale(.98)}button:focus{outline:2px solid var(--col-blue-2);outline-offset:2px}.canvas-container{position:relative;width:100%;margin:0;background-color:var(--col-gray-1);display:flex;flex-direction:column}.canvas-container canvas{margin:auto;width:100%;max-width:1600px;&.paused{outline:1px solid red}}.gui-container{position:relative;width:100%;@media(min-width:1024px){order:-1;width:calc(100% - 2rem);margin:0 1rem}}.content-wrapper[data-astro-cid-sckkx6r4]{min-height:100dvh;width:100%;transition:margin-left .3s ease}