/* Studio Meter: réplica visual de PluginEditor.cpp / MeterRotaryControl.h.
   Sólo esta página. Coordenadas lógicas 810 × 720, recursos originales locales. */
@font-face{font-family:StudioMeterRoboto;src:url('../fonts/studio-meter-regular.ttf') format('truetype');font-weight:400;font-display:swap}
.sm-device{position:relative;width:100%;aspect-ratio:810/720;container-type:inline-size;font-family:StudioMeterRoboto,Arial,sans-serif;color:#f1f3f6;line-height:1;isolation:isolate;user-select:none;background:#1f2e40;box-shadow:0 20px 48px #0005;border-radius:0;transform:none}
.sm-face{display:block;width:100%;height:100%;overflow:visible;font-family:StudioMeterRoboto,Arial,sans-serif}
.sm-device button,.sm-device select{font-family:StudioMeterRoboto,Arial,sans-serif;line-height:1;color:inherit}
.sm-device button:focus-visible,.sm-device select:focus-visible,.sm-knob-input:focus-visible{outline:2px solid #ffe09a;outline-offset:3px}
.sm-device-brand{position:absolute;left:6.17284%;top:2.43056%;height:6%;font:400 5.185185cqw/1 AlientoLogo,serif;white-space:nowrap;color:#f1f3f6;display:flex;align-items:flex-start;gap:1.85185cqw;text-decoration:none}
.sm-device-brand:hover{color:#f1f3f6}
.sm-brand-aliento{position:absolute;left:0;opacity:0;transition:opacity .22s ease;pointer-events:none}
.sm-brand-studio{transition:transform .22s ease,color .22s ease}
.sm-brand-meter{color:#2e6ea6;transition:opacity .22s ease}
.sm-device-brand:hover .sm-brand-aliento,.sm-device-brand:focus-visible .sm-brand-aliento{opacity:1}
.sm-device-brand:hover .sm-brand-studio,.sm-device-brand:focus-visible .sm-brand-studio{transform:translateX(2.13em);color:#2e6ea6}
.sm-device-brand:hover .sm-brand-meter,.sm-device-brand:focus-visible .sm-brand-meter{opacity:0}
.sm-device-version{position:absolute;left:6.41975%;top:9.375%;font-size:1.48148cqw;color:#2e6ea6;line-height:1.15}
.sm-header-values{position:absolute;left:33.3333%;top:4.16667%;width:60.49383%;height:4.16667%;display:grid;grid-template-columns:repeat(4,1fr);gap:2.04082%}
.sm-led{display:flex;justify-content:center;align-items:center;min-width:0;height:100%;margin:0;padding:0;border:0;outline:.493827cqw solid #14141a;border-radius:0;font-size:1.9753cqw;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:none}
.sm-led-red{background:#260505;color:#ff4040;text-shadow:0 .24691cqw #731919}
.sm-led-green{background:#05210a;color:#59ff73;text-shadow:0 .24691cqw #197329}
.sm-header-values button{cursor:pointer}
.sm-corr-led{position:relative;background:#052605;overflow:hidden}
.sm-corr-led::before{content:'';position:absolute;inset:13.333% 5%;background:linear-gradient(90deg,#405940cc 0 2%,transparent 2% 49%,#405940cc 49% 51%,transparent 51% 98%,#405940cc 98%)}
.sm-corr-led>span{position:absolute;left:50%;top:10%;height:80%;width:34%;background:#33e64d;transform-origin:left;animation:sm-corr-move 4s ease-in-out infinite}
.sm-led[aria-pressed=true]{background:linear-gradient(#ffdf7a,#eeb75b);color:#101317;text-shadow:none}
.sm-corr-led[aria-pressed=true]>span{background:#101317;animation-play-state:paused}
.sm-device[data-mode=phase] .sm-header-values>.sm-led-red{opacity:.38}
.sm-device[data-mode=phase] .sm-corr-led:not([aria-pressed=true]),.sm-device[data-mode=loudness] .sm-corr-led{background:#1b2128}
.sm-device[data-mode=phase] .sm-corr-led:not([aria-pressed=true])>span,.sm-device[data-mode=loudness] .sm-corr-led>span{background:#4a525b;animation-play-state:paused}
.sm-controls,.sm-analog-controls,.sm-fft-controls,.sm-resolution-controls{position:absolute;inset:0;pointer-events:none}
.sm-controls button,.sm-controls select,.sm-knob-input{pointer-events:auto}
.sm-metal{position:absolute;display:flex;align-items:center;justify-content:center;margin:0;padding:0 .24691cqw;border:.123457cqw solid #647079a6;border-radius:.41975cqw;background:linear-gradient(#24282e,#1d2126 48%,#101215);box-shadow:inset 0 .123457cqw #70777d9e;font-size:1.728395cqw;white-space:nowrap;font-weight:400;cursor:pointer}
.sm-metal:hover:not(:disabled){filter:brightness(1.14)}
.sm-metal:active:not(:disabled){filter:brightness(.92)}
.sm-metal[aria-pressed=true]:not(:disabled){color:#101317;background:linear-gradient(#ffdf7a,#f7cc70 48%,#eeb75b);border-color:#647079cc;box-shadow:inset 0 .123457cqw #ffefb39e}
.sm-metal:disabled{color:#aeb6c1;cursor:default}
.sm-panel-heading{position:absolute;display:flex;align-items:center;justify-content:center;gap:1.48148cqw;height:2.5%;font-size:1.296296cqw;letter-spacing:.14em;white-space:nowrap;font-weight:400}
.sm-heading-lines::before,.sm-heading-lines::after{content:'';height:.074074cqw;background:#a1afbf7a;flex:1}
.sm-knob{position:absolute;pointer-events:none}
.sm-knob>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.sm-knob-strip{position:absolute;background-image:url('../img/studio-meter/knob-100.webp');background-repeat:no-repeat;background-size:100% 10000%;pointer-events:none}
.sm-knob-input{position:absolute;border-radius:50%;cursor:ns-resize;touch-action:none}
.sm-knob[aria-disabled=true]{opacity:.4}
.sm-knob[aria-disabled=true] .sm-knob-input{pointer-events:none;cursor:default}
.sm-knob-caption{position:absolute;left:6%;right:6%;top:80.26316%;height:14.47368%;display:block;text-align:center;font:400 1.481481cqw/1 StudioMeterRoboto,Arial,sans-serif;overflow:hidden;pointer-events:none}
.sm-knob-name,.sm-knob-value{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;white-space:nowrap;transition:transform .2s ease,opacity .2s ease}
.sm-knob-value{opacity:0;transform:translateY(100%)}
.sm-knob:has(.sm-knob-input:hover) .sm-knob-name,.sm-knob:has(.sm-knob-input:focus-visible) .sm-knob-name,.sm-knob.is-dragging .sm-knob-name{opacity:0;transform:translateY(-100%)}
.sm-knob:has(.sm-knob-input:hover) .sm-knob-value,.sm-knob:has(.sm-knob-input:focus-visible) .sm-knob-value,.sm-knob.is-dragging .sm-knob-value{opacity:1;transform:translateY(0)}
.sm-fft-select{position:absolute;top:81.52778%;height:5%;font-size:1.60494cqw;border:.123457cqw solid #82919c;border-radius:.41975cqw;padding:0 .617284cqw;background:linear-gradient(#52616e,#283643);color-scheme:dark;cursor:pointer}
.sm-fft-select option{background:#182735;color:#edf0f5;font-size:13px}
.sm-fft-select:disabled{opacity:.4;cursor:default}
.sm-metal[data-device-pair]{visibility:hidden;z-index:3}
.sm-metal[data-device-pair]::after{content:'';position:absolute;inset:100% 0 auto;height:.493827cqw}
.sm-device:has([data-device-source=pair]:hover) [data-device-pair],.sm-device:has([data-device-source=pair]:focus-visible) [data-device-pair],.sm-metal[data-device-pair]:hover,.sm-metal[data-device-pair]:focus-visible{visibility:visible}
.sm-device[data-controls-disabled=true] .sm-panel-heading{opacity:.4}
.sm-device[data-controls-disabled=true] [data-device-pair]{visibility:hidden}
.sm-device[data-display=medium] .sm-controls,.sm-device[data-display=medium] .sm-control-background,.sm-device[data-display=small] .sm-controls,.sm-device[data-display=small] .sm-control-background,.sm-device[data-display=small] .sm-header,.sm-device[data-display=small] .sm-header-labels,.sm-device[data-display=small] .sm-screws{display:none}
.sm-device[data-display=small] .sm-housing{fill:#121217;stroke:#121217}
.sm-band{fill:#2970d4;transform-box:fill-box;transform-origin:center bottom;animation:sm-band-move var(--duration,3.1s) ease-in-out var(--delay,0s) infinite}
.sm-band.is-peak{fill:#fff;animation-name:sm-peak-move}
.sm-band.is-side{fill:#ffffffd9}
.sm-aux-band{fill:#ffffffd9;transform-box:fill-box;transform-origin:center bottom;animation:sm-band-move 3.7s ease-in-out var(--delay,0s) infinite reverse}
.sm-fft-main{transform-box:fill-box;transform-origin:center bottom;animation:sm-fft-move 4s ease-in-out infinite}
.sm-force-bar{transform-box:fill-box;transform-origin:center bottom;animation:sm-band-move 3.3s ease-in-out var(--delay,0s) infinite}
.sm-phase-points{transform-box:fill-box;transform-origin:center;animation:sm-phase-move 5s ease-in-out infinite}
.sm-device[data-mode=analog] #sm-plot,.sm-device[data-mode=fft] #sm-plot{cursor:crosshair}
.sm-demo-toolbar{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center;margin:1.15rem 0 .7rem}
.sm-demo-tool{display:inline-flex;gap:.45rem;align-items:center;border:1px solid #ffffff30;border-radius:5px;background:transparent;color:#b9c8d3;padding:.5rem .65rem;font:400 .64rem/1.3 var(--font-mono);min-height:36px;cursor:pointer}
.sm-demo-tool:hover{color:#f1f3f6;border-color:#ffdf7a80;background:#ffdf7a08}
.sm-demo-help{font:400 .7rem/1.7 var(--font-sans);color:#a4acb9;text-align:center;margin:.65rem auto 0;max-width:610px}
.sm-demo-expanded{overflow:auto;overscroll-behavior:contain;border:1px solid #51647466}
#sm-demo-expanded-host{min-width:810px}
#demoModal .modal-body{padding:1rem}
.sm-demo-settings{position:fixed;z-index:1090;width:min(310px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #526b7e;border-radius:6px;background:#182735;color:#edf0f5;box-shadow:0 16px 40px #0008;padding:.9rem;font:400 .8rem/1.4 StudioMeterRoboto,Arial,sans-serif}
.sm-settings-header{display:flex;align-items:center;justify-content:space-between;gap:.7rem;border-bottom:1px solid #ffffff26;padding-bottom:.7rem;margin-bottom:.7rem}
.sm-settings-header strong{font-weight:500;font-size:.9rem}
.sm-settings-header button{border:1px solid #ffffff40;border-radius:4px;width:32px;height:32px;background:transparent;color:#edf0f5;font-size:1.2rem}
.sm-demo-settings>label{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.4rem 0}
.sm-demo-settings select{max-width:57%;background:#283e50;color:#edf0f5;border:1px solid #82919c;border-radius:3px;font:inherit;padding:.3rem}
.sm-demo-settings input{width:18px;height:18px;accent-color:#ffdf7a}
.sm-demo-settings p{font-size:.72rem;color:#b4c9d8;border-top:1px solid #ffffff26;padding-top:.7rem;margin:.6rem 0}
.sm-demo-settings #sm-demo-reset{width:100%;padding:.6rem;border:1px solid #647079;border-radius:4px;background:linear-gradient(#24282e,#101215);color:#edf0f5;font:inherit}
@keyframes sm-band-move{0%,100%{transform:scaleY(1)}42%{transform:scaleY(var(--low,.7))}74%{transform:scaleY(.9)}}
@keyframes sm-peak-move{0%,100%{transform:scaleY(1)}42%{transform:scaleY(.94)}74%{transform:scaleY(.97)}}
@keyframes sm-fft-move{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.88)}}
@keyframes sm-phase-move{0%,100%{transform:rotate(-4deg) scale(.95)}50%{transform:rotate(5deg) scale(1.04)}}
@keyframes sm-corr-move{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.65)}}
@media(max-width:575.98px){.sm-demo-help{font-size:.68rem}.sm-demo-tool{font-size:.6rem}.sm-device{box-shadow:0 15px 30px #0005}}
@media(prefers-reduced-motion:reduce){.sm-device *,.sm-device *::before,.sm-device *::after{animation:none!important;transition:none!important}}