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: #535862;--emphasis-color: #181d27;--main-font: "Helvetica Neue";--code-font: "IBM Plex Mono";--base-font: var(--main-font), Helvetica, Arial, "PingFang SC", "Microsoft Yahei", Sans-Serif}body{background:var(--bg-color);color:var(--text-color);text-align:left;text-autospace:normal;font:62.5%/1.8 var(--base-font);-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.5em}h4{font-size:1.2em}h5{font-weight:600;font-size:.85em}p,pre,ul,ol,dl,form,figure,hr{margin:1.5em 0}em{padding:0 .2em}a:link,a:visited,a:active{color:#555;text-decoration:none}a:hover{color:var(--main-color)}a{transition:all .3s ease-out}blockquote{padding:0 calc(1em - 2px);margin-left:-1em;color:#888;border-left:2px solid var(--emphasis-color);font-family:source-serif-pro,Georgia,Cambria,Times New Roman,Times,"Source Han Serif SC",Songti SC,"Noto Serif SC",SimSun,STSong,serif;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),Monospace,"Courier New","PingFang SC",Serif;line-height:1.8;border-radius:4px;background:#fbfbfb}pre{overflow-x:auto;padding:30px 0;white-space:pre;font-size:.8em;tab-size:2;text-align:left;border:1px solid var(--line-color)}:not(pre)>code{color:var(--emphasis-color);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}@view-transition{navigation:auto}#toolbar{position:fixed;top:0;left:0;z-index:2;padding-top:60px;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;padding:20px 0}#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 a svg{width:22px;height:22px;transition:all .3s ease-out;color:#666}#toolbar li a:hover svg{color:var(--main-color)}#toolbar li.home a img{width:52px;height:52px;border-radius:50%}main{margin:0 auto;padding:0 0 0 180px;width:780px;font-size:1.6em}header{margin:80px 0 0}header h1#blogtitle{letter-spacing:0;font-size:3em;font-weight:400}header h1#articletitle{font-size:3em;font-weight:500;text-wrap:pretty}header p#description{font-family:var(--code-font),monospace;padding:0;color:#ccc}header .article-meta{margin:2em 0 0;padding:1em 0 0;color:#888;position:relative}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:all .3s ease-out;transform:translate(0);will-change:transform}#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)}#articles ol li:hover{transform:translate(-30px)}#articles ol li:hover h2 time{color:var(--text-color)}#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)}.post a{color:var(--emphasis-color);text-decoration:underline}.post a:hover{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;width:2rem;margin-right:1.25rem;display:inline-block;margin-left:auto;text-align:right;position:sticky;left:0;z-index:1;padding-right:.25rem;background:#fbfbfb}&:hover,&:hover:before{background:#f0f0f0}}.post pre code span.highlighted{background:#f0f0f0;&:before{background:#f0f0f0;color:--var(emphasis-color)}}.post :is(ul,ol,dl){margin:1.5em 0 1.5em 2.5em}.post ul li{margin:0 0 .6em;list-style-type:circle}.post ol li{margin:0 0 .6em;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 1em 2em}.post figure{margin:3em 0}.post figcaption{margin:1.5em 0 3em;text-align:center;font:.8em var(--code-font),monospace;& 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:2.4em 0 .6em;padding:0 0 .4em;border-bottom:1px solid var(--line-color)}.post h4+p{padding-top:.25em}@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}& 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) a{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.4em;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}.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.5em 0 1.5em 2em}.post dl{margin:1.5em 0 1.5em 1em}.post table thead th,.post table tbody td{padding:0 10px}}
