@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";:root{--system-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;--main-font-family: Inter, var(--system-font-family);--mono-font-family: "IBM Plex Mono", Menlo, Monaco, "Cascadia Code", Consolas, "Courier New", Courier, monospace;--headline-font-family: var(--main-font-family);--border-width: 1px;--border: var(--border-width) solid var(--border-color);--border-radius: 12px;--widget-border-radius: 9px;--transition: .25s;--fg: rgb(var(--rgb-fg));--fg-secondary: rgb(var(--rgb-fg-secondary));--fg-deeper: rgb(var(--rgb-fg-deeper));--bg: rgb(var(--rgb-bg));--bg-secondary: rgb(var(--rgb-bg-secondary));--border-color: rgb(var(--rgb-border-color));--error-fg: firebrick;--error-bg: mistyrose;--error-border: firebrick;--transition: .0625s;color:var(--fg);background-color:var(--bg)}@media(prefers-color-scheme:light){:root{--accent: royalblue;--accent-secondary: rgb(230, 240, 255);--rgb-fg: 51, 51, 51;--rgb-fg-secondary: 153, 153, 153;--rgb-fg-deeper: 0, 0, 0;--rgb-bg: 255, 255, 255;--rgb-bg-secondary: 238, 238, 238;--rgb-border-color: 221, 221, 221;--btn-fg: var(--fg);--btn-bg: var(--bg);--btn-bg-hover: var(--bg-secondary);--btn-bg-active: rgb(204, 204, 204);--modal-overlay-bg: rgba(0, 0, 0, .325);--input-fg: var(--fg);--input-bg: #eeeeee;--input-bg-hover: #f3f3f3;--input-bg-focus: #ffffff;--btn-shadow: none;--btn-shadow-active: none;--input-shadow: none;--element-shadow: 0px 2px 8px rgba(255, 255, 255, .5), 0px 2px 8px rgba(0, 0, 0, .5), 0px 2px 2px rgba(255, 255, 255, .5) inset, 0px -2px 2px rgba(255, 255, 255, .5) inset, 0px -8px 8px rgba(0, 0, 0, .125) inset;--selector-list-item-bg-selected: rgba(0, 0, 0, .08);--selector-list-item-bg-hover: rgba(0, 0, 0, .06);--selector-list-item-bg-active: rgba(0, 0, 0, .1);--selector-list-item-bg-highlight: var(--accent);--selector-list-item-bg-drag-over: rgba(0, 0, 0, .25);color-scheme:light}}@media(prefers-color-scheme:dark){:root{--accent: #dee6ff;--accent-secondary: royalblue;--rgb-fg: 255, 255, 255;--rgb-fg-secondary: 153, 153, 153;--rgb-fg-deeper: 255, 255, 255;--rgb-bg: 20, 20, 20;--rgb-bg-secondary: 40, 40, 40;--rgb-border-color: 51, 51, 51;--btn-fg: var(--fg);--btn-bg: var(--bg);--btn-bg-hover: rgb(62, 62, 62);--btn-bg-active: rgb(30, 30, 30);--modal-overlay-bg: rgba(0, 0, 0, .5);--input-fg: rgb(255, 255, 255);--input-bg: rgb(34, 34, 34);--input-bg-hover: var(--bg-secondary);--input-bg-focus: rgb(51, 51, 51);--btn-shadow: none;--btn-shadow-active: none;--input-shadow: none;--element-shadow: 0px 2px 8px rgba(0, 0, 0, .75), 0px 4px 16px rgba(0, 0, 0, .5), 0px 2px 8px rgba(255, 255, 255, .25) inset, 0px -2px 8px rgba(255, 255, 255, .25) inset, 0px -8px 8px rgba(0, 0, 0, .75) inset;--selector-list-item-bg-selected: rgba(255, 255, 255, .12);--selector-list-item-bg-hover: rgba(255, 255, 255, .08);--selector-list-item-bg-active: rgba(255, 255, 255, .06);--selector-list-item-bg-highlight: var(--accent);--selector-list-item-bg-drag-over: rgba(0, 0, 0, .5);color-scheme:dark}}*{box-sizing:border-box}*.no-animations *{animation:none!important;transition:0!important;scroll-behavior:unset!important}html,body{width:100%;height:100%;margin:0;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;background:#ccc;font-family:var(--main-font-family);font-size:14px;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;line-height:1.5;overscroll-behavior-x:none}#root{width:100%;height:100%;margin:auto;padding:0;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:0rem;color:var(--fg);background:var(--bg);overflow:hidden;overflow-y:auto}main{width:100%;margin:0;padding:0;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start}.app-font-size-xs{font-size:.7rem}.app-font-size-s{font-size:.8rem}.app-font-size-m{font-size:.9rem}.app-font-size-l{font-size:1rem}.app-font-size-xl{font-size:1.1rem}pre,code{font-family:var(--mono-font-family)}blockquote,.card{width:100%;margin:0;padding:.5rem 1rem;display:inline-flex;flex-flow:column;place-items:flex-start;background:var(--bg-secondary);border-radius:var(--border-radius)}blockquote{padding:1.25rem;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.5rem}blockquote:before{content:"NOTE";color:var(--accent);font-weight:700;letter-spacing:2px;-webkit-user-select:none;user-select:none}blockquote p{margin:0;padding:0}.card h2{margin:0rem 0rem .5rem;padding:0}.card blockquote{margin-block:1.5rem;background:var(--bg)}.card .card-list{padding:.75rem 0rem}footer{width:100%;margin:0;bottom:0;padding-block:1rem 3rem;display:inline-flex;flex-flow:column;align-items:center;justify-content:center;gap:0;color:var(--fg);font-size:1rem}a{font-weight:500;color:var(--accent);text-decoration:underline}a:hover{color:var(--fg)}@media(prefers-color-scheme:dark){a{color:var(--accent-secondary)}a:hover{color:var(--accent)}}button{padding:.35rem .75rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:.25rem;color:var(--btn-fg);background:var(--btn-bg);box-shadow:var(--btn-shadow);border:var(--border);border-radius:var(--widget-border-radius);font-size:inherit;font-weight:700;font-family:inherit;white-space:nowrap;cursor:default;transition:var(--transition)}button:hover{background:var(--btn-bg-hover);transition:var(--transition)}button:is(:active,.active){background:var(--btn-bg-active);box-shadow:var(--btn-shadow-active);transition:var(--transition)}button:is(:focus,:focus-visible){outline:4px auto var(--accent);transition:var(--transition)}button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none;transition:var(--transition)}button button svg{width:18px;height:18px}select,textarea,input:is([type=text],[type=search],[type=url]){width:100%;padding:.5rem .75rem;color:var(--input-fg);background:var(--input-bg);box-shadow:var(--input-shadow);border:var(--border);font-family:inherit;font-size:inherit;font-weight:inherit;transition:var(--transition)}:is(select,input:is([type=text],[type=search],[type=url])){border-radius:var(--widget-border-radius)}:is(select,input:is([type=text],[type=search],[type=url])):hover{background:var(--input-bg-hover);transition:var(--transition)}:is(select,textarea,input:is([type=text],[type=search],[type=url])):focus{background:var(--input-bg-focus);outline:4px auto var(--accent);transition:var(--transition)}:is(select,textarea,input:is([type=text],[type=search],[type=url])):disabled{filter:brightness(.9);opacity:.5;cursor:not-allowed;pointer-events:none;transition:var(--transition)}textarea{min-height:64px;border-radius:var(--border-radius);resize:vertical}select{-webkit-user-select:none;user-select:none}hr{width:100%;border:none;border-bottom:1px solid var(--border-color)}ul,ol{display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.5rem}ul ul,ul ol,ol ul,ol ol{padding-left:1rem}.page{max-width:800px;width:100%;margin:0 auto;padding:3rem 1rem;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:1rem}.page h2{width:100%;margin-block:1rem;margin-inline:auto;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;font-family:var(--headline-font-family);font-size:3rem;font-weight:700;text-align:center}.page h3,.page h4{font-family:var(--headline-font-family)}.page ul.directory-grid{list-style:none;width:100%;margin:0;padding:0;display:inline-grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));align-items:flex-start;justify-content:flex-start;gap:1rem}.page ul.directory-grid>li{padding:1.5rem;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.5rem;background:var(--bg);border:1px solid var(--border-color);border-radius:var(--border-radius);transition:.2s;-webkit-user-select:none;user-select:none}.page ul.directory-grid>li:hover{box-shadow:0 4px 12px #00000020}@media(prefers-color-scheme:dark){.page ul.directory-grid>li:hover{box-shadow:0 4px 12px #ffffff40}}@media(max-width:768px){.page{padding-inline:2rem}}.site{font-size:1.1rem}hr{margin-block:2.5rem 1rem}.content{width:100%;height:auto;margin:0;padding:1.5rem}.content :is(h1,h2){width:100%;text-align:center}.content :is(h3,h4,h5){width:100%;margin-block:.5rem 0rem;text-align:left}:is(.content,.page-content) h2{margin-block:.5rem 2rem;font-size:48px}:is(.content,.page-content) h3{font-size:28px}:is(.content,.page-content) h4{font-size:24px}.page-content{width:100%;margin:0 auto;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:0}.page-content :is(ul,ol){margin-block:1rem;margin-inline:0;padding-inline:1rem 0rem;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:flex-start;gap:.75rem}.page-content :is(ul,ol) li{padding-inline:.5rem 0rem}.page-content :is(ul,ol) :is(ul,ol){margin-inline:1rem 0rem}p{margin-block:.75rem}sub.timestamp{color:var(--fg-secondary);font-size:16px}#marquee-img{width:100%;margin:0;margin-block:1.5rem;padding:0;position:relative;display:block}#marquee-img img{width:100%;margin:0;position:relative;display:block;border-radius:var(--border-radius);-webkit-user-drag:none}#headline-screenshot{width:100%;height:321px;margin:0;margin-block:0rem 1.5rem;padding:0;position:relative;display:inline-flex;flex-flow:column;align-items:center;justify-content:flex-start}#headline-screenshot:after{content:"";width:100%;height:100%;margin:0;padding:0;position:absolute;background:linear-gradient(to bottom,rgba(var(--rgba-bg),1),rgba(var(--rgba-bg),.25),#0000)}#headline-screenshot img{max-width:320px;width:100%;height:320px;margin:0 auto;position:relative;object-fit:cover;object-position:bottom;border-radius:0 0 var(--border-radius) var(--border-radius);-webkit-user-drag:none;animation:HeadlineScreenshotSlideIn 1s ease-in forwards;transition:.2s}@keyframes HeadlineScreenshotSlideIn{0%{height:0px}70%{height:320px}75%{height:340px}80%{height:310px}90%{height:330px}95%{height:315px}to{height:320px}}.gif-frame,#gif-frame{width:100%;margin-block:1rem .5rem;padding:0;border-radius:var(--border-radius)}.gif-frame img,#gif-frame img{width:100%}header{z-index:100;width:100%;margin:0 auto;top:0;padding:0;float:top;position:sticky;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:.5rem}header .header-content{width:100%;margin:0;padding:.25rem 1.25rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:space-between;gap:.5rem;background:var(--bg);transition:.2s}header .header-content .title-home-link{width:max-content;margin:0;padding:.75rem 0rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:.75rem;color:var(--fg);text-decoration:none}header .header-content .title-home-link h1{width:max-content!important;margin:0;padding:0;display:inline-block;font-family:"Rubik Mono One",var(--system-font-family);font-size:24px;font-weight:800;letter-spacing:-.03rem;line-height:1;white-space:nowrap}header .header-content .title-home-link .app-icon{width:24px;height:24px;margin:0!important;padding:0!important;display:inline-block;filter:drop-shadow(0px 2px 4px rgba(0,0,0,.125))}header .header-content button.nav-menu-btn{width:48px;height:48px;margin:0;padding:.75rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;color:var(--fg);background:none;border:none;border-radius:64px}header .header-content button.nav-menu-btn:hover{background:var(--bg-secondary);box-shadow:var(--element-shadow)}header .header-content button.nav-menu-btn:active{color:var(--bg);background:var(--fg)}header .header-content button.nav-menu-btn:focus{outline:none}nav{width:max-content;margin:0;padding:0;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:1rem}nav ul{list-style:none;width:max-content;margin:0;padding:0;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:.25rem}nav ul li{margin:0;padding:0;display:inline-flex;flex-flow:row;align-items:center;justify-content:center}nav ul li a{height:100%;margin:0;padding:.5rem 1rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;color:var(--fg-secondary);border-radius:64px;font-size:1rem;font-weight:700;text-align:center;text-decoration:none;letter-spacing:-.0125rem;transition:.2s}nav ul li a:hover{color:var(--fg);background:var(--bg-secondary)}nav ul li a:active{color:var(--fg)}nav ul li a.active{color:var(--fg);background:var(--bg-secondary)}nav .kofi-btn img{height:32px!important;border-radius:64px}@media(max-width:768px){nav .kofi-btn img{height:64px!important;border-radius:64px}}nav:not(.compact){display:inline-flex;flex-flow:row;align-items:center;justify-content:flex-end;gap:1rem}nav.compact{z-index:100;width:100%;height:100%;margin:0;top:0;padding:.75rem;position:fixed;display:inline-flex;flex-flow:column;align-items:center;justify-content:flex-start;gap:.25rem;background:var(--bg);overflow:auto}nav.compact nav.compact .store-shortcut-container{max-width:640px;box-shadow:0 4px 8px #00000040}nav.compact ul{width:100%;height:max-content;margin-block:1rem 3rem;padding:0;flex-flow:column;align-items:center;justify-content:center;gap:.5rem;background:none}nav.compact ul li{width:100%;display:inline-block}nav.compact ul li a{width:100%;display:inline-block;color:var(--fg-secondary);background:none;border:none;font-size:36px;font-weight:700;text-align:center;transition:.2s}nav.compact ul li a:hover{color:var(--fg);background:var(--bg-secondary);transition:.2s}nav.compact ul li a:is(.active,:active){color:var(--accent);transition:.2s}@media(prefers-color-scheme:dark){nav.compact ul li a:is(.active,:active){color:var(--accent-secondary)}}nav.compact button.nav-close-btn{width:48px;height:48px;margin-block:0;margin-inline:auto 0rem;padding:.25rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;color:var(--fg);background:none;border:none;border-radius:64px}nav.compact button.nav-close-btn:hover{background:var(--bg-secondary);box-shadow:var(--element-shadow)}nav.compact button.nav-close-btn:active{color:var(--bg);background:var(--fg)}nav.compact button.nav-close-btn:focus{outline:none}nav.compact .kofi-btn{width:100%;padding:1rem}nav.compact .kofi-btn img{height:54px}@media(max-width:781px){header .title-home-link h1{display:none}}:is(header,nav) button svg{width:100%;height:100%;margin:0;padding:0;display:block}.app-icon{width:128px;height:128px;margin:0;padding:0}.app-icon img{width:100%;height:100%;margin:auto;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;transition:var(--transition)}.app-icon img:hover{scale:1.05;transition:.25s;animation:.5s AppIconHover infinite alternate}.app-icon img:active{scale:.95;transition:.5s;animation:.1s AppIconActive forwards ease-in}@keyframes AppIconHover{0%{scale:1.05;rotate:-1deg}50%{rotate:1deg}to{scale:1.025;rotate:-1deg}}@keyframes AppIconActive{0%{scale:1.05;rotate:1deg}to{scale:.95;rotate:0deg}}.store-shortcut-container{--transition: .25s;width:100%;margin:0;padding:1rem;position:relative;display:inline-grid;grid-template-columns:repeat(2,1fr);gap:1rem;border:1px solid var(--bg-secondary);border-radius:var(--border-radius)}.store-shortcut-container a.store-shortcut{width:100%;margin:0;padding:1.5rem;position:relative;display:inline-flex;flex-flow:column;align-items:center;justify-content:center;gap:0rem;color:var(--accent);background:var(--accent-secondary);border-radius:var(--border-radius);text-decoration:none;-webkit-user-drag:none;transition:var(--transition)}.store-shortcut-container a.store-shortcut:hover{color:var(--bg);background:var(--fg)}.store-shortcut-container a.store-shortcut:active{color:var(--bg);background:var(--fg-secondary)}.store-shortcut-container a.store-shortcut .store-shortcut-label{width:max-content;margin:0;padding:.5rem 1.5rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:.5rem;border-radius:64px;font-weight:700}.store-shortcut-container a.store-shortcut .store-shortcut-browser{margin:0;padding-block:.5rem 1rem;padding-inline:.25rem}.store-shortcut-container a.store-shortcut .store-shortcut-browser svg{width:52px;height:52px;margin:0;padding:0;display:block}.store-shortcut-container a.store-shortcut .store-shortcut-version{font-size:1.25rem;font-weight:700}@media(max-width:480px){.store-shortcut-container{display:inline-flex;flex-flow:column;font-size:1.5rem}}.kofi-btn{height:max-content;margin:0;padding:0;display:inline-flex;flex-flow:row;align-items:center;justify-content:center;-webkit-user-drag:none;-webkit-user-select:none;user-select:none}.kofi-btn img{height:36px;margin:0;padding:0;display:inline-block;border:none;-webkit-user-drag:none;-webkit-user-select:none;user-select:none}.kofi-btn:hover{filter:brightness(.9)}.kofi-btn:active{filter:brightness(.8)}.blog-page ul.directory-grid{list-style:none;width:100%;margin-block:2rem;padding:0;display:inline-grid;grid-template-columns:1fr;grid-auto-rows:auto;gap:1rem}.blog-page ul.directory-grid>li:first-child{grid-column:1 / -1}@media(min-width:768px){.blog-page ul.directory-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.blog-page ul.directory-grid>li:first-child{grid-column:1 / -1}}.blog-page ul.directory-grid li{height:100%}.blog-page ul.directory-grid li .title{font-family:var(--headline-font-family);font-size:24px}.blog-page ul.directory-grid li .title a{font-weight:700}.blog-page ul.directory-grid li .tagline{font-size:inherit}.blog-page ul.directory-grid li .timestamp{color:var(--fg-secondary)}.breadcrumbs{width:max-content;margin:0;padding:1rem 1.5rem;display:inline-flex;flex-flow:row;align-items:center;justify-content:flex-start;gap:.25rem;font-size:90%}.breadcrumbs.narrow{font-size:80%}.breadcrumbs a{font-weight:400;text-decoration:none}.breadcrumbs a:hover{text-decoration:underline}.breadcrumbs a.active{color:var(--fg);font-weight:700;pointer-events:none}.breadcrumbs svg{width:18px;height:18px;color:var(--fg-secondary)}.blog-post-page{max-width:720px}.blog-post-page .blog-back-navigation a{display:inline-flex;flex-flow:row;align-items:center;justify-content:center;gap:.5rem;color:var(--accent)}.blog-post-page .blog-post-header{width:100%;margin-block:2.5rem 0rem;margin-inline:0;padding:0;display:inline-flex;flex-flow:column;align-items:flex-start;justify-content:center;gap:.5rem;text-align:center}.blog-post-page .blog-post-header h2{width:100%;margin:0 auto;font-size:3.5rem;text-align:center}.blog-post-page .blog-post-header .tagline{width:100%;margin:.25rem 0rem;color:var(--fg-secondary);font-size:2rem;font-weight:300;text-align:center}.blog-post-page .blog-post-header .timestamp{margin:0 auto;color:var(--fg-secondary);text-align:center}.blog-post-page .blog-post-content{font-size:1.25rem;line-height:1.75}.blog-post-page .blog-post-content h3{width:100%;margin-block:3rem 1rem;margin-inline:auto;font-size:2.5rem;text-align:center}.blog-post-page .blog-post-content p{margin-block:1.5rem}@media(max-width:640px){.blog-post-page .blog-post-header h2{font-size:2.75rem}.blog-post-page .blog-post-header .tagline{font-size:1.5rem}}.blog-post-page img{max-width:100%;border:1px solid var(--fg);border-radius:var(--border-radius)}.blog-post-page blockquote{margin-block:1.5rem 2rem}
