*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}body{min-block-size:100vh;line-height:1.6}h1,h2,h3,h4,h5,h6,button,input,label{line-height:1.1}h1,h2,h3,h4,h5,h6{text-wrap:balance}p,li{text-wrap:pretty}img,picture,video{max-inline-size:100%;display:block}input,button,textarea,select{font:inherit}:root{--font-family-heading:ui-sans-serif, system-ui, sans-serif,
    'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';--font-family-body:ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji',
    'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';--font-size-root:1rem;--font-scale-ratio:1.125;--font-size--2:calc(var(--font-size--1) / var(--font-scale-ratio));--font-size--1:calc(var(--font-size-0) / var(--font-scale-ratio));--font-size-0:var(--font-size-root);--font-size-1:calc(var(--font-size-0) * var(--font-scale-ratio));--font-size-2:calc(var(--font-size-1) * var(--font-scale-ratio));--font-size-3:calc(var(--font-size-2) * var(--font-scale-ratio));--font-size-4:calc(var(--font-size-3) * var(--font-scale-ratio));--font-size-5:calc(var(--font-size-4) * var(--font-scale-ratio));--font-size-6:calc(var(--font-size-5) * var(--font-scale-ratio));--font-size-7:calc(var(--font-size-6) * var(--font-scale-ratio));--font-size-8:calc(var(--font-size-7) * var(--font-scale-ratio));--font-weight-0:400;--font-weight-1:500;--font-weight-2:600;--font-weight-3:700;--spacing-step:0.25rem;--spacing-0:0px;--spacing-1:var(--spacing-step);--spacing-2:calc(var(--spacing-1) + var(--spacing-step));--spacing-3:calc(var(--spacing-2) + var(--spacing-step));--spacing-4:calc(var(--spacing-3) + var(--spacing-step));--spacing-5:calc(var(--spacing-4) + var(--spacing-step));--spacing-6:calc(var(--spacing-5) + var(--spacing-step));--spacing-7:calc(var(--spacing-6) + var(--spacing-step));--spacing-8:calc(var(--spacing-7) + var(--spacing-step));--spacing-9:calc(var(--spacing-8) + var(--spacing-step));--spacing-10:calc(var(--spacing-9) + var(--spacing-step));--spacing-11:calc(var(--spacing-10) + var(--spacing-step));--spacing-12:calc(var(--spacing-11) + var(--spacing-step));--spacing-13:calc(var(--spacing-12) + var(--spacing-step));--spacing-14:calc(var(--spacing-13) + var(--spacing-step));--spacing-15:calc(var(--spacing-14) + var(--spacing-step));--spacing-16:calc(var(--spacing-15) + var(--spacing-step));--border-radius-1:5px;--border-radius-2:10px;--background-colour:#ffffff;--text-colour:#000000;--text-light-colour:#737373;--border-colour:#e5e5e5;--border-dark-colour:#cccccc;--tag-background-colour:#f7f7f7;--featured-post-background-colour:#fafafa;--posts-heading-background-colour:#dee2e6;--underline-colour:#bbf7d0;--code-text-colour:#f8f8f2;--code-background-colour:#272822;--mobile-navigation-z-index:40;--wrapper-padding:var(--spacing-6);--wrapper-max-width:74ch;--prose-max-asset-height:500px;--site-header-height:4.5rem;--theme-transition-duration:500ms}[data-theme=dark]{--background-colour:#252524;--text-colour:#ffffff;--text-light-colour:#9d9d9d;--border-colour:#3b3b3b;--border-dark-colour:#515151;--tag-background-colour:#2c2c2c;--featured-post-background-colour:#292929;--posts-heading-background-colour:#9d9d9d;--underline-colour:#545454}@view-transition{navigation: auto;
}html{font-family:var(--font-family-body);font-size:var(--font-size-root);color:var(--text-colour);background-color:var(--background-colour);transition:background-color var(--theme-transition-duration)ease,color var(--theme-transition-duration)ease;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,.u-h1{font-family:var(--font-family-heading);font-size:var(--font-size-8);font-weight:var(--font-weight-2)}h2,.u-h2{font-family:var(--font-family-heading);font-size:var(--font-size-5);font-weight:var(--font-weight-2)}h3,.u-h3{font-family:var(--font-family-heading);font-size:var(--font-size-3);font-weight:var(--font-weight-2)}h4,.u-h4{font-family:var(--font-family-heading);font-size:var(--font-size-2);font-weight:var(--font-weight-2)}h5,.u-h5{font-family:var(--font-family-heading);font-size:var(--font-size-1);font-weight:var(--font-weight-2)}h6,.u-h6{font-family:var(--font-family-heading);font-size:var(--font-size-0);font-weight:var(--font-weight-2)}a{color:var(--text-colour);text-decoration:none;transition:color var(--theme-transition-duration)ease}.l-wrapper{max-inline-size:var(--wrapper-max-width);padding-inline:var(--wrapper-padding);margin-inline:auto}.l-page-title{margin-block:var(--spacing-12)}.about{display:flow-root}.about__contact{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-6);margin-bottom:var(--spacing-6);@media(width >= 760px){float: right; margin-left: var(--spacing-8); margin-bottom: var(--spacing-4);}}.about__social-links{display:flex;list-style:none;padding:0;margin:0;gap:var(--spacing-3);justify-items:center;align-items:center}.archive{display:flex;gap:var(--spacing-12);flex-direction:column}.archive__year{display:grid;grid-template-columns:max-content 1fr;gap:var(--spacing-16);padding-bottom:var(--spacing-12);border-bottom:1px solid var(--border-colour);&:last-of-type{border-bottom:0;padding-bottom:0}@media(width < 760px){grid-template-columns: 1fr; gap: var(--spacing-8);}}.archive__posts{display:flex;flex-direction:column;gap:var(--spacing-8)}@media(width > 760px){.archive__year-title{height:fit-content;position:sticky;top:var(--site-header-height)}}.avatar{--_size:10rem;border-radius:9999px;border-width:.5px;background-color:var(--background-colour);transition:background-color var(--theme-transition-duration)ease;border:1px solid var(--border-colour);padding:var(--spacing-2);width:var(--_size);height:var(--_size);img{border-radius:9999px}}@media(hover:hover) and (prefers-reduced-motion:no-preference){.avatar--spin:hover{animation:spin-once 400ms linear}@keyframes spin-once{from{transform:rotate(0)}to{transform:rotate(360deg)}}}.button{--button-text-colour:var(--background-colour);--button-background-colour:var(--text-colour);border-radius:var(--border-radius-2);color:var(--button-text-colour);background-color:var(--button-background-colour);padding:var(--spacing-3)var(--spacing-5);font-size:var(--font-size--1);transition:transform 100ms linear,background-color var(--theme-transition-duration)ease,color var(--theme-transition-duration)ease;&:active{transform:scale(.95)}}.podcast-ad{display:flex;gap:var(--spacing-6);margin-inline:calc(var(--wrapper-padding) * -1);padding:var(--wrapper-padding);background-color:var(--background-colour);border:1px solid var(--border-colour);border-radius:var(--border-radius-2);margin-block:var(--spacing-16);@media(width < 760px){flex-direction: column; align-items: center; text-align: center; margin-inline: 0;}}.podcast-ad__artwork{flex-shrink:0}.podcast-ad__artwork-image{width:140px;height:140px;border-radius:var(--border-radius-2);object-fit:cover;display:block;@media(width < 760px){width: 120px; height: 120px;}}.podcast-ad__content{flex:1;display:flex;flex-direction:column;justify-content:center}.podcast-ad__title{font-size:var(--font-size-3);font-weight:var(--font-weight-2);color:var(--text-colour);margin:0 0 var(--spacing-3);line-height:1.2;@media(width < 760px){font-size: var(--font-size-2);}}.podcast-ad__description{font-size:var(--font-size-0);color:var(--text-light-colour);margin:0 0 var(--spacing-3);line-height:1.5}.podcast-ad__link{font-weight:var(--font-weight-2);color:var(--text-colour);&::after{content:' →';font-weight:var(--font-weight-2)}}.post-footer{margin-top:var(--spacing-16);display:flex;flex-direction:column;gap:var(--spacing-12)}.posts__heading{margin-top:var(--spacing-9);display:flex;justify-content:center;position:relative;&::before{content:'';position:absolute;inset:0 0 10px;background-image:radial-gradient( var(--posts-heading-background-colour) 15%,transparent 15% );background-size:1rem 1rem;-webkit-mask:linear-gradient(to top,#ffffff,transparent);mask:linear-gradient(to top,#ffffff,transparent);z-index:-1}}.posts__post{margin-block:var(--spacing-16)}.posts__post--featured{margin-inline:calc(var(--wrapper-padding) * -1);padding:var(--wrapper-padding);background-color:var(--featured-post-background-colour);transition:transform 300ms ease-in-out,background-color var(--theme-transition-duration)ease;border-radius:var(--border-radius-2);@media(hover:hover) and (prefers-reduced-motion:no-preference){&:hover{transform:scale(1.03)}}}.posts__post-summary{margin-top:var(--spacing-4)}.posts__navigation{display:flex;justify-content:space-between}.projects{display:flex;flex-direction:column;gap:var(--spacing-6)}@media(prefers-reduced-motion:no-preference){.projects__section{opacity:0;transform:translateY(40px);transition:opacity 1e3ms cubic-bezier(.25,1,.5,1),transform 1e3ms cubic-bezier(.25,1,.5,1)}.projects__section.js-visible{opacity:1;transform:translateY(0)}}.projects__section{display:flex;flex-direction:column;gap:var(--spacing-4);padding-top:var(--spacing-10);&:first-child{padding-top:0}}.projects__heading{font-size:var(--font-size--1);font-weight:var(--font-weight-2);text-transform:uppercase;letter-spacing:.1em;color:var(--text-light-colour);padding-bottom:var(--spacing-3);border-bottom:1px solid var(--border-colour)}.projects__intro{color:var(--text-light-colour);line-height:1.5}.projects__section>.tags{@media(width < 760px){display: none;}}.projects__list{display:flex;flex-direction:column}.projects__collapsible{margin-top:calc(var(--spacing-2) * -1)}.projects__collapsible-trigger{font-size:var(--font-size--2);font-weight:var(--font-weight-1);text-transform:uppercase;letter-spacing:.08em;color:var(--text-light-colour);cursor:pointer;list-style:none;display:flex;align-items:center;gap:var(--spacing-2);&::-webkit-details-marker{display:none}&::after{content:'';width:.5em;height:.5em;border-right:1.5px solid var(--text-light-colour);border-bottom:1.5px solid var(--text-light-colour);transform:rotate(-45deg);transition:transform 200ms ease-in-out}}.projects__collapsible[open]>.projects__collapsible-trigger::after{transform:rotate(45deg)}.projects__item{display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4)var(--spacing-2);border-bottom:1px solid var(--border-colour);text-decoration:none;color:inherit;transition:background-color 200ms ease-in-out;&:last-child{border-bottom:none}@media(hover:hover){&:hover{background-color:var(--featured-post-background-colour)}}}.projects__item--static{cursor:default;@media(hover:hover){&:hover{background-color:initial}}}.projects__item-details{flex:1;min-width:0}.projects__item-name{font-size:var(--font-size-0);font-weight:var(--font-weight-2)}.projects__item-description{font-size:var(--font-size--1);color:var(--text-light-colour);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.projects__item .tags{flex-shrink:0;@media(width < 760px){display: none;}}.projects__item-links{display:flex;gap:var(--spacing-2);flex-shrink:0}.projects__item-link{position:relative;z-index:1;font-size:var(--font-size--1);font-weight:var(--font-weight-1);padding:.2em .75em;border-radius:var(--border-radius-1);background-color:var(--tag-background-colour);text-decoration:none;color:inherit;transition:background-color 200ms ease-in-out;@media(hover:hover){&:hover{background-color:var(--border-colour)}}}.projects__app{display:flex;align-items:center;gap:var(--spacing-4);padding:var(--spacing-4)var(--spacing-2);border-bottom:1px solid var(--border-colour);text-decoration:none;color:inherit;transition:background-color 200ms ease-in-out;&:last-child{border-bottom:none}@media(hover:hover){&:hover{background-color:var(--featured-post-background-colour)}}}.projects__app-icon{--_size:2.5rem;width:var(--_size);height:var(--_size);border-radius:calc(var(--_size) * .2237);flex-shrink:0;object-fit:cover}.projects__app-details{flex:1;min-width:0}.projects__app-name{font-size:var(--font-size-0);font-weight:var(--font-weight-2)}.projects__app-description{font-size:var(--font-size--1);color:var(--text-light-colour);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.projects__app-platform{font-size:var(--font-size--2);font-weight:var(--font-weight-1);color:var(--text-light-colour);white-space:nowrap;flex-shrink:0}.projects__children{display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--spacing-3);@media(width < 760px){grid-template-columns: 1fr 1fr;}@media(width < 480px){grid-template-columns: 1fr;}}.projects__child{display:flex;flex-direction:column;gap:var(--spacing-1);padding:var(--spacing-4);border-radius:var(--border-radius-2);border:1px solid var(--border-colour);text-decoration:none;color:inherit;transition:background-color 200ms ease-in-out;@media(hover:hover){&:hover{background-color:var(--featured-post-background-colour)}}}.projects__child-name{font-size:var(--font-size--1);font-weight:var(--font-weight-2)}.projects__child-description{font-size:var(--font-size--2);color:var(--text-light-colour);line-height:1.4}.published-at{margin-top:var(--spacing-2);display:block;color:var(--text-light-colour);font-size:var(--font-size--2)}.related{font-size:1.125rem;line-height:2rem}.related__title{margin-bottom:var(--spacing-3)}.related__posts{list-style-type:disc;li{padding-left:var(--spacing-1);margin-block:var(--spacing-2);&::marker{color:var(--text-light-colour)}}a{text-decoration:underline;font-weight:var(--font-weight-1)}}.scroll-watcher{display:none}@supports(animation-timeline:scroll()){.scroll-watcher{display:block;position:fixed;height:5px;width:100%;top:0;left:0;z-index:calc(var(--mobile-navigation-z-index) - 1);background-color:var(--text-colour);scale:0 1;transform-origin:left;animation:scroll-watcher linear;animation-timeline:scroll()}@keyframes scroll-watcher{to{scale:1 1}}}.site-footer{display:flex;justify-content:center;margin-block:var(--spacing-16);color:var(--text-light-colour);font-size:var(--font-size--2);text-transform:uppercase;gap:var(--spacing-8)}.site-footer__theme-toggle{all:unset;display:inline-flex;align-items:center;cursor:pointer;transition:transform 200ms ease-in-out;transform:rotate(180deg);svg{--_size:1rem;width:var(--_size);height:var(--_size)}}[data-theme=dark] .site-footer__theme-toggle{transform:rotate(0)}.site-header{background-color:var(--background-colour);transition:background-color var(--theme-transition-duration)ease;height:var(--site-header-height);display:flex;align-items:center;justify-content:space-between;z-index:calc(var(--mobile-navigation-z-index) - 1)}.site-header--pinable{position:sticky;top:calc(var(--site-header-height) * -1);transition:top 200ms linear;&.site-header--pinned{top:0}}.site-header__title{font-size:var(--font-size-2);font-weight:var(--font-weight-2);display:flex;gap:var(--spacing-1);align-items:center;span{font-weight:var(--font-weight-1);font-size:var(--font-size-0);color:var(--text-light-colour);display:inline-flex;align-items:center;gap:var(--spacing-1)}span::before{--_size:1rem;content:'';width:var(--_size);height:var(--_size);background-color:var(--text-light-colour);mask-image:var(--url);mask-repeat:no-repeat;mask-position:center}}.site-header__mobile-navigation-button{display:none}.site-header__navigation{display:flex;gap:var(--spacing-8)}.site-header__primary-navigation,.site-header__social-navigation{display:flex;list-style:none;padding:0;gap:var(--spacing-8)}@media(width < 760px){.site-header__title{z-index:calc(var(--mobile-navigation-z-index) + 1);position:relative}.site-header__mobile-navigation-button{--_size:5rem;all:unset;display:inline-flex;z-index:calc(var(--mobile-navigation-z-index) + 1);position:relative;gap:var(--spacing-2);justify-content:center;align-items:end;flex-direction:column;width:var(--_size);height:var(--_size);cursor:pointer;&::before, &::after{content:'';display:block;height:2px;width:1.25rem;background-color:var(--text-light-colour);transition:transform 100ms linear}}.site-header__navigation{opacity:0;z-index:var(--mobile-navigation-z-index);font-size:var(--font-size-2);position:fixed;inset:0;transform:translateY(100vh);transition:transform 100ms linear,background-color var(--theme-transition-duration)ease;justify-content:center;align-items:center;flex-direction:column;background:var(--background-colour)}.site-header__primary-navigation{flex-direction:column;align-items:center;transform:translateY(100vh);transition:transform 150ms ease-in-out 100ms}.site-header__social-navigation{transform:translateY(100vh);transition:transform 200ms ease-in-out 200ms}.js-mobile-navigation-open{overflow:hidden;.site-header__navigation{opacity:1}.site-header__navigation, .site-header__primary-navigation, .site-header__social-navigation{transform:translateY(0)}.site-header__mobile-navigation-button{&::before{width:1.5rem;transform:translate(0,5px)rotate(45deg)}&::after{width:1.5rem;transform:translate(0,-5px)rotate(-45deg)}}}}.social-icon{--_size:1.5rem;display:block;width:var(--_size);height:var(--_size);background-color:var(--text-colour);mask-image:var(--url);mask-repeat:no-repeat;mask-position:center;font-size:0}.tags{display:flex;flex-wrap:wrap;gap:var(--spacing-2);list-style:none;margin:0;padding:0;font-weight:var(--font-weight-1);font-size:var(--font-size--1);li{background-color:var(--tag-background-colour);transition:transform 100ms linear;padding:.25em 1em;border-radius:var(--border-radius-1);&:has(a:active){transform:scale(.95)}}}.tags--large{font-size:var(--font-size-1);gap:var(--spacing-3);li{border-radius:var(--border-radius-2)}}.u-prose{font-size:1.125rem;line-height:2rem;h2{margin-top:2em;margin-bottom:1em}h3{margin-top:1.6em;margin-bottom:.6em}h4{margin-top:1.5em;margin-bottom:.5em}h5{margin-top:1.4em;margin-bottom:.4em}h6{margin-top:1.4em;margin-bottom:.4em}h2 + *, h3 + *, h4 + *, h5 + *, h6 + *{margin-top:0}p{margin-bottom:1.25em;&:has(img), &:has(picture), &:has(video){display:grid;grid-auto-flow:column;align-items:center;gap:var(--spacing-2)}}code{font-weight:var(--font-weight-2);font-size:var(--font-size--1);line-height:1rem;&::before, &::after{content:'`'}}pre{overflow-x:auto;font-weight:var(--font-weight-0);font-size:var(--font-size--1);line-height:1.7rem;border-radius:var(--border-radius-2);padding:var(--spacing-4);margin-block:var(--spacing-8);background-color:var(--code-background-colour);color:var(--code-text-colour);code{background-color:initial;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit;&::before, &::after{display:none}}}table{width:100%;table-layout:auto;margin-block:var(--spacing-8);font-size:var(--font-size-0);line-height:1.7rem;border-collapse:collapse;thead{border-bottom:1px solid var(--border-dark-colour);th{font-weight:var(--font-weight-2);padding-bottom:var(--spacing-2);text-align:start;&:first-child{padding-left:0}}}tbody{td{padding:var(--spacing-2)0;text-align:start}tr{border-bottom:1px solid var(--border-colour);&:last-child{border-bottom:0}}}}kbd{font-weight:var(--font-weight-1);font-family:inherit;box-shadow:var(--text-colour)1px var(--border-colour),0 3px var(--border-colour);font-size:var(--font-size--1);border-radius:var(--border-radius-1);padding:var(--spacing-1);&:has(kbd){box-shadow:0 0 var(--text-colour),0 0 var(--text-colour)}}ul{list-style-type:disc}ol li, ul li{padding-left:var(--spacing-1);margin-block:var(--spacing-2);&::marker{color:var(--text-light-colour)}}hr{margin-block:var(--spacing-12);border:none;height:1px;background-color:var(--border-colour)}a{text-decoration:underline;font-weight:var(--font-weight-1);&[rel~=external]:not(:has(img))::after{--_size:0.75rem;content:'';display:inline-block;width:var(--_size);height:var(--_size);margin-left:var(--spacing-1);background-color:var(--text-colour);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='currentColor' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a.5.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1-0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3E%3Cpath fill='currentColor' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3E%3C/svg%3E");mask-repeat:no-repeat;mask-position:center}}img, picture, video{margin-inline:auto;max-height:var(--prose-max-asset-height);&:not(p &){margin-bottom:1.25em}}blockquote{font-style:italic;border-left:.25rem solid var(--border-colour);margin-block:1.6em;padding-inline-start:1em}}.u-visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.u-overlay-wrapper{position:relative}.u-overlay{position:absolute;inset:0;font-size:0}.u-transition-between-pages{view-transition-name:var(--id)}.u-underline{--length:100%;display:inline;background-image:linear-gradient( to right,var(--underline-colour),var(--underline-colour) );background-repeat:no-repeat;background-position:0 100%;background-size:var(--length).5rem;transition:background-size 300ms ease-in-out}.u-underline-on-hover{.u-underline{--length:0}@media(hover:hover){&:hover{.u-underline{--length:100%}}}}