.key{--face:var(--key-white);--face-hover:var(--key-white-hover);--label:var(--on-white);background:var(--face);height:34px;box-shadow:var(--key-shadow);color:var(--label);font:500 14px/1 var(--font-sans);white-space:nowrap;cursor:pointer;user-select:none;transition:background-color var(--instant) linear, top var(--instant) linear, box-shadow var(--instant) linear;border:0;border-radius:4px;justify-content:center;align-items:center;gap:8px;padding:0 16px;text-decoration:none;display:inline-flex;position:relative;top:0}.key:hover{background:var(--face-hover)}.key:active,.key[aria-pressed=true]{box-shadow:var(--pressed-shadow);top:1px}.key--black{--face:var(--key-black);--face-hover:var(--key-black-hover);--label:var(--on-black)}.key--orange{--face:var(--orange);--face-hover:var(--orange-hover);--label:var(--on-orange,#fff)}.key--ghost{--face:transparent;--face-hover:var(--key-grey);box-shadow:none}.key--ghost:active{box-shadow:none}.key--icon{width:34px;padding:0}.key--small{height:28px;padding:0 12px;font-size:13px}.key[aria-disabled=true],.key:disabled{--face:var(--key-grey);--face-hover:var(--key-grey);--label:var(--muted);box-shadow:none;cursor:default;top:0}.key svg{flex:none;width:15px;height:15px}.led{background:var(--led-off);width:6px;height:6px;transition:background-color var(--instant) linear, box-shadow var(--instant) linear;border-radius:50%;flex:none;display:inline-block}.led[data-lit=true]{background:var(--orange);box-shadow:0 0 6px 1px color-mix(in srgb, var(--orange) 55%, transparent)}.led[data-tone=green][data-lit=true]{background:var(--ok,#3fbf5f);box-shadow:0 0 6px 1px color-mix(in srgb, var(--ok,#3fbf5f) 50%, transparent)}.silk{color:var(--muted);font:500 10px/1.2 var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.index{color:var(--orange-text);font:500 13px/1 var(--font-mono)}.tag{background:var(--key-grey);height:20px;color:var(--ink);font:400 11px/1 var(--font-mono);border-radius:2px;align-items:center;padding:0 7px;display:inline-flex}.tag--ink{background:var(--ink);color:var(--page)}.tag--orange{background:var(--orange);color:var(--on-orange,#fff)}.display{background:var(--display);box-shadow:var(--display-shadow);color:var(--display-ink);border-radius:6px}.display__legend{color:var(--display-label);font:500 10px/1.2 var(--font-mono);letter-spacing:.1em;text-transform:uppercase}.digits{font-family:var(--font-display);letter-spacing:.04em;font-size:28px;line-height:1;display:inline-block;position:relative}.digits:before{content:attr(data-ghost);color:var(--display-dim);position:absolute;inset:0}.digits>span{position:relative}.meter{gap:3px;display:flex}.meter>i{background:var(--display-dim);border-radius:1px;width:4px;height:14px}.meter>i[data-lit=true]{background:var(--display-ink)}.window{background:var(--display);box-shadow:var(--display-shadow);border-radius:3px;overflow:hidden}.pixelated{image-rendering:pixelated}.faceplate{border:1px solid var(--hairline);background:var(--panel);box-shadow:var(--panel-shadow);border-radius:6px;position:relative}.screws{pointer-events:none;position:absolute;inset:0}.faceplate:before,.faceplate:after,.faceplate>.screws:before,.faceplate>.screws:after{content:"";border:1.5px solid var(--screw);border-radius:50%;width:7px;height:7px;position:absolute}.faceplate:before{top:9px;left:9px}.faceplate:after{top:9px;right:9px}.faceplate>.screws:before{bottom:9px;left:9px}.faceplate>.screws:after{bottom:9px;right:9px}.table{border-collapse:collapse;border-top:1px solid var(--ink);width:100%}.table th,.table td{border-bottom:1px solid var(--hairline);text-align:left;vertical-align:baseline;padding:11px 0;font-size:14px}.table th{color:var(--muted);font-weight:400}.table td{font-family:var(--font-mono);text-align:right}.segments{gap:8px;display:inline-flex}.segment{justify-items:center;gap:7px;display:grid}.segment .key{height:28px;padding:0 12px;font-size:13px}.segment .key[aria-pressed=true]{font-weight:700}.fader{color:var(--ink);font:400 14px var(--font-sans);cursor:pointer;background:0 0;border:0;align-items:center;gap:10px;padding:4px 0;display:inline-flex}.fader__slot{background:var(--key-black);border-radius:2px;width:40px;height:4px;position:relative}.fader__cap{background:var(--key-white);width:16px;height:16px;box-shadow:var(--key-shadow);transition:transform var(--quick) var(--ease-out-quint);border-radius:50%;position:absolute;top:50%;left:0;transform:translateY(-50%)}.fader[aria-checked=true] .fader__cap{transform:translate(24px,-50%)}