:root{--content-width: 1100px;--content-margin: 100px;--header-height: 100px;--footer-height: 60px;--mobile-padding: 15px;--body-font-size: 1rem;--next-prev-height: 64px;--next-prev-width: 64px;--transition-time: .2s;--watermark-opacity: .1;--cat-background: rgb(255, 255, 255);--cat-lightness: 86%;--page-background-color: rgb(244, 240, 240);--footer-gradient-0: rgba(244, 240, 240, 0);--footer-gradient-1: rgba(244, 240, 240, 1);--text-color: #000;--text-color-inverse: #fff;--red-color: rgb(192, 0, 0);--link-base-color: rgb(192, 0, 0);--date-color: rgb(110, 100, 100);--subtle-text-color: rgb(110, 100, 100);--placeholder-text-color: rgb(130, 124, 124);--textarea-background-color: rgb(255, 253, 253);--dialog-title-background-color: rgb(220, 215, 215);--action-button-background-color: rgb(0, 0, 0);--dialog-background-color: rgb(232, 228, 228);--dialog-backdrop-color: rgba(0, 0, 0, .4);--comment-background-color: rgb(255, 253, 253);--comment-border-color: rgb(232, 228, 228);--button-background-color: rgb(255, 255, 255);--input-background-color: rgb(255, 255, 255);--input-border-color: rgb(130, 124, 124);--input-color: rgb(34, 32, 32);--code-background-color: rgb(255, 253, 253);--toast-background-color: rgb(255, 253, 253)}html.dark-theme{--watermark-opacity: .05;--cat-background: rgb(52, 48, 48);--page-background-color: rgb(34, 32, 32);--footer-gradient-0: rgba(34, 32, 32, 0);--footer-gradient-1: rgba(34, 32, 32, 1);--text-color: rgb(205, 200, 200);--text-color-inverse: rgb(240, 230, 230);--link-base-color: rgb(221, 142, 64);--date-color: rgb(145, 135, 135);--subtle-text-color: rgb(145, 135, 135);--placeholder-text-color: rgb(200, 190, 190);--textarea-background-color: rgb(34, 32, 32);--dialog-title-background-color: rgb(70, 66, 66);--dialog-background-color: rgb(52, 50, 50);--dialog-backdrop-color: rgba(0, 0, 0, .2);--comment-background-color: rgb(52, 48, 48);--comment-border-color: rgb(105, 100, 100);--button-background-color: rgb(85, 80, 80);--input-background-color: rgb(44, 42, 42);--input-border-color: rgb(105, 100, 100);--input-color: rgb(205, 200, 200);--code-background-color: rgb(52, 48, 48);--toast-background-color: rgb(52, 48, 48)}html{&.system-theme{.light-dark .system{display:block}.light-dark .sun,.light-dark .moon{display:none}}&.site-theme{.light-dark .system{display:none}&.light-theme{.light-dark .moon{display:none}.light-dark .sun{display:block}}&.dark-theme{.light-dark .sun{display:none}.light-dark .moon{display:block}}}}html,body{height:100%;margin:0;padding:0;background-color:var(--page-background-color);color:var(--text-color)}body{font-size:var(--body-font-size);font-family:system-ui,sans-serif;display:flex;justify-content:center;overflow:hidden;text-rendering:optimizeLegibility;.dev-watermark{position:absolute;top:0;left:0;width:100vw;height:100vh;z-index:0;pointer-events:none;overflow:hidden;& span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-45deg);font-size:80vh;font-weight:700;color:rgba(192,128,128,var(--watermark-opacity));white-space:nowrap;user-select:none}}}*,*:before,*:after{box-sizing:border-box}:focus{outline:2px solid color-mix(in srgb,var(--link-base-color),transparent 40%)}:focus:not(:focus-visible){outline:none}button:focus,a:focus,input:focus,textarea:focus,summary:focus{outline-offset:2px;border-radius:.2rem}.search-bar{display:grid;grid-template-columns:repeat(5,auto);gap:20px;& form{display:grid;grid-template-columns:1fr auto;gap:10px;& input{width:auto;max-width:150px}}& button{&:hover svg{color:var(--text-color-inverse)}}& svg{cursor:pointer;height:20px;width:20px;display:block}@media (width <= 460px){& svg{height:15px;width:15px}& form input{max-width:50px}}}.light-dark{display:grid;align-self:center}::-webkit-scrollbar{width:18px}::-webkit-scrollbar-track:hover{background:var(--input-background-color)}::-webkit-scrollbar-thumb{background:var(--subtle-text-color);width:10px;border-radius:10px;border:4px solid var(--page-background-color)}::-webkit-scrollbar-thumb:hover{background:var(--link-base-color);cursor:default}::-webkit-resizer{width:12px;height:12px;background-color:var(--dialog-title-background-color)}[popover],dialog{padding:20px;border-radius:4px}form{margin:0}button.link,.as-text{border:0;padding:0;font-size:inherit;font-family:inherit;color:inherit;background-color:transparent}button.link,a{color:var(--link-base-color);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,var(--link-base-color),transparent 80%);transition:text-decoration var(--transition-time) ease-in-out;cursor:pointer}a>img{display:inline-block}button.link:hover,a:active,a:hover{text-decoration-color:var(--link-base-color)}button.link:focus,a:focus{text-decoration:none}.cat-link{outline:1px solid transparent;transition:outline-color var(--transition-time) ease-in-out}.cat-link:hover,.cat-link:focus{outline:1px solid var(--link-base-color)}.cat-link,button,input,summary,label{cursor:pointer}.cat-link,input,button,textarea{border-radius:.25rem;border-color:var(--input-border-color);border-style:solid;background-color:var(--input-background-color);color:var(--input-color);&::placeholder{color:var(--placeholder-text-color)}&[type=submit]{background-color:var(--action-button-background-color);color:var(--text-color-inverse)}}button{font-size:1.25rem;padding:.5rem;border-width:2px;background-color:var(--button-background-color);transition:background-color var(--transition-time) ease-in-out,border-color var(--transition-time) ease-in-out,color var(--transition-time) ease-in-out}button.primary{background-color:#000;color:#ddd}button.red{background-color:var(--red-color);border-color:var(--red-color);color:#fff}button:not(.as-text,.link):hover{background-color:var(--link-base-color);border:2px solid var(--link-base-color);color:var(--text-color-inverse)}input{&[type=checkbox],&[type=radio]{transform:scale(1.5);accent-color:var(--link-base-color);margin-right:1rem}}input[type=text],input[type=email],input[type=password],input[type=date],textarea{border-width:1px;font-size:1rem;padding:.5rem;width:100%;max-width:100%;cursor:text}a.cat-link{display:inline-block;font-size:.8rem;line-height:1;padding:.2rem;text-decoration:none;color:var(--text-color);border:0}h1,h2,h3,h4{font-weight:400;color:var(--subtle-text-color);text-wrap:balance}h1{color:var(--text-color)}hr{border:0;margin-block:20px;border-top:1px solid var(--subtle-text-color);clear:both}blockquote{background-color:color-mix(in srgb,var(--input-background-color) 50%,transparent);border-left:6px solid var(--subtle-text-color);margin:0;& p{padding:.5rem .5rem .5rem 1rem}}ul{margin:0;&.flat{padding:1rem 0 0 1rem}}.hide{display:none}.small{font-size:small}.smaller{font-size:smaller}.center{text-align:center}.subtle{color:var(--subtle-text-color)}.half{width:50%}.wide{width:100%}.image-center{display:block;margin-inline:auto}.image-right,.image-left{display:inline-block;vertical-align:middle;margin-right:.5rem;filter:invert(50%);width:1.5rem;height:auto}.image-right{margin-left:.5rem}.float-right{float:right;margin:0 1rem 1rem}.invert-50{filter:invert(50%) sepia(75%) saturate(25%)}.block-pad-1{padding-block:1rem}.task-list{list-style:none;padding:0;margin:0;& li{line-height:1.5;& input[type=checkbox]{pointer-events:none}}}.grid{display:grid;grid-template-rows:auto;gap:20px;&.x4{grid-template-columns:repeat(4,1fr)}&.x3{grid-template-columns:repeat(3,1fr)}&.x2{grid-template-columns:repeat(2,1fr)}&:is(.x2.img,.x3.img,.x4.img)>img{display:block;width:100%;height:auto}}.mono{font-family:monospace}.date{font-family:monospace;color:var(--date-color);line-height:1.5}[disabled]{opacity:.5;cursor:not-allowed!important}span.icon,button.icon{background-color:transparent;border:0;padding:0;display:inline-block;vertical-align:middle;&:before{content:"";display:inline-block;width:1rem;height:1rem;background-size:contain;background-repeat:no-repeat;vertical-align:middle;margin-right:.25rem;filter:invert(50%)}&.red:before{filter:invert(100%)}&.reply-icon:before{background-image:url(/theme/icons/comment-plus.svg)}&.like-icon:before{background-image:url(/theme/icons/star.svg)}&.view-icon:before{background-image:url(/theme/icons/eye.svg)}&.read-icon:before{background-image:url(/theme/icons/book-open-reader.svg)}&.like-icon.liked:before{background-image:url(/theme/icons/star-solid.svg);filter:invert(77%) sepia(69%) saturate(1066%) hue-rotate(359deg) brightness(102%) contrast(104%)}&.share-api-icon:before{background-image:url(/theme/icons/arrow-up-from-bracket.svg)}&.delete-icon:before{background-image:url(/theme/icons/trash.svg)}&.edit-icon:before{background-image:url(/theme/icons/comment-pen.svg)}&.approve-icon{&:before{background-image:url(/theme/icons/comment-check.svg)}}}button.icon{cursor:pointer;&:hover{background-color:transparent;border:0;color:var(--link-base-color)}&:hover:before{filter:invert(75%)}&:before{width:2.25rem;height:2.25rem;margin-right:.25rem}}.container{width:100%;height:100dvh;margin:0 auto;overflow:auto;z-index:1}.page-header{position:sticky;top:0;margin:0 auto;width:var(--content-width);height:var(--header-height);backdrop-filter:blur(20px);z-index:1;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-areas:"nav-home nav-search details";align-items:center;gap:20px;.nav-home{grid-area:nav-home;justify-self:start;& a{display:block}& svg{color:var(--text-color);width:125px;height:auto;display:block;transition:color var(--transition-time) ease-in-out}&:hover svg{color:var(--link-base-color);cursor:pointer}}.details{grid-area:details;text-align:right;.site-title{font-size:2.5em}}}.nav-left,.nav-right{--content-offset: calc(50dvw - (var(--content-width) / 2) - var(--next-prev-width));position:absolute;top:calc(50% - (var(--next-prev-height) / 2));width:var(--next-prev-width);align-self:center;line-height:1;user-select:none;& a{color:var(--text-color);transition:color var(--transition-time) ease-in-out;&:hover{color:var(--link-base-color)}}& svg{width:100%;height:auto}&.end{opacity:.25}}.nav-left{left:var(--content-offset)}.nav-right{text-align:right;right:var(--content-offset)}main{grid-area:main;justify-content:center;width:100%;min-height:calc(100dvh - (var(--header-height) + var(--footer-height)));& article{width:calc(var(--content-width) - 200px);max-width:100dvw;margin:0 auto;font-size:1.25em;.headline{margin-block:40px;& h1{line-height:1;text-wrap:balance;&.title{margin:0;font-size:2.5em}}.subhead{margin-top:.5em;display:flex;flex-wrap:wrap;align-items:center;gap:20px}.dateline{font-size:.85em;color:var(--subtle-text-color)}}.content{padding-bottom:40px;overflow-wrap:break-word;& p{line-height:1.5}.comment-excerpt,.comment-content{line-height:1.25;margin-bottom:0}& img{max-width:100%;height:auto}& img.full,img.hero{width:100%;height:auto;max-height:calc(100dvh - (var(--header-height) + var(--footer-height)));object-fit:contain;display:block}.rounded,.rounded img{border-radius:var(--radius, .25rem)}}.video-container{position:relative;width:100%;padding-bottom:56.25%;.video-iframe{position:absolute;top:0;left:0;width:100%;height:100%}}.pagination-info{line-height:1.5;& span{margin-left:1.25rem;font-size:.85em;color:var(--subtle-text-color)}}.headline-icon{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.5em;& svg{display:block;width:1em;height:auto;opacity:.25}}}}.page-footer{position:sticky;bottom:0;margin:0 auto;align-content:end;width:var(--content-width);height:var(--footer-height);.legal{text-align:center;padding:15px;font-size:.85em;color:var(--subtle-text-color)}.nav-left,.nav-right,.nav-search{display:none}}.container.more .page-footer{background-color:var(--page-background-color);&:before{content:"";position:absolute;top:-100px;left:0;right:0;height:100px;background:linear-gradient(to bottom,var(--footer-gradient-0) 0%,var(--footer-gradient-1) 100%);pointer-events:none}}.nav-search{grid-area:nav-search;justify-self:center;text-wrap:nowrap}.post-page{& main{place-content:center}.details{line-height:1.25}.author{font-weight:700}.post-footer{margin-top:40px;.closed{font-size:.9rem;color:var(--subtle-text-color)}}.post-meta,.comment-meta{width:100%;display:grid;grid-auto-columns:max-content;grid-auto-flow:column;justify-content:space-between;>*:not(:first-child):not(:last-child){margin:0 auto}& button.icon,button.icon:before{transition:all var(--transition-time) ease-in-out}& span{color:var(--subtle-text-color)}}.comment-meta{margin-top:20px;& button.icon:before{height:1.5rem;width:1.5rem}}}.search-page,.home-page{--thumb-width: 200px;--thumb-height: 200px;--list-gap: 40px;& main{place-content:center}.headline{display:grid;grid-template-columns:auto 1fr;align-items:center;>:nth-child(2){justify-self:end;text-align:right}}.content{& ul{list-style:none;padding:0;& li{display:grid;grid-template-columns:var(--thumb-width) 1fr;align-items:start;gap:20px}}.post-list{column-width:325px;column-gap:var(--list-gap);>*{break-inside:avoid;margin-bottom:var(--list-gap)}.post-item-details{display:flex;flex-direction:column;gap:.25rem;.date{font-size:.8em}}.post-thumbnail{height:var(--thumb-height);overflow:hidden;& img{width:100%;height:100%;object-fit:cover;object-position:center center;&.landscape{object-fit:contain;object-position:top center}&.portrait{object-fit:cover;object-position:center center}}.empty{display:grid;place-items:center;width:var(--thumb-width);height:var(--thumb-height);background-image:linear-gradient(45deg,#ff8a00,#e52e71,#8a2be2,#007cf0);animation:cycleHueFilter 20s linear infinite;& img{width:50%;height:auto;opacity:.25;filter:invert(100%)}}}.post-stats{justify-content:flex-start;font-size:.65em}}.post-list a.post-title{font-size:1.25em}}}@keyframes cycleHueFilter{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}@media (max-height: 900px),(max-width: 900px){.home-page,.search-page{--thumb-width: 125px;--thumb-height: 94px;--list-gap: 20px}}.post-stats{display:flex;flex-flow:row;gap:.75rem;justify-content:flex-end;color:var(--subtle-text-color);align-items:center;.unpub{color:red}}.post-page .details .post-stats{font-size:.85rem}.categories{font-size:.85em}@media (width <= 1300px){:root{--body-font-size: .85rem;--content-width: 100dvw;--footer-height: 120px}.page-header{position:relative;grid-template-columns:auto 1fr;.nav-home{padding-left:var(--mobile-padding)}.details{padding-right:var(--mobile-padding)}}main article{width:auto;.headline,section footer,section>div>*:not(:has(img.hero)){margin-inline:var(--content-margin)}& section>div *:has(img.hero){margin-inline:0}}.page-footer{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"nav-left nav-search nav-right" "legal legal legal";align-items:center;.nav-left{grid-area:nav-left;left:var(--mobile-padding)}.nav-right{grid-area:nav-right;right:var(--mobile-padding)}.legal{grid-area:legal;& span{text-wrap:nowrap}}.nav-search,.nav-left,.nav-right{top:auto;display:block}}.nav-search,.nav-left,.nav-right{display:none;position:relative}}@media (width <= 700px){:root{--body-font-size: .8rem;--header-height: 80px}.search-bar{gap:10px}.page-header{position:relative;.nav-home svg{width:100px}}main article{width:auto;.headline,section footer,section>div>*:not(:has(img.hero)){margin-inline:var(--mobile-padding)}.headline{& h1.title{font-size:2em}}& section>div>*:has(img.hero){margin-inline:0}}.nav-left,.nav-right{& svg{width:calc(var(--next-prev-width) / 1.5)}}}@media (width <= 550px){.search-bar form input[type=text]{width:3rem}}@media (width <= 400px){.search-bar{.show-explore{display:none}}}.comments{margin-top:2em;>a{margin-inline:0!important}}.article-heading{font-size:1.5em;color:var(--subtle-text-color);margin-bottom:1em}.comment:not(.token),.search-comment{background-color:var(--comment-background-color);border:1px solid var(--comment-border-color);border-radius:8px;padding:1rem;margin-top:1rem;transition:box-shadow .3s ease;overflow-wrap:break-word}.comment-author-box{display:grid;grid-template-columns:auto 1fr;gap:10px;font-weight:700}.comment-info{color:var(--subtle-text-color);display:grid;grid-template-columns:auto 1fr;gap:20px;margin-bottom:10px;>div:last-child{font-size:.85em;text-align:right}.comment-detail{white-space:nowrap}}.comment-author-box .gravatar,.search-comment .gravatar{width:40px;height:40px;border-radius:.25em;margin-right:10px;display:inline-block;vertical-align:middle}.search-comment .gravatar{float:left;width:50px;height:50px;margin-right:15px}kbd,samp,code{background-color:var(--dialog-background-color);border-radius:.25rem;padding-inline:.5rem}pre:has(>code){position:relative;background-color:var(--dialog-title-background-color);padding-top:40px;border:1px solid var(--input-border-color);border-radius:.25rem;font-size:1rem;line-height:1.5;margin:20px 0;overflow-x:auto;white-space:pre-wrap;code{background-color:var(--code-background-color);padding:15px;display:block;white-space:pre-wrap;word-wrap:break-word;border-top-left-radius:0;border-top-right-radius:0;&:focus{outline:none}}&:before{font-family:system-ui,sans-serif;content:"Example";position:absolute;top:7px;left:15px}&[data-language]:before{content:attr(data-language)}.copy-btn{position:absolute;top:7px;right:15px;padding:.15rem .25rem;font-size:.9rem}}table{border-collapse:collapse;margin-bottom:1rem;overflow-x:auto;display:block;& th,td{padding:.75rem;border:1px solid var(--input-border-color);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}& th{background-color:var(--input-background-color);font-weight:600;cursor:pointer}.sort-asc:after{content:" \25b2";color:var(--link-base-color);font-size:.8em}.sort-desc:after{content:" \25bc";color:var(--link-base-color);font-size:.8em}& th:first-child,td:first-child{padding-left:1rem}& th:last-child,td:last-child{padding-right:1rem}@media (width <= 700px){display:block;overflow-x:auto;th,td{white-space:nowrap;font-size:.875rem;padding:.5rem}}}.dialog-header{display:grid;grid-template-columns:auto 1fr auto;gap:15px;margin-bottom:15px}.dialog-form:has(form) .dialog-header{margin-bottom:0}.dialog-title{width:100%;display:block;text-align:center;background-color:var(--dialog-title-background-color);padding:.5rem;border-radius:.25rem;font-weight:700}body.admin-mode dialog,.dialog-form{color:var(--text-color);background-color:var(--dialog-background-color);border:2px solid var(--input-border-color);border-radius:.25rem;font-size:1.25rem;padding:1rem;text-wrap:nowrap;width:var(--content-width);& form{display:grid;gap:15px;& label:not(.plain){position:relative;display:block;& span{display:none}&:has(input:not(:placeholder-shown)) span,&:has(textarea:not(:placeholder-shown)) span{display:block;position:absolute;scale:.66;top:-.25rem;right:.1rem;color:var(--subtle-text-color)}}& textarea{margin-top:1.5rem;min-height:6rem;height:13rem;resize:both;font-family:unset;max-width:100%;min-width:100%}}&::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:var(--dialog-backdrop-color)}}#toast{position:fixed;top:unset;left:unset;bottom:-100px;right:30px;padding:1rem;font-size:1.25rem;color:var(--text-color);background-color:var(--toast-background-color);border:2px solid var(--link-base-color);border-radius:.25rem;transition:bottom .3s ease-out}#toast.show{bottom:30px}p:has(a>img.video){position:relative;display:inline-block;&:has(.hero,.wide,.full){display:block!important}& a:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0000004d;display:flex;align-items:center;justify-content:center;pointer-events:none}& a:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 576 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M550 124c-7-24-25-42-49-49-42-11-213-11-213-11S117 64 75 75c-24 7-42 25-49 49-11 43-11 132-11 132s0 90 11 133c7 23 25 41 49 48 42 11 213 11 213 11s171 0 213-11c24-7 42-25 49-48 11-43 11-133 11-133s0-89-11-132zM232 338V175l143 81-143 82z' fill='rgba(255,255,255,1)'/%3E%3C/svg%3E");background-size:contain;background-repeat:no-repeat;pointer-events:none}& a:hover:before{background-color:#00000026}& img{display:block}}#contactDialog,#addComment{width:fit-content;min-width:min(100dvw - var(--mobile-padding) * 2,600px);max-width:calc(100dvw - var(--mobile-padding) * 2);& textarea{min-width:100%}.name-email{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;align-items:center}.info-bullets{text-wrap:wrap}}.explore-cats{& summary{display:inline;text-align:center;display:flex;justify-content:center;align-items:center;font-size:2rem;margin-block:1rem;cursor:default;gap:.5rem;& span{cursor:pointer;transition:color var(--transition-time) ease-in-out;&:hover{color:var(--link-base-color)!important}}&::marker{content:none}&::-webkit-details-marker{display:none}&:after{content:"\25b2";color:var(--link-base-color);font-size:1.5rem;rotate:90deg;margin-top:4px;transition:rotate var(--transition-time) ease-in-out,color var(--transition-time) ease-in-out}& h2{line-height:1;display:inline-block;transition:color var(--transition-time) ease-in-out;&:hover{color:var(--link-base-color)!important}}}&[open] summary:after{rotate:180deg}.button-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--mobile-padding);& button{font-size:.8em;position:relative;text-align:left;& span{color:var(--link-base-color);position:absolute;top:.5em;right:.5em;font-size:.8em;transition:color var(--transition-time) ease-in-out}&:hover span{color:var(--text-color-inverse)}}}}.post-page .explore-cats{padding-top:2rem}