.bass-gate-length{display:grid;justify-items:center;gap:8px;padding:14px 0;margin:10px 0;border-top:1px solid var(--tone-8acbd933,#8acbd933);border-bottom:1px solid var(--tone-8acbd933,#8acbd933)}.bass-gate-length>span{font-size:9px;letter-spacing:.13em;color:var(--tone-9fb8c3,#9fb8c3)}.bass-gate-length output{color:var(--bass);font-size:12px}.bass-gate-length-dial{--turn:0deg;position:relative;width:46px;height:46px;box-sizing:border-box;border:2px solid var(--tone-8acbd966,#8acbd966);border-radius:50%;background:radial-gradient(circle at 30% 25%,var(--tone-516975,#516975),var(--tone-243745,#243745) 65%,var(--tone-15232c,#15232c));box-shadow:0 3px 9px var(--tone-0006,#0006),inset 0 1px var(--tone-ffffff33,#ffffff33);cursor:ns-resize;touch-action:none}.bass-gate-length-dial:after{content:'';position:absolute;inset:4px;border-radius:50%;background:linear-gradient(var(--bass),var(--bass)) center top/3px 11px no-repeat;transform:rotate(var(--turn));filter:drop-shadow(0 0 3px var(--tone-8acbd966,#8acbd966))}.bass-gate-length-dial:hover{border-color:var(--bass)}.bass-gate-length-dial:focus-visible{outline:2px solid var(--bass);outline-offset:4px}.bass-gate-length.rest{opacity:.5}