:root{--color-bg:oklch(25% 0 0);--color-subtle-bg:oklch(0% 0 0);--color-highlight:oklch(40% 0 0);--color-text:oklch(100% 0 0);--color-subtle-text:oklch(80% 0 0);--color-accent:oklch(86% .18 90.53);--main-margin:1.5rem;--grid-columns:[full-width-start] 1fr [margin-start] var(--main-margin) [content-start title-start] min(80ch, calc(100vi - var(--main-margin) * 2)) [content-end title-end] var(--main-margin) [margin-end] 1fr [full-width-end];--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;accent-color:var(--color-accent);-webkit-text-size-adjust:none;-moz-text-size-adjust:none;text-size-adjust:none;@media (width>=1200px){--grid-columns:[full-width-start] 1fr [margin-start] var(--main-margin) [content-start title-start] min(80ch, calc(100vi - var(--main-margin) * 2)) [content-end title-end sidebar-start] auto [sidebar-end] var(--main-margin) [margin-end] 1fr [full-width-end];--toc-sidebar:true}}@view-transition{navigation:auto}@media (prefers-reduced-motion:no-preference){:root{interpolate-size:allow-keywords}html{scroll-behavior:smooth;scrollbar-gutter:stable;container:html/scroll-state}}body{margin:unset;background-color:var(--color-bg);min-block-size:100svb;font-family:system-ui,sans-serif;line-height:clamp(1.2, calc(36px / 1em), 1.5);color:var(--color-text);flex-direction:column;justify-content:stretch;display:flex}body>header{overflow-y:clip;mask-image:linear-gradient(#000 95%,#0000 99%);mask-size:100% 100%;mask-repeat:no-repeat;&>img,&>picture>img{object-fit:contain;filter:drop-shadow(0 .25rem .375rem oklch(0% 0 0/.75));view-transition-name:hero-image;object-position:center bottom;width:100%;height:calc(100svb - 10lvb - 15rem);min-height:min(18rem,60svb);max-height:calc(100svb - 10lvb - 15rem);margin-block:10lvb 1rem;mask-image:linear-gradient(#000 90%,#0000 98%);mask-size:100% 100%;mask-repeat:no-repeat;@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){animation:1ms linear both parallax;animation-timeline:view();animation-range:exit}}}}:is(h1,h2,h3,h4,h5,h6){letter-spacing:.05ch;text-transform:uppercase;text-wrap:balance;scroll-margin-block-start:4rem;font-weight:300;line-height:1.25;&+*{margin-block-start:0}}.eyebrow{text-transform:uppercase;letter-spacing:.1ch;color:var(--color-accent);text-wrap:balance;margin-block-end:.25rem;font-size:1rem;font-weight:600;&>a{text-decoration:none;&:is(:hover,:focus){text-decoration:underline}}&+h1{margin-block-start:0}}p,li{text-wrap:pretty;@media (prefers-reduced-motion:no-preference){animation:1ms linear both fadeIn;animation-timeline:view();animation-range:entry 10% entry 50%}}h1,h2,h3{@media (prefers-reduced-motion:no-preference){animation:1ms linear both fadeIn;animation-timeline:view();animation-range:entry 10%}}h4{margin-block:1em .75em;font-weight:500}main{flex-grow:1}body>:is(main,aside){grid-template-columns:var(--grid-columns);grid-auto-rows:min-content;margin-block:2rem;display:grid;container:main/inline-size;&>*{grid-column:content}}main{margin-block-start:min(5rem,10svb)}body>nav{z-index:1;grid-template:"logo nav."/0 1fr 0;place-items:center;transition:translate .3s;display:grid;position:sticky;top:0;container:sticky-nav/scroll-state;& .logo{grid-area:logo;display:none}@media (width>=600px){grid-template:"logo nav."/5rem 1fr 5rem;& .logo{opacity:0;block-size:auto;inline-size:100%;display:block}}&:before{content:"";z-index:-1;grid-area:1/1/-1/-1;block-size:100%;inline-size:100%;display:block}&>ul{--border-radius:.5rem;margin:unset;background:linear-gradient(var(--color-bg), var(--color-bg)), linear-gradient(oklch(from var(--color-bg) calc(l + .2) c h), oklch(from var(--color-bg) calc(l - .2) c h));border-radius:calc(var(--border-radius) + .25rem);anchor-name:--main-nav;background-origin:padding-box,border-box;background-clip:padding-box,border-box;border:2px solid #0000;flex-wrap:wrap;grid-area:nav;justify-content:center;padding:.25rem;list-style:none;display:flex;box-shadow:0 .125rem 1rem -.125rem oklch(0% 0 0/.75),inset 0 -.125rem .125rem -.075rem oklch(100% 5.96046e-8 90/.1);@media (prefers-reduced-motion:no-preference){&:before{content:"";position-anchor:--main-nav;background:linear-gradient(oklch(from var(--color-bg) calc(l + .05) c h), oklch(from var(--color-bg) calc(l - .2) c h));inset:anchor(inside);border-radius:calc(var(--border-radius));margin:calc(.25rem + 2px);transition:inset .2s,margin .2s;position:absolute}&:has(a:is(:hover,:focus,:active)):before{margin:0}&:has(a:active):before{background:linear-gradient(oklch(from var(--color-bg) calc(l + .1) c h), oklch(from var(--color-bg) calc(l - .1) c h))}}}& li{border-radius:var(--border-radius);z-index:1;& a{white-space:nowrap;color:var(--color-text);text-transform:uppercase;outline-offset:0;border-radius:var(--border-radius);-webkit-tap-highlight-color:transparent;padding-block:.5rem;padding-inline:clamp(.75rem,5vw,1.5rem);font-weight:500;text-decoration:none;display:block;&:is(:hover,:focus,:active){color:currentColor;text-shadow:.025em .025em .025em oklch(from currentcolor l c h / .5)}&[aria-current]{background-color:var(--color-accent);color:var(--color-bg);font-weight:700}}&:has(>a:is(:hover,:focus,:active)){anchor-name:--main-nav}}}body>footer{--footer-surface:linear-gradient(var(--color-bg), var(--color-subtle-bg));--footer-ink:color-mix(in oklch, var(--color-highlight) 26%, var(--color-bg));--footer-splash:var(--color-subtle-bg);background:radial-gradient(140% 240% at 50% -20%, color-mix(in oklch, var(--footer-splash) 70%, var(--color-bg)) 0%, var(--color-bg) 68%), radial-gradient(160% 240% at 50% 120%, color-mix(in oklch, var(--footer-ink) 70%, var(--color-bg)) 0%, var(--color-bg) 66%), linear-gradient(to bottom, color-mix(in oklch, var(--color-text) 3%, var(--color-bg)) 0%, var(--color-bg) 55%), var(--footer-surface);grid-template-columns:var(--grid-columns);background-origin:padding-box,border-box;background-clip:padding-box,border-box;border-block-start:2px solid #0000;padding-block:2rem;display:grid;box-shadow:0 .75rem 1rem -.25rem oklch(0% 0 0/.06),0 .25rem .375rem -.125rem oklch(0% 0 0/.02);&>*{grid-column:content}&>small{border-block-start:1px solid oklch(50% 0 0);grid-template:"nav to-top""copyright copyright"/1fr auto;justify-items:center;row-gap:1.5rem;margin-block-start:1rem;padding-block-start:1rem;display:grid;&>.to-top{grid-area:to-top;justify-self:end}&>nav{grid-area:nav;justify-self:start;gap:1.5ch;display:flex}&>.copyright{flex-direction:column;grid-area:copyright;align-items:center;gap:1em;display:flex;&>img,&>picture>img{block-size:auto;inline-size:15em}}}}@supports (color:oklch(from white l c h / 0.5)){body>footer{--footer-ink-a:oklch(from var(--footer-ink) l c h / .22);--footer-splash-a:oklch(from var(--footer-splash) l c h / .2);--footer-text-a:oklch(from var(--color-text) l c h / .04);background:radial-gradient(140% 240% at 50% -20%, oklch(from var(--footer-splash-a) l c h / 1) 0%, var(--color-bg) 68%), radial-gradient(160% 240% at 50% 120%, oklch(from var(--footer-ink-a) l c h / 1) 0%, var(--color-bg) 66%), linear-gradient(to bottom, var(--footer-text-a) 0%, transparent 55%), var(--footer-surface)}}@media (prefers-contrast:more){body>footer{background:radial-gradient(140% 240% at 50% -20%, var(--footer-splash) 0%, var(--color-bg) 68%), radial-gradient(160% 240% at 50% 120%, var(--footer-ink) 0%, var(--color-bg) 66%), var(--footer-surface)}}a{text-underline-offset:.2em;&:where(:focus-visible){outline:2px solid var(--color-accent);outline-offset:.5em;border-radius:.125em}}a.to-top{color:inherit;text-decoration:none;&:is(:hover,:focus){text-decoration:underline}&:after{content:" ↑" / ""}}hr{background:linear-gradient(to right, transparent, var(--color-text), transparent);block-size:.1rem;inline-size:-webkit-fill-available;inline-size:-moz-available;border:none;inline-size:stretch;margin-block:2.5em}a{color:var(--color-accent);&:where(:not([class])):is(:hover,:focus){color:oklch(from var(--color-accent) calc(l + .05) c h);text-shadow:0 0 .1em oklch(from var(--color-accent) l c h / .5)}}a.author{color:inherit;font-weight:600;&:is(:hover,:focus){color:var(--color-text)}}.emoji,.emoji>*{display:inline}.emoji>p{margin-block:unset}li:has(>.emoji){margin-block-end:.5em;list-style-type:"";&>.emoji{margin-inline:-4ch 1.3ch}}ol{margin-inline-start:1em;padding-inline-start:1ch;list-style-position:outside}ol>li{margin-block-end:.5em;padding-inline-start:1.5ch;position:relative;&::marker{color:var(--color-bg);font-weight:600}&:before{content:"";background-color:var(--color-accent);z-index:-1;border-radius:.25rem;block-size:1lh;inline-size:2.1ch;display:inline-block;position:absolute;top:0;left:-2.3ch}}@property --color-l{syntax:"<color>";inherits:false;initial-value:#0000}@property --border-angle{syntax:"<angle>";inherits:false;initial-value:0deg}button,input{--color-l:var(--color-accent);font:inherit;background:linear-gradient(oklch(from var(--color-bg) calc(l + .05) c h), oklch(from var(--color-bg) calc(l - .2) c h)), conic-gradient(from var(--border-angle), transparent, transparent 12%), linear-gradient(var(--color-bg), var(--color-subtle-bg));-webkit-tap-highlight-color:transparent;background-origin:padding-box,border-box,border-box;background-clip:padding-box,border-box,border-box;border:2px solid #0000;border-radius:.5em;transition:--border-angle .5s ease-in-out,--color-l .6s ease-in-out;box-shadow:0 .75rem 1rem -.25rem oklch(0% 0 0/.06),0 .25rem .375rem -.125rem oklch(0% 0 0/.02);&:is(:hover,:focus-within){background:linear-gradient(oklch(from var(--color-bg) calc(l + .1) c h), oklch(from var(--color-bg) calc(l - .1) c h)), conic-gradient(from var(--border-angle), transparent, var(--color-l) 10%, transparent 12%), linear-gradient(var(--color-bg), var(--color-subtle-bg));background-origin:padding-box,border-box,border-box;background-clip:padding-box,border-box,border-box;@media (prefers-reduced-motion:no-preference){--border-angle:1turn;--color-l:transparent}}&:active{--color-l:transparent;background:linear-gradient(oklch(from var(--color-bg) calc(l + .05) c h), oklch(from var(--color-bg) calc(l - .2) c h)), conic-gradient(from var(--border-angle), transparent, var(--color-l) 10%, transparent 12%), linear-gradient(var(--color-bg), var(--color-subtle-bg));background-origin:padding-box,border-box,border-box;background-clip:padding-box,border-box,border-box}&:where(:focus-visible){outline:2px solid var(--color-accent);outline-offset:0}}aside:has(h2:only-child){display:none}.catchphrase,blockquote:where(:not([class],[cite])){text-align:center;text-wrap:balance;margin-block:1em;font-size:clamp(2rem,1.5rem + 2.5vw,3.5rem);font-style:italic;font-weight:700;@media (prefers-contrast:no-preference){background:linear-gradient(180deg, var(--color-text) 30%, oklch(from var(--color-text) .7 c h) 100%);color:#0000;text-shadow:0 .25em .5em oklch(0% 0 0/.2);background-clip:text}&>p{display:contents}}.visually-hidden{clip-path:circle(0);position:absolute}@keyframes fadeIn{0%{opacity:0}}@keyframes fadeOut{to{opacity:0}}@keyframes slideDown{0%{opacity:0;transform:translateY(-100%)scaleY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}}@keyframes parallax{0%{transform:translateY(0)}to{transform:translateY(20lvb)}}@keyframes fadeBack{0%{opacity:1;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(20lvb)scale(.6)}}@keyframes scaleIn{0%{opacity:0;transform:scale(0)}}article.card{anchor-name:--article-card;anchor-scope:--article-card;isolation:isolate;border:2px solid #0000;border-radius:.5rem;grid-template-rows:[image-start type-start]auto[image-end type-end meta-start date-start]auto[meta-end date-end title-start]auto[title-end teaser-start]auto[teaser-end].5em;grid-template-columns:[image-start].5em[title-start teaser-start date-start type-start]1fr[date-end meta-start]auto[meta-end title-end teaser-end type-end].5em[image-end];row-gap:.5em;margin-block:1.5em;display:grid;container-name:--card;@container (width>=40rem){grid-template-rows:[image-start type-start].5em[title-start]auto[title-end meta-start date-start]auto[meta-end date-end].5em[teaser-start]1fr[teaser-end].5em[image-end type-end];grid-template-columns:[image-start].5em[type-start]30ch[type-end].5em[image-end]1em[title-start teaser-start date-start]auto[date-end meta-start]1fr[title-end teaser-end meta-end].5em;row-gap:0;&:not(.featured)>.reading-meta:not(:empty):before{content:"•" / "";margin-inline:1ch}}@media (prefers-reduced-motion:no-preference){animation-trigger:--t play-forwards play-backwards;timeline-trigger:--t view() entry 50% exit 50%;trigger-scope:--t;animation:1s ease-out .1s both fadeIn}&>:is(h1,h2,h3,h4,h5,h6){z-index:1;grid-area:title;margin:0;font-size:1.25rem;& a{text-decoration:none;&:before{content:"";inset:anchor(--article-card inside);z-index:1;border-radius:.5rem;position:absolute}&:is(:hover,:focus){text-decoration:underline;@supports selector(:has(:focus-visible)){outline:none}}}}&>picture{display:contents}& img{object-fit:cover;border-radius:.5rem;grid-area:image;max-block-size:100%;inline-size:100%;block-size:100%!important}& .type{background:var(--color-bg);z-index:1;border-radius:.25em;grid-area:type;place-self:end;margin-block:.5em;padding-block:.5em;padding-inline:.5em;font-size:.875rem;font-weight:500;line-height:1;@supports (corner-shape:squircle){corner-shape:squircle;border-radius:100vmax}}& p:not(.reading-meta){grid-area:teaser;margin:0}& .reading-meta{color:var(--color-subtle-text);grid-area:meta;margin:0;font-size:.875rem}& time{color:var(--color-subtle-text);grid-area:date;font-size:.875rem}&.featured:has(img){grid-template-rows:[image-start type-start]auto[image-end type-end meta-start date-start]auto[meta-end date-end title-start]auto[title-end teaser-start]auto[teaser-end].5em;grid-template-columns:[image-start].5em[title-start teaser-start date-start type-start]1fr[date-end meta-start]auto[meta-end title-end teaser-end type-end].5em[image-end];row-gap:.5em}&:is(:hover,:focus-within){background:radial-gradient(circle at 50% 250%, var(--color-subtle-bg), var(--color-bg)), linear-gradient(var(--color-subtle-bg), var(--color-bg));background-origin:padding-box,border-box;background-clip:padding-box,border-box;box-shadow:0 .75rem 1rem -.25rem oklch(0% 0 0/.06),0 .25rem .375rem -.125rem oklch(0% 0 0/.02)}&:has(a:focus-visible){outline:2px solid var(--color-accent)}&:not(:has(img)){grid-template-rows:.5em[type-start date-start]auto[type-end date-end title-start]auto[title-end teaser-start]auto[teaser-end].5em;grid-template-columns:.5em[title-start teaser-start type-start]auto[type-end date-start]1fr[title-end teaser-end date-end].5em;column-gap:.5rem;& .type{background:var(--color-accent);color:var(--color-bg)}& time{align-self:center}& :is(h2,h3,p){color:var(--color-text);letter-spacing:.05ch;text-transform:unset;text-wrap:balance;font-size:1.5em;font-weight:300;line-height:1.2}}}.social{flex-direction:row;justify-content:center;gap:min(.5em,1vi);display:flex;@supports (position-area:bottom){margin-block-end:1lh}& a{color:currentColor;anchor-scope:--social-link;outline-offset:0;-webkit-tap-highlight-color:transparent;flex-direction:column;align-items:center;display:flex;&>svg{anchor-name:--social-link;stroke-width:.1rem;inline-size:100%;@media (prefers-reduced-motion:no-preference){transition:stroke-width .2s ease-out,filter .25s ease-out}}&>span{font-size:.875rem;display:none}&:is(:hover,:focus){&>svg{stroke-width:.15rem;@media not (prefers-contrast:more){filter:drop-shadow(0 0 .1rem)}}@supports (position-area:bottom){&>span{position-anchor:--social-link;position-area:bottom;display:block;position:absolute;@media (prefers-reduced-motion:no-preference){animation:slideDown .3s linear(0, 1.5, .5, 1.2, .8, 1) backwards}}}}&:active{&>svg{stroke-width:.1rem}}}}main{--toc-row:3 / span 10;&:has(.eyebrow+h1){--toc-row:4 / span 10}}.table-of-contents{background-color:var(--color-highlight);border-inline-start:.25rem solid var(--color-accent);border-radius:.5rem;margin-block:2rem;padding-block:1rem;padding-inline:1.5rem;@media (width>=1200px){grid-row:var(--toc-row);align-self:start;margin-block:1rem;margin-inline-start:4rem;position:sticky;top:5rem;grid-column:sidebar!important}& header{color:var(--color-text);margin-block:0 1rem;font-size:1.25rem;font-weight:600}& ul{margin:0;padding-inline-start:0;list-style-type:""}& ul ul{padding-inline-start:2ch}& li{margin-block:.5rem}& a{color:var(--color-accent);text-decoration:none;transition:color .2s;&:hover,&:focus{color:var(--color-text,oklch(100% 0 0));text-decoration:underline}&:focus-visible{outline:2px solid var(--color-accent,oklch(86% .18 90.53));outline-offset:2px;border-radius:2px}}@supports (scroll-target-group:auto){scroll-target-group:auto;border:unset;&>ul{border-inline-start:2px solid oklch(from var(--color-text) l c h / .1);anchor-name:--toc-list;margin-inline-start:1ch;padding-inline-start:2ch;&:before{content:"";width:4px;inset-block:anchor(--toc-target inside);background-color:var(--color-accent);border-radius:2px;transition:inset .2s ease-out;display:block;position:absolute;inset-inline-start:calc(anchor(--toc-list start) - 1px)}}& a:target-current{anchor-name:--toc-target}}}@property --color-border{syntax:"<color>";inherits:false;initial-value:#000}@property --color-border-2{syntax:"<color>";inherits:false;initial-value:#000}@property --color-shadow{syntax:"<color>";inherits:false;initial-value:#000}body.home{& main>div{font-size:clamp(1rem,.8645rem + .6024vw,1.25rem);font-weight:300}& .intro{isolation:isolate;& h1{text-wrap:balance;text-transform:none;margin-block-end:.25em;font-size:1.25em;font-weight:400;& .name{font-weight:600}& .alias{color:var(--color-accent);font-style:italic;font-weight:600}}& a{float:left;z-index:1;shape-outside:polygon(0 0, 80% 0, 99% 30%, 98% 45%, 85% 75%, 65% 90%, 0 100%);margin-block-end:1rem;margin-inline-end:2rem;position:relative;@media (prefers-reduced-motion:no-preference){animation:1ms linear both fadeIn;animation-timeline:view();animation-range:entry 10%}}&>p{margin-block-start:unset}}& .website{& ul{list-style-image:url(/icons/kunai.svg);list-style-type:"";& ::marker{color:var(--color-accent)}}& li{margin-block:.5em}& strong{color:var(--color-accent);font-weight:600}}& .profile{--color-border:var(--color-bg);--color-border-2:var(--color-subtle-bg);background:url(/images/color-splash-bg-256x256.jpg), radial-gradient(circle at 50% 250%, var(--color-subtle-bg), var(--color-bg)), linear-gradient(var(--color-border), var(--color-border-2));background:image-set(url(/images/color-splash-bg-256x256.avif) type("image/avif"), url(/images/color-splash-bg-256x256.jpg) type("image/jpeg")), radial-gradient(circle at 50% 250%, var(--color-subtle-bg), var(--color-bg)), linear-gradient(var(--color-border), var(--color-border-2));filter:brightness(.9);box-shadow:0 .75rem 1rem -.25rem oklch(from var(--color-shadow) l c h / .1), 0 .25rem .375rem -.125rem oklch(from var(--color-shadow) l c h / .2), inset 0 .25rem .375rem -.125rem oklch(from var(--color-shadow) l c h / .2);background-position:bottom,50%,50%;background-repeat:no-repeat,no-repeat,no-repeat;background-size:100%,100%,100%;background-origin:padding-box,padding-box,border-box;background-clip:padding-box,padding-box,border-box;border:2px solid #0000;border-radius:57% 43% 69% 37%/50% 52% 57% 46%;transition:--color-border .3s ease-out,--color-border-2 .3s ease-out,--color-shadow .3s ease-out;&>img,&>picture>img{object-fit:cover;transform-origin:0 100%;width:10rem;height:10rem;transition:transform .3s linear(0, .447 8.5%, .793 17.4%, .927 22%, 1.039 26.8%, 1.125 31.7%, 1.189 36.8%, 1.224 41.2%, 1.244 45.7%, 1.25 50.5%, 1.241 55.6%, 1.195 65.1%, 1.036 88.1%, 1.009 94.4%, 1);filter:drop-shadow(0 .25rem .375rem oklch(0% 0 0/.75));transform:scale(1);mask-image:linear-gradient(#000 98%,#0000 100%);mask-size:100%;mask-repeat:no-repeat}&:is(:hover,:focus){filter:brightness();--color-border:var(--color-accent);--color-border-2:var(--color-accent);--color-shadow:var(--color-accent);@media (prefers-reduced-motion:no-preference){outline:none;&>img,&>picture>img{transform:scale(1.2)}}}}}body.blog,body[class^=blog-tags-]{& main{--grid-columns:[full-width-start] 1fr [margin-start] 1rem [content-start] min(140ch, calc(100vi - 2rem)) [content-end] 1rem [margin-end] 1fr [full-width-end];row-gap:2rem;&>h1{margin-block:unset}&>.intro{font-size:clamp(1rem,.8645rem + .6024vw,1.25rem);font-weight:300}&>nav.tags{margin-block:1rem 2rem;&>ul{flex-wrap:wrap;gap:.75rem;margin:0;padding:0;list-style:none;display:flex}& a.tag{background-color:var(--color-highlight);color:var(--color-text);border:1px solid oklch(from var(--color-bg) calc(l + .15) c h);border-radius:.25rem;padding:.5rem 1rem;font-size:.9rem;font-weight:500;text-decoration:none;transition:background-color .2s,border-color .2s;display:inline-block;&:hover{background-color:oklch(from var(--color-highlight) calc(l + .1) c h);border-color:var(--color-accent)}&:focus{outline:2px solid var(--color-accent);outline-offset:2px}&:active{background-color:oklch(from var(--color-highlight) calc(l + .15) c h)}&[aria-current=page]{border-color:var(--color-accent);background-color:oklch(from var(--color-highlight) calc(l + .12) c h);font-weight:700}}}}}body:is([class^=blog-]:where(:not([class^=blog-tags-])),[class^=speaking-]){& main{margin-block-start:0}& main>article{grid-column:full-width;grid-template-columns:subgrid;display:grid;&>*{grid-column:content}& h1,& .eyebrow{grid-column:title}& .reading-meta{margin-block:unset;color:var(--color-subtle-text);grid-column:title;font-size:.875rem}& h1{&:has(+.reading-meta){margin-block-end:.25em}}& :where(h1,.reading-meta,.table-of-contents)+p:has(img){grid-area:1/full-width;margin-block-start:0;overflow:clip;& img{object-fit:cover;block-size:auto;inline-size:100%;@supports (animation-timeline:view()){animation:1ms linear both fadeOut;animation-timeline:view();animation-range:exit;@media (prefers-reduced-motion:no-preference){animation:1ms linear both fadeBack;animation-timeline:view();animation-range:exit}}}}& p:has(:is(img,picture):only-child){text-align:center}&>footer{color:var(--color-subtle-text);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:2rem;margin-block:1em;font-size:.875rem;display:flex;&>p{margin:unset;flex-grow:100}}}& img{border-radius:.25rem;block-size:auto;max-inline-size:100%}}figure{margin-inline:unset;margin-block:1rem 2rem;&>p:has(>:is(img,picture):only-child){margin-block:unset}& img{border-radius:.25rem;block-size:auto;max-inline-size:100%}&>figcaption{color:var(--color-subtle-text);text-align:center;text-wrap:balance;margin-top:.5rem;font-size:.875rem;font-style:italic}}:not(pre)>code,kbd{background-color:var(--color-subtle-bg);border-radius:.25rem;padding-block:.25rem;padding-inline:.25rem}pre{border:1px solid var(--color-subtle-bg);border-radius:.5rem;padding-block:1.5rem;padding-inline:1.5rem}h2[id^=update-]:before{content:"⟳" / "";color:var(--color-accent);margin-inline-end:.2em;font-size:1.2em}.sidenote{color:var(--color-subtle-text);border-left:2px solid var(--color-subtle-text);margin-block:1.5rem;padding-block:.5rem;padding-inline-start:1.5rem;font-size:.875rem;&>:is(h2,h3){margin-block-start:0}}dl{margin-trim:block;grid-template-columns:auto 1fr;gap:.75rem 1rem;display:grid;& dt{font-weight:600}& dd{margin:0}}figure>p:has(img+img),figure>p:has(picture+picture){grid-template-columns:repeat(auto-fit,minmax(min(20ch,100%),1fr));justify-content:space-evenly;gap:5ch;display:grid;& img{width:100%;height:auto}}iframe{border-radius:.25rem}body:is([class^=blog-],[class^=speaking-]){& aside{&>h2{border-block-start:1px solid oklch(50% 0 0);padding-block-start:1em}}}.share-button{&.hidden{display:none}cursor:pointer;flex-grow:1;padding-block:.25em;padding-inline:.5em;font-size:1rem;&>svg{fill:currentColor;vertical-align:sub;block-size:1.2em;inline-size:auto}}.markdown-alert{--color-alert:var(--color-subtle-text);border-inline-start:4px solid var(--color-alert);background:var(--color-subtle-bg);border-radius:.25rem;margin-block:1rem 2rem;padding-inline:1rem;position:relative;&.markdown-alert-note{--color-alert:oklch(57% .2 259.67)}&.markdown-alert-tip{--color-alert:oklch(55% .15 146.25)}&.markdown-alert-important{--color-alert:oklch(58% .21 295.57)}&.markdown-alert-warning{--color-alert:oklch(57% .12 74.92)}&.markdown-alert-caution{--color-alert:oklch(59% .2 26.79)}& .markdown-alert-title{color:oklch(from var(--color-alert) calc(l + .1) c h);border-end-end-radius:.5rem;border-end-start-radius:.5rem;align-items:center;column-gap:.5rem;font-size:1.125em;font-weight:600;display:flex}&>:first-child{margin-block-start:.5rem}&>:last-child{margin-block-end:.75rem}& .octicon{fill:currentColor;background-color:var(--color-subtle-bg);z-index:-1;border-radius:50%;padding:.75em;position:absolute;inset-block-start:0;inset-inline-start:0;overflow:visible;translate:-50%}}.reactions{flex-wrap:wrap;flex:100%;gap:.5rem;display:flex;&>div{flex-wrap:wrap;align-items:start;row-gap:.5rem;display:flex}&>header,&>p{flex-basis:100%}&>header{font-size:1.5em}&>p{margin:unset}& #likes{color:oklch(70% .25 30)}& #boosts{color:oklch(70% .4 357)}& .count{vertical-align:middle;font-variant-numeric:tabular-nums;border-radius:100vmax;padding-block:.25em;padding-inline:.5em;font-weight:700;line-height:1;display:inline-block}& .avatars{flex-wrap:wrap;flex-basis:100%;gap:.25em;display:flex;&>:is(a,img){content-visibility:auto;contain-intrinsic-size:3rem}& a,& img{border-radius:50%;block-size:3rem;inline-size:3rem;overflow:hidden}& a{outline-offset:0}& img{object-fit:cover;box-shadow:0 2px 6px 1px oklch(from var(--color-subtle-bg) l c h / .5);border:1px solid oklch(from var(--color-subtle-bg) l c h / .5);animation:.3s ease-out fadeIn;@media (prefers-reduced-motion:no-preference){animation:.3s ease-out scaleIn}}}}table{border-collapse:separate;background-color:var(--color-subtle-bg);border-spacing:0;border-radius:.25rem;margin-block:1.5em;padding-block-end:.5rem}thead{& th{border-block-end:2px solid var(--color-bg);padding-block:.75em}}tbody{padding-block-end:1rem}td{padding-block:1em;padding-inline:1em}baseline-status{margin-block-end:1.5rem}.series{grid-template-columns:subgrid;display:grid}body[class^=notes-]{& main{grid-auto-rows:1fr}& article{align-self:center;&>h1,&>p{letter-spacing:.05ch;text-transform:unset;text-wrap:balance;font-size:1.5em;font-weight:300;line-height:1.2}}}body.about{& h1{margin-block:unset;color:var(--color-subtle-text);font-size:1rem}& #bio{font-size:clamp(1rem,.8645rem + .6024vw,1.25rem);font-weight:300;&>img,&>picture>img{filter:drop-shadow(0 .25rem .375rem oklch(0% 0 0/.75));inline-size:clamp(20rem,50%,40rem);max-inline-size:100%;height:auto;margin-block:1rem;margin-inline:auto;animation:1ms ease-out both fadeIn;animation-timeline:view();animation-range:entry 25% entry 125%;display:block;@media (width>=500px){margin-inline:1rem}}}& .profile{mask-image:linear-gradient(#000 80%,#0000 99%);@media (width>=500px){float:right;shape-outside:polygon(48% 20%, 64% 20%, 69% 52%, 100% 80%, 99% 92%, 7% 88%, 12% 44%, 40% 45%);shape-margin:.5em}}& .dog{@media (width>=500px){float:left;shape-outside:polygon(62% 1%, 80% 18%, 79% 39%, 81% 53%, 90% 67%, 90% 85%, 69% 92%, 5% 84%, 1% 40%, 16% 10%);shape-margin:1.5em}}& #badges{flex-wrap:wrap;justify-content:center;gap:1.5rem 3rem;display:flex;& h2{flex-basis:100%}& a{outline-offset:.25rem;outline-color:var(--color-accent);border-radius:.5rem;text-decoration:none;transition:scale .15s ease-out;@media (prefers-reduced-motion:no-preference){animation:slideUp .15s calc(.1s * sibling-index()) ease-out both;animation-trigger:--t play-forwards play-backwards;timeline-trigger:--t view() entry 75% exit 10%;trigger-scope:--t}&:hover:not(:active){@media (prefers-reduced-motion:no-preference){scale:1.075}}}& img{filter:drop-shadow(0 .25rem .375rem oklch(0% 0 0/.75));block-size:auto;inline-size:clamp(6rem,20vw,10rem)}& .lida{background:radial-gradient(#fff 65%,#0000 70%)}}}.note{background:radial-gradient(circle at 25% -75%, var(--color-subtle-bg) 25%, oklch(from var(--color-bg) calc(l - .1) c h) 75%), linear-gradient(oklch(from var(--color-bg) calc(l - .2) c h), oklch(from var(--color-bg) calc(l - .05) c h));background-origin:padding-box,border-box;background-clip:padding-box,border-box;border:2px solid #0000;border-radius:1rem;margin-block:2rem;padding:2rem;font-weight:400;position:relative;box-shadow:0 .75rem 1rem -.25rem oklch(0% 0 0/.06),0 .25rem .375rem -.125rem oklch(0% 0 0/.02);& h3{margin-top:0}&:before{@media (prefers-contrast:no-preference){content:"";opacity:.2;pointer-events:none;background:url(/images/samurai.svg) bottom/contain no-repeat;position:absolute;inset:0}}}pre[data-language]:before{content:attr(data-language);border-block-end:1px solid var(--color-subtle-bg);text-transform:uppercase;margin-block-end:1em;padding-block-end:.5em;font-size:1.2em;font-weight:500;display:block}code[class*=language-],pre[class*=language-]{color:#f8f8f2;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;tab-size:4;hyphens:none;background:0 0;font-family:Consolas,Monaco,Andale Mono,Ubuntu Mono,monospace;line-height:1.5}pre[class*=language-]{border-radius:.3em;margin:.5em 0;padding:1em;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2b2b2b}:not(pre)>code[class*=language-]{white-space:normal;border-radius:.3em;padding:.1em}.token.comment,.token.prolog,.token.doctype,.token.cdata{color:#d4d0ab}.token.punctuation{color:#fefefe}.token.property,.token.tag,.token.constant,.token.symbol,.token.deleted{color:#ffa07a}.token.boolean,.token.number{color:#00e0e0}.token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:#abe338}.token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string,.token.variable{color:#00e0e0}.token.atrule,.token.attr-value,.token.function{color:gold}.token.keyword{color:#00e0e0}.token.regex,.token.important{color:gold}.token.important,.token.bold{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}@media (forced-colors:active){code[class*=language-],pre[class*=language-]{color:windowtext;background:window}:not(pre)>code[class*=language-],pre[class*=language-]{background:window}.token.important{color:window;background:highlight;font-weight:400}.token.atrule,.token.attr-value,.token.function,.token.keyword,.token.operator,.token.selector{font-weight:700}.token.attr-value,.token.comment,.token.doctype,.token.function,.token.keyword,.token.operator,.token.property,.token.string{color:highlight}.token.attr-value,.token.url{font-weight:400}}