@font-face {font-style: normal;src: url('./typefaces/TF Kata Grotesk 2024-VF.ttf') format('truetype');font-family: 'TF Kata Grotesk';}@font-face {font-style: normal;src: url('./typefaces/ZT Formom.ttf') format('truetype');font-family: 'ZT Formom';}@font-face {font-style: normal;src: url('./typefaces/ZT Formom Italic.ttf') format('truetype');font-family: 'ZT Formom Italic';}@font-face {font-style: normal;src: url('./typefaces/JetBrainsMono.ttf') format('opentype');font-family: 'JetBrains Mono';}html, body {font-family: "ZT Formom";}:root {--auto-layout: min(calc(100vw / calc(1400 / 900)), 95vh) * 0.9;--nav-height: calc(var(--auto-layout) * 0.18);--ease-out-elastic: linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1);--blur-percent: 0.6;}.t\:sans {font-family: 'TF Kata Grotesk';}.t\:serif {font-family: 'ZT Formom';}.t\:i-serif {font-family: 'ZT Formom Italic';}.t\:mono {font-family: 'JetBrains Mono';}.t\:display {font-size: calc(var(--auto-layout) * 0.15);line-height: 1.2;}h1, .t\:h1 {font-size: calc(var(--auto-layout) * 0.09);line-height: 1.25;}h2, .t\:h2 {font-size: calc(var(--auto-layout) * 0.066);line-height: 1.4;}h3, .t\:h3 {font-size: calc(var(--auto-layout) * 0.052);}h4, .t\:h4 {font-size: calc(var(--auto-layout) * 0.03);}:root {--article-text-size: 1;}article h1, article h2, article h3 {font-family: 'ZT Formom';margin-top: 1em;color: var(--yellow);display: flex;align-items: center;justify-content: center;}article h3::before, article h3::after {content: "";opacity: 0.5;flex: 1;height: 0;border-top: calc(var(--auto-layout) * 0.0024) solid var(--border);margin: 0 0.5em;}article h1 {font-size: calc(var(--auto-layout) * 0.09 * var(--article-text-size));transition: font-size 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);}article h2 {font-size: calc(var(--auto-layout) * 0.066 * var(--article-text-size));transition: font-size 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);}article h3 {font-size: calc(var(--auto-layout) * 0.052 * var(--article-text-size));transition: font-size 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);}article h4 {font-size: calc(var(--auto-layout) * 0.03 * var(--article-text-size));transition: font-size 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);margin-top: 1em;color: var(--yellow);}article b {color: var(--light);}article h1 .sectionnum, article h2 .sectionnum, article h3 .sectionnum, article h4 .sectionnum{color: var(--grey);}article p {font-size: calc(var(--auto-layout) * 0.027 * var(--article-text-size));font-weight: 400;margin-top: 1.5em;color: var(--grey);line-height: 1.8;transition: font-size 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);}article a {font-weight: 700;color: var(--yellow);background-color: var(--border);padding: 0em 0.8em 0em 0.5em;border-radius: 50rem;display: inline-flex;align-items: center;gap: 0.2em;text-decoration: none;transition: all 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);}article a::before {content: "\e90d";font-family: 'icomoon' !important;font-weight: 700;opacity: 0.5;}article a:hover {color: var(--dark) !important;background-color: var(--yellow);}pre {background-color: var(--fluent-dark);color: #f8f8f2;font-family: 'JetBrains Mono', monospace;font-size: 1em;padding: 1.5em;border-radius: 10px;margin: 1em 0;overflow-x: auto;white-space: pre-wrap;}pre code {display: block;color: var(--grey);font-size: 1em;line-height: 1.5;word-wrap: break-word;}article ul {list-style: none;padding-left: 1em;}article ul li {position: relative;margin-block-start: 1em;margin-block-end: 1em;margin-inline-start: 0px;margin-inline-end: 0px;padding-inline-start: 2em;}article ul li::before {content: "\e90c";font-family: 'icomoon' !important;position: absolute;left: 0;top: 0;color: var(--grey);font-size: 1em;}article ol {list-style: none;counter-reset: list-counter;padding-left: 1em;}article ol li {position: relative;margin-block-start: 1em;margin-block-end: 1em;margin-inline-start: 0px;margin-inline-end: 0px;padding-inline-start: 2em;}article ol li::before {counter-increment: list-counter;content: counter(list-counter) '.';position: absolute;left: 0;top: 0;font-weight: bold;color: var(--grey);font-size: 1em;line-height: 1.5;}blockquote {font-style: italic;color: var(--yellow);border-left: 4px solid var(--border);padding-left: 1em;margin: 1em 0;}article figure {display: block;margin: 2em auto;text-align: center;}article figure img {object-fit: contain;max-width: 100%;border-radius: 12px;box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);margin-bottom: 0.5em;}article figure figcaption {font-size: 0.9em;color: var(--grey-50);font-style: italic;line-height: 1.4;margin-top: 0.5em;}.t\:body {font-size: calc(var(--auto-layout) * 0.024);}.t\:caption {font-size: calc(var(--auto-layout) * 0.02);line-height: 1.2;}.t\:bold {font-weight: 750;}.t\:center {text-align: center;}.t\:right {text-align: right;}[data-js="clock"] {text-transform: uppercase;}:root {--light: #D4CCC3;--grey: #A69581;--grey-50: #93887b8d;--dark: #1B1917;--fluent-dark: rgba(27, 25, 23, 0.9);--top-border: rgba(255, 255, 255, 0.025);--black: #131110;--border: #3935318f;--red: #FF7D8C;--yellow: #FFAD56;--green: #71F24D;--btn-blur: calc(var(--auto-layout) * 0.01);--panel-blur: calc(var(--auto-layout) * 0.1);--btn-shadow: 0px calc(var(--auto-layout) * 0.004) calc(var(--auto-layout) * 0.016) 0px #14121149;}.c\:light {color: var(--light) !important;}.g\:light {background-color: var(--light) !important;}.c\:grey {color: var(--grey) !important;}.c\:grey-50 {color: var(--grey-50) !important;}.g\:grey {background-color: var(--grey) !important;}.c\:dark {color: var(--dark) !important;}.g\:dark {background-color: var(--dark) !important;}.g\:fluent-dark {background-color: var(--fluent-dark) !important;}.c\:black {color: var(--black) !important;}.g\:black {background-color: var(--black) !important;}.c\:red {color: var(--red) !important;}.g\:red {background-color: var(--red) !important;}.c\:yellow {color: var(--yellow) !important;}.g\:yellow {background-color: var(--yellow) !important;}.c\:green {color: var(--green) !important;}.g\:green {background-color: var(--green) !important;}.g\:0 {background-color: transparent !important;}.wave {transform-origin: 70% 70%;display: inline-block;opacity: 0;}.w\:full {width: 100% !important;}.h\:full {height: 100% !important;}.vw\:full {width: 100vw;}.vh\:full {height: 100vh;}.l\:fixed {position: fixed;}.l\:flex {display: flex;}.l\:none {display: none;}.l\:block {display: block;}.l\:in-block {display: inline-block;}.l\:in-flex {display: inline-flex;}.l\:column {display: flex;flex-direction: column;}.l\:relative {position: relative;}.l\:absolute {position: absolute;}.l\:grow {flex-grow: 1;}.o\:0 {opacity: 0;}.v\:0 {visibility: hidden;}.flow\:0 {overflow: hidden;}[clickable] {pointer-events: auto;}[unclickable] {pointer-events: none !important;}.b\:top {border-top: calc(var(--auto-layout) * 0.002) solid var(--dark);}.b\:bottom {border-bottom: calc(var(--auto-layout) * 0.002) solid var(--dark);}.b\:left {border-left: calc(var(--auto-layout) * 0.002) solid var(--dark);}.b\:right {border-right: calc(var(--auto-layout) * 0.002) solid var(--dark);}.b\:0 {border: 0 !important;}.r\:0 {border-radius: 0 !important;}.r\:pill {border-radius: 50rem;}.gap\:s {gap: calc(var(--auto-layout) * 0.006);}.gap\:m {gap: calc(var(--auto-layout) * 0.03);}.gap\:l {gap: calc(var(--auto-layout) * 0.04);}.sY\:s {padding: calc(var(--auto-layout) * 0.01) 0;}.sY\:m {padding: calc(var(--auto-layout) * 0.02) 0;}.sY\:l {padding: calc(var(--auto-layout) * 0.03) 0;}.sY\:xl {padding: calc(var(--auto-layout) * 0.04) 0;}.sY\:xxl {padding: calc(var(--auto-layout) * 0.05) 0;}.sXY\:l {padding: calc(var(--auto-layout) * 0.03) }.sX\:xxl {padding: 0 calc(var(--auto-layout) * 0.05);}body {background-color: var(--black);color: var(--light);}[data-barba='container'] {position: fixed;width: 100%;top: 0;left: 0;bottom: 0;overflow-y: scroll;overflow-x: hidden;box-shadow: 0px calc(var(--auto-layout) * -0.002) 0px 0px #292524, 0px -23px 69.9px 0px var(--black);background-color: var(--black);}main {display: flex;justify-content: center;position: absolute;width: 100vw;min-height: 100vh;}.wrapper {position: relative;width: calc(var(--auto-layout) * 1.45);}[data-barba-namespace="Home"] .wrapper\:section {position: relative;padding-right: calc(var(--auto-layout) * 0.06);padding-left: calc(var(--auto-layout) * 0.06);flex-grow: 1;}.wrapper\:section {position: relative;padding-right: calc(var(--auto-layout) * 0.06);padding-left: calc(var(--auto-layout) * 0.06);}.wrapper\:blog {position: relative;padding-right: calc(var(--auto-layout) * 0.25);padding-left: calc(var(--auto-layout) * 0.25);}.loading-screen {z-index: 2040;position: fixed;width: 100%;height: 101vh;background-color: var(--dark);opacity: 1;pointer-events: auto;clip-path: inset(0 0 0% 0);}.loading-words {display: flex;position: absolute;position: relative;align-items: center;justify-content: center;transform: translateY(100);color: var(--grey);opacity: 0;}.words-container {position: absolute;top: 50%;left: 50%;overflow: hidden;transform: translate(-50%, -50%);}.backdrop {visibility: hidden;z-index: 10;position: fixed;width: 100vw;height: 100vh;opacity: 0;transition: all 1s cubic-bezier(0.5, 0, 0.5, 1);}.backdrop-note {z-index: 1000;position: absolute;right: 0;width: calc(var(--auto-layout) * 0.6);height: 100vh;opacity: 0;mask-image: linear-gradient(to left, #000000 0%, transparent 100%);background: rgba(27, 25, 23, 1);transition: opacity 0.6s cubic-bezier(0.5, 0, 0.5, 1);}.backdrop-note.active {opacity: 1;}.backdrop.active {visibility: visible;background: rgba(20, 18, 17, 0.95);opacity: 1;transition: all 0.9s cubic-bezier(0, 0.49, 0.5, 1.06);}.backdrop-preview {top: 0;left: 0;position: absolute;width: 100vw;height: 100vh;opacity: 0;transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1);pointer-events: none;visibility: hidden;}.backdrop-preview.active {visibility: visible;background: rgba(20, 18, 17, 0.98);opacity: 1;}.headline {padding: calc(var(--auto-layout) * 0.04) 0;}.section\:full {width: 100%;height: 100vh;padding-top: calc(var(--auto-layout) * 0.03);padding-bottom: calc(var(--auto-layout) * 0.03);}.section\:divider {width: 100%;display: flex;align-items: center;gap: 1em;padding-left: 1em;padding-right: 1em;padding-top: calc(var(--auto-layout) * 0.04);padding-bottom: calc(var(--auto-layout) * 0.04);}.section\:divider .divider\:title {white-space: nowrap;display: flex;align-items: center;gap: 0.5em;}.section\:divider .divider\:title img {height: 1.6em;aspect-ratio: 1/1;}.section\:divider .divider\:line {opacity: 0.5;width: 100%;border: 0;border-top: calc(var(--auto-layout) * 0.0024) solid var(--border);}.divider\:dashed {opacity: 0.5;width: 100%;border: 0;border-top: calc(var(--auto-layout) * 0.002) dashed var(--border);}hr {opacity: 0.5;width: 100%;border: 0;border-top: calc(var(--auto-layout) * 0.002) solid var(--border);}.panel\:preview {width: calc(var(--auto-layout) * 0.5);backdrop-filter: blur(var(--panel-blur));border-radius: calc(var(--auto-layout) * 0.04);padding: calc(var(--auto-layout) * 0.05);box-shadow: var(--btn-shadow), 0 calc(var(--auto-layout) * 0.002) 0 0 #2e2a2658 inset;opacity: 0;visibility: hidden;}body.state\:is-preview #workCard {pointer-events: none;}.btn\:icon {display: inline-flex;position: relative;align-items: center !important;justify-content: center !important;aspect-ratio: 1/1;width: -moz-fit-content;width: fit-content;min-height: 2.6em;overflow: hidden;border-radius: 50rem;background: var(--fluent-dark);backdrop-filter: blur(var(--btn-blur));box-shadow: var(--btn-shadow);font-size: calc(var(--auto-layout) * 0.03);white-space: nowrap;pointer-events: visible;box-shadow: 0 calc(var(--auto-layout) * 0.002) 0 0 var(--top-border) inset;}.btn {background: var(--fluent-dark);backdrop-filter: blur(var(--btn-blur));box-shadow: var(--btn-shadow);border-radius: calc(var(--auto-layout) * 0.05);overflow: hidden;}.btn\:primary {position: relative;display: inline-flex;font-size: calc(var(--auto-layout) * 0.03);width: fit-content;min-width: 3.5em;min-height: 2.6em;align-items: center;justify-content: center;white-space: nowrap;cursor: pointer;overflow: hidden;color: var(--grey);padding: calc(var(--auto-layout) * 0.02) calc(var(--auto-layout) * 0.03);border-radius: calc(var(--auto-layout) * 0.05);pointer-events: visible;user-select: none;transition: color 0.2s ease, opacity 0.2s ease, background 0.5s ease;will-change: padding, height;box-shadow: 0 calc(var(--auto-layout) * 0.002) 0 0 var(--top-border) inset;}.btn\:primary:hover {color: var(--dark);}.btn\:primary img {height: 1.1em;object-fit: contain;}.text-size-btn.active-menu .btn\:primary {background-color: var(--border);color: var(--yellow);}.btn\:transparent {background: var(--dark);}.btn-hover\:yellow {color: var(--yellow) !important;}.btn-hover\:yellow:hover {background: var(--yellow);color: var(--dark) !important;}.btn\:icon img {height: calc(var(--auto-layout) * 0.058);object-fit: contain;display: block;}.magnetic\:filler-wrapper {position: absolute;width: 100%;height: 100%;border-radius: 50rem;overflow: hidden;top: 0;left: 0;opacity: 1;transition: opacity 0.6s cubic-bezier(0.26, 1, 0.48, 1);}.magnetic\:filler-wrapper.disabled {opacity: 0 !important;}.magnetic\:filler {position: absolute;top: -50%;left: -25%;width: 150%;height: 200%;transform: translate3d(0, -100%, 0);border-radius: 50%;background: var(--grey);filter: blur(1em);opacity: 0;will-change: transform;}.magnetic\:filler-stop {position: absolute;top: -50%;left: -25%;width: 150%;height: 200%;transform: translate3d(0, 100%, 0);border-radius: 50%;background: var(--red);filter: blur(1em);opacity: 0;transition: transform 1.4s cubic-bezier(0.075, 0.82, 0.165, 1), opacity 1s cubic-bezier(0.26, 1, 0.48, 1) !important;}.magnetic\:filler.filler\:colored {background: conic-gradient(from 180deg at 50% 50%, #FF818F 0deg, #9BBAC7 180deg, #FFAD56 360deg);}.navbar {position: fixed;flex-wrap: wrap;width: 100vw;height: var(--nav-height);pointer-events: none;display: flex;align-items: center;justify-content: center;}.navbar\:top {z-index: 50;position: fixed;top: 0;}.navbar\:bottom {z-index: 10;position: fixed;bottom: 0;}.navbar\:center {position: absolute;width: 100%;height: 100%;}.navbar\:center a {margin-right: 0;transition: margin-right 1s ease-in-out;}.navbar\:center a.active {margin-right: calc(var(--auto-layout) * 0.015);}.navbar\:spacing {flex-shrink: 0;padding-top: calc(var(--nav-height) - 0.6em);}.navbar\:hamburger {display: flex;align-items: center;justify-content: center;min-height: calc(var(--auto-layout) * 0.038);}.open-width {width: calc(var(--auto-layout) * 0.4);}.sending-width {width: calc(var(--auto-layout) * 0.15);}@keyframes wiggle {0%, 100% {transform: translateX(0);}25% {transform: translateX(calc(var(--auto-layout) * -0.01));}50% {transform: translateX(calc(var(--auto-layout) * 0.01));}75% {transform: translateX(calc(var(--auto-layout) * -0.01));}}.wiggle {animation: wiggle 0.5s ease-in-out;}.hamburger {position: relative;width: calc(var(--auto-layout) * 0.03);height: calc(var(--auto-layout) * 0.004);}.hamburger:before, .hamburger:after {content: "";position: absolute;width: 100%;height: 100%;background-color: var(--grey);border-radius: 50rem;transition: all 1s var(--ease-out-elastic);}.hamburger:before {transform: rotate(90deg);}.hamburger:after {transform: rotate(180deg);}.btn\:primary:hover .hamburger:before {background-color: var(--dark) !important;}.btn\:primary:hover .hamburger:after {background-color: var(--dark) !important;}.state\:navbar-open .hamburger:before {transform: rotate(135deg);}.state\:navbar-open .hamburger:after {transform: rotate(225deg);}body:not(.state\:navbar-open) .navbar\:hamburger:hover .hamburger:before {transform: rotate(90deg);}body:not(.state\:navbar-open) .navbar\:hamburger:hover .hamburger:after {transform: rotate(180deg);}.state\:is-preview .hamburger:before {transform: rotate(135deg);}.state\:is-preview .hamburger:after {transform: rotate(225deg);}body:not(.state\:is-preview) .navbar\:hamburger:hover .hamburger:before {transform: rotate(90deg);}body:not(.state\:is-preview) .navbar\:hamburger:hover .hamburger:after {transform: rotate(180deg);}.button-close {position: absolute;right: 0;margin-right: 0 !important;padding-right: calc(var(--auto-layout) * 0.03);color: #FF7D8C;opacity: 0;pointer-events: none;transition: opacity 0.5s ease-out;}.btn\:contact-container {padding: calc(var(--auto-layout) * 0.02) calc(var(--auto-layout) * 0.03);overflow: hidden;}#contact-area {will-change: transform;}.btn\:contact-wrapper [magnetic].is-open #contact-area {color: var(--grey);cursor: default;pointer-events: none;}.btn\:contact-wrapper [magnetic].is-open .button-close {pointer-events: visible;}.flyout-a {position: fixed;width: 100vw;height: calc(var(--auto-layout) * 0.64);background: var(--dark);z-index: 15;box-shadow: 0 0 20px 0px rgba(20, 17, 18, 0.2);padding-bottom: calc(var(--auto-layout) * 0.03);transform: translate3d(0px, -100%, 0px);will-change: transform;}.flyout-b {position: fixed;width: 100vw;height: calc(var(--auto-layout) * 0.76);background: #393531;z-index: 14;box-shadow: 0 0 20px 0px rgba(20, 17, 18, 0.2);transform: translate3d(0px, -100%, 0px);will-change: transform;}.flyout-b .flyout-b\:height {height: calc(var(--auto-layout) * 0.12);}.list-group {width: 100%;display: flex;flex-direction: column;margin-bottom: 0;padding-left: 0;}.list-menu {width: 100%;display: flex;align-items: center;gap: 0.5em;padding: calc(var(--auto-layout) * 0.03) calc(var(--auto-layout) * 0.03);position: relative;text-decoration: none;}.list-group li {opacity: 1;transition: opacity 0.3s ease;overflow: hidden;}.show-border {border-bottom: calc(var(--auto-layout) * 0.002) solid var(--border);}.list-group:hover li {opacity: 0.4;}.list-group li:hover {opacity: 1;}.card {position: relative;aspect-ratio: 322/369;width: 100%;overflow: hidden;will-change: transform;background-color: var(--fluent-dark);transition: scale 1s linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1), box-shadow 1s linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1);}.text\:icon {gap: 0.15em;}.text\:icon img {height: 1em;}:root {--card-animate: linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1) }.home\:card {border-radius: calc(var(--auto-layout) * 0.07);opacity: 0;border-top: calc(var(--auto-layout) * 0.002) solid var(--top-border);transition: scale 1s var(--card-animate), box-shadow 1s var(--card-animate), }.home\:card:hover {box-shadow: 0px 24px 0px 0px #282421;}.home\:card img.w\:full {border-radius: calc(var(--auto-layout) * 0.07) calc(var(--auto-layout) * 0.07) 0 0;padding: calc(var(--auto-layout) * 0.02);}.home\:card-text {color: var(--light);padding: 0.8em 0;position: absolute;bottom: 0;width: 100%;}.about\:card {scale: 1 !important;box-shadow: none !important;aspect-ratio: 1/1;height: calc(var(--auto-layout) * 0.25);border-radius: calc(var(--auto-layout) * 0.05);padding: calc(var(--auto-layout) * 0.025);border-top: calc(var(--auto-layout) * 0.002) solid #2e2a2658;}.about\:card img {width: 100%;height: 100%;object-fit: cover;}.input-group-form {border-bottom: 1px dashed var(--border);padding: 0 calc(var(--auto-layout) * 0.03);}.input-group-form label {padding: calc(var(--auto-layout) * 0.01) 0;}.input-group-form:not(:first-child) {margin-top: calc(var(--auto-layout) * 0.03);}.custom-select-flush, .form-control-flush {box-sizing: border-box;color: #FFAD56;background-color: transparent !important;border: none;box-shadow: none;border-radius: 0;}.input-area {padding: calc(var(--auto-layout) * 0.01) 0 calc(var(--auto-layout) * 0.03) 0;}.input-area img {height: 1em;margin-right: 0.3em;}input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active {-webkit-box-shadow: 0 0 0 100px #1B1917 inset !important;-webkit-text-fill-color: #e8e1da !important;}input::-moz-placeholder, textarea::-moz-placeholder {color: #93887b;opacity: 0.5;}input::placeholder, textarea::placeholder {color: #93887b;opacity: 0.5;}.form-control {box-sizing: border-box;width: 100%;}.form-control-flush:focus {color: #FFAD56;box-shadow: none;}label {transition: all 0.2s ease-in-out;}textarea:focus, input:focus {outline: none;}label.input-has-value {color: #667A6E;transition: all 0.2s ease-in-out;}.input-group-flush .custom-select, .input-group-flush .form-control {background-color: transparent;border-width: 0 0 1px 0;box-shadow: none;}.section-slide\:mask {top: 0;position: relative;display: flex;align-items: end;height: calc(100vh - var(--nav-height));pointer-events: none;}.section-slide\:mask.last{height: calc(100vh);align-items: center;}.section-slide\:panel {outline: calc(var(--auto-layout) * 0.002) solid #282522;aspect-ratio: 272/218;transform: translate3d(0px, 0px, 0px);border-radius: calc(var(--auto-layout) * 0.04);border: calc(var(--auto-layout) * 0.02) solid #1B1917;pointer-events: auto;position: relative;display: flex;width: 100%;justify-content: center;height: calc(100vh - var(--nav-height) * 2);overflow: hidden;background-color: var(--dark);box-shadow: 0 0 0.6em 0px rgba(0, 0, 0, 0.2) !important;}.showcase-area {z-index: 10;}[splitType] .word {opacity: 0;transform: translateY(100%);}[splitType] .line {opacity: 0;transform: translateY(100%);}.trail-effects {height: calc(var(--auto-layout) * 0.14);width: calc(var(--auto-layout) * 0.14);position: absolute;top: 0;left: 0;z-index: 10;opacity: 0;will-change: transform;}.paralax-img {left: 0;top: 0;width: 100%;position: absolute;}#grid-texture {opacity: 0.2;background-image: linear-gradient(var(--border) calc(var(--auto-layout) * 0.003), transparent calc(var(--auto-layout) * 0.003)), linear-gradient(90deg, var(--border) calc(var(--auto-layout) * 0.003), transparent calc(var(--auto-layout) * 0.003));background-size: calc(var(--auto-layout) * 0.05) calc(var(--auto-layout) * 0.05);background-color: var(--dark);height: 100%;width: 100%;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 1;}.note-form-container {background-color: var(--dark);border-radius: calc(var(--auto-layout) * 0.04);outline: calc(var(--auto-layout) * 0.002) solid #282522;box-sizing: border-box;width: calc(var(--auto-layout) * 0.3);overflow: hidden;box-shadow: rgba(0, 0, 0, 0.2) 0 0.5em 1em 0px;z-index: 50;position: absolute;bottom: calc(var(--auto-layout) * 0.14);right: calc(var(--auto-layout) * 0.04);}.drawing-area {box-sizing: border-box;padding-bottom: 0;}.hidden-border {pointer-events: none;border: calc(var(--auto-layout) * 0.03) solid var(--dark);border-radius: calc(var(--auto-layout) * 0.05);position: absolute;width: 100%;aspect-ratio: 1 / 1;}#drawingCanvas {width: 100%;aspect-ratio: 1 / 1;border-radius: calc(var(--auto-layout) * 0.05);background-color: var(--grey);border: calc(var(--auto-layout) * 0.002) solid var(--dark);}#add-note-btn {z-index: 1050;position: absolute;bottom: calc(var(--auto-layout) * 0.028);right: calc(var(--auto-layout) * 0.04);background-color: var(--yellow);color: var(--dark);transition: 1s scale var(--ease-out-elastic);box-shadow: rgba(0, 0, 0, 0.2) 0 0.5em 1em 0px;}#add-note-btn:hover {scale: 1.05;}#add-note-btn.active {color: var(--grey);background-color: var(--border);}.drag-me {padding: calc(var(--auto-layout) * 0.014);background-color: var(--grey);border-radius: calc(var(--auto-layout) * 0.03);position: absolute;width: calc(var(--auto-layout) * 0.2);box-shadow: 0 0em 1em 0em rgba(0, 0, 0, 0.25);z-index: 10;user-select: none;transition: box-shadow 0.2s cubic-bezier(0.5, 0, 0.5, 1);}.drag-me.no-frame {padding: calc(var(--auto-layout) * 0.014);background-color: transparent;width: calc(var(--auto-layout) * 0.25);box-shadow: none;}.drag-me\:secondary {padding: calc(var(--auto-layout) * 0.014);background-color: var(--grey);border-radius: calc(var(--auto-layout) * 0.03);position: absolute;user-select: none;z-index: 10;box-shadow: 0 0em 1em 0em rgba(0, 0, 0, 0.25);}.drag-image {display: flex;justify-content: center;align-items: center;flex-grow: 1;aspect-ratio: 1 / 1;overflow: hidden;border-radius: calc(var(--auto-layout) * 0.018);pointer-events: none;}.drag-image img {max-width: 100%;max-height: 100%;object-fit: contain;}.drag-image svg {width: 100%;height: 100%;border-radius: calc(var(--auto-layout) * 0.01);scale: 1.25;}.input-group\:note:first-child {border-bottom: 1px dashed var(--border);padding-bottom:calc(var(--auto-layout) * 0.02);}.input-group\:note:last-child {border-bottom: 1px dashed var(--border);padding: calc(var(--auto-layout) * 0.02) 0;}.form-control\:note {width: 100%;color: var(--grey);background-color: var(--dark);border: none;padding: 0 calc(var(--auto-layout) * 0.03);}.form-control\:note:focus {background-color: var(--dark);}.form-control\:note::placeholder {color: var(--grey);}[animated] {opacity: 0;}.repository\:card {position: relative;}#img-list-box .thumbnail img{display: block;object-fit: cover;border-radius: calc(var(--auto-layout) * 0.015);;aspect-ratio: 1 / 1;transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);cursor: pointer;}#img-list-box .thumbnail img {opacity: 0.3;}#img-list-box .thumbnail.active img {opacity: 1;outline: 2px solid var(--border);border: calc(var(--auto-layout) * 0.0065) solid var(--dark);}#img-list-box .thumbnail:hover img {opacity: 1;}.repository\:card::before {display: block;content: "";inset: 4px;background: var(--dark);opacity: 0;transition: opacity 0.2s ease-out, inset 0.2s ease-out;border-radius: calc(var(--auto-layout) * 0.04);position: absolute;}.repository\:card:hover::before {inset: -15px;opacity: 1;}.card\:aspect-ratio {position: relative;aspect-ratio: 260 / 240;width: 100%;}.card\:aspect-ratio-blog {position: relative;width: 100%;}.card\:thumbnail-wrapper {display: flex;justify-content: center;align-items: center;position: absolute;min-width: 100%;min-height: 100%;cursor: help;}.card\:thumbnail-wrapper.is-preview {cursor: default;}.card\:thumbnail-wrapper-blog {border-radius: calc(var(--auto-layout)* 0.03);position: relative;}.card\:thumbnail-wrapper-blog img{aspect-ratio: 1240 / 672;}.card\:thumbnail-wrapper-blog::after {content: "";z-index: 5;width: 100%;top: 0;left: 0;position: absolute;height: 100%;border-radius: calc(var(--auto-layout) * 0.03);box-shadow: 0px calc(var(--auto-layout) * 0.002) calc(var(--auto-layout) * 0.002) 0px rgba(255, 255, 255, 0.2) inset;}.card\:thumbnail-container {width: 100%;height: 100%;display: flex;flex-direction: column;gap: 1rem;flex-grow: 1;justify-content: center;align-items: center;position: relative;aspect-ratio: 260 / 240;user-select: none;}.card\:thumbnail-content {position: relative;max-height: 100%;max-width: 100%;height: 100%;width: 100%;transform-origin: 0% 0%;transition: transform 250ms cubic-bezier(0.23, 1, 0.32, 1), scale 250ms cubic-bezier(0.23, 1, 0.32, 1);will-change: transform;}.card\:thumbnail-content.dragging {transition: none;cursor: grab;}.card\:thumbnail {height: auto;width: auto;position: relative;max-width: 100%;max-height: 100%;display: block;object-fit: cover;background-color: var(--dark);z-index: 5;box-shadow: 0 0.8em 1em 0.2em rgba(0, 0, 0, 0.2);border-radius: calc(var(--auto-layout) * 0.03);}.card\:thumbnail-content::after {content: "";z-index: 5;width: 100%;position: absolute;height: 100%;border-radius: calc(var(--auto-layout) * 0.03);box-shadow: 0px calc(var(--auto-layout) * 0.002) calc(var(--auto-layout) * 0.002) 0px rgba(255, 255, 255, 0.2) inset;}.card\:thumbnail-title {border-radius: 50rem;border: 1px dashed var(--border);padding: calc(var(--auto-layout) * 0.02) calc(var(--auto-layout) * 0.03);margin: calc(var(--auto-layout) * 0.03);max-width: 14em;overflow: hidden;display: inline-block;z-index: 1;transition: color 1s ease-out;}.card\:thumbnail-title span {display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: var(--grey);}.card\:thumbnail-title .counter-wrapper {margin-left: calc(var(--auto-layout) * 0.01);margin-right: calc(var(--auto-layout) * -0.008);}.card\:thumbnail-title .counter-wrapper::before {content: "";background: var(--grey-50);height: calc(var(--auto-layout) * 0.04);aspect-ratio: 1 / 1;border-radius: 50rem;position: absolute;font-size: calc(var(--auto-layout) * 0.045);}.card\:thumbnail-title [data-item-count] {color: var(--yellow);font-family: 'JetBrains Mono';font-size: 0.em;height: 1.14em;aspect-ratio: 1 / 1;z-index: 10;text-align: center;}.list-h {overflow: hidden;cursor: default;transition: padding 0.65s cubic-bezier(0.175, 0.885, 0.34, 0.98);}.list-h:hover {padding-left: 1em;padding-right: 1em;}.list-h div {z-index: 1;}.list-h::before {content: "";background-color: var(--border);position: absolute;width: 100%;height: 100%;left: 0;top: 0;transform: translateY(-100%);transition: transform 0.65s cubic-bezier(0.175, 0.885, 0.34, 0.98);}.list-h:hover.list-h::before {transform: translateY(0%);}.img-compare-overlay {position: absolute;top: 0;height: auto;width: auto;max-width: 100%;max-height: 100%;object-fit: cover;clip-path: inset(0 0 0 50%);border-radius: calc(var(--auto-layout) * 0.03);opacity: 0;z-index: 10;pointer-events: none;user-select: none;}.img-compare-overlay.active {opacity: 1;pointer-events: auto;}.slider {user-select: none;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: calc(var(--auto-layout) * 0.08);aspect-ratio: 1 / 1;opacity: 0;border-radius: 50%;z-index: 12;cursor: ew-resize;border: calc(var(--auto-layout) * 0.01) solid #ffffff1d;box-shadow: 0 4px 20px 4px rgba(0, 0, 0, 0.3);pointer-events: none;transition: width 0.4s cubic-bezier(0.075, 0.82, 0.165, 1), background-color 0.4s cubic-bezier(0.075, 0.82, 0.165, 1), box-shadow 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);background-color: #ffffff9b;backdrop-filter: blur(4px);}.slider::after {content: "";width: calc(var(--auto-layout) * 0.005);height: calc(var(--auto-layout) * 0.035);background-color: var(--border);border-radius: 50rem;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}.slider.active {opacity: 1;pointer-events: auto;}.slider.dragging {box-shadow: 0 4px 20px 4px rgba(0, 0, 0, 0.1);background-color: #e8e1da4a;}.panel\:detail a:hover {color: var(--yellow) !important }.mask-top {height: calc(var(--nav-height) * 1.4);mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);pointer-events: none;z-index: 6;background: var(--black);position: fixed;top: 0;visibility: visible;width: 100%;}.mask-top2 {height: calc(var(--nav-height) * 1);mask-image: linear-gradient(to bottom, #000 0%, rgba(0, 0, 0, 0.7) 50%, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);pointer-events: none;z-index: 6;background: var(--black);position: fixed;top: 0;visibility: visible;width: 100%;}.mask-bottom {height: calc(var(--nav-height) * 0.7);mask-image: linear-gradient(to top, #000 0%, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.3) 70%, rgba(0, 0, 0, 0) 100%);pointer-events: none;z-index: 1;background: var(--black);position: fixed;bottom: 0;visibility: visible;width: 100%;opacity: 0.7;}.navbar\:blur-bottom {z-index: 5;position: fixed;bottom: 0;left: 0;}.blur-layer {position: absolute;bottom: 0;left: 0;width: 100vw;height: calc(var(--nav-height));z-index: 5;pointer-events: none;}.blur-1 {backdrop-filter: blur(calc(0.3px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 20%);}.blur-2 {backdrop-filter: blur(calc(1.2px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 10%, rgb(0, 0, 0) 30%);}.blur-3 {backdrop-filter: blur(calc(2.7px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 20%, rgb(0, 0, 0) 40%);}.blur-4 {backdrop-filter: blur(calc(4.8px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 30%, rgb(0, 0, 0) 50%);}.blur-5 {backdrop-filter: blur(calc(7.5px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 40%, rgb(0, 0, 0) 60%);}.blur-6 {backdrop-filter: blur(calc(10.8px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 50%, rgb(0, 0, 0) 70%);}.blur-7 {backdrop-filter: blur(calc(14.7px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 60%, rgb(0, 0, 0) 80%);}.blur-8 {backdrop-filter: blur(calc(16.2px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 70%, rgb(0, 0, 0) 90%);}.blur-9 {backdrop-filter: blur(calc(18.3px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 80%, rgb(0, 0, 0) 100%);}.blur-10 {backdrop-filter: blur(calc(25px * var(--blur-percent)));mask-image: linear-gradient(rgba(0, 0, 0, 0) 90%, rgb(0, 0, 0) 100%);}