*,:before,:after{box-sizing:border-box}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#242424;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{height:100dvh;margin:0}#app{place-items:center;width:min(100%,147.439dvh);height:100%;margin:0 auto;display:grid;container-type:inline-size}.circuit-board{grid-template-columns:repeat(6,1fr);gap:.25cqw;width:100%;height:min(100%,67.8247cqw);font-size:1cqw;display:grid}.loading-overlay{z-index:10000;color:#ffffffde;background-color:#000000e6;flex-direction:column;justify-content:center;align-items:center;font-size:1.2rem;display:flex;position:fixed;inset:0}.loading-overlay.hidden{display:none}.loading-spinner{border:4px solid #fff3;border-top-color:#ffffffde;border-radius:50%;width:48px;height:48px;margin-bottom:1rem;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{margin-top:.5rem}.settings-row{grid-area:1/1/auto/-2}.buttons{grid-column:-2/-1;justify-content:flex-end;align-items:flex-start;gap:1em;display:flex;container-type:inline-size}dip-switch{aspect-ratio:2.25;--n-bits:8;flex:1 1 0;min-width:0;font-family:system-ui;display:inline-block;container-type:inline-size}dip-switch .fieldset{height:100%;padding:.25em calc(100%/(var(--n-bits)*2 + 1));color:#fff;background:#1e57c8;border:0;border-radius:3cqw;flex-direction:column;align-items:flex-start;margin:0;display:flex;position:relative}dip-switch .legend{letter-spacing:.1em;opacity:.8;text-transform:uppercase;display:contents}dip-switch .legend:before{content:"";background:#fffc;width:1em;height:2cqw;display:block;position:absolute;top:0}dip-switch .row{justify-content:space-between;align-items:flex-start;gap:2%;width:100%;height:100%;display:flex}dip-switch .switch{cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;flex:1 1 0;align-items:center;height:100%;display:flex;position:relative}dip-switch .input{opacity:0;position:absolute}dip-switch .switch:before{content:"";background:#ffffff1a;border-radius:2cqw;flex:1 1 0;width:100%;box-shadow:inset 0 0 0 .5cqw #ffffff40}dip-switch .switch:after{content:"";aspect-ratio:1;background:#fff;border-radius:1cqw;width:75%;transition:transform .12s;position:absolute;top:1cqw;transform:translateY(14cqw)}dip-switch .switch:has(.input:checked):after{transform:translateY(0)!important}dip-switch .switch:has(.input:focus-visible):before{outline-offset:.8cqw;outline:.8cqw solid #fffc}dip-switch.red-switch .fieldset{background:#c81e1e}dip-switch:is(.expert-focus,.expert-highlight) .fieldset{filter:brightness(125%)contrast(300%)}dip-switch.red-switch:is(.expert-focus,.expert-highlight) .fieldset{filter:brightness(150%)contrast(400%)grayscale(10%)}dip-switch-group{grid-template-columns:subgrid;grid-column:1/-1;display:grid}tactile-button{--button-color:black;--button-size:25cqw;--casing-thickness:calc(var(--button-size)*.1);--button-recess:calc(var(--button-size)*.04);--rivet-size:calc(var(--button-size)*.08);--rivet-inset:calc(var(--button-size)*.175);display:inline-block}tactile-button .tact-container{flex-direction:column;align-items:center;display:flex}tactile-button .tact-casing-outer{width:var(--button-size);height:var(--button-size);border-radius:calc(var(--button-size)*.1);padding:var(--casing-thickness);background:#1a1a1a;position:relative;box-shadow:0 .01in .02in #0000004d}tactile-button .tact-casing-inner{border-radius:calc((var(--button-size) - var(--casing-thickness)*2)*.1);width:100%;height:100%;padding:var(--button-recess);background:linear-gradient(135deg,silver 0%,#a0a0a0 100%);place-items:center;display:grid;box-shadow:inset 0 .005in .01in #ffffff80,inset 0 -.005in .01in #0000004d}tactile-button .tact-button{background:var(--button-color);cursor:pointer;-webkit-user-select:none;user-select:none;border:none;border-radius:50%;width:75%;height:75%;padding:0;transition:transform 50ms,box-shadow 50ms;box-shadow:inset 0 .01in .02in #ffffff20,0 .005in .01in #0003}tactile-button .tact-button:disabled{cursor:not-allowed;opacity:.5}tactile-button .tact-button:active{transform:translateY(.01in);box-shadow:inset 0 .01in .02in #0000004d,0 .002in .005in #0000001a}tactile-button .tact-button:focus-visible{outline-offset:.2em;border-radius:.05in;outline:.1em solid #fffc}tactile-button .tact-casing-outer:before,tactile-button .tact-casing-outer:after,tactile-button .tact-casing-inner:before,tactile-button .tact-casing-inner:after{content:"";width:var(--rivet-size);height:var(--rivet-size);background:#1a1a1a;border-radius:99px;position:absolute}tactile-button .tact-casing-outer:before{top:var(--rivet-inset);left:var(--rivet-inset)}tactile-button .tact-casing-outer:after{top:var(--rivet-inset);right:var(--rivet-inset)}tactile-button .tact-casing-inner:before{bottom:var(--rivet-inset);left:var(--rivet-inset)}tactile-button .tact-casing-inner:after{bottom:var(--rivet-inset);right:var(--rivet-inset)}tactile-button .tact-label{letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;pointer-events:none}
