:root{--brand-hue: 200;--sat-mul: 0;--light-offset: 0%;--font-color: whitesmoke;--brand: hsl(var(--brand-hue), calc(10% * var(--sat-mul)), 50%);--accent: darkcyan;--cell-hue: 200;--dark0: hsl( var(--brand-hue), calc(5% * var(--sat-mul)), calc(5% + var(--light-offset)) );--dark1: hsl( var(--brand-hue), calc(5% * var(--sat-mul)), calc(10% + var(--light-offset)) );--dark2: hsl( var(--brand-hue), calc(5% * var(--sat-mul)), calc(15% + var(--light-offset)) );--dark3: hsl(var(--brand-hue), 50%, calc(20% + var(--light-offset)));--dark4: hsl(var(--brand-hue), 50%, calc(25% + var(--light-offset)));--dark5: hsl(var(--brand-hue), 50%, calc(30% + var(--light-offset)));--black0: #000000;--black1: #0d0d0d;--black2: var(--dark1);--black3: var(--dark2);--black4: var(--dark3);--black5: var(--dark4);--black6: var(--dark5);--black7: #666666;--black8: #777777;--black9: #888888;--blue1: #1a1b4c;--blue2: #202160;--blue3: #262773;--blue4: #2c2e87;--blue5: #31349b;--blue6: #373aae;--radius: .25rem}*{scrollbar-width:thin}html,body{padding:0;margin:0;height:max(100%,100vh)}html{background-color:var(--dark2);color:var(--font-color);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;transition:background-color .1s linear}body>*{flex:1 1 0}button:not(.unstyled){font-size:1.2rem;background-color:var(--dark5);border:.2rem solid var(--dark4);color:var(--font-color);padding:.75rem;border-radius:var(--radius);transition:background-color .1s linear,border-color .1s linear;cursor:pointer}button:hover:not(.unstyled){background-color:var(--dark4)}button:active:not(.unstyled){border:.2rem solid var(--dark5)}button:disabled:not(.unstyled){background-color:var(--dark3);border:.2rem solid var(--dark4);cursor:not-allowed}dialog{align-items:center;flex-direction:column;color:var(--font-color);border:.1rem solid var(--font-color);background-color:var(--dark3);border-radius:var(--radius)}dialog::backdrop{background-color:#0000004d}dialog:modal{display:flex}.buttons-container{margin-top:2rem;display:flex;justify-content:center;gap:1rem}@media screen and (max-width: 500px){.buttons-container{flex-direction:column}}.buttons-container>button{flex:1 1 0;width:15rem}
