:root{--color-bg:#0f1115;--color-surface:#181b22;--color-elevated:#20242d;--color-border:#303642;--color-text:#f3f5f7;--color-text-muted:#b2bac5;--color-text-faint:#7b8594;--color-accent:#f67c05;--color-info:#3b82f6;--color-success:#22c55e;--color-important:#a371f7;--color-warning:#fbbf24;--color-error:#ef4444;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4rem;--space-9:6rem;--radius-sm:.5rem;--radius-md:.75rem;--radius-lg:1rem;--radius-full:100vmax;--content-width:1200px;--project-card-width:340px;--shadow:0 1px 3px 0 #00000040, 0 1px 2px -1px #00000040;--shadow-hover:0 4px 6px -1px #00000040, 0 2px 4px -2px #00000040;--border:.15em solid var(--color-border);--border-thick:.3em solid var(--color-border);--font-body:"Inter";--font-mono:"JetBrains Mono";--text-sm:.875rem;--text-base:1rem;--text-lg:1.25rem;--heading-1:clamp(2.3rem, 6vw, 4rem);--heading-2:clamp(1.75rem, 4vw, 2.5rem);--heading-3:1.4rem}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}button{cursor:pointer}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word;line-height:1.2}img,picture,svg{max-width:100%;display:block}button,input,textarea,select{font:inherit}body{margin:0}main{gap:var(--space-4);margin:var(--space-4) var(--space-6);align-items:flex-start;display:grid}::selection{background-color:var(--color-info);color:var(--color-text)}body{font-family:var(--font-body), sans-serif;font-size:var(--text-base);background-color:var(--color-bg);color:var(--color-text);grid-template-rows:auto 1fr auto;min-height:100dvh;line-height:1.6;display:grid}h1{font-size:var(--heading-1)}h2{font-size:var(--heading-2)}h3{font-size:var(--heading-3)}a{color:var(--color-info);&:hover{opacity:.7}}ul,ol{padding-inline-start:40px}:focus-visible{outline:2px solid var(--color-info);outline-offset:4px;border-radius:var(--radius-md)}hr{background-color:var(--color-elevated);height:2px;margin-block:var(--space-2);border:none}pre{font-family:var(--font-mono), monospace;padding:var(--space-4);border-radius:var(--radius-md);font-size:var(--text-base);overflow-x:auto;background-color:var(--color-surface)!important}code{font-family:var(--font-mono), monospace;background-color:var(--color-surface)}.container{width:min(100% - 2rem, var(--content-width));margin-inline:auto}.section{padding-block:var(--space-4)}.section-title{margin-block:var(--space-4);font-size:var(--heading-2)}.panel{padding:var(--space-5);border:var(--border);background-color:var(--color-surface);border-radius:var(--radius-lg)}.stack{gap:var(--space-4);flex-direction:column;display:flex}.project-grid{padding-block:var(--space-4);margin-block:var(--space-4);grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--project-card-width)), 1fr));gap:var(--space-5);justify-items:center;display:grid}.chip-list{gap:var(--space-2);flex-wrap:wrap;display:flex}.site-header{z-index:10;background-color:color-mix(in srgb, var(--color-surface) 92%, transparent);border-bottom:var(--border);box-shadow:var(--shadow);backdrop-filter:blur(8px);position:sticky;top:0}.site-header-inner{align-items:center;gap:var(--space-4);width:min(100% - 2rem, var(--content-width));min-height:4.5rem;padding-block:var(--space-2);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"logo nav actions";margin-inline:auto;display:grid}.header-logo{justify-self:start;align-items:center;gap:var(--space-2);color:var(--color-text);grid-area:logo;font-weight:600;text-decoration:none;transition:color .15s;display:inline-flex;&:hover{color:var(--color-accent);opacity:1}}.header-logo-image{object-fit:contain;flex-shrink:0;width:3rem;height:3rem}.header-logo-text{white-space:nowrap;line-height:1}.site-nav{grid-area:nav;justify-content:center}.site-nav-list{justify-content:center;align-items:center;gap:var(--space-2);margin:0;padding:0;list-style:none;display:flex}.site-nav-link{padding:var(--space-2) var(--space-3);color:var(--color-text-muted);font-size:var(--text-base);align-items:center;font-weight:600;text-decoration:none;transition:color .15s;display:inline-flex;&:hover{opacity:1;color:var(--color-accent)}}.site-nav-link--active{text-underline-offset:12px;text-decoration:underline 2px}.header-actions{justify-content:center;align-items:center;gap:var(--space-2);flex-wrap:wrap;grid-area:actions;justify-self:end;min-width:0;max-width:100%;display:flex}@media (width<=675px){.site-header-inner{row-gap:var(--space-1);min-height:auto;padding-block:var(--space-3);grid-template-columns:1fr 1fr;grid-template-areas:"logo actions""nav nav"}.site-nav{justify-self:center;width:100%}.site-nav-list{flex-wrap:wrap}.header-logo,.header-actions{justify-self:center}.toc-minimap{display:none}}footer{background-color:var(--color-surface);padding:var(--space-6);box-shadow:var(--shadow);font-size:var(--text-sm);text-wrap:balance;text-align:center;place-items:center;display:grid}.button{justify-content:center;align-items:center;gap:var(--space-2);min-height:clamp(2rem,7vw,2.5rem);padding:0 var(--space-4);border-radius:var(--radius-sm);color:var(--color-text);font-size:var(--text-sm);white-space:nowrap;vertical-align:middle;box-shadow:var(--shadow);border:none;font-weight:600;line-height:1;text-decoration:none;transition:background-color .15s,border-color .15s,color .15s,opacity .15s,box-shadow .15s,transform .15s;display:inline-flex;&.primary{background-color:var(--color-accent);color:var(--color-text);&:hover{box-shadow:var(--shadow-hover);opacity:.7}}&.secondary{border:var(--border);color:var(--color-text);box-shadow:none;background-color:#0000;&:hover{background-color:var(--color-border)}}&.accent{background-color:var(--color-info);color:var(--color-text);&:hover{box-shadow:var(--shadow-hover);opacity:.7}}&.icon{background-color:var(--color-elevated);color:var(--color-text);&:hover{opacity:.7;box-shadow:var(--shadow-hover)}}&.icon img,&.icon svg{object-fit:contain;flex-shrink:0;width:1.25em;height:1.25em}&.icon-only{background-color:var(--color-elevated);width:2.5rem;color:var(--color-text);padding-inline:0}&.icon-only img,&.icon-only svg{width:1.25rem;height:1.25rem}}.card{width:min(100%, var(--project-card-width));border:var(--border);height:100%;box-shadow:var(--shadow);border-radius:var(--radius-md);background-color:var(--color-surface);flex-direction:column;transition:transform .15s,box-shadow .15s;display:flex;overflow:hidden;&:hover,&:focus-within{box-shadow:var(--shadow-hover);transform:translateY(-3px)}&:focus-within{outline:2px solid var(--color-info);outline-offset:4px;border-radius:var(--radius-md)}}.card-link{height:100%;color:inherit;flex-direction:column;text-decoration:none;display:flex;&:hover{opacity:.9}}.card-image{object-fit:cover;width:100%;height:200px}.card-content{justify-content:space-between;gap:var(--space-4);padding:var(--space-5);flex-direction:column;flex:1;display:flex}.card-view{color:var(--color-accent)}.chip{padding:var(--space-1) var(--space-2);font-family:var(--font-mono), monospace;font-size:var(--text-sm);border:1px solid var(--color-info);border-radius:var(--radius-sm);background-color:color-mix(in srgb, var(--color-info) 10%, transparent)}[data-callout=note]{--callout-color:var(--color-info)}[data-callout=tip]{--callout-color:var(--color-success)}[data-callout=important]{--callout-color:var(--color-important)}[data-callout=warning]{--callout-color:var(--color-warning)}[data-callout=caution]{--callout-color:var(--color-error)}.callout{width:100%;padding:var(--space-2) var(--space-4);border-left:var(--space-1) solid var(--callout-color,#888);margin-bottom:var(--space-4);border-radius:var(--radius-sm);background-color:color-mix(in srgb, var(--callout-color) 10%, transparent)}.callout-title{color:var(--callout-color);align-items:flex-start;gap:8px;font-weight:600;line-height:1;display:flex}.callout-title-icon svg{vertical-align:text-bottom;display:inline-block;overflow:visible!important}.callout-content{margin-top:var(--space-4)}.callout[data-collapsible=true] .callout-title{cursor:pointer}.callout[data-collapsible=true] .callout-fold-icon{align-items:center;padding-inline-end:8px;display:flex}.callout[data-collapsible=true]>.callout-title .callout-fold-icon svg{transition:transform .1s ease-in-out;transform:rotate(-90deg)}.callout[data-collapsible=true][open]>.callout-title .callout-fold-icon svg{transform:none}.callout-fold-icon{margin-left:-2px}.image-caption{text-align:center;display:block}.hero{isolation:isolate;padding-block:var(--space-8);background-color:var(--color-surface);border:var(--border);border-radius:var(--radius-lg);place-items:center;display:grid;position:relative;overflow:hidden}.hero-content{z-index:1;align-items:center;gap:var(--space-2);padding:var(--space-4);text-align:center;flex-direction:column;display:flex;position:relative}.hero-background{z-index:-2;object-fit:cover;filter:blur(2px)brightness(.35);width:calc(100% + 2rem);max-width:none;height:calc(100% + 2rem);position:absolute;inset:-1rem;transform:scale(1.03)}.hero-eyebrow{font-size:var(--text-sm);padding:var(--space-1)}.hero-image{border-radius:var(--radius-full);border:var(--border-thick);box-shadow:var(--shadow);object-fit:cover;width:clamp(120px,15vw,200px);height:clamp(120px,15vw,200px)}.hero-title{font-size:var(--heading-1)}.hero-description{font-size:var(--text-lg)}.about-section{justify-content:space-between;align-items:center;gap:var(--space-6);flex-flow:wrap;display:flex}.about-left{flex:45ch;align-self:start;max-width:75ch;&>*+*{margin-top:var(--space-4)}}.about-right{flex:10rem;justify-content:center;align-self:center;display:flex}.about-logo{min-width:10rem;max-width:18.75rem;height:auto}.project-header{padding-block:var(--space-4)}.project-page{gap:var(--space-5);width:100%;margin-block:var(--space-4);grid-template-columns:minmax(12rem,16rem) minmax(0,1fr);grid-template-areas:"sidebar article";align-items:start;display:grid;position:relative}.project-sidebar{grid-area:sidebar;position:sticky;top:6rem}.project-sidebar-title{margin-bottom:var(--space-3);font-size:var(--heading-3)}.project-sidebar-list{padding:0;list-style:none;display:grid}.project-sidebar-item a{padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);color:var(--color-text-muted);text-decoration:none;transition:color .15s,background-color .15s;display:block;&:hover{color:var(--color-accent);background-color:var(--color-elevated);opacity:1}}.project-sidebar-item-active a{color:var(--color-text);background-color:var(--color-elevated);font-weight:600}.project-article{grid-area:article;min-width:0}.project-article>*+*{margin-top:var(--space-4)}.project-article :is(h2,h3,h4,h5,h6){scroll-margin-top:6rem}.project-article img{border-radius:var(--radius-md);object-fit:contain;width:auto;max-width:min(100%,38rem);height:auto;max-height:32rem;margin-inline:auto}.project-banner{isolation:isolate;min-height:clamp(22rem,45vw,34rem);padding:var(--space-6);border:var(--border);border-radius:var(--radius-lg);background-color:var(--color-surface);box-shadow:var(--shadow);place-items:end center;display:grid;position:relative;overflow:hidden}.project-banner-image{z-index:-2;object-fit:cover;filter:brightness(.35);width:100%;max-width:none;height:100%;position:absolute;inset:0}.project-banner-content{gap:var(--space-3);max-width:48rem;display:grid}.project-banner-title{font-size:var(--heading-1)}.project-banner-description{max-width:42rem;color:var(--color-text-muted);font-size:var(--text-lg)}@media (width<=800px){.project-page{grid-template-columns:1fr;grid-template-areas:"article""sidebar"}.project-sidebar{position:static}.project-banner{min-height:24rem;padding:var(--space-4)}}.toc-minimap{z-index:2;height:fit-content;width:var(--space-6);padding:var(--space-2) 0;border-right:2px solid var(--color-border);grid-area:article;justify-self:end;position:sticky;top:6rem}.toc-minimap ul{gap:var(--space-2);flex-direction:column;align-items:flex-end;margin:0;padding:0;list-style:none;display:flex}.minimap-item{height:var(--space-3);background-color:var(--color-border);border-radius:var(--radius-sm) 0 0 var(--radius-sm);opacity:.5;box-shadow:var(--shadow);cursor:pointer;transition:background-color .25s,transform .25s;display:block;position:relative;&:hover,&:focus-visible{background-color:var(--color-text-muted);opacity:1;transform:scaleX(1.15)}&:after{content:attr(data-heading);top:50%;right:calc(100% + var(--space-3));z-index:3;width:max-content;max-width:18rem;padding:var(--space-2) var(--space-3);border:var(--border);border-radius:var(--radius-md);background-color:var(--color-elevated);color:var(--color-text);box-shadow:var(--shadow-hover);font-size:var(--text-sm);white-space:normal;pointer-events:none;opacity:0;translate:0 -50%;transform:translateX(var(--space-2));line-height:1.3;transition:opacity .15s,transform .15s;position:absolute}&:hover:after,&:focus-visible:after{opacity:1;transform:translate(0)}}.minimap-item-2{width:var(--space-6)}.minimap-item-3{width:var(--space-5)}.minimap-item-4{width:var(--space-4)}
