@font-face{font-family:IBM Plex Mono;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/plex-mono-400.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IBM Plex Sans;font-style:normal;font-weight:200 700;font-display:swap;src:url(/fonts/plex-sans-var.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:IBM Plex Sans Fallback;font-weight:100 500;src:local(Arial);size-adjust:100.8%;ascent-override:101.7%;descent-override:27.3%;line-gap-override:0%}@font-face{font-family:IBM Plex Sans Fallback;font-weight:600 900;src:local(Arial Bold),local(Arial-BoldMT);size-adjust:98.7%;ascent-override:103.8%;descent-override:27.9%;line-gap-override:0%}@font-face{font-family:IBM Plex Mono Fallback;src:local(Courier New);size-adjust:100%;ascent-override:102.5%;descent-override:27.5%;line-gap-override:0%}@property --tick{syntax:"<length>";inherits:false;initial-value:11px}:root{--bg:#0a1220;--surface:#0d1829;--text:#dbe6f5;--muted:#8ea3bf;--line:#1f3350;--accent:#78c2ff;--accent-ink:#06101d;--amber:#f2b45e;--accent-rgb:120 194 255;--grid:#78aaff0e;--grid-major:#78aaff1a;color-scheme:dark;--font:"IBM Plex Sans", "IBM Plex Sans Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;--display:var(--font);--mono:"IBM Plex Mono", "IBM Plex Mono Fallback", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--wrap:1040px;--s1:8px;--s2:16px;--s3:24px;--s4:32px;--s8:64px;--ease:cubic-bezier(.2, .7, .2, 1)}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font:17px/1.65 var(--font);-webkit-font-smoothing:antialiased;margin:0;position:relative}body:before{content:"";z-index:-1;pointer-events:none;background-image:linear-gradient(to right, var(--grid) 1px, transparent 1px), linear-gradient(to bottom, var(--grid) 1px, transparent 1px), linear-gradient(to right, var(--grid-major) 1px, transparent 1px), linear-gradient(to bottom, var(--grid-major) 1px, transparent 1px), radial-gradient(circle at 50% 50%, rgb(var(--accent-rgb) / .5) 1.5px, transparent 2.5px);background-position:0 0,0 0,0 0,0 0,-60px -60px;background-size:24px 24px,24px 24px,120px 120px,120px 120px,120px 120px;height:1100px;animation:1.4s ease-out both appear;position:absolute;inset:0 0 auto;-webkit-mask-image:linear-gradient(#000 0%,#0000 100%);mask-image:linear-gradient(#000 0%,#0000 100%)}img{max-width:100%;height:auto;display:block}a{color:var(--accent);text-underline-offset:3px}a:hover{color:var(--amber);text-decoration-thickness:2px}:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:2px}::selection{background:rgb(var(--accent-rgb) / .28);color:#fff}.skip{left:var(--s2);z-index:10;background:var(--accent);color:var(--accent-ink);padding:var(--s1) var(--s2);border-radius:6px;position:absolute;top:-100px}.skip:focus{top:var(--s2)}.wrap{max-width:var(--wrap);padding:0 var(--s3);margin:0 auto}h1,h2,h3{font-family:var(--display);letter-spacing:-.02em;margin:0;line-height:1.1}h1{letter-spacing:-.04em;font-size:clamp(42px,8vw,80px);font-weight:700;line-height:1.02}h2{font-size:clamp(28px,3.6vw,38px);font-weight:600}h3{letter-spacing:-.01em;font-size:20px;font-weight:600}p{margin:0 0 var(--s2)}.meta{font-family:var(--mono);color:var(--muted);letter-spacing:.01em;font-size:13px}.muted{color:var(--muted)}header.site{border-bottom:1px solid var(--line);background:color-mix(in oklab, var(--bg) 88%, transparent)}header.site .wrap{justify-content:space-between;align-items:center;gap:var(--s3);min-height:72px;padding-top:var(--s1);padding-bottom:var(--s1);flex-wrap:wrap;display:flex}.brand{color:var(--text);font-family:var(--display);letter-spacing:-.02em;align-items:center;gap:12px;font-size:18px;font-weight:700;text-decoration:none;display:inline-flex}.brand img{width:auto;height:40px}nav ul{gap:var(--s1) var(--s3);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}nav a{color:var(--muted);font-family:var(--mono);letter-spacing:.04em;border-bottom:2px solid #0000;padding:4px 0;font-size:13px;text-decoration:none}nav a:hover{color:var(--text)}nav a[aria-current=page]{color:var(--accent);border-bottom-color:var(--accent)}footer.site{border-top:1px solid var(--line);padding:var(--s4) 0;color:var(--muted);font-family:var(--mono);font-size:13px}footer.site .wrap{justify-content:space-between;gap:var(--s2);flex-wrap:wrap;display:flex}footer.site a{color:var(--muted)}footer.site a:hover{color:var(--text)}footer.site .site-note{letter-spacing:.02em;flex-basis:100%;font-size:12px}main{padding:var(--s8) 0;counter-reset:sec}section.block{margin-top:var(--s8)}section.block:first-child{margin-top:0}.block-head{justify-content:space-between;align-items:baseline;gap:var(--s2);margin-bottom:var(--s3);padding-bottom:var(--s2);flex-wrap:wrap;display:flex;position:relative}.block-head:after{content:"";transform-origin:0;background:linear-gradient(var(--line), var(--line)) left bottom / 1px 9px no-repeat, linear-gradient(var(--line), var(--line)) right bottom / 1px 9px no-repeat, linear-gradient(var(--line), var(--line)) center bottom / 100% 1px no-repeat;height:9px;animation:draw .9s var(--ease) both;position:absolute;bottom:0;left:0;right:0}.block-head h2:before{counter-increment:sec;content:counter(sec, decimal-leading-zero) " /";content:counter(sec, decimal-leading-zero) " /" / "";font:400 13px var(--mono);letter-spacing:.04em;color:var(--amber);vertical-align:.35em;margin-right:.9em}.lede{color:var(--muted);max-width:62ch;font-size:clamp(18px,2.2vw,21px);font-weight:300;line-height:1.55}.hero{gap:var(--s3);padding-bottom:var(--s2);display:grid}.hero h1 span{color:var(--muted);letter-spacing:-.01em;text-wrap:balance;margin-top:var(--s2);font-size:max(.36em,19px);font-weight:300;display:block}.hero .lede{color:var(--text);margin:0;font-weight:400}.actions{gap:var(--s2);margin-top:var(--s1);flex-wrap:wrap;align-items:center;display:flex}.btn{font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--accent);border-radius:2px;padding:10px 20px;font-size:13px;font-weight:400;text-decoration:none;transition:background .15s,color .15s,border-color .15s;display:inline-block}.btn.primary{background:var(--accent);color:var(--accent-ink)}.btn.primary:hover{background:var(--amber);border-color:var(--amber)}.btn.secondary{color:var(--accent)}.btn.secondary:hover{background:rgb(var(--accent-rgb) / .1)}.facts{margin:var(--s4) 0 0;background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;padding:0;list-style:none;display:grid}.facts li{background:var(--surface);padding:var(--s2) var(--s3) var(--s3)}.facts strong{font-family:var(--display);letter-spacing:-.03em;font-size:48px;font-weight:600;line-height:1.05;display:block}.facts span{color:var(--muted);font-size:15px}.grid{gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.grid.four{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.grid.wide{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.card,blockquote.quote{background:var(--surface);border:1px solid var(--line);border-radius:2px;transition:border-color .15s;position:relative}.card{padding:var(--s3);gap:var(--s1);flex-direction:column;display:flex}.card h2,.card h3{margin-bottom:4px;font-size:20px}.card p{color:var(--muted);margin:0;font-size:16px}.card a.stretch{color:inherit;text-decoration:none}.card a.stretch:after{content:"";border-radius:2px;position:absolute;inset:0}.card:before,blockquote.quote:before{--tc:var(--accent);content:"";pointer-events:none;opacity:.5;background:linear-gradient(var(--tc), var(--tc)) top left / var(--tick) 1px no-repeat, linear-gradient(var(--tc), var(--tc)) top left / 1px var(--tick) no-repeat, linear-gradient(var(--tc), var(--tc)) top right / var(--tick) 1px no-repeat, linear-gradient(var(--tc), var(--tc)) top right / 1px var(--tick) no-repeat, linear-gradient(var(--tc), var(--tc)) bottom left / var(--tick) 1px no-repeat, linear-gradient(var(--tc), var(--tc)) bottom left / 1px var(--tick) no-repeat, linear-gradient(var(--tc), var(--tc)) bottom right / var(--tick) 1px no-repeat, linear-gradient(var(--tc), var(--tc)) bottom right / 1px var(--tick) no-repeat;transition:opacity .15s, --tick .25s var(--ease);position:absolute;inset:-1px}.card:hover,.card:focus-within{border-color:color-mix(in oklab, var(--amber) 45%, var(--line))}.card:hover:before,.card:focus-within:before{--tick:22px;--tc:var(--amber);opacity:1}.tags{margin:var(--s1) 0 0;flex-wrap:wrap;gap:6px;padding:0;list-style:none;display:flex}.tags li,.tag{font:12px var(--mono);color:var(--muted);border:1px solid var(--line);border-radius:2px;padding:2px 10px}.quotes{gap:var(--s3);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));display:grid}blockquote.quote{padding:var(--s3);gap:var(--s2);flex-direction:column;justify-content:space-between;margin:0;display:flex}blockquote.quote p{margin:0;font-size:16px}blockquote.quote footer{color:var(--muted);font-size:14px}blockquote.quote footer strong{color:var(--text);font-size:15px;display:block}blockquote.quote footer a{color:inherit}.timeline{gap:var(--s3);margin:0;padding:0;list-style:none;display:grid}.timeline li{gap:var(--s3);border-top:1px solid var(--line);padding-top:var(--s2);grid-template-columns:160px 1fr;display:grid}.timeline h3{font-size:20px}.timeline p{color:var(--muted);margin:4px 0 0;font-size:16px}@media (width<=640px){.timeline li{grid-template-columns:1fr;gap:4px}}.posts{margin:0;padding:0;list-style:none}.posts>li{border-top:1px solid var(--line);padding:var(--s2) 0;gap:var(--s3);grid-template-columns:130px 1fr;display:grid}.posts h2,.posts h3{font-size:22px}.posts h2 a,.posts h3 a{color:var(--text);text-decoration:none}.posts h2 a:hover,.posts h3 a:hover{color:var(--accent)}.posts p{color:var(--muted);margin:4px 0 0;font-size:16px}@media (width<=640px){.posts>li{grid-template-columns:1fr;gap:4px}}.subhead{font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:var(--s4) 0 var(--s2);font-size:13px;font-weight:400}.subhead:first-of-type{margin-top:0}.filters{gap:var(--s1);margin:0 0 var(--s3);flex-wrap:wrap;padding:0;list-style:none;display:flex}.filters a{border:1px solid var(--line);font-family:var(--mono);color:var(--muted);border-radius:2px;padding:6px 14px;font-size:13px;text-decoration:none;display:inline-block}.filters a:hover{color:var(--text);border-color:var(--accent)}.filters a[aria-current=true]{background:var(--amber);color:var(--accent-ink);border-color:var(--amber)}.article-cover{width:100%;height:auto;margin:0 0 var(--s4);border:1px solid var(--line);border-radius:2px}.article h1{margin:var(--s1) 0 var(--s2)}.article .meta{gap:var(--s1) var(--s2);margin-bottom:var(--s4);flex-wrap:wrap;display:flex}.article,.article-body{min-width:0;max-width:100%}.article-body{max-width:68ch}.article-body h2{margin:var(--s4) 0 var(--s2);font-size:30px}.article-body h3{margin:var(--s3) 0 var(--s1)}.article-body ul,.article-body ol{margin:0 0 var(--s2);padding-left:1.3em}.article-body li{margin-bottom:6px}.article-body img{margin:var(--s2) 0;border-radius:8px}.article-body code{font-family:var(--mono);background:var(--surface);border:1px solid var(--line);border-radius:2px;padding:1px 5px;font-size:.9em}.article-body pre{background:var(--surface);border:1px solid var(--line);max-width:100%;padding:var(--s2);border-radius:2px;font-size:14px;line-height:1.5;overflow-x:auto}.article-body pre code{background:0 0;border:0;padding:0}.article-body .table-scroll{max-width:100%;margin:0 0 var(--s2);border:1px solid var(--line);border-radius:2px;overflow-x:auto}.article-body table{border-collapse:collapse;width:100%;font-size:15px}.article-body th,.article-body td{border-bottom:1px solid var(--line);text-align:left;vertical-align:top;padding:8px 12px}.article-body th{font-family:var(--mono);color:var(--muted);font-size:12px;font-weight:400}.article-body blockquote{border-left:3px solid var(--accent);margin:var(--s2) 0;padding:0 var(--s2);color:var(--muted)}.demo{gap:var(--s2);margin:var(--s2) 0;grid-template-columns:1fr 1fr;display:grid}.demo>div{background:var(--surface);border:1px solid var(--line);padding:var(--s2);border-radius:2px}.demo b{font:12px var(--mono);color:var(--muted);margin-bottom:var(--s1);font-weight:400;display:block}.demo ul{font-size:22px;font-family:var(--font);text-align:right;font-variant-numeric:proportional-nums;margin:0;padding:0;list-style:none}.demo .tab ul{font-variant-numeric:tabular-nums}.about-top{gap:var(--s4);grid-template-columns:1fr 400px;align-items:start;display:grid}.about-top figure{margin:var(--s2) 0 0}.about-top img{width:100%;height:auto;filter:drop-shadow(0 0 28px rgb(var(--accent-rgb) / .105));-webkit-mask-composite:source-in;border:0;border-radius:0;-webkit-mask-image:linear-gradient(#000 78%,#0000),linear-gradient(270deg,#0000,#000 9%);mask-image:linear-gradient(#000 78%,#0000),linear-gradient(270deg,#0000,#000 9%);mask-composite:intersect}@media (width<=760px){.about-top{grid-template-columns:1fr}.about-top figure{order:-1;max-width:340px;margin-top:0}}.skills{gap:var(--s3);display:grid}.skills h3{font-size:15px;font-family:var(--mono);color:var(--muted);margin-bottom:var(--s1);font-weight:400}.plain{gap:var(--s2);margin:0;padding:0;list-style:none;display:grid}.plain li{border-top:1px solid var(--line);padding-top:var(--s2)}.plain strong{display:block}details{margin-top:var(--s1)}summary{cursor:pointer;color:var(--accent);font-size:14px}details ul{margin:var(--s1) 0 0;color:var(--muted);padding-left:1.1em;font-size:15px}@keyframes appear{0%{opacity:0}}@keyframes draw{0%{transform:scaleX(0)}}@keyframes rise{0%{opacity:0;transform:translateY(14px)}}@keyframes lift{0%{transform:translateY(14px)}}main h1{animation:lift .7s var(--ease) both}.hero .lede,.hero .actions,.facts li{animation:rise .7s var(--ease) both}.hero .lede{animation-delay:.18s}.hero .actions{animation-delay:.3s}.facts li:first-child{animation-delay:.42s}.facts li:nth-child(2){animation-delay:.5s}.facts li:nth-child(3){animation-delay:.58s}.facts li:nth-child(4){animation-delay:.66s}@supports (animation-timeline:view()){.block-head:after{animation:linear both draw view();animation-range:entry entry 70%}.card,blockquote.quote,.timeline li,.posts>li{animation:linear both rise view();animation-range:entry entry 40%}}.lamp-grid,.lamp-glow{pointer-events:none;opacity:0;will-change:transform;transition:opacity .5s;position:fixed;top:0;left:0}html.has-pointer .lamp-grid,html.has-pointer .lamp-glow{opacity:1}.lamp-grid{--bp:calc(320px - var(--x,0px)) calc(320px - var(--y,0px));z-index:-1;width:640px;height:640px;transform:translate3d(calc(var(--x,0px) - 320px), calc(var(--y,0px) - 320px), 0);background-image:linear-gradient(to right, rgb(var(--accent-rgb) / .15) 1px, transparent 1px), linear-gradient(to bottom, rgb(var(--accent-rgb) / .15) 1px, transparent 1px), linear-gradient(to right, rgb(var(--accent-rgb) / .24) 1px, transparent 1px), linear-gradient(to bottom, rgb(var(--accent-rgb) / .24) 1px, transparent 1px);background-size:24px 24px,24px 24px,120px 120px,120px 120px;background-position:var(--bp), var(--bp), var(--bp), var(--bp);-webkit-mask-image:radial-gradient(300px,#000 0%,#0000 100%);mask-image:radial-gradient(300px,#000 0%,#0000 100%)}.lamp-glow{z-index:1;width:760px;height:760px;transform:translate3d(calc(var(--x,0px) - 380px), calc(var(--y,0px) - 380px), 0);background:radial-gradient(380px circle at 50% 50%, rgb(var(--accent-rgb) / .034), transparent 70%)}.brand img{mix-blend-mode:screen}.card.hdr .stretch{color:var(--text)}@media (dynamic-range:high){.card.hdr{padding:calc(var(--s3) - 1px);background:linear-gradient(var(--surface), var(--surface)) padding-box, linear-gradient(color-mix(in oklab, var(--bg) 40%, transparent), color-mix(in oklab, var(--bg) 40%, transparent)) border-box, url(/img/hdr-glow-swatch.jpg) center / cover border-box, linear-gradient(var(--accent), var(--accent)) border-box;border:2px solid #0000}@supports (background-clip:text){.card.hdr .stretch{background:url(/img/hdr-glow-swatch.jpg) center / cover, linear-gradient(var(--text), var(--text));color:#0000;-webkit-background-clip:text;background-clip:text}}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}@media (forced-colors:active){.card.hdr{background:canvas;border-color:canvastext}.card.hdr .stretch{color:linktext;background:0 0}.lamp-grid,.lamp-glow,body:before{display:none}}@media print{*,:before,:after{transition:none!important;animation:none!important}.lamp-grid,.lamp-glow,body:before{display:none}}
