.article{--text:#b0b0b0;--text-strong:#fff;--text-muted:#8a8a8a;--border-soft:#1c1c1c;--border-dashed:#262626;--demo-ink:#f0f0f0;--demo-surface:#1c1c1c;--demo-subtle:#303030;--demo-muted:#8a8a8a;--good:#55ef9d;--bad:#ff5c5c;--eye:#6cb6ff;--blue:#64aaff;--yellow:#ffc835;--orange:#ffaa46;--mono:var(--font-jetbrains-mono),ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--ease-out-quint:cubic-bezier(0.22,1,0.36,1);--ease-out-cubic:cubic-bezier(0.33,1,0.68,1);font-size:clamp(14px,calc(13.36px + .1vw),15px);line-height:1.7;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.article-appear{animation:article-appear .8s var(--ease-out-quint) backwards;animation-delay:var(--appear-delay,0s)}@keyframes article-appear{0%{opacity:0;filter:blur(4px);transform:translateY(6px)}}.article-index{display:flex;flex-direction:column;gap:14px;margin-bottom:24px}.article-index-title{display:flex;margin:0;font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);line-height:18px;font-variant-numeric:tabular-nums}.article-index-back,.article-index-title{align-items:center;gap:6px;color:var(--text-muted)}.article-index-back{display:inline-flex;margin:-4px -6px;padding:4px 6px;border-radius:6px;text-decoration:none;cursor:pointer;transition:color .2s ease}.article-index-back:focus-visible,.article-index-back:hover{color:var(--text-strong);outline:none}.article-index-back.link-fill{transition:color .18s ease,background-size .22s var(--ease-out-cubic)}.article-index-back:focus-visible{background:#1f1f1f}.article-index-list{display:none}@media (min-width:1100px){.article-index{position:fixed;z-index:5;top:136px;left:56px;max-width:180px;margin:0}.article-index-list{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}.article-index-list a{color:var(--text-muted);font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);line-height:18px;text-decoration:none;transition:color .2s ease}.article-index-list a:hover,.article-index-list a[aria-current=true]{color:var(--text-strong)}.article-index-list a:focus-visible{color:var(--text-strong);outline:1px solid #ffffff40;outline-offset:2px;border-radius:2px}}.article-header{display:flex;flex-direction:column;gap:2px}.article-title{margin:0;color:var(--text-strong);font:inherit;text-transform:lowercase;text-wrap:balance}.article-meta{margin:0;color:var(--text-muted)}.project-live-link{transition:color .18s ease,background-size .22s var(--ease-out-cubic)}.project-live-link:focus-visible,.project-live-link:hover{outline:none}.project-tech-tags{color:color-mix(in srgb,var(--text-strong) 68%,transparent)}.project-tech-tags>span{border-color:color-mix(in srgb,var(--text-strong) 16%,transparent)}.project-description-divider{margin-top:24px}.article-body{color:var(--text)}.article-body>*{margin:0}.article-body>*+*{margin-top:16px}.article-body>h2{margin-top:56px;color:var(--text-muted);font:inherit;text-wrap:balance;scroll-margin-top:96px}.article-body>h2:first-child{margin-top:0}.article-body>h2+*{margin-top:12px}.article-body>:is(figure,.code-block,.formula){margin-top:28px}.article-body>:is(figure,.code-block,.formula)+*{margin-top:28px}.article-body>.code-block+.code-block{margin-top:12px}.article-body>.project-tech-tags{margin-top:20px}.article-body>.project-gallery{margin-top:40px}.article-body p{text-wrap:pretty;hanging-punctuation:first allow-end}.article-body strong{color:var(--text-strong);font-weight:500}.article-body em{font-style:italic}.article-body a:not([class]){color:var(--text-strong);background-image:linear-gradient(currentColor,currentColor),linear-gradient(color-mix(in srgb,currentColor 18%,transparent),color-mix(in srgb,currentColor 18%,transparent));background-position:0 100%,0 100%;background-repeat:no-repeat;background-size:0 1px,100% 1px;text-decoration:none;transition:background-size .22s var(--ease-out-quint)}.article-body a:not([class]):focus-visible,.article-body a:not([class]):hover{background-size:100% 1px,100% 1px}.article-body>ul{display:flex;flex-direction:column;gap:8px;padding:0;list-style:none}.article-body>ul>li{position:relative;padding-left:18px}.article-body>ul>li:before{content:"";position:absolute;top:.95em;left:4px;width:4px;height:4px;border-radius:50%;background:var(--text-muted)}.article-body>ul.project-list{gap:12px}.article-body>ul.project-list>li{padding-left:20px;text-wrap:pretty}.article-body>ul.project-list>li:before{top:12px;top:calc(.5lh - .5px);left:0;width:6px;height:1px;border-radius:0;background:var(--text-muted)}.article-body>ol{display:flex;flex-direction:column;gap:14px;padding:0;list-style:none}.article-body>ol>li{position:relative;padding-left:18px}.article-body>ol>li:before{content:"-";position:absolute;left:0;color:var(--text-muted);font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);font-variant-numeric:tabular-nums}.article-body>figure{overflow:hidden;border-radius:10px;background:#141414}.article-body>figure img{display:block;width:100%;height:auto}.project-nav-link{display:inline-flex;width:max-content;align-items:center;white-space:nowrap;text-decoration:none}.project-nav-link:focus-visible{outline:1px solid #ffffff40;outline-offset:3px}.inline-code{padding:2px 6px;border-radius:5px;background:#ffffff14;color:var(--text-strong);font-family:var(--mono);font-size:.84em}.hl,.inline-code{-webkit-box-decoration-break:clone;box-decoration-break:clone}.hl{margin:0 -1px;padding:0 3px;border-radius:3px;color:var(--blue);background:#50a0ff14}.hl[data-tone=yellow]{color:var(--yellow);background:#ffc83514}.hl[data-tone=orange]{color:var(--orange);background:#ffa03214}.hl[data-tone=green]{color:var(--good);background:#55ef9d14}.term{margin:0 -1px;padding:0 3px;border-radius:3px;color:#64aaff;background:#50a0ff14;cursor:help;-webkit-box-decoration-break:clone;box-decoration-break:clone}.term:focus-visible{outline:1px solid #64aaff80;outline-offset:1px}.term-tip{position:fixed;z-index:60;top:0;left:0;max-width:min(280px,calc(100vw - 24px));padding:6px 11px;border-radius:8px;background:#fafafa;color:#0e0e0e;font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);line-height:18px;box-shadow:0 6px 16px rgb(0 0 0/.26);pointer-events:none;opacity:0;visibility:hidden;transform:translate(-50%,calc(-100% - 12px));transition:opacity .15s ease,visibility 0s .15s}.term-tip:after{content:"";position:absolute;top:100%;left:50%;width:10px;height:10px;border-radius:2px;background:inherit;transform:translate(-50%,-50%) rotate(45deg)}.term-tip[data-open=true]{opacity:1;visibility:visible;transition:opacity .15s ease}.fn-ref{margin-left:1px;font-size:clamp(9.9px,calc(9.9px + .14vw),12.1px);line-height:0;vertical-align:super}.fn-ref a{color:var(--text-muted);text-decoration:none;scroll-margin-top:96px;transition:color .16s ease}.fn-ref a:focus-visible,.fn-ref a:hover{color:var(--text-strong);outline:none}.article-body>.footnotes{margin-top:56px;padding-top:20px;border-top:2px solid #000000;box-shadow:0 -.3px 0 0 #2b2b2b}.footnotes-title{margin:0 0 18px;color:var(--text-strong);font:inherit}.footnotes ol{display:flex;flex-direction:column;gap:16px;margin:0;padding:0;list-style:none}.footnotes li{position:relative;padding-left:20px;color:var(--text-muted);font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);line-height:19px;scroll-margin-top:96px}.footnotes li:before{content:attr(data-n);position:absolute;left:0;font-size:clamp(9px,calc(9px + .14vw),11px);font-variant-numeric:tabular-nums}.footnote-read-more{color:var(--text-strong);font-weight:400}.article-footer{display:flex;gap:16px;margin-top:62px;padding-top:12px;padding-bottom:24px;color:var(--text-muted);font-weight:400;font-size:clamp(9.9px,calc(9.9px + .14vw),12.1px);line-height:18px;font-variant-numeric:tabular-nums}.code-block{overflow:hidden;border-radius:12px;background:#141414}.code-head{display:flex;align-items:center;justify-content:space-between;min-height:36px;padding:10px 10px 2px 18px}.code-lang{font-family:var(--mono);font-size:clamp(9.9px,calc(9.9px + .14vw),12.1px);font-weight:500;letter-spacing:.06em;text-transform:uppercase}.code-copy,.code-lang{color:var(--text-muted)}.code-copy{display:flex;align-items:center;justify-content:center;flex:0 0 26px;width:26px;height:26px;padding:0;border:0;border-radius:6px;background:none;cursor:pointer;line-height:0;transition:color .16s ease,background-color .16s ease;contain:layout paint}.code-copy svg{display:block;flex:none}.code-copy:focus-visible,.code-copy:hover{color:var(--text-strong);outline:none}.code-copy:focus-visible{background:#ffffff0f}.code-copy:active{color:var(--text-strong)}.code-block pre{margin:0;padding:4px 18px 16px;background:none!important;outline:none}.code-block code{display:flex;flex-direction:column;color:#b8b8c0;font-family:var(--mono);font-size:clamp(11.25px,calc(11.25px + .14vw),13.75px);line-height:21px;font-variant-ligatures:none;tab-size:2;counter-reset:line}.code-block .line{position:relative;min-height:21px;padding-left:calc(2ch + 14px);white-space:pre-wrap;word-break:break-word}.code-block .line:before{content:counter(line);counter-increment:line;position:absolute;left:0;color:#ffffff3d;user-select:none}.formula{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:center;gap:4px 14px;padding:8px 0;font-variant-numeric:tabular-nums}.formula-op{padding-top:2px;color:var(--text-muted);font-size:clamp(21.6px,calc(21.6px + .14vw),26.4px);line-height:34px}.formula-term{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:2ch}.formula-value{color:var(--text-strong);font-size:clamp(25.2px,calc(25.2px + .14vw),30.8px);line-height:38px;font-weight:500}.formula-label{color:var(--text-muted);font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);line-height:16px}.formula-term[data-tone=yellow] .formula-value{color:var(--yellow)}.formula-term[data-tone=blue] .formula-value{color:var(--blue)}.formula-term[data-tone=green] .formula-value{color:var(--good)}.formula-term[data-tone=orange] .formula-value{color:var(--orange)}.demo-figure{margin:0}.edge-demo-phone{position:relative;width:min(100%,230px);height:390px;overflow:hidden;border:5px solid #292929;border-radius:32px;background:#0e0e0e;box-shadow:0 18px 42px #00000055,inset 0 0 0 1px #ffffff16}.edge-demo-page{position:absolute;inset:0;overflow:hidden;background-size:100% 100%}.edge-demo-art{object-fit:cover;transition:object-position .25s cubic-bezier(.22,1,.36,1)}.edge-demo-image-shade{position:absolute;inset:0;background:linear-gradient(180deg,#10202c55,#10202c0c 42%,#10202c55)}.edge-demo-copy{position:absolute;top:88px;right:18px;left:18px;display:flex;flex-direction:column;gap:12px;color:#fff;text-shadow:0 1px 12px #21104744;transition:transform .25s cubic-bezier(.22,1,.36,1)}.edge-demo-kicker{font-family:var(--mono);font-size:clamp(8px,calc(8px + .15vw),9px);font-weight:500;line-height:1.2;letter-spacing:.1em;opacity:.74}.edge-demo-heading{max-width:170px;font-size:clamp(1.125rem,calc(1.125rem + .35vw),1.375rem);font-weight:500;line-height:1.05;letter-spacing:-.04em}.edge-demo-line{height:5px;border-radius:99px;background:#ffffff72}.edge-demo-line--long{width:100%;margin-top:4px}.edge-demo-line--medium{width:78%}.edge-demo-line--short{width:56%}.edge-demo-card{display:grid;min-height:86px;place-items:end start;margin-top:9px;padding:12px;border:1px solid #ffffff40;border-radius:12px;background:#ffffff18;font-size:clamp(10px,calc(10px + .15vw),11px);line-height:1.4;backdrop-filter:blur(8px)}.edge-demo-status,.edge-demo-toolbar{position:absolute;right:0;left:0;z-index:2;display:flex;align-items:center;justify-content:space-between;color:white;font:600 10px/1 var(--mono);transition:background-color .2s ease}.edge-demo-status{top:0;height:38px;align-items:flex-start;padding:14px 14px 0}.edge-demo-toolbar{bottom:12px;height:48px;padding:0 14px}.edge-demo-address{display:grid;width:130px;height:30px;place-items:center;border:1px solid #ffffff35;border-radius:999px;background:#ffffff18;font:500 10px/1 var(--mono)}.edge-demo-bottom-strip,.edge-demo-top-strip{position:absolute;right:0;left:0;z-index:3;height:12px;transition:background-color .2s ease}.edge-demo-top-strip{top:0}.edge-demo-bottom-strip{bottom:0}.demo-container{position:relative;gap:28px;padding:32px 28px;border-radius:12px}.demo-canvas,.demo-container{display:flex;flex-direction:column;align-items:center}.demo-canvas{justify-content:center;gap:20px;width:100%;min-width:0}.demo-controls{display:flex;flex-direction:column;gap:14px;width:min(100%,440px)}.demo-controls-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 18px}.demo-caption{margin:14px 0 8px;max-width:100%;padding:0 8px 6px;color:var(--demo-muted);font-size:clamp(10.8px,calc(10.8px + .14vw),13.2px);line-height:18px;text-align:center;text-wrap:balance;overflow-wrap:anywhere}@media (max-width:540px){.demo-container{gap:24px;padding:24px 18px}}.demo-toast{display:inline-flex;align-items:center;height:28px;padding:0 10px 1px;border-radius:999px;background:#ffffff0f;color:#ffffffd6;white-space:nowrap;font-size:clamp(12.6px,calc(12.6px + .14vw),15.4px);line-height:17px}.demo-toast[data-tone=good]{color:var(--good);background:#55ef9d1c}.demo-toast[data-tone=bad]{color:var(--bad);background:#ff5c5c1c}.demo-toast[data-tone=eye]{color:var(--eye);background:#5cb0ff21}.demo-toast-label{animation:toast-in .22s var(--ease-out-quint)}@keyframes toast-in{0%{opacity:0;filter:blur(2px);transform:translateY(2px)}}.demo-slider{display:grid;grid-template-columns:max-content minmax(120px,1fr) max-content;align-items:center;gap:12px;width:100%;font-size:clamp(12.6px,calc(12.6px + .14vw),15.4px);line-height:19px}.demo-slider-label{color:var(--demo-muted);white-space:nowrap;touch-action:none}.demo-slider-value{min-width:42px;color:var(--demo-ink);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.demo-slider-track{--progress:50%;position:relative;display:block;height:14px;border-radius:999px;background:#ffffff08;cursor:grab;touch-action:pan-y}.demo-slider-track:after{content:"";position:absolute;inset:-8px 0}.demo-slider-fill{inset:0 auto 0 0;width:var(--progress);border-radius:999px 0 0 999px;background:#333;transition:width .16s ease-out}.demo-slider-fill,.demo-slider-thumb{position:absolute;pointer-events:none}.demo-slider-thumb{top:50%;left:var(--progress);width:8px;height:19px;border-radius:999px;background:#707070;transform:translate(-50%,-50%);transition:left .16s ease-out,background-color .15s ease}.demo-slider-hit{position:absolute;inset:0;border-radius:999px;outline:none}.demo-slider-hit:focus-visible{box-shadow:0 0 0 2px #ffffff40}.demo-slider.is-dragging .demo-slider-thumb,.demo-slider:hover .demo-slider-thumb{background:#9a9a9a}.demo-slider.is-dragging .demo-slider-track{cursor:grabbing}.demo-slider.is-dragging :is(.demo-slider-fill,.demo-slider-thumb){transition-duration:0s}@media (min-width:541px){.demo-controls:has(>.demo-slider+.demo-slider){display:grid;grid-template-columns:max-content minmax(120px,1fr) max-content;align-items:center;gap:14px 12px}.demo-controls:has(>.demo-slider+.demo-slider)>.demo-slider{display:contents}.demo-controls:has(>.demo-slider+.demo-slider)>:not(.demo-slider){grid-column:1/-1}}@media (max-width:540px){.demo-container{width:100%;max-width:100%;padding-inline:clamp(14px,5vw,18px)}.demo-controls-row{width:100%;justify-content:center}.demo-slider{grid-template-columns:1fr max-content;grid-template-areas:"label value" "track track";row-gap:12px}.demo-slider-label{grid-area:label}.demo-slider-value{grid-area:value}.demo-slider-track{grid-area:track}}.demo-switch{display:inline-flex;align-items:center;gap:9px;height:36px;padding:0;border:0;border-radius:6px;background:none;color:var(--demo-muted);font:inherit;font-size:clamp(12.6px,calc(12.6px + .14vw),15.4px);line-height:19px;cursor:pointer}.demo-switch:hover,.demo-switch[aria-checked=true]{color:var(--demo-ink)}.demo-switch:focus-visible{outline:2px solid #ffffff40;outline-offset:4px}.demo-switch-track{position:relative;flex:none;width:38px;height:22px;border-radius:999px;background:#ffffff18;box-shadow:inset 0 0 0 1px #ffffff12}.demo-switch-label{line-height:20px}.demo-switch-thumb{position:absolute;top:50%;left:3px;width:14px;height:14px;border-radius:999px;background:#ffffff70;box-shadow:0 1px 3px #00000055;transform:translateY(-50%)}.demo-switch[aria-checked=true] .demo-switch-track{background:#c766ff66;box-shadow:inset 0 0 0 1px #c766ff55}.demo-switch[aria-checked=true] .demo-switch-thumb{background:#fff;transform:translate(18px,-50%)}.demo-switch:active{transform:scale(.98)}.demo-segmented{display:inline-flex;max-width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent);touch-action:pan-x;gap:1px;padding:2px;border-radius:999px;background:#ffffff08}.demo-segmented::-webkit-scrollbar{display:none}.demo-segmented button{min-height:36px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:var(--demo-muted);font:inherit;font-size:clamp(12px,calc(12px + .12vw),13px);line-height:17px;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,color .15s ease}.demo-segmented button:hover{color:var(--demo-ink)}.demo-segmented button[aria-checked=true]{background:#ffffff14;color:#fff}.demo-segmented button:focus-visible{outline:2px solid #ffffff40;outline-offset:1px}@media (prefers-reduced-motion:reduce){.article-appear,.demo-toast-label{animation:none}.article .link-fill,.article-body a:not([class]),.demo-slider-fill,.demo-slider-thumb,.demo-switch,.demo-switch-thumb,.demo-switch-track,.project-live-link{transition:none}}