:root{--bg: #0f1115;--surface: #151820;--text: #e6e6e6;--muted: #a0a4ab;--border: rgb(68, 71, 81);--body-width: 1000px;--body-width-padding: 1rem;--project-gaps: 10px;--exp-item-margin: 1rem;--color-bg: #0f1115;--color-surface: #445154;--color-surface-dark: #3a3a3a;--color-text: #dbdbdb;--color-text-muted: rgb(122, 124, 129);--color-border: rgb(85, 88, 100);--color-accent: #7dd3fc;--color-accent-vibrant: #315f6b;--color-accent-muted: #60bdc4;--color-accent-dull: #1e6166;--color-accent-dark: #4f5555;--color-code-bg: #1d1f21;--code-padding: 12px}body{font-family:system-ui,sans-serif;background:var(--color-bg);color:var(--color-text);line-height:1.7;max-width:var(--body-width);margin:0 auto;padding:1.5rem var(--body-width-padding)}a{color:var(--color-text);text-decoration:none}a:hover{color:var(--color-accent)}section{margin-bottom:3.5rem}h2{font-size:1.45rem;color:var(--color-accent);font-weight:500}hr{border:0;border-top:1px solid var(--color-border);margin:0}pre{border:solid 1px var(--color-border);border-radius:3px;background-color:var(--color-code-bg)}code{display:block;padding:var(--code-padding)}button,input[type=button],input[type=submit]{background-color:var(--color-accent-vibrant);color:var(--color-text);padding:6px 8px;cursor:pointer;border:1px solid color-mix(in srgb,var(--color-accent-vibrant),white 7.5%);border-radius:3px}button:hover,input[type=button]:hover{color:var(--color-bg);background-color:var(--color-accent-muted);border:1px solid color-mix(in srgb,var(--color-accent-muted),white 25%)}input[type=checkbox],input[type=radio]{cursor:pointer;accent-color:var(--color-accent)}input[type=color]{cursor:pointer}input[type=date]{color-scheme:dark}input[type=file]::file-selector-button{background-color:var(--color-surface-dark);color:var(--color-text);border:1px solid color-mix(in srgb,var(--color-surface-dark),white 25%);border-radius:3px;padding:6px;cursor:pointer}input[type=text],input[type=password],input[type=email],textarea,select{box-shadow:none;background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:3px;color:var(--color-text);padding:5px 5px 5px 8px;font-size:1rem;font-family:inherit;box-sizing:border-box;width:100%;max-width:300px}textarea{min-height:100px;max-width:min(600px,100%)}select{font-size:revert}input[type=range]{appearance:none;background:transparent;cursor:pointer;width:100%;max-width:300px}input[type=range]::-webkit-slider-runnable-track{background:var(--color-surface-dark);height:.5rem;border-radius:.5rem}input[type=range]::-webkit-slider-thumb{appearance:none;margin-top:-4px;background-color:var(--color-accent);height:1rem;width:1rem;border-radius:50%}progress{appearance:none;width:100%;max-width:300px;height:.75rem}progress::-webkit-progress-bar{background-color:var(--color-surface-dark);border-radius:3px}progress::-webkit-progress-value{background-color:var(--color-accent);border-radius:3px}progress::-moz-progress-bar{background-color:var(--color-accent);border-radius:3px}summary{cursor:pointer}#site-header{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:16px;margin:0 auto 1.5rem;width:fit-content}#site-logo{grid-row:1 / span 2;width:4.5rem;image-rendering:pixelated}#site-title{margin:0;font-size:1.5rem;font-weight:700;color:var(--color-text);align-self:end}#site-motto{font-size:1.1rem;color:var(--color-accent)}#navigation-bar{display:flex;justify-content:center;gap:2rem;margin-bottom:2.75rem;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);padding:.5rem 0;box-sizing:border-box}#navigation-bar a{color:var(--color-text);text-decoration:none;font-weight:500}#navigation-bar a:hover{color:var(--color-accent)}.search-wrapper{position:relative;display:flex;align-items:center;margin:0 auto 2rem;width:100%;max-width:350px;height:2rem}.search-input{z-index:1;flex:1;height:100%;padding:0 1rem!important;border-right:none!important;border-radius:1rem 0 0 1rem!important;outline:none;max-width:none!important;box-sizing:border-box}.search-btn{z-index:2;height:100%;border-radius:0 1rem 1rem 0;padding:.5rem;cursor:pointer;aspect-ratio:1 / 1;background-image:url(/static/search-icon.png);background-size:contain;background-repeat:no-repeat;background-origin:content-box;background-position:center;background-color:transparent;border-color:var(--color-border);border-left:none}.search-dropdown{display:none;position:absolute;height:fit-content;box-sizing:border-box;top:calc(100% - 1px);left:50%;width:calc(100% - 1.5rem);background-color:var(--color-surface);border:1px solid color-mix(in srgb,var(--color-border),white 25%);border-top:none;border-radius:0 0 4px 4px;transform:translate(-50%)}.search-dropdown a{display:block;padding:.75rem 1rem;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-top:1px solid color-mix(in srgb,var(--color-border),white 25%)}.search-dropdown a:focus,.search-dropdown a:active{background-color:var(--color-accent-dull)}.search-dropdown a:last-of-type{border-bottom:0}.search-wrapper:focus-within .search-dropdown,.search-input:active~.search-dropdown,.search-input:focus~.search-dropdown,.search-btn:active~.search-dropdown,.search-btn:focus~.search-dropdown,.search-dropdown:focus,.search-dropdown:active,.search-dropdown:hover{display:block}.search-more{text-align:center;background-color:#00000040}.search-nonefound,.search-loading{pointer-events:none}#snippet-header{display:flex;flex-wrap:wrap;justify-content:center;row-gap:2rem;column-gap:1.5rem;margin-bottom:2.5rem}#snippet-thumbnail{border:1px solid var(--color-border);border-radius:5px;flex:1;aspect-ratio:16 / 9;align-self:center;box-sizing:border-box;display:block;max-width:500px;width:100%}#snippet-card-title-wrapper{display:flex;justify-content:center;flex-direction:column;flex:1;min-width:min(calc(100% - calc(var(--body-width-padding) * 2)),370px)}#snippet-card-title{display:inline-block;margin:0;margin-bottom:1.25rem;word-wrap:break-word;font-size:1.75rem}#snippet-author{font-weight:700;margin-bottom:1.25rem;font-size:1.3rem;color:var(--color-text-muted);width:fit-content}#snippet-author:not(.snippet-no-author):hover{color:var(--color-accent-muted)}#snippet-creation-date,#snippet-update-date{color:var(--color-text-muted);line-height:1.4;width:fit-content}#snippet-content{margin-bottom:4rem;line-height:1.5}#snippet-content img{width:100%}#snippet-content a{text-underline-offset:2px;color:var(--color-accent);text-decoration:underline}.card{--card-img-size: 130px;--card-gap: 20px;--card-radius: 6px;display:flex;flex-direction:row;align-items:center;gap:var(--card-gap);padding-bottom:1.5rem;border-radius:var(--card-radius);width:100%;box-sizing:border-box}.card-image-link{flex-shrink:0;align-self:baseline;width:18%;min-width:80px;aspect-ratio:1/1;display:block}.card img{width:100%;height:100%;border-radius:var(--card-radius);object-fit:cover;display:block;border:1px solid var(--color-border);background-color:var(--color-surface)}.card-body{display:flex;flex-direction:column;gap:4px;min-width:0}.card-date{font-size:.8rem;color:var(--muted);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.card-title{font-size:1.1rem;font-weight:500;color:var(--text);line-height:1.3;margin:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;cursor:pointer}.card-description{font-size:.85rem;color:color-mix(in srgb,var(--color-text) 75%,black);line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;margin-top:.5rem}.card.is-loading .card-image-link,.card.is-loading .card-date,.card.is-loading .card-title,.card.is-loading .card-description{background:var(--color-surface);background:linear-gradient(90deg,var(--color-surface) 25%,color-mix(in srgb,var(--color-surface),white 4%) 50%,var(--color-surface) 75%);background-size:200% 100%;-webkit-animation:2s card-shine linear infinite;animation:2s card-shine linear infinite;color:transparent;pointer-events:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;border:none;border-radius:3px}.card.is-loading img{visibility:hidden}.card.is-loading .card-date,.card.is-loading .card-title,.card.is-loading .card-description{width:fit-content}.card.is-loading{cursor:default;pointer-events:none}.card.is-loading .card-image-link img{border:none}@-webkit-keyframes card-shine{to{background-position-x:-200%}}@keyframes card-shine{to{background-position-x:-200%}}.codetabs{position:relative;width:100%;border:1px solid var(--color-border);border-radius:3px;overflow:hidden;margin-bottom:1rem}.codetabs-topbar{display:flex;gap:.5rem;align-items:center;height:3.25rem;width:100%;background-color:var(--color-accent-dark);padding:5px .6rem 0;overflow-x:scroll;box-sizing:border-box}.codetabs-topbar::-webkit-scrollbar{width:7px;height:7px}.codetabs-topbar::-webkit-scrollbar-thumb{border:8px solid;border-radius:1rem;color:transparent}.codetabs:hover .codetabs-topbar::-webkit-scrollbar-thumb{color:#a9a9a9}.codetabs-topbar::-webkit-scrollbar-thumb:hover{color:gray!important}.codetabs-topbar button{font-weight:700;background-color:transparent;color:var(--color-text);padding:.4rem .6rem;border-radius:3px;border-color:color-mix(in srgb,var(--color-border),white 25%);border-style:solid;border-width:1px;cursor:pointer}.codetabs-topbar button:hover{background-color:#0003}.codetabs-selected{background-color:#0006!important}.codetabs select{width:6rem;background-color:#00000040;color:var(--color-text);padding:.4rem;border-radius:3px;border-color:color-mix(in srgb,var(--color-border),white 25%)}.codetabs select option{background-color:var(--color-surface)}.codetabs-copy{height:2.25rem;width:2.25rem;position:absolute;right:1.5rem;margin-top:.75rem;cursor:pointer;padding:5px;border-radius:5px;image-rendering:pixelated;background-color:var(--color-accent-dull);background-image:url(/static/copy-icon.png);background-repeat:no-repeat;background-size:contain;background-origin:content-box;transition:background-image 0s 1s}.codetabs-copy:hover{background-color:var(--color-accent-dull)}.codetabs-copy:active{background-image:url(/static/copy-done-icon.png);transition-delay:0s}.codetabs-content pre{display:none;margin:0;border:none;padding:0}.codetabs-content code{height:fit-content;min-height:2.25rem;overflow-y:scroll;overflow-x:auto;outline-offset:-3px}.codetabs-active{display:block!important}.codetabs-content code::-webkit-scrollbar{width:13px;height:13px;background-color:transparent;border-left:solid 1px rgba(255,255,255,.2)}.codetabs-content code::-webkit-scrollbar:horizontal{border:none}.codetabs-content code::-webkit-scrollbar-thumb{background-color:#80808080;cursor:default}.codetabs-content code::-webkit-scrollbar-thumb:hover{background-color:#808080b3}.codetabs-content code::-webkit-scrollbar-corner{background-color:transparent;border-left:solid 1px rgba(255,255,255,.2)}footer{margin-top:4.5rem;padding:1rem 0;border-top:1px solid var(--border);color:var(--muted);text-align:center}footer a{color:var(--muted)}#contacts{margin-bottom:2rem;display:flex;justify-content:center;font-size:2.25rem;gap:1rem;font-weight:400!important}#contacts a{display:inline-block;position:relative;color:var(--color-text-muted);text-decoration:none;background-size:contain;height:2.5rem;width:2.5rem;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;mask-size:contain}#contacts a:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--color-text-muted);mask-repeat:no-repeat;mask-size:contain;mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center}#contacts a:hover:after{background-color:var(--color-accent)}#stackoverflow-contact:after{-webkit-mask-image:url(/static/stack-overflow-icon.png);mask-image:url(/static/stack-overflow-icon.png)}#linkedin-contact:after{-webkit-mask-image:url(/static/linkedin-icon.png);mask-image:url(/static/linkedin-icon.png)}#instagram-contact:after{-webkit-mask-image:url(/static/instagram-icon.png);mask-image:url(/static/instagram-icon.png)}#github-contact:after{-webkit-mask-image:url(/static/github-icon.png);mask-image:url(/static/github-icon.png)}#email-contact:after{-webkit-mask-image:url(/static/email-icon.png);mask-image:url(/static/email-icon.png)}#bottom-note{margin-top:1rem;font-size:.8rem}@supports (-moz-appearance: none){.codetabs-topbar{padding-bottom:6px}}