.css,.gsap{margin-bottom:2rem;max-inline-size:100%;font-family:var(--bronova);letter-spacing:2px;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:normal;margin-inline:auto;padding:1em;font-size:clamp(1.25rem,1.25vw,1.75rem);font-weight:100;line-height:1.5}@media (max-inline-size:768px){.css,.gsap{max-inline-size:95%;margin-inline:auto;padding:.1rem}}.css img,.gsap img{max-inline-size:100%;width:100%;height:auto;box-shadow:none;text-align:center;border-radius:var(--radius);margin:0;display:block}.css p,.gsap p{color:var(--clr-light-500-fade);letter-spacing:0;margin-block:1rem;padding:0;font-size:clamp(1rem,1.25vw,1.75rem);font-weight:300;line-height:1.5}.css img:not(.grid-section img),.gsap img:not(.grid-section img){max-inline-size:100%;height:auto;box-shadow:none;text-align:center;border-radius:var(--radius);margin:2rem auto;display:block}.css h1,.gsap h1{font-family:var(--bronova-bold);color:var(--clr-gray-700);letter-spacing:-1px;text-shadow:0 0 3px var(--dark-gray);text-transform:uppercase;margin-block:2rem;scroll-margin-top:8rem;font-size:clamp(2rem,5vw,8rem);font-weight:900;display:none}.css h2,.gsap h2{font-family:var(--ultra);color:var(--clr-dark-500);text-shadow:0 0 1px var(--clr-light-500), -2px -2px 0 oklch(from var(--clr-blue-500) .5 c h), 2px -2px 0 oklch(from var(--clr-blue-500) .5 c h), -2px 2px 0 oklch(from var(--clr-blue-500) .5 c h), 2px 2px 0 oklch(from var(--clr-blue-500) .5 c h), -2px 0 0 oklch(from var(--clr-blue-500) .5 c h), 2px 0 0 oklch(from var(--clr-blue-500) .5 c h), 0 -2px 0 oklch(from var(--clr-blue-500) .5 c h), 0 2px 0 oklch(from var(--clr-blue-500) .5 c h);letter-spacing:0;margin-block:1.5rem;scroll-margin-top:8rem;font-size:clamp(1.5rem,3vw,2.5rem);font-weight:500}.css h3,.gsap h3{font-family:var(--bronova);color:oklch(from var(--clr-green-500) .35 c h);letter-spacing:-1px;text-shadow:0 0 3px var(--dark-gray);text-transform:lowercase;margin-block:2rem;scroll-margin-top:8rem;font-size:clamp(1.25rem,1.75vw,2rem);font-weight:900}.grid-section{grid-template-columns:1fr 1fr;align-items:start;gap:2rem;margin-bottom:4rem;display:grid}@media (width<=768px){.grid-section{grid-template-columns:1fr;gap:1rem;margin-bottom:2rem}}.grid-section .content{flex-direction:column;display:flex}.grid-section .image{flex-direction:column;justify-content:flex-start;align-items:center;gap:1rem;display:flex}@media (width<=768px){.grid-section .image.long{scale:1.05 1.5}}.grid-section .image img{max-inline-size:100%;width:100px;height:auto;box-shadow:none;border-radius:var(--radius);margin:0;display:block;scale:1}@media (width<=768px){.grid-section .image img{scale:1.1 1}}div[id]{scroll-margin-top:8rem}.css code,.gsap code{color:inherit;border:1px solid var(--clr-gray-600);border-radius:var(--radius);font-family:var(--mono);font-size:clamp(var(--xs), 1.5vw, var(--h6));background-color:#0000;padding:.2em .4em;font-weight:600}.css pre,.gsap pre{-webkit-overflow-scrolling:touch;background-color:var(--clr-dark-500);max-inline-size:100%;margin:1rem 0;padding:0;overflow:auto hidden}.css :not(pre)>code,.gsap :not(pre)>code{background-color:var(--clr-light-500);color:var(--clr-dark-500)}.css pre code,.gsap pre code{color:inherit;border:3px solid var(--clr-light-500);border-radius:var(--radius);font-family:var(--mono);font-size:clamp(var(--xs), 1.5vw, var(--h6));box-shadow:0 4px 1px var(--clr-gray-700);box-sizing:border-box;white-space:pre;word-break:normal;overflow-wrap:normal;background-color:#0000;max-inline-size:100%;padding:1em;font-weight:500;line-height:1.4;display:block;overflow-x:auto}@media (width<=768px){.css pre code,.gsap pre code{box-shadow:0 2px 1px var(--clr-gray-700);white-space:pre-wrap;word-break:break-word;padding:.75rem}}@media (width<=768px){html{scroll-padding-top:6rem}html body h1,html body h2,div[id]{scroll-margin-top:1rem}#anchor{margin-top:1em}}.details-element.svelte-6potk9{margin-block:2em}.details-element.svelte-6potk9 summary:where(.svelte-6potk9){text-align:center;cursor:pointer;border:none;font-weight:700;list-style:none}img{max-inline-size:100%;margin-left:auto;margin-right:auto;display:block}.card.svelte-1821ye1{background-color:var(--clr-dark-400);border:2px solid var(--clr-light-500);border-radius:8px;block-size:fit-content;inline-size:fit-content;margin:0;padding-block:1em;padding-inline:2em;transition:all .3s ease-out;overflow:clip;box-shadow:0 4px 6px #0000001a}.card.svelte-1821ye1:hover{box-shadow:0 0 2em var(--clr-gray-700)}.card.svelte-1821ye1 .card-image:where(.svelte-1821ye1){object-fit:contain;border-radius:0 0 8px 8px;place-self:center;block-size:fit-content;inline-size:fit-content;margin-inline:auto;padding:1rem;display:grid}@media (width<=768px){.card.svelte-1821ye1 .card-image:where(.svelte-1821ye1){padding:0}}.card.svelte-1821ye1 .card-title:where(.svelte-1821ye1){font-family:var(--ultra);font-size:clamp(var(--h3), 2vw, var(--xxl));letter-spacing:-1px;text-transform:uppercase;color:var(--clr-dark-500);text-shadow:0 0 1px var(--clr-dark-500), -2px -2px 0 var(--clr-gray-700), 2px -2px 0 var(--clr-gray-700), -2px 2px 0 var(--clr-gray-700), 2px 2px 0 var(--clr-gray-700), -2px 0 0 var(--clr-gray-700), 2px 0 0 var(--clr-gray-700), 0 -2px 0 var(--clr-gray-700), 0 2px 0 var(--clr-gray-700);margin-bottom:.5rem;font-weight:800}.card.svelte-1821ye1 .card-description:where(.svelte-1821ye1){color:var(--clr-light-500);font-size:clamp(var(--xs), 1.5vw, var(--h4));text-indent:1rem;letter-spacing:0;justify-content:center;margin-bottom:1rem;font-weight:300;display:flex}.card.svelte-1821ye1 .card-button:where(.svelte-1821ye1){color:var(--clr-light-500);border:1px solid var(--clr-light-500);border-radius:var(--radius);font-family:var(--ultra);font-size:clamp(var(--sm), 1.2vw, var(--h5));letter-spacing:1px;block-size:10%;inline-size:fit-content;filter:drop-shadow(0 0 .75rem var(--clr-gray-700));outline-offset:-7px;-webkit-user-select:none;user-select:none;background-color:#0000;outline:3px solid;justify-content:center;align-items:center;margin:1rem auto;padding:1rem 1.75rem;font-weight:300;transition:scale .15s ease-out;display:flex}.card.svelte-1821ye1 .card-button:where(.svelte-1821ye1):hover{outline-offset:0px;text-decoration:none}.card.svelte-1821ye1 .card-button:where(.svelte-1821ye1):focus-visible{outline:1px solid var(--clr-light-500);background:0 0}.card.svelte-1821ye1 .card-button:where(.svelte-1821ye1):active{scale:.95}@media (width<500px){.card.svelte-1821ye1{width:100%;padding:1rem 1.5rem 0}.card.svelte-1821ye1 .card-image:where(.svelte-1821ye1){object-fit:cover;height:190px}.card.svelte-1821ye1 .card-title:where(.svelte-1821ye1){font-size:clamp(var(--h6), 2vw, var(--h5))}.card.svelte-1821ye1 .card-description:where(.svelte-1821ye1){font-size:clamp(var(--xs), 1vw, var(--h6))}.card.svelte-1821ye1 .card-button:where(.svelte-1821ye1){font-size:clamp(var(--sm), 1vw, var(--h6));width:100%;padding:1rem;font-weight:700}}.table-of-contents.svelte-15x9dka{height:fit-content;box-shadow:none;background:0 0;grid-template-columns:repeat(2,1fr);margin:0;padding:0;display:grid}@media (width<=1200px){.table-of-contents.svelte-15x9dka{padding-bottom:2em}}@media (width<=768px){.table-of-contents.svelte-15x9dka{grid-template-columns:1fr}}@media (width<=500px){.table-of-contents.svelte-15x9dka{padding-bottom:2em}}.table-of-contents.svelte-15x9dka dt:where(.svelte-15x9dka){color:var(--clr-gray-600);font-family:var(--bronova-bold);font-size:clamp(var(--h6), 3vw, var(--h4));letter-spacing:3px;margin-bottom:1rem;display:block}.table-of-contents.svelte-15x9dka .css:where(.svelte-15x9dka),.table-of-contents.svelte-15x9dka .gsap:where(.svelte-15x9dka){margin:1em}:is(.table-of-contents.svelte-15x9dka .css:where(.svelte-15x9dka),.table-of-contents.svelte-15x9dka .gsap:where(.svelte-15x9dka)) dl:where(.svelte-15x9dka){flex-direction:column;justify-content:center;align-items:center;display:flex}:is(.table-of-contents.svelte-15x9dka .css:where(.svelte-15x9dka),.table-of-contents.svelte-15x9dka .gsap:where(.svelte-15x9dka)) dl:where(.svelte-15x9dka) dd:where(.svelte-15x9dka){font-size:clamp(var(--sm), 2vw, var(--h6));text-wrap:balance;font-weight:600}:is(.table-of-contents.svelte-15x9dka .css:where(.svelte-15x9dka),.table-of-contents.svelte-15x9dka .gsap:where(.svelte-15x9dka)) dl:where(.svelte-15x9dka) dd:where(.svelte-15x9dka) a:where(.svelte-15x9dka){color:var(--clr-blue-350)}:is(.table-of-contents.svelte-15x9dka .css:where(.svelte-15x9dka),.table-of-contents.svelte-15x9dka .gsap:where(.svelte-15x9dka)) dl:where(.svelte-15x9dka) dd:where(.svelte-15x9dka) a:where(.svelte-15x9dka):visited{color:var(--clr-gray-700)}.toggle-button.svelte-15x9dka{z-index:100;box-shadow:none;cursor:pointer;block-size:2em;inline-size:2em;color:var(--clr-light-400);font-size:clamp(var(--h5), 4.5vw, var(--h1));background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;transition:transform .3s ease-out;display:flex;position:fixed;top:0;left:.25em;rotate:180deg}@media (width<=1080px){.toggle-button.svelte-15x9dka{top:3em}}@media (width<=990px){.toggle-button.svelte-15x9dka{top:4em}}@media (width<=768px){.toggle-button.svelte-15x9dka{display:none}}.toggle-button.svelte-15x9dka svg:where(.svelte-15x9dka){block-size:clamp(2em,5vw,4em);inline-size:clamp(2em,5vw,4em)}.toggle-button.svelte-15x9dka:active{transform:scale(.95)}.arrow.svelte-15x9dka{block-size:100%;inline-size:100%;transition:rotate .3s ease-out}.toggle-button.open.svelte-15x9dka .arrow:where(.svelte-15x9dka){rotate:180deg}.side-bar.svelte-15x9dka{background:linear-gradient(to right, var(--clr-gray-900) 95%, transparent);z-index:99;opacity:1;justify-content:center;align-items:center;block-size:100vh;inline-size:clamp(200px,20vw,300px);transition:transform .3s ease-out;display:flex;position:fixed;top:0;left:0;transform:translate(-110%)}@media (width<=768px){.side-bar.svelte-15x9dka{inline-size:75vw}}.side-bar.svelte-15x9dka.open{transform:translate(0)}.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka){flex-direction:column;grid-template-columns:1fr;justify-content:center;align-items:center;padding-top:10em;display:flex}.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .css:where(.svelte-15x9dka),.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .gsap:where(.svelte-15x9dka){margin:0}:is(.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .css:where(.svelte-15x9dka),.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .gsap:where(.svelte-15x9dka)) dt:where(.svelte-15x9dka){color:var(--clr-dark-500);font-size:clamp(var(--h6), 1.5vw, var(--h4));text-align:center;margin:0 0 .2em;font-weight:200}:is(.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .css:where(.svelte-15x9dka),.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .gsap:where(.svelte-15x9dka)) dd:where(.svelte-15x9dka){text-align:center;font-size:clamp(var(--xs), 1.2vw, var(--sm))}:is(.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .css:where(.svelte-15x9dka),.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .gsap:where(.svelte-15x9dka)) dd:where(.svelte-15x9dka) a:where(.svelte-15x9dka){font-family:var(--bronova);font-weight:200}:is(.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .css:where(.svelte-15x9dka),.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) .gsap:where(.svelte-15x9dka)) dd:where(.svelte-15x9dka) a:where(.svelte-15x9dka):visited{color:var(--clr-light-500)}.side-bar.svelte-15x9dka .table-of-contents:where(.svelte-15x9dka) dl:where(.svelte-15x9dka){flex-direction:column;justify-content:center;align-items:center;display:flex}.morph-title.svelte-1yuqq8o{z-index:5;justify-content:center;align-items:center;inline-size:fit-content;margin-inline-start:2em;padding:5em 1rem 1rem;display:flex}@media (width<=768px){.morph-title.svelte-1yuqq8o{margin-inline-start:1em;padding:.5rem;scale:.8}}.morph-title.svelte-1yuqq8o svg:where(.svelte-1yuqq8o){block-size:auto;inline-size:100%;min-inline-size:520px;max-inline-size:min(90vw,25em);fill:var(--clr-light-500);margin:0;padding:0}@media (width>=1200px){.morph-title.svelte-1yuqq8o svg:where(.svelte-1yuqq8o){max-inline-size:30em}}@media (width<=500px){.morph-title.svelte-1yuqq8o svg:where(.svelte-1yuqq8o){min-inline-size:280px;max-inline-size:95vw}}.morph-title.svelte-1yuqq8o #targetSVG:where(.svelte-1yuqq8o){display:none}.to-top.svelte-1d4zjn4{color:var(--clr-light-500);font-size:clamp(var(--sm), 1.5vw, var(--h6));justify-content:center;align-items:center;gap:.5em;font-weight:600;text-decoration:none;display:flex;position:relative}.to-top.svelte-1d4zjn4:focus-visible{box-shadow:none;background:0 0;outline:none}.expanded{--view-transition-offset:-20em;--view-transition-offset-mobile:-18em}section.svelte-etorw7{cursor:pointer;z-index:50;width:fit-content}section.svelte-etorw7.hidden{visibility:hidden}section.svelte-etorw7 .img-button:where(.svelte-etorw7){cursor:pointer;background:0 0;border:none;width:fit-content;padding:0;display:block}section.svelte-etorw7 .img-button:where(.svelte-etorw7):focus,section.svelte-etorw7 .img-button:where(.svelte-etorw7):focus-visible,section.svelte-etorw7 .img-button:where(.svelte-etorw7):active{box-shadow:none;outline:none}section.svelte-etorw7 .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7){object-fit:contain;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;outline:none;width:500px}section.svelte-etorw7 .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7).svg{object-fit:contain}section.svelte-etorw7:not(.expanded) .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7){object-fit:contain}@media (width<=768px){section.svelte-etorw7:not(.expanded) .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7){width:60vw;height:auto}}section.svelte-etorw7:not(.expanded) .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7).svg{object-fit:contain}.expanded.svelte-etorw7{width:fit-content}.expanded.svelte-etorw7 .img-button:where(.svelte-etorw7){z-index:60}.expanded.svelte-etorw7 .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7){width:min(90vw,1200px);height:auto;max-height:85vh}@media (width<=768px){.expanded.svelte-etorw7 .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7){width:90vw;max-height:80dvh}}.expanded.svelte-etorw7 .img-button:where(.svelte-etorw7) img:where(.svelte-etorw7).svg{filter:brightness(1.1)}.preloader.svelte-1r5wy2d{z-index:2147483647;isolation:isolate;background:var(--clr-dark-500,#fff);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0;transform:translateZ(0)}.preloader.svelte-1r5wy2d .preloader-line:where(.svelte-1r5wy2d){background-color:var(--clr-dark-400);transform-origin:100%;flex:1;height:100vh}.copy-button{position-anchor:--code-block;top:calc(anchor(top) - .5em);right:calc(anchor(right) - .5em);background:var(--clr-dark-500);border:2px solid var(--clr-gray-700);block-size:fit-content;inline-size:fit-content;color:var(--clr-gray-700);border-radius:var(--radius);cursor:pointer;font-size:clamp(var(--sm), .875rem, var(--h5));z-index:10;padding:.25em .75em;font-weight:400;transition:font-weight .2s ease-out;position:absolute}@media (width<=768px){.copy-button{right:calc(anchor(right) - .2em)}}.copy-button:hover{font-weight:600}pre code.hljs{padding:1em;display:block;overflow-x:auto}code.hljs{padding:3px 5px}.hljs{color:#dcdcdc;background:#1e1e1e}.hljs-keyword,.hljs-literal,.hljs-name,.hljs-symbol{color:#569cd6}.hljs-link{color:#569cd6;text-decoration:underline}.hljs-built_in,.hljs-type{color:#4ec9b0}.hljs-class,.hljs-number{color:#b8d7a3}.hljs-meta .hljs-string,.hljs-string{color:#d69d85}.hljs-regexp,.hljs-template-tag{color:#9a5334}.hljs-formula,.hljs-function,.hljs-params,.hljs-subst,.hljs-title{color:#dcdcdc}.hljs-comment,.hljs-quote{color:#57a64a;font-style:italic}.hljs-doctag{color:#608b4e}.hljs-meta,.hljs-meta .hljs-keyword,.hljs-tag{color:#9b9b9b}.hljs-template-variable,.hljs-variable{color:#bd63c5}.hljs-attr,.hljs-attribute{color:#9cdcfe}.hljs-section{color:gold}.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}.hljs-bullet,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-selector-pseudo,.hljs-selector-tag{color:#d7ba7d}.hljs-addition{background-color:#144212;width:100%;display:inline-block}.hljs-deletion{background-color:#600;width:100%;display:inline-block}.table-and-logo.svelte-4mi295{padding-top:5em}.table-and-logo.svelte-4mi295 .popover-morph:where(.svelte-4mi295){justify-content:center;align-items:center;gap:2em;display:flex}@media (width<=768px){.table-and-logo.svelte-4mi295 .popover-morph:where(.svelte-4mi295){flex-direction:column;gap:0}}.code-blocks.svelte-4mi295{box-shadow:none;background:0 0}.topics.svelte-4mi295{margin:0}.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295){justify-content:center;align-items:center;gap:13em;display:flex}@media (width<=768px){.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295){flex-direction:column;gap:1em}}.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295) .drawing-app-link:where(.svelte-4mi295){margin-bottom:3em}.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295) .drawing-app-link:where(.svelte-4mi295) svg:where(.svelte-4mi295){block-size:clamp(5em,8vw,15em);inline-size:clamp(5em,8vw,15em);fill:var(--clr-dark-400);stroke:var(--clr-success-500);stroke-width:25px}@media (width<=768px){.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295) .drawing-app-link:where(.svelte-4mi295) svg:where(.svelte-4mi295){stroke-width:30px}}.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295) .drawing-app-link:where(.svelte-4mi295):focus,.topics.svelte-4mi295 .tech-stack-logo:where(.svelte-4mi295) .aside-links:where(.svelte-4mi295) .drawing-app-link:where(.svelte-4mi295):focus-within{outline:1px solid var(--clr-light-500);outline-offset:5px;box-shadow:none;background-color:#0000}.topics.svelte-4mi295.mounted{opacity:1;scale:1}.topics.svelte-4mi295 .top-button:where(.svelte-4mi295){text-align:center;flex-direction:column;align-items:center;gap:0;margin:0;display:flex}.topics.svelte-4mi295 .top-button:where(.svelte-4mi295) .back-button{margin-top:1em;margin-bottom:0}@media (width<=500px){.topics.svelte-4mi295 .top-button:where(.svelte-4mi295){gap:1em;margin-top:3em}}.topics.svelte-4mi295 .developer-card:where(.svelte-4mi295){box-shadow:none;background:0 0;justify-content:center;display:flex}.topics.svelte-4mi295 .gsap:where(.svelte-4mi295){contain:layout;position:relative}::view-transition-old(css-image){animation-timing-function:cubic-bezier(.4,0,.2,1)}::view-transition-new(css-image){animation-timing-function:cubic-bezier(.4,0,.2,1)}::view-transition-old(gsap-image){animation-timing-function:cubic-bezier(.4,0,.2,1)}::view-transition-new(gsap-image){animation-timing-function:cubic-bezier(.4,0,.2,1)}::view-transition-old(css-image){animation:.25s forwards scale-down}::view-transition-old(gsap-image){animation:.25s forwards scale-down}::view-transition-new(css-image){animation:.25s forwards scale-up}::view-transition-new(gsap-image){animation:.25s forwards scale-up}