:root{--primary:21 128 61;--green-50:231 242 235;--green-100:208 229 216;--green-600:16 102 48;--green-700:12 76 36;--green-800:8 51 24;--secondary:234 179 8;--yellow-50:252 247 230;--yellow-100:250 239 205;--yellow-700:140, 107, 4;--yellow-800:93, 71, 3;--gray-100:243 244 246;--gray-200:229 231 235;--gray-700:55 65 81;--white:255 255 255;--black:0 0 0;--red:239 68 68;--spacing-4:1rem;--spacing-2:0.5rem;--spacing-1:0.25rem;--spacing-6:1.5rem;--spacing-8:2rem;--spacing-12:3rem;--spacing-16:4rem;--spacing-24:6rem;--spacing-48:12rem;--spacing-72:18rem;--spacing-default:var(--spacing-4);--font-base:1rem;--font-lg:1.125rem;--font-sm:0.875rem;--shadow-sm:0 4px 6px rgba(0, 0, 0, 0.1);--shadow-lg:0 6px 12px rgba(0, 0, 0, 0.15);--rotate:2deg;--border:repeating-linear-gradient(
    to right,
    rgb(var(--secondary)) 0 6px,
    transparent 6px 12px
  );--border-width:2px;--border-radius:0.75rem;--container-width-max:96rem;--container-width-small:56rem;--container-width-tiny:42rem;--container-width-medium:64rem}[data-theme=dark]{--primary:21 128 61;--green-50:231 242 235;--green-100:208 229 216;--green-800:8 51 24;--secondary:234 179 8;--yellow-50:252 247 230;--yellow-100:250 239 205;--gray-100:243 244 246;--gray-200:229 231 235;--white:0 0 0;--black:255 255 255}*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth}body{margin:0;line-height:inherit}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}*{transition-duration:.3s}body{font-family:Quicksand,sans-serif;font-size:1.125rem;line-height:1.75rem;line-height:1.625}.h1,h1{font-size:2.25rem;line-height:2.5rem;font-weight:700;line-height:1.25}.h2,h2{font-size:1.875rem;line-height:2.25rem;font-weight:700;line-height:1.25}.h3,h3{font-size:1.25rem;line-height:1.75rem}.h3,.h4,h3,h4{font-weight:600}.h1+p,.h2+p,h1+h2,h1+p,h2+.button,h2+h3,h2+p,h3+.button,h3+p,p+h3,p+p,p+table,table+p,p+h1,p+h2{margin-top:1rem}.button+p,p+.button{margin-top:1.5rem}ol,ul{margin-top:1rem;margin-bottom:1rem;list-style-type:disc;padding-left:var(--spacing-8);li { padding-left: var(--spacing-1); }}ul.unstyled-list{list-style-type:none;padding-left:0;li { padding-left: 0; }}.container{max-width:var(--container-width-max);margin:auto;padding:var(--spacing-4);&.container-width-small { max-width: var(--container-width-small); } &.container-width-tiny { max-width: var(--container-width-tiny); } &.container-width-medium { max-width: var(--container-width-medium); }}.pt-0{padding-top:0!important}.pb-0{padding-bottom:0!important}.mt-0{margin-top:0!important}main section:first-of-type>.container{padding-top:5rem}.grid{display:grid;grid-template-columns:repeat(1,minmax(0,1fr));gap:var(--spacing-4)}.my-6{margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.mb-6{margin-bottom:var(--spacing-6)}.subtitle{color:rgb(var(--primary));font-weight:700;& + h1, & + h2 { margin-top: 0; }}.muted-detail{color:rgb(var(--gray-700));font-size:var(--font-base)}.text-base{font-size:var(--font-base)}.bg-gray{background-color:rgb(var(--gray-100))}.bg-yellow{background-color:rgb(var(--yellow-50))}.hide-mobile{display:none}.errors{color:rgb(var(--red))}.relative{position:relative}@media(min-width:640px){.container{padding:var(--spacing-16)}main section:first-of-type>.container{padding-top:7rem}.grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--spacing-8);&.small-gap { gap: var(--spacing-4); } &.large-gap { gap: var(--spacing-16); }}.md\:text-center{text-align:center}.hide-mobile{display:block}}@media(min-width:1536px){.container{padding:var(--spacing-24);&.small-bottom-padding { padding-bottom: var(--spacing-16); }}main section:first-of-type>.container{padding-top:10rem}.grid{&.large-gap { gap: var(--spacing-24); }}}.has-bg-image{display:flex;align-items:center;position:relative;overflow:hidden;.bg-image { position: absolute; top: 0; width: 100%; right: 0; height: 100%; z-index: -10; svg { width: 100%; height: 100%; } }}.hero{min-height:100vh;.content { display: flex; align-items: center; } .bg-image { top: var(--spacing-16); width: 50%; }}.button{display:inline-block;padding:var(--spacing-2)var(--spacing-4);background-color:rgb(var(--primary));color:rgb(var(--white));&:hover { background-color:rgb(var(--green-700)); } &.black-button { --primary:var(--black); } &.small-button { padding:var(--spacing-1) var(--spacing-2); font-size:var(--font-base); }}.button-group{display:flex;gap:var(--spacing-2);flex-wrap:wrap;margin-top:var(--spacing-4)}hr{border-top:0;height:var(--border-width);margin-top:var(--spacing-4);margin-bottom:var(--spacing-4)}.bottom-border,hr{background-image:var(--border);background-position:0 100%;background-repeat:no-repeat;background-size:100% var(--border-width)}.top-border{background-position:0 0;background-image:var(--border);background-repeat:no-repeat;background-size:100% var(--border-width)}.full-border,a.full-border,.hover-full-border{position:relative}.full-border,.hover-full-border:hover{&::before { content:""; position:absolute; inset:0; padding:2px; background:repeating-linear-gradient( to right,rgb(var(--secondary)) 0 6px,transparent 6px 12px ) top/100% 2px no-repeat,repeating-linear-gradient( to right,rgb(var(--secondary)) 0 6px,transparent 6px 12px ) bottom/100% 2px no-repeat,repeating-linear-gradient( to bottom,rgb(var(--secondary)) 0 6px,transparent 6px 12px ) left/2px 100% no-repeat,repeating-linear-gradient( to bottom,rgb(var(--secondary)) 0 6px,transparent 6px 12px ) right/2px 100% no-repeat; pointer-events:none; } &.rotate { &::before { transform:rotate(calc(var(--rotate) * -1)); } }}.runner-bottom{position:relative;padding-bottom:4px;background-image:linear-gradient(rgb(var(--primary)),rgb(var(--primary)));background-size:0% 2px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .3s ease;display:block}.runner-bottom:hover{background-size:100% 2px}.render-hook-codeblock{margin:var(--spacing-4)0;position:relative;.code-header { display: flex; justify-content: space-between; gap: var(--spacing-4); font-size: var(--font-base); .file-name { font-weight: 600; } } .copied { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-color: rgb(var(--white) / 0.5); } table { overflow: scroll; display: block; }}:root{--waline-font-size:var(--font-base);--waline-white:var(--color-bg);--waline-light-grey:var(--gray-100);--waline-dark-grey:#666;--waline-theme-color:var(--primary);--waline-active-color:#2ecc71;--waline-color:var(--color-text);--waline-bg-color:#fff;--waline-bg-color-light:#f8f8f8;--waline-bg-color-hover:#f0f0f0;--waline-border-color:#ddd;--waline-disable-bg-color:#f8f8f8;--waline-disable-color:#000;--waline-code-bg-color:#282c34;--waline-warning-color:#915930;--waline-warning-bg-color:rgb(234 179 8 / 14%);--waline-bq-color:#f0f0f0;--waline-avatar-size:3.25rem;--waline-m-avatar-size:calc(var(--waline-avatar-size) * 9 / 13);--waline-badge-color:var(--primary);--waline-badge-font-size:var(--font-sm);--waline-info-bg-color:#f8f8f8;--waline-info-font-size:0.625em;--waline-border:1px solid var(--waline-border-color);--waline-avatar-radius:50%;--waline-box-shadow:none}[data-waline]{font-size:var(--waline-font-size);text-align:start}[dir=rtl] [data-waline]{direction:rtl}[data-waline] *{box-sizing:content-box;line-height:1.75}[data-waline] p{color:var(--waline-color)}[data-waline] a{position:relative;display:inline-block;color:var(--waline-theme-color);text-decoration:none;overflow-wrap:break-word;cursor:pointer}[data-waline] a:hover{color:var(--waline-active-color)}[data-waline] img{max-width:100%;max-height:400px;border:none}[data-waline] hr{margin:.825em 0;border-style:dashed;border-color:var(--waline-bg-color-light)}[data-waline] code,[data-waline] pre{margin:0;padding:.2em .4em;background:var(--waline-bg-color-light);font-size:85%}[data-waline] pre{overflow:auto;padding:10px;line-height:1.45}[data-waline] pre::-webkit-scrollbar{width:6px;height:6px}[data-waline] pre::-webkit-scrollbar-track-piece:horizontal{background:rgba(0,0,0,.1)}[data-waline] pre::-webkit-scrollbar-thumb:horizontal{width:6px;background:var(--waline-theme-color)}[data-waline] pre code{padding:0;background:0 0;color:var(--waline-color);white-space:pre-wrap;word-break:keep-all}[data-waline] blockquote{margin:.5em 0;padding:.5em 0 .5em 1em;border-inline-start:8px solid var(--waline-bq-color);color:var(--waline-dark-grey)}[data-waline] blockquote>p{margin:0}[data-waline] ol,[data-waline] ul{margin-inline-start:1.25em;padding:0}[data-waline] input[type=checkbox],[data-waline] input[type=radio]{display:inline-block;vertical-align:middle;margin-top:-2px}.comments{padding-left:0!important;padding-right:0!important;margin-top:var(--spacing-8);h2 { margin-bottom: var(--spacing-8); }}.wl-btn{display:inline-block;vertical-align:middle;min-width:2.5em;margin-bottom:0;padding:.5em 1em;border:1px solid var(--waline-border-color);background:0 0;color:var(--waline-color);font-weight:400;font-size:var(--font-base);line-height:1.5;text-align:center;white-space:nowrap;cursor:pointer;user-select:none;touch-action:manipulation;transition-duration:.4s;font-family:inherit}.wl-btn:hover,.wl-btn:active{border-color:var(--waline-theme-color);color:var(--waline-theme-color)}.wl-btn:disabled{border-color:var(--waline-border-color);background:var(--waline-disable-bg-color);color:var(--waline-disable-color);cursor:not-allowed}.wl-btn.primary{border-color:var(--waline-theme-color);background:var(--waline-theme-color);color:var(--waline-white)}.wl-btn.primary:hover,.wl-btn.primary:active{border-color:var(--waline-active-color);background:var(--waline-active-color);color:var(--waline-white)}.wl-btn.primary:disabled{border-color:var(--waline-border-color);background:var(--waline-disable-bg-color);color:var(--waline-disable-color);cursor:not-allowed}.wl-loading{text-align:center}.wl-loading svg{margin:0 auto}.wl-comment{position:relative;display:flex;margin-bottom:.75em}.wl-close{position:absolute;inset-inline-end:-4px;top:-4px;padding:0;border:none;background:0 0;line-height:1;cursor:pointer}.wl-login-info{max-width:80px;margin-top:.75em;text-align:center}.wl-logout-btn{position:absolute;inset-inline-end:-10px;top:-10px;padding:3px;border:none;background:0 0;line-height:0;cursor:pointer}.wl-avatar{position:relative;width:var(--waline-avatar-size);height:var(--waline-avatar-size);margin:0 auto;border:var(--waline-border);border-radius:var(--waline-avatar-radius)}@media(max-width:720px){.wl-avatar{width:var(--waline-m-avatar-size);height:var(--waline-m-avatar-size)}}.wl-avatar img{width:100%;height:100%;border-radius:var(--waline-avatar-radius)}.wl-login-nick{display:block;color:var(--waline-theme-color);font-size:var(--font-sm);word-break:break-all}.wl-panel{position:relative;flex-shrink:1;width:100%;border:var(--waline-border);background:var(--waline-bg-color);box-shadow:var(--waline-box-shadow)}.wl-header{display:flex;overflow:hidden;padding:0 4px;border-bottom:2px dashed var(--waline-border-color);border-top-left-radius:.75em;border-top-right-radius:.75em}@media(max-width:580px){.wl-header{display:block}}.wl-header label{min-width:40px;padding:.75em .5em;color:var(--waline-color);font-size:var(--font-base);text-align:center;display:flex;align-items:center}.wl-header input{flex:1;resize:none;width:0;padding:.5em;background:0 0}.wl-header-item{display:flex;flex:1}@media(max-width:580px){.wl-header-item:not(:last-child){border-bottom:2px dashed var(--waline-border-color)}}.wl-header-1 .wl-header-item{width:100%}.wl-header-2 .wl-header-item{width:50%}@media(max-width:580px){.wl-header-2 .wl-header-item{flex:0;width:100%}}.wl-header-3 .wl-header-item{width:33.33%}@media(max-width:580px){.wl-header-3 .wl-header-item{width:100%}}.wl-editor{position:relative;resize:vertical;box-sizing:border-box;width:calc(100% - 1em);min-height:8.75em;margin:.75em .5em;background:0 0;font-size:var(--font-base)}.wl-editor,.wl-input{max-width:100%;border:none;color:var(--waline-color);outline:none;transition:all .25s ease;font-family:inherit}.wl-editor:focus,.wl-input:focus{background:var(--waline-bg-color-light)}.wl-preview{padding:0 .5em .5em}.wl-preview h4{margin:.25em;font-weight:700;font-size:.9375em}.wl-preview .wl-content{min-height:1.25em;padding:.25em;overflow-wrap:break-word;hyphens:auto}.wl-preview .wl-content>*:first-child{margin-top:0}.wl-preview .wl-content>*:last-child{margin-bottom:0}.wl-footer{position:relative;display:flex;flex-wrap:wrap;margin:.5em .75em}.wl-actions{display:flex;flex:2;align-items:center}.wl-action{display:inline-flex;align-items:center;justify-content:center;width:1.5em;height:1.5em;margin:2px;padding:0;border:none;background:0 0;color:var(--waline-color);font-size:16px;cursor:pointer}.wl-action:hover{color:var(--waline-theme-color)}.wl-action.active{color:var(--waline-active-color)}#wl-image-upload{display:none}#wl-image-upload:focus+label{color:var(--waline-color)}#wl-image-upload:focus-visible+label{outline:-webkit-focus-ring-color auto 1px}.wl-info{display:flex;flex:3;align-items:center;justify-content:flex-end}.wl-info .wl-text-number{opacity:.8;font-size:var(--font-sm)}.wl-info .wl-text-number .illegal{color:red}.wl-info button{margin-inline-start:.75em}.wl-info button svg{display:block;margin:0 auto;line-height:18px}.wl-emoji-popup{position:absolute;inset-inline-start:1.25em;top:100%;z-index:10;display:none;width:100%;max-width:526px;border:var(--waline-border);background:var(--waline-bg-color);box-shadow:var(--waline-box-shadow)}.wl-emoji-popup.display{display:block}.wl-emoji-popup button{display:inline-block;vertical-align:middle;width:2em;margin:.125em;padding:0;border-width:0;background:0 0;font-size:inherit;line-height:2;text-align:center;cursor:pointer}.wl-emoji-popup button:hover{background:var(--waline-bg-color-hover)}.wl-emoji-popup .wl-emoji{display:inline-block;vertical-align:middle;max-width:1.5em;max-height:1.5em}.wl-emoji-popup .wl-emoji-preview{position:absolute;top:-4em;left:0;z-index:1;display:block;max-width:3em;max-height:3em;padding:.25em;border:var(--waline-border);background:var(--waline-bg-color);box-shadow:var(--waline-box-shadow)}.wl-emoji-popup .wl-tab-wrapper{overflow-y:auto;max-height:145px;padding:.5em}.wl-emoji-popup .wl-tab-wrapper::-webkit-scrollbar{width:6px;height:6px}.wl-emoji-popup .wl-tab-wrapper::-webkit-scrollbar-track-piece:vertical{background:rgba(0,0,0,.1)}.wl-emoji-popup .wl-tab-wrapper::-webkit-scrollbar-thumb:vertical{width:6px;background:var(--waline-theme-color)}.wl-emoji-popup .wl-tabs{position:relative;overflow-x:auto;padding:0 6px;white-space:nowrap}.wl-emoji-popup .wl-tabs::before{content:" ";position:absolute;top:0;right:0;left:0;z-index:2;height:1px;background:var(--waline-border-color)}.wl-emoji-popup .wl-tabs::-webkit-scrollbar{width:6px;height:6px}.wl-emoji-popup .wl-tabs::-webkit-scrollbar-track-piece:horizontal{background:rgba(0,0,0,.1)}.wl-emoji-popup .wl-tabs::-webkit-scrollbar-thumb:horizontal{height:6px;background:var(--waline-theme-color)}.wl-emoji-popup .wl-tab{position:relative;margin:0;padding:0 .5em}.wl-emoji-popup .wl-tab.active{z-index:3;border:1px solid var(--waline-border-color);border-top-width:0;border-bottom-right-radius:6px;border-bottom-left-radius:6px;background:var(--waline-bg-color)}.wl-gif-popup{position:absolute;inset-inline-start:1.25em;top:100%;z-index:10;width:calc(100% - 3em);padding:.75em .75em .25em;border:var(--waline-border);background:var(--waline-bg-color);box-shadow:var(--waline-box-shadow);opacity:0;visibility:hidden;transition:transform .2s ease-out,opacity .2s ease-out;transform:scale(.9,.9);transform-origin:0 0}.wl-gif-popup.display{opacity:1;visibility:visible;transform:none}.wl-gif-popup input{box-sizing:border-box;width:100%;margin-bottom:10px;padding:3px 5px;border:var(--waline-border)}.wl-gif-popup img{display:block;box-sizing:border-box;width:100%;border-width:2px;border-style:solid;border-color:#fff;cursor:pointer}.wl-gif-popup img:hover{border-color:var(--waline-theme-color)}.wl-gallery{display:flex;overflow-y:auto;max-height:80vh}.wl-gallery-column{display:flex;flex:1;flex-direction:column;height:-webkit-max-content;height:-moz-max-content;height:max-content}.wl-cards .wl-user{--avatar-size:var(--waline-avatar-size);position:relative;margin-inline-end:.75em}@media(max-width:720px){.wl-cards .wl-user{--avatar-size:var(--waline-m-avatar-size)}}.wl-cards .wl-user .wl-user-avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:var(--waline-avatar-radius);box-shadow:var(--waline-box-shadow)}.wl-cards .wl-user .verified-icon,.wl-cards .wl-user .administrator-icon{position:absolute;inset-inline-start:calc(var(--avatar-size) * 3/4);top:calc(var(--avatar-size) * 3/4);border-radius:50%;background:var(--waline-bg-color);box-shadow:var(--waline-box-shadow)}.wl-card-item{position:relative;display:flex;padding:.5em}.wl-card-item .wl-card-item{padding-inline-end:0}.wl-card{flex:1;width:0;padding-bottom:.5em;border-bottom:1px dashed var(--waline-border-color)}.wl-card:first-child{margin-inline-start:1em}.wl-card-item:last-child>.wl-card{border-bottom:none}.wl-card .wl-nick svg{position:relative;bottom:-.125em;line-height:1}.wl-card .wl-head{overflow:hidden;line-height:1.5}.wl-card .wl-head .wl-nick{position:relative;display:inline-block;margin-inline-end:.5em;font-weight:700;font-size:var(--font-base);line-height:1;text-decoration:none;color:var(--waline-color)}.wl-card .wl-badge{display:inline-block;margin-inline-end:1em;padding:0 .3em;border:1px solid var(--waline-badge-color);color:rgb(var(--green-700));background-color:rgb(var(--green-50));font-size:var(--waline-badge-font-size)}.wl-card .wl-time{margin-inline-end:.875em;opacity:.8;font-size:var(--font-sm)}.wl-card .wl-meta{position:relative;line-height:1}.wl-card .wl-meta>span{display:inline-block;margin-inline-end:.25em;padding:2px 4px;background:var(--waline-info-bg-color);opacity:.8;font-size:var(--waline-info-font-size);line-height:1.5}.wl-card .wl-meta>span:empty{display:none}.wl-card .wl-comment-actions{float:right;line-height:1;display:flex;gap:var(--spacing-2)}[dir=rtl] .wl-card .wl-comment-actions{float:left}.wl-card .wl-delete,.wl-card .wl-like,.wl-card .wl-reply,.wl-card .wl-edit,.wl-card .wl-rss{display:inline-flex;align-items:center;border:none;background:0 0;color:var(--waline-color);line-height:1;cursor:pointer;transition:color .2s ease}.wl-card .wl-delete:hover,.wl-card .wl-like:hover,.wl-card .wl-reply:hover,.wl-card .wl-edit:hover,.wl-card .wl-rss:hover{color:var(--waline-theme-color)}.wl-card .wl-delete.active,.wl-card .wl-like.active,.wl-card .wl-reply.active,.wl-card .wl-edit.active,.wl-card .wl-rss.active{color:var(--waline-active-color)}.wl-card .wl-warning{margin-top:1em;padding:.5em 1em;border:1px dashed var(--waline-warning-color);background:var(--waline-warning-bg-color);color:var(--waline-warning-color);font-size:var(--font-base);line-height:1em}.wl-card .wl-content{position:relative;margin-bottom:.75em;padding-top:.625em;font-size:var(--font-base);line-height:2;overflow-wrap:break-word;display:flex;flex-direction:column}.wl-card .wl-content.expand{overflow:hidden;max-height:8em;cursor:pointer}.wl-card .wl-content.expand::before{content:"";position:absolute;inset-inline-start:0;top:0;bottom:3.15em;z-index:999;display:block;width:100%;background:linear-gradient(180deg,#000,rgba(255,255,255,.9))}.wl-card .wl-content.expand::after{content:attr(data-expand);position:absolute;inset-inline-start:0;bottom:0;z-index:999;display:block;width:100%;height:3.15em;background:hsla(0,0%,100%,.9);color:#828586;line-height:3.15em;text-align:center}.wl-card .wl-content>*:first-child{margin-top:0}.wl-card .wl-content>*:last-child{margin-bottom:0}.wl-card .wl-admin-actions{margin:8px 0;font-size:12px;text-align:right}.wl-card .wl-comment-status{margin:0 8px}.wl-card .wl-comment-status .wl-btn{border-radius:0}.wl-card .wl-comment-status .wl-btn:first-child{border-inline-end:0}.wl-card .wl-comment-status .wl-btn:last-child{border-inline-start:0}.wl-card .wl-quote{border-inline-start:1px dashed rgba(237,237,237,.5)}.wl-card .wl-quote .wl-user{--avatar-size:var(--waline-m-avatar-size)}.wl-close-icon{color:var(--waline-border-color)}.wl-content .vemoji,.wl-content .wl-emoji{display:inline-block;vertical-align:baseline;height:1.25em;margin:-.125em .25em}.wl-content .wl-tex{background:var(--waline-info-bg-color);opacity:.8}.wl-content span.wl-tex{display:inline-block;margin-inline-end:.25em;padding:2px 4px;font-size:var(--waline-info-font-size);line-height:1.5}.wl-content p.wl-tex{text-align:center}.wl-content .katex-display{overflow:auto hidden;padding-top:.2em;padding-bottom:.2em;-webkit-overflow-scrolling:touch}.wl-content .katex-display::-webkit-scrollbar{height:3px}.wl-content .katex-error{color:red}.wl-count{flex:1;font-weight:700;font-size:1.25em}.wl-empty{overflow:auto;padding:1.25em;color:var(--waline-color);text-align:center}.wl-operation{text-align:center}.wl-operation button{margin:1em 0}.wl-power{padding:.5em 0;margin-inline-start:auto;opacity:.8;font-size:var(--waline-info-font-size);text-align:end}.wl-meta-head{display:flex;flex-direction:row;align-items:center;padding:.375em}.wl-sort{margin:0;list-style-type:none}.wl-sort li{display:inline-block;opacity:.8;font-size:var(--font-sm);cursor:pointer}.wl-sort li.active{color:var(--waline-theme-color)}.wl-sort li+li{margin-inline-start:1em}.wl-meta-foot{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.wl-rss{display:flex;gap:5px;max-width:16px;flex-wrap:nowrap;overflow:hidden;transition:all .2s ease-in-out}.wl-rss:hover{max-width:100%}.wl-rss>a{display:flex;gap:2px;flex-shrink:0}.wl-rss span{color:var(--waline-light-grey);font-size:var(--waline-info-font-size);text-align:end}.wl-reaction{overflow:auto hidden;margin-bottom:1.75em;text-align:center}.wl-reaction img{width:100%;height:100%;transition:all 250ms ease-in-out}.wl-reaction-title{margin:16px auto;font-weight:700;font-size:18px}.wl-reaction-list{display:flex;flex-direction:row;gap:16px;justify-content:center;margin:0;padding:8px;list-style-type:none}@media(max-width:580px){.wl-reaction-list{gap:12px}}[data-waline] .wl-reaction-list{margin-inline-start:0}.wl-reaction-item{display:flex;flex-direction:column;align-items:center;cursor:pointer}.wl-reaction-item:hover img,.wl-reaction-item.active img{transform:scale(1.15)}.wl-reaction-img{position:relative;width:42px;height:42px}@media(max-width:580px){.wl-reaction-img{width:32px;height:32px}}.wl-reaction-loading{position:absolute;inset-inline-end:-5px;top:-4px;width:18px;height:18px;color:var(--waline-theme-color)}.wl-reaction-votes{position:absolute;inset-inline-end:-9px;top:-9px;min-width:1em;padding:2px;border:1px solid var(--waline-theme-color);background:var(--waline-bg-color);color:var(--waline-theme-color);font-weight:700;font-size:var(--font-sm);line-height:1}.wl-reaction-item.active .wl-reaction-votes{background:var(--waline-theme-color);color:var(--waline-bg-color)}.wl-reaction-text{font-size:var(--font-base)}.wl-reaction-item.active .wl-reaction-text{color:var(--waline-theme-color)}.wl-star{display:flex;flex-direction:column;gap:12px}.wl-star-rate{display:flex;gap:6px;justify-content:center;cursor:pointer;user-select:none}.wl-star-item{position:relative;width:24px;height:24px}.wl-star-icon{width:100%;height:100%}.wl-star-outline{fill:none;stroke:var(--waline-light-grey);stroke-width:1.5}.wl-star-solid{fill:var(--waline-theme-color);stroke:var(--waline-theme-color);stroke-width:1.5}.wl-star-score{display:flex;flex-direction:column;gap:6px}.wl-star-row{display:flex;gap:8px;align-items:center}.wl-star-row .wl-star-rate{gap:3px;align-items:center}.wl-star-row .wl-star-item{display:flex;width:12px;height:12px}.wl-star-progress{flex:1;overflow:hidden;height:6px;border-radius:999px;background:var(--waline-bg-color-light)}.wl-star-progress-bar{height:100%;background:var(--waline-theme-color)}.wl-star-percent{width:52px;color:var(--waline-light-grey);font-size:var(--font-sm);text-align:right}.wl-content pre,.wl-content pre[class*=language-]{overflow:auto;margin:.75rem 0;padding:1rem 1.25rem;background:var(--waline-code-bg-color);line-height:1.4}.wl-content pre code,.wl-content pre[class*=language-] code{padding:0;background:0 0!important;color:#bbb;direction:ltr}.wl-content code[class*=language-],.wl-content pre[class*=language-]{background:0 0;color:#ccc;font-size:1em;font-family:Consolas,Monaco,andale mono,ubuntu mono,monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;overflow-wrap:normal;tab-size:4;hyphens:none}.wl-content pre[class*=language-]{overflow:auto}.wl-content :not(pre)>code[class*=language-],.wl-content pre[class*=language-]{background:#2d2d2d}.wl-content :not(pre)>code[class*=language-]{padding:.1em;white-space:normal}.wl-content .token.comment,.wl-content .token.block-comment,.wl-content .token.prolog,.wl-content .token.doctype,.wl-content .token.cdata{color:#999}.wl-content .token.punctuation{color:#ccc}.wl-content .token.tag,.wl-content .token.attr-name,.wl-content .token.namespace,.wl-content .token.deleted{color:#e2777a}.wl-content .token.function-name{color:#6196cc}.wl-content .token.boolean,.wl-content .token.number,.wl-content .token.function{color:#f08d49}.wl-content .token.property,.wl-content .token.class-name,.wl-content .token.constant,.wl-content .token.symbol{color:#f8c555}.wl-content .token.selector,.wl-content .token.important,.wl-content .token.atrule,.wl-content .token.keyword,.wl-content .token.builtin{color:#cc99cd}.wl-content .token.string,.wl-content .token.char,.wl-content .token.attr-value,.wl-content .token.regex,.wl-content .token.variable{color:#7ec699}.wl-content .token.operator,.wl-content .token.entity,.wl-content .token.url{color:#67cdcc}.wl-content .token.important,.wl-content .token.bold{font-weight:700}.wl-content .token.italic{font-style:italic}.wl-content .token.entity{cursor:help}.wl-content .token.inserted{color:green}.wl-recent-item p{display:inline}.wl-user-list{padding:0;list-style:none}.wl-user-list a,.wl-user-list a:hover,.wl-user-list a:visited{color:var(--waline-color);text-decoration:none}.wl-user-list .wl-user-avatar{position:relative;display:inline-block;overflow:hidden;margin-inline-end:10px;border-radius:4px;line-height:0}.wl-user-list .wl-user-avatar>img{width:var(--waline-user-avatar-size,48px);height:var(--waline-user-avatar-size,48px)}.wl-user-list .wl-user-badge{position:absolute;inset-inline-end:0;bottom:0;min-width:.7em;height:1.5em;padding:0 .4em;border-radius:4px;background:var(--waline-info-bg-color);opacity:.8;font-weight:700;font-size:10px;line-height:1.5em;text-align:center}.wl-user-list .wl-user-item{margin:10px 0}.wl-user-list .wl-user-item:nth-child(1) .wl-user-badge{background:var(--waline-rank-gold-bg-color,#fa3939);color:var(--waline-white);font-weight:700}.wl-user-list .wl-user-item:nth-child(2) .wl-user-badge{background:var(--waline-rank-silver-bg-color,#fb811c);color:var(--waline-white);font-weight:700}.wl-user-list .wl-user-item:nth-child(3) .wl-user-badge{background:var(--waline-rank-copper-bg-color,#feb207);color:var(--waline-white)}.wl-user-list .wl-user-meta{display:inline-block;vertical-align:top}.wl-user-list .wl-badge{display:inline-block;vertical-align:text-top;margin-inline-start:.5em;padding:0 .3em;border:1px solid var(--waline-badge-color);border-radius:4px;color:var(--waline-badge-color);font-size:var(--waline-badge-font-size)}.wl-user-wall{padding:0;list-style:none}.wl-user-wall .wl-user-badge,.wl-user-wall .wl-user-meta{display:none}.wl-user-wall .wl-user-item{position:relative;display:inline-block;transition:transform ease-in-out .2s}.wl-user-wall .wl-user-item::before,.wl-user-wall .wl-user-item::after{position:absolute;bottom:100%;left:50%;z-index:10;opacity:0;pointer-events:none;transition:all .18s ease-out .18s;transform:translate(-50%,4px);transform-origin:top}.wl-user-wall .wl-user-item::before{content:"";width:0;height:0;border:5px solid transparent;border-top-color:rgba(16,16,16,.95)}.wl-user-wall .wl-user-item::after{content:attr(aria-label);margin-bottom:10px;padding:.5em 1em;border-radius:2px;background:rgba(16,16,16,.95);color:#fff;font-size:12px;white-space:nowrap}.wl-user-wall .wl-user-item:hover{transform:scale(1.1)}.wl-user-wall .wl-user-item:hover::before,.wl-user-wall .wl-user-item:hover::after{opacity:1;pointer-events:none;transform:translate(-50%,0)}.wl-user-wall .wl-user-item img{width:var(--waline-user-avatar-size,48px);height:var(--waline-user-avatar-size,48px)}.unstyled-list,#TableOfContents ul{list-style:none;padding:0}#TableOfContents{li { padding-left: 0; ul { display: none; } &.active ul { display: block; } }}.link-list{list-style:none;padding:0;margin:0;li { position: relative; padding-left: var(--spacing-4); margin: 0.5rem 0; &::before { content: ""; position: absolute; left: 0; top: 0; width: 3px; background: rgb(var(--secondary)); height: 100%; transition: height 0.3s ease, top 0.3s ease; } &:hover::before { height: 6px; top: 0.65rem; } &:last-of-type { margin-bottom: 0; } a { color: rgb(var(--black)); text-decoration: none; } &.active > a { color: rgb(var(--primary)); font-weight: 700; } }}.link-list-right{list-style:none;padding:0;margin:0;text-align:right;li { position: relative; padding-right: var(--spacing-4); margin: 0.5rem 0; &::before { content: ""; position: absolute; right: 0; top: 0; width: 3px; background: rgb(var(--secondary)); height: 100%; transition: height 0.3s ease, top 0.3s ease; } &:hover::before { height: 6px; top: 0.65rem; } &:last-of-type { margin-bottom: 0; } a { color: rgb(var(--black)); text-decoration: none; } &.active > a { color: rgb(var(--primary)); font-weight: 700; } }}.logo{display:flex}.tag{display:flex;gap:var(--spacing-2);background-color:rgb(var(--green-50));color:rgb(var(--green-600));font-size:var(--font-base);align-items:center;padding:var(--spacing-1)var(--spacing-2);max-width:fit-content;&.yellow { background-color: rgb(var(--yellow-100)); color: rgb(var(--yellow-800)); }}.ticklist{.item { display: flex; gap: var(--spacing-2); }}.title-card{background-color:rgb(var(--yellow-50));padding:var(--spacing-8);&.green { --secondary: var(--primary); background-color: rgb(var(--green-50)); } .content { max-width: var(--container-width-tiny); }}.p-card,.p-card-small{padding:var(--spacing-8)}.coloured-link-cards{gap:0;.card { &:nth-of-type(even) { background-color: rgb(var(--green-50)); &:hover { background-color: rgb(var(--yellow-50)); } } &:nth-of-type(odd) { background-color: rgb(var(--green-100)); &:hover { background-color: rgb(var(--yellow-100)); } } }}.blog-card{.info { display: flex; font-size: var(--font-base); justify-content: flex-end; margin-top: var(--spacing-4); flex-wrap: wrap; gap: var(--spacing-4) var(--spacing-8); .item { display: flex; gap: var(--spacing-1); align-items: center; flex-wrap: nowrap; } } .h3 + .intro { margin-top: var(--spacing-2); } .intro { font-size: var(--font-base); }}.type-card{background-color:rgb(var(--white));display:flex;gap:var(--spacing-8);position:relative;.icon { width: var(--spacing-16); height: auto; margin: auto; display: none; svg { width: 100%; max-width: var(--spacing-8); margin: auto; height: auto; } } &:hover { background-color: rgb(var(--yellow-50)); &::before { transform: rotate(var(--rotate)); } }}.notice{padding:var(--spacing-4)var(--spacing-8);background-color:rgb(var(--green-50));border-left:2px solid rgb(var(--primary));font-size:var(--font-base)}.post-meta{.icon { display: inline-block; svg { display: inline; width: var(--spacing-4); height: auto; } }}footer{text-align:center;.logo { width: var(--spacing-48); margin: auto; } h2 { font-size: var(--font-lg); }}.scroll-top{position:fixed;right:var(--spacing-8);bottom:var(--spacing-8);z-index:50;background-color:rgb(var(--white));transform:rotate(45deg);&:hover { background-color:rgb(var(--yellow-100)); } .full-border { padding:var(--spacing-4); } svg { transform:rotate(-45deg); }}.prefooter{.container { .content { background-color: rgb(var(--white)); h2 { text-align: center; } } } form { margin-top: var(--spacing-4); .input-wrapper { display: flex; gap: var(--spacing-1); flex-direction: column; & + * { margin-top: var(--spacing-4); } &.hidden { display: none; } } .input-grid { gap: var(--spacing-4); & + .input-wrapper { margin-top: var(--spacing-4); } .input-wrapper + .input-wrapper { margin-top: 0; } } label { font-size: var(--font-sm); } input, textarea { padding-top: var(--spacing-2); padding-bottom: var(--spacing-2); padding-left: var(--spacing-4); padding-right: var(--spacing-4); background-color: rgb(var(--green-50)); border-width: 2px; border-style: solid; border-color: transparent; width: 100%; &:focus { outline: none; box-shadow: none; border-color: rgb(var(--primary)); } } .has-error { background-color: rgb(var(--red) / 0.2); &:focus { border-color: rgb(var(--red)); } } }}header{width:100%;position:fixed;z-index:50;.logo { width: 2rem; } &.header--scrolled { background-color: rgb(var(--white)); .header-inner { padding-top: var(--spacing-2); padding-bottom: var(--spacing-2); } } &.header--hidden { transform: translateY(-100%); } &.header--shown { transform: translateY(0); } .header-inner { display: flex; justify-content: space-between; padding-top: var(--spacing-4); padding-bottom: var(--spacing-4); } nav { display: flex; align-items: center; .menu-toggle { display: block; background: none; border: none; font-size: 1.75rem; cursor: pointer; } .nav-list { display: none; flex-direction: column; position: absolute; top: var(--spacing-16); left: 0; width: 100%; &.nav-list--open { display: flex; background-color: rgb(var(--white)); margin: 0; } } .nav-link { text-decoration: none; transition: color 0.2s ease; width: 100%; display: inline-block; padding: var(--spacing-4); } } a:hover { color: rgb(var(--primary)); }}.breadcrumb{display:flex;gap:var(--spacing-2);margin-bottom:0}.section-nav{display:none;justify-content:space-between;margin-bottom:var(--spacing-4);font-size:var(--font-base);line-height:1.15;.items { display: flex; & > * { padding-left: var(--spacing-2); padding-right: var(--spacing-2); border-bottom: var(--border-width) solid rgb(var(--gray-200)); &.active { border-color: rgb(var(--primary)); } &:not(.active):hover { border-color: rgb(var(--secondary)); } } } .actions { border-bottom: var(--border-width) solid rgb(var(--gray-200)); flex-grow: 1; text-align: right; .small-button { font-size: var(--font-sm); margin-bottom: var(--spacing-1); } }}.pagination{display:flex;justify-content:space-between;margin-top:var(--spacing-4);font-size:var(--font-base);.numbers { display: flex; & > * { padding-top: var(--spacing-1); padding-left: var(--spacing-2); padding-right: var(--spacing-2); border-top: var(--border-width) solid rgb(var(--gray-200)); &.active { border-color: rgb(var(--primary)); } &:not(.active):hover { border-color: rgb(var(--secondary)); } } } .actions-left, .actions-right { flex-grow: 1; border-top: var(--border-width) solid rgb(var(--gray-200)); } .actions-right { text-align: right; } .prev:hover, .next:hover { color: rgb(var(--primary)); }}.share-wrapper{display:flex;gap:var(--spacing-4);justify-content:center;align-items:center;margin-top:var(--spacing-8);margin-bottom:var(--spacing-8);a { width: var(--spacing-8); height: var(--spacing-8); svg { width: 100%; height: 100%; } }}.author-card{max-width:var(--spacing-72);width:100%;margin:0 auto;background-color:rgb(var(--white));border-radius:var(--border-radius);box-shadow:var(--shadow-sm);&:hover { box-shadow:var(--shadow-lg); } .author-card__inner { padding:var(--spacing-8); display:flex; flex-direction:column; align-items:center; gap:var(--spacing-4); } .author-card__text { text-align:center; } .author-name { font-weight:600; } .author-title { margin-top:0; font-size:var(--font-sm); font-weight:600; color:rgb(var(--primary)); } .author-handle { margin-top:0; font-size:var(--font-sm); color:rgb(var(--gray-700)); } .author-social { display:flex; gap:rgb(--spacing-8); } .author-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:1rem; padding:0.75rem 1.5rem; text-align:center; }}.stat-number{font-size:var(--font-lg);font-weight:700}.stat-label{margin-top:0;font-size:var(--font-sm);color:rgb(var(--gray-700))}.avatar{position:relative;max-width:fit-content;img { border-radius: 100%; width: var(--spacing-24); height: var(--spacing-24); border: 2px solid rgb(var(--white)); } .is-online { width: var(--spacing-4); height: var(--spacing-4); border-radius: 100%; position: absolute; bottom: 0; right: var(--spacing-4); border: var(--border-width) rgb(var(--white)) solid; &.online { background-color: rgb(var(--primary)); } &.offline { background-color: rgb(var(--secondary)); } }}.social{display:flex;gap:var(--spacing-6);a { display: inline-block; width: var(--spacing-6); height: var(--spacing-6); &:hover { color: rgb(var(--primary)); } }}.profile-avatar{margin-top:calc(var(--spacing-8) * -1);padding-bottom:var(--spacing-4)!important;.spacer { height: var(--spacing-24); }}.profile-details{font-size:var(--font-base)}.tabs-container{display:flex;gap:var(--spacing-8);flex-direction:column;margin-top:var(--spacing-8);.tabs { flex-direction: row; flex-wrap: wrap; display: flex; } li { padding-left: var(--spacing-4); &.active { background-color: rgb(var(--yellow-100)); } &:first-of-type { margin-top: 0; } &:last-of-type { margin-bottom: 0; } } ul { margin-top: 0; margin-bottom: 0; } .contents { flex-grow: 1; & > * { width: 100%; } }}.sidebar{padding-top:0!important;&.sticky { position: sticky; top: var(--spacing-24); }}.toggle-buttons{font-size:var(--font-base);margin-top:var(--spacing-8);button { display: flex; align-items: center; gap: var(--spacing-1); }}@media(min-width:640px){header{--spacing-4:2rem;nav { .menu-toggle { display: none; } .nav-list { position: static; display: flex; flex-direction: row; gap: 2rem; width: auto; padding: 0; border-bottom: none; } .nav-list.nav-list--open { display: flex; } .nav-link { padding: 0; } }}.title-card{padding:var(--spacing-16)}.type-card .icon{display:block}.col-span-3{grid-column:span 3/span 3}.col-span-4{grid-column:span 4/span 4}.col-span-6{grid-column:span 6/span 6}.col-span-8{grid-column:span 8/span 8}.col-span-9{grid-column:span 9/span 9}.author-card__inner{padding:var(--spacing-12)}.profile-avatar{margin-top:calc(var(--spacing-16) * -1)}.p-card-small{padding:var(--spacing-8)}.tabs-container{flex-direction:row;.tabs { flex-direction: column; }}.section-nav{display:flex}}@media(min-width:1536px){footer .container{padding-top:var(--spacing-16);padding-bottom:var(--spacing-16)}.p-card{padding:var(--spacing-16)}.profile-avatar{margin-top:calc(var(--spacing-24) * -1)}}