@font-face{font-display:swap;font-family:forma mono;font-style:normal;font-weight:100 900;src:url(/fonts/FormaMono.woff2)format("woff2")}:root{--background-backdrop:hsl(275 15% 15% / 75%);--background-body:hsl(0 0% 75%);--background-glass:hsl(275 10% 90% / 50%);--background-tag:hsl(275 5% 95% / 50%);--border-article:hsl(275 15% 70% / 50%);--border-glass:hsl(275 15% 85% / 50%);--colour-body:hsl(275 15% 15%);--colour-glass:hsl(275 5% 30%);--shadow-article:hsl(275 5% 5% / 90%);--shadow-glass:hsl(275 15% 25% / 50%);--font:"Forma Mono", monospace;--size:clamp(1rem, 0.9375rem + 0.3125vw, 1.125rem);--space-3xs:clamp(0.25rem, 0.2188rem + 0.1563vw, 0.3125rem);--space-2xs:clamp(0.5rem, 0.4688rem + 0.1563vw, 0.5625rem);--space-xs:clamp(0.75rem, 0.6875rem + 0.3125vw, 0.875rem);--space-s:clamp(1rem, 0.9375rem + 0.3125vw, 1.125rem);--space-m:clamp(1.5rem, 1.4063rem + 0.4688vw, 1.6875rem);--space-l:clamp(2rem, 1.875rem + 0.625vw, 2.25rem);--space-xl:clamp(3rem, 2.8125rem + 0.9375vw, 3.375rem);--space-2xl:clamp(4rem, 3.75rem + 1.25vw, 4.5rem);--space-3xl:clamp(6rem, 5.625rem + 1.875vw, 6.75rem)}@media(prefers-color-scheme:dark){:root{--background-backdrop:hsl(275 25% 5% / 75%);--background-body:hsl(0 0% 25%);--background-glass:hsl(275 5% 15% / 50%);--background-tag:hsl(275 5% 10% / 50%);--border-article:hsl(275 15% 70% / 50%);--border-glass:hsl(275 10% 95% / 50%);--colour-body:hsl(275 5% 80%);--colour-glass:hsl(275 5% 90%);--shadow-article:hsl(275 5% 5% / 90%);--shadow-glass:hsl(275 15% 15% / 50%)}}a{color:inherit;text-decoration:underline}em,i{font-style:italic;font-variation-settings:"slnt" -8}strong,b,h1,h2,h3{font-style:normal;font-variation-settings:"wght" 600;font-weight:400}strong em,strong i,b em,b i,em strong,em b,i strong,i b{font-style:italic;font-variation-settings:"slnt" -8,"wght" 600;font-weight:400}.glass{backdrop-filter:blur(5px);background:var(--background-glass);border:1px solid var(--border-glass);border-radius:100px;box-shadow:0 0 var(--space-s)var(--shadow-glass);color:var(--colour-glass);transition:all 250ms ease-out;&:hover{backdrop-filter:blur(10px)}}body{background:var(--background-body);color:var(--colour-body);font-family:var(--font);font-size:var(--size);font-synthesis:none;hyphens:auto;hyphenate-limit-chars:7 3 4;line-height:1.45;padding:var(--space-s);text-align:justify}.site-header{z-index:1;.home{display:flex;align-items:center;justify-content:center;height:48px;line-height:0;position:fixed;bottom:var(--space-l);left:var(--space-m);width:48px;z-index:2;&:focus, &:hover{scale:1.2}}.tag{background:var(--background-tag);display:flex;align-items:center;justify-content:center;height:48px;line-height:1;padding:0 var(--space-xs)0 calc(var(--space-xs) + 48px);position:fixed;bottom:var(--space-l);left:var(--space-m);z-index:1;&:hover{backdrop-filter:blur(5px)}}.menu{display:flex;align-items:center;overflow:hidden;position:fixed;bottom:var(--space-l);right:var(--space-m);z-index:2;.item{display:flex;align-items:center;justify-content:center;height:48px;line-height:0;padding:0 var(--space-3xs);transition:background 250ms ease,scale 250ms ease-out;width:48px;&:focus, &:hover{background:var(--background-tag);scale:1.1}}}}.site-main{.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:calc(var(--space-s)/1.6)var(--space-s);+ .grid{margin:calc(var(--space-s)/1.6)0 0}.post{margin:0;padding:0;.post-image{border:1px solid var(--background-border);border-radius:var(--space-s);transition:scale 250ms ease-out;width:100%;&:focus, &:hover{scale:1.025}}}}}@supports(display:grid-lanes){.site-main{.grid{display:grid-lanes}}}.post{figure{margin:0 auto var(--space-2xl);padding:0;img{border-radius:var(--space-s)var(--space-s)0 0;width:100%;margin:-48px 0 0}figcaption{font-size:small;padding:0 var(--space-2xs)0 0;text-align:right}}.content{margin:0 auto;width:min(50ch,calc(100% - 4 * var(--space-s)));padding:var(--space-s)0;h1{font-size:var(--size);line-height:1.4;margin:0 0 var(--space-3xs);text-transform:uppercase}p{margin:0 0 var(--space-s);&:last-of-type{margin:0}}.meta{display:flex;align-items:center;justify-content:space-between;font-size:small;margin:var(--space-l)0 var(--space-m);text-align:center;a{border:1px solid;border-radius:var(--space-m);padding:var(--space-3xs)var(--space-xs);text-decoration:none;transition:scale 250ms ease-out;&:focus, &:hover{scale:1.1}}}}}.article-popover{background:0 0;border:none;color:var(--color-body);height:100dvh;left:0;margin:0;max-height:100dvh;max-width:100vw;overflow:hidden;padding:0;top:0;width:100vw;&::backdrop{background:var(--background-backdrop);backdrop-filter:blur(5px);opacity:0;transition:opacity 250ms ease}&[open]::backdrop{opacity:1}.article-popover__inner{--x:0px;background:var(--background-body);border:1px solid var(--border-article);border-radius:var(--space-s);box-shadow:0 0 var(--space-3xl)var(--shadow-article);height:auto;left:50%;max-height:95dvh;overflow-y:auto;position:relative;top:50%;transform:translateX(calc(-50% + var(--x)))translateY(-50%)scale(var(--scale,0));transition:transform 250ms cubic-bezier(.34,1.56,.64,1);width:min(1024px,90vw)}&[open] .article-popover__inner{--scale:1}.article-popover__close{cursor:pointer;display:flex;align-items:center;justify-content:center;float:right;height:48px;line-height:0;position:sticky;top:var(--space-s);right:var(--space-s);transition:scale 250ms ease-out;width:48px;&:focus, &:hover{scale:1.2}}}