@font-face{font-display:swap;font-family:Forma Mono;font-style:normal;font-weight:100 900;src:url(../fonts/FormaMono.woff2) format("woff2")}:root{--bg-body:#bfbfbf;--bg-border:rgba(230,226,233,.1);--bg-button:rgba(39,33,44,.55);--bg-header:#27212c;--clr-body:#27212c;--clr-header:#e6e2e9;--clr-backdrop:rgba(39,33,44,.75);--clr-shadow:rgba(65,54,73,.25);--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)}a{color:inherit;text-decoration:underline}body{background:var(--bg-body);color:var(--clr-body);font-family:var(--font);font-size:var(--size);font-synthesis:none;hyphenate-limit-chars:7 3 4;hyphens:auto;line-height:1.45;padding:var(--space-s);text-align:justify}.site-header{color:var(--clr-header);z-index:1;.logo{backdrop-filter:blur(5px);background:var(--bg-button);border:1px solid var(--bg-border);border-radius:100px;bottom:var(--space-l);box-shadow:0 0 var(--space-s) calc(--space-3xs) var(--clr-shadow);left:var(--space-m);line-height:0;position:fixed;transition:scale .25s ease-out;z-index:2;&:focus,&:hover{scale:1.2}img{border-radius:100px;width:37px}}.logo:has(+.tag){box-shadow:none}.tag{backdrop-filter:blur(5px);background:var(--bg-button);border:1px solid var(--bg-border);border-radius:100px;bottom:var(--space-l);box-shadow:0 0 var(--space-s) var(--space-3xs) var(--clr-shadow);left:var(--space-m);line-height:1;padding:calc(var(--space-2xs) + 2px) var(--space-xs) var(--space-2xs) calc(var(--space-xs) + 40px);position:fixed;z-index:1}.about{backdrop-filter:blur(5px);background:var(--bg-button);border:1px solid var(--bg-border);border-radius:100px;bottom:var(--space-l);box-shadow:0 0 var(--space-s) var(--space-3xs) var(--clr-shadow);line-height:0;padding:1px;position:fixed;right:var(--space-m);transition:scale .25s ease-out;z-index:2;&:focus,&:hover{scale:1.2}}}.site-main{.grid{display:grid;gap:calc(var(--space-s)/1.6) var(--space-s);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));+.grid{margin:calc(var(--space-s)/1.6) 0 0 0}.post{margin:0;padding:0;.post-image{border:1px solid var(--bg-border);border-radius:var(--space-s);transition:scale .25s 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) auto;padding:0;img{border-radius:var(--space-s) var(--space-s) 0 0;margin:-39px 0 0;width:100%}figcaption{font-size:small;padding:0 var(--space-2xs) 0 0;text-align:right}}.content{margin:0 auto;padding:var(--space-s) 0;width:min(66ch,calc(100% - var(--space-s)*4));h1{font-size:var(--size);line-height:1.4;margin:0 0 var(--space-3xs) 0;text-transform:uppercase}p{margin:0 0 var(--space-s) 0;&:last-of-type{margin:0}}.meta{margin:var(--space-l) 0 var(--space-m) 0;text-align:center}}}.article-popover{background:transparent;border:none;height:100dvh;left:0;margin:0;max-height:100dvh;max-width:100vw;overflow:hidden;padding:0;top:0;width:100vw;&::backdrop{backdrop-filter:blur(5px);background:var(--clr-backdrop);opacity:0;transition:opacity .25s ease}&[open]::backdrop{opacity:1}.article-popover__inner{--x:0px;background:var(--bg-body);border:1px solid var(--bg-border);border-radius:var(--space-s);box-shadow:0 0 var(--space-3xl) var(--bg-header);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 .25s cubic-bezier(.34,1.56,.64,1);width:min(1024px,90vw)}&[open] .article-popover__inner{--scale:1}.article-popover__close{backdrop-filter:blur(5px);background:var(--bg-button);border:1px solid var(--bg-border);border-radius:100px;box-shadow:0 0 var(--space-s) var(--space-3xs) var(--clr-shadow);color:var(--clr-header);cursor:pointer;float:right;line-height:0;padding:1px;position:sticky;right:var(--space-s);top:var(--space-s);transition:scale .25s ease-out;&:focus,&:hover{scale:1.2}}}/*# sourceMappingURL=screen.css.map */
