@property --fmk-x{syntax:"<number>";inherits:true;initial-value:.34}@property --fmk-y{syntax:"<number>";inherits:true;initial-value:.24}.furin-metal-knob{--fmk-d:140px;--fmk-accent:#ffb13b;--fmk-grain:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='240'%20height='240'%3E%3Cfilter%20id='g'%20x='0'%20y='0'%20width='100%25'%20height='100%25'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.012%200.9'%20numOctaves='2'%20seed='5'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20type='matrix'%20values='0.33%200.33%200.33%200%200%200.33%200.33%200.33%200%200%200.33%200.33%200.33%200%200%200%200%200%200%201'/%3E%3CfeComponentTransfer%3E%3CfeFuncR%20type='linear'%20slope='2.2'%20intercept='-0.6'/%3E%3CfeFuncG%20type='linear'%20slope='2.2'%20intercept='-0.6'/%3E%3CfeFuncB%20type='linear'%20slope='2.2'%20intercept='-0.6'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23g)'/%3E%3C/svg%3E");display:inline-flex;user-select:none;flex-direction:column;align-items: center}.furin-metal-knob--off{opacity:.55;filter:grayscale(.6)}.furin-metal-knob__dial{position:relative;width:var(--fmk-w);height:var(--fmk-w);display:grid;isolation:isolate;place-items: center}.furin-metal-knob__scale{position:absolute;overflow:visible;width:100%;height:100%;inset:0}.furin-metal-knob__tick{stroke:#3a3f47;stroke-width:1.4;stroke-linecap:round;transition:stroke .18s}.furin-metal-knob__tick.is-major{stroke-width:2.2;stroke:#4a5059}.furin-metal-knob__tick.is-on{stroke:var(--fmk-accent);filter:drop-shadow(0 0 3px color-mix(in srgb,var(--fmk-accent)75%,transparent))}.furin-metal-knob__num{fill:#6b727c;letter-spacing:.04em;font:600 10px/1 ui-monospace,JetBrains Mono,SF Mono,Menlo,monospace}.furin-metal-knob__well{position:absolute;width:calc(var(--fmk-d) + 26px);height:calc(var(--fmk-d) + 26px);background:radial-gradient(circle at 50% 38%,#101216 0%,#07080a 72%);border-radius:50%;box-shadow:0 0 0 2px #2a2e34,0 0 0 3px #0a0b0d,0 1px 0 3px #ffffff1a,inset 0 4px 10px #000000f2}.furin-metal-knob__well:before{content:"";position:absolute;z-index:-1;background:conic-gradient(from 30deg,#3b4047,#7a808a 12%,#2a2d33 25%,#646a74 37%,#3b4047 50%,#7a808a 62%,#2a2d33 75%,#646a74 87%,#3b4047);border-radius:50%;inset:-7px;box-shadow:0 0 0 1px #000c,0 6px 12px #0000008c,inset 0 1px 1px #ffffff59}.furin-metal-knob__knob{position:relative;width:var(--fmk-d);height:var(--fmk-d);cursor:grab;touch-action:none;isolation:isolate;outline:none;border-radius:50%;transition:transform .25s cubic-bezier(.3,1.5,.5,1),box-shadow .25s;box-shadow:0 2px 2px #000000b3,0 10px 14px -2px #000000a6,0 24px 30px -8px #000c}.furin-metal-knob__knob.is-dragging{cursor:grabbing;transform:scale(.985);box-shadow:0 1px 1px #000000b3,0 6px 10px -2px #000000a6,0 14px 20px -8px #000c}.furin-metal-knob__knob:focus-visible{outline:2px solid #96b9fff2;outline-offset:10px}.furin-metal-knob--off .furin-metal-knob__knob{cursor:not-allowed}.furin-metal-knob__turn{position:absolute;will-change:transform;border-radius:50%;transition:transform .38s cubic-bezier(.3,1.45,.5,1);inset:0}.furin-metal-knob__knob.is-dragging .furin-metal-knob__turn{transition:none}.furin-metal-knob__grip{position:absolute;background:repeating-conic-gradient(#3c4048 0deg,#cfd4db 1.5deg,#3c4048 3deg);border-radius:50%;inset:0;box-shadow:inset 0 0 0 1px #0000008c,inset 0 0 8px #0000008c}.furin-metal-knob__cap{position:absolute;inset:calc(var(--fmk-d)*.11);background:repeating-radial-gradient(circle,#ffffff12 0 .6px,#00000014 .6px 1.5px),radial-gradient(circle,#c4cad2 0%,#a2a9b3 100%);border-radius:50%;box-shadow:0 0 0 1.5px #000000bf,0 0 0 3px #ffffff1f,inset 0 0 0 1px #ffffffb3,inset 0 0 0 3.5px #00000029,inset 0 -3px 5px #00000040}.furin-metal-knob__mark{position:absolute;width:calc(var(--fmk-d)*.034);background:linear-gradient(#0c0d10,#2a2d33);border-radius:99px;min-width:4px;height:25%;top:7%;left:50%;transform:translate(-50%);box-shadow:0 1px #ffffffd9,inset 0 1px 2px #000000e6}.furin-metal-knob__light{position:absolute;pointer-events:none;mix-blend-mode:overlay;border-radius:50%}.furin-metal-knob__light--ring{opacity:.8;background:conic-gradient(#fff 0%,#000 12%,#bbb 22%,#000 36%,#fff 50%,#000 62%,#bbb 72%,#000 86%,#fff 100%);inset:0}.furin-metal-knob__light--cap{inset:calc(var(--fmk-d)*.11);opacity:.55;background:radial-gradient(circle at 34% 26%,#ffffffe6 0%,#fff0 52%),conic-gradient(from 20deg,#e8e8e8 0%,#6a6a6a 14%,#f4f4f4 26%,#7c7c7c 40%,#dedede 52%,#626262 66%,#f6f6f6 78%,#787878 90%,#e8e8e8 100%)}.furin-metal-knob__spec{position:absolute;pointer-events:none;background:radial-gradient(circle at calc(var(--fmk-x)*100%)calc(var(--fmk-y)*100%),#ffffff8c 0%,#fff3 22%,#fff0 46%);mix-blend-mode:normal;border-radius:50%;transition:--fmk-x .4s cubic-bezier(.2,.75,.25,1),--fmk-y .4s cubic-bezier(.2,.75,.25,1);inset:0}.furin-metal-knob__knob{transition:--fmk-x .4s cubic-bezier(.2,.75,.25,1),--fmk-y .4s cubic-bezier(.2,.75,.25,1),transform .25s cubic-bezier(.3,1.5,.5,1),box-shadow .25s}.furin-metal-knob__readout{display:grid;justify-items:center;gap:6px;margin-top:-30px}.furin-metal-knob__label{letter-spacing:.22em;text-indent:.22em;text-transform:uppercase;color:#7b828c;text-shadow:0 -1px #000000b3;font:600 10px/1 ui-monospace,JetBrains Mono,SF Mono,Menlo,monospace}.furin-metal-knob__value{font-variant-numeric:tabular-nums;color:#e9ecf0;text-shadow:0 0 12px color-mix(in srgb,var(--fmk-accent)40%,transparent);font:600 20px/1 ui-monospace,JetBrains Mono,SF Mono,Menlo,monospace}@media (prefers-reduced-motion:reduce){.furin-metal-knob__turn,.furin-metal-knob__knob,.furin-metal-knob__spec,.furin-metal-knob__tick{transition:none}}