html{background-color:#eee}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-accent: hsla(212, 68%, 46%, .8);--color-text: hsla(0, 0%, 0%, .8);--color-text-secondary: hsla(0, 0%, 0%, .4);--color-back-main: hsla(0, 0%, 95%, .6);--color-shadow: hsla(0, 0%, 0%, .1);--color-border-default: hsla(0, 0%, 0%, .1);--color-border-light: hsla(0, 0%, 100%, .8);--color-back-default: hsla(0, 0%, 100%, .6);--color-back-hover: hsla(0, 0%, 100%, .95);--color-back-active: hsla(0, 0%, 100%, .4);--color-back-press: hsla(0, 0%, 0%, .06);--color-back-pot: hsla(0, 0%, 0%, .05);--shadow-line: 0 1px 0 var(--color-shadow);--border-default: 0 0 0 1px hsla(0, 0%, 100%, .1);--border-light: 0 1px 0 inset var(--color-border-light);--border-hover: 0 0 0 1px var(--color-accent);--border-accent: 0 0 0 3px var(--color-accent);--transition-long: all .4s;--transition-short: all .15s;color:var(--color-text)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}@media (prefers-color-scheme: dark){html{background-color:#111}body{--color-accent: hsla(212, 81%, 58%, .8);--color-text: hsla(0, 0%, 100%, .8);--color-text-secondary: hsla(0, 0%, 100%, .4);--color-back-main: hsla(0, 0%, 15%, .8);--color-border-light: hsla(0, 0%, 100%, .1);--color-back-default: hsla(0, 0%, 100%, .1);--color-back-hover: hsla(0, 0%, 100%, .15);--color-back-active: hsla(0, 0%, 100%, .06);--color-back-press: hsla(0, 0%, 0%, .15);--color-back-pot: hsla(0, 0%, 0%, .2);--border-hover: 0 0 0 1px var(--color-accent)}}*{color:var(--color-text);accent-color:var(--color-accent);scrollbar-width:none;border:none;outline:none;font-family:LXGW Neo XiHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}h1,h2{margin:0;font-weight:400;user-select:none}h1{font-size:1.5rem}h2{font-size:1rem}button{padding:.75rem 1rem;border-radius:.5rem;font-size:1.25rem;cursor:pointer;user-select:none;background-color:var(--color-back-default);box-shadow:var(--shadow-line),var(--border-light);transition:var(--transition-long)}button:hover{background-color:var(--color-back-hover);transition:var(--transition-short)}button:active{scale:.96;background-color:var(--color-back-active);transition:var(--transition-short),scale .04s}.switch{display:flex;align-items:center;padding:.5rem;padding-inline:.75rem;border-radius:.5rem;font-size:1.125rem;transition:var(--transition-long);*{pointer-events:none}}.switch:hover{background-color:var(--color-back-default);transition:var(--transition-short)}.switch:active{background-color:var(--color-back-press)}input{appearance:none;min-width:0;padding:.5rem;border-radius:.5rem;font-size:1rem;background-color:var(--color-back-pot);box-shadow:var(--border-default);transition:var(--transition-long)}input[type=number]{padding-left:2rem;box-sizing:border-box;width:11.5rem}input:hover{box-shadow:var(--border-hover);transition:var(--transition-short)}input:focus{box-shadow:var(--border-accent)}input[type=checkbox]{margin:0;margin-right:.75rem;border-radius:50%;background-color:var(--color-back-pot)}input[type=checkbox]:checked{border-radius:.25rem;rotate:135deg;background-color:var(--color-accent)}input[type=number]{-moz-appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{appearance:none}input[type=range]{padding:0;border-radius:1rem}input[type=range]:focus{box-shadow:var(--border-hover)}.full-box{display:grid;height:100%;width:100%}.icon{box-sizing:border-box;position:absolute;translate:5px 5px;height:25px;width:25px;padding:3px;border-radius:4px;cursor:w-resize;transition:var(--transition-long);fill:var(--color-text-secondary)}.icon:hover{background-color:var(--color-back-hover);transition:var(--transition-short)}