/* Native reference proportions, normalized to a 15px header and 141px body.
   All display fields below bind to the existing synthesis parameter profile. */
body .studio .device-chain>.device-card.live-synth-card{--live-surface:#4e4e4e;--live-text:#bcbcbc;--live-muted:#aaa;--live-display:#181818;--live-field:#292929;--live-frame:#666;--live-curve:#19bdcf;--synth-accent:#19bdcf;--synth-orange:#ffb45f;height:158px;min-height:158px;max-height:158px;border:1px solid #777;border-radius:3px;overflow:visible;flex:none;font:8.5px/10px LiveSans,Arial,sans-serif;background:#4e4e4e;color:#bcbcbc}
body .studio .device-chain>.live-synth-card[data-synth-instrument=operator]{width:610px;min-width:610px;max-width:610px;flex-basis:610px}
body .studio .device-chain>.live-synth-card[data-synth-instrument=wavetable]{width:820px;min-width:820px;max-width:820px;flex-basis:820px}
body .studio .device-chain>.live-synth-card>.device-head{height:15px;min-height:15px;flex:0 0 15px;gap:4px;padding:0 4px;border-radius:2px 2px 0 0;background:#637d86;color:#101516;line-height:15px}
body .studio .live-synth-card>.device-head strong{font-size:9px;font-weight:600}
body .studio .live-synth-card>.device-head .synth-toggle input{width:10px;height:10px;min-height:10px;border-radius:50%;background:var(--synth-orange);border-color:#292929}
body .studio .live-synth-card>.device-head .synth-toggle input:not(:checked){background:#444}
body .studio .device-chain>.live-synth-card>.synth-body{position:relative;box-sizing:border-box;width:100%;height:141px;min-height:141px;flex:0 0 141px;padding:2px;display:grid;gap:2px;background:#4e4e4e;color:#bcbcbc;font:8.5px/10px LiveSans,Arial,sans-serif}
body .studio .live-synth-card .synth-operator{grid-template-columns:176px 240px 184px}
body .studio .live-synth-card .synth-wavetable{grid-template-columns:300px 196px 314px}
body .studio .live-synth-card [hidden]{display:none!important}
body .studio .live-synth-card :is(input,select,button){font:inherit;color:inherit;box-sizing:border-box}
body .studio .live-synth-card :is(input,select,button):focus-visible{outline:1px solid #ffbb62;outline-offset:1px}
body .studio .live-synth-card button{min-height:10px;height:11px;padding:0 4px;border:0;border-radius:0;line-height:10px;background:transparent;color:#bcbcbc;font-size:8px}
body .studio .live-synth-card .synth-control{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;gap:0;margin:0;font:8px/9px LiveSans,Arial,sans-serif}
body .studio .live-synth-card .synth-control>span:first-child{display:block;min-height:8px;line-height:8px;white-space:nowrap;max-width:100%;overflow:hidden}
body .studio .live-synth-card .synth-control output{display:block;font:8px/9px LiveSans,Arial,sans-serif;white-space:nowrap;font-variant-numeric:tabular-nums}
body .studio .live-synth-card .synth-choice{align-items:stretch;min-width:0}
body .studio .live-synth-card .synth-choice select{width:100%;min-width:0;height:11px;min-height:11px;border:0;border-radius:0;padding:0 9px 0 2px;background-color:#292929;font:8px/10px LiveSans,Arial,sans-serif}
body .studio .live-synth-card .synth-choice>span:empty{display:none;min-height:0}
body .studio .live-synth-card .synth-controls{display:flex;min-width:0;gap:4px;align-items:start}
body .studio .live-synth-card .synth-controls>.synth-control{flex:1}
body .studio .live-synth-card .synth-flat-value{position:relative;display:block;width:100%;height:12px;min-height:12px;line-height:12px}
body .studio .live-synth-card .synth-flat-value input[type=number]{position:absolute;inset:0;width:100%;height:12px;min-height:12px;border:0;padding:0;background:#222;color:var(--synth-accent);font:8px/12px LiveSans,Arial,sans-serif;text-align:left;opacity:0;z-index:1}
body .studio .live-synth-card .synth-flat-value output{position:absolute;inset:0;height:12px;line-height:12px;color:var(--synth-accent);text-align:left;pointer-events:none}
body .studio .live-synth-card .synth-flat-value:focus-within input{opacity:1}
body .studio .live-synth-card .synth-flat-value:focus-within output{visibility:hidden}
body .studio .live-synth-card .synth-number{align-items:stretch;text-align:left}
body .studio .live-synth-card input[type=number]::-webkit-inner-spin-button{appearance:none}
body .studio .live-synth-card .synth-toggle{display:flex;align-items:center;gap:2px;min-width:0;margin:0;white-space:nowrap;font:8px/9px LiveSans,Arial,sans-serif}
body .studio .live-synth-card .synth-toggle input{appearance:none;width:8px;height:8px;min-width:8px;min-height:8px;margin:0;padding:0;border:1px solid #222;border-radius:0;background:#333}
body .studio .live-synth-card .synth-toggle input:checked{background:var(--synth-accent)}
body .studio .live-synth-card .synth-toggle>span:empty{display:none}
/* Use the shared knob wrapper directly so the input controller adds no nested dial. */
body .studio .device-chain>.live-synth-card .synth-dial.knob-control{position:relative;display:block;flex:none;width:18px;height:18px;min-width:0;min-height:0;padding:0;margin:0;border:0;border-radius:50%;background:conic-gradient(from 225deg,var(--synth-accent) 0deg var(--knob-fill),#333 var(--knob-fill) 270deg,transparent 270deg)}
body .studio .device-chain>.live-synth-card .synth-dial:before{content:'';position:absolute;inset:2px;border-radius:50%;background:#4e4e4e}
body .studio .device-chain>.live-synth-card .synth-dial>i{position:absolute;display:block;left:calc(50% - .5px);top:2px;width:1px;height:calc(50% - 2px);margin:0;background:#222;transform-origin:50% 100%;transform:rotate(var(--knob-angle));pointer-events:none}
body .studio .device-chain>.live-synth-card .synth-dial input[type=range]{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;padding:0;opacity:0;cursor:ns-resize;z-index:1}
body .studio .live-synth-card .synth-plot{display:block;width:100%;height:100%;min-height:0;border:0;background:#181818}
body .studio .live-synth-card .synth-grid{display:none}
body .studio .live-synth-card .synth-curve{fill:none;stroke:var(--synth-accent);stroke-width:1.1}
body .studio .live-synth-card .synth-tabs{display:flex;min-width:0;gap:0;height:11px;align-items:center}
body .studio .live-synth-card .synth-tabs button{flex:1;min-width:0;white-space:nowrap;font-size:8px}
body .studio .live-synth-card .synth-tabs button[aria-selected=true]{color:var(--synth-accent);border-bottom:1px solid var(--synth-accent)}
/* Operator: four oscillator strips, envelope editor, and the four global rows. */
body .studio .live-synth-card .synth-oscillators{display:grid;height:137px;min-height:0;grid-template-rows:repeat(4,minmax(0,1fr))}
body .studio .live-synth-card .synth-operator-row{display:grid;grid-template-columns:minmax(0,1fr) 12px;gap:3px;min-height:0;padding:0 4px;border:0;border-bottom:1px solid #666;background:#4e4e4e}
body .studio .live-synth-card .synth-operator-row-controls{display:flex;gap:4px;align-items:center;min-width:0;height:33px}
body .studio .live-synth-card .synth-operator-row-controls>.synth-controls{flex:1;gap:5px}
body .studio .live-synth-card .synth-operator-row-controls .synth-control{flex:1}
body .studio .live-synth-card .synth-operator-row-controls .synth-control>span:first-child{font-size:8px;line-height:8px}
body .studio .live-synth-card .synth-operator-row-controls .synth-control output{font-size:7px;line-height:7px}
body .studio .device-chain>.live-synth-card .synth-operator-row .synth-dial{width:17px;height:17px}
body .studio .live-synth-card .synth-operator-row-controls>.synth-toggle{flex-direction:column-reverse;gap:4px;font-size:8px;line-height:8px;margin-bottom:4px}
body .studio .live-synth-card .synth-osc-switch{display:flex;flex-direction:column;gap:4px;align-items:center;justify-content:center}
body .studio .live-synth-card .synth-osc-switch .synth-osc-label{padding:0;width:9px;height:9px;min-height:9px;font-size:7px;line-height:9px;background:var(--synth-accent);color:#222}
body .studio .live-synth-card .synth-operator-row[data-osc=D]{--synth-accent:#ff8f3d}
body .studio .live-synth-card .synth-operator-row[data-osc=C]{--synth-accent:#8676ed}
body .studio .live-synth-card .synth-operator-row[data-osc=B]{--synth-accent:#33c9c9}
body .studio .live-synth-card .synth-operator-row[data-osc=A]{--synth-accent:#e6d927}
body .studio .live-synth-card .synth-operator-center{display:grid;grid-template-rows:64px 11px 56px;gap:1px;min-height:0;padding:2px;background:#181818;color:#aaa}
body .studio .live-synth-card .synth-operator-display{min-height:0;height:64px}
body .studio .live-synth-card .synth-operator-center>.synth-tabs{justify-content:space-between;border-bottom:1px solid #666}
body .studio .live-synth-card .synth-operator-center>.synth-tabs button{flex:none;width:50%;text-align:left;font-size:8px}
body .studio .live-synth-card .synth-operator-center>h4{height:11px;line-height:11px;font-size:8px;font-weight:400;margin:0}
body .studio .live-synth-card .synth-operator-params{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:23px;gap:2px 3px;min-width:0;padding-top:2px}
body .studio .live-synth-card .synth-operator-params .synth-choice select{background:transparent;color:var(--synth-orange)}
body .studio .live-synth-card .synth-operator-params .synth-toggle{align-self:center;font-size:7px}
body .studio .live-synth-card .synth-operator-params .synth-control>span:first-child{font-size:8px}
body .studio .live-synth-card .synth-mini-wave{width:100%;height:23px;max-width:55px;align-self:start}
body .studio .live-synth-card .synth-harmonics{height:64px;display:flex;gap:1px;align-items:stretch;background:#181818;border-bottom:1px solid #777}
body .studio .live-synth-card .synth-harmonics label{position:relative;flex:1;min-width:0;background:linear-gradient(to top,var(--synth-accent) var(--harmonic-level),transparent var(--harmonic-level))}
body .studio .live-synth-card .synth-harmonics label:nth-child(8n){border-right:1px solid #777}
body .studio .live-synth-card .synth-harmonics input{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;opacity:0;writing-mode:vertical-lr;direction:rtl;cursor:ns-resize}
body .studio .live-synth-card .synth-operator-global{display:grid;grid-template-rows:34px 35px 34px 34px;gap:0;min-width:0}
body .studio .live-synth-card .synth-operator-global>.synth-section{position:relative;display:grid;grid-template-columns:58px 60px 60px;align-items:center;gap:0;min-width:0;padding:0 2px;border:0;border-bottom:1px solid #666;background:#4e4e4e}
body .studio .live-synth-card .synth-operator-global h4{position:absolute;top:1px;left:3px;display:flex;align-items:center;gap:2px;max-width:56px;height:10px;line-height:10px;margin:0;font-size:8px;font-weight:400;z-index:1}
body .studio .live-synth-card .synth-operator-global h4 button{padding:0;font-size:8px;text-align:left}
body .studio .device-chain>.live-synth-card .synth-operator-global .synth-dial{width:17px;height:17px}
body .studio .live-synth-card .synth-operator-global .synth-control>span:first-child{font-size:8px}
body .studio .live-synth-card .synth-operator-global .synth-control output{font-size:8px;line-height:8px}
body .studio .live-synth-card .synth-op-lfo>.synth-choice{align-self:end;margin:0 2px 3px 0}
body .studio .live-synth-card .synth-op-lfo>.synth-control:nth-of-type(2){grid-column:2}
body .studio .live-synth-card .synth-op-lfo>.synth-control:nth-of-type(3){grid-column:3}
body .studio .live-synth-card .synth-op-filter-selectors{display:flex;gap:2px;align-self:end;margin-bottom:3px}
body .studio .live-synth-card .synth-op-filter-selectors .synth-choice:first-child{width:34px}
body .studio .live-synth-card .synth-op-filter-selectors .synth-choice:last-child{width:23px}
body .studio .live-synth-card .synth-op-pitch>.synth-control:first-of-type>span:first-child{visibility:hidden}
body .studio .live-synth-card .synth-op-main>.synth-choice{align-self:end;margin:0 8px 3px 0}
body .studio .live-synth-card .synth-op-main>.synth-choice>span{visibility:hidden}
body .studio .live-synth-card .synth-global-grid{grid-column:1/-1;grid-row:2/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:25px;align-content:start;gap:5px 4px;padding:3px;min-width:0}
/* Wavetable: Sub and original table display, shared filter display, mod sources. */
body .studio .live-synth-card .synth-table-column{display:grid;grid-template-columns:49px minmax(0,1fr);gap:2px;min-width:0}
body .studio .live-synth-card .synth-sub{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:0;min-width:0;padding:0 2px;border:0;border-right:1px solid #666;background:#4e4e4e}
body .studio .live-synth-card .synth-sub h4{height:10px;line-height:10px;font-size:8px;text-align:center;margin:0;background:#292929;font-weight:400}
body .studio .live-synth-card .synth-sub>.synth-toggle{position:absolute;top:1px;left:3px}
body .studio .device-chain>.live-synth-card .synth-sub .synth-dial{height:18px;width:18px}
body .studio .live-synth-card .synth-sub .synth-control>span:first-child{font-size:8px}
body .studio .live-synth-card .synth-sub .synth-choice select{text-align:center}
body .studio .live-synth-card .synth-sub .synth-flat-value output{text-align:center;color:#bcbcbc;background:#292929}
body .studio .live-synth-card .synth-table-display{position:relative;display:grid;grid-template-rows:13px minmax(0,1fr) 23px;gap:1px;min-width:0;padding:0 2px;background:#181818}
body .studio .device-chain>.live-synth-card .synth-table-display>h4{position:absolute;top:-16px;left:100px;display:flex;align-items:center;gap:4px;margin:0;height:13px;line-height:13px;z-index:2}
body .studio .live-synth-card .synth-table-display>h4 .synth-tabs{width:94px}
body .studio .live-synth-card .synth-table-display>h4 .synth-tabs button{font-size:8px;border:1px solid #999;padding:0 3px;color:#333;background:#999}
body .studio .live-synth-card .synth-table-display>h4 .synth-tabs button[aria-selected=true]{background:#181818;color:#bcbcbc;border-color:#181818}
body .studio .live-synth-card .synth-table-display>.synth-choice{grid-row:1;align-self:start}
body .studio .live-synth-card .synth-table-display>.synth-choice select{background-color:transparent;color:var(--synth-orange);font-size:8px;height:13px;min-height:13px}
body .studio .live-synth-card .synth-table-visual{grid-row:2;display:grid;grid-template-columns:20px minmax(0,1fr) 19px;gap:1px;min-height:0}
body .studio .live-synth-card .synth-wavetable-source{height:100%;min-height:0;min-width:0}
body .studio .live-synth-card .synth-wavetable-source>svg{display:block;width:100%;height:100%;min-height:0}
body .studio .live-synth-card .synth-wavetable-source .synth-curve{stroke:var(--synth-orange);stroke-width:1.2}
body .studio .live-synth-card .synth-table-slice{fill:none;stroke:#626262;stroke-width:.7}
body .studio .live-synth-card .synth-table-rail{height:100%;display:grid;grid-template-rows:minmax(0,1fr) 11px;justify-items:center;align-items:stretch;min-height:0}
body .studio .live-synth-card .synth-table-rail>span:first-child{display:none}
body .studio .live-synth-card .synth-table-rail input{appearance:auto;writing-mode:vertical-lr;direction:rtl;width:8px;min-width:0;height:100%;min-height:0;border:0;margin:0;padding:0;accent-color:var(--synth-orange);background:transparent}
body .studio .live-synth-card .synth-table-rail output{font-size:6px;color:var(--synth-orange);max-width:23px;white-space:nowrap}
body .studio .live-synth-card .synth-table-display>.synth-controls{grid-row:3;gap:3px;align-items:start;min-height:0}
body .studio .live-synth-card .synth-table-display>.synth-controls .synth-choice{flex:1.4}
body .studio .live-synth-card .synth-table-display>.synth-controls .synth-control>span:first-child{font-size:7px}
body .studio .live-synth-card .synth-table-display>.synth-controls .synth-flat-value output{font-size:7px;color:var(--synth-orange)}
body .studio .live-synth-card .synth-table-display>.synth-controls .synth-choice select{color:var(--synth-orange);background:transparent;font-size:7px}
body .studio .live-synth-card .synth-filter-column{position:relative;display:grid;grid-template-rows:14px 61px 12px 46px;gap:0;min-width:0;padding:2px;background:#4e4e4e;border:0;border-left:1px solid #666;border-right:1px solid #666}
body .studio .live-synth-card .synth-filter-headers{display:grid;grid-template-columns:1fr 1fr;gap:3px;min-width:0;background:#181818}
body .studio .live-synth-card .synth-filter-header{display:flex;align-items:center;gap:2px;min-width:0}
body .studio .live-synth-card .synth-filter-header .synth-choice:nth-child(2){width:34px}
body .studio .live-synth-card .synth-filter-header .synth-choice:nth-child(3){width:23px}
body .studio .live-synth-card .synth-filter-header .synth-choice>span{display:none}
body .studio .live-synth-card .synth-filter-header select{padding-left:1px;font-size:8px;background-color:transparent}
body .studio .live-synth-card .synth-filter-plot{height:61px;width:100%;min-width:0;display:block;background:#181818;border-bottom:1px solid #777}
body .studio .live-synth-card .synth-filter-secondary{stroke:#777}
body .studio .live-synth-card .synth-filter-plot text{font:8px LiveSans,Arial;fill:var(--synth-orange)}
body .studio .live-synth-card .synth-filter-routing{height:12px;min-height:0;background:#333}
body .studio .live-synth-card .synth-filter-routing .synth-choice>span{display:none}
body .studio .live-synth-card .synth-filter-routing select{background:transparent;color:#aaa;font-size:8px;height:12px;min-height:12px;max-width:70px}
body .studio .live-synth-card .synth-filter-column>.synth-controls{gap:0;padding-top:3px;align-items:start}
body .studio .live-synth-card .synth-filter-column>.synth-controls>.synth-control{flex:1}
body .studio .live-synth-card .synth-filter-column>.synth-controls>.synth-control>span:first-child{font-size:8px}
body .studio .live-synth-card .synth-filter-column>.synth-controls>.synth-control:nth-child(2),body .studio .live-synth-card .synth-filter-column>.synth-controls>.synth-control:nth-child(3){flex:1.55}
body .studio .device-chain>.live-synth-card .synth-filter-column>.synth-controls .synth-dial{width:16px;height:16px}
body .studio .device-chain>.live-synth-card .synth-filter-column>.synth-controls>.synth-control:nth-child(2) .synth-dial,body .studio .device-chain>.live-synth-card .synth-filter-column>.synth-controls>.synth-control:nth-child(3) .synth-dial{width:26px;height:26px}
body .studio .live-synth-card .synth-filter-column>.synth-controls .synth-control output{font-size:7px;line-height:8px}
body .studio .live-synth-card .synth-mod-column{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 55px;grid-template-rows:12px minmax(0,1fr);gap:1px 2px;min-width:0;background:#181818}
body .studio .live-synth-card .synth-mod-modes{position:absolute;top:-16px;left:36px;height:13px;min-height:0;z-index:2}
body .studio .live-synth-card .synth-mod-modes .synth-tabs{height:13px;gap:3px}
body .studio .live-synth-card .synth-mod-modes button{height:13px;font-size:8px;color:#333;background:#999;border-radius:1px;flex:none;padding:0 5px}
body .studio .live-synth-card .synth-mod-modes button[aria-selected=true]{color:#bcbcbc;background:#181818;border:0}
body .studio .live-synth-card .synth-mod-column>.synth-tabs{grid-row:1;grid-column:1;height:12px;border-bottom:1px solid #555}
body .studio .live-synth-card .synth-mod-column>.synth-tabs button{font-size:8px}
body .studio .live-synth-card .synth-mod-editor{grid-row:2;grid-column:1;min-height:0;min-width:0;display:grid;grid-template-rows:minmax(0,1fr) 24px;gap:3px;padding:2px;background:#181818}
body .studio .live-synth-card .synth-mod-editor>.synth-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;min-width:0}
body .studio .live-synth-card .synth-mod-editor .synth-flat-value output{font-size:8px}
body .studio .live-synth-card .synth-wavetable-global{grid-row:1/-1;grid-column:2;display:flex;flex-direction:column;justify-content:space-between;gap:2px;padding:0 2px 0 3px;background:#4e4e4e;border-left:1px solid #777;min-width:0}
body .studio .live-synth-card .synth-wavetable-global .synth-control{align-items:stretch;flex:0 0 22px}
body .studio .live-synth-card .synth-wavetable-global .synth-choice select{height:11px;min-height:11px;font-size:8px}
body .studio .live-synth-card .synth-wavetable-global .synth-flat-value output{background:#292929;color:#bcbcbc;text-align:center}
body .studio .live-synth-card .synth-matrix{grid-column:1/-1;grid-row:1/-1;width:100%;height:100%;border-collapse:collapse;font:7px/10px LiveSans,Arial,sans-serif}
body .studio .live-synth-card .synth-matrix :is(th,td){border:1px solid #555;text-align:center;padding:0;font-weight:400;min-width:0}
body .studio .live-synth-card .synth-matrix th{color:#aaa;white-space:nowrap}
body .studio .live-synth-card .synth-matrix input[type=number]{width:27px;height:13px;min-height:13px;border:0;padding:0;background:transparent;color:var(--synth-accent);font:8px/12px LiveSans,Arial,sans-serif;text-align:center}
body .studio .live-synth-card .synth-mod-editor>.synth-global-grid{grid-row:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:25px}
body .studio .live-synth-card .synth-operator-row .synth-control{--synth-accent:#19bdcf}
body .studio .live-synth-card .synth-filter-secondary{stroke-opacity:.4}
/* Keep every column in the fixed native body row, including grids with SVGs. */
body .studio .device-chain>.live-synth-card>.synth-body{grid-template-rows:minmax(0,1fr)}
body .studio .device-chain>.live-synth-card>.synth-body>*{min-height:0;max-height:100%;height:100%}
body .studio .live-synth-card .synth-table-column>.synth-section{min-height:0;max-height:100%}
body .studio .live-synth-card .synth-wavetable-global{min-height:0;max-height:100%;height:100%}
body .studio .device-chain>.live-synth-card>.device-head .synth-toggle input:checked{background:var(--synth-orange)}
body .studio .live-synth-card .synth-table-rail input[type=range]{appearance:none;width:4px;accent-color:unset;background:linear-gradient(to top,var(--synth-orange) var(--synth-rail-level),#555 var(--synth-rail-level));border:1px solid #777}
body .studio .live-synth-card .synth-table-rail input[type=range]::-webkit-slider-runnable-track{width:2px;background:transparent;border:0}
body .studio .live-synth-card .synth-table-rail input[type=range]::-webkit-slider-thumb{appearance:none;width:6px;height:4px;border:1px solid var(--synth-orange);border-radius:0;background:#181818}
body .studio .live-synth-card .synth-table-rail input[type=range]::-moz-range-track{width:2px;background:transparent;border:0}
body .studio .live-synth-card .synth-table-rail input[type=range]::-moz-range-thumb{width:4px;height:2px;border:1px solid var(--synth-orange);border-radius:0;background:#181818}