.mode-tuner{height:128px;overflow:hidden;border-top:1px solid var(--line);background:linear-gradient(90deg,var(--bg-03),var(--blue-bg-02) 50%,var(--bg-03));color:var(--lime-fg-03)}
.mode-tuner svg{display:block;width:100%;height:128px}
.mode-pot-ring{fill:var(--fg-05);stroke:var(--fg-11);stroke-width:2}.mode-pot-face{fill:var(--fg-08);stroke:var(--fg-16);stroke-width:1.5}.mode-pot-indicator{transform:rotate(-125deg);transform-origin:96px 61px}.mode-pot-indicator path{stroke:var(--blue-fg-03);stroke-width:3;stroke-linecap:round}.mode-pot-indicator circle{fill:var(--blue-fg-03)}.mode-pot-detents{fill:none;stroke:var(--fg-14);stroke-width:2;stroke-linecap:round}.mode-pot text{fill:var(--fg-37);font:700 11px/1 Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:.18em;text-anchor:middle}
.tuner-track>path:first-child{fill:none;stroke:var(--fg-10);stroke-width:2}
.tuner-progress{fill:none;stroke:url(#tunerSignal);stroke-width:2;stroke-dasharray:914;stroke-dashoffset:914}
.tuner-tick path{stroke:var(--fg-16);stroke-width:2}.tuner-tick text{fill:var(--fg-21);font:700 14px/1 Inter,ui-sans-serif,system-ui,sans-serif;letter-spacing:.16em;text-anchor:middle}
.tuner-needle{color:var(--blue-fg-03);transform:translateX(0);transform-origin:278px 65px}.tuner-needle>circle:not(.tuner-halo){fill:currentColor}.tuner-needle>path{stroke:currentColor;stroke-width:3;stroke-linecap:round}.tuner-halo{fill:none;stroke:currentColor;stroke-width:2;opacity:.32}
.tuner-lock{opacity:0;stroke:var(--lime-fg-03);stroke-width:3;stroke-linecap:round;filter:url(#tunerGlow)}
.mode-tuner.is-tuning .mode-pot-indicator{animation:potTurn 3.1s cubic-bezier(.3,.7,.2,1) forwards}.mode-tuner.is-tuning .tuner-progress{animation:tunerProgress 3.1s cubic-bezier(.3,.7,.2,1) forwards}.mode-tuner.is-tuning .tuner-needle{animation:tunerSweep 3.1s cubic-bezier(.3,.7,.2,1) forwards}.mode-tuner.is-tuning .tuner-tick text,.mode-tuner.is-tuning .tuner-tick path{animation:tunerTick 3.1s linear forwards}.mode-tuner.is-tuning .tuner-tick:nth-of-type(2) text,.mode-tuner.is-tuning .tuner-tick:nth-of-type(2) path{animation-delay:.55s}.mode-tuner.is-tuning .tuner-tick:nth-of-type(3) text,.mode-tuner.is-tuning .tuner-tick:nth-of-type(3) path{animation-delay:1.15s}.mode-tuner.is-tuning .tuner-evn text,.mode-tuner.is-tuning .tuner-evn path{animation:tunerEvn 3.1s ease forwards}.mode-tuner.is-tuning .tuner-lock{animation:tunerLock .5s 3.05s ease forwards}
.mode-tuner.is-complete .mode-pot-indicator{transform:rotate(125deg)}.mode-tuner.is-complete .mode-pot-indicator path{stroke:var(--lime-fg-03)}.mode-tuner.is-complete .mode-pot-indicator circle{fill:var(--lime-fg-03)}.mode-tuner.is-complete .tuner-progress{stroke-dashoffset:58}.mode-tuner.is-complete .tuner-needle{transform:translateX(802px);color:var(--lime-fg-03)}.mode-tuner.is-complete .tuner-evn text{fill:var(--lime-fg-03)}.mode-tuner.is-complete .tuner-evn path{stroke:var(--lime-fg-03)}.mode-tuner.is-complete .tuner-lock{opacity:1}
@keyframes potTurn{0%{transform:rotate(-125deg)}23%{transform:rotate(-42deg)}48%{transform:rotate(42deg)}72%{transform:rotate(82deg)}88%,100%{transform:rotate(125deg)}}
@keyframes tunerSweep{0%{transform:translateX(0);color:var(--blue-fg-03)}23%{transform:translateX(255px)}48%{transform:translateX(510px)}72%{transform:translateX(668px)}88%,100%{transform:translateX(802px);color:var(--lime-fg-03)}}
@keyframes tunerProgress{0%{stroke-dashoffset:914}23%{stroke-dashoffset:659}48%{stroke-dashoffset:404}72%{stroke-dashoffset:246}88%,100%{stroke-dashoffset:58}}
@keyframes tunerTick{0%,18%,100%{fill:var(--fg-21);stroke:var(--fg-16)}4%,12%{fill:var(--blue-fg-06);stroke:var(--blue-fg-03)}}
@keyframes tunerEvn{0%,78%{fill:var(--fg-21);stroke:var(--fg-16)}88%,100%{fill:var(--lime-fg-03);stroke:var(--lime-fg-03)}}
@keyframes tunerLock{from{opacity:0;transform:scaleY(.5)}to{opacity:1;transform:scaleY(1)}}
@media(max-width:700px){.mode-tuner{height:112px}.mode-tuner svg{height:112px}.mode-pot{transform:translateX(-20px) scale(.88);transform-origin:96px 61px}.tuner-track{transform:translateX(-105px) scaleX(1.08);transform-origin:center}.tuner-needle{transform-origin:173px 65px}.mode-tuner.is-tuning .tuner-needle{animation-name:tunerSweepMobile}.mode-tuner.is-complete .tuner-needle{transform:translateX(867px)}}
@keyframes tunerSweepMobile{0%{transform:translateX(-105px);color:var(--blue-fg-03)}23%{transform:translateX(170px)}48%{transform:translateX(445px)}72%{transform:translateX(616px)}88%,100%{transform:translateX(867px);color:var(--lime-fg-03)}}
@media(prefers-reduced-motion:reduce){.mode-tuner *{animation:none!important}}