:root{--background-color: hsl(220, 15%, 5%);--text-color-primary: hsl(219, 14%, 71%);--text-color-secondary: hsl(220, 2%, 61%);--text-color-highlight: hsl(0, 0%, 95%);--button-color-primary: hsl(220, 15%, 5%);--button-color-hover: hsl(0 0% 0% / .75);--button-color-inset-hover: hsl(0 0% 100% / .8);--border-color: grey;--border-color-highlight: rgb(255 255 255 / .1);--border-color-base: rgba(0, 0, 0, .7);--color-twitch: hsl(264, 100%, 64%);--color-youtube: hsl(0, 80%, 50%);--color-codeberg: hsl(206, 73%, 47%);--color-brand: hsl(94, 81%, 58%);--color-kofi: hsl(223, 82%, 72%);--color-success: hsl(120, 70%, 45%);--color-error: hsl(0, 70%, 50%);--color-status-done: rgb(33, 158, 24);--color-status-untested: rgb(211, 133, 31);--color-status-planned: rgb(233, 88, 44);--surface-1: hsl(210 23% 12% / .7);--surface-2: rgb(26 29 33 / .9);--surface-3: rgb(104 107 110 / .1);--surface-footer: rgb(31, 41, 55);--hover-surface: hsl(210 11% 18% / .5);--space-xxl: 2rem;--space-xl: 1.5rem;--space-l: 1rem;--space-md: .5rem;--space-sm: .25rem;--space-xs: .125rem;--radius-xxl: 2rem;--radius-m: .5rem;--radius-sm: .25rem;--line-height-md: 1.5;--line-height-sm: 1;--line-height-xs: .75;--font-size-xl: 1.5rem;--font-size-l: 1rem;--font-size-md: .875rem;--font-size-sm: .75rem;--font-size-xs: .5rem;--font-weight-bolder: 900;--font-weight-bold: 700;--font-weight-regular: 500}*,*:before,*:after{box-sizing:border-box}body,h1,h2,h3,h4,h5,h6,p,ol,ul,figure,blockquote,dl,dd{margin:0;padding:0}a{text-decoration:none;color:inherit}ul,ol{list-style:none}img,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit;color:inherit}details{position:relative}summary{list-style:none;cursor:pointer;::-webkit-details-marker{display:none}}html{font-size:var(--font-size-l);line-height:var(--line-height-md)}body{font-family:Roboto,sans-serif;color:var(--text-color-primary);line-height:var(--line-height-md);font-weight:var(--font-weight-regular)}h1{font-weight:var(--font-weight-bold);font-size:var(--font-size-xl);line-height:var(--line-height-md);color:var(--text-color-highlight)}h2{font-weight:var(--font-weight-bold);font-size:var(--font-size-xl);color:var(--text-color-highlight)}h3{font-weight:var(--font-weight-bold);font-size:var(--font-size-md);color:var(--text-color-highlight)}p{text-align:justify}.text-eyebrow{font-size:var(--font-size-sm);line-height:var(--line-height-xs);font-weight:var(--font-weight-bolder);letter-spacing:.15px;text-transform:uppercase}.textcolor-primary{color:var(--text-color-primary)}.textcolor-secondary{color:var(--text-color-secondary)}.textcolor-highlight{color:var(--text-color-highlight)}.textcolor-brand{color:var(--color-brand)}.hidden{display:none!important}.flex-center{display:flex;align-items:center;justify-content:center}.icon{width:1em;height:1em;flex-shrink:0}.icon--s{font-size:.875rem}.icon--m{font-size:1.25rem}.icon--l{font-size:1.5rem}.fill-white{fill:#fff}.fill-transparent{fill:transparent}.flow{display:grid;gap:var(--space-md)}.app{display:grid;grid-template-columns:200px 1fr;gap:var(--space-md);padding:var(--space-md)}.page-layout{min-block-size:100vh;display:grid;grid-template-rows:auto minmax(0,1fr) auto;padding:var(--space-xs)}body{background-color:var(--background-color)}.app-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background-color:var(--background-color);padding:var(--space-md)}.app-header__left{justify-self:start}.app-header__center{justify-self:center}.app-header__right{justify-self:end}.app-header__logo{width:4rem;height:4rem}.app-header__menubar{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-xl);>li{display:flex;align-items:center;justify-content:center;gap:var(--space-l)}}.app-header__wordmark{font-size:3rem;font-weight:var(--font-weight-bold);text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.app-footer{padding-block:var(--space-xl);padding-inline:var(--space-sm);text-align:start;font-size:var(--font-size-md);color:var(--text-color-primary);background-color:var(--surface-footer);border-top:1px solid #555}.layout-unrestricted{width:50%;margin:var(--space-xxl) auto;>section{display:grid;gap:var(--space-l);padding:var(--space-xxl) var(--space-xl);margin:var(--space-xxl) auto}}.heading--section{margin-bottom:var(--space-l);border-bottom:1px solid rgba(255,255,255,.1);padding-bottom:var(--space-md);text-align:center}.social-links{display:flex;flex-wrap:wrap;gap:var(--space-sm);justify-content:space-evenly;padding:var(--space-l) var(--space-xs);.button{width:12rem;height:3.5rem;font-size:var(--font-size-sm);font-weight:var(--font-weight-bolder);letter-spacing:.15px}}.link--underline:hover,.link--underline:focus-visible{text-decoration-line:underline}.link--icon{display:flex;gap:var(--space-md);align-items:center}.box{background-color:var(--surface-1);padding:var(--space-md);border:2px solid var(--border-color-base);border-radius:var(--radius-m);box-shadow:0 4px 8px #0000004d,0 2px 4px #0003}.box--raised{backdrop-filter:blur(6px)}.box--flat{box-shadow:none;border:none}.box--layer2{background-color:var(--surface-2);border-radius:var(--radius-sm);border:1px solid var(--border-color-highlight)}.box--layer3{background-color:var(--surface-3);gap:var(--space-md);border-radius:var(--radius-sm)}.button{--button-bg: var(--button-color-primary);--button-fg: var(--text-color-primary);--button-border: var(--border-color)}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-md);padding:var(--space-md) var(--space-l);background-color:var(--button-bg);color:var(--button-fg);font-size:var(--font-size-md);border:1px solid var(--button-border);border-radius:var(--radius-m);cursor:pointer;text-decoration:none;transition:background-color .2s ease,border-color .2s ease,color .2s ease;&:hover{--button-bg: var(--button-color-hover)}}.button--pill{border-radius:var(--radius-xxl)}.button--round{aspect-ratio:1;padding:0;border-radius:50%}.button--icon{width:2.5rem;height:2.5rem;display:inline-flex;align-items:center;justify-content:center}.button--icon-s{width:1rem;height:1rem}.button--brand-twitch{&:hover{--button-border: var(--color-twitch)}}.button--brand-youtube{&:hover{--button-border: var(--color-youtube)}}.button--brand-codeberg{&:hover{--button-border: var(--color-codeberg)}}.button--brand-kofi{&:hover{--button-border: var(--color-kofi)}}.button--size-xl{padding:var(--space-l) var(--space-xl)}.button--size-m{padding:var(--space-md) var(--space-l)}.button--size-sm{padding:var(--space-xs) var(--space-xs)}.button--color-primary{background-color:var(--button-color-primary)}.function-list{--status-color: grey}.function-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:var(--space-l);padding-top:var(--space-sm)}.function-item{display:flex;flex-direction:column}.function-status{color:var(--status-color);margin-bottom:var(--space-sm);padding-inline:var(--space-md)}.function-description{flex-grow:1;padding:var(--space-md);border-radius:var(--radius-sm);background-color:var(--surface-3);line-height:var(--line-height-sm);font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--text-color-secondary)}.status--done{--status-color: var(--color-status-done)}.status--untested{--status-color: var(--color-status-untested)}.status--planned{--status-color: var(--color-status-planned)}.modal{color:var(--text-color-primary);border:none;&::backdrop{background:var(--surface-1);backdrop-filter:blur(1px)}}.modal__header{display:flex;justify-content:flex-end;line-height:var(--line-height-sm)}.modal__content{display:grid;gap:var(--space-md);padding:var(--space-xxl) var(--space-xl)}.user-menu{&:hover>.user-menu__trigger{background-color:var(--button-color-hover)}}.user-menu__trigger{display:inline-flex;align-items:center;justify-content:center;padding:0;aspect-ratio:1;width:2.5rem;height:2.5rem;background-color:var(--button-color-primary);color:var(--text-color-primary);font-size:var(--font-size-md);border:1px solid var(--border-color);border-radius:50%;cursor:pointer;text-decoration:none;transition:background-color .2s ease,border-color .2s ease,color .2s ease}.user-menu__menu{position:absolute;z-index:1000;background-color:var(--surface-2);border-radius:var(--space-sm);padding:var(--space-md);margin-top:var(--space-sm);box-shadow:0 4px 8px #0000004d,0 2px 4px #0003;right:var(--space-xs);top:100%;width:16rem}.user-menu__section{display:grid;grid-template-columns:1fr}.user-menu__header{display:flex;gap:var(--space-md);align-items:center;padding:var(--space-sm);margin-bottom:var(--space-md);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu__item{align-items:center;padding:var(--space-sm);border-radius:var(--radius-sm);&:hover{background-color:var(--hover-surface)}}.table{width:100%;border-collapse:collapse;font-size:var(--font-size-md);line-height:var(--line-height-md);th,td{padding:var(--space-sm) var(--space-md)}th{text-align:left;border-bottom:2px solid var(--border-color-highlight)}td{vertical-align:top}}.flash-container{position:fixed;display:flex;gap:1rem;justify-content:center;align-items:center;bottom:0;width:100%;z-index:50;border:1px solid;border-top-left-radius:5rem;border-top-right-radius:5rem;padding:.75rem;box-shadow:0 2px 6px #0000001a;font-family:system-ui,sans-serif;transform:translateY(100%);opacity:0;transition:transform .25s ease-out,opacity .2s ease-out;&.is-visible{transform:translateY(0);opacity:1}}.flash-info{background-color:#ecfdf5;color:#065f46;border-color:#10b981}.flash-error{background-color:#fef2f2;color:#9f1239;border-color:#f43f5e}.flash-title{font-weight:600;font-size:.875rem;line-height:1.5rem}.flash-message{font-size:.875rem;line-height:1.25rem}.flash-close{position:absolute;top:.25rem;right:2rem;padding:.5rem;background:transparent;border:none;cursor:pointer;opacity:.4;transition:opacity .2s}.flash-close:hover{opacity:.7}