:root{color-scheme:light dark;--light-base: 98%;--dark-base: 20%;--theme-c: .005;--theme-h: 150;--bg-html: light-dark(oklch(calc(var(--light-base) - 16%) var(--theme-c) var(--theme-h)), oklch(var(--dark-base) var(--theme-c) var(--theme-h)));--color-html: light-dark(oklch(25% var(--theme-c) var(--theme-h)), oklch(95% var(--theme-c) var(--theme-h)));--bg-header: light-dark(oklch(calc(var(--light-base) - 5%) var(--theme-c) var(--theme-h)), oklch(calc(var(--dark-base) - 5%) var(--theme-c) var(--theme-h)));--bg-btn: light-dark(oklch(calc(var(--light-base) - 13%) var(--theme-c) var(--theme-h)), oklch(calc(var(--dark-base) - 8%) var(--theme-c) var(--theme-h)));--color-btn: var(--color-html);--bg-btn-hover: light-dark(oklch(calc(var(--light-base) - 10%) var(--theme-c) var(--theme-h)), oklch(calc(var(--dark-base) - 4%) var(--theme-c) var(--theme-h)));--color-btn-hover: var(--color-html);--bg-btn-active: light-dark(oklch(calc(var(--light-base) - 23%) var(--theme-c) var(--theme-h)), oklch(calc(var(--dark-base) + 14%) var(--theme-c) var(--theme-h)));--color-btn-active: light-dark(var(--color-html), oklch(100% var(--theme-c) var(--theme-h)));--bg-circle: var(--bg-btn);--color-chart-text: var(--color-html);--btn-focus-ring: light-dark(oklch(calc(var(--light-base) - 28%) var(--theme-c) var(--theme-h)), oklch(calc(var(--dark-base) + 21%) var(--theme-c) var(--theme-h)))}:root:has(#theme-toggle:checked){color-scheme:dark}*{box-sizing:border-box;margin:0}html{font-family:system-ui,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:var(--color-html);background-color:var(--bg-html);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1{font-size:2rem;font-weight:700;line-height:1}.wrapper{width:min(100% - 2rem,900px);margin-inline:auto}.header{background-color:var(--bg-header);text-align:center;padding:1.5em 0}.footer{padding:.5em 0 1em}.footer-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem}.chart-button{font-size:1rem;font-weight:600;color:var(--color-btn);background-color:var(--bg-btn);padding:.8em 2em;border-radius:.5em;text-decoration:none;border:1px solid var(--bg-btn);cursor:pointer;transition:background-color .3s ease,border-color .3s ease}.chart-button:visited{color:inherit}.chart-button:not(.chart-button-active):hover{color:var(--color-btn-hover);background-color:var(--bg-btn-hover);border-color:var(--bg-btn-hover)}.chart-button-active{color:var(--color-btn-active);background-color:var(--bg-btn-active);border-color:var(--bg-btn-active)}.chart{overflow-x:auto;scrollbar-width:thin}.chart-header-row,.chart-data-row{display:grid;grid-template-columns:repeat(9,100px);min-width:max-content;justify-content:center;align-items:center;padding-block:.35em}.chart-header-row{padding-block-start:0}.chart-data-row{position:relative}.horizontal-line{position:absolute;top:50%;left:12%;width:76%;height:4px;transform:translateY(-50%);z-index:-1}.chart-cell{position:relative;display:grid;justify-content:center;align-items:center;min-height:50px}.chart-cell.framework-name{justify-self:end}.chart-cell:last-child{justify-self:start}.chart-circle{position:relative;background-color:var(--bg-circle);height:50px;width:50px;border-radius:50%;border:4px solid;z-index:1}.chart-text{color:var(--color-chart-text)}@media(max-width:768px){.wrapper{width:min(100%,900px)}}