*,::after,::before{box-sizing:border-box}html{-webkit-tap-highlight-color:transparent;overflow-y:scroll;-webkit-text-size-adjust:100%;text-size-adjust:100%}a,button,body,h1,h2,h3,h4,h5,h6{color:var(--primary)}body{word-break:break-word;background:var(--theme)}article,aside,figcaption,figure,header,hgroup,main,nav,section,table{display:block}h1,h2,h3,h4,h5,h6{line-height:1.2}h1,h2,h3,h4,h5,h6,p{margin-top:0;margin-bottom:0}ul,ol{padding:0}a{text-decoration:none}body,figure,ul{margin:0}table{width:100%;border-collapse:collapse;border-spacing:0;overflow-x:auto;word-break:keep-all}button,input,textarea{padding:0;font:inherit;background:0 0;border:0}input,textarea{outline:0}button,input[type=button],input[type=submit]{cursor:pointer}input:-webkit-autofill,textarea:-webkit-autofill{box-shadow:0 0 0 50px var(--theme)inset}img{display:block;max-width:100%}:root{--main-width:53.5rem;--main-padding:1.4em;--main-padding-bottom:3rem;--body-font-size:1.3125rem;--body-line-height:1.6;--caption-padding:calc(0.25 * var(--main-padding));--header-top-gap:2rem;--header-bottom-gap:3rem;--header-menu-side-gap:0.5rem;--header-menu-top-gap:1rem;--gradient-shadow:linear-gradient(
45deg,
#fb0094,
#0000ff,
#00ff00,
#ffff00,
#ff0000,
#fb0094,
#0000ff,
#00ff00,
#ffff00,
#ff0000
);--font-body:"Literata", Georgia, Cambria, "Noto Serif", "Droif Serif",
ui-serif, serif;--font-mono:ui-monospace, monospace, Menlo, Consolas, Monaco,
Liberation Mono, Lucida Console;--h1-margin-top:2rem;--h1-margin-bottom:1.5rem;--h2-margin-top:2rem;--h2-margin-bottom:1.5rem;--hx-margin-top:1.5rem;--hx-margin-bottom:1rem;--p-margin-top:1rem;--p-margin-bottom:1rem;--code-margin-top:2rem;--code-margin-bottom:2rem;--h1-font-size:2em;--h2-font-size:1.5em;--hx-font-size:1.3em;--p-font-size:1em;--p-line-height:1.6;--caption-font-size:0.8em;--li-indent:0.75em;--ul-margin-top:1rem;--ul-margin-bottom:1rem;--li-checkbox-size:0.8em;--toc-margin-top:2rem;--toc-margin-bottom:3rem;--code-padding:1.5rem;--code-border-radius:6px;--copy-code-button-border-radius:7px;--code-panel-background:rgb(40, 42, 44);--social-icons-bottom-margin:3rem;--footer-height:3rem;--content-height:calc(100vh - var(--footer-height));--figure-img-max-height:800px;--table-cell-padding:0.5rem;--table-margin-top:1rem;--table-margin-bottom:1rem}@media screen and (max-width:640px){:root{--header-top-gap:1rem;--social-icons-bottom-margin:0rem;--caption-padding:calc(2 * var(--main-padding))}}@font-face{font-family:literata;src:url(/fonts/Literata/Literata-Light.woff2)format("woff2");font-weight:light;font-style:normal;font-display:swap}@font-face{font-family:literata;src:url(/fonts/Literata/Literata-LightItalic.woff2)format("woff2");font-weight:light;font-style:italic;font-display:swap}@font-face{font-family:literata;src:url(/fonts/Literata/Literata-SemiBold.woff2)format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:literata;src:url(/fonts/Literata/Literata-SemiBoldItalic.woff2)format("woff2");font-weight:700;font-style:italic;font-display:swap}html{scroll-behavior:smooth}body{font-family:var(--font-body);margin:auto;max-width:var(--main-width);padding-left:0;padding-right:0;color:var(--content-primary);background:var(--background);font-variant:no-common-ligatures proportional-nums;font-size:1rem;line-height:var(--body-line-height)}.main.home{padding-left:1rem;padding-right:1rem}@media(min-width:480px){body{font-size:var(--body-font-size);padding-left:var(--main-padding);padding-right:var(--main-padding)}.main.home{padding:0}}.content{min-height:var(--content-height) !important}.text-muted{font-size:small;font-style:italic}::target-text{background-color:#ffb500}*:focus-visible,input:focus-visible,button:focus-visible,[type=submit]:focus-visible{outline:2px dashed var(--focus);outline-offset:3px}input:focus-visible{outline-style:solid;outline-width:3px;outline-offset:0}h1{margin-top:var(--h1-margin-top);margin-bottom:var(--h1-margin-bottom);font-size:var(--h1-font-size)}h2{margin-top:var(--h2-margin-top);margin-bottom:var(--h2-margin-bottom);font-size:var(--h2-font-size)}h3,h4,h5,h6{font-size:var(--hx-font-size);margin-top:var(--hx-margin-top);margin-bottom:var(--hx-margin-bottom)}kbd{font-size:.6em;vertical-align:bottom;color:#444;line-height:2.5;padding:.2em .5em;margin:.15em;background-color:#e5e5e5;border-radius:4px;border-top:solid .1em #ccc;border-right:solid .2em #aaa;border-bottom:solid .3em #999;border-left:solid .2em #bbb;font-family:var(--font-mono);-webkit-touch-callout:none;user-select:none;white-space:nowrap}.heading{.anchor { text-decoration: none; font-weight: normal; color: var(--content-secondary); visibility: hidden; font-size: 0.75em; font-family: var(--font-mono); margin-left: 0.5rem; } &:hover .anchor { visibility: visible; }}@media(hover:none){.heading{.anchor { visibility: visible; }}}p{margin-top:var(--p-margin-top);margin-bottom:var(--p-margin-bottom);margin:.5lh 0;font-size:var(--p-font-size);line-height:var(--p-line-height)}ul{margin:.5lh 0}li+li{margin-top:.25lh}li{margin-left:var(--li-indent);&:has(> input[type="checkbox"]) { list-style-type:none; } & > input[type="checkbox"] { width:var(--li-checkbox-size); height:var(--li-checkbox-size); margin:0 0.2em 0.15em -0.25em; vertical-align:middle; }}a{text-decoration:underline;border-radius:6px}a,button{touch-action:manipulation}input{.dark & { color-scheme: dark; }}abbr{font-variant-caps:small-caps}.emoji{position:relative;border-radius:6px;display:inline;vertical-align:baseline;padding:0;margin:0}.emoji:focus:after,.emoji:hover:after{content:attr(aria-label);position:absolute;display:block;z-index:1;bottom:100%;left:0;font-family:var(--font-mono);font-weight:400;padding:.6em .75em .5em;border-radius:.5em;box-shadow:0 0 .2em rgba(0,0,0,.5);background-color:rgba(0,0,0,.85);color:#fff;text-align:center;font-size:.8rem;opacity:0;animation:fadeIn .1s ease-out .3s 1 forwards;white-space:nowrap}@media print{.emoji:after{content:" (" attr(aria-label)") ";font-size:.75em;font-weight:400}}@media(prefers-reduced-motion){.emoji:focus:after,.emoji:hover:after{animation:fadeIn 0s ease-out 0s 1 forwards}}@keyframes fadeIn{from{bottom:-.5em;opacity:0}to{bottom:100%;opacity:1}}.copy-code-button{background-color:var(--background);color:var(--content-primary);font-family:var(--font-mono);padding:3px 6px;font-size:.8em;border-radius:var(--copy-code-button-border-radius);position:absolute;top:6px;right:6px;z-index:1;display:none;border:1px solid var(--code-border)}.highlight:hover .copy-code-button{display:block}.highlight,pre.mermaid,div.goat.svg-container{position:relative;border-top:1px solid var(--code-border);border-bottom:1px solid var(--code-border);margin-top:var(--code-margin-top);margin-bottom:var(--code-margin-bottom);background-color:var(--code-background) !important;line-height:1.3;overflow:hidden;svg text { font-family: var(--font-mono) !important; font-size: 13px !important; } &.highlight-console { background-color: var(--code-panel-background) !important; color: rgb(248, 248, 248); border-color: rgb(0, 2, 4); line-height: 1; pre { background-color: var(--code-panel-background) !important; -moz-tab-size: 2; -o-tab-size: 2; tab-size: 2; } table.console_grid, table.console_grid tr, table.console_grid td, table.console_grid th { color: #999; border-inline: 1px solid #999; background: transparent; text-align: center; } table.console_grid_3d, table.console_grid_3d tr, table.console_grid_3d td, table.console_grid_3d th { border-block: 1px solid #999; } table.console_grid thead td { text-align: center; } .console-add, .console-del { display: inline-block !important; width: 100%; background: #1e4839; color: #b9e0d3; } .console-del { background: #4c232d; color: #e8b9b8; } } table { display: table; border-collapse: collapse; border: 0 !important; } pre { margin: 0.5rem 0.75rem; } table pre { display: grid; margin: 0.5rem 0; } table tr td:first-child code > span, table tr td:first-child code details > span { padding-left: 0.75rem !important; } table tr td:first-child code > span > span { padding-left: 0 !important; } tbody tr { border: none; } > div { background-color: var(--code-background) !important; overflow: scroll; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; } > pre { overflow-y: hidden; overflow-x: auto; } .diff-add { background: #e6ffed; } .diff-del { background: #ffeef0; } &[data-file] { position: relative; padding-top: 1.5em; &:after { content: attr(data-file); position: absolute; top: 0; left: 0; font-size: 0.75em; line-height: 1; white-space: nowrap; background: var(--code-border); padding: 0.5em 0.5em 0.75em 0.5em; border-bottom-right-radius: var(--code-border-radius); } }}@media(min-width:480px){.highlight,pre.mermaid,div.goat.svg-container{border-radius:var(--code-border-radius);border:1px solid var(--code-border)}}pre{background-color:var(--code-background) !important;font-family:var(--font-mono);code > span { padding-top: 6px; padding-bottom: 4px; vertical-align: baseline; } .language-console { > span { padding-top: 0; padding-bottom: 0; } } code > span[style="background-color:#e1e1e1"], code > span[style="display:flex; background-color:#e1e1e1"] { background-color: rgba(40, 96, 225, 0.1) !important; } code > span[style="display:flex; background-color:#e1e1e1"], .diff-add, .diff-del { padding-right: 6px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; }}pre::-webkit-scrollbar{display:none}code{-webkit-font-smoothing:antialiased;font-family:var(--font-mono);font-size:.76em;span { display: inline !important; }}li code,table code,p code{background-color:var(--code-background);border-radius:3px}:not(pre)>code{padding:2px 6px 1px;border:1px solid var(--content-primary);border-radius:3px;vertical-align:baseline;white-space:nowrap;margin-right:.2em}.code-folding-summary-code{color:#888;cursor:pointer;font-size:small;padding:3px 0}.code-folding-summary-linenumbers{color:transparent;font-size:small;padding:3px 0;visibility:hidden}.console-line{font-family:var(--font-mono);font-size:.75em;letter-spacing:0}.katex-display{overflow-x:auto;overflow-y:hidden;-ms-overflow-style:none;scrollbar-width:none}.katex-display::-webkit-scrollbar{display:none}.footnotes{margin-top:3rem;border-style:none}hr{border:none;height:1px;background:var(--content-secondary);margin-top:2rem;margin-bottom:2rem}.header{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:end;justify-items:end;padding-top:var(--header-top-gap);padding-left:1rem;padding-right:1rem;margin-bottom:var(--header-bottom-gap);p { font-size: small; font-family: var(--font-mono); margin-top: var(--header-menu-top-gap); margin-right: var(--header-menu-side-gap); }}@media(min-width:480px){.header{padding-left:0;padding-right:0}}.header-title{font-size:5.85rem;font-weight:900;margin-bottom:0;margin-top:0;margin-left:-.6rem;a { text-decoration: none; text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.4), 0px 8px 13px rgba(0, 0, 0, 0.1), 0px 18px 23px rgba(0, 0, 0, 0.1), 0px 0px #555, 1px 0px #555, 2px 1px #555, 3px 1px #555, 4px 2px #555, 5px 2px #555; } span { display: block; font-family: var(--font-mono); font-size: small; font-weight: 100; margin-top: -0.45rem; margin-left: 0.55rem; text-shadow: none; }}.header-nav{ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 1rem; } li { margin: 0; }}footer{font-size:small;display:flex;justify-content:center;align-items:center;max-height:var(--footer-height);a { font-family: var(--font-mono); margin-left: 0.2rem; margin-right: 0.2rem; }}.posts-heading{font-size:2.55rem}.post-line{list-style:none;margin:0 0 1rem;padding:0;align-items:baseline;article { display: flex; align-items: baseline; } p { margin-top: 0rem; margin-bottom: 0rem; }}.author{display:none}.tag-line{margin-bottom:.5rem;display:flex;align-items:baseline}.line-date{font-size:small;font-family:var(--font-mono);min-width:120px;max-width:120px;text-align:right;padding-right:1rem;margin-top:0;margin-bottom:0}.line-title{margin:0;font-size:1em;font-weight:400}.tag-title{margin:0}.line-summary{font-size:small;margin-top:.2rem !important;color:var(--content-secondary)}.list-container{padding-bottom:3rem}.pagination{display:flex;align-items:center;margin-top:1rem;margin-bottom:0;justify-content:center}.pagination-control{min-width:3rem;margin-left:.5rem;margin-right:.5rem;text-align:center;align-items:center}.page-number{min-width:3rem;margin-left:.5rem;margin-right:.5rem;display:flex;align-items:center;justify-content:center;align-items:center;font-weight:700}.social-icons{padding:12px 0;margin-bottom:var(--social-icons-bottom-margin);a { text-decoration: none; border-radius: 100%; line-height: 0; display: inline-block; } a:not(:last-of-type) { margin-inline-end: 12px; } a svg { height: 20px; width: 20px; }}.single-intro-container{margin-top:1rem;margin-bottom:2rem;padding-left:1rem;padding-right:1rem}.single-title{font-size:2.5rem;margin-bottom:.5rem}@media(min-width:480px){.single-intro-container{padding-left:0;padding-right:0}.single-title{font-size:3rem;text-shadow:var(--background).02em 0 0,var(--background)0 .02em 0,var(--background)-.02em 0 0,var(--background)0 -.02em 0,var(--content-primary).06em 0 0,var(--content-primary).06em .06em 0,var(--content-primary)0 .06em 0,var(--content-primary)-.06em .06em 0,var(--content-primary)-.06em 0 0,var(--content-primary)-.06em -.06em 0,var(--content-primary)0 -.06em 0,var(--content-primary).06em -.06em 0,var(--background).08em 0 0,var(--background).08em .08em 0,var(--background)0 .08em 0,var(--background)-.08em .08em 0,var(--background)-.08em 0 0,var(--background)-.08em -.08em 0,var(--background)0 -.08em 0,var(--background).08em -.08em 0}}@media(min-width:856px){.single-title{font-size:4rem}}.single-readtime{list-style:none;font-size:small;margin-top:1.5rem;color:var(--content-secondary);li { display: inline-block; margin: 0; } li + li::before { content: "•"; margin: 0 0.5rem; }}.single-summary{font-size:1.5rem;margin-bottom:0;color:var(--content-secondary)}.single-content{margin-bottom:5rem;h1, h2, h3, h4, h5, h6, p { padding-left: 1rem; padding-right: 1rem; } ul { position: relative; list-style: none; } li:before { position: absolute; content: "\00B7"; left: 0; }}.single-tags{display:block;gap:1rem;list-style:none;margin:-1rem 0 0;padding:0 1em;li { display: inline-block; margin: 0 0.5rem 0 0; font-size: small; } span { margin-right: 0.3rem; }}@media(min-width:480px){.single-tags{padding-left:0;padding-right:0}.single-content{h1, h2, h3, h4, h5, h6, p { padding-left: 0; padding-right: 0; }}}.single-pagination{margin-top:3rem;margin-bottom:3rem;a { margin-left: 0.4rem; margin-right: 0.4rem; } hr { margin: 0; } .single-pagination-text { display: flex; justify-content: center; align-items: center; min-height: 100%; } .single-pagination-prev { min-width: 50%; margin-top: 1rem; margin-bottom: 1rem; text-align: right; } .single-pagination-next { min-width: 50%; margin-top: 1rem; margin-bottom: 1rem; text-align: left; } .single-pagination-container-next { display: flex; min-height: 100%; padding: 0.5rem; } .single-pagination-container-prev { display: flex; min-height: 100%; padding: 0.5rem; float: right; } .single-pagination-date { display: block; font-size: small; }}.toc{font-size:var(--p-font-size);line-height:calc(.9 * var(--p-line-height));margin-top:var(--toc-margin-top);margin-bottom:var(--toc-margin-top);padding-left:1rem;padding-right:1rem;&[open] { margin-bottom: var(--toc-margin-bottom); } summary { margin-bottom: 0.5rem; } ul { margin-top: 0.1rem; margin-bottom: 0.1rem; } li { margin-top: 0.1rem; margin-bottom: 0.1rem; }}@media(min-width:480px){.toc{padding-left:0;padding-right:0}}summary{cursor:pointer;border-radius:3px}@supports(interpolate-size:allow-keywords){:root{interpolate-size:allow-keywords}}[open]::details-content{height:auto}::details-content{transition:height .5s ease,content-visibility .5s ease allow-discrete;height:0;overflow:clip}@keyframes animateDown{0%{opacity:0;transform:translatey(-15px)}100%{opacity:1;transform:translatey(0)}}.autonumber{counter-reset:h2-counter 0;h2 { counter-increment: h2-counter 1; counter-reset: h3-counter 0; } h3 { counter-increment: h3-counter 1; counter-reset: h4-counter 0; } h4 { counter-increment: h4-counter 1; } h2:before { content: counter(h2-counter) "\00a0\00a0"; } h3:before { content: counter(h2-counter) "." counter(h3-counter) "\00a0\00a0"; } h4:before { content: counter(h2-counter) "." counter(h3-counter) "." counter(h4-counter) "\00a0\00a0"; }}figure{display:block;margin-top:1rem;.img-container { display: flex; align-items: center; aspect-ratio: var(--w) / var(--h); max-height: var(--figure-img-max-height); width: auto; justify-content: center; } img { display: block; max-width: 100%; height: auto; }}.dark .img-light{display:none !important}.light .img-dark{display:none !important}figure.img-left{.img-container, figcaption { justify-content: start; }}.img-small{img& { max-height: calc(var(--h) / 2); max-width: calc(var(--w) / 2); } .img-container { display: flex; align-items: center; justify-content: center; } img { max-height: calc(var(--h) / 2); max-width: calc(var(--w) / 2); } .img-container { margin: auto 0; } &.img-center .img-container { margin-left: auto; margin-right: auto; justify-content: center; }}.img-lineheight{img& { max-height: 1em; } img { max-height: 1em; width: auto; }}.img-inline{img& { display: inline-block; }}.img-full{div { display: flex; align-items: center; justify-content: center; } img { height: auto; width: 100vw !important; max-width: 100vw !important; }}.caption-container{color:var(--content-secondary);padding-left:var(--caption-padding);padding-right:var(--caption-padding);font-size:var(--caption-font-size);margin-top:1rem;margin-bottom:1rem}figcaption{display:flex;justify-content:center}.header-img-wrapper{height:220px;.header-img { position: absolute; left: 0; right: 0; height: 220px; background-size: cover; background-position: center; }}.error{display:flex;align-items:center;justify-content:center;padding-bottom:5rem;div { text-align: center; h1 { font-family: var(--font-mono); font-weight: 100; font-size: clamp(1rem, 36vw, 20rem); margin: 6rem 0 -3rem 0; &.error-code-words { font-size: clamp(1rem, 36vw, 15rem); letter-spacing: -1.5rem; } } }}.breadcrumbs{display:flex;flex-wrap:wrap;gap:2px;font-size:small;margin-bottom:calc(-.5 * var(--h1-margin-top));font-family:var(--font-mono);padding-left:1rem;padding-right:1rem;.breadcrumbs-separator { margin: 0 0.25rem; }}@media(min-width:480px){.breadcrumbs{padding-left:0;padding-right:0}}.giscus{margin-top:3rem}.back-to-top{text-align:center;font-family:var(--font-mono);font-size:small;margin-bottom:2rem}.table-outer{width:100%;overflow-x:auto;margin-top:var(--table-margin-top);margin-bottom:var(--table-margin-bottom)}table{border-collapse:collapse;font-size:var(--p-font-size);line-height:var(--p-line-height);color:var(--content-primary);width:fit-content;border:1px solid var(--code-border);border-radius:var(--code-border-radius)}th,td{padding:var(--table-cell-padding);text-align:left}th{background-color:var(--code-background);font-weight:700}tbody tr{border-top:1px solid var(--code-border)}blockquote{margin:1.5rem 0;border-left:solid 2px;font-size:.75em;p { margin-left: 1rem; margin-right: 1rem; }}.callout{position:relative;border:3px solid var(--content-secondary);padding:1rem;&.callout-note { border-style: dotted; border-width: 2px; margin: 2.5rem 0; } &.callout-callout, &.callout-tip { background: var(--background); border: none; margin: 2.5rem 0; &::before, &::after { content: ""; position: absolute; top: -2px; left: -2px; background: var(--gradient-shadow); background-size: 400%; width: calc(100% + 2px); height: calc(100% + 4px); border-radius: var(--code-border-radius); z-index: -1; animation: shine 40s linear infinite; } &::after { filter: blur(10px); } .callout-heading { font-size: 2rem; background-size: 40% auto; animation-duration: 40s; } } &.callout-callout { font-size: 1em; } &.callout-important { box-shadow: 0.8em 0.8em 0 0 var(--content-secondary); margin-bottom: 2.5rem; } &.callout-warning { border-color: #f0ba22; box-shadow: 0.8em 0.8em 0 0 #f0ba22; margin-bottom: 2.5rem; } &.callout-caution { border-color: red; box-shadow: 0.8em 0.8em 0 0 red; margin-bottom: 2.5rem; } p { margin: 0; } p + p { margin-top: 0.5rem; } .callout-heading { font-weight: 900; font-style: italic; font-size: 1.2em; margin-top: -0.4em; color: var(--content-secondary); }}@media(min-width:480px){.callout{border-radius:var(--code-border-radius);&.callout-callout, &.callout-tip { &::before, &::after { width: calc(100% + 4px); } }}}@media(prefers-reduced-motion){blockquote.callout.callout-callout,blockquote.callout.callout-tip{&::before,&::after { animation:none; }}}@keyframes shine{0%{background-position:0 0}50%{background-position:300% 0}100%{background-position:0 0}}figure.blockquote{position:relative;border:dashed 1px var(--content-secondary);&::before,&::after { content:""; position:absolute; top:-2px; right:20%; bottom:-2px; left:20%; background-color:var(--background); } &::after { top:20%; right:-2px; bottom:20%; left:-2px; } blockquote,.blockquote-caption { position:relative; z-index:1; } blockquote { border:none; margin:0; font-size:1em; } .blockquote-caption { display:block; margin:0 1em 1em 1em; text-align:right; font-style:italic; }}.ribbon{position:absolute;top:1rem;right:1.5rem;width:6rem;height:6rem;transform:rotate(31deg);img { opacity: 0.5; }}@media(min-width:640px){.ribbon{width:7.5rem;height:7.5rem}}:root{--content-primary:rgb(24, 26, 28);--content-secondary:rgb(86, 88, 90);--focus:#ff0000;--background:rgb(250, 248, 246);--code-background:rgb(255, 253, 251);--code-border:rgb(200, 202, 204)}.dark{--content-primary:rgb(248, 248, 248);--content-secondary:rgb(184, 184, 184);--background:rgb(24, 24, 24);--code-background:rgb(40, 40, 40);--code-border:rgb(56, 56, 56)}.flex{display:flex;flex-wrap:wrap}.flexnowrap{display:flex;flex-wrap:nowrap}.bold{font-weight:700}.italic{font-style:italic}.small{font-size:medium}.monospace{font-family:var(--font-mono)}.rainbow{background:var(--gradient-shadow);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-fill-color:transparent;background-size:400%;animation:shine 20s linear infinite;-webkit-text-stroke:.07em transparent;font-weight:900}@media(prefers-reduced-motion){.rainbow{animation:none}}