body{color-scheme:light dark;margin:0;color:#eee;height:100vh;overflow:hidden;user-select:none;font-family:Arial,Helvetica,sans-serif}canvas{width:100vw;height:100vh;box-sizing:border-box;background:#000;color:#eee;image-rendering:pixelated;transition:opacity .5s}canvas.q{pointer-events:none;opacity:0}.w{display:none}.e{position:relative;height:100vh;width:100vw;overflow:hidden;display:grid;place-items:center}.e>*{position:absolute}.r{height:100vh;width:100vw;overflow:hidden;background-color:#000;--t: .7}svg{fill:#fff}button>svg{fill:#333}.y{--u: .3s;transition:opacity var(--u),transform var(--u);opacity:var(--t, 1)}.y:not(.i){pointer-events:none}.y.o.t{opacity:0}.y.o.p{transform:translateY(var(--p, 100%))}.y.a{display:none;visibility:hidden}.s{background-color:#311010e6;width:max(50%,300px);padding:8px;--p: 12px}.s header{text-align:center;font-size:1.6em;margin:8px}.s header p{margin:4px}.s footer{text-align:center;margin-top:16px;font-size:1em}.s main{display:grid;grid-template-columns:1fr 1fr;gap:12px}.s header.d{text-align:center;font-size:1.3em}.f{border:2px solid #363636;background:#565656;padding:4px;font-size:1.1em;cursor:pointer;transition:background-color .2s;color:inherit}.f:hover{background:#3a3a3a}.g{min-height:34px;background:#2c2c2c;display:grid;place-items:center;padding-left:4px;padding-right:4px;position:relative;overflow:hidden;cursor:pointer}.g .h{--j: 50%;--k: 16px;pointer-events:none;width:100%;height:100%;border-left:var(--k) solid #737373;transform:translate(min(calc(100% - var(--k) - var(--k)),max(calc(var(--j) - var(--k)),0px)))}.g .l{position:absolute;text-align:center;pointer-events:none}.z{text-align:center;opacity:.7;font-size:.9em;user-select:text}.x{align-self:start;justify-self:end;background-color:#000000b3;margin:8px;padding:4px;border-radius:4px;display:grid;gap:4px;grid-template-areas:"icon range" "buttons buttons"}.x>.c{grid-area:buttons;display:flex;justify-content:space-evenly}.x>.c>*{cursor:pointer;padding:2px;aspect-ratio:1/1}.v{font-family:monospace;align-self:flex-start;justify-self:start;padding:4px;pointer-events:none}.v.b{display:none}.v .n{margin:0}.v .n>span{display:inline-block;padding:2px 4px;background-color:#000a}.v table{background-color:#000a}.v td:not(:first-child){padding-left:8px;font-variant-numeric:tabular-nums;min-width:6ch;text-align:end}.v .n>span:first-child:after{content:":"}
