@font-face{font-family:Playfair Display SC;src:url(/fonts/PlayfairDisplaySC.woff2) format("woff2");font-weight:900;font-style:normal;font-display:fallback}@font-face{font-family:Rubik;src:url(/fonts/Rubik.woff2) format("woff2");font-weight:300;font-style:normal;font-display:fallback}@font-face{font-family:Rubik;src:url(/fonts/Rubik.woff2) format("woff2");font-weight:400;font-style:normal;font-display:fallback}@font-face{font-family:Rubik;src:url(/fonts/Rubik.woff2) format("woff2");font-weight:500;font-style:normal;font-display:fallback}*,*:before,*:after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}.tools{height:clamp(30vh,10vh + 50vw,100vh);width:90vw;margin:var(--section-margin);display:flex;justify-content:center;align-items:center;position:relative;--duration: 40s;--radius: clamp(10vh, 20vw, 40vh);--start-angle: 0deg}.tools-icons-container{position:absolute;width:99vw;margin:auto}.tools-orbit{position:absolute;top:50%;left:50%;transform-origin:0 0;animation:rotate var(--duration) linear infinite;transform:rotate(var(--start-angle)) translate(var(--radius))}.icon-wrapper{animation:counter-rotate var(--duration) linear infinite;transform:rotate(calc(-1 * var(--start-angle)))}.icon-wrapper img{width:clamp(2rem,10vw,10rem);height:clamp(2rem,10vw,10rem)}@keyframes rotate{0%{transform:rotate(var(--start-angle)) translate(var(--radius))}to{transform:rotate(calc(360deg + var(--start-angle))) translate(var(--radius))}}@keyframes counter-rotate{0%{transform:rotate(calc(-1 * var(--start-angle)))}to{transform:rotate(calc(-360deg - var(--start-angle)))}}.header-icons{position:absolute;display:flex;gap:clamp(.5rem,2vw,2rem);padding-left:clamp(1rem,5vw,4rem);left:0;top:clamp(1rem,5vw,4rem)}.header-icons img{width:clamp(2rem,4vw,4rem);height:clamp(2rem,4vw,4rem);cursor:pointer;filter:invert(0%);transition:filter .3s ease}.header-icons img:hover{filter:invert(100%)}.header{overflow:hidden;position:relative;height:clamp(30vh,10vh + 50vw,100vh);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2rem}.custom-canvas{width:30vw;height:50vh;background-color:#000;border-radius:1rem}.ruby-section{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:auto auto;grid-template-areas:"ruby-section-header ruby-section-header" "ruby-section-text ruby-section-canvas";gap:clamp(1rem,2vw,2rem) 4rem}.ruby-section-header{grid-area:ruby-section-header}.ruby-section-text{grid-area:ruby-section-text}.ruby-section-canvas{grid-area:ruby-section-canvas}.react-section{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:auto auto;grid-template-areas:"react-section-header react-section-header" "react-section-canvas react-section-text";gap:clamp(1rem,2vw,1.5rem) 4rem}.react-section-header{grid-area:react-section-header}.react-section-text{grid-area:react-section-text}.react-section-canvas{grid-area:react-section-canvas}.experience{width:90vw;margin:var(--section-margin);margin-bottom:clamp(1rem,4vw,4rem)}.sections{display:flex;flex-direction:column;gap:clamp(1.25rem,2.5vw,2rem)}@media (max-width: 1600px){.ruby-section{display:grid;grid-template-columns:1fr;grid-template-rows:auto;grid-template-areas:"ruby-section-header" "ruby-section-canvas" "ruby-section-text"}.react-section{display:grid;grid-template-columns:1fr;grid-template-rows:auto;grid-template-areas:"react-section-header" "react-section-canvas" "react-section-text"}.custom-canvas{width:100%}}code[class*=language-],pre[class*=language-]{background:#282c34;color:#abb2bf;text-shadow:0 1px rgba(0,0,0,.3);font-family:Fira Code,Fira Mono,Menlo,Consolas,DejaVu Sans Mono,monospace;direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;line-height:1.5;-moz-tab-size:2;-o-tab-size:2;tab-size:2;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-]::-moz-selection,code[class*=language-] *::-moz-selection,pre[class*=language-] *::-moz-selection{background:#3e4451;color:inherit;text-shadow:none}code[class*=language-]::selection,code[class*=language-] *::selection,pre[class*=language-] *::selection{background:#3e4451;color:inherit;text-shadow:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto;border-radius:.3em}:not(pre)>code[class*=language-]{padding:.2em .3em;border-radius:.3em;white-space:normal}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}.token.comment,.token.prolog,.token.cdata{color:#5c6370}.token.doctype,.token.punctuation,.token.entity{color:#abb2bf}.token.attr-name,.token.class-name,.token.boolean,.token.constant,.token.number,.token.atrule{color:#d19a66}.token.keyword{color:#c678dd}.token.property,.token.tag,.token.symbol,.token.deleted,.token.important{color:#e06c75}.token.selector,.token.string,.token.char,.token.builtin,.token.inserted,.token.regex,.token.attr-value,.token.attr-value>.token.punctuation{color:#98c379}.token.variable,.token.operator,.token.function{color:#61afef}.token.url{color:#56b6c2}.token.attr-value>.token.punctuation.attr-equals,.token.special-attr>.token.attr-value>.token.value.css{color:#abb2bf}.language-css .token.selector{color:#e06c75}.language-css .token.property{color:#abb2bf}.language-css .token.function,.language-css .token.url>.token.function{color:#56b6c2}.language-css .token.url>.token.string.url{color:#98c379}.language-css .token.important,.language-css .token.atrule .token.rule,.language-javascript .token.operator{color:#c678dd}.language-javascript .token.template-string>.token.interpolation>.token.interpolation-punctuation.punctuation{color:#be5046}.language-json .token.operator{color:#abb2bf}.language-json .token.null.keyword{color:#d19a66}.language-markdown .token.url,.language-markdown .token.url>.token.operator,.language-markdown .token.url-reference.url>.token.string{color:#abb2bf}.language-markdown .token.url>.token.content{color:#61afef}.language-markdown .token.url>.token.url,.language-markdown .token.url-reference.url{color:#56b6c2}.language-markdown .token.blockquote.punctuation,.language-markdown .token.hr.punctuation{color:#5c6370;font-style:italic}.language-markdown .token.code-snippet{color:#98c379}.language-markdown .token.bold .token.content{color:#d19a66}.language-markdown .token.italic .token.content{color:#c678dd}.language-markdown .token.strike .token.content,.language-markdown .token.strike .token.punctuation,.language-markdown .token.list.punctuation,.language-markdown .token.title.important>.token.punctuation{color:#e06c75}.token.bold{font-weight:700}.token.comment,.token.italic{font-style:italic}.token.entity{cursor:help}.token.namespace{opacity:.8}.token.token.tab:not(:empty):before,.token.token.cr:before,.token.token.lf:before,.token.token.space:before{color:#abb2bf26;text-shadow:none}div.code-toolbar>.toolbar.toolbar>.toolbar-item{margin-right:.4em}div.code-toolbar>.toolbar.toolbar>.toolbar-item>button,div.code-toolbar>.toolbar.toolbar>.toolbar-item>a,div.code-toolbar>.toolbar.toolbar>.toolbar-item>span{background:#3a3f4b;color:#828997;padding:.1em .4em;border-radius:.3em}div.code-toolbar>.toolbar.toolbar>.toolbar-item>button:hover,div.code-toolbar>.toolbar.toolbar>.toolbar-item>button:focus,div.code-toolbar>.toolbar.toolbar>.toolbar-item>a:hover,div.code-toolbar>.toolbar.toolbar>.toolbar-item>a:focus,div.code-toolbar>.toolbar.toolbar>.toolbar-item>span:hover,div.code-toolbar>.toolbar.toolbar>.toolbar-item>span:focus{background:#3e4451;color:#abb2bf}.line-highlight.line-highlight{background:#99bbff0a}.line-highlight.line-highlight:before,.line-highlight.line-highlight[data-end]:after{background:#3a3f4b;color:#abb2bf;padding:.1em .6em;border-radius:.3em;box-shadow:0 2px #0003}pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows>span:hover:before{background-color:#99bbff0a}.line-numbers.line-numbers .line-numbers-rows,.command-line .command-line-prompt{border-right-color:#abb2bf26}.line-numbers .line-numbers-rows>span:before,.command-line .command-line-prompt>span:before{color:#636d83}.rainbow-braces .token.token.punctuation.brace-level-1,.rainbow-braces .token.token.punctuation.brace-level-5,.rainbow-braces .token.token.punctuation.brace-level-9{color:#e06c75}.rainbow-braces .token.token.punctuation.brace-level-2,.rainbow-braces .token.token.punctuation.brace-level-6,.rainbow-braces .token.token.punctuation.brace-level-10{color:#98c379}.rainbow-braces .token.token.punctuation.brace-level-3,.rainbow-braces .token.token.punctuation.brace-level-7,.rainbow-braces .token.token.punctuation.brace-level-11{color:#61afef}.rainbow-braces .token.token.punctuation.brace-level-4,.rainbow-braces .token.token.punctuation.brace-level-8,.rainbow-braces .token.token.punctuation.brace-level-12{color:#c678dd}pre.diff-highlight>code .token.token.deleted:not(.prefix),pre>code.diff-highlight .token.token.deleted:not(.prefix){background-color:#ff526626}pre.diff-highlight>code .token.token.deleted:not(.prefix)::-moz-selection,pre.diff-highlight>code .token.token.deleted:not(.prefix) *::-moz-selection,pre>code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection,pre>code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection{background-color:#fb566940}pre.diff-highlight>code .token.token.deleted:not(.prefix)::selection,pre.diff-highlight>code .token.token.deleted:not(.prefix) *::selection,pre>code.diff-highlight .token.token.deleted:not(.prefix)::selection,pre>code.diff-highlight .token.token.deleted:not(.prefix) *::selection{background-color:#fb566940}pre.diff-highlight>code .token.token.inserted:not(.prefix),pre>code.diff-highlight .token.token.inserted:not(.prefix){background-color:#1aff5b26}pre.diff-highlight>code .token.token.inserted:not(.prefix)::-moz-selection,pre.diff-highlight>code .token.token.inserted:not(.prefix) *::-moz-selection,pre>code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection,pre>code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection{background-color:#38e06240}pre.diff-highlight>code .token.token.inserted:not(.prefix)::selection,pre.diff-highlight>code .token.token.inserted:not(.prefix) *::selection,pre>code.diff-highlight .token.token.inserted:not(.prefix)::selection,pre>code.diff-highlight .token.token.inserted:not(.prefix) *::selection{background-color:#38e06240}.prism-previewer.prism-previewer:before,.prism-previewer-gradient.prism-previewer-gradient div{border-color:#262931}.prism-previewer-color.prism-previewer-color:before,.prism-previewer-gradient.prism-previewer-gradient div,.prism-previewer-easing.prism-previewer-easing:before{border-radius:.3em}.prism-previewer.prism-previewer:after{border-top-color:#262931}.prism-previewer-flipped.prism-previewer-flipped.after{border-bottom-color:#262931}.prism-previewer-angle.prism-previewer-angle:before,.prism-previewer-time.prism-previewer-time:before,.prism-previewer-easing.prism-previewer-easing{background:#31363f}.prism-previewer-angle.prism-previewer-angle circle,.prism-previewer-time.prism-previewer-time circle{stroke:#abb2bf;stroke-opacity:1}.prism-previewer-easing.prism-previewer-easing circle,.prism-previewer-easing.prism-previewer-easing path,.prism-previewer-easing.prism-previewer-easing line{stroke:#abb2bf}.prism-previewer-easing.prism-previewer-easing circle{fill:transparent}:root{--main-font: "Rubik", sans-serif;--main-color: #fff;--font-weight-regular: 400;--font-weight-bold: 500;--section-margin: clamp(2rem, 4.5vw + 1rem, 8rem) auto 0 auto}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background-color:#24272c}::-webkit-scrollbar-thumb{background-color:#24272c;border-radius:1rem}::-webkit-scrollbar-thumb:hover{background-color:#ffffff59}*{scrollbar-width:thin;scrollbar-color:#24272C #24272C}body{background-color:#24272c;font-family:var(--main-font);color:var(--main-color);font-weight:var(--font-weight-regular)}h1{text-align:center;font-family:Playfair Display SC,serif;white-space:nowrap;font-size:clamp(3rem,13vw,22rem);font-weight:900}h2{font-weight:var(--font-weight-bold);text-align:center;font-size:clamp(1.5rem,4vw,4rem)}h3{font-weight:var(--font-weight-bold);text-align:left;font-size:clamp(1.25rem,2.5vw,2rem)}p{font-size:clamp(1rem,1.5vw,1.5rem)}a{color:#10a7e8;position:relative;text-decoration:none}a:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background-color:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s ease}a:hover:after{transform:scaleX(1)}a.no-underline:after,a.no-underline:hover:after{content:none;display:none}.mt-2{margin-top:2rem}.mb-2{margin-bottom:2rem}.mt-1{margin-top:1rem}.h2-mb{margin-bottom:clamp(1.25rem,2vw,6rem)}#wave{width:100vw;height:150px}.code-block{position:absolute;z-index:-1;word-break:break-word!important;overflow-wrap:break-word!important;white-space:pre-wrap!important;font-size:clamp(.75rem,1vw,1rem)!important;opacity:0;will-change:opacity;animation:moveUp 20s linear forwards,fadeIn 2s forwards}@keyframes fadeIn{to{opacity:1}}@keyframes moveUp{0%{bottom:0}to{bottom:100vh}}.code-block span,.code-block code{word-break:break-word!important;overflow-wrap:break-word!important;white-space:pre-wrap!important;font-size:clamp(.75rem,1vw,1rem)!important}