html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,dialog,figure,footer,header,hgroup,menu,nav,section,time,mark,audio,video{margin:0;padding:0;outline:0;border:0;background:transparent;vertical-align:baseline;font-size:100%}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}a:active{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-spacing:0;border-collapse:collapse}article,aside,dialog,figure,figcaption,footer,header,hgroup,nav,section{display:block}.clearfix{display:flow-root}:root{--main-color: #fef200;--bg-color: #fff;--line-color: #eee;--text-color: #464646;--emphasis-color: #181d27;--base-font: system-ui, Sans-Serif;--code-font: "JetBrains Mono", system-ui, Monospace;--quote-font: Georgia, system-ui, Serif;--ease-out-quart: cubic-bezier(.25, 1, .5, 1);--ease-out-expo: cubic-bezier(.16, 1, .3, 1)}body{background:var(--bg-color);color:var(--text-color);text-align:left;font:62.5%/1.8 var(--base-font);text-autospace:normal;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{color:var(--emphasis-color)}h2,h3,h4,h5{margin:.5em 0;font-weight:400;line-height:1.2}h1{font-size:2em}h2{font-size:1.875em}h3{font-size:1.4em}h4{font-size:1.2em}h5{font-weight:600;font-size:.85em}p,pre,ul,ol,dl,form,figure,hr{margin:1.3em 0}em{font-family:var(--quote-font)}a:link,a:visited,a:active{color:#555;text-decoration:none;transition:color .2s var(--ease-out-quart)}a:hover{color:var(--main-color);transition:color .15s var(--ease-out-quart)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}blockquote{padding:0 calc(1em - 2px);margin-left:-1em;color:#888;border-left:2px solid var(--emphasis-color);font-family:var(--quote-font);font-style:italic}acronym,abbr{font-family:var(--code-font);cursor:help}cite{font-style:normal}mark{background:#fffddd}pre,code{font-family:var(--code-font);line-height:1.8;border-radius:4px}pre{overflow-x:auto;padding:30px 0;white-space:pre;font-size:.75em;tab-size:2;text-align:left;border:1px solid var(--line-color)}:not(pre)>code{color:var(--emphasis-color);background:#fbfbfb;white-space:break-spaces;font-weight:500;font-size:.8em}:not(pre)>code:before,:not(pre)>code:after{content:"'"}input,textarea,select{background-color:var(--bg-color);box-sizing:border-box;color:var(--text-color);font:1em var(--base-font)}textarea{resize:vertical}input:focus,textarea:focus{outline:0;outline-offset:0}input:focus::placeholder,textarea:focus::placeholder{text-indent:-9999em}img{background:var(--bg-color)}small{font-size:smaller}sup{vertical-align:super}sub{vertical-align:sub}.center{text-align:center}::placeholder{color:#ccc}::selection{background:var(--main-color);color:#000;text-shadow:none}#toolbar{position:fixed;top:0;left:0;z-index:2;padding-top:90px;width:76px;height:100%;border:4px solid var(--main-color);border-width:0 0 0 4px;background:#fffc;backdrop-filter:blur(5px)}#toolbar ul{position:relative}#toolbar ul:after{position:absolute;top:0;right:-1px;width:1px;height:100%;background:linear-gradient(to bottom,#fff,#ccc 50%,#fff);content:" ";text-indent:-9999em}#toolbar li a{display:block;text-align:center;line-height:5em}#toolbar li{display:grid}#toolbar li a svg{width:22px;height:22px;transition:color .2s var(--ease-out-quart),transform .15s var(--ease-out-quart);color:#666}#toolbar li a:hover svg{color:var(--main-color);transform:scale(1.1)}#toolbar li.home a img{width:52px;height:52px;border-radius:30%;corner-shape:squircle;transition:transform .3s var(--ease-out-expo)}#toolbar li.home a:hover img{transform:scale(1.05) rotate(2deg)}main{margin:0 auto;padding:0 0 0 180px;width:780px;font-size:1.6em}header{margin:80px 0 0;animation:fadeInDown .6s var(--ease-out-expo)}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}header h1#blogtitle{letter-spacing:0;font-size:3em;font-weight:400;animation:fadeInLeft .7s var(--ease-out-expo) .1s both}header h1#articletitle{font-size:3em;font-weight:500;text-wrap:pretty;animation:fadeInLeft .7s var(--ease-out-expo) .1s both}@keyframes fadeInLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}header p#description{font-family:var(--code-font);padding:0;color:#ccc;animation:slideInUp .35s var(--ease-out-expo) 0s both;will-change:transform}@keyframes slideInUp{0%{transform:translateY(6px)}to{transform:translateY(0)}}header .article-meta{margin:2em 0 0;padding:1em 0 0;color:#888;position:relative;animation:fadeIn .8s var(--ease-out-expo) .3s both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}header .article-meta:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(to right,var(--line-color) 0%,#fff 35%)}#articles{margin:50px 0 50px -180px}#articles ol li{margin:1.875em 0;transition:transform .4s var(--ease-out-expo),opacity .3s ease-out;transform:translate(0);will-change:transform;opacity:1;animation:slideInLeft .5s var(--ease-out-expo) both}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}#articles ol li h2{display:flex;font-weight:400;font-size:1.6em}#articles ol li h2 time{padding:0 0 0 40px;width:140px;color:var(--line-color);font-variant-numeric:tabular-nums}#articles ol li:hover{transform:translate(-30px)}#articles ol li:hover h2 time{color:var(--text-color);transition:color .2s var(--ease-out-quart)}#content{margin:60px 0 0}#content .post{font-size:1.125em}footer{margin:80px 0;width:780px;text-align:right}footer h3{margin:0 0 2em;color:#888;letter-spacing:2px;font-size:1em;text-transform:uppercase}#think-yellow{margin:0 0 20px}.tnkylw{position:relative;display:inline-block;margin:23.09px 0;width:80px;height:46.19px;background:var(--main-color);color:#000;text-align:center;line-height:46.19px}.tnkylw:before,.tnkylw:after{position:absolute;width:0;border-right:40px solid transparent;border-left:40px solid transparent;content:" "}.tnkylw:before{bottom:100%;left:0;border-bottom:23.09px solid var(--main-color)}.tnkylw:after{top:100%;left:0;width:0;border-top:23.09px solid var(--main-color)}.tnkylw object{width:48px;height:48px}section.archives p{margin-left:180px}section.archives h3{margin:80px 0 0 180px;letter-spacing:2px;font-size:1em}section.archives h3 a{color:#888}.post strong{color:var(--emphasis-color);transition:color .15s ease-out}.post a{color:var(--emphasis-color);text-decoration:underline;text-underline-offset:2px;transition:color .2s ease-out,text-decoration-color .2s ease-out}.post a:hover{color:var(--main-color);text-decoration-color:var(--main-color)}.post :not(figcaption)>a[href^=http]:not(:has(img)):after{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16' style='align-self:flex-end'%3E%3Cpath stroke='%23333' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6.25 3.75h6m0 0v6m0-6-8.5 8.5'%3E%3C/path%3E%3C/svg%3E");width:16px;height:16px;display:inline-block}.post pre code{counter-reset:step;counter-increment:step 0;padding:0;font-weight:400;width:fit-content;min-width:100%;display:block}.post pre code span.line{display:inline-block;width:100%;&:before{content:counter(step);counter-increment:step;color:#ddd;background:#fff;width:2rem;margin-right:1rem;display:inline-block;margin-left:auto;text-align:right;position:sticky;left:0;z-index:1;padding-right:.25rem}&:hover,&:hover:before{background:#f0f0f0}}.post pre code span.highlighted{background:#f0f0f0;&:before{background:#f0f0f0;color:--var(emphasis-color)}}.post pre{position:relative}.post pre .copy-button{position:absolute;top:8px;right:8px;border:1px solid var(--line-color);background:#fffffff2;color:var(--emphasis-color);padding:6px 10px;border-radius:6px;cursor:pointer;line-height:1;display:inline-flex;align-items:center;justify-content:center;opacity:0;transform:translateY(-4px);transition:opacity .2s ease-out,transform .2s ease-out,background-color .15s ease-out;backdrop-filter:blur(4px);font-size:.75em}.post pre:hover .copy-button{opacity:.7;transform:translateY(0)}.post pre .copy-button:hover{opacity:1;background:#fff;transform:scale(1.05)}.post pre .copy-button:focus-visible{outline:2px solid var(--emphasis-color);outline-offset:2px;opacity:1}.post pre .copy-button.copied{opacity:1;background:#f5f5f5;transform:scale(1)}.post :is(ul,ol,dl){margin:1.25em 0 1.25em 2.2em}.post ul li{margin:0 0 .5em;list-style-type:circle}.post ol li{margin:0 0 .5em;list-style-type:decimal}.post dl dt{display:inline;float:left;padding:0 .5em 0 0;font-weight:700}.post dl dd{margin:0 0 .8em 1.8em}.post figure{margin:2.5em 0}.post figcaption{margin:1.2em 0 2.5em;text-align:center;font:.8em var(--code-font);& p:first-child:after{content:" ↑"}}.post img,.post video{display:block;margin:0 auto;border-radius:5px;max-width:100%;height:auto;&:is(.floatleft){float:left;margin:5px 20px 20px-80px}&:is(.floatright){float:right;margin:5px -80px 20px 10px}&:is(.borderless){margin:0;padding:0;border:0}&:is(.wide){width:calc(100% + 100px);height:auto}&:is(.no-margin){margin:0}}.post p:has(img.wide){margin:0 -50px}.post h3{margin:2em 0 .6em;padding:0 0 .45em}.post h4+p{padding-top:.2em}@media screen and (min-width:1140px){.post h4{float:left;margin-left:-180px;width:160px;text-align:left;text-wrap:balance}}@media screen and (max-width:540px){header h1#articletitle{font-size:3em}}.post table{margin:1.5em auto;font-size:.8em;& caption{background:#888;color:#fff;text-align:center;text-transform:uppercase;letter-spacing:1px;font-weight:600}}.post :is(table th,table td){padding:5px 10px;border:1px solid var(--line-color)}.post table th{background:#fbfbfb}.post table thead th{background:#f1f1f1}@media screen and (max-width:1050px){#toolbar,#articles,#content,section.archives h3,#articles ol li h2 time,#articles ol li h2 a,footer,#copyright{width:100%}#articles,#content,section.archives h3{margin:40px 0 0}#articles,section.archives p{margin-left:0}#toolbar{position:fixed;top:0;left:0;padding:0;height:36px;border-width:4px 0 0 0;& ul{margin:0;padding:2px 10px;&:after{top:35px;left:0;width:100%;height:1px;background:linear-gradient(to right,#fff,#ccc 50%,#fff)}& li{display:inline-grid}& li a{display:inline-block;padding:0 10px;line-height:40px}& li a svg,li.home a img{width:20px;height:20px}& li:is(.next,.prev){float:right}}}main{margin:0 auto;padding:0 20px;max-width:960px;width:auto}header h1#articletitle{font-size:2em}#articles ol li:hover{transform:translate(0)}#articles ol li h2{font-size:1.3em;flex-direction:column}#articles ol li h2 time,#articles ol li h2 a{padding:0;text-align:left}footer{margin:40px 0;text-align:left;animation:none}.post h3{font-size:1.3em}.post pre{-webkit-text-size-adjust:100%}.post img,.post img:is(.floatleft,.floatright,.wide),.post video{display:block;float:none;margin:0;max-width:100%;height:auto}.post p:has(img.wide){margin:0}.post ul,.post ol{margin:1.25em 0 1.25em 1.8em}.post dl{margin:1.25em 0 1.25em 1em}.post table thead th,.post table tbody td{padding:0 10px}}@view-transition{navigation:auto}
