body,body.dark{--bg:#121212;--fg:#e5e5e5;--key-bg:#818384;--key-fg:#fff;--color-absent:#3a3a3c;--border:#3a3a3c;--option-bg:#3a3a3a;--popup-bg:rgba(48,48,48,.333)}body * img,body.dark * img{filter:invert()!important}body * img:hover,body.dark * img:hover{filter:invert(0)!important}body #github-logo,body.dark #github-logo{filter:none!important}body.light{--bg:#f0f0f0;--fg:#000;--key-bg:#818384;--key-fg:#f0f0f0;--color-absent:#818181;--border:#818181;--option-bg:#818181;--popup-bg:rgba(136,136,136,.333)}body.light * img{filter:invert(0)!important}body.light * img:hover,body.light #github-logo{filter:invert()!important}#options{flex-direction:column;gap:15px;display:flex;position:fixed;top:.5rem;right:.5rem}.option{z-index:5;background:rgba(255,255,255,0);border:2px solid rgba(255,255,255,.4);border-radius:8px;justify-content:center;align-items:center;width:60px;height:60px;transition:all .3s;display:flex}.option:hover:not(:disabled){background:var(--option-bg);cursor:pointer;border-color:rgba(255,255,255,0)}.option>img{width:50px;transition:all .3s}:root{--container-width:clamp(280px,90vw,500px);--key-width:calc(var(--container-width)*.08);--key-width-wide:calc(var(--container-width)*.15);--key-height:calc(var(--container-width)*.128);--grid-max-width:clamp(300px,80vw,800px);--tile-size:calc(var(--grid-max-width)/18);--tile-gap:4px;--font-size-tile:clamp(.8rem,2.5vw,1.8rem);--font-size-key:calc(var(--container-width)*.042);--key-gap:4px}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-items:center;min-height:100vh;margin:0;padding:0;display:flex;overflow-x:visible;overflow-y:hidden}.hidden{opacity:0!important}.wrap{box-sizing:border-box;flex-direction:column;align-items:center;width:100%;max-width:100vw;min-height:100vh;padding:1rem;display:flex}main{width:100%;max-width:var(--grid-max-width);box-sizing:border-box;flex-direction:column;align-items:center;min-height:100vh;margin:0 auto;padding:1rem 0;display:flex}@media (prefers-color-scheme:dark){html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}
