@font-face { font-family: "Inter", sans-serif; src: url("https://fonts.googleapis.com/css2?family=Inter&display=swap"); }

footer { display: flex; align-items: center; justify-content: center; margin: 16px; margin-top: auto; }

footer a { transition: 200ms ease all; display: flex; align-items: center; margin: 0px 16px; gap: 4px; color: rgba(255, 255, 255, 0.5); fill: rgba(255, 255, 255, 0.5); }

footer a:hover { color: rgba(255, 255, 255, 0.85); fill: rgba(255, 255, 255, 0.85); }

footer .icon { width: 20px; height: 20px; }

footer .icon.github, footer .icon.gitlab { padding: 1px; }

@media (max-width: 600px) { footer { display: grid; grid-template-columns: repeat(2, 1fr); margin: 0px auto 16px; gap: 4px; } }

header { transition: 200ms ease all; position: sticky; top: 0; z-index: 10000; }

.navbar { margin: 0 auto 16px; max-width: var(--content-width); background-color: #203747; box-shadow: 0px 4px 11px rgba(0, 0, 0, 0.12); border-radius: 0 0 4px 4px; display: flex; position: relative; }

.navbar__item, .navbar__dropdown-label { float: left; color: rgba(255, 255, 255, 0.4); text-align: center; align-items: center; padding: 17px 19px; transition: 200ms ease all; font-weight: 500; display: flex; gap: 8px; }

.navbar__item:hover, .navbar__dropdown-label:hover { color: rgba(255, 255, 255, 0.8); fill: rgba(255, 255, 255, 0.8); }

.navbar__item.highlight, .navbar__dropdown-label.highlight { color: #3dadff !important; }

.navbar__item .icon, .navbar__dropdown-label .icon { height: 20px; width: 20px; }

.navbar__item .icon.github, .navbar__dropdown-label .icon.github { fill: rgba(255, 255, 255, 0.4); }

.navbar__dropdown { position: relative; display: flex; width: max-content; background-color: #203747; }

.navbar__dropdown.highlight .navbar__dropdown-label { color: #3dadff !important; }

.navbar__dropdown-content { box-shadow: 0px 4px 11px rgba(0, 0, 0, 0.12); display: none; flex-direction: column; position: absolute; z-index: 10000; width: max-content; top: 54px; }

.navbar__dropdown-content:hover { display: flex; }

.navbar__dropdown-label { z-index: 6; background-color: #203747; }

.navbar__dropdown-entry { background-color: #203747; width: 100%; padding: 8px 16px; }

.navbar__dropdown-entry:last-of-type { border-radius: 0 0 4px 4px; }

.navbar__dropdown:hover .navbar__dropdown-content { display: flex; }

.navbar__item--menu-foldout { display: none; position: absolute; top: 0; right: 0; cursor: pointer; }

.navbar--foldout { flex-direction: column; }

.navbar--foldout .navbar__dropdown-content { display: flex; position: unset; box-shadow: none; width: 100%; padding-left: 32px; margin-top: -16px; }

.navbar--foldout .navbar__dropdown { flex-direction: column; }

@media (max-width: 800px) { .navbar { flex-direction: column; } .navbar__dropdown { width: 100%; } .navbar__item--menu-foldout { display: flex !important; } .navbar__dropdown { width: 100%; } .navbar:not(.navbar--foldout) > .navbar__dropdown:hover .navbar__dropdown-content { display: none; } .navbar:not(.navbar--foldout) > .navbar__item:not(.highlight), .navbar:not(.navbar--foldout) > .navbar__dropdown:not(.highlight) { display: none; } }

h1, h2, h3, h4 { color: #3dadff; display: flex; align-items: center; gap: 12px; margin: 4px 0; }

h1:after, h2:after, h3:after, h4:after { display: block; content: ""; height: 4px; background: rgba(221, 221, 221, 0.15); flex: 1 1 0%; border-radius: 4px; }

h1 { font-size: 32px; }

h2 { font-size: 24px; }

h3 { font-size: 20px; }

h4 { font-size: 18px; }

hr { height: 4px; width: 100%; background: rgba(221, 221, 221, 0.15); border: none; border-radius: 4px; }

* { box-sizing: border-box; }

body { background-color: #0e1d2b; font-family: "Inter", sans-serif; color: rgba(255, 255, 255, 0.85); margin: 0px; width: 100%; display: flex; flex-direction: column; min-height: 100vh; overflow-y: scroll; }

a { color: #3dadff; text-decoration: none; transition: 100ms ease all; }

a:hover { color: #ffc85c; }

main { margin: 0px auto; width: var(--content-width); }

main > * { margin-top: 0; }

.noscript { border-radius: 4px; display: flex; flex-direction: column; justify-content: space-around; }

ul { list-style-type: disc; }

ul code { line-height: 26px; }

strong { font-weight: 800; }

/** inline code  and code blocks **/
code.language-plaintext { font-family: "Inter", sans-serif; background: #1a2c39; border-radius: 4px; padding: 0px 6px; color: #3dadff; font-size: 14px; }

pre.highlight { background-color: #1a2c39; border-radius: 4px; padding: 8px; font-family: "Inter", sans-serif; color: white; font-size: 14px; }

.language-ini .nn { color: #3dadff; font-weight: 700; }

.button { width: 100%; padding: 16px; display: flex; align-items: center; justify-content: center; gap: 8px; }

.button .icon { width: 20px; height: 20px; }

.button--primary { background: linear-gradient(135deg, #3dadff 0%, #2664c0 100%); }

.button--primary:hover { background: linear-gradient(135deg, #57b8ff 0%, #2b6fd5 100%); }

.button--secondary { background-color: #2d3a46; }

.button--secondary:hover { background: #3b4c5c; }

button { border: none; }

.icon-input-container { display: flex; position: relative; align-items: center; }

.icon-input-container input:focus-visible ~ .icon, .icon-input-container input:focus ~ .icon, .icon-input-container select:focus-visible ~ .icon, .icon-input-container select:focus ~ .icon { color: rgba(255, 255, 255, 0.85); }

.icon-input-container .icon { color: rgba(255, 255, 255, 0.5); width: 16px; height: 16px; margin: 8px; position: absolute; z-index: 2; left: 0; }

.icon-input-container input, .icon-input-container select { width: 100%; z-index: 1; }

.icon-input-container:not(.icon-input-container--right-align) input, .icon-input-container:not(.icon-input-container--right-align) select { padding-left: 32px; }

.icon-input-container--right-align .icon { left: unset; right: 0; }

input[type="date"], input[type="text"], input[type="number"], select, textarea { padding: 8px; border-radius: 4px; color: rgba(255, 255, 255, 0.5); border: 1px solid #1a2c39; transition: 200ms ease all; background-color: #1a2c39; font-size: 12px; outline: none; }

input[type="date"]:focus-visible, input[type="date"]:focus, input[type="text"]:focus-visible, input[type="text"]:focus, input[type="number"]:focus-visible, input[type="number"]:focus, select:focus-visible, select:focus, textarea:focus-visible, textarea:focus { border: 1px solid #ffc85c; color: rgba(255, 255, 255, 0.85); }

textarea { resize: vertical; }

input[type="date"], select { cursor: pointer; }

select { appearance: none; }

button, .button, summary { border-radius: 4px; color: rgba(255, 255, 255, 0.85); box-shadow: 0px 4px 11px rgba(0, 0, 0, 0.12); transition: all 250ms ease; cursor: pointer; user-select: none; margin-bottom: 8px; }

button:hover, .button:hover, summary:hover { box-shadow: 0px 4px 11px rgba(0, 0, 0, 0.24); color: rgba(255, 255, 255, 0.85); }

details summary { padding: 8px; width: max-content; background: linear-gradient(135deg, #3dadff 0%, #2664c0 100%); }

details summary:hover { background: linear-gradient(135deg, #57b8ff 0%, #2b6fd5 100%); }

details summary:before { content: "Expand "; }

details[open] summary:before { content: "Hide "; }

.checkbox-label { display: flex; width: max-content; align-items: center; gap: 4px; }

.checkbox-label input[type="checkbox"] { order: -1; }

input[type="checkbox"] { appearance: none; border: 1px solid #3dadff; border-radius: 4px; height: 1em; width: 1em; cursor: pointer; outline: 2px solid transparent; transition: ease 200ms all; background-color: #1a2c39; }

input[type="checkbox"]:hover { outline-color: #ffc85c; }

input[type="checkbox"]:checked { background-color: #3dadff; }

/** These classes should NEVER be used for regular styling, these are only helper classes for JS */
.hidden { display: none !important; }

.grid { display: grid !important; }

.flex { display: flex !important; }

.freeze { overflow-y: hidden !important; }

.announcement { display: flex; max-width: 100%; }

.announcement__link { max-width: 100%; max-height: 100px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 4px; }

.announcement__image { max-width: 100%; object-fit: fill; }

.error-404 { display: flex; flex-direction: column; }

.error-404 .code { width: max-content; margin: auto; font-size: 96px; color: #3dadff; }

.error-404 .shrug { width: max-content; margin: auto; font-size: 32px; color: rgba(255, 255, 255, 0.85); }

:root { --content-width: 1320px; }

.icon { user-select: none; width: 20px; height: 20px; }

@media (max-width: 1320px) { :root { --content-width: 100vw; } main { padding: 0px 16px; } }

/*# sourceMappingURL=jekyll-theme.css.map */