commit 33e3a01d8649e10ebcd4c2fe3fa1468344f262e0
parent be40a2fcdc5bacce6554f73cf8f0d3de6ddcaca1
Author: Matt Demanett <matt@demanett.net>
Date: Fri, 7 Aug 2020 01:11:42 -0400
Add "Dark (low-contrst)" skin as alternate dark mode.
Diffstat:
219 files changed, 45666 insertions(+), 0 deletions(-)
diff --git a/res-pp/AD-lowcontrast-pp.svg b/res-pp/AD-lowcontrast-pp.svg
@@ -0,0 +1,349 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">AD</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(3.5 0)">ATTACK</text>
+ <g transform="translate(0 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 82)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6 0)">DECAY</text>
+ <g transform="translate(0 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 132.5)">
+ <g transform="translate(2.5 0)">
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(0 6)">RT</text>
+ <g transform="translate(9.5 -1)"><svg id="RETRIGGER_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(23.5 0)">
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(0.3 6)">LP</text>
+ <g transform="translate(9.5 -1)"><svg id="LOOP_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="translate(11 147)">
+ <text font-size="5pt" letter-spacing="1.5px" transform="translate(-1 6)">LIN</text>
+ <g transform="translate(15 -1)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 160.5)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 98)"/>
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 35)">TRIG</text>
+ <g transform="translate(5 38)"><svg id="ATTACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2 70)">ATTACK</text>
+ <g transform="translate(5 73)"><svg id="DECAY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(2.5 105)">DECAY</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 111)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="ENV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 32)">ENV</text>
+ <g transform="translate(5 35)"><svg id="EOC_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 67)">EOC</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/ADSR-lowcontrast-pp.svg b/res-pp/ADSR-lowcontrast-pp.svg
@@ -0,0 +1,406 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-linear-adsr" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(17 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">ADSR</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(13 0)">ATT</text>
+ <g transform="translate(0 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 82)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(13 0)">DEC</text>
+ <g transform="translate(0 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 139)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(13 0)">SUS</text>
+ <g transform="translate(0 0)"><svg id="SUSTAIN_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-linear-adsr" transform="translate(0 0)" href="#dial-linear-adsr"/>
+ <g transform="translate(20.8 40)"><svg id="SUSTAIN_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 196)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(13 0)">REL</text>
+ <g transform="translate(0 0)"><svg id="RELEASE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="RELEASE_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(10.5 247)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 6)">LIN</text>
+ <g transform="translate(15 -1)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 262)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="GATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 35)">GATE</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/AMRM-lowcontrast-pp.svg b/res-pp/AMRM-lowcontrast-pp.svg
@@ -0,0 +1,270 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-rectify-amrm" viewBox="0 0 90px 90px">
+ <g transform="translate(45 45)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(29 0) rotate(240) translate(-4 3)">0</text>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-210) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-180) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-150) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-120) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-90) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-60) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-30) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(0) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(30) translate(26 0)"/>
+ <polyline points="0,0 5.5,0" stroke-width="1.5" transform="rotate(60) translate(26 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-drywet-amrm" viewBox="0 0 90px 90px">
+ <g transform="translate(45 45)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(29 0) rotate(240) translate(-4 3)">D</text>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-210) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-180) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-150) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-120) translate(26 0)"/>
+ <polyline points="0,0 5.5,0" stroke-width="1.5" transform="rotate(-90) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-60) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-30) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(0) translate(26 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(30) translate(26 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(29 0) rotate(-60) translate(-1 3)">W</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">AM/RM</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+ <g transform="translate(0 49)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(18 0)">RECTIFY</text>
+ <g transform="translate(0 -5)"><svg id="RECTIFY_PARAM">
+ <g transform="translate(45 45)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="22" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-rectify-amrm" transform="translate(0 -5)" href="#dial-rectify-amrm"/>
+ </g>
+
+ <g transform="translate(0 148)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(15.5 0)">DRY/WET</text>
+ <g transform="translate(0 -5)"><svg id="DRYWET_PARAM">
+ <g transform="translate(45 45)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="22" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-drywet-amrm" transform="translate(0 -5)" href="#dial-drywet-amrm"/>
+ </g>
+
+ <g transform="translate(11 240)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="input-background-filler" width="68" height="10" transform="translate(0 66)"/>
+ <rect class="input-background" width="68" height="73" rx="5"/>
+ <g transform="translate(5 4)"><svg id="MODULATOR_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(7.5 36)">MOD</text>
+ <g transform="translate(39 4)"><svg id="CARRIER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(42.5 36)">CAR</text>
+ <g transform="translate(5 40)"><svg id="RECTIFY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 72)">RECT</text>
+ <g transform="translate(39 40)"><svg id="DRYWET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(42 72)">D/W</text>
+ </g>
+ <g class="io-group" transform="translate(0 79)">
+ <rect class="output-background-filler" width="68" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="68" height="37" rx="5"/>
+ <g transform="translate(5 1)"><svg id="RECTIFY_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 33)">RECT</text>
+ <g transform="translate(39 1)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(42.5 33)">OUT</text>
+ </g>
+ </g>
+
+
+</svg>
diff --git a/res-pp/ASR-lowcontrast-pp.svg b/res-pp/ASR-lowcontrast-pp.svg
@@ -0,0 +1,341 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">ASR</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(3.5 0)">ATTACK</text>
+ <g transform="translate(0 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 82)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(2.5 0)">RELEASE</text>
+ <g transform="translate(0 0)"><svg id="RELEASE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="RELEASE_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(3.5 130)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(7 11)">S</text>
+ <g transform="translate(14.5 0)"><svg id="SUSTAIN_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(11 151)">
+ <text font-size="5pt" letter-spacing="1.5px" transform="translate(-1 6)">LIN</text>
+ <g transform="translate(15 -1)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 162)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 98)"/>
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 35)">TRIG</text>
+ <g transform="translate(5 38)"><svg id="ATTACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(9 70)">ATT</text>
+ <g transform="translate(5 73)"><svg id="RELEASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(9 105)">REL</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 111)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="ENV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 32)">ENV</text>
+ <g transform="translate(5 35)"><svg id="EOC_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 67)">EOC</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Additator-lowcontrast-pp.svg b/res-pp/Additator-lowcontrast-pp.svg
@@ -0,0 +1,735 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-partials-additator" viewBox="0 0 70px 70px">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25.5 0) rotate(240) translate(-2.5 2.5)">1</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-212.73) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-182.42) translate(25 0) rotate(182.42) translate(-7 2.8)">20</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-152.12) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-121.82) translate(25 0) rotate(121.82) translate(-7 2.5)">40</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-91.52) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-61.21) translate(25 0) rotate(61.21) translate(-3 2.5)">60</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30.91) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-0.61) translate(25 0) rotate(0.61) translate(-2.5 2.8)">80</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(29.7) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25.5 0) rotate(-60) translate(-2 2.5)">100</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">ADDITATOR</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+
+
+
+
+
+ <g transform="translate(20 25)">
+
+
+
+ <g transform="translate(20 20)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(34 34)">
+ <polyline points="-10,0 10,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-10 0,10" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="33.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(20 25)">
+ <g transform="translate(54 54)">
+ <g transform="rotate(-240) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(240) translate(-6 3)">-3</text>
+ </g>
+ <g transform="rotate(-220.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-206.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(206.667) translate(-5.5 3)">-2</text>
+ </g>
+ <g transform="rotate(-187.23) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-173.333) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(173.333) translate(-4 3)">-1</text>
+ </g>
+ <g transform="rotate(-153.89) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-140) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" letter-spacing="1px" transform="translate(16 0) rotate(140) translate(-6 3.5)">0V</text>
+ </g>
+ <g transform="rotate(-120.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-106.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(106.667) translate(-2.7 3)">1</text>
+ </g>
+ <g transform="rotate(-87.23) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-73.33) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(73.333) translate(-2.7 3)">2</text>
+ </g>
+ <g transform="rotate(-53.89) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-40) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(40) translate(-2.7 3)">3</text>
+ </g>
+ <g transform="rotate(-20.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-6.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(6.667) translate(-2.7 3)">4</text>
+ </g>
+ <g transform="rotate(12.77) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(26.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-26.667) translate(-2.7 3)">5</text>
+ </g>
+ <g transform="rotate(46.11) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(60) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-60) translate(-2.7 3)">6</text>
+ </g>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(30 135)">0V = C4 = 261.63HZ</text>
+
+ <g transform="translate(144 60)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(4 50) rotate(270)">PARTIALS</text>
+ <g transform="translate(21 0)"><svg id="PARTIALS_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-partials-additator" transform="translate(5 -16)" href="#dial-partials-additator"/>
+ </g>
+
+ <g transform="translate(10 155)">
+ <g transform="translate(10 5)">
+
+
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(-3 22.5) rotate(270)">FINE</text>
+ <g transform="translate(10 0)"><svg id="FINE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ <g transform="translate(8 -7)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(53 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 33) rotate(270)">WIDTH</text>
+ <g transform="translate(16 0)"><svg id="WIDTH_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(59.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ <g transform="translate(106 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 38) rotate(270)">O-SKEW</text>
+ <g transform="translate(16 0)"><svg id="ODD_SKEW_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(112.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(158 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 37.5) rotate(270)">E-SKEW</text>
+ <g transform="translate(16 0)"><svg id="EVEN_SKEW_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(164.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(10 218)">
+ <g transform="translate(-1 0)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 28.5) rotate(270)">GAIN</text>
+ <g transform="translate(16 0)"><svg id="GAIN_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(5.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ <g transform="translate(53 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 33.5) rotate(270)">DECAY</text>
+ <g transform="translate(16 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(59.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(106 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 43) rotate(270)">BALANCE</text>
+ <g transform="translate(16 0)"><svg id="BALANCE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(112.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(158 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 34.5) rotate(270)">FILTER</text>
+ <g transform="translate(16 0)"><svg id="FILTER_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(164.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(185 272)">
+ <g transform="translate(0 0)"><svg id="SINE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">SIN</text>
+ <g transform="translate(0 15)"><svg id="COSINE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 21.1)">COS</text>
+ <g transform="translate(9 27)"><svg id="PHASE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="205" height="47" rx="5" transform="translate(10 44)"/>
+ <rect class="input-background" width="171" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background-filler" width="10" height="10" transform="translate(171 81)"/>
+
+ <g transform="translate(10 0)">
+ <g transform="translate(3 0)">
+ <g transform="translate(3 5)"><svg id="SYNC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">SYNC</text>
+ </g>
+ <g transform="translate(37 0)">
+ <g transform="translate(3 5)"><svg id="PARTIALS_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0.5 40)">PRTLS</text>
+ </g>
+ <g transform="translate(71 0)">
+ <g transform="translate(3 5)"><svg id="WIDTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0.5 40)">WIDTH</text>
+ </g>
+ <g transform="translate(105 0)">
+ <g transform="translate(3 5)"><svg id="ODD_SKEW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5 40)">OSK</text>
+ </g>
+ <g transform="translate(139 0)">
+ <g transform="translate(3 5)"><svg id="EVEN_SKEW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5.5 40)">ESK</text>
+ </g>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(3 0)">
+ <g transform="translate(3 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">V/OCT</text>
+ </g>
+ <g transform="translate(37 0)">
+ <g transform="translate(3 5)"><svg id="GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2 40)">GAIN</text>
+ </g>
+ <g transform="translate(71 0)">
+ <g transform="translate(3 5)"><svg id="DECAY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">DECAY</text>
+ </g>
+ <g transform="translate(105 0)">
+ <g transform="translate(3 5)"><svg id="BALANCE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5.5 40)">BAL</text>
+ </g>
+ <g transform="translate(139 0)">
+ <g transform="translate(3 5)"><svg id="FILTER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(3 40)">FLTR</text>
+ </g>
+ <g transform="translate(173 0)">
+ <g transform="translate(3 5)"><svg id="AUDIO_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 40)">OUT</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/AddrSeq-lowcontrast-pp.svg b/res-pp/AddrSeq-lowcontrast-pp.svg
@@ -0,0 +1,394 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-bipolar-addrseq" viewBox="0 0 40px 40px">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(10 0)"/>
+ <polyline points="0,0 4.0,0" stroke-width="1.0" transform="rotate(-165) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(10 0)"/>
+
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(10 0)"/>
+ <polyline points="0,0 4,0" stroke-width="1.0" transform="rotate(-15) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(10 0)"/>
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(60) translate(10 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="0.5px" text-anchor="end" transform="translate(85.0 17)">ADDR-SEQ</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(6.5 32)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 30)"/>
+ <g transform="translate(5 3)"><svg id="CLOCK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(4 35)">CLOCK</text>
+ </g>
+ <g class="io-group" transform="translate(6.5 69)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(5 35)">RESET</text>
+ </g>
+
+ <g transform="translate(1 121)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(7.5 0)">STEPS</text>
+ <g transform="translate(14.5 10.5)"><svg id="STEPS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -1)">
+ <g transform="translate(20 20)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(13 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(-197.1) translate(13 0) rotate(197.1) translate(-2 2)">2</text>
+ <text font-size="5.0pt" transform="rotate(-154.3) translate(13 0) rotate(154.3) translate(-2 2)">3</text>
+ <text font-size="5.0pt" transform="rotate(-111.4) translate(13 0) rotate(111.4) translate(-2 2)">4</text>
+ <text font-size="5.0pt" transform="rotate(-68.6) translate(13 0) rotate(68.6) translate(-2 2)">5</text>
+ <text font-size="5.0pt" transform="rotate(-25.7) translate(13 0) rotate(25.7) translate(-2 2)">6</text>
+ <text font-size="5.0pt" transform="rotate(17.1) translate(13 0) rotate(-17.1) translate(-2 2)">7</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-2 2)">8</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(16.5 166)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.8 -1)">FWD</text>
+ <g transform="translate(0 2)"><svg id="DIRECTION_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.3 34)">REV</text>
+ </g>
+
+
+
+ <g transform="translate(1 220)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(4.5 0)">SELECT</text>
+ <g transform="translate(0 2)"><svg id="SELECT_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 2)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(19 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(-197.1) translate(19 0) rotate(197.1) translate(-2 2)">2</text>
+ <text font-size="5.0pt" transform="rotate(-154.3) translate(19 0) rotate(154.3) translate(-2 2)">3</text>
+ <text font-size="5.0pt" transform="rotate(-111.4) translate(19 0) rotate(111.4) translate(-2 2)">4</text>
+ <text font-size="5.0pt" transform="rotate(-68.6) translate(19 0) rotate(68.6) translate(-2 2)">5</text>
+ <text font-size="5.0pt" transform="rotate(-25.7) translate(19 0) rotate(25.7) translate(-2 2)">6</text>
+ <text font-size="5.0pt" transform="rotate(17.1) translate(19 0) rotate(-17.1) translate(-2 2)">7</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(19 0) rotate(-60) translate(-2 2)">8</text>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(5.5 47)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SELECT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(6.5 321)">
+ <rect class="output-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 35)">OUT</text>
+ </g>
+
+ <g transform="translate(49.5 32)">
+ <g transform="translate(9 4)"><svg id="OUT1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 -8)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 32)">1</text>
+ <g transform="translate(17 26.5)"><svg id="OUT1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 45.3)"><svg id="OUT2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 33.3)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 73.3)">2</text>
+ <g transform="translate(17 67.8)"><svg id="OUT2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 86.6)"><svg id="OUT3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 74.6)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 114.6)">3</text>
+ <g transform="translate(17 109.1)"><svg id="OUT3_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 127.9)"><svg id="OUT4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 115.9)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 155.9)">4</text>
+ <g transform="translate(17 150.4)"><svg id="OUT4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 169.1)"><svg id="OUT5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 157.1)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 197.1)">5</text>
+ <g transform="translate(17 191.6)"><svg id="OUT5_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 210.4)"><svg id="OUT6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 198.4)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 238.4)">6</text>
+ <g transform="translate(17 232.9)"><svg id="OUT6_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 251.7)"><svg id="OUT7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 239.7)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 279.7)">7</text>
+ <g transform="translate(17 274.2)"><svg id="OUT7_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(9 293)"><svg id="OUT8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-bipolar-addrseq" transform="translate(-3 281)" href="#dial-bipolar-addrseq"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 321)">8</text>
+ <g transform="translate(17 315.5)"><svg id="OUT8_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+
+
+
+
+</svg>
diff --git a/res-pp/Analyzer-lowcontrast-pp.svg b/res-pp/Analyzer-lowcontrast-pp.svg
@@ -0,0 +1,392 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="300.0" height="380.0" viewBox="0 0 300.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-range-analyzer" viewBox="0 0 100px 100px">
+ <g transform="translate(50.5 50.5)">
+ <path d="M 0 -32 A 32 32 0 0 1 32 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(15)"/>
+ <path d="M 0 -32 A 32 32 0 0 1 32 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(50)"/>
+ <path d="M 0 -32 A 32 32 0 0 0 -32 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-15)"/>
+ <path d="M 0 -32 A 32 32 0 0 0 -32 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-50)"/>
+ <g transform="rotate(-90) translate(29 0)">
+ <polyline points="0,0 6,0" stroke-width="1.5"/>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-smooth-analyzer" viewBox="0 0 100px 100px">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(31 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-4 4)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(31 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-6 4.3)">500ms</text>
+ </g>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="300.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 299.0,1 299.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 299.5,0.5 299.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 300.0,0 300.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(150.0 19)">ANALYZER</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(150.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(134.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(10 25)">
+ <svg id="DISPLAY_WIDGET">
+ <rect cx="0" cy="0" width="280" height="230" fill="#444"/>
+ </svg>
+ </g>
+
+
+
+
+
+
+
+ <g transform="translate(0 320)">
+ <g class="io-group" transform="translate(10 0)">
+ <rect class="input-background" width="62" height="40" rx="5"/>
+ <rect class="output-background" width="23" height="40" rx="5" transform="translate(40)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 3)"><svg id="SIGNALA_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10.5 36)">IN</text>
+ <g transform="translate(34.5 3)"><svg id="SIGNALA_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33.5 36)">THRU</text>
+ </g>
+
+ <g class="io-group" transform="translate(82.5 0)">
+ <rect class="input-background" width="62" height="40" rx="5"/>
+ <rect class="output-background" width="23" height="40" rx="5" transform="translate(40)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 3)"><svg id="SIGNALB_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10.5 36)">IN</text>
+ <g transform="translate(34.5 3)"><svg id="SIGNALB_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33.5 36)">THRU</text>
+ </g>
+
+ <g class="io-group" transform="translate(155 0)">
+ <rect class="input-background" width="62" height="40" rx="5"/>
+ <rect class="output-background" width="23" height="40" rx="5" transform="translate(40)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 3)"><svg id="SIGNALC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10.5 36)">IN</text>
+ <g transform="translate(34.5 3)"><svg id="SIGNALC_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33.5 36)">THRU</text>
+ </g>
+
+ <g class="io-group" transform="translate(227 0)">
+ <rect class="input-background" width="62" height="40" rx="5"/>
+ <rect class="output-background" width="23" height="40" rx="5" transform="translate(40)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 3)"><svg id="SIGNALD_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10.5 36)">IN</text>
+ <g transform="translate(34.5 3)"><svg id="SIGNALD_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33.5 36)">THRU</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 271)">
+ <g transform="translate(30 0)">
+ <g transform="translate(0 0)"><svg id="RANGE2_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text font-size="7pt" letter-spacing="2px" transform="rotate(-90) translate(-38 -11)">RANGE</text>
+ </g>
+
+ <g transform="translate(103 0)">
+ <g transform="translate(0 0)"><svg id="SMOOTH_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text font-size="7pt" letter-spacing="2px" transform="rotate(-90) translate(-44 -11)">SMOOTH</text>
+ </g>
+
+ <g transform="translate(175 0)">
+ <g transform="translate(-5 -5)">
+ <g transform="translate(0 1)">
+ <g transform="translate(0 0)"><svg id="QUALITY_ULTRA_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">ULTRA</text>
+ </g>
+ <g transform="translate(0 15)">
+ <g transform="translate(0 0)"><svg id="QUALITY_HIGH_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">HIGH</text>
+ </g>
+ <g transform="translate(0 29)">
+ <g transform="translate(0 0)"><svg id="QUALITY_GOOD_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">GOOD</text>
+ </g>
+ <g transform="translate(9 40)">
+ <svg id="QUALITY_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+ <text font-size="7pt" letter-spacing="2px" transform="rotate(-90) translate(-45 -11)">QUALITY</text>
+ </g>
+
+ <g transform="translate(247 0)">
+ <g transform="translate(-6 -5)">
+ <g transform="translate(0 1)">
+ <g transform="translate(0 0)"><svg id="WINDOW_NONE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">NONE</text>
+ </g>
+ <g transform="translate(0 15)">
+ <g transform="translate(0 0)"><svg id="WINDOW_HAMMING_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="0.5px" transform="translate(9 6.1)">HAMMING</text>
+ </g>
+ <g transform="translate(0 29)">
+ <g transform="translate(0 0)"><svg id="WINDOW_KAISER_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(9 6.1)">KAISER</text>
+ </g>
+ <g transform="translate(9 40)">
+ <svg id="WINDOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+ <text font-size="7pt" letter-spacing="2px" transform="rotate(-90) translate(-43.5 -11)">WINDOW</text>
+ </g>
+ </g>
+
+ <use xlink:href="#dial-range-analyzer" transform=" translate(11.3 252) scale(0.75)" href="#dial-range-analyzer"/>
+ <use xlink:href="#dial-smooth-analyzer" transform=" translate(84.3 252) scale(0.75)" href="#dial-smooth-analyzer"/>
+</svg>
diff --git a/res-pp/Arp-lowcontrast-pp.svg b/res-pp/Arp-lowcontrast-pp.svg
@@ -0,0 +1,296 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">ARP</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+
+
+
+ <g transform="translate(3 18)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(5 6)">MODE</text>
+ <g transform="translate(0 10)">
+ <g transform="translate(0 0)"><svg id="UP_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">UP</text>
+ </g>
+ <g transform="translate(21 10)">
+ <g transform="translate(0 0)"><svg id="DOWN_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">DN</text>
+ </g>
+ <g transform="translate(0 20)">
+ <g transform="translate(0 0)"><svg id="UP_DOWN_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">PD</text>
+ </g>
+ <g transform="translate(21 20)">
+ <g transform="translate(0 0)"><svg id="UP_DOWN_REPEAT_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">PR</text>
+ </g>
+ <g transform="translate(0 30)">
+ <g transform="translate(0 0)"><svg id="IN_ORDER_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">IO</text>
+ </g>
+ <g transform="translate(21 30)">
+ <g transform="translate(0 0)"><svg id="RANDOM_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">RD</text>
+ </g>
+ <g transform="translate(0 40)">
+ <g transform="translate(0 0)"><svg id="SHUFFLE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">SH</text>
+ </g>
+ <g transform="translate(21 39)"><svg id="MODE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(2.5 78.5)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(7.5 0)">GATE</text>
+ <g transform="translate(12 9)"><svg id="GATE_LENGTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -3)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(6 115)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 6)">HOLD</text>
+ <g transform="translate(23 -1)"><svg id="HOLD_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+
+ </g>
+
+ <g transform="translate(0 129)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="143" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 133)"/>
+ <g transform="translate(5 3)"><svg id="CLOCK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(2.3 35)">CLOCK</text>
+ <g transform="translate(5 38)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(2.3 70)">RESET</text>
+ <g transform="translate(5 73)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3 105)">V/OCT</text>
+ <g transform="translate(5 108)"><svg id="GATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 140)">GATE</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 146)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="PITCH_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(3 32)">V/OCT</text>
+ <g transform="translate(5 35)"><svg id="GATE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 67)">GATE</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Assign-lowcontrast-pp.svg b/res-pp/Assign-lowcontrast-pp.svg
@@ -0,0 +1,236 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">ASSIGN</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(8 0)">CHAN</text>
+ <g transform="translate(9.5 9)"><svg id="CHANNELS_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">1</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-220) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-200) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-180) translate(17 0) rotate(180) translate(-2 2.2)">4</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-160) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-140) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-100) translate(17 0) rotate(100) translate(-1.9 2.5)">8</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-80) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-40) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-20) translate(17 0) rotate(20) translate(-3 2.4)">12</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(20) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(40) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">16</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 75)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 98)"/>
+ <rect class="input-background" width="34" height="105" rx="5"/>
+ <g transform="translate(5 3)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3 35)">V/OCT</text>
+ <g transform="translate(5 38)"><svg id="GATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 70)">GATE</text>
+ <g transform="translate(5 73)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3 105)">RESET</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 111)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="PITCH_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(3 32)">V/OCT</text>
+ <g transform="translate(5 35)"><svg id="GATE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 67)">GATE</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Blank3-lowcontrast-pp.svg b/res-pp/Blank3-lowcontrast-pp.svg
@@ -0,0 +1,153 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+
+
+
+
+
+
+
+</svg>
diff --git a/res-pp/Blank6-lowcontrast-pp.svg b/res-pp/Blank6-lowcontrast-pp.svg
@@ -0,0 +1,153 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+
+
+
+
+
+
+
+</svg>
diff --git a/res-pp/Bool-lowcontrast-pp.svg b/res-pp/Bool-lowcontrast-pp.svg
@@ -0,0 +1,221 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">BOOL</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g class="io-group" transform="translate(7.5 18)">
+ <rect class="input-background" width="34" height="63.5" rx="5" transform="translate(-2 0)"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(-2 53.5)"/>
+ <g transform="translate(3 5)"><svg id="A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 35)"><svg id="B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(7.5 82)">
+ <rect class="output-background" width="34" height="123" rx="5" transform="translate(-2 0)"/>
+ <rect class="output-background-filler" width="34" height="10" transform="translate(-2 0)"/>
+ <g transform="translate(3 4)"><svg id="AND_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.3 37)">AND</text>
+ <g transform="translate(3 44)"><svg id="OR_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(9.5 77)">OR</text>
+ <g transform="translate(3 84)"><svg id="XOR_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 117)">XOR</text>
+ </g>
+
+ <g transform="translate(0 217)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 22)"/>
+ <rect class="input-background" width="34" height="32" rx="5"/>
+ <g transform="translate(5 4)"><svg id="NOT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(5.5 35)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 2)"><svg id="NOT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 34)">NOT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/CVD-lowcontrast-pp.svg b/res-pp/CVD-lowcontrast-pp.svg
@@ -0,0 +1,273 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-mix-cvd" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2 2)">D</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 2)">W</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">CVD</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(9.5 0)">TIME</text>
+ <g transform="translate(0 3)"><svg id="TIME_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 3)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 2)">1</text>
+ </g>
+ </g>
+ <g transform="translate(14.5 59)"><svg id="TIME_SCALE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 44.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-135) translate(15 0) rotate(135) translate(-8 2)">0.1</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-135) translate(9.5 0)"/>
+ <text font-size="5.0pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-2 2)">1</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-90) translate(9.5 0)"/>
+ <text font-size="5.0pt" transform="rotate(-45) translate(15 0) rotate(45) translate(-2 2)">10</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-45) translate(9.5 0)"/>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(5.5 79)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="TIME_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 165)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(2 0)">DRY/WET</text>
+ <g transform="translate(0 3)"><svg id="MIX_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-mix-cvd" transform="translate(0 3)" href="#dial-mix-cvd"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 264)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Clpr-lowcontrast-pp.svg b/res-pp/Clpr-lowcontrast-pp.svg
@@ -0,0 +1,274 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">CLPR</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+
+
+ <g transform="translate(0 40)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 0)">THRESHOLD</text>
+ <g transform="translate(26 12)"><svg id="THRESHOLD_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(10 -4)">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-10 2.5)">-24</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-180) translate(25 0) rotate(180) translate(-10 2.5)">-18</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-120) translate(25 0) rotate(120) translate(-10 2.5)">-12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-60) translate(25 0) rotate(60) translate(-2.3 2.5)">-6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(0) translate(25 0) rotate(0) translate(-2.3 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-2.3 2.5)">6</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 122)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(15.5 0)">OUT GAIN</text>
+ <g transform="translate(26 12)"><svg id="OUTPUT_GAIN_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(10 -4)">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-4 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-202.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-165) translate(25 0) rotate(165) translate(-3.5 2.5)">6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-127.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-90) translate(25 0) rotate(90) translate(-5 2.5)">12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-52.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-15) translate(25 0) rotate(15) translate(-2 2.5)">18</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(22.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-1 2.5)">24</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(40 198)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 25.5) rotate(270)">KNEE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 -1)">SOFT</text>
+ <g transform="translate(0 2)"><svg id="KNEE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 34)">HARD</text>
+ </g>
+
+ <g transform="translate(11 240)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="input-background-filler" width="68" height="10" transform="translate(0 66)"/>
+ <rect class="input-background" width="68" height="73" rx="5"/>
+ <g transform="translate(5 4)"><svg id="LEFT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 36)">L</text>
+ <g transform="translate(39 4)"><svg id="RIGHT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(49 36)">R</text>
+ <g transform="translate(5 40)"><svg id="THRESHOLD_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 72)">TRSH</text>
+ <g transform="translate(39 40)"><svg id="OUTPUT_GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(42 72)">OGN</text>
+ </g>
+ <g class="io-group" transform="translate(0 79)">
+ <rect class="output-background-filler" width="68" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="68" height="37" rx="5"/>
+ <g transform="translate(5 1)"><svg id="LEFT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 33)">L</text>
+ <g transform="translate(39 1)"><svg id="RIGHT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(49 33)">R</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Cmp-lowcontrast-pp.svg b/res-pp/Cmp-lowcontrast-pp.svg
@@ -0,0 +1,379 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-voltage-cmp" viewBox="0 0 90px 45px">
+
+ <g transform="translate(8 22.5)">
+ <text font-size="5.0pt" transform="rotate(-22.5) translate(14 0) rotate(22.5) translate(-1 2.6)">-10V</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-22.5) translate(9.5 0)"/>
+ <text font-size="5.0pt" transform="rotate(22.5) translate(14 0) rotate(-22.5) translate(-1 2.0)">+/-5V</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(22.5) translate(9.5 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-offset-cmp" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(21 0) rotate(240) translate(-5 2.2)">-10</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-165) translate(17 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(17 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-90) translate(19 0) rotate(90) translate(-1.9 2.2)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-15) translate(17 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(17 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(60) translate(21 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-lag-cmp" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-1.9 2.2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(-145.13) translate(20.5 0) rotate(145.13) translate(-4.7 2.2)">0.1</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105.84) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75.86) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-50.26) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-27.87) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-7.62) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(11) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(28.33) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(44.6) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-1.8 2.2)">1</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">CMP</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+ <g transform="translate(0 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(20 0)">A</text>
+ <g transform="translate(0 3)"><svg id="A_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-offset-cmp" transform="translate(0 3)" href="#dial-offset-cmp"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(13 35)">IN</text>
+ </g>
+ </g>
+
+ <g transform="translate(45 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(20 0)">B</text>
+ <g transform="translate(0 3)"><svg id="B_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-offset-cmp" transform="translate(0 3)" href="#dial-offset-cmp"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(13 35)">IN</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 140)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(3.5 0)">WINDOW</text>
+ <g transform="translate(0 3)"><svg id="WINDOW_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 3)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-1.9 2.2)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-90) translate(17 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="WINDOW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(45 140)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(14 0)">LAG</text>
+ <g transform="translate(0 3)"><svg id="LAG_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-lag-cmp" transform="translate(0 3)" href="#dial-lag-cmp"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="LAG_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(25 239)">
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(1.5 7)">OUTPUT</text>
+ <g transform="translate(0.5 12)"><svg id="OUTPUT_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-voltage-cmp" transform="translate(0.5 -2.5)" href="#dial-voltage-cmp"/>
+ </g>
+
+ <g class="io-group" transform="translate(11 279)">
+ <rect class="output-background" width="68" height="77" rx="5"/>
+ <g transform="translate(5 4)"><svg id="GREATER_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(9 36.5)">
+ <text class="output-label" font-size="5pt" transform="translate(0 0)">A</text>
+ <text class="output-label" font-size="8pt" style="font-weight: normal" transform="translate(6 0.5)">≥</text>
+ <text class="output-label" font-size="5pt" transform="translate(13 0)">B</text>
+ </g>
+ <g transform="translate(39 4)"><svg id="LESS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(43 36.5)">
+ <text class="output-label" font-size="5pt" transform="translate(0 0)">A</text>
+ <text class="output-label" font-size="8pt" style="font-weight: normal" transform="translate(6 1)"><</text>
+ <text class="output-label" font-size="5pt" transform="translate(13 0)">B</text>
+ </g>
+ <g transform="translate(5 40)"><svg id="EQUAL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12 72)">EQ</text>
+ <g transform="translate(39 40)"><svg id="NOT_EQUAL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(42 72)">NOT</text>
+ </g>
+</svg>
diff --git a/res-pp/CmpDist-lowcontrast-pp.svg b/res-pp/CmpDist-lowcontrast-pp.svg
@@ -0,0 +1,474 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-attenuverter-cmpdist" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="7pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-1.2 2.2)">-</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-165) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(17 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(20 0) rotate(90) translate(-1.9 3)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-15) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(17 0)"/>
+
+ <text font-size="5pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-drywet-cmpdist" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2.5 3)">D</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 4.5,0" stroke-width="1" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="5pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 3)">W</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">CMPDIST</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+
+
+
+
+ <g transform="translate(6 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(3.5 0)">A SCALE</text>
+ <g transform="translate(0 3)"><svg id="A_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-attenuverter-cmpdist" transform="translate(0 3)" href="#dial-attenuverter-cmpdist"/>
+ </g>
+
+ <g transform="translate(52.5 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 0)">WINDOW</text>
+ <g transform="translate(0 3)"><svg id="WINDOW_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 3)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-1.9 2.2)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-90) translate(17 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(99 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(3.5 0)">B SCALE</text>
+ <g transform="translate(0 3)"><svg id="B_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-attenuverter-cmpdist" transform="translate(0 3)" href="#dial-attenuverter-cmpdist"/>
+ </g>
+
+ <g transform="translate(6 100)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(6.5 0)">GT MIX</text>
+ <g transform="translate(0 3)"><svg id="GT_MIX_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-attenuverter-cmpdist" transform="translate(0 3)" href="#dial-attenuverter-cmpdist"/>
+ </g>
+
+ <g transform="translate(52.5 100)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(6.5 0)">EQ MIX</text>
+ <g transform="translate(0 3)"><svg id="EQ_MIX_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-attenuverter-cmpdist" transform="translate(0 3)" href="#dial-attenuverter-cmpdist"/>
+ </g>
+
+ <g transform="translate(99 100)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(7 0)">LT MIX</text>
+ <g transform="translate(0 3)"><svg id="LT_MIX_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-attenuverter-cmpdist" transform="translate(0 3)" href="#dial-attenuverter-cmpdist"/>
+ </g>
+
+
+
+
+
+ <g transform="translate(52.5 165)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(2.5 0)">DRY/WET</text>
+ <g transform="translate(0 3)"><svg id="DRY_WET_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-drywet-cmpdist" transform="translate(0 3)" href="#dial-drywet-cmpdist"/>
+ </g>
+
+ <g transform="translate(20.5 182.5)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(-6 -9)">A DRY</text>
+ <g transform="translate(0 0)"><svg id="A_DRY_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-12.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(113.5 182.5)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(-6 -9)">B DRY</text>
+ <g transform="translate(0 0)"><svg id="B_DRY_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-12.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(0 225)">
+ <rect class="input-background" width="130" height="135" rx="5" transform="translate(10 0)"/>
+ <rect class="output-background" width="65" height="91" rx="5" transform="translate(75 44)"/>
+ <rect class="output-background-filler" width="10" height="8" transform="translate(75 44)"/>
+ <rect class="output-background-filler" width="10" height="8" transform="translate(130 44)"/>
+ <rect class="output-background-filler" width="10" height="8" transform="translate(75 127)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="GT_MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5 40)">GTM</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="LT_MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(6 40)">LTM</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="WINDOW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="0.5px" transform="translate(1.5 40)">WNDW</text>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="DRY_WET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(6 40)">D/W</text>
+ </g>
+
+ <g transform="translate(0 44)">
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5 40)">A IN</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="A_SCALE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1.5 40)">A SCL</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="GT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(8 40)">GT</text>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="LT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(9.5 40)">LT</text>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5 40)">B IN</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="B_SCALE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1.5 40)">B SCL</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="EQ_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(9 40)">EQ</text>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="MIX_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 40)">MIX</text>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/DADSRH-lowcontrast-pp.svg b/res-pp/DADSRH-lowcontrast-pp.svg
@@ -0,0 +1,721 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">DADSR(H)</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(9 33)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 40) rotate(270)">DELAY</text>
+ <g transform="translate(18 0)"><svg id="DELAY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 43)"><svg id="DELAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 56)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">ATT</text>
+ <g transform="translate(18 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 112)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">DEC</text>
+ <g transform="translate(18 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 168)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">SUS</text>
+ <g transform="translate(18 0)"><svg id="SUSTAIN_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="SUSTAIN_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 224)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">REL</text>
+ <g transform="translate(18 0)"><svg id="RELEASE_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="RELEASE_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 280)">
+ <g transform="translate(75 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(48 2) rotate(90)">HOLD</text>
+ <g transform="translate(-1.7 0)"><svg id="HOLD_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="scale(0.75) translate(11 19)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 94)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 169)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 243)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 318)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(85 392.5)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+
+ <g transform="translate(77 96)">
+ <g transform="translate(0 0)">
+ <svg id="ATTACK_SHAPE1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 5)">
+ <path d="M 1 1 Q 1 -6, 8 -6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 10)">
+ <svg id="ATTACK_SHAPE2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 5)">
+ <polyline points="0,1 10,1" stroke-width="1" fill="none" transform="rotate(-45)"/>
+ </g>
+ </g>
+ <g transform="translate(0 20)">
+ <svg id="ATTACK_SHAPE3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 5)">
+ <path d="M 0 1 Q 7 1, 8 -7" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 28)">
+ <svg id="ATTACK_SHAPE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+
+ <g transform="translate(77 152.5)">
+ <g transform="translate(0 0)">
+ <g transform="translate(0 0)"><svg id="DECAY_SHAPE1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 1 6, 8 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 10)">
+ <svg id="DECAY_SHAPE2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(6 -2)">
+ <polyline points="0,1 10,1" stroke-width="1" fill="none" transform="rotate(45)"/>
+ </g>
+ </g>
+ <g transform="translate(0 20)">
+ <svg id="DECAY_SHAPE3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 6 0, 7 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 28)">
+ <svg id="DECAY_SHAPE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+
+ <g transform="translate(77 264.5)">
+ <g transform="translate(0 0)">
+ <svg id="RELEASE_SHAPE1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 1 6, 8 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 10)">
+ <svg id="RELEASE_SHAPE2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(6 -2)">
+ <polyline points="0,1 10,1" stroke-width="1" fill="none" transform="rotate(45)"/>
+ </g>
+ </g>
+ <g transform="translate(0 20)">
+ <svg id="RELEASE_SHAPE3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 6 0, 7 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 28)">
+ <svg id="RELEASE_SHAPE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+
+
+ <g class="io-group" transform="translate(84 37)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <g transform="translate(6 6)"><svg id="TRIGGER_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(31 3)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">TRIGGER</text>
+ </g>
+
+ <g transform="translate(120 93)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 27.5) rotate(270)">MODE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 -1)">GATE</text>
+ <g transform="translate(0 2)"><svg id="MODE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">TRIG</text>
+ </g>
+
+ <g transform="translate(120 143)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 28.5) rotate(270)">CYCLE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4.5 -1)">STOP</text>
+ <g transform="translate(0 2)"><svg id="LOOP_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">LOOP</text>
+ </g>
+
+ <g transform="translate(20 319)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-7 28.5) rotate(270)">SPEED</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(2 -1)">1X</text>
+ <g transform="translate(0 2)"><svg id="SPEED_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1 34)">10X</text>
+ </g>
+
+ <g transform="translate(55 319)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-7 31) rotate(270)">RETRIG</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.5 -1)">ATT</text>
+ <g transform="translate(0 2)"><svg id="RETRIGGER_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.5 34)">RST</text>
+ </g>
+
+ <g class="io-group" transform="translate(112 187)">
+ <rect class="output-background" width="30" height="116" rx="5"/>
+ <g transform="translate(0 1)">
+ <g transform="translate(3 3)"><svg id="ENV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">ENV</text>
+ </g>
+ <g transform="translate(0 38)">
+ <g transform="translate(3 3)"><svg id="INV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">INV</text>
+ </g>
+ <g transform="translate(0 75)">
+ <g transform="translate(3 3)"><svg id="TRIGGER_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">END</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/DADSRHPlus-lowcontrast-pp.svg b/res-pp/DADSRHPlus-lowcontrast-pp.svg
@@ -0,0 +1,794 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">DADSR(H)+</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(149 26)">
+ <rect class="input-background" width="30" height="323" rx="5"/>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8 10)">CV</text>
+ </g>
+ <g class="io-group" transform="translate(186 26)">
+ <rect class="output-background" width="30" height="267" rx="5"/>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(2 10)">GATE</text>
+ </g>
+
+ <g transform="translate(9 33)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 40) rotate(270)">DELAY</text>
+ <g transform="translate(18 0)"><svg id="DELAY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 43)"><svg id="DELAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(143 7)"><svg id="DELAY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="DELAY_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 56)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">ATT</text>
+ <g transform="translate(18 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(143 7)"><svg id="ATTACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="ATTACK_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 112)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">DEC</text>
+ <g transform="translate(18 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(143 7)"><svg id="DECAY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="DECAY_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 168)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">SUS</text>
+ <g transform="translate(18 0)"><svg id="SUSTAIN_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="SUSTAIN_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(143 7)"><svg id="SUSTAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="SUSTAIN_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 224)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 31) rotate(270)">REL</text>
+ <g transform="translate(18 0)"><svg id="RELEASE_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 34)"><svg id="RELEASE_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(143 7)"><svg id="RELEASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="RELEASE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(75 280)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(48 2) rotate(90)">HOLD</text>
+ <g transform="translate(-1.7 0)"><svg id="HOLD_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(68 7)"><svg id="HOLD_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="scale(0.75) translate(11 19)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 94)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 169)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 243)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(11 318)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(85 392.5)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+
+ <g transform="translate(77 96)">
+ <g transform="translate(0 0)">
+ <svg id="ATTACK_SHAPE1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 5)">
+ <path d="M 1 1 Q 1 -6, 8 -6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 10)">
+ <svg id="ATTACK_SHAPE2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 5)">
+ <polyline points="0,1 10,1" stroke-width="1" fill="none" transform="rotate(-45)"/>
+ </g>
+ </g>
+ <g transform="translate(0 20)">
+ <svg id="ATTACK_SHAPE3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 5)">
+ <path d="M 0 1 Q 7 1, 8 -7" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 28)">
+ <svg id="ATTACK_SHAPE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+
+ <g transform="translate(77 152.5)">
+ <g transform="translate(0 0)">
+ <svg id="DECAY_SHAPE1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 1 6, 8 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 10)">
+ <svg id="DECAY_SHAPE2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(6 -2)">
+ <polyline points="0,1 10,1" stroke-width="1" fill="none" transform="rotate(45)"/>
+ </g>
+ </g>
+ <g transform="translate(0 20)">
+ <svg id="DECAY_SHAPE3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 6 0, 7 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 28)">
+ <svg id="DECAY_SHAPE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+
+ <g transform="translate(77 264.5)">
+ <g transform="translate(0 0)">
+ <svg id="RELEASE_SHAPE1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 1 6, 8 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 10)">
+ <svg id="RELEASE_SHAPE2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(6 -2)">
+ <polyline points="0,1 10,1" stroke-width="1" fill="none" transform="rotate(45)"/>
+ </g>
+ </g>
+ <g transform="translate(0 20)">
+ <svg id="RELEASE_SHAPE3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg>
+ <g transform="translate(5 0)">
+ <path d="M 0.5 -1 Q 6 0, 7 6" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(0 28)">
+ <svg id="RELEASE_SHAPE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg>
+ </g>
+ </g>
+
+
+ <g class="io-group" transform="translate(84 37)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <g transform="translate(6 6)"><svg id="TRIGGER_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(31 3)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">TRIGGER</text>
+ </g>
+
+ <g transform="translate(120 93)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 27.5) rotate(270)">MODE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 -1)">GATE</text>
+ <g transform="translate(0 2)"><svg id="MODE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">TRIG</text>
+ </g>
+
+ <g transform="translate(120 143)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 28.5) rotate(270)">CYCLE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4.5 -1)">STOP</text>
+ <g transform="translate(0 2)"><svg id="LOOP_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">LOOP</text>
+ </g>
+
+ <g transform="translate(20 319)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-7 28.5) rotate(270)">SPEED</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(2 -1)">1X</text>
+ <g transform="translate(0 2)"><svg id="SPEED_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1 34)">10X</text>
+ </g>
+
+ <g transform="translate(55 319)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-7 31) rotate(270)">RETRIG</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.5 -1)">ATT</text>
+ <g transform="translate(0 2)"><svg id="RETRIGGER_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.5 34)">RST</text>
+ </g>
+
+ <g class="io-group" transform="translate(112 187)">
+ <rect class="output-background" width="30" height="116" rx="5"/>
+ <g transform="translate(0 1)">
+ <g transform="translate(3 3)"><svg id="ENV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">ENV</text>
+ </g>
+ <g transform="translate(0 38)">
+ <g transform="translate(3 3)"><svg id="INV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">INV</text>
+ </g>
+ <g transform="translate(0 75)">
+ <g transform="translate(3 3)"><svg id="TRIGGER_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">END</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/DGate-lowcontrast-pp.svg b/res-pp/DGate-lowcontrast-pp.svg
@@ -0,0 +1,325 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">DGATE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6.5 0)">DELAY</text>
+ <g transform="translate(0 0)"><svg id="DELAY_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="DELAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 84)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(8.5 0)">GATE</text>
+ <g transform="translate(0 0)"><svg id="GATE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <g transform="translate(3 0) rotate(240)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(17 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(17 0)">
+ <g transform="translate(3 0) rotate(145.13)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(17 0)">
+ <g transform="translate(3 0) rotate(27.87)">
+ <text font-size="6.5pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(20.8 40)"><svg id="GATE_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(15.5 143)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4.5 -1)">STOP</text>
+ <g transform="translate(0 2)"><svg id="LOOP_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">LOOP</text>
+ </g>
+
+ <g transform="translate(0 187)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 58)"/>
+ <rect class="input-background" width="34" height="62" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 26)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 58)">TRIG</text>
+ </g>
+ <g class="io-group" transform="translate(0 62)">
+ <rect class="output-background" width="34" height="74" rx="5" transform="translate(5.5 0)"/>
+ <rect class="output-background-filler" width="34" height="10" transform="translate(5.5 0)"/>
+ <g transform="translate(5.5 0)">
+ <g transform="translate(5 3)"><svg id="GATE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 35)">GATE</text>
+ </g>
+ <g transform="translate(5.5 38)">
+ <g transform="translate(5 0)"><svg id="END_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 32)">END</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Detune-lowcontrast-pp.svg b/res-pp/Detune-lowcontrast-pp.svg
@@ -0,0 +1,257 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-cents-detune" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">50</text>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">DETUNE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">CENTS</text>
+ <g transform="translate(9.5 7.5)"><svg id="CENTS_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-cents-detune" transform="translate(0 -2)" href="#dial-cents-detune"/>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 74)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+
+ <g transform="translate(0 123)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3 35)">V/OCT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="107" rx="5"/>
+ <g transform="translate(5 0)"><svg id="THRU_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 32)">THRU</text>
+ <g transform="translate(5 36)"><svg id="OUT_PLUS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 68)">OUT+</text>
+ <g transform="translate(5 72)"><svg id="OUT_MINUS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 104)">OUT-</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/EQ-lowcontrast-pp.svg b/res-pp/EQ-lowcontrast-pp.svg
@@ -0,0 +1,238 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-eq-eq" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-6 3)">-36</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-215) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-190) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-165) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-140) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-115) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(-90) translate(20 0) rotate(90) translate(-1.9 3)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-52.5) translate(17 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-15) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(22.5) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-3.5 3)">12</text>
+ <text font-size="5.0pt" transform="rotate(90) translate(20 0) rotate(-90) translate(-4 3)">dB</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">EQ</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 36)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(12.5 0)">LOW</text>
+ <g transform="translate(0 3)"><svg id="LOW_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-eq-eq" transform="translate(0 3)" href="#dial-eq-eq"/>
+
+ </g>
+
+ <g transform="translate(0 114)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(13.5 0)">MID</text>
+ <g transform="translate(0 3)"><svg id="MID_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-eq-eq" transform="translate(0 3)" href="#dial-eq-eq"/>
+
+ </g>
+
+ <g transform="translate(0 192)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(10 0)">HIGH</text>
+ <g transform="translate(0 3)"><svg id="HIGH_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-eq-eq" transform="translate(0 3)" href="#dial-eq-eq"/>
+
+ </g>
+
+ <g transform="translate(0 264)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/EQS-lowcontrast-pp.svg b/res-pp/EQS-lowcontrast-pp.svg
@@ -0,0 +1,247 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-eq-eqs" viewBox="0 0 70px 70px">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-10 2.5)">-36</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-215) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-190) translate(25 0) rotate(190) translate(-10 2.5)">-24</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-165) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-140) translate(25 0) rotate(140) translate(-10 2.5)">-12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-115) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-90) translate(25 0) rotate(90) translate(-2.3 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-52.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-15) translate(25 0) rotate(15) translate(-3 2.5)">6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(22.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-2.3 2.5)">12</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">EQS</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+ <g transform="translate(0 40)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(32 0)">LOW</text>
+ <g transform="translate(26 13)"><svg id="LOW_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-eq-eqs" transform="translate(10 -3)" href="#dial-eq-eqs"/>
+ </g>
+
+ <g transform="translate(0 122)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(33 0)">MID</text>
+ <g transform="translate(26 13)"><svg id="MID_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-eq-eqs" transform="translate(10 -3)" href="#dial-eq-eqs"/>
+ </g>
+
+ <g transform="translate(0 204)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(29 0)">HIGH</text>
+ <g transform="translate(26 13)"><svg id="HIGH_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-eq-eqs" transform="translate(10 -3)" href="#dial-eq-eqs"/>
+ </g>
+
+ <g transform="translate(11 275)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="input-background-filler" width="68" height="10" transform="translate(0 31)"/>
+ <rect class="input-background" width="68" height="38" rx="5"/>
+ <g transform="translate(5 4)"><svg id="LEFT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 36)">L</text>
+ <g transform="translate(39 4)"><svg id="RIGHT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(49 36)">R</text>
+ </g>
+ <g class="io-group" transform="translate(0 44)">
+ <rect class="output-background-filler" width="68" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="68" height="37" rx="5"/>
+ <g transform="translate(5 1)"><svg id="LEFT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 33)">L</text>
+ <g transform="translate(39 1)"><svg id="RIGHT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(49 33)">R</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Edge-lowcontrast-pp.svg b/res-pp/Edge-lowcontrast-pp.svg
@@ -0,0 +1,340 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-time-edge" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-225) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-210) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-195) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-165) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-150) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-135) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-105) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+
+ <g transform="rotate(-90) translate(17 0)">
+
+ <g transform="translate(2.4 0) rotate(90)">
+ <text font-size="5pt" transform="translate(-1.9 2)">0</text>
+ </g>
+ </g>
+
+ <g transform="rotate(-75) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-45) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-15) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(0) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(15) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(45) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+
+ <g transform="rotate(-225) translate(22 0)">
+
+ <g transform="translate(2.5 0) rotate(225)">
+ <text font-size="5pt" transform="translate(-3 7)">-10</text>
+ </g>
+ </g>
+ <g transform="rotate(45) translate(22 0)">
+
+ <g transform="translate(2.5 0) rotate(-45)">
+ <text font-size="5pt" transform="translate(-7 7)">10</text>
+ </g>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-hold-edge" viewBox="0 0 40px 40px">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-240) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(15 0) rotate(240) translate(-3.5 2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-172.92) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-145.13) translate(10 0)"/>
+ <text font-size="5.0pt" transform="rotate(-145.13) translate(18 0) rotate(145.13) translate(-2 2.2)">0.1</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.87) translate(10 0)"/>
+ <text font-size="5.0pt" transform="rotate(-27.87) translate(15 0) rotate(27.87) translate(-5 0)">0.5</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <text font-size="5pt" letter-spacing="1" transform="rotate(60) translate(15 0) rotate(-60) translate(-0.5 2)">1s</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">EDGE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(11 0)">RISE</text>
+ <g transform="translate(0 5)"><svg id="RISE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-time-edge" transform="scale(1) translate(0 5)" href="#dial-time-edge"/>
+
+ </g>
+
+ <g transform="translate(0 89)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10.5 0)">FALL</text>
+ <g transform="translate(0 5)"><svg id="FALL_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-time-edge" transform="scale(1) translate(0 5)" href="#dial-time-edge"/>
+
+ </g>
+
+ <g transform="translate(0 153)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10.5 0)">HOLD</text>
+ <g transform="translate(14.5 9)"><svg id="HOLD_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-hold-edge" transform="scale(1) translate(2.5 -3)" href="#dial-hold-edge"/>
+
+ </g>
+
+ <g transform="translate(0 191)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 38)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="109" rx="5"/>
+ <g transform="translate(5 3)"><svg id="HIGH_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="1.2px" transform="translate(11 35)">HIGH</text>
+ <g transform="translate(2 29.3)"><svg id="HIGH_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(5 38)"><svg id="RISE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.9 70)">RISE</text>
+ <g transform="translate(5 73)"><svg id="FALL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 105)">FALL</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/EightFO-lowcontrast-pp.svg b/res-pp/EightFO-lowcontrast-pp.svg
@@ -0,0 +1,688 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="255.0" height="380.0" viewBox="0 0 255.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="waves-eightfo" viewBox="0 0 70px 70px">
+
+ <g transform="translate(20 35)">
+
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(-90) translate(11 0)"/>
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(-45) translate(11 0)"/>
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(0) translate(11 0)"/>
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(45) translate(11 0)"/>
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(90) translate(11 0)"/>
+ </g>
+ <g transform="translate(14 8)">
+
+ <polyline points="0,8 12,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ <g transform="translate(33.5 13.5)">
+
+ <polyline points="0,8 0,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ <g transform="translate(39 31)">
+
+ <path d="M 0 4 A 2 3 0 0 1 6 4" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ <path d="M 6 4 A 2 3 0 0 0 12 4" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ <g transform="translate(33.5 48.5)">
+
+ <polyline points="0,4 3,0 9,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ <g transform="translate(14 54)">
+
+ <polyline points="0,4 0,0 6,0 6,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-phase-eightfo" viewBox="0 0 40px 40px">
+ <g transform="translate(20 20)">
+ <g transform="rotate(-90) translate(10 0)">
+ <polyline points="0,0 4,0" stroke-width="1"/>
+ </g>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="255.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 254.0,1 254.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 254.5,0.5 254.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 255.0,0 255.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(127.5 19)">8FO</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(127.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(112.0 -5)"/>
+ </g>
+
+
+ <g transform="translate(20 25)">
+
+
+
+ <g transform="translate(20 20)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(34 34)">
+ <polyline points="-10,0 10,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-10 0,10" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="33.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(10 15)">
+ <g transform="translate(64 64)">
+ <g transform="rotate(-225.08) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(225.08) translate(-10.5 3.5)">0.1</text>
+ </g>
+ <g transform="rotate(-171.49) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(171.49) translate(-11 3.5)">0.5</text>
+ </g>
+ <g transform="rotate(-71.76) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(71.76) translate(-2 3.5)">10</text>
+ </g>
+ <g transform="rotate(-124.62) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" letter-spacing="1px" transform="translate(14 0) rotate(124.62) translate(-10 3.5)">0V</text>
+ </g>
+ <g transform="rotate(-18.17) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(18.17) translate(-2 3.5)">50</text>
+ </g>
+ <g transform="rotate(27.98) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-27.98) translate(-2 3.5)">200</text>
+ </g>
+ <g transform="rotate(51.05) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-51.05) translate(-2 3.5)">400HZ</text>
+ </g>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-240) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-216.92) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-193.85) translate(37 0)"/>
+
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-147.69) translate(37 0)"/>
+
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-101.54) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-78.46) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-55.38) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-32.31) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-9.23) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(13.85) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(36.92) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(60) translate(37 0)"/>
+ </g>
+ </g>
+
+
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(34 133)">0V = C-3 = 2.04HZ</text>
+
+ <g transform="translate(78 335)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">SLOW</text>
+ <g transform="translate(40 -1.3)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+
+ <g transform="translate(10 163)">
+
+ <g transform="translate(10 0)">
+ <g transform="translate(0 5)"><svg id="WAVE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ <g transform="translate(70 0)">
+
+
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 38) rotate(270)">SAM/PW</text>
+ <g transform="translate(20 0)"><svg id="SAMPLE_PWM_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(80.5 -9.6)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ <use xlink:href="#waves-eightfo" transform="translate(-2 -22)" href="#waves-eightfo"/>
+ </g>
+
+
+ <g transform="translate(10 226)">
+
+
+
+
+ <g transform="translate(10 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 36.5) rotate(270)">OFFSET</text>
+ <g transform="translate(20 0)"><svg id="OFFSET_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(20.5 -9.6)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(70 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 32) rotate(270)">SCALE</text>
+ <g transform="translate(20 0)"><svg id="SCALE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(80.5 -9.6)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(137 32)">
+ <g transform="translate(3 4)">
+ <g transform="translate(0 0)">
+ <g transform="translate(4 4)"><svg id="PHASE7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(0 40)">
+ <g transform="translate(4 4)"><svg id="PHASE6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(0 80)">
+ <g transform="translate(4 4)"><svg id="PHASE5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(0 120)">
+ <g transform="translate(4 4)"><svg id="PHASE4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 160)">
+ <g transform="translate(4 4)"><svg id="PHASE3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(0 200)">
+ <g transform="translate(4 4)"><svg id="PHASE2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(0 240)">
+ <g transform="translate(4 4)"><svg id="PHASE1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(0 280)">
+
+ <g transform="translate(4 4)"><svg id="PHASE0_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(137 36)">
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 0) translate(12 12) rotate(-225) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 40) translate(12 12) rotate(-180) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 80) translate(12 12) rotate(-135) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 120) translate(12 12) rotate(-90) translate(-20 -20)" href="#dial-phase-eightfo"/>
+
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 160) translate(12 12) rotate(-45) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 200) translate(12 12) rotate(0) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 240) translate(12 12) rotate(45) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ <use xlink:href="#dial-phase-eightfo" transform="translate(3 280) translate(12 12) rotate(90) translate(-20 -20)" href="#dial-phase-eightfo"/>
+ </g>
+
+ <g class="io-group" transform="translate(176 32)">
+ <rect class="input-background" width="30" height="328" rx="5"/>
+ <g transform="translate(3 4)">
+ <g transform="translate(0 0)"><svg id="PHASE7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 40)"><svg id="PHASE6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 80)"><svg id="PHASE5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 120)"><svg id="PHASE4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(0 160)"><svg id="PHASE3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 200)"><svg id="PHASE2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 240)"><svg id="PHASE1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 280)"><svg id="PHASE0_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8 320)">CV</text>
+ </g>
+
+ <g class="io-group" transform="translate(215 32)">
+ <rect class="output-background" width="30" height="328" rx="5"/>
+ <g transform="translate(3 4)">
+ <g transform="translate(0 0)"><svg id="PHASE7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 40)"><svg id="PHASE6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 80)"><svg id="PHASE5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 120)"><svg id="PHASE4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(0 160)"><svg id="PHASE3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 200)"><svg id="PHASE2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 240)"><svg id="PHASE1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 280)"><svg id="PHASE0_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 320)">OUT</text>
+ </g>
+
+
+
+
+ <g class="io-group" transform="translate(0 313)">
+ <rect class="input-background" width="70" height="87" rx="5" transform="translate(10 -40)"/>
+ <rect class="input-background" width="108" height="43" rx="5" transform="translate(10 -40)"/>
+
+ <g transform="translate(10 -40)">
+
+ <g transform="translate(4 4)"><svg id="SAMPLE_PWM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(4 38)">S/PW</text>
+ </g>
+ <g transform="translate(50 -40)">
+
+ <g transform="translate(2 4)"><svg id="OFFSET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(4.5 38)">OFF</text>
+ </g>
+ <g transform="translate(90 -40)">
+
+ <g transform="translate(0 4)"><svg id="SCALE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2.5 38)">SCL</text>
+ </g>
+ <g transform="translate(10 0)">
+
+ <g transform="translate(4 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(2 40)">V/OCT</text>
+ </g>
+ <g transform="translate(50 0)">
+
+ <g transform="translate(2 5)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0 40)">RESET</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/EightOne-lowcontrast-pp.svg b/res-pp/EightOne-lowcontrast-pp.svg
@@ -0,0 +1,351 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">8:1</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(6.5 32)">
+ <rect class="input-background" width="34" height="337" rx="5" transform="translate(0 -9)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 0)">IN</text>
+
+ <g transform="translate(5 3)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">1</text>
+ <g transform="translate(17 29.5)"><svg id="IN1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 44.3)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 76.3)">2</text>
+ <g transform="translate(17 70.8)"><svg id="IN2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 86.6)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 118.6)">3</text>
+ <g transform="translate(17 113.1)"><svg id="IN3_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 126.9)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 158.9)">4</text>
+ <g transform="translate(17 153.4)"><svg id="IN4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 168.1)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 200.1)">5</text>
+ <g transform="translate(17 194.6)"><svg id="IN5_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 209.4)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 241.4)">6</text>
+ <g transform="translate(17 235.9)"><svg id="IN6_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 250.7)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 282.7)">7</text>
+ <g transform="translate(17 277.2)"><svg id="IN7_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 292)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 324)">8</text>
+ <g transform="translate(17 318.5)"><svg id="IN8_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(49.5 32)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 30)"/>
+ <g transform="translate(5 3)"><svg id="CLOCK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(4 35)">CLOCK</text>
+ </g>
+ <g class="io-group" transform="translate(49.5 69)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(5 35)">RESET</text>
+ </g>
+
+ <g transform="translate(44 121)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(7.5 0)">STEPS</text>
+ <g transform="translate(14.5 10.5)"><svg id="STEPS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -1)">
+ <g transform="translate(20 20)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(13 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(-197.1) translate(13 0) rotate(197.1) translate(-2 2)">2</text>
+ <text font-size="5.0pt" transform="rotate(-154.3) translate(13 0) rotate(154.3) translate(-2 2)">3</text>
+ <text font-size="5.0pt" transform="rotate(-111.4) translate(13 0) rotate(111.4) translate(-2 2)">4</text>
+ <text font-size="5.0pt" transform="rotate(-68.6) translate(13 0) rotate(68.6) translate(-2 2)">5</text>
+ <text font-size="5.0pt" transform="rotate(-25.7) translate(13 0) rotate(25.7) translate(-2 2)">6</text>
+ <text font-size="5.0pt" transform="rotate(17.1) translate(13 0) rotate(-17.1) translate(-2 2)">7</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-2 2)">8</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(59 166)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.8 -1)">FWD</text>
+ <g transform="translate(0 2)"><svg id="DIRECTION_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.3 34)">REV</text>
+ </g>
+
+
+
+ <g transform="translate(44 220)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(4.5 0)">SELECT</text>
+ <g transform="translate(0 2)"><svg id="SELECT_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 2)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(19 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(-197.1) translate(19 0) rotate(197.1) translate(-2 2)">2</text>
+ <text font-size="5.0pt" transform="rotate(-154.3) translate(19 0) rotate(154.3) translate(-2 2)">3</text>
+ <text font-size="5.0pt" transform="rotate(-111.4) translate(19 0) rotate(111.4) translate(-2 2)">4</text>
+ <text font-size="5.0pt" transform="rotate(-68.6) translate(19 0) rotate(68.6) translate(-2 2)">5</text>
+ <text font-size="5.0pt" transform="rotate(-25.7) translate(19 0) rotate(25.7) translate(-2 2)">6</text>
+ <text font-size="5.0pt" transform="rotate(17.1) translate(19 0) rotate(-17.1) translate(-2 2)">7</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(19 0) rotate(-60) translate(-2 2)">8</text>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(5.5 47)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SELECT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(49.5 321)">
+ <rect class="output-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 35)">OUT</text>
+ </g>
+
+
+
+
+
+</svg>
diff --git a/res-pp/FFB-lowcontrast-pp.svg b/res-pp/FFB-lowcontrast-pp.svg
@@ -0,0 +1,596 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="120.0" height="380.0" viewBox="0 0 120.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="120.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 119.0,1 119.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 119.5,0.5 119.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 120.0,0 120.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(110.0 19)">FFB</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+ <g transform="translate(1.5 24)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6)">125</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(41 24)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6)">500</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_5_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(80.5 24)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7 6)">2000</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_9_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(1.5 75)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6)">175</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(41 75)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6)">700</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_6_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(80.5 75)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7 6)">2800</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_10_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(1.5 126)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6)">250</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(41 126)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6.5 6)">1000</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_7_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(80.5 126)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6.5 6)">4000</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_11_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(1.5 177)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6)">350</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(41 177)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6.5 6)">1400</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_8_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(80.5 177)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7 6)">5600</text>
+ <g transform="translate(6 13.5)"><svg id="BAND_12_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(1.5 228)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(13.5 6)">LP</text>
+ <g transform="translate(6 13.5)"><svg id="LOWPASS_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+ <g transform="translate(41 228)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6 6)">FREQ</text>
+ <g transform="translate(11 18.5)"><svg id="CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-1 6.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(80.5 228)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(12.5 6)">HP</text>
+ <g transform="translate(6 13.5)"><svg id="HIGHPASS_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-3.5 4)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g class="io-group" transform="translate(28.5 278)">
+ <rect class="input-background" width="63" height="43" rx="5"/>
+ <rect class="input-background-filler" width="63" height="10" transform="translate(0 33)"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 39)">IN</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5.5 39)">FCV</text>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(13 320)">
+ <rect class="output-background" width="94" height="43" rx="5"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="ALL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 39)">ALL</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="ODD_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 39)">ODD</text>
+ </g>
+ <g transform="translate(63 0)">
+ <g transform="translate(3 4)"><svg id="EVEN_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1.5px" transform="translate(3 39)">EVEN</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/FMOp-lowcontrast-pp.svg b/res-pp/FMOp-lowcontrast-pp.svg
@@ -0,0 +1,552 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-ratio-fmop" viewBox="0 0 88px 78px">
+ <g transform="translate(49 39)">
+ <g transform="rotate(-240) translate(19 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(240) translate(-11 3.5)">.01</text>
+ </g>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-225) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-195) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-180) translate(22 0)"/>
+
+ <g transform="rotate(-165) translate(19 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(165) translate(-5.5 3.5)">.5</text>
+ </g>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-135) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-120) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-105) translate(22 0)"/>
+
+ <g transform="rotate(-90) translate(19 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(90) translate(-2.7 3.5)">1</text>
+ </g>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-73.33) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-56.67) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-40) translate(22 0)"/>
+
+ <g transform="rotate(-23.33) translate(19 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(23.33) translate(-2.7 3.5)">5</text>
+ </g>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-6.67) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(10) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(26.67) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(43.33) translate(22 0)"/>
+
+ <g transform="rotate(60) translate(19 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-60) translate(-3 3.5)">10</text>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-time-fmop" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-172.92) translate(15 0)">
+ <polyline points="0,0 1.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(145.13) translate(-2.2 2.2)">1</text>
+ </g>
+ <g transform="rotate(-105.84) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-75.68) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(27.87) translate(-2.2 2.2)">5</text>
+ </g>
+ <g transform="rotate(-7.62) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(16 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-5 2.2)">10</text>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">FM-OP</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(10 25)">
+
+ <g transform="translate(0 20)">
+
+ <g transform="translate(20 0)"><svg id="RATIO_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <use xlink:href="#dial-ratio-fmop" transform="translate(-10 0)" href="#dial-ratio-fmop"/>
+ <g transform="translate(82 20)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 35) rotate(270)">FINE</text>
+ <g transform="translate(20 12)"><svg id="FINE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ <g transform="translate(90 20)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+
+ <g transform="translate(87 94)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 25) rotate(270)">ATT</text>
+ <g transform="translate(20 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ <use xlink:href="#dial-time-fmop" transform="translate(10.5 -9.5)" href="#dial-time-fmop"/>
+ <g transform="translate(31.5 29)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(87 139)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 25) rotate(270)">DEC</text>
+ <g transform="translate(20 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ <use xlink:href="#dial-time-fmop" transform="translate(10.5 -9.5)" href="#dial-time-fmop"/>
+ <g transform="translate(31.5 29)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(87 184)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 25) rotate(270)">SUS</text>
+ <g transform="translate(20 0)"><svg id="SUSTAIN_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(10.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ <g transform="translate(31.5 29)"><svg id="SUSTAIN_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(87 229)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 25) rotate(270)">REL</text>
+ <g transform="translate(20 0)"><svg id="RELEASE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ <use xlink:href="#dial-time-fmop" transform="translate(10.5 -9.5)" href="#dial-time-fmop"/>
+ <g transform="translate(31.5 29)"><svg id="RELEASE_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+
+
+
+
+
+ <g transform="translate(16 106)">
+ <text font-size="8pt" letter-spacing="1px" transform="translate(8 38) rotate(270)">DEPTH</text>
+ <g transform="translate(20 0)"><svg id="DEPTH_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(18.5 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(0 6.2)">ENV</text>
+ <g transform="translate(20 -1.3)"><svg id="ENV_TO_DEPTH_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(10.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(16 162)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 35) rotate(270)">FDBK</text>
+ <g transform="translate(20 0)"><svg id="FEEDBACK_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(18.5 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(0 6.2)">ENV</text>
+ <g transform="translate(20 -1.3)"><svg id="ENV_TO_FEEDBACK_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(10.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(16 218)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 37.5) rotate(270)">LEVEL</text>
+ <g transform="translate(20 0)"><svg id="LEVEL_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(18.5 35)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(0 6.2)">ENV</text>
+ <g transform="translate(20 -1.3)"><svg id="ENV_TO_LEVEL_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(10.5 -9.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+
+
+
+
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="130" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="97" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="130" height="44" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background-filler" width="10" height="10" transform="translate(130 34)"/>
+ <rect class="input-background-filler" width="10" height="10" transform="translate(97 81)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="DEPTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0.5 40)">DEPTH</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="FEEDBACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3.5 40)">FDBK</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="LEVEL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1.5 40)">LEVEL</text>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="SUSTAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(6 40)">SUS</text>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">V/OCT</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="FM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(8.5 40)">FM</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="GATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">GATE</text>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="AUDIO_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(6 40)">OUT</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/FlipFlop-lowcontrast-pp.svg b/res-pp/FlipFlop-lowcontrast-pp.svg
@@ -0,0 +1,233 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="1.5px">FLIPFLOP</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 35)">TRIG</text>
+ <g transform="translate(5 38)"><svg id="RESET1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 70)">RESET</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="A1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 32)">A</text>
+ <g transform="translate(5 35)"><svg id="B1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 67)">B</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 169)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 35)">TRIG</text>
+ <g transform="translate(5 38)"><svg id="RESET2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 70)">RESET</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="A2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 32)">A</text>
+ <g transform="translate(5 35)"><svg id="B2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 67)">B</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Follow-lowcontrast-pp.svg b/res-pp/Follow-lowcontrast-pp.svg
@@ -0,0 +1,260 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-response-follow" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(17 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-scale-follow" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="8pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2 3)">-</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="6pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">FOLLOW</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(8.5 0)">DAMP</text>
+ <g transform="translate(0 3)"><svg id="RESPONSE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-response-follow" transform="translate(0 3)" href="#dial-response-follow"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="RESPONSE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 131)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(11.5 0)">GAIN</text>
+ <g transform="translate(0 3)"><svg id="GAIN_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-scale-follow" transform="translate(0 3)" href="#dial-scale-follow"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 230)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+
+
+</svg>
diff --git a/res-pp/FourMan-lowcontrast-pp.svg b/res-pp/FourMan-lowcontrast-pp.svg
@@ -0,0 +1,263 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">4MAN</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 25)"/>
+ <rect class="input-background" width="34" height="33" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 30)">TRIG</text>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 37)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 98)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 25)"/>
+ <rect class="input-background" width="34" height="33" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 30)">TRIG</text>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 37)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 178)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 25)"/>
+ <rect class="input-background" width="34" height="33" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 30)">TRIG</text>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 37)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 258)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 25)"/>
+ <rect class="input-background" width="34" height="33" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 30)">TRIG</text>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 37)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Inv-lowcontrast-pp.svg b/res-pp/Inv-lowcontrast-pp.svg
@@ -0,0 +1,253 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">INV</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="113" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 103)"/>
+ <g transform="translate(8 4)"><svg id="GATE1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 26)"><svg id="GATE1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 58)">GATE</text>
+ <text class="input-label" font-size="5pt" letter-spacing="0.3px" transform="translate(1 71)">LATCH</text>
+ <g transform="translate(24 64)"><svg id="LATCH1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 78)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(13 110)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 113)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(14 35)">OUT</text>
+ <g transform="translate(5 29.3)"><svg id="LOW1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(5 29.3)"><svg id="HIGH1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="translate(0 183)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="113" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 103)"/>
+ <g transform="translate(8 4)"><svg id="GATE2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 26)"><svg id="GATE2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 58)">GATE</text>
+ <text class="input-label" font-size="5pt" letter-spacing="0.3px" transform="translate(1 71)">LATCH</text>
+ <g transform="translate(24 64)"><svg id="LATCH2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 78)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(13 110)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 113)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(14 35)">OUT</text>
+ <g transform="translate(5 29.3)"><svg id="LOW2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(5 29.3)"><svg id="HIGH2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/LFO-lowcontrast-pp.svg b/res-pp/LFO-lowcontrast-pp.svg
@@ -0,0 +1,494 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">LFO</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+
+
+ <g transform="translate(21 25)">
+
+
+
+ <g transform="translate(20 20)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(34 34)">
+ <polyline points="-10,0 10,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-10 0,10" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="33.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(11 15)">
+ <g transform="translate(64 64)">
+ <g transform="rotate(-225.08) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(225.08) translate(-10.5 3.5)">0.1</text>
+ </g>
+ <g transform="rotate(-171.49) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(171.49) translate(-11 3.5)">0.5</text>
+ </g>
+ <g transform="rotate(-71.76) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(71.76) translate(-2 3.5)">10</text>
+ </g>
+ <g transform="rotate(-124.62) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" letter-spacing="1px" transform="translate(14 0) rotate(124.62) translate(-10 3.5)">0V</text>
+ </g>
+ <g transform="rotate(-18.17) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(18.17) translate(-2 3.5)">50</text>
+ </g>
+ <g transform="rotate(27.98) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-27.98) translate(-2 3.5)">200</text>
+ </g>
+ <g transform="rotate(51.05) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-51.05) translate(-2 3.5)">400HZ</text>
+ </g>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-240) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-216.92) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-193.85) translate(37 0)"/>
+
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-147.69) translate(37 0)"/>
+
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-101.54) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-78.46) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-55.38) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-32.31) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-9.23) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(13.85) translate(37 0)"/>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(36.92) translate(37 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(60) translate(37 0)"/>
+ </g>
+ </g>
+
+
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(34 133)">0V = C-3 = 2.04HZ</text>
+
+ <g transform="translate(110.5 238.5)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(0 6.1)">SLOW</text>
+ <g transform="translate(26.5 -1)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(10 150)">
+ <g transform="translate(7 0)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 27) rotate(270)">SAM</text>
+ <g transform="translate(20 0)"><svg id="SAMPLE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(17.5 -9.6)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ <g transform="translate(72 0)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 22.5) rotate(270)">PW</text>
+ <g transform="translate(20 0)"><svg id="PW_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(82.5 -9.6)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(10 196)">
+ <g transform="translate(7 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 18) rotate(270)">OFF</text>
+ <g transform="translate(25 0)"><svg id="OFFSET_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(20 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(72 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 18) rotate(270)">SCL</text>
+ <g transform="translate(25 0)"><svg id="SCALE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+
+
+
+
+ <g class="io-group" transform="translate(0 225)">
+ <rect class="output-background" width="130" height="91" rx="5" transform="translate(10 44)"/>
+ <rect class="output-background" width="97.5" height="135" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="65" height="135" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background-filler" width="10" height="8" transform="translate(32.5 0)"/>
+ <rect class="input-background-filler" width="10" height="8" transform="translate(65 0)"/>
+ <rect class="input-background-filler" width="10" height="8" transform="translate(65 127)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="SAMPLE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5 40)">SAM</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="PW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(8 40)">PW</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="RAMP_DOWN_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <polyline class="output-label" points="0,8 0,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 44)">
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="OFFSET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(6.5 40)">OFF</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="SCALE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(6.5 40)">SCL</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="RAMP_UP_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(9 33.5)">
+ <polyline class="output-label" points="0,8 12,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="SQUARE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <polyline class="output-label" points="0,4 0,0 6,0 6,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">V/OCT</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0.7 40)">RESET</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="TRIANGLE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <polyline class="output-label" points="0,4 3,0 9,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="SINE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <path class="output-label" d="M 0 4 A 2 3 0 0 1 6 4" stroke-width="1" stroke="#ccc" fill="none"/>
+ <path class="output-label" d="M 6 4 A 2 3 0 0 0 12 4" stroke-width="1" stroke="#ccc" fill="none"/>
+ </g>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/LLFO-lowcontrast-pp.svg b/res-pp/LLFO-lowcontrast-pp.svg
@@ -0,0 +1,358 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-frequency-llfo" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(60) translate(15 0)"/>
+
+ <g transform="rotate(-202) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(202) translate(3 9.5) rotate(-90)">0.2</text>
+ </g>
+
+ <g transform="rotate(-124.62) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="1.0" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(124.62) translate(-7.5 2.3)">OV</text>
+ </g>
+
+ <g transform="rotate(-48.68) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(48.68) translate(-1 2.3)">20</text>
+ </g>
+
+ <g transform="rotate(27.98) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(-27.98) translate(-2.3 -0.5) rotate(90)">200</text>
+ </g>
+
+ <text font-size="5.0pt" transform="translate(-4.5 22)">HZ</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">LLFO</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 25)">
+
+ <g transform="translate(9.5 2)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-llfo" transform="translate(0 -7.5)" href="#dial-frequency-llfo"/>
+ </g>
+
+ <g transform="translate(0 72)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 6.1)">SLOW</text>
+ <g transform="translate(31 -1)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0.5 88)">
+
+ <g transform="translate(9 0)">
+ <g transform="translate(0 0)">
+ <g transform="translate(-7.5 1)"><svg id="SINE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <path d="M 0 4 A 2 3 0 0 1 6 4" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ <path d="M 6 4 A 2 3 0 0 0 12 4" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 13)">
+ <g transform="translate(-7.5 1)"><svg id="RAMP_UP_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,8 12,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 26)">
+ <g transform="translate(-7.5 1)"><svg id="SQUARE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 0,0 6,0 6,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(31 0)">
+ <g transform="translate(0 0)">
+ <g transform="translate(-7.5 1)"><svg id="TRIANGLE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 3,0 9,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 13)">
+ <g transform="translate(-7.5 1)"><svg id="RAMP_DOWN_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,8 0,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 26)">
+ <g transform="translate(-7.5 1)"><svg id="PULSE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 0,0 3,0 3,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(17.5 38)"><svg id="WAVE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 149)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(3 0)">OFFSET</text>
+ <g transform="translate(14.5 9.5)"><svg id="OFFSET_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 190)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6.6 0)">SCALE</text>
+ <g transform="translate(14.5 9.5)"><svg id="SCALE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 228)">
+
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">V/OCT</text>
+ <g transform="translate(5 38)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 70)">RESET</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/LVCF-lowcontrast-pp.svg b/res-pp/LVCF-lowcontrast-pp.svg
@@ -0,0 +1,308 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-cutoff-lvcf" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-218.8) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-192.6) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-172.2) translate(18 0) rotate(172.2) translate(-1 2)">1</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-27.9) translate(18 0) rotate(27.9) translate(-4 2)">10</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-2 2)">20</text>
+
+ <text font-size="4.0pt" transform="rotate(90) translate(18 0) rotate(-90) translate(-5 2)">KHZ</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-q-lvcf" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </symbol>
+
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">LVCF</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 31)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(5 0)">CUTOFF</text>
+ <g transform="translate(9.5 8)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-cutoff-lvcf" transform="translate(0 -1.5)" href="#dial-cutoff-lvcf"/>
+ </g>
+
+ <g transform="translate(0 84)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(16 0)">CV</text>
+ <g transform="translate(14.5 9.5)"><svg id="FREQUENCY_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 130)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(5 0)">RES/BW</text>
+ <g transform="translate(9.5 8)"><svg id="Q_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-q-lvcf" transform="translate(0 -1.5)" href="#dial-q-lvcf"/>
+ </g>
+
+ <g transform="translate(0.5 180)">
+ <g transform="translate(10 0)">
+ <g transform="translate(0 0)">
+ <g transform="translate(-7.5 1)"><svg id="LOWPASS_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(1 6.7)">LP</text>
+ </g>
+
+ <g transform="translate(0 13)">
+ <g transform="translate(-7.5 1)"><svg id="BANDPASS_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(1 6.7)">BP</text>
+ </g>
+ </g>
+
+ <g transform="translate(32 0)">
+ <g transform="translate(0 0)">
+ <g transform="translate(-7.5 1)"><svg id="HIGHPASS_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(1 6.7)">HP</text>
+ </g>
+
+ <g transform="translate(0 13)">
+ <g transform="translate(-7.5 1)"><svg id="BANDREJECT_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(1 6.7)">BR</text>
+ </g>
+ </g>
+
+ <g transform="translate(17.5 24)"><svg id="MODE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 225)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 70)">CV</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/LVCO-lowcontrast-pp.svg b/res-pp/LVCO-lowcontrast-pp.svg
@@ -0,0 +1,335 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-frequency-lvco" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-206.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-173.33) translate(15 0)"/>
+
+ <g transform="rotate(-140) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="1.0" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(140) translate(-5.5 0)">OV</text>
+ </g>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-106.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-73.33) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-40) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-6.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(26.67) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">LVCO</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 25)">
+
+ <g transform="translate(9.5 2)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-lvco" transform="translate(0 -7.5)" href="#dial-frequency-lvco"/>
+ </g>
+
+ <g transform="translate(0 63)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 6.1)">SLOW</text>
+ <g transform="translate(31 -1)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0.5 86)">
+
+ <g transform="translate(9 0)">
+ <g transform="translate(0 0)">
+ <g transform="translate(-7.5 1)"><svg id="SINE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <path d="M 0 4 A 2 3 0 0 1 6 4" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ <path d="M 6 4 A 2 3 0 0 0 12 4" stroke-width="1" stroke="#b3b3b3" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 13)">
+ <g transform="translate(-7.5 1)"><svg id="SAW_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,8 12,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 26)">
+ <g transform="translate(-7.5 1)"><svg id="PULSE_25_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 0,0 4.5,0 4.5,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(31 0)">
+ <g transform="translate(0 0)">
+ <g transform="translate(-7.5 1)"><svg id="TRIANGLE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 3,0 9,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 13)">
+ <g transform="translate(-7.5 1)"><svg id="SQUARE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 0,0 6,0 6,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(0 26)">
+ <g transform="translate(-7.5 1)"><svg id="PULSE_10_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(1 1) scale(0.8)">
+
+ <polyline points="0,4 0,0 3,0 3,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(17.5 38)"><svg id="WAVE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 150.5)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(16 0)">FM</text>
+ <g transform="translate(14.5 9.5)"><svg id="FM_DEPTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 193)">
+
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 98)"/>
+ <rect class="input-background" width="34" height="105" rx="5"/>
+ <g transform="translate(5 3)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">V/OCT</text>
+ <g transform="translate(5 38)"><svg id="FM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 70)">FM</text>
+ <g transform="translate(5 73)"><svg id="SYNC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 105)">SYNC</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 111)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Lag-lowcontrast-pp.svg b/res-pp/Lag-lowcontrast-pp.svg
@@ -0,0 +1,273 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-shape-lag" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-10 2)">LOG</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2.5 2)">EXP</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">LAG</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(9.5 0)">TIME</text>
+ <g transform="translate(0 3)"><svg id="TIME_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 3)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 2)">1</text>
+ </g>
+ </g>
+ <g transform="translate(14.5 59)"><svg id="TIME_SCALE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 44.5)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-135) translate(15 0) rotate(135) translate(-8 2)">0.1</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-135) translate(9.5 0)"/>
+ <text font-size="5.0pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-2 2)">1</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-90) translate(9.5 0)"/>
+ <text font-size="5.0pt" transform="rotate(-45) translate(15 0) rotate(45) translate(-2 2)">10</text>
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-45) translate(9.5 0)"/>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(5.5 79)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="TIME_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 165)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(7.5 0)">SHAPE</text>
+ <g transform="translate(0 3)"><svg id="SHAPE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-shape-lag" transform="translate(0 3)" href="#dial-shape-lag"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SHAPE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 264)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Lmtr-lowcontrast-pp.svg b/res-pp/Lmtr-lowcontrast-pp.svg
@@ -0,0 +1,274 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">LMTR</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+
+
+ <g transform="translate(0 40)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 0)">THRESHOLD</text>
+ <g transform="translate(26 12)"><svg id="THRESHOLD_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(10 -4)">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-10 2.5)">-24</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-180) translate(25 0) rotate(180) translate(-10 2.5)">-18</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-120) translate(25 0) rotate(120) translate(-10 2.5)">-12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-60) translate(25 0) rotate(60) translate(-2.3 2.5)">-6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(0) translate(25 0) rotate(0) translate(-2.3 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-2.3 2.5)">6</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 122)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(15.5 0)">OUT GAIN</text>
+ <g transform="translate(26 12)"><svg id="OUTPUT_GAIN_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(10 -4)">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-4 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-202.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-165) translate(25 0) rotate(165) translate(-3.5 2.5)">6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-127.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-90) translate(25 0) rotate(90) translate(-5 2.5)">12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-52.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-15) translate(25 0) rotate(15) translate(-2 2.5)">18</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(22.5) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-1 2.5)">24</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(40 198)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 25.5) rotate(270)">KNEE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 -1)">SOFT</text>
+ <g transform="translate(0 2)"><svg id="KNEE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 34)">HARD</text>
+ </g>
+
+ <g transform="translate(11 240)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="input-background-filler" width="68" height="10" transform="translate(0 66)"/>
+ <rect class="input-background" width="68" height="73" rx="5"/>
+ <g transform="translate(5 4)"><svg id="LEFT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 36)">L</text>
+ <g transform="translate(39 4)"><svg id="RIGHT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(49 36)">R</text>
+ <g transform="translate(5 40)"><svg id="THRESHOLD_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 72)">TRSH</text>
+ <g transform="translate(39 40)"><svg id="OUTPUT_GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(42 72)">OGN</text>
+ </g>
+ <g class="io-group" transform="translate(0 79)">
+ <rect class="output-background-filler" width="68" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="68" height="37" rx="5"/>
+ <g transform="translate(5 1)"><svg id="LEFT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 33)">L</text>
+ <g transform="translate(39 1)"><svg id="RIGHT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(49 33)">R</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Manual-lowcontrast-pp.svg b/res-pp/Manual-lowcontrast-pp.svg
@@ -0,0 +1,231 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">MANUAL</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g transform="translate(0 0)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 25)"/>
+ <rect class="input-background" width="34" height="33" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6.6 30)">TRIG</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 37)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="250" rx="5"/>
+
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 30)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 60)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 90)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(3 120)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 150)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 180)"><svg id="OUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 210)"><svg id="OUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 244)">OUT</text>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Matrix44-lowcontrast-pp.svg b/res-pp/Matrix44-lowcontrast-pp.svg
@@ -0,0 +1,548 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">MATRIX44</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(13.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1A</text>
+ <g transform="translate(3.5 16)"><svg id="MIX11_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(13.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2A</text>
+ <g transform="translate(3.5 16)"><svg id="MIX21_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(13.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3A</text>
+ <g transform="translate(3.5 16)"><svg id="MIX31_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(13.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4A</text>
+ <g transform="translate(3.5 16)"><svg id="MIX41_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(45.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1B</text>
+ <g transform="translate(3.5 16)"><svg id="MIX12_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(45.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2B</text>
+ <g transform="translate(3.5 16)"><svg id="MIX22_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(45.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3B</text>
+ <g transform="translate(3.5 16)"><svg id="MIX32_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(45.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4B</text>
+ <g transform="translate(3.5 16)"><svg id="MIX42_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(77.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1C</text>
+ <g transform="translate(3.5 16)"><svg id="MIX13_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(77.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2C</text>
+ <g transform="translate(3.5 16)"><svg id="MIX23_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(77.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3C</text>
+ <g transform="translate(3.5 16)"><svg id="MIX33_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(77.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4C</text>
+ <g transform="translate(3.5 16)"><svg id="MIX43_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(109.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1D</text>
+ <g transform="translate(3.5 16)"><svg id="MIX14_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(109.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2D</text>
+ <g transform="translate(3.5 16)"><svg id="MIX24_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(109.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3D</text>
+ <g transform="translate(3.5 16)"><svg id="MIX34_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(109.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4D</text>
+ <g transform="translate(3.5 16)"><svg id="MIX44_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="130" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="130" height="44" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background-filler" width="130" height="10" transform="translate(10 34)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">1</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">2</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">3</text>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.4 40)">4</text>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.2 40)">A</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">B</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.3 40)">C</text>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.3 40)">D</text>
+ </g>
+ </g>
+ </g>
+
+
+
+
+
+</svg>
diff --git a/res-pp/Matrix88-lowcontrast-pp.svg b/res-pp/Matrix88-lowcontrast-pp.svg
@@ -0,0 +1,1442 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="330.0" height="380.0" viewBox="0 0 330.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="330.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 329.0,1 329.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 329.5,0.5 329.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 330.0,0 330.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(165.0 19)">MATRIX88</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(165.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(149.5 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(5.5 25)">
+ <rect class="input-background" width="34" height="293" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 42)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 79)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 116)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 153)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 190)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 227)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 264)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(46.5 323)">
+ <rect class="output-background" width="278.5" height="34" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(40 5)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(75 5)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 5)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(145 5)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 5)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(215 5)"><svg id="OUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(250 5)"><svg id="OUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(50 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX11_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX21_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX31_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX41_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX51_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX61_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX71_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(50 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX81_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(85 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX12_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX22_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX32_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX42_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX52_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX62_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX72_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(85 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX82_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(120 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX13_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX23_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX33_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX43_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX53_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX63_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX73_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX83_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(155 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX14_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX24_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX34_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX44_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX54_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX64_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX74_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(155 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX84_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(190 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX15_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX25_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX35_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX45_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX55_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX65_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX75_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(190 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX85_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(225 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX16_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX26_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX36_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX46_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX56_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX66_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX76_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(225 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX86_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(260 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX17_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX27_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX37_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX47_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX57_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX67_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX77_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(260 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX87_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(295 24)">
+ <g transform="translate(3.5 8)"><svg id="MIX18_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 61)">
+ <g transform="translate(3.5 8)"><svg id="MIX28_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 98)">
+ <g transform="translate(3.5 8)"><svg id="MIX38_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 135)">
+ <g transform="translate(3.5 8)"><svg id="MIX48_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 172)">
+ <g transform="translate(3.5 8)"><svg id="MIX58_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 209)">
+ <g transform="translate(3.5 8)"><svg id="MIX68_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 246)">
+ <g transform="translate(3.5 8)"><svg id="MIX78_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(295 283)">
+ <g transform="translate(3.5 8)"><svg id="MIX88_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+</svg>
diff --git a/res-pp/Mix1-lowcontrast-pp.svg b/res-pp/Mix1-lowcontrast-pp.svg
@@ -0,0 +1,247 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">MIX1</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g transform="translate(0 0)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 0)"><svg id="LEVEL_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 173)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 120)"/>
+ <rect class="input-background" width="34" height="127" rx="5"/>
+ <g transform="translate(8 3)"><svg id="MUTE_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 25)"><svg id="MUTE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 57)">MUTE</text>
+ <g transform="translate(5 60)"><svg id="LEVEL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 92)">LEVEL</text>
+ <g transform="translate(5 95)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 127)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 133)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Mix2-lowcontrast-pp.svg b/res-pp/Mix2-lowcontrast-pp.svg
@@ -0,0 +1,263 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="75.0" height="380.0" viewBox="0 0 75.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="75.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 74.0,1 74.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 74.5,0.5 74.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 75.0,0 75.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(72.0 17)">MIX2</text>
+ <g transform="translate(25 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="2" height="2" fill="#ddd" transform="translate(11.5 -4)"/>
+ </g>
+
+
+ <g transform="translate(0 32)">
+ <g transform="translate(15 0)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(28.5 0)"><svg id="LEVEL_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(15 197)">
+ <g transform="translate(13.5 0)"><svg id="MUTE_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 27)">MUTE</text>
+ </g>
+
+ <g transform="translate(0 240)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="64" height="10" transform="translate(0 66)"/>
+ <rect class="input-background" width="64" height="73" rx="5"/>
+ <g transform="translate(5 4)"><svg id="LEVEL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1.5px" transform="translate(4.5 36)">LEVEL</text>
+ <g transform="translate(35 4)"><svg id="MUTE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1.5px" transform="translate(35.5 36)">MUTE</text>
+ <g transform="translate(5 40)"><svg id="L_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15 72)">L</text>
+ <g transform="translate(35 40)"><svg id="R_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="0.5px" transform="translate(39 72)">R (L)</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 79)">
+ <rect class="output-background-filler" width="64" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="64" height="37" rx="5"/>
+ <g transform="translate(5 1)"><svg id="L_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 33)">L</text>
+ <g transform="translate(35 1)"><svg id="R_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(45 33)">R</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Mix4-lowcontrast-pp.svg b/res-pp/Mix4-lowcontrast-pp.svg
@@ -0,0 +1,634 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">MIX4</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+ <g transform="translate(4 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH1</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL1_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(47 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH2</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL2_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(90 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH3</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL3_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(133 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH4</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL4_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(176 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">MIX</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="MIX_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MIX_MUTE_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(13.5 198)"><svg id="MIX_DIM_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14.5 225)">DIM</text>
+ <g class="io-group" transform="translate(5.5 229)">
+ <rect class="input-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="MIX_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <rect class="output-background" width="34" height="73" rx="5" transform="translate(0 38)"/>
+ <rect class="output-background-filler" width="34" height="5" transform="translate(0 38)"/>
+ <g transform="translate(5 41)"><svg id="L_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 73)">L</text>
+ <g transform="translate(5 76)"><svg id="R_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 108)">R</text>
+ </g>
+ </g>
+
+</svg>
diff --git a/res-pp/Mix4x-lowcontrast-pp.svg b/res-pp/Mix4x-lowcontrast-pp.svg
@@ -0,0 +1,729 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">MIX4X</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+ <g transform="translate(4 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH1</text>
+ <g transform="translate(14.5 23)"><svg id="LOW1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(47 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH2</text>
+ <g transform="translate(14.5 23)"><svg id="LOW2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(90 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH3</text>
+ <g transform="translate(14.5 23)"><svg id="LOW3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(133 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH4</text>
+ <g transform="translate(14.5 23)"><svg id="LOW4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(176 20)">
+
+ <g class="io-group" transform="translate(5.5 1)">
+ <rect class="output-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SEND_A_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(14.7 35)">A</text>
+ <rect class="input-background" width="34" height="146" rx="5" transform="translate(0 38)"/>
+ <rect class="input-background-filler" width="34" height="5" transform="translate(0 38)"/>
+ <g transform="translate(5 41)"><svg id="L_A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.3 73)">L</text>
+ <g transform="translate(5 76)"><svg id="R_A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8 108)">R(L)</text>
+ <g transform="translate(9 117)"><svg id="LEVEL_A_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 145)">LEVEL</text>
+ <g transform="translate(5 149)"><svg id="LEVEL_A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 181)">CV</text>
+
+
+
+
+
+ </g>
+ <g transform="translate(2.5 106)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 191)">
+ <rect class="output-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SEND_B_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(14.8 35)">B</text>
+ <rect class="input-background" width="34" height="111" rx="5" transform="translate(0 38)"/>
+ <rect class="input-background-filler" width="34" height="5" transform="translate(0 38)"/>
+ <g transform="translate(5 41)"><svg id="L_B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.3 73)">L</text>
+ <g transform="translate(5 76)"><svg id="R_B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8 108)">R(L)</text>
+ <g transform="translate(9 117)"><svg id="LEVEL_B_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 145)">LEVEL</text>
+ </g>
+ <g transform="translate(2.5 296)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+</svg>
diff --git a/res-pp/Mix8-lowcontrast-pp.svg b/res-pp/Mix8-lowcontrast-pp.svg
@@ -0,0 +1,1026 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="405.0" height="380.0" viewBox="0 0 405.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="405.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 404.0,1 404.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 404.5,0.5 404.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 405.0,0 405.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(202.5 19)">MIX8</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(202.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(187.0 -5)"/>
+ </g>
+
+
+ <g transform="translate(4 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH1</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL1_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(48 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH2</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL2_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(92 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH3</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL3_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(136 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH4</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL4_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(180 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH5</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL5_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE5_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(224 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH6</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL6_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE6_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(268 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH7</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL7_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE7_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(312 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH8</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="LEVEL8_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MUTE8_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(14.5 203)"><svg id="PAN8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 228)">PAN</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="input-background" width="34" height="108" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="PAN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">PAN</text>
+ <g transform="translate(5 73)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">IN</text>
+ </g>
+
+ </g>
+
+ <g transform="translate(356 20)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">MIX</text>
+ <g transform="translate(0 12)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 12)"><svg id="MIX_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(13.5 165)"><svg id="MIX_MUTE_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 192)">MUTE</text>
+ <g transform="translate(13.5 198)"><svg id="MIX_DIM_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14.5 225)">DIM</text>
+ <g class="io-group" transform="translate(5.5 229)">
+ <rect class="input-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="MIX_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <rect class="output-background" width="34" height="73" rx="5" transform="translate(0 38)"/>
+ <rect class="output-background-filler" width="34" height="5" transform="translate(0 38)"/>
+ <g transform="translate(5 41)"><svg id="L_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 73)">L</text>
+ <g transform="translate(5 76)"><svg id="R_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 108)">R</text>
+ </g>
+ </g>
+
+</svg>
diff --git a/res-pp/Mix8x-lowcontrast-pp.svg b/res-pp/Mix8x-lowcontrast-pp.svg
@@ -0,0 +1,1196 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="405.0" height="380.0" viewBox="0 0 405.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="405.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 404.0,1 404.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 404.5,0.5 404.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 405.0,0 405.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(202.5 19)">MIX8X</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(202.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(187.0 -5)"/>
+ </g>
+
+
+ <g transform="translate(4 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH1</text>
+ <g transform="translate(14.5 23)"><svg id="LOW1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(48 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH2</text>
+ <g transform="translate(14.5 23)"><svg id="LOW2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(92 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH3</text>
+ <g transform="translate(14.5 23)"><svg id="LOW3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(136 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH4</text>
+ <g transform="translate(14.5 23)"><svg id="LOW4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(180 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH5</text>
+ <g transform="translate(14.5 23)"><svg id="LOW5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(224 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH6</text>
+ <g transform="translate(14.5 23)"><svg id="LOW6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(268 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH7</text>
+ <g transform="translate(14.5 23)"><svg id="LOW7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(312 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(13.7 9)">CH8</text>
+ <g transform="translate(14.5 23)"><svg id="LOW8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 11)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 48)">LOW</text>
+ <g transform="translate(14.5 69)"><svg id="MID8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 57)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 94)">MID</text>
+ <g transform="translate(14.5 115)"><svg id="HIGH8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 103)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 140)">HIGH</text>
+ <g transform="translate(14.5 160)"><svg id="A8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 148)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.2 185)">A</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 195)">PRE</text>
+ <g transform="translate(26 188)"><svg id="PRE_A8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 216)"><svg id="B8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 204)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.4 241)">B</text>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(9 251)">PRE</text>
+ <g transform="translate(26 244)"><svg id="PRE_B8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(5.5 267)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">CV-A</text>
+ <g transform="translate(5 38)"><svg id="B8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 70)">CV-B</text>
+ </g>
+ </g>
+
+ <g transform="translate(356 20)">
+
+ <g class="io-group" transform="translate(5.5 1)">
+ <rect class="output-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SEND_A_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(14.7 35)">A</text>
+ <rect class="input-background" width="34" height="146" rx="5" transform="translate(0 38)"/>
+ <rect class="input-background-filler" width="34" height="5" transform="translate(0 38)"/>
+ <g transform="translate(5 41)"><svg id="L_A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.3 73)">L</text>
+ <g transform="translate(5 76)"><svg id="R_A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8 108)">R(L)</text>
+ <g transform="translate(9 117)"><svg id="LEVEL_A_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 145)">LEVEL</text>
+ <g transform="translate(5 149)"><svg id="LEVEL_A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 181)">CV</text>
+ </g>
+ <g transform="translate(2.5 106)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 191)">
+ <rect class="output-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SEND_B_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(14.8 35)">B</text>
+ <rect class="input-background" width="34" height="111" rx="5" transform="translate(0 38)"/>
+ <rect class="input-background-filler" width="34" height="5" transform="translate(0 38)"/>
+ <g transform="translate(5 41)"><svg id="L_B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.3 73)">L</text>
+ <g transform="translate(5 76)"><svg id="R_B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8 108)">R(L)</text>
+ <g transform="translate(9 117)"><svg id="LEVEL_B_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 145)">LEVEL</text>
+ </g>
+ <g transform="translate(2.5 296)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+</svg>
diff --git a/res-pp/Mono-lowcontrast-pp.svg b/res-pp/Mono-lowcontrast-pp.svg
@@ -0,0 +1,330 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="compression-mono" viewBox="0 0 11px 75px">
+
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 0)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 15)"/>
+ </symbol>
+
+ <symbol id="guide-compression-mono" viewBox="0 0 20px 95px">
+ <g transform="translate(0 10)">
+ <g transform="translate(0 0)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4.5 2.2)">12+</text>
+ </g>
+ <g transform="translate(0 15)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-2.5 2.2)">6</text>
+ </g>
+ <g transform="translate(0 30)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-2.5 2.2)">0</text>
+ </g>
+
+ <g transform="translate(0 15)">
+
+ <text font-size="6.0pt" transform="translate(31 0) rotate(-90) translate(-4.5 2.2)">dB</text>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">MONO</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(8 0)">CHAN</text>
+ </g>
+
+ <g transform="translate(2.5 30)">
+
+ <g transform="translate(0, 0) translate(1.8 1.8)"><svg id="CHANNEL_1_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(10, 0) translate(1.8 1.8)"><svg id="CHANNEL_2_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(20, 0) translate(1.8 1.8)"><svg id="CHANNEL_3_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(30, 0) translate(1.8 1.8)"><svg id="CHANNEL_4_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(0, 10) translate(1.8 1.8)"><svg id="CHANNEL_5_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(10, 10) translate(1.8 1.8)"><svg id="CHANNEL_6_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(20, 10) translate(1.8 1.8)"><svg id="CHANNEL_7_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(30, 10) translate(1.8 1.8)"><svg id="CHANNEL_8_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(0, 20) translate(1.8 1.8)"><svg id="CHANNEL_9_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(10, 20) translate(1.8 1.8)"><svg id="CHANNEL_10_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(20, 20) translate(1.8 1.8)"><svg id="CHANNEL_11_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(30, 20) translate(1.8 1.8)"><svg id="CHANNEL_12_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(0, 30) translate(1.8 1.8)"><svg id="CHANNEL_13_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(10, 30) translate(1.8 1.8)"><svg id="CHANNEL_14_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(20, 30) translate(1.8 1.8)"><svg id="CHANNEL_15_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(30, 30) translate(1.8 1.8)"><svg id="CHANNEL_16_WIDGET">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+
+
+
+
+ <g transform="translate(0 92)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(8 0)">COMP</text>
+ <g transform="translate(9.5 7.5)"><svg id="COMPRESSION_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -2)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(17 147)">
+ <use id="COMPRESSION_WIDGET" xlink:href="#compression-mono" transform="translate(0 -1)" href="#compression-mono"/>
+ <use xlink:href="#guide-compression-mono" transform="translate(-13 -11)" href="#guide-compression-mono"/>
+ </g>
+
+ <g transform="translate(0 198)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(7 0)">LEVEL</text>
+ <g transform="translate(9.5 7.5)"><svg id="LEVEL_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -2)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 251)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="POLY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">POLY</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="MONO_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(4.5 32)">MONO</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Mult-lowcontrast-pp.svg b/res-pp/Mult-lowcontrast-pp.svg
@@ -0,0 +1,247 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">MULT</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g transform="translate(0 0)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 29)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="INA_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(7 35)">IN-A</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 42)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="102" rx="5"/>
+
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUTA1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 30)"><svg id="OUTA2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 60)"><svg id="OUTA3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 95)">OUT</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 178)">
+ <g transform="translate(0 0)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 29)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="INB_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(3 35)">IN-B(A)</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 42)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="102" rx="5"/>
+
+ <g transform="translate(2 2)">
+ <g transform="translate(3 0)"><svg id="OUTB1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 30)"><svg id="OUTB2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 60)"><svg id="OUTB3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 95)">OUT</text>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Mumix-lowcontrast-pp.svg b/res-pp/Mumix-lowcontrast-pp.svg
@@ -0,0 +1,273 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">MUMIX</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+ <g transform="translate(2 25)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 283)"/>
+ <rect class="input-background" width="34" height="293" rx="5"/>
+ <g transform="translate(5 5)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 42)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 79)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 116)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 153)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 190)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 227)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 264)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(5.5 295)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 1)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 33)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(55.5 24)">
+ <g transform="translate(1 9)"><svg id="MUTE1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 46)"><svg id="MUTE2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 83)"><svg id="MUTE3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 120)"><svg id="MUTE4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 157)"><svg id="MUTE5_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 194)"><svg id="MUTE6_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 231)"><svg id="MUTE7_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(1 268)"><svg id="MUTE8_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+
+
+
+
+
+
+
+
+
+
+</svg>
diff --git a/res-pp/Mute8-lowcontrast-pp.svg b/res-pp/Mute8-lowcontrast-pp.svg
@@ -0,0 +1,409 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">MUTE8</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(8 32)">
+ <rect class="input-background" width="30" height="328" rx="5"/>
+ <g transform="translate(3 4)">
+ <g transform="translate(0 0)"><svg id="INPUT1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 40)"><svg id="INPUT2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 80)"><svg id="INPUT3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 120)"><svg id="INPUT4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(0 160)"><svg id="INPUT5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 200)"><svg id="INPUT6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 240)"><svg id="INPUT7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 280)"><svg id="INPUT8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(9.8 320)">IN</text>
+ </g>
+
+ <g class="io-group" transform="translate(43 32)">
+ <rect class="input-background" width="30" height="328" rx="5"/>
+ <g transform="translate(3 4)">
+ <g transform="translate(0 0)"><svg id="MUTE1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 40)"><svg id="MUTE2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 80)"><svg id="MUTE3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 120)"><svg id="MUTE4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(0 160)"><svg id="MUTE5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 200)"><svg id="MUTE6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 240)"><svg id="MUTE7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 280)"><svg id="MUTE8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8 320)">CV</text>
+ </g>
+
+ <g transform="translate(77.5 32)">
+
+ <g transform="translate(0 4)">
+ <g transform="translate(0 2)">
+ <g transform="translate(1 3)"><svg id="MUTE1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 42)">
+ <g transform="translate(1 3)"><svg id="MUTE2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 82)">
+ <g transform="translate(1 3)"><svg id="MUTE3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE3_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 122)">
+ <g transform="translate(1 3)"><svg id="MUTE4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 162)">
+ <g transform="translate(1 3)"><svg id="MUTE5_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE5_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 202)">
+ <g transform="translate(1 3)"><svg id="MUTE6_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE6_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 242)">
+ <g transform="translate(1 3)"><svg id="MUTE7_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE7_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 280)">
+ <g transform="translate(1 3)"><svg id="MUTE8_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(23 8.8)"><svg id="MUTE8_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ </g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(1 320)">MUTE</text>
+ </g>
+
+ <g class="io-group" transform="translate(112 32)">
+ <rect class="output-background" width="30" height="328" rx="5"/>
+ <g transform="translate(3 4)">
+ <g transform="translate(0 0)"><svg id="OUTPUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 40)"><svg id="OUTPUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 80)"><svg id="OUTPUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 120)"><svg id="OUTPUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(0 160)"><svg id="OUTPUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 200)"><svg id="OUTPUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 240)"><svg id="OUTPUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 280)"><svg id="OUTPUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 320)">OUT</text>
+ </g>
+</svg>
diff --git a/res-pp/Noise-lowcontrast-pp.svg b/res-pp/Noise-lowcontrast-pp.svg
@@ -0,0 +1,222 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">NOISE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g class="io-group" transform="translate(7.5 0)">
+ <rect class="output-background" width="34" height="209" rx="5" transform="translate(-2 0)"/>
+ <g transform="translate(3 6)"><svg id="BLUE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(4 39)">BLUE</text>
+ <g transform="translate(3 47)"><svg id="WHITE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(0.5 80)">WHITE</text>
+ <g transform="translate(3 88)"><svg id="PINK_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(4.5 121)">PINK</text>
+ <g transform="translate(3 129)"><svg id="RED_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(7 162)">RED</text>
+ <g transform="translate(3 170)"><svg id="GAUSS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(0 203)">GAUSS</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 250)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(13 -4)">ABS</text>
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="ABS_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="ABS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Nsgt-lowcontrast-pp.svg b/res-pp/Nsgt-lowcontrast-pp.svg
@@ -0,0 +1,277 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-ratio-nsgt" viewBox="0 0 70px 70px">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-2.5 2.5)">1</text>
+ <text font-size="6.0pt" transform="rotate(-193.72) translate(25 0) rotate(193.72) translate(-8 2.5)">1.1</text>
+ <text font-size="6.0pt" transform="rotate(-149.7) translate(25 0) rotate(149.7) translate(-9 2.5)">1.3</text>
+ <text font-size="6.0pt" transform="rotate(-108.93) translate(25 0) rotate(108.93) translate(-9 2.5)">1.6</text>
+ <text font-size="6.0pt" transform="rotate(-74.52) translate(25 0) rotate(74.52) translate(-2.3 2.5)">2</text>
+ <text font-size="6.0pt" transform="rotate(-47.12) translate(25 0) rotate(47.12) translate(-2.3 2.5)">2.5</text>
+ <text font-size="6.0pt" transform="rotate(-6.18) translate(25 0) rotate(6.18) translate(-2.3 2.5)">4</text>
+ <text font-size="6.0pt" transform="rotate(31.11) translate(25 0) rotate(-31.11) translate(-2.3 2.5)">9</text>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-4 2.2)">∞</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">NSGT</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+
+
+ <g transform="translate(0 40)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 0)">THRESHOLD</text>
+ <g transform="translate(26 12)"><svg id="THRESHOLD_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(10 -4)">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-10 2.5)">-24</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-180) translate(25 0) rotate(180) translate(-10 2.5)">-18</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-120) translate(25 0) rotate(120) translate(-10 2.5)">-12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-60) translate(25 0) rotate(60) translate(-2.3 2.5)">-6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(0) translate(25 0) rotate(0) translate(-2.3 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-2.3 2.5)">6</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 122)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(25.5 0)">RATIO</text>
+ <g transform="translate(26 13)"><svg id="RATIO_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-ratio-nsgt" transform="translate(10 -3)" href="#dial-ratio-nsgt"/>
+ </g>
+
+ <g transform="translate(40 198)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 25.5) rotate(270)">KNEE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 -1)">SOFT</text>
+ <g transform="translate(0 2)"><svg id="KNEE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 34)">HARD</text>
+ </g>
+
+ <g transform="translate(11 240)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="input-background-filler" width="68" height="10" transform="translate(0 66)"/>
+ <rect class="input-background" width="68" height="73" rx="5"/>
+ <g transform="translate(5 4)"><svg id="LEFT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 36)">L</text>
+ <g transform="translate(39 4)"><svg id="RIGHT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(49 36)">R</text>
+ <g transform="translate(5 40)"><svg id="THRESHOLD_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 72)">TRSH</text>
+ <g transform="translate(39 40)"><svg id="RATIO_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(39.5 72)">RATIO</text>
+ </g>
+ <g class="io-group" transform="translate(0 79)">
+ <rect class="output-background-filler" width="68" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="68" height="37" rx="5"/>
+ <g transform="translate(5 1)"><svg id="LEFT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15.5 33)">L</text>
+ <g transform="translate(39 1)"><svg id="RIGHT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(49 33)">R</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Offset-lowcontrast-pp.svg b/res-pp/Offset-lowcontrast-pp.svg
@@ -0,0 +1,406 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-offset-offset" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-225) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-210) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-195) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-165) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-150) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-135) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-105) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+
+ <g transform="rotate(-90) translate(17 0)">
+
+ <g transform="translate(2.4 0) rotate(90)">
+ <text font-size="6.5pt" transform="translate(-2.3 3.3)">0</text>
+ </g>
+ </g>
+
+ <g transform="rotate(-75) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-45) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-15) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(0) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(15) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(45) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+
+ <g transform="rotate(-225) translate(22 0)">
+
+ <g transform="translate(2.5 0) rotate(225)">
+ <text font-size="9pt" transform="translate(-2 3.4)">-</text>
+ </g>
+ </g>
+ <g transform="rotate(45) translate(22 0)">
+
+ <g transform="translate(2.5 0) rotate(-45)">
+ <text font-size="7pt" transform="translate(-2.9 3)">+</text>
+ </g>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-exp-offset" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-232.3) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-224.2) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-215.5) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-206.2) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-196.1) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-184.9) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-172.2) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-157.1) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-137.4) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-123.5) translate(17 0)">
+ <polyline points="0,0 1,0" stroke-width="0.7"/>
+ </g>
+
+ <g transform="rotate(-90) translate(17 0)">
+
+ <g transform="translate(2.4 0) rotate(90)">
+ <text font-size="6.5pt" transform="translate(-2.3 3.3)">0</text>
+ </g>
+ </g>
+
+ <g transform="rotate(-56.5) translate(17 0)">
+ <polyline points="0,0 1,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-42.3) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(-22.9) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-7.8) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(4.8) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(16.1) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+ <g transform="rotate(26.2) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(35.5) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.2) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(52.3) translate(17 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(17 0)">
+ <polyline points="0,0 4,0" stroke-width="1.5"/>
+ </g>
+
+ <g transform="rotate(-225) translate(22 0)">
+
+ <g transform="translate(2.5 0) rotate(225)">
+ <text font-size="9pt" transform="translate(-2 3.4)">-</text>
+ </g>
+ </g>
+ <g transform="rotate(45) translate(22 0)">
+
+ <g transform="translate(2.5 0) rotate(-45)">
+ <text font-size="7pt" transform="translate(-2.9 3)">+</text>
+ </g>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">OFFSET</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(3 0)">OFFSET</text>
+ <g transform="translate(0 7)"><svg id="OFFSET_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-offset-offset" transform="scale(1) translate(0 7)" href="#dial-offset-offset"/>
+ <g class="io-group" transform="translate(5.5 53)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="OFFSET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 137)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6 0)">SCALE</text>
+ <g transform="translate(0 7)"><svg id="SCALE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-exp-offset" transform="scale(1) translate(0 7)" href="#dial-exp-offset"/>
+ <g class="io-group" transform="translate(5.5 53)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SCALE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 240)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+
+
+</svg>
diff --git a/res-pp/OneEight-lowcontrast-pp.svg b/res-pp/OneEight-lowcontrast-pp.svg
@@ -0,0 +1,351 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">1:8</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(6.5 32)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 30)"/>
+ <g transform="translate(5 3)"><svg id="CLOCK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(4 35)">CLOCK</text>
+ </g>
+ <g class="io-group" transform="translate(6.5 69)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="RESET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(5 35)">RESET</text>
+ </g>
+
+ <g transform="translate(1 121)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(7.5 0)">STEPS</text>
+ <g transform="translate(14.5 10.5)"><svg id="STEPS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -1)">
+ <g transform="translate(20 20)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(13 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(-197.1) translate(13 0) rotate(197.1) translate(-2 2)">2</text>
+ <text font-size="5.0pt" transform="rotate(-154.3) translate(13 0) rotate(154.3) translate(-2 2)">3</text>
+ <text font-size="5.0pt" transform="rotate(-111.4) translate(13 0) rotate(111.4) translate(-2 2)">4</text>
+ <text font-size="5.0pt" transform="rotate(-68.6) translate(13 0) rotate(68.6) translate(-2 2)">5</text>
+ <text font-size="5.0pt" transform="rotate(-25.7) translate(13 0) rotate(25.7) translate(-2 2)">6</text>
+ <text font-size="5.0pt" transform="rotate(17.1) translate(13 0) rotate(-17.1) translate(-2 2)">7</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-2 2)">8</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(16.5 166)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.8 -1)">FWD</text>
+ <g transform="translate(0 2)"><svg id="DIRECTION_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1.3 34)">REV</text>
+ </g>
+
+
+
+ <g transform="translate(1 220)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(4.5 0)">SELECT</text>
+ <g transform="translate(0 2)"><svg id="SELECT_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 2)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(19 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(-197.1) translate(19 0) rotate(197.1) translate(-2 2)">2</text>
+ <text font-size="5.0pt" transform="rotate(-154.3) translate(19 0) rotate(154.3) translate(-2 2)">3</text>
+ <text font-size="5.0pt" transform="rotate(-111.4) translate(19 0) rotate(111.4) translate(-2 2)">4</text>
+ <text font-size="5.0pt" transform="rotate(-68.6) translate(19 0) rotate(68.6) translate(-2 2)">5</text>
+ <text font-size="5.0pt" transform="rotate(-25.7) translate(19 0) rotate(25.7) translate(-2 2)">6</text>
+ <text font-size="5.0pt" transform="rotate(17.1) translate(19 0) rotate(-17.1) translate(-2 2)">7</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(19 0) rotate(-60) translate(-2 2)">8</text>
+ </g>
+ </g>
+ <g class="io-group" transform="translate(5.5 47)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="SELECT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(6.5 321)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+
+ <g class="io-group" transform="translate(49.5 32)">
+ <rect class="output-background" width="34" height="337" rx="5" transform="translate(0 -9)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 0)">OUT</text>
+
+ <g transform="translate(5 3)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">1</text>
+ <g transform="translate(17 29.5)"><svg id="OUT1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 44.3)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 76.3)">2</text>
+ <g transform="translate(17 70.8)"><svg id="OUT2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 86.6)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 118.6)">3</text>
+ <g transform="translate(17 113.1)"><svg id="OUT3_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 126.9)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 158.9)">4</text>
+ <g transform="translate(17 153.4)"><svg id="OUT4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 168.1)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 200.1)">5</text>
+ <g transform="translate(17 194.6)"><svg id="OUT5_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 209.4)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 241.4)">6</text>
+ <g transform="translate(17 235.9)"><svg id="OUT6_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 250.7)"><svg id="OUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 282.7)">7</text>
+ <g transform="translate(17 277.2)"><svg id="OUT7_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+
+ <g transform="translate(5 292)"><svg id="OUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(11 324)">8</text>
+ <g transform="translate(17 318.5)"><svg id="OUT8_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+
+
+
+
+</svg>
diff --git a/res-pp/PEQ-lowcontrast-pp.svg b/res-pp/PEQ-lowcontrast-pp.svg
@@ -0,0 +1,523 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-frequency-peq" viewBox="0 0 61px 45px">
+ <g transform="translate(25.5 22.5)">
+ <text font-size="5pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-5 4)">20K</text>
+ <text font-size="5pt" transform="rotate(-90) translate(20 0) rotate(90) translate(-4 2.2)">5K</text>
+ <text font-size="5pt" transform="rotate(-172.9) translate(20 0) rotate(172.9) translate(-5 2.2)">1K</text>
+ <text font-size="5pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-7 4)">0HZ</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-133.9) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-192.6) translate(17 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-level-peq" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5pt" transform="rotate(32.73) translate(20 0) rotate(-32.73) translate(-1.9 2.2)">0</text>
+ <text font-size="5pt" transform="rotate(-76.36) translate(20 0) rotate(76.36) translate(-4 2.2)">-24</text>
+ <text font-size="5pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-8 4)">-60dB</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(5.5) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-21.8) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-49.1) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-103.6) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-131) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-130.9) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-158.2) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-185.5) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-212.7) translate(17 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">PEQ</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(0 25)">
+
+
+
+ <g transform="translate(5.5 18)"><svg id="A_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(11.5 33) rotate(270)">A</text>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(20 58)">LEVEL</text>
+ <g transform="translate(13 3.5)"><svg id="A_LEVEL_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-peq" transform="translate(13 3.5)" href="#dial-level-peq"/>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(69 58)">FREQ</text>
+ <g transform="translate(59 3.5)"><svg id="A_FREQUENCY_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-peq" transform="translate(56 3.5)" href="#dial-frequency-peq"/>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(113 19) rotate(270)">BW</text>
+ <g transform="translate(122 4)"><svg id="A_BANDWIDTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 -8)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(113 58.5) rotate(270)">FCV</text>
+ <g transform="translate(122 42)"><svg id="A_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 30)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g transform="translate(118 26.5)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(0 6.1)">LP</text>
+ <g transform="translate(13.5 -1)"><svg id="A_MODE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="translate(0 93)">
+
+
+
+ <g transform="translate(5.5 18)"><svg id="B_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(11.5 33) rotate(270)">B</text>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(20 58)">LEVEL</text>
+ <g transform="translate(13 3.5)"><svg id="B_LEVEL_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-peq" transform="translate(13 3.5)" href="#dial-level-peq"/>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(69 58)">FREQ</text>
+ <g transform="translate(59 3.5)"><svg id="B_FREQUENCY_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-peq" transform="translate(56 3.5)" href="#dial-frequency-peq"/>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(113 22) rotate(270)">BW</text>
+ <g transform="translate(122 7)"><svg id="B_BANDWIDTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 -5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(113 56.5) rotate(270)">FCV</text>
+ <g transform="translate(122 40)"><svg id="B_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 28)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 159)">
+
+
+
+ <g transform="translate(5.5 18)"><svg id="C_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="6pt" letter-spacing="2px" transform="translate(11.5 33) rotate(270)">C</text>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(20 58)">LEVEL</text>
+ <g transform="translate(13 3.5)"><svg id="C_LEVEL_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-peq" transform="translate(13 3.5)" href="#dial-level-peq"/>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(69 58)">FREQ</text>
+ <g transform="translate(59 3.5)"><svg id="C_FREQUENCY_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-peq" transform="translate(56 3.5)" href="#dial-frequency-peq"/>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(113 19) rotate(270)">BW</text>
+ <g transform="translate(122 4)"><svg id="C_BANDWIDTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 -8)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(113 58.5) rotate(270)">FCV</text>
+ <g transform="translate(122 42)"><svg id="C_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 30)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g transform="translate(118 26.5)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(-0.5 6.1)">HP</text>
+ <g transform="translate(13.5 -1)"><svg id="C_MODE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(0 226)">
+ <rect class="input-background" width="130" height="134" rx="5" transform="translate(10 0)"/>
+ <rect class="output-background" width="32.5" height="46" rx="5" transform="translate(107.5 88)"/>
+ <rect class="output-background-filler" width="32.5" height="8" transform="translate(107.5 88)"/>
+ <rect class="output-background-filler" width="8" height="46" transform="translate(107.5 88)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="A_LEVEL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">A-LVL</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="B_LEVEL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">B-LVL</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="C_LEVEL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(2 40)">C-LVL</text>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="ALL_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(6 40)">FCV</text>
+ </g>
+
+ <g transform="translate(12 44)">
+ <g transform="translate(3 5)"><svg id="A_FREQUENCY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">A-FCV</text>
+ </g>
+ <g transform="translate(44 44)">
+ <g transform="translate(3 5)"><svg id="B_FREQUENCY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">B-FCV</text>
+ </g>
+ <g transform="translate(76 44)">
+ <g transform="translate(3 5)"><svg id="C_FREQUENCY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">C-FCV</text>
+ </g>
+ <g transform="translate(108 44)">
+ <g transform="translate(3 5)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 40)">IN</text>
+ </g>
+
+ <g transform="translate(12 88)">
+ <g transform="translate(3 5)"><svg id="A_BANDWIDTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">A-BW</text>
+ </g>
+ <g transform="translate(44 88)">
+ <g transform="translate(3 5)"><svg id="B_BANDWIDTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(2 40)">B-BW</text>
+ </g>
+ <g transform="translate(76 88)">
+ <g transform="translate(3 5)"><svg id="C_BANDWIDTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">C-BW</text>
+ </g>
+ <g transform="translate(108 88)">
+ <g transform="translate(3 5)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 40)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/PEQ14-lowcontrast-pp.svg b/res-pp/PEQ14-lowcontrast-pp.svg
@@ -0,0 +1,1822 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="690.0" height="380.0" viewBox="0 0 690.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="690.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 689.0,1 689.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 689.5,0.5 689.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 690.0,0 690.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(345.0 19)">PEQ14</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(345.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(329.5 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(6.5 48)">
+
+ <g transform="translate(40.5 11)"><svg id="FREQUENCY_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(28.5 -1)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(40 37)">FCV</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(0 5)"/>
+ <g transform="translate(3 8)"><svg id="FREQUENCY_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+
+ <g class="io-group" transform="translate(6.5 113)">
+
+ <g transform="translate(40.5 8)"><svg id="BANDWIDTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(28.5 -4)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(42.5 37)">BW</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(0 5)"/>
+ <g transform="translate(3 8)"><svg id="BANDWIDTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+
+ <g transform="translate(17.5 179)">
+
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 8.5)">CH1-LP</text>
+ <g transform="translate(31 1)"><svg id="LP_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(-3 20.5)">CH14-HP</text>
+ <g transform="translate(31 13)"><svg id="HP_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ </g>
+
+ <g transform="translate(18.5 227)">
+
+ <text font-size="5pt" letter-spacing="1px" transform="translate(5 34.5) rotate(-90)">FCV RNG</text>
+ <g transform="translate(10 1)"><svg id="FMOD_RELATIVE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(18.5 6.7)">OCTV</text>
+ <g transform="translate(10 14)"><svg id="FMOD_FULL_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(18.5 19.7)">FULL</text>
+ <g transform="translate(14 25)"><svg id="FMOD_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ </g>
+
+ <g class="io-group" transform="translate(5.5 287)">
+ <rect class="output-background" width="64" height="73" rx="5"/>
+ <rect class="input-background" width="32" height="36.5" rx="5"/>
+ <rect class="input-background-filler" width="32" height="10" transform="translate(0 26.5)"/>
+ <rect class="input-background-filler" width="10" height="36.5" transform="translate(22 0)"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ <g transform="translate(35 3)"><svg id="ODDS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(38.5 35)">ODD</text>
+ <g transform="translate(5 38)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 70)">OUT</text>
+ <g transform="translate(35 38)"><svg id="EVENS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(36 70)">EVEN</text>
+ </g>
+
+ <g transform="translate(74 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">1</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL1_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(118 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">2</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL2_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(162 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">3</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL3_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(206 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">4</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL4_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(250 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">5</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL5_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(294 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">6</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL6_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(338 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">7</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL7_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(382 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">8</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL8_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(426 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">9</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL9_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY9_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV9_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL9_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV9_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT9_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(470 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(17 8)">10</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL10_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY10_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV10_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL10_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV10_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT10_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(514 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(17.5 8)">11</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL11_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY11_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV11_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL11_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV11_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT11_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(558 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(17 8)">12</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL12_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY12_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV12_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL12_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV12_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT12_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(602 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(17 8)">13</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL13_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY13_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV13_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL13_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV13_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT13_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(646 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(17 8)">14</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL14_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY14_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV14_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL14_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV14_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT14_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/PEQ14XF-lowcontrast-pp.svg b/res-pp/PEQ14XF-lowcontrast-pp.svg
@@ -0,0 +1,318 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="75.0" height="380.0" viewBox="0 0 75.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="75.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 74.0,1 74.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 74.5,0.5 74.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 75.0,0 75.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="0.1px" text-anchor="end" transform="translate(72.0 17)">PEQ14XF</text>
+ <g transform="translate(25 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="2" height="2" fill="#ddd" transform="translate(11.5 -4)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(-2.5 24)">
+ <g transform="translate(14.5 6)"><svg id="DAMP_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 33)">DAMP</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="DAMP_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(32.5 23.5)">
+ <g transform="translate(14.5 6)"><svg id="GAIN_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 33)">GAIN</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 108)">
+ <rect class="output-background" width="64" height="260" rx="5" transform="translate(0 -10)"/>
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(27 0)">EF</text>
+ <g transform="translate(5 3)"><svg id="EF1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">1</text>
+ <g transform="translate(5 38)"><svg id="EF2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 70)">2</text>
+ <g transform="translate(5 73)"><svg id="EF3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 105)">3</text>
+ <g transform="translate(5 108)"><svg id="EF4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 140)">4</text>
+ <g transform="translate(5 143)"><svg id="EF5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 175)">5</text>
+ <g transform="translate(5 178)"><svg id="EF6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 210)">6</text>
+ <g transform="translate(5 213)"><svg id="EF7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 245)">7</text>
+
+ <g transform="translate(31 0)">
+ <g transform="translate(5 3)"><svg id="EF8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">8</text>
+ <g transform="translate(5 38)"><svg id="EF9_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 70)">9</text>
+ <g transform="translate(5 73)"><svg id="EF10_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 105)">10</text>
+ <g transform="translate(5 108)"><svg id="EF11_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 140)">11</text>
+ <g transform="translate(5 143)"><svg id="EF12_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 175)">12</text>
+ <g transform="translate(5 178)"><svg id="EF13_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 210)">13</text>
+ <g transform="translate(5 213)"><svg id="EF14_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 245)">14</text>
+ </g>
+ </g>
+
+
+
+
+</svg>
diff --git a/res-pp/PEQ14XR-lowcontrast-pp.svg b/res-pp/PEQ14XR-lowcontrast-pp.svg
@@ -0,0 +1,218 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="75.0" height="380.0" viewBox="0 0 75.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="75.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 74.0,1 74.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 74.5,0.5 74.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 75.0,0 75.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(72.0 17)">PEQ14XR</text>
+ <g transform="translate(25 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="2" height="2" fill="#ddd" transform="translate(11.5 -4)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(-2.5 24)">
+ <g transform="translate(14.5 6)"><svg id="DAMP_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 33)">DAMP</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="DAMP_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(32.5 23.5)">
+ <g transform="translate(14.5 6)"><svg id="GAIN_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 33)">GAIN</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(20.5 318)">
+ <rect class="output-background" width="34" height="42" rx="5"/>
+ <g transform="translate(5 4)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 37)">OUT</text>
+ </g>
+</svg>
diff --git a/res-pp/PEQ14XV-lowcontrast-pp.svg b/res-pp/PEQ14XV-lowcontrast-pp.svg
@@ -0,0 +1,346 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="75.0" height="380.0" viewBox="0 0 75.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-transpose-peq14xv" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-3.5 2)">-2</text>
+ <text font-size="5.0pt" transform="rotate(-165) translate(18 0) rotate(165) translate(-3 2)">-1</text>
+ <text font-size="5.0pt" transform="rotate(-90) translate(18 0) rotate(90) translate(-2 3)">0</text>
+ <text font-size="5.0pt" transform="rotate(-15) translate(18 0) rotate(15) translate(-2 2)">1</text>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-2 2)">2</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-208.75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-133.75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-46.25) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(28.75) translate(15 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="75.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 74.0,1 74.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 74.5,0.5 74.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 75.0,0 75.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(72.0 17)">PEQ14XV</text>
+ <g transform="translate(25 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="2" height="2" fill="#ddd" transform="translate(11.5 -4)"/>
+ </g>
+
+
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(9 30)">FOLLOWERS</text>
+
+ <g class="io-group" transform="translate(-2.5 34)">
+ <g transform="translate(14.5 6)"><svg id="EF_DAMP_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(10 33)">DAMP</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="EF_DAMP_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(32.5 34)">
+ <g transform="translate(14.5 6)"><svg id="EF_GAIN_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.5 33)">GAIN</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="EF_GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+
+ <g class="io-group" transform="translate(0 119)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(8 2)">TRANSPOSE</text>
+ <g transform="translate(24.5 13)"><svg id="TRANSPOSE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-transpose-peq14xv" transform="translate(15 3.5)" href="#dial-transpose-peq14xv"/>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(22.5 47)"/>
+ <g transform="translate(25.5 50)"><svg id="TRANSPOSE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+
+ <g transform="translate(0 212)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(18 5)">OUTPUT</text>
+
+ <g transform="translate(12 15)"><svg id="OUTPUT_GAIN_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 3)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(9 42)">GAIN</text>
+
+ <g transform="translate(47 15)"><svg id="BAND14_MIX_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(35 3)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(44 42)">B14D</text>
+
+ <g transform="translate(10 51)">
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(0 6)">B1</text>
+ <g transform="translate(9.5 -1)"><svg id="BAND1_ENABLE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(47.5 51)">
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(-5 6)">B14</text>
+ <g transform="translate(9.5 -1)"><svg id="BAND14_ENABLE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+
+ </g>
+
+ <g class="io-group" transform="translate(5.5 287)">
+ <rect class="output-background" width="64" height="73" rx="5"/>
+ <rect class="input-background" width="32" height="36.5" rx="5"/>
+ <rect class="input-background-filler" width="32" height="10" transform="translate(0 26.5)"/>
+ <rect class="input-background-filler" width="10" height="36.5" transform="translate(22 0)"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ <g transform="translate(35 3)"><svg id="ODDS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(38.5 35)">ODD</text>
+ <g transform="translate(5 38)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 70)">OUT</text>
+ <g transform="translate(35 38)"><svg id="EVENS_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(36 70)">EVEN</text>
+ </g>
+
+
+
+
+</svg>
diff --git a/res-pp/PEQ6-lowcontrast-pp.svg b/res-pp/PEQ6-lowcontrast-pp.svg
@@ -0,0 +1,926 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="315.0" height="380.0" viewBox="0 0 315.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="315.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 314.0,1 314.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 314.5,0.5 314.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 315.0,0 315.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(157.5 19)">PEQ6</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(157.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(142.0 -5)"/>
+ </g>
+
+
+
+
+
+ <g class="io-group" transform="translate(0 40)">
+
+ <g transform="translate(14.5 7)"><svg id="FREQUENCY_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 33)">FCV</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="FREQUENCY_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(0 124)">
+
+ <g transform="translate(14.5 5)"><svg id="BANDWIDTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -7)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(16.5 33)">BW</text>
+ <rect class="input-background" width="30" height="30" rx="5" transform="translate(7.5 36)"/>
+ <g transform="translate(10.5 39)"><svg id="BANDWIDTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(2 209)">
+
+ <text font-size="5pt" letter-spacing="1px" transform="translate(2.5 8.5)">CH1-LP</text>
+ <g transform="translate(33.5 1)"><svg id="LP_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.8px" transform="translate(2.5 20.5)">CH8-HP</text>
+ <g transform="translate(33.5 13)"><svg id="HP_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(6 242)">
+
+ <text font-size="5pt" letter-spacing="1px" transform="translate(5 34.5) rotate(-90)">FCV RNG</text>
+ <g transform="translate(10 1)"><svg id="FMOD_RELATIVE_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(18.5 6.7)">OCTV</text>
+ <g transform="translate(10 14)"><svg id="FMOD_FULL_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(18.5 19.7)">FULL</text>
+ <g transform="translate(14 25)"><svg id="FMOD_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 287)">
+ <rect class="output-background" width="34" height="73" rx="5"/>
+ <rect class="input-background" width="34" height="36.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 26.5)"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ <g transform="translate(5 38)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 70)">OUT</text>
+ </g>
+
+ <g transform="translate(45 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">1</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL1_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(90 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">2</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL2_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(135 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">3</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL3_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(180 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">4</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL4_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 192)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 191)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(225 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">5</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL5_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 164)"><svg id="FREQUENCY5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(270 20)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 8)">6</text>
+ <g transform="translate(0 8)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 19.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 32.86)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 46.05)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 72.41)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 125.14)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 151.5)">
+
+ <text font-size="6.0pt" transform="translate(7 -10) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 8)"><svg id="LEVEL6_PARAM">
+ <rect width="18" height="151" fill="none"/>
+ <rect width="6" height="145" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 40)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ <g transform="translate(14.5 163)"><svg id="FREQUENCY6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 152)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.8) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-27.9) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-172.9) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-240) translate(10 0) rotate(240) translate(-2.5 4)">0</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 193)">FREQ</text>
+ <g transform="translate(14.5 204)"><svg id="FREQUENCY_CV6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 192)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(14 229)">FCV</text>
+ <g class="io-group" transform="translate(5.5 232)">
+ <rect class="output-background" width="34" height="108" rx="5"/>
+ <rect class="input-background" width="34" height="71.5" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 61.5)"/>
+ <g transform="translate(5 3)"><svg id="LEVEL6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">LEVEL</text>
+ <g transform="translate(5 38)"><svg id="FREQUENCY_CV6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 70)">FCV</text>
+ <g transform="translate(5 73)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8 105)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/PEQ6XF-lowcontrast-pp.svg b/res-pp/PEQ6XF-lowcontrast-pp.svg
@@ -0,0 +1,242 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">PEQ6XF</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 24)">
+ <g transform="translate(14.5 8)"><svg id="DAMP_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -4)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(12 0)">DAMP</text>
+ </g>
+
+ <g transform="translate(0 63)">
+ <g transform="translate(14.5 8)"><svg id="GAIN_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -4)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(13 0)">GAIN</text>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 104)">
+ <rect class="output-background" width="34" height="225" rx="5" transform="translate(0 -10)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 0)">EF</text>
+ <g transform="translate(5 3)"><svg id="EF1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">1</text>
+ <g transform="translate(5 38)"><svg id="EF2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 70)">2</text>
+ <g transform="translate(5 73)"><svg id="EF3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 105)">3</text>
+ <g transform="translate(5 108)"><svg id="EF4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 140)">4</text>
+ <g transform="translate(5 143)"><svg id="EF5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 175)">5</text>
+ <g transform="translate(5 178)"><svg id="EF6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 210)">6</text>
+ </g>
+</svg>
diff --git a/res-pp/Pan-lowcontrast-pp.svg b/res-pp/Pan-lowcontrast-pp.svg
@@ -0,0 +1,247 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-panner-pan" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.8 2)">L</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-2.1 2)">R</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">PAN</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 15)">
+ <g transform="translate(9.5 9.5)"><svg id="PAN1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-panner-pan" transform="translate(0 0)" href="#dial-panner-pan"/>
+ <g class="io-group" transform="translate(5.5 44)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ <g transform="translate(5 38)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 70)">IN</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 138)">
+ <g transform="translate(9.5 9.5)"><svg id="PAN2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-panner-pan" transform="translate(0 0)" href="#dial-panner-pan"/>
+ <g class="io-group" transform="translate(5.5 44)">
+ <rect class="input-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ <g transform="translate(5 38)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 70)">IN</text>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 265)">
+ <rect class="output-background" width="34" height="73" rx="5"/>
+ <g transform="translate(5 3)"><svg id="L_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">L</text>
+ <g transform="translate(5 38)"><svg id="R_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 70)">R</text>
+ </g>
+</svg>
diff --git a/res-pp/Pgmr-lowcontrast-pp.svg b/res-pp/Pgmr-lowcontrast-pp.svg
@@ -0,0 +1,986 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">PGMR</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+
+
+
+
+ <g class="io-group" transform="translate(5.5 56)">
+ <rect class="output-background" width="34" height="155" rx="5" transform="translate(0 -10)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 0)">OUT</text>
+ <g transform="translate(5 3)"><svg id="A_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">A</text>
+ <g transform="translate(5 38)"><svg id="B_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 70)">B</text>
+ <g transform="translate(5 73)"><svg id="C_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 105)">C</text>
+ <g transform="translate(5 108)"><svg id="D_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 140)">D</text>
+ </g>
+
+ <g transform="translate(0 224)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 92)"/>
+ <rect class="input-background" width="34" height="102" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(5 2)"><svg id="CLOCK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(2.5 34)">CLOCK</text>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(5 46.5)">FWD</text>
+ <g transform="translate(22.5 39.7)"><svg id="DIRECTION_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="0.1px" transform="translate(2 60)">S.O.C.</text>
+ <g transform="translate(22.5 53.2)"><svg id="SELECT_ON_CLOCK_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 66)"><svg id="SELECT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 98)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 105)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="30" rx="5"/>
+ <g transform="translate(5 1)"><svg id="SELECT_ALL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="translate(45 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 -1)">1</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(90 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 -1)">2</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(135 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 -1)">3</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT3_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(180 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.5 -1)">4</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>Z
+ </g>
+
+</svg>
diff --git a/res-pp/PgmrX-lowcontrast-pp.svg b/res-pp/PgmrX-lowcontrast-pp.svg
@@ -0,0 +1,905 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="180.0" height="380.0" viewBox="0 0 180.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="180.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 179.0,1 179.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 179.5,0.5 179.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 180.0,0 180.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(90.0 19)">PGMRX</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(90.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(74.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(0 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(18 -1)">+1</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(45 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(18 -1)">+2</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(90 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(18 -1)">+3</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT3_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT3_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(135 30)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(17.5 -1)">+4</text>
+ <g transform="translate(9.5 10.5)"><svg id="CVA4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 1)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 48)">A</text>
+ <g transform="translate(9.5 64.5)"><svg id="CVB4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 55)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 102)">B</text>
+ <g transform="translate(9.5 118.5)"><svg id="CVC4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 109)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 156)">C</text>
+ <g transform="translate(9.5 172.5)"><svg id="CVD4_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 163)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-225) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-195) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-165) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-135) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-105) translate(15 0)"/>
+
+ <text font-size="5pt" transform="rotate(-90) translate(15 0) rotate(90) translate(-1.9 0)">0</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-45) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(-15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(15) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(45) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1.0" transform="rotate(60) translate(15 0)"/>
+
+ <text font-size="9pt" transform="rotate(-225) translate(20 0) rotate(225) translate(-1 8.8)">-</text>
+ <text font-size="7pt" transform="rotate(45) translate(20 0) rotate(-45) translate(-3.9 8.5)">+</text>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(20.3 210)">D</text>
+ <g transform="translate(0 223)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="76" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(13.8 2)"><svg id="SELECT4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(8 14)"><svg id="SELECT4_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 37)"><svg id="SELECT4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(2.5 69)">SELECT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 73)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 0)"/>
+ <rect class="output-background" width="34" height="33" rx="5"/>
+ <g transform="translate(5 4)"><svg id="SELECT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/PolyCon16-lowcontrast-pp.svg b/res-pp/PolyCon16-lowcontrast-pp.svg
@@ -0,0 +1,565 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="120.0" height="380.0" viewBox="0 0 120.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="120.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 119.0,1 119.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 119.5,0.5 119.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 120.0,0 120.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="2px" text-anchor="end" transform="translate(110.0 19)">POLYCON16</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+
+
+ <g transform="translate(21.5 22)">
+ <g transform="translate(3.6 8)"><svg id="CHANNEL1_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-6.5 20.5)">1</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 59)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL2_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7 20.5)">2</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 96)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL3_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7 20.5)">3</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 133)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL4_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7.2 20.5)">4</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL4_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 170)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL5_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7.2 20.5)">5</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL5_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 207)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL6_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7.2 20.5)">6</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL6_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 244)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL7_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7.2 20.5)">7</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL7_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(21.5 281)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL8_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(-7.2 20.5)">8</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL8_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(71.5 22)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL9_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(31 20.5)">9</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL9_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 59)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL10_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">10</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL10_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 96)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL11_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">11</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL11_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 133)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL12_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">12</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL12_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 170)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL13_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">13</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL13_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 207)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL14_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">14</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL14_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 244)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL15_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">15</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL15_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(71.5 281)">
+ <g transform="translate(3.5 8)"><svg id="CHANNEL16_PARAM">
+ <g transform="translate(10 10)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="9.3" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-6.5 -2)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(11.5 0)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 1 13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -13.5 A 13.5 13.5 0 0 0 -13.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(30.5 20.5)">16</text>
+ <g transform="translate(12.25 30)"><svg id="CHANNEL16_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g transform="translate(11 320)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(0 39) rotate(-90) translate(6.5 0)">CHAN</text>
+ <g transform="translate(12 12)"><svg id="CHANNELS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(20 20)">
+ <text font-size="5pt" transform="rotate(-240) translate(14 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5pt" transform="rotate(-180) translate(14 0) rotate(180) translate(-2 2)">4</text>
+ <text font-size="5pt" transform="rotate(-100) translate(14 0) rotate(100) translate(-2 2)">8</text>
+ <text font-size="5pt" transform="rotate(-20) translate(13 0) rotate(20) translate(-2 2)">12</text>
+ <text font-size="5pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-1.8 3)">16</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-220) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-200) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-160) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-140) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-80) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-40) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(20) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(40) translate(10 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(52 318)">
+ <rect class="input-background" width="60" height="40" rx="5"/>
+ <rect class="output-background" width="24" height="40" rx="5" transform="translate(38)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 4)"><svg id="CHANNELS_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 36)">CHAN</text>
+ <g transform="translate(34.5 4)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(36 36)">OUT</text>
+ </g>
+</svg>
diff --git a/res-pp/PolyCon8-lowcontrast-pp.svg b/res-pp/PolyCon8-lowcontrast-pp.svg
@@ -0,0 +1,354 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="1.3px">POLYCON8</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+
+ <g transform="translate(0 18)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">1</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 49.5)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">2</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 81)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">3</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 112.5)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">4</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL4_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 144)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">5</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL5_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 175.5)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">6</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL6_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 207)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">7</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL7_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(0 238.5)">
+
+ <g transform="translate(14.5 6)"><svg id="CHANNEL8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -6)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(3 16.5)">8</text>
+ <g transform="translate(38.5 12.4)"><svg id="CHANNEL8_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(7.5 270)">
+ <rect class="output-background" width="34" height="40" rx="5" transform="translate(-2 0)"/>
+ <g transform="translate(3 4)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 36)">OUT</text>
+ </g>
+</svg>
diff --git a/res-pp/PolyMult-lowcontrast-pp.svg b/res-pp/PolyMult-lowcontrast-pp.svg
@@ -0,0 +1,240 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">POLYMULT</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(2.5 30)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(6.5 0)">CHAN</text>
+ <g transform="translate(12 12)"><svg id="CHANNELS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(20 20)">
+ <text font-size="5pt" transform="rotate(-240) translate(14 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5pt" transform="rotate(-180) translate(14 0) rotate(180) translate(-2 2)">4</text>
+ <text font-size="5pt" transform="rotate(-100) translate(14 0) rotate(100) translate(-2 2)">8</text>
+ <text font-size="5pt" transform="rotate(-20) translate(13 0) rotate(20) translate(-2 2)">12</text>
+ <text font-size="5pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-1.8 3)">16</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-220) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-200) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-160) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-140) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-80) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-40) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(20) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(40) translate(10 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 70)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="74" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 64)"/>
+ <g transform="translate(5 3)"><svg id="CHANNELS_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(6 35)">CHAN</text>
+ <g transform="translate(5 39)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 71)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 77)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="140" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ <g transform="translate(5 35)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 67)">OUT</text>
+ <g transform="translate(5 70)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 102)">OUT</text>
+ <g transform="translate(5 105)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 137)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/PolyOff16-lowcontrast-pp.svg b/res-pp/PolyOff16-lowcontrast-pp.svg
@@ -0,0 +1,929 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="240.0" height="380.0" viewBox="0 0 240.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="240.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 239.0,1 239.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 239.5,0.5 239.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 240.0,0 240.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(120.0 19)">POLYOFF16</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(120.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(104.5 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(5.5 24)">
+ <rect class="input-background" width="34" height="289" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 40)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 75)"><svg id="CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 110)"><svg id="CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 145)"><svg id="CV5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 180)"><svg id="CV6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 215)"><svg id="CV7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 250)"><svg id="CV8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(4 284)">IN/CV</text>
+ </g>
+
+ <g class="io-group" transform="translate(125.5 24)">
+ <rect class="input-background" width="34" height="289" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="CV9_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 40)"><svg id="CV10_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 75)"><svg id="CV11_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 110)"><svg id="CV12_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 145)"><svg id="CV13_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 180)"><svg id="CV14_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 215)"><svg id="CV15_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 250)"><svg id="CV16_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(4 284)">IN/CV</text>
+ </g>
+
+ <g transform="translate(0 33)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">1</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 68)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">2</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 103)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">3</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 138)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">4</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL4_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 173)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">5</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL5_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 208)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">6</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL6_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 243)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">7</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL7_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 278)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">8</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL8_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(120 33)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">9</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL9_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET9_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE9_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 68)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">10</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL10_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET10_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE10_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 103)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">11</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL11_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET11_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE11_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 138)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">12</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL12_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET12_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE12_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 173)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">13</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL13_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET13_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE13_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 208)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">14</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL14_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET14_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE14_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 243)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">15</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL15_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET15_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE15_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(120 278)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(44 8)">16</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL16_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET16_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE16_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="0.3px" transform="translate(55 308)">OFFSET</text>
+ <text font-size="6pt" letter-spacing="0.3px" transform="translate(88.5 308)">SCALE</text>
+ <text font-size="6pt" letter-spacing="0.3px" transform="translate(175 308)">OFFSET</text>
+ <text font-size="6pt" letter-spacing="0.3px" transform="translate(208.5 308)">SCALE</text>
+
+
+
+
+ <g transform="translate(73 320)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(-4 39) rotate(-90) translate(6.5 0)">CHAN</text>
+ <g transform="translate(10 12)"><svg id="CHANNELS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-2 0)">
+ <g transform="translate(20 20)">
+ <text font-size="5pt" transform="rotate(-240) translate(14 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5pt" transform="rotate(-180) translate(14 0) rotate(180) translate(-2 2)">4</text>
+ <text font-size="5pt" transform="rotate(-100) translate(14 0) rotate(100) translate(-2 2)">8</text>
+ <text font-size="5pt" transform="rotate(-20) translate(13 0) rotate(20) translate(-2 2)">12</text>
+ <text font-size="5pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-1.8 3)">16</text>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-220) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-200) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-160) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-140) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-80) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-40) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(20) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(40) translate(10 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(115 318)">
+ <rect class="input-background" width="60" height="40" rx="5"/>
+ <rect class="output-background" width="24" height="40" rx="5" transform="translate(38)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 4)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(11 36)">IN</text>
+ <g transform="translate(34.5 4)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(36 36)">OUT</text>
+ </g>
+</svg>
diff --git a/res-pp/PolyOff8-lowcontrast-pp.svg b/res-pp/PolyOff8-lowcontrast-pp.svg
@@ -0,0 +1,580 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="120.0" height="380.0" viewBox="0 0 120.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="120.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 119.0,1 119.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 119.5,0.5 119.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 120.0,0 120.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(110.0 19)">POLYOFF8</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+
+
+
+
+
+
+
+
+ <g class="io-group" transform="translate(5.5 24)">
+ <rect class="input-background" width="34" height="289" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 40)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 75)"><svg id="CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 110)"><svg id="CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 145)"><svg id="CV5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 180)"><svg id="CV6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 215)"><svg id="CV7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 250)"><svg id="CV8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(4 284)">IN/CV</text>
+ </g>
+
+ <g transform="translate(0 33)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">1</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL1_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE1_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 68)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">2</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL2_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE2_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 103)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">3</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL3_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE3_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 138)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">4</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL4_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE4_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 173)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">5</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL5_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE5_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 208)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">6</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL6_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE6_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 243)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">7</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL7_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE7_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <g transform="translate(0 278)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(46.5 8)">8</text>
+ <g transform="translate(46.8 10)"><svg id="CHANNEL8_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ <g transform="translate(62.5 0)"><svg id="OFFSET8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(50.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(93.5 0)"><svg id="SCALE8_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(81.5 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ </g>
+
+ <text font-size="6pt" letter-spacing="0.3px" transform="translate(55 308)">OFFSET</text>
+ <text font-size="6pt" letter-spacing="0.3px" transform="translate(88.5 308)">SCALE</text>
+
+ <g transform="translate(11 320)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(0 39) rotate(-90) translate(6.5 0)">CHAN</text>
+ <g transform="translate(12 12)"><svg id="CHANNELS_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 0)">
+ <g transform="translate(20 20)">
+ <text font-size="5pt" transform="rotate(-240) translate(14 0) rotate(240) translate(-2 2)">1</text>
+ <text font-size="5pt" transform="rotate(-197.1) translate(14 0) rotate(197.1) translate(-2 2)">2</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-154.3) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-111.4) translate(14 0) rotate(111.4) translate(-2 2)">4</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-68.6) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(-25.7) translate(13 0) rotate(25.7) translate(-2 2)">6</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(17.1) translate(10 0)"/>
+ <text font-size="5pt" transform="rotate(60) translate(13 0) rotate(-60) translate(-1.8 3)">8</text>
+ </g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(52 318)">
+ <rect class="input-background" width="60" height="40" rx="5"/>
+ <rect class="output-background" width="24" height="40" rx="5" transform="translate(38)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 4)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(11 36)">IN</text>
+ <g transform="translate(34.5 4)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(36 36)">OUT</text>
+ </g>
+</svg>
diff --git a/res-pp/Pressor-lowcontrast-pp.svg b/res-pp/Pressor-lowcontrast-pp.svg
@@ -0,0 +1,565 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-ratio-pressor" viewBox="0 0 70px 70px">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-2.5 2.5)">1</text>
+ <text font-size="6.0pt" transform="rotate(-193.72) translate(25 0) rotate(193.72) translate(-8 2.5)">1.1</text>
+ <text font-size="6.0pt" transform="rotate(-149.7) translate(25 0) rotate(149.7) translate(-9 2.5)">1.3</text>
+ <text font-size="6.0pt" transform="rotate(-108.93) translate(25 0) rotate(108.93) translate(-9 2.5)">1.6</text>
+ <text font-size="6.0pt" transform="rotate(-74.52) translate(25 0) rotate(74.52) translate(-2.3 2.5)">2</text>
+ <text font-size="6.0pt" transform="rotate(-47.12) translate(25 0) rotate(47.12) translate(-2.3 2.5)">2.5</text>
+ <text font-size="6.0pt" transform="rotate(-6.18) translate(25 0) rotate(6.18) translate(-2.3 2.5)">4</text>
+ <text font-size="6.0pt" transform="rotate(31.11) translate(25 0) rotate(-31.11) translate(-2.3 2.5)">9</text>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-4 2.2)">∞</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-threshold-pressor" viewBox="0 0 70px 70px">
+ <g transform="translate(35 35)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-10 2.5)">-24</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-180) translate(25 0) rotate(180) translate(-10 2.5)">-18</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-120) translate(25 0) rotate(120) translate(-10 2.5)">-12</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(-60) translate(25 0) rotate(60) translate(-2.3 2.5)">-6</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(0) translate(25 0) rotate(0) translate(-2.3 2.5)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(21 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(25 0) rotate(-60) translate(-2.3 2.5)">6</text>
+ <text font-size="6.0pt" transform="rotate(90) translate(29 0) rotate(-90) translate(-4.7 2.2)">dB</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-attack-pressor" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-172.92) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-145.13) translate(17 0) rotate(145.13) translate(-5.7 2.2)">50</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75.68) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-27.87) translate(17 0) rotate(27.87) translate(-2.2 2.2)">250</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.81) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">500</text>
+ <text font-size="5.0pt" transform="rotate(90) translate(22 0) rotate(-90) translate(-4.4 2.2)">MS</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-release-pressor" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-172.92) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-145.13) translate(17 0) rotate(145.13) translate(-7.5 2.2)">0.2</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75.68) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-27.87) translate(17 0) rotate(27.87) translate(-2.2 2.2)">1</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.81) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">2</text>
+ <text font-size="5.0pt" transform="rotate(90) translate(22 0) rotate(-90) translate(-2 2.2)">S</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-detectormix-pressor" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-4.2 2.2)">IN</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-2.1 2.5)">SD</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-inputgain-pressor" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-8 2.2)">-12</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-202.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-165) translate(17 0) rotate(165) translate(-4.5 2.2)">-6</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-127.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-90) translate(17 0) rotate(90) translate(-1.9 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-52.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-15) translate(17 0) rotate(15) translate(-2 2.2)">6</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(22.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">12</text>
+ <text font-size="5.0pt" transform="rotate(90) translate(22 0) rotate(-90) translate(-4 2.2)">dB</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-outputgain-pressor" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-202.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-165) translate(17 0) rotate(165) translate(-2 2.2)">6</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-127.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-90) translate(17 0) rotate(90) translate(-4 2)">12</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-52.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-15) translate(17 0) rotate(15) translate(-3.5 2.2)">18</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(22.5) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">24</text>
+ <text font-size="5.0pt" transform="rotate(90) translate(22 0) rotate(-90) translate(-4 2.2)">dB</text>
+ </g>
+ </symbol>
+
+ <symbol id="compression-pressor" viewBox="0 0 11px 75px">
+
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 0)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 15)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 30)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 45)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 60)"/>
+ </symbol>
+
+ <symbol id="guide-compression-pressor" viewBox="0 0 20px 95px">
+ <g transform="translate(0 10)">
+ <g transform="translate(0 0)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-5.5 2.2)">30+</text>
+ </g>
+ <g transform="translate(0 15)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">24</text>
+ </g>
+ <g transform="translate(0 30)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4.5 2.2)">18</text>
+ </g>
+ <g transform="translate(0 45)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4.5 2.2)">12</text>
+ </g>
+ <g transform="translate(0 60)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-2.5 2.2)">6</text>
+ </g>
+ <g transform="translate(0 75)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-2.5 2.2)">0</text>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">PRESSOR</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+ <g transform="translate(13 53)">
+
+
+
+
+
+ <text font-size="8pt" letter-spacing="1.5px" transform="translate(4 56.5) rotate(270)">THRESHOLD</text>
+ <g transform="translate(23 0)"><svg id="THRESHOLD_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-threshold-pressor" transform="translate(7 -16)" href="#dial-threshold-pressor"/>
+ </g>
+
+ <g transform="translate(102 53)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(4 38.5) rotate(270)">RATIO</text>
+ <g transform="translate(23 0)"><svg id="RATIO_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-ratio-pressor" transform="translate(7 -16)" href="#dial-ratio-pressor"/>
+ </g>
+
+ <g transform="translate(207 35)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(-15 75) rotate(270)">COMPRESSION</text>
+ <use id="COMPRESSION_WIDGET" xlink:href="#compression-pressor" transform="translate(0 -1)" href="#compression-pressor"/>
+ <use xlink:href="#guide-compression-pressor" transform="translate(-13 -11)" href="#guide-compression-pressor"/>
+ </g>
+
+ <g transform="translate(10 141)">
+ <g transform="translate(13 0)">
+
+
+
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(6 38.5) rotate(270)">ATTACK</text>
+ <g transform="translate(19 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <use xlink:href="#dial-attack-pressor" transform="translate(21.5 -9.5)" href="#dial-attack-pressor"/>
+ <g transform="translate(102 0)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(6 42) rotate(270)">RELEASE</text>
+ <g transform="translate(19 0)"><svg id="RELEASE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <use xlink:href="#dial-release-pressor" transform="translate(111.5 -9.5)" href="#dial-release-pressor"/>
+ </g>
+
+ <g transform="translate(10 213)">
+ <g transform="translate(-1 0)">
+
+
+
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 38.5) rotate(270)">IN GAIN</text>
+ <g transform="translate(19 0)"><svg id="INPUT_GAIN_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <use xlink:href="#dial-inputgain-pressor" transform="translate(8.5 -9.5)" href="#dial-inputgain-pressor"/>
+ <g transform="translate(60 0)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 44.5) rotate(270)">OUT GAIN</text>
+ <g transform="translate(19 0)"><svg id="OUTPUT_GAIN_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <use xlink:href="#dial-outputgain-pressor" transform="translate(69.5 -9.5)" href="#dial-outputgain-pressor"/>
+ <g transform="translate(121 0)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 38) rotate(270)">IN/SIDE</text>
+ <g transform="translate(19 0)"><svg id="DETECTOR_MIX_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <use xlink:href="#dial-detectormix-pressor" transform="translate(130.5 -9.5)" href="#dial-detectormix-pressor"/>
+ </g>
+
+ <g transform="translate(199 128)">
+ <g transform="translate(0 0)">
+
+ <text font-size="5pt" letter-spacing="1.5px" transform="translate(-8 25.5) rotate(270)">MODE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 -1)">COMP</text>
+ <g transform="translate(0 2)"><svg id="MODE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">GATE</text>
+ </g>
+ <g transform="translate(0 49)">
+
+ <text font-size="5pt" letter-spacing="1.5px" transform="translate(-8 30) rotate(270)">DETECT</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-2 -1)">RMS</text>
+ <g transform="translate(0 2)"><svg id="DECTECTOR_MODE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">PEAK</text>
+ </g>
+ <g transform="translate(0 98)">
+
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 25.5) rotate(270)">KNEE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 -1)">SOFT</text>
+ <g transform="translate(0 2)"><svg id="KNEE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-5 34)">HARD</text>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="205" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="137" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="171" height="47" rx="5" transform="translate(10 44)"/>
+ <rect class="input-background-filler" width="10" height="10" transform="translate(137 0)"/>
+ <rect class="input-background-filler" width="10" height="10" transform="translate(171 81)"/>
+
+ <g transform="translate(10 0)">
+ <g transform="translate(3 0)">
+ <g transform="translate(3 5)"><svg id="LEFT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(13 40)">L</text>
+ </g>
+ <g transform="translate(37 0)">
+ <g transform="translate(3 5)"><svg id="SIDECHAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(3 40)">SIDE</text>
+ </g>
+ <g transform="translate(71 0)">
+ <g transform="translate(3 5)"><svg id="THRESHOLD_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(1.5 40)">TRSH</text>
+ </g>
+ <g transform="translate(105 0)">
+ <g transform="translate(3 5)"><svg id="RATIO_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1.5 40)">RATIO</text>
+ </g>
+ <g transform="translate(139 0)">
+ <g transform="translate(3 5)"><svg id="ENVELOPE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5.5 40)">ENV</text>
+ </g>
+ <g transform="translate(173 0)">
+ <g transform="translate(3 5)"><svg id="LEFT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(13 40)">L</text>
+ </g>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(3 0)">
+ <g transform="translate(3 5)"><svg id="RIGHT_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(13 40)">R</text>
+ </g>
+ <g transform="translate(37 0)">
+ <g transform="translate(3 5)"><svg id="ATTACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5.5 40)">ATT</text>
+ </g>
+ <g transform="translate(71 0)">
+ <g transform="translate(3 5)"><svg id="RELEASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5.4 40)">REL</text>
+ </g>
+ <g transform="translate(105 0)">
+ <g transform="translate(3 5)"><svg id="INPUT_GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5.3 40)">IGN</text>
+ </g>
+ <g transform="translate(139 0)">
+ <g transform="translate(3 5)"><svg id="OUTPUT_GAIN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5.3 40)">OGN</text>
+ </g>
+ <g transform="translate(173 0)">
+ <g transform="translate(3 5)"><svg id="RIGHT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(12 40)">R</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Pulse-lowcontrast-pp.svg b/res-pp/Pulse-lowcontrast-pp.svg
@@ -0,0 +1,312 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-frequency-pulse" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-206.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-173.33) translate(15 0)"/>
+
+ <g transform="rotate(-140) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="1.0" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(140) translate(-5.5 0)">OV</text>
+ </g>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-106.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-73.33) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-40) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-6.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(26.67) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-pw-pulse" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">PULSE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 25)">
+
+ <g transform="translate(9.5 2)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-pulse" transform="translate(0 -7.5)" href="#dial-frequency-pulse"/>
+ </g>
+
+ <g transform="translate(0 63)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 6.1)">SLOW</text>
+ <g transform="translate(31 -1)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 89)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(15.5 -1)">PW</text>
+ <g transform="translate(9.5 9.5)"><svg id="PW_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-pw-pulse" transform="translate(0 0)" href="#dial-pw-pulse"/>
+ </g>
+
+ <g transform="translate(0 145)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10.5 0)">PWM</text>
+ <g transform="translate(14.5 9.5)"><svg id="PWM_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 182)">
+
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="105" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 98)"/>
+ <g transform="translate(5 3)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">V/OCT</text>
+ <g transform="translate(5 38)"><svg id="PWM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(7 70)">PWM</text>
+ <g transform="translate(5 73)"><svg id="SYNC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 105)">SYNC</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 111)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Reftone-lowcontrast-pp.svg b/res-pp/Reftone-lowcontrast-pp.svg
@@ -0,0 +1,317 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-pitch-reftone" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(240) translate(-2.2 2.2)">C</text>
+ </g>
+ <g transform="rotate(-212.73) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-185.45) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(185.45) translate(-2.2 2.2)">D</text>
+ </g>
+ <g transform="rotate(-158.18) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-130.91) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(130.91) translate(-2.2 2.2)">E</text>
+ </g>
+ <g transform="rotate(-103.64) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(103.64) translate(-2.2 2.2)">F</text>
+ </g>
+ <g transform="rotate(-76.36) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-49.09) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(49.09) translate(-2.2 2.2)">G</text>
+ </g>
+ <g transform="rotate(-21.82) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(5.45) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(-5.45) translate(-2.2 2.2)">A</text>
+ </g>
+ <g transform="rotate(32.73) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(-60) translate(-2.2 2.2)">B</text>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-octave-reftone" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(240) translate(-2.2 2.2)">1</text>
+ </g>
+ <g transform="rotate(-197.14) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(197.14) translate(-2.2 2.2)">2</text>
+ </g>
+ <g transform="rotate(-154.29) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(154.29) translate(-2.2 2.2)">3</text>
+ </g>
+ <g transform="rotate(-111.43) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(111.43) translate(-2.2 2.2)">4</text>
+ </g>
+ <g transform="rotate(-68.57) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(68.57) translate(-2.2 2.2)">5</text>
+ </g>
+ <g transform="rotate(-25.71) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(25.71) translate(-2.2 2.2)">6</text>
+ </g>
+ <g transform="rotate(17.14) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(-17.14) translate(-2.2 2.2)">7</text>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(-60) translate(-2.2 2.2)">8</text>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-fine-reftone" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(240) translate(-1.5 2.2)">-</text>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-1.9 2.2)">0</text>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(-60) translate(-1.9 2.2)">+</text>
+ </g>
+ <path d="M 0 -17.5 A 17.5 17.5 0 0 1 17.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -17.5 A 17.5 17.5 0 0 1 17.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -17.5 A 17.5 17.5 0 0 0 -17.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -17.5 A 17.5 17.5 0 0 0 -17.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">REFTONE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g transform="translate(3.5 0)"><svg id="DISPLAY_WIDGET">
+ <rect cx="0" cy="0" width="38" height="48" fill="#444"/>
+ </svg></g>
+
+ <g transform="translate(0 62)">
+ <g transform="translate(0 0)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7 0)">PITCH</text>
+ <g transform="translate(9.5 9.5)"><svg id="PITCH_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 54)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(2.5 0)">OCTAVE</text>
+ <g transform="translate(9.5 9.5)"><svg id="OCTAVE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 108)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(11 0)">FINE</text>
+ <g transform="translate(9.5 9.5)"><svg id="FINE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+ </g>
+
+ <use xlink:href="#dial-pitch-reftone" transform="translate(0 80)" href="#dial-pitch-reftone"/>
+ <use xlink:href="#dial-octave-reftone" transform="translate(0 134)" href="#dial-octave-reftone"/>
+ <use xlink:href="#dial-fine-reftone" transform="translate(0 188)" href="#dial-fine-reftone"/>
+
+ <g transform="translate(0 235)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="output-background" width="34" height="75" rx="5" transform="translate(5.5 0)"/>
+ <g transform="translate(5.5 1)">
+ <g transform="translate(5 3)"><svg id="CV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(3 35)">V/OCT</text>
+ </g>
+ <g transform="translate(5.5 39)">
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 32)">SINE</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/SampleHold-lowcontrast-pp.svg b/res-pp/SampleHold-lowcontrast-pp.svg
@@ -0,0 +1,290 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">S&H</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+
+
+ <g transform="translate(0 5)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 58)"/>
+ <rect class="input-background" width="34" height="62" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER1_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 26)"><svg id="TRIGGER1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 58)">GATE</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 65)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 51)"/>
+ <rect class="input-background" width="34" height="58" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+
+ <g transform="translate(9.5 41)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 5.5)">TRK</text>
+ <g transform="translate(17 -1.3)"><svg id="TRACK1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(9.5 52)">
+ <text font-size="5pt" letter-spacing="1.2px" transform="translate(1 5.5)">INV</text>
+ <g transform="translate(17 -1.3)"><svg id="INVERT1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 64)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 181)">
+
+ <g transform="translate(0 5)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 58)"/>
+ <rect class="input-background" width="34" height="62" rx="5"/>
+ <g transform="translate(8 4)"><svg id="TRIGGER2_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 26)"><svg id="TRIGGER2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 58)">GATE</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 65)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 51)"/>
+ <rect class="input-background" width="34" height="58" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+
+ <g transform="translate(9.5 41)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 5.5)">TRK</text>
+ <g transform="translate(17 -1.3)"><svg id="TRACK2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(9.5 52)">
+ <text font-size="5pt" letter-spacing="1.2px" transform="translate(1 5.5)">INV</text>
+ <g transform="translate(17 -1.3)"><svg id="INVERT2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 64)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+
+</svg>
diff --git a/res-pp/Shaper-lowcontrast-pp.svg b/res-pp/Shaper-lowcontrast-pp.svg
@@ -0,0 +1,607 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">SHAPER</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(9 33)">
+ <g transform="translate(0 0)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 43.5) rotate(270)">ATTACK</text>
+ <g transform="translate(20 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 47)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(74 4)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <g transform="translate(6 6) scale(0.18)"><svg id="TRIGGER_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(31 3)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">TRIGGER</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 56)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 28) rotate(270)">ON</text>
+ <g transform="translate(20 0)"><svg id="ON_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 32)"><svg id="ON_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(110 5)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 28.5) rotate(270)">SPEED</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(2 -1)">1X</text>
+ <g transform="translate(0 2)"><svg id="SPEED_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1 34)">10X</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 112)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 40.5) rotate(270)">DECAY</text>
+ <g transform="translate(20 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 44)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(110 5)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 28.5) rotate(270)">CYCLE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4.5 -1)">STOP</text>
+ <g transform="translate(0 2)"><svg id="LOOP_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">LOOP</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 168)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 32.5) rotate(270)">OFF</text>
+ <g transform="translate(20 0)"><svg id="OFF_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 36)"><svg id="OFF_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(102 4)">
+ <rect class="output-background" width="30" height="40" rx="5"/>
+ <g transform="translate(3 3)"><svg id="TRIGGER_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">END</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 224)">
+ <g transform="translate(75 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(48 7.1) rotate(90)">ENV</text>
+ <g transform="translate(-1.7 0)"><svg id="ENV_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 4)">
+ <rect class="output-background" width="58" height="40" rx="5"/>
+ <g transform="translate(2.5 3)"><svg id="ENV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">ENV</text>
+ <g transform="translate(31.5 3)"><svg id="INV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(35 36)">INV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 280)">
+ <g transform="translate(75 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(48 -2.5) rotate(90)">SIGNAL</text>
+ <g transform="translate(-1.7 0)"><svg id="SIGNAL_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 4)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <rect class="output-background" width="20" height="40" rx="5" transform="translate(38)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(29)"/>
+ <g transform="translate(2.5 3)"><svg id="SIGNAL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 36)">IN</text>
+ <g transform="translate(31.5 3)"><svg id="SIGNAL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33 36)">OUT</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="scale(0.75) translate(14 19)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(14 94)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(14 169)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(14 243)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(85 318)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(85 392.5)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/ShaperPlus-lowcontrast-pp.svg b/res-pp/ShaperPlus-lowcontrast-pp.svg
@@ -0,0 +1,676 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="225.0" height="380.0" viewBox="0 0 225.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="225.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 224.0,1 224.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 224.5,0.5 224.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 225.0,0 225.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(112.5 19)">SHAPER+</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(112.5 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(97.0 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(149 26)">
+ <rect class="input-background" width="30" height="322" rx="5"/>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8 10)">CV</text>
+ </g>
+ <g class="io-group" transform="translate(186 26)">
+ <rect class="output-background" width="30" height="211" rx="5"/>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(2 10)">GATE</text>
+ </g>
+
+ <g transform="translate(9 33)">
+ <g transform="translate(0 0)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 43.5) rotate(270)">ATTACK</text>
+ <g transform="translate(20 0)"><svg id="ATTACK_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 47)"><svg id="ATTACK_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(74 4)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <g transform="translate(6 6)"><svg id="TRIGGER_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(31 3)"><svg id="TRIGGER_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">TRIGGER</text>
+ </g>
+ <g transform="translate(143 7)"><svg id="ATTACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="ATTACK_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 56)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 28) rotate(270)">ON</text>
+ <g transform="translate(20 0)"><svg id="ON_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 32)"><svg id="ON_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(110 5)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 28.5) rotate(270)">SPEED</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(2 -1)">1X</text>
+ <g transform="translate(0 2)"><svg id="SPEED_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1 34)">10X</text>
+ </g>
+ <g transform="translate(143 7)"><svg id="ON_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="ON_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 112)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 40.5) rotate(270)">DECAY</text>
+ <g transform="translate(20 0)"><svg id="DECAY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 44)"><svg id="DECAY_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(110 5)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-8 28.5) rotate(270)">CYCLE</text>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4.5 -1)">STOP</text>
+ <g transform="translate(0 2)"><svg id="LOOP_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-4 34)">LOOP</text>
+ </g>
+ <g transform="translate(143 7)"><svg id="DECAY_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="DECAY_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 168)">
+ <g transform="translate(0 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(8 32.5) rotate(270)">OFF</text>
+ <g transform="translate(20 0)"><svg id="OFF_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 36)"><svg id="OFF_LIGHT">
+ <rect width="3.2" height="3.2" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(143 7)"><svg id="OFF_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 7)"><svg id="OFF_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 224)">
+ <g transform="translate(75 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(48 7.1) rotate(90)">ENV</text>
+ <g transform="translate(-1.7 0)"><svg id="ENV_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 4)">
+ <rect class="output-background" width="58" height="40" rx="5"/>
+ <g transform="translate(2.5 3)"><svg id="ENV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">ENV</text>
+ <g transform="translate(31.5 3)"><svg id="INV_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(35 36)">INV</text>
+ </g>
+ <g transform="translate(143 7)"><svg id="ENV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g class="io-group" transform="translate(177 4)">
+ <rect class="output-background" width="30" height="40" rx="5"/>
+ <g transform="translate(3 3)"><svg id="TRIGGER_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(6 36)">END</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 280)">
+ <g transform="translate(75 0)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(48 -2.5) rotate(90)">SIGNAL</text>
+ <g transform="translate(-1.7 0)"><svg id="SIGNAL_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 4)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <rect class="output-background" width="20" height="40" rx="5" transform="translate(38)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(29)"/>
+ <g transform="translate(2.5 3)"><svg id="SIGNAL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 36)">IN</text>
+ <g transform="translate(31.5 3)"><svg id="SIGNAL_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33 36)">OUT</text>
+ </g>
+ <g transform="translate(143 7)"><svg id="SIGNALCV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="scale(0.75) translate(14 19)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(14 94)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(14 169)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(14 243)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-172.92) translate(30 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-145.13) translate(30 0)">
+ <g transform="translate(2 0) rotate(145.13)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">1</text>
+ </g>
+ </g>
+ <g transform="rotate(-105.84) translate(30 0)">
+ <g transform="translate(2 0) rotate(105.84)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">2</text>
+ </g>
+ </g>
+ <g transform="rotate(-75.68) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-50.26) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-27.87) translate(30 0)">
+ <g transform="translate(2 0) rotate(27.87)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">5</text>
+ </g>
+ </g>
+ <g transform="rotate(-7.62) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(11) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(28.33) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(44.6) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(85 318)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="scale(0.75) translate(85 392.5)">
+ <g transform="translate(50.5 50.5)">
+ <g transform="rotate(-240) translate(30 0)">
+ <g transform="translate(2 0) rotate(240)">
+ <text font-size="7pt" transform="translate(-2.8 3.3)">0</text>
+ </g>
+ </g>
+ <g transform="rotate(-210) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(30 0)">
+ <polyline points="0,0 5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(30 0)">
+ <polyline points="0,0 4,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(30 0)">
+ <g transform="translate(2 0) rotate(-60)">
+ <text font-size="7pt" transform="translate(-5.3 3.3)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Sine-lowcontrast-pp.svg b/res-pp/Sine-lowcontrast-pp.svg
@@ -0,0 +1,289 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-frequency-sine" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-240) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-206.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-173.33) translate(15 0)"/>
+
+ <g transform="rotate(-140) translate(14 0)">
+ <polyline points="0,0 2.5,0" stroke-width="1.0" transform="translate(0 0)"/>
+ <text font-size="5.0pt" transform="translate(5 0) rotate(140) translate(-5.5 0)">OV</text>
+ </g>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-106.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-73.33) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-40) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-6.67) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(26.67) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">SINE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 25)">
+
+ <g transform="translate(9.5 2)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-sine" transform="translate(0 -7.5)" href="#dial-frequency-sine"/>
+ </g>
+
+ <g transform="translate(0 63)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 6.1)">SLOW</text>
+ <g transform="translate(31 -1)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 83)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(16 0)">FM</text>
+ <g transform="translate(14.5 9.5)"><svg id="FM_DEPTH_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 125)">
+
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6 0)">PHASE</text>
+ <g transform="translate(14.5 9.5)"><svg id="PHASE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.2 -2.5)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 158)">
+
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 133)"/>
+ <rect class="input-background" width="34" height="140" rx="5"/>
+ <g transform="translate(5 3)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3.5 35)">V/OCT</text>
+ <g transform="translate(5 38)"><svg id="FM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 70)">FM</text>
+ <g transform="translate(5 73)"><svg id="PHASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(2.5 105)">PHASE</text>
+ <g transform="translate(5 108)"><svg id="SYNC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 140)">SYNC</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 146)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Slew-lowcontrast-pp.svg b/res-pp/Slew-lowcontrast-pp.svg
@@ -0,0 +1,286 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-time-slew" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-172.92) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-145.13) translate(17 0) rotate(145.13) translate(-2.5 2.2)">1</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-75.68) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(-27.87) translate(17 0) rotate(27.87) translate(-2 2.2)">5</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(19.81) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">10</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-rise-shape-slew" viewBox="0 0 45px 45px">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-52.5) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-15) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(22.5) translate(10 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-127.5) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-165) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-202.5) translate(10 0)"/>
+
+ <path d="M -3.5 0 Q 0 3.5, 3.5 0" stroke-width="1" stroke="#b3b3b3" fill="none" transform="rotate(60) translate(13 0) rotate(-60) translate(2 0) rotate(-45) translate(0 0)"/>
+ <polyline points="-3.5,0 3.5,0" stroke-width="1" fill="none" transform="rotate(-90) translate(13 0) rotate(90) rotate(-45) translate(0 0)"/>
+ <path d="M -3.5 0 Q 0 3.5, 3.5 0" stroke-width="1" stroke="#b3b3b3" fill="none" transform="rotate(-240) translate(13 0) rotate(240) translate(-2 0) rotate(135) translate(0 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-fall-shape-slew" viewBox="0 0 45px 45px">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-52.5) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-15) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(22.5) translate(10 0)"/>
+
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-127.5) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-165) translate(10 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-202.5) translate(10 0)"/>
+
+ <path d="M -3.5 0 Q 0 3.5, 3.5 0" stroke-width="1" stroke="#b3b3b3" fill="none" transform="rotate(60) translate(13 0) rotate(-60) translate(2 0) rotate(-135) translate(0 0)"/>
+ <polyline points="-3.5,0 3.5,0" stroke-width="1" fill="none" transform="rotate(-90) translate(13 0) rotate(90) rotate(45) translate(0 0)"/>
+ <path d="M -3.5 0 Q 0 3.5, 3.5 0" stroke-width="1" stroke="#b3b3b3" fill="none" transform="rotate(-240) translate(13 0) rotate(240) translate(-2 0) rotate(45) translate(0 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">SLEW</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(11 0)">RISE</text>
+ <g transform="translate(9.5 9)"><svg id="RISE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-time-slew" transform="translate(0 -1)" href="#dial-time-slew"/>
+ <g transform="translate(14.5 51)"><svg id="RISE_SHAPE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-rise-shape-slew" transform="translate(2.5 39)" href="#dial-rise-shape-slew"/>
+ <g class="io-group" transform="translate(7.5 77)">
+ <rect class="input-background" width="30" height="30" rx="5"/>
+ <g transform="translate(3 3)"><svg id="RISE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ </g>
+
+ <g transform="translate(0 146)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(11 0)">FALL</text>
+ <g transform="translate(9.5 9)"><svg id="FALL_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-time-slew" transform="translate(0 -1)" href="#dial-time-slew"/>
+ <g transform="translate(14.5 51)"><svg id="FALL_SHAPE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-fall-shape-slew" transform="translate(2.5 39)" href="#dial-fall-shape-slew"/>
+ <g class="io-group" transform="translate(7.5 77)">
+ <rect class="input-background" width="30" height="30" rx="5"/>
+ <g transform="translate(3 3)"><svg id="FALL_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ </g>
+
+ <g transform="translate(0 260)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Stack-lowcontrast-pp.svg b/res-pp/Stack-lowcontrast-pp.svg
@@ -0,0 +1,332 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-octave-stack" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-180) translate(10 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(180) translate(-4 2.2)">-3</text>
+ </g>
+ <g transform="rotate(-150) translate(11 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(11 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(10 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(11 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(11 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(10 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(0) translate(-2.2 2.2)">3</text>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-interval-stack" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-212.73) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-185.45) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-158.18) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-130.91) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(130.91) translate(-2.2 2.2)">4</text>
+ </g>
+ <g transform="rotate(-103.64) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-76.36) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-49.09) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(49.09) translate(-2.2 2.2)">7</text>
+ </g>
+ <g transform="rotate(-21.82) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(5.45) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(32.73) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(-60) translate(-4 2.2)">11</text>
+ </g>
+ </g>
+ </symbol>
+
+ <symbol id="dial-fine-stack" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(10 0)">
+
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(240) translate(-1.5 2.2)">-</text>
+ </g>
+ <g transform="rotate(-90) translate(10 0)">
+
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-1.9 2.2)">0</text>
+ </g>
+ <g transform="rotate(60) translate(10 0)">
+
+ <text font-size="5.0pt" transform="translate(2.5 0) rotate(-60) translate(-1.9 2.2)">+</text>
+ </g>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">STACK</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(6.4 0)">SEMIS</text>
+ <g transform="translate(9.5 7.5)"><svg id="SEMIS_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-interval-stack" transform="translate(0 -2)" href="#dial-interval-stack"/>
+ </g>
+
+ <g transform="translate(0 77)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(2.2 0)">OCTAVE</text>
+ <g transform="translate(14.5 9.5)"><svg id="OCTAVE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-octave-stack" transform="translate(0 -5)" href="#dial-octave-stack"/>
+ </g>
+
+ <g transform="translate(0 117)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(11 0)">FINE</text>
+ <g transform="translate(14.5 9.5)"><svg id="FINE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-fine-stack" transform="translate(0 -5)" href="#dial-fine-stack"/>
+ </g>
+
+ <g class="io-group" transform="translate(5.5 154)">
+ <rect class="input-background" width="34" height="50" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ <g transform="translate(1.5 39)">
+ <text class="input-label" font-size="5pt" letter-spacing="0.75px" transform="translate(0 6)">QNTZ</text>
+ <g transform="translate(22 -1)"><svg id="QUANTIZE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="translate(0 212)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3 35)">V/OCT</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="72" rx="5"/>
+ <g transform="translate(5 0)"><svg id="THRU_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 32)">THRU</text>
+ <g transform="translate(5 36)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 68)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Sums-lowcontrast-pp.svg b/res-pp/Sums-lowcontrast-pp.svg
@@ -0,0 +1,228 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">SUMS</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g class="io-group" transform="translate(7.5 18)">
+ <rect class="input-background" width="34" height="63.5" rx="5" transform="translate(-2 0)"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(-2 53.5)"/>
+ <g transform="translate(3 5)"><svg id="A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(3 35)"><svg id="B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(7.5 82)">
+ <rect class="output-background" width="34" height="163" rx="5" transform="translate(-2 0)"/>
+ <rect class="output-background-filler" width="34" height="10" transform="translate(-2 0)"/>
+ <g transform="translate(3 4)"><svg id="SUM_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.3 37)">SUM</text>
+ <g transform="translate(3 44)"><svg id="DIFFERENCE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5 77)">DIFF</text>
+ <g transform="translate(3 84)"><svg id="MAX_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 117)">MAX</text>
+ <g transform="translate(3 124)"><svg id="MIN_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(6.5 157)">MIN</text>
+ </g>
+
+ <g transform="translate(0 258)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 22)"/>
+ <rect class="input-background" width="34" height="32" rx="5"/>
+ <g transform="translate(5 4)"><svg id="NEGATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(5.5 35)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 2)"><svg id="NEGATE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 34)">NEG</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Switch-lowcontrast-pp.svg b/res-pp/Switch-lowcontrast-pp.svg
@@ -0,0 +1,262 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">SWTCH</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="62" rx="5"/>
+ <g transform="translate(8 4)"><svg id="GATE_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 26)"><svg id="GATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 58)">GATE</text>
+ </g>
+
+ <g transform="translate(4.5 67)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 6)">LATCH</text>
+ <g transform="translate(27 -1)"><svg id="LATCH_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 79)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="74" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 64)"/>
+ <g transform="translate(5 3)"><svg id="HIGH1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(11.0 35)">HIGH</text>
+ <g transform="translate(2 29.3)"><svg id="HIGH1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(5.5 36)">
+ <g transform="translate(5 3)"><svg id="LOW1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.0 35)">LOW</text>
+ <g transform="translate(2 29.3)"><svg id="LOW1_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(5.5 77)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 196)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="74" rx="5"/>
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 64)"/>
+ <g transform="translate(5 3)"><svg id="HIGH2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(11.0 35)">HIGH</text>
+ <g transform="translate(2 29.3)"><svg id="HIGH2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g transform="translate(5.5 36)">
+ <g transform="translate(5 3)"><svg id="LOW2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11.0 35)">LOW</text>
+ <g transform="translate(2 29.3)"><svg id="LOW2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(5.5 77)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Switch1616-lowcontrast-pp.svg b/res-pp/Switch1616-lowcontrast-pp.svg
@@ -0,0 +1,1833 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="330.0" height="380.0" viewBox="0 0 330.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="330.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 329.0,1 329.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 329.5,0.5 329.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 330.0,0 330.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(165.0 19)">SWITCH1616</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(165.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(149.5 -5)"/>
+ </g>
+
+
+ <rect class="input-background" width="56" height="302" rx="5" transform="translate(5.5 9)"/>
+ <rect class="output-background" width="302" height="56" rx="5" transform="translate(22.5 302)"/>
+ <rect class="input-background" width="28" height="10" rx="5" transform="translate(10.5 301)"/>
+ <rect class="input-background-filler" width="10" height="5" transform="translate(36.5 302)"/>
+ <rect class="output-background" width="28" height="10" rx="5" transform="translate(38.5 302)"/>
+
+ <g class="io-group" transform="translate(5.5 9)">
+ <g transform="translate(4 22)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 34)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 36.5)">2</text>
+ <g transform="translate(4 58)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 70)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 72.5)">4</text>
+ <g transform="translate(4 94)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 106)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 108.5)">6</text>
+ <g transform="translate(4 130)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 142)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 144.5)">8</text>
+ <g transform="translate(4 166)"><svg id="IN10_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 178)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 180.5)">10</text>
+ <g transform="translate(4 202)"><svg id="IN12_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 214)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 216.5)">12</text>
+ <g transform="translate(4 238)"><svg id="IN14_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 250)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 252.5)">14</text>
+ <g transform="translate(4 274)"><svg id="IN16_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(31 286)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(37 288.5)">16</text>
+
+ <g transform="translate(28 4)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 16)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(16 18.5)">1</text>
+ <g transform="translate(28 40)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 52)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(16 54.5)">3</text>
+ <g transform="translate(28 76)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 88)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(16 90.5)">5</text>
+ <g transform="translate(28 112)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 124)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(16 126.5)">7</text>
+ <g transform="translate(28 148)"><svg id="IN9_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 160)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(16 162.5)">9</text>
+ <g transform="translate(28 184)"><svg id="IN11_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 196)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(11 198.5)">11</text>
+ <g transform="translate(28 220)"><svg id="IN13_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 232)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(11 234.5)">13</text>
+ <g transform="translate(28 256)"><svg id="IN15_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="input-label" points="0,0 3,0" stroke-width="1" fill="none" transform="translate(22 268)"/>
+ <text class="input-label" font-size="5pt" letter-spacing="1px" transform="translate(11 270.5)">15</text>
+
+
+
+
+
+
+
+
+
+ </g>
+
+ <g class="io-group" transform="translate(22.5 302)">
+ <g transform="translate(4 28)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(16 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(13.7 19)">A</text>
+ <g transform="translate(40 28)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(52 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(49.7 19)">C</text>
+ <g transform="translate(76 28)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(88 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(85.9 19)">E</text>
+ <g transform="translate(112 28)"><svg id="OUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(124 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(121.7 19)">G</text>
+ <g transform="translate(148 28)"><svg id="OUT9_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(160 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(159 19)">I</text>
+ <g transform="translate(184 28)"><svg id="OUT11_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(196 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(193.8 19)">K</text>
+ <g transform="translate(220 28)"><svg id="OUT13_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(232 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(229.05 19)">M</text>
+ <g transform="translate(256 28)"><svg id="OUT15_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(268 22)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(265.7 19)">O</text>
+
+ <g transform="translate(22 4)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(34 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(32 42)">B</text>
+ <g transform="translate(58 4)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(70 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(68 42)">D</text>
+ <g transform="translate(94 4)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(106 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(104 42)">F</text>
+ <g transform="translate(130 4)"><svg id="OUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(142 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(139.65 42)">H</text>
+ <g transform="translate(166 4)"><svg id="OUT10_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(178 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(176 42)">J</text>
+ <g transform="translate(202 4)"><svg id="OUT12_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(214 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(212 42)">L</text>
+ <g transform="translate(238 4)"><svg id="OUT14_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(250 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(247.6 42)">N</text>
+ <g transform="translate(274 4)"><svg id="OUT16_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <polyline class="output-label" points="0,0 0,3" stroke-width="1" fill="none" transform="translate(286 31)"/>
+ <text class="output-label" font-size="5pt" letter-spacing="1px" transform="translate(283.8 42)">P</text>
+ </g>
+
+ <g transform="translate(62 32)">
+
+
+
+ <g transform="translate(20 0) translate(7.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_1_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_1_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_1_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_1_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_1_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_1_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_1_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_1_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_1_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_1_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_1_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_1_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_1_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_1_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_1_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(7.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_1_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(22.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_2_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_2_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_2_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_2_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_2_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_2_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_2_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_2_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_2_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_2_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_2_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_2_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_2_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_2_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_2_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(22.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_2_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(37.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_3_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_3_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_3_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_3_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_3_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_3_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_3_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_3_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_3_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_3_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_3_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_3_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_3_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_3_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_3_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(37.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_3_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(52.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_4_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_4_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_4_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_4_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_4_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_4_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_4_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_4_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_4_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_4_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_4_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_4_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_4_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_4_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_4_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(52.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_4_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(67.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_5_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_5_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_5_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_5_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_5_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_5_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_5_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_5_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_5_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_5_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_5_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_5_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_5_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_5_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_5_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(67.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_5_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(82.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_6_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_6_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_6_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_6_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_6_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_6_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_6_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_6_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_6_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_6_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_6_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_6_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_6_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_6_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_6_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(82.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_6_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(97.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_7_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_7_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_7_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_7_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_7_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_7_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_7_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_7_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_7_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_7_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_7_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_7_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_7_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_7_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_7_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(97.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_7_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(112.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_8_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_8_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_8_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_8_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_8_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_8_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_8_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_8_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_8_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_8_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_8_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_8_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_8_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_8_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_8_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(112.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_8_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(127.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_9_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_9_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_9_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_9_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_9_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_9_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_9_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_9_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_9_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_9_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_9_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_9_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_9_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_9_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_9_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(127.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_9_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(142.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_10_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_10_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_10_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_10_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_10_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_10_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_10_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_10_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_10_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_10_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_10_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_10_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_10_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_10_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_10_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(142.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_10_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(157.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_11_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_11_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_11_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_11_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_11_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_11_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_11_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_11_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_11_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_11_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_11_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_11_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_11_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_11_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_11_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(157.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_11_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(172.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_12_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_12_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_12_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_12_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_12_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_12_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_12_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_12_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_12_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_12_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_12_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_12_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_12_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_12_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_12_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(172.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_12_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(187.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_13_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_13_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_13_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_13_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_13_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_13_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_13_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_13_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_13_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_13_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_13_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_13_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_13_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_13_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_13_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(187.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_13_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(202.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_14_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_14_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_14_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_14_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_14_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_14_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_14_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_14_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_14_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_14_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_14_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_14_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_14_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_14_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_14_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(202.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_14_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(217.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_15_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_15_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_15_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_15_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_15_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_15_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_15_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_15_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_15_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_15_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_15_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_15_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_15_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_15_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_15_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(217.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_15_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(20 0) translate(232.5 7.5) translate(-4.5 -4.5)"><svg id="MIX_16_1_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 22.5) translate(-4.5 -4.5)"><svg id="MIX_16_2_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 37.5) translate(-4.5 -4.5)"><svg id="MIX_16_3_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 52.5) translate(-4.5 -4.5)"><svg id="MIX_16_4_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 67.5) translate(-4.5 -4.5)"><svg id="MIX_16_5_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 82.5) translate(-4.5 -4.5)"><svg id="MIX_16_6_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 97.5) translate(-4.5 -4.5)"><svg id="MIX_16_7_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 112.5) translate(-4.5 -4.5)"><svg id="MIX_16_8_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 127.5) translate(-4.5 -4.5)"><svg id="MIX_16_9_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 142.5) translate(-4.5 -4.5)"><svg id="MIX_16_10_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 157.5) translate(-4.5 -4.5)"><svg id="MIX_16_11_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 172.5) translate(-4.5 -4.5)"><svg id="MIX_16_12_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 187.5) translate(-4.5 -4.5)"><svg id="MIX_16_13_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 202.5) translate(-4.5 -4.5)"><svg id="MIX_16_14_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 217.5) translate(-4.5 -4.5)"><svg id="MIX_16_15_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ <g transform="translate(20 0) translate(232.5 232.5) translate(-4.5 -4.5)"><svg id="MIX_16_16_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 10.5)">1</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 7.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 25.5)">2</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 22.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 40.5)">3</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 37.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 55.5)">4</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 52.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 70.5)">5</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 67.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 85.5)">6</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 82.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 100.5)">7</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 97.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 115.5)">8</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 112.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(10.5 130.5)">9</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 127.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 145.5)">10</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 142.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 160.5)">11</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 157.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 175.5)">12</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 172.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 190.5)">13</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 187.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 205.5)">14</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 202.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 220.5)">15</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 217.5)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(4 235.5)">16</text>
+ <polyline points="0,0 3,0" stroke-width="1" fill="none" transform="translate(16.5 232.5)"/>
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(24.5 252)">A</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(27.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(39.9 252)">B</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(42.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(54.7 252)">C</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(57.7 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(69.8 252)">D</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(72.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(84.7 252)">E</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(87.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(99.8 252)">F</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(102.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(114.7 252)">G</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(117.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(129.6 252)">H</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(132.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(146.1 252)">I</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(147.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(159.8 252)">J</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(162.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(174.9 252)">K</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(177.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(190 252)">L</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(192.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(204.1 252)">M</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(207.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(219.5 252)">N</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(222.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(234.7 252)">O</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(237.5 240)"/>
+ <text font-size="6pt" letter-spacing="1px" transform="translate(249.8 252)">P</text>
+ <polyline points="0,0 0,3" stroke-width="1" fill="none" transform="translate(252.5 240)"/>
+ </g>
+</svg>
diff --git a/res-pp/Switch44-lowcontrast-pp.svg b/res-pp/Switch44-lowcontrast-pp.svg
@@ -0,0 +1,372 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="3.0px" text-anchor="middle" transform="translate(75.0 19)">SWITCH44</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(13.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1A</text>
+ <g transform="translate(4.5 17)"><svg id="MIX11_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(13.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2A</text>
+ <g transform="translate(4.5 17)"><svg id="MIX21_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(13.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3A</text>
+ <g transform="translate(4.5 17)"><svg id="MIX31_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(13.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4A</text>
+ <g transform="translate(4.5 17)"><svg id="MIX41_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(45.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1B</text>
+ <g transform="translate(4.5 17)"><svg id="MIX12_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(45.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2B</text>
+ <g transform="translate(4.5 17)"><svg id="MIX22_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(45.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3B</text>
+ <g transform="translate(4.5 17)"><svg id="MIX32_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(45.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4B</text>
+ <g transform="translate(4.5 17)"><svg id="MIX42_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(77.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1C</text>
+ <g transform="translate(4.5 17)"><svg id="MIX13_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(77.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2C</text>
+ <g transform="translate(4.5 17)"><svg id="MIX23_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(77.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3C</text>
+ <g transform="translate(4.5 17)"><svg id="MIX33_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(77.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4C</text>
+ <g transform="translate(4.5 17)"><svg id="MIX43_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(109.5 42.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">1D</text>
+ <g transform="translate(4.5 17)"><svg id="MIX14_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(109.5 99)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">2D</text>
+ <g transform="translate(4.5 17)"><svg id="MIX24_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(109.5 155)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">3D</text>
+ <g transform="translate(4.5 17)"><svg id="MIX34_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(109.5 211)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(7.5 6)">4D</text>
+ <g transform="translate(4.5 17)"><svg id="MIX44_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="130" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background" width="130" height="44" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background-filler" width="130" height="10" transform="translate(10 34)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">1</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">2</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">3</text>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(12.4 40)">4</text>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.2 40)">A</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.5 40)">B</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.3 40)">C</text>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(12.3 40)">D</text>
+ </g>
+ </g>
+ </g>
+
+
+
+
+
+</svg>
diff --git a/res-pp/Switch88-lowcontrast-pp.svg b/res-pp/Switch88-lowcontrast-pp.svg
@@ -0,0 +1,739 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="330.0" height="380.0" viewBox="0 0 330.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="330.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 329.0,1 329.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 329.5,0.5 329.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 330.0,0 330.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(165.0 19)">SWITCH88</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(165.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(149.5 -5)"/>
+ </g>
+
+
+ <g class="io-group" transform="translate(5.5 25)">
+ <rect class="input-background" width="34" height="293" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 42)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 79)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 116)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 153)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 190)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 227)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 264)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(46.5 323)">
+ <rect class="output-background" width="278.5" height="34" rx="5" transform="translate(0 0)"/>
+ <g transform="translate(5 5)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(40 5)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(75 5)"><svg id="OUT3_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(110 5)"><svg id="OUT4_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(145 5)"><svg id="OUT5_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(180 5)"><svg id="OUT6_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(215 5)"><svg id="OUT7_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(250 5)"><svg id="OUT8_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(50 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX11_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX21_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX31_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX41_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX51_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX61_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX71_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(50 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX81_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(85 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX12_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX22_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX32_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX42_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX52_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX62_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX72_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(85 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX82_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(120 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX13_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX23_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX33_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX43_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX53_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX63_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX73_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(120 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX83_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(155 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX14_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX24_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX34_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX44_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX54_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX64_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX74_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(155 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX84_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(190 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX15_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX25_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX35_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX45_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX55_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX65_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX75_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(190 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX85_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(225 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX16_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX26_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX36_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX46_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX56_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX66_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX76_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(225 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX86_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(260 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX17_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX27_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX37_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX47_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX57_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX67_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX77_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(260 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX87_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(295 24)">
+ <g transform="translate(4.5 9)"><svg id="MIX18_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 61)">
+ <g transform="translate(4.5 9)"><svg id="MIX28_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 98)">
+ <g transform="translate(4.5 9)"><svg id="MIX38_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 135)">
+ <g transform="translate(4.5 9)"><svg id="MIX48_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 172)">
+ <g transform="translate(4.5 9)"><svg id="MIX58_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 209)">
+ <g transform="translate(4.5 9)"><svg id="MIX68_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 246)">
+ <g transform="translate(4.5 9)"><svg id="MIX78_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(295 283)">
+ <g transform="translate(4.5 9)"><svg id="MIX88_PARAM">
+ <g transform="translate(9 9)">
+ <circle cx="0" cy="0" r="8.5" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+</svg>
diff --git a/res-pp/Test-lowcontrast-pp.svg b/res-pp/Test-lowcontrast-pp.svg
@@ -0,0 +1,360 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">test</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 10)">
+
+ <g transform="translate(9.5 3.5)"><svg id="PARAM1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -6)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 50)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 95)">
+
+ <g transform="translate(9.5 3.5)"><svg id="PARAM2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -6)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 135)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 180)">
+
+ <g transform="translate(9.5 3.5)"><svg id="PARAM3_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -6)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 220)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 265)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Test2-lowcontrast-pp.svg b/res-pp/Test2-lowcontrast-pp.svg
@@ -0,0 +1,536 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="90.0" height="380.0" viewBox="0 0 90.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="90.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 89.0,1 89.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 89.5,0.5 89.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 90.0,0 90.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="9pt" letter-spacing="3px" text-anchor="end" transform="translate(85.0 17)">TEST2</text>
+ <g transform="translate(5.5 374)">
+ <text class="brand" font-size="6.5pt" letter-spacing="2px">BOGAUDIO</text>
+ <rect class="background-fill" width="1.5" height="2" fill="#ddd" transform="translate(21 -4)"/>
+ </g>
+
+
+ <g transform="translate(0 30)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">P1A</text>
+ <g transform="translate(9.5 8.5)"><svg id="PARAM1A_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 75)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 130)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">P2A</text>
+ <g transform="translate(9.5 8.5)"><svg id="PARAM2A_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 175)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 230)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">P3A</text>
+ <g transform="translate(9.5 8.5)"><svg id="PARAM3A_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(0 275)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV3A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(45 30)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">P1B</text>
+ <g transform="translate(9.5 8.5)"><svg id="PARAM1B_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(45 75)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(45 130)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">P2B</text>
+ <g transform="translate(9.5 8.5)"><svg id="PARAM2B_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(45 175)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(45 230)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(5.5 0)">P3B</text>
+ <g transform="translate(9.5 8.5)"><svg id="PARAM3B_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(240) translate(-2.2 2.2)">0</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-4 2.2)">10</text>
+ </g>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(45 275)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV3B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(5.5 320)">
+ <g class="io-group" transform="translate(0 0)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(45 0)">
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 35)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/TestExpanderBase-lowcontrast-pp.svg b/res-pp/TestExpanderBase-lowcontrast-pp.svg
@@ -0,0 +1,187 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">TEB</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 245)">
+ <g transform="translate(10 0.5)"><svg id="COM_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(19 6)">COM</text>
+ </g>
+
+ <g transform="translate(0 260)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 28)"/>
+ <rect class="input-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/TestExpanderExtension-lowcontrast-pp.svg b/res-pp/TestExpanderExtension-lowcontrast-pp.svg
@@ -0,0 +1,175 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">TEE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 280)">
+ <g transform="translate(10 0.5)"><svg id="COM_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(19 6)">COM</text>
+ </g>
+
+ <g transform="translate(0 260)">
+ <g class="io-group" transform="translate(5.5 41)">
+ <rect class="output-background" width="34" height="38" rx="5" transform="translate(0 -3)"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/TestVCF-lowcontrast-pp.svg b/res-pp/TestVCF-lowcontrast-pp.svg
@@ -0,0 +1,350 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="180.0" height="380.0" viewBox="0 0 180.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-cutoff-testvcf" viewBox="0 0 50px 50px">
+ <g transform="translate(25 25)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(24 0) rotate(240) translate(-4 3)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-180) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-120) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-60) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(0) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(22 0)"/>
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(60) translate(22 0)"/>
+ </g>
+ </symbol>
+
+ <symbol id="dial-resonance-testvcf" viewBox="0 0 50px 50px">
+ <g transform="translate(25 25)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(24 0) rotate(240) translate(-4 3)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-180) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-120) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-60) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(0) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(22 0)"/>
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(60) translate(22 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="180.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 179.0,1 179.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 179.5,0.5 179.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 180.0,0 180.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(90.0 19)">VCF</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(90.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(74.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(20 50)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(9 45) rotate(270)">CUTOFF</text>
+ <g transform="translate(20 0)"><svg id="CUTOFF_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-cutoff-testvcf" transform="translate(14 -6)" href="#dial-cutoff-testvcf"/>
+ </g>
+
+ <g transform="translate(20 120)">
+
+ <text font-size="8pt" letter-spacing="1px" transform="translate(9 45) rotate(270)">RES/BW</text>
+ <g transform="translate(20 0)"><svg id="Q_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-resonance-testvcf" transform="translate(14 -6)" href="#dial-resonance-testvcf"/>
+ </g>
+
+ <g transform="translate(20 190)">
+
+ <text font-size="8pt" letter-spacing="1px" transform="translate(9 39) rotate(270)">DRIVE</text>
+ <g transform="translate(20 0)"><svg id="DRIVE_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-resonance-testvcf" transform="translate(14 -6)" href="#dial-resonance-testvcf"/>
+ </g>
+
+ <g transform="translate(20 260)">
+
+ <text font-size="8pt" letter-spacing="1px" transform="translate(9 36) rotate(270)">TOPO</text>
+ <g transform="translate(20 0)"><svg id="TOPOLOGY_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-resonance-testvcf" transform="translate(14 -6)" href="#dial-resonance-testvcf"/>
+ </g>
+
+ <g transform="translate(110 48)">
+
+ <text font-size="8pt" letter-spacing="1px" transform="translate(9 40) rotate(270)">MODE</text>
+ <g transform="translate(20 0)">
+ <g transform="translate(0 10)">
+ <g transform="translate(0 0)"><svg id="LOWPASS_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">LP</text>
+ </g>
+ <g transform="translate(21 10)">
+ <g transform="translate(0 0)"><svg id="HIGHPASS_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">HP</text>
+ </g>
+ <g transform="translate(0 20)">
+ <g transform="translate(0 0)"><svg id="BANDPASS_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">BP</text>
+ </g>
+ <g transform="translate(21 20)">
+ <g transform="translate(0 0)"><svg id="BAND_REJECT_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">BR</text>
+ </g>
+ <g transform="translate(15 29)"><svg id="MODE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g transform="translate(110 117)">
+
+ <text font-size="8pt" letter-spacing="1px" transform="translate(9 40) rotate(270)">POLES</text>
+ <g transform="translate(20 0)">
+ <g transform="translate(0 10)">
+ <g transform="translate(0 0)"><svg id="POLES_2_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">2</text>
+ </g>
+ <g transform="translate(21 10)">
+ <g transform="translate(0 0)"><svg id="POLES_4_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">4</text>
+ </g>
+ <g transform="translate(0 20)">
+ <g transform="translate(0 0)"><svg id="POLES_6_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">6</text>
+ </g>
+ <g transform="translate(21 20)">
+ <g transform="translate(0 0)"><svg id="POLES_8_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">8</text>
+ </g>
+ <g transform="translate(0 30)">
+ <g transform="translate(0 0)"><svg id="POLES_10_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">10</text>
+ </g>
+ <g transform="translate(21 30)">
+ <g transform="translate(0 0)"><svg id="POLES_12_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(8 5.7)">12</text>
+ </g>
+ <g transform="translate(15 39)"><svg id="POLES_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(45 315)">
+ <rect class="input-background" width="58" height="40" rx="5"/>
+ <rect class="output-background" width="50" height="40" rx="5" transform="translate(38)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(29)"/>
+ <g transform="translate(2.5 3)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 36)">IN</text>
+ <g transform="translate(31.5 3)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(33 36)">OUT</text>
+ <g transform="translate(60.5 3)"><svg id="OUT_B_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(70.5 36)">B</text>
+ </g>
+</svg>
diff --git a/res-pp/UMix-lowcontrast-pp.svg b/res-pp/UMix-lowcontrast-pp.svg
@@ -0,0 +1,223 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">UMIX</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 18)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 283)"/>
+ <rect class="input-background" width="34" height="293" rx="5"/>
+ <g transform="translate(5 5)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 40.5)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 76)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 111.5)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 147)"><svg id="IN5_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 182.5)"><svg id="IN6_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 218)"><svg id="IN7_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(5 252.5)"><svg id="IN8_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(5.5 283)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 1)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.5 33)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Unison-lowcontrast-pp.svg b/res-pp/Unison-lowcontrast-pp.svg
@@ -0,0 +1,269 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-detune-unison" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">0</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">50</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">UNISON</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(8 0)">CHAN</text>
+ <g transform="translate(9.5 9)"><svg id="CHANNELS_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -1)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-1.9 2.2)">1</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-220) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-200) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-180) translate(17 0) rotate(180) translate(-2 2.2)">4</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-160) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-140) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-100) translate(17 0) rotate(100) translate(-1.9 2.5)">8</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-80) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(-40) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(-20) translate(17 0) rotate(20) translate(-3 2.4)">12</text>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(20) translate(15 0)"/>
+ <polyline points="0,0 1.5,0" stroke-width="0.7" transform="rotate(40) translate(15 0)"/>
+
+ <text font-size="5.0pt" transform="rotate(60) translate(18 0) rotate(-60) translate(-1.9 2.2)">16</text>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 80)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(3.5 0)">DETUNE</text>
+ <g transform="translate(9.5 9)"><svg id="DETUNE_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-detune-unison" transform="translate(0 -1)" href="#dial-detune-unison"/>
+ <g class="io-group" transform="translate(5.5 44)">
+ <rect class="input-background" width="34" height="39" rx="5"/>
+ <g transform="translate(5 3)"><svg id="DETUNE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 171)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(3 35)">V/OCT</text>
+ <g transform="translate(5 38)"><svg id="GATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 70)">GATE</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="PITCH_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(3 32)">V/OCT</text>
+ <g transform="translate(5 35)"><svg id="GATE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(5.5 67)">GATE</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/VCA-lowcontrast-pp.svg b/res-pp/VCA-lowcontrast-pp.svg
@@ -0,0 +1,282 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">VCA</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 19)">
+ <g transform="translate(9.5 3.5)"><svg id="LEVEL1_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -6)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 57)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ <g transform="translate(5 38)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 70)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT1_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 178)">
+ <g transform="translate(9.5 3.5)"><svg id="LEVEL2_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 -6)">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 216)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 35)">CV</text>
+ <g transform="translate(5 38)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 70)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT2_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(10.5 334)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 6)">LIN</text>
+ <g transform="translate(15 -1)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+
+</svg>
diff --git a/res-pp/VCAmp-lowcontrast-pp.svg b/res-pp/VCAmp-lowcontrast-pp.svg
@@ -0,0 +1,238 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">VCAMP</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <g transform="translate(0 0)">
+ <g transform="translate(0 6.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ </g>
+ <g transform="translate(0 20.67)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">6</text>
+ </g>
+ <g transform="translate(0 34.83)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 49)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 63.17)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 91.5)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 148.17)">
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(10.5 0)"/>
+ <polyline points="0,0 6.5,0" fill="none" transform="translate(28 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 170)">
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-9 4)">dB</text>
+ </g>
+ </g>
+ <g transform="translate(13.5 0)"><svg id="LEVEL_PARAM">
+ <rect width="6" height="177" x="6" y="3" rx="2" stroke-width="1" stroke="#888" fill="#222"/>
+ <g transform="translate(0 85)">
+ <rect width="18" height="13" rx="1.5" fill="#777"/>
+ <rect width="18" height="9" x="0" y="2" fill="#444"/>
+ <polyline points="0,6.5 18,6.5" stroke="#fafafa" stroke-width="1" fill="none"/>
+ <rect width="14" height="5" x="2" y="4" rx="1.0" fill="#ddd" transform="translate(0 0)"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 210)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ <g transform="translate(5 38)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(12.5 70)">IN</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/VCF-lowcontrast-pp.svg b/res-pp/VCF-lowcontrast-pp.svg
@@ -0,0 +1,442 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-frequency-vcf" viewBox="0 0 150px 108px">
+ <g transform="translate(75 54)">
+ <g transform="rotate(-240) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(240) translate(-2 3)">0</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-225) translate(37 0)"/>
+
+ <g transform="rotate(-218.8) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(218.8) translate(-12.5 3.5)">100</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-206.5) translate(37 0)"/>
+
+ <g transform="rotate(-192.6) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(192.6) translate(-11.5 3)">500</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-181.9) translate(37 0)"/>
+
+ <g transform="rotate(-172.2) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(172.2) translate(-7.5 3)">1K</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-151.3) translate(37 0)"/>
+
+ <g transform="rotate(-133.9) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(133.9) translate(-16 3)">2.5K</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-110.1) translate(37 0)"/>
+
+ <g transform="rotate(-90) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(90) translate(-6 4)">5K</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-41.6) translate(37 0)"/>
+
+ <g transform="rotate(-56.3) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(56.3) translate(-3.5 3)">7.5K</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-72.3) translate(37 0)"/>
+
+ <g transform="rotate(-27.9) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(27.9) translate(-5 5)">10K</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-2.9) translate(37 0)"/>
+
+ <g transform="rotate(19.8) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-19.8) translate(-5 2)">15K</text>
+ </g>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(40.6) translate(37 0)"/>
+
+ <g transform="rotate(60) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-60) translate(-2.5 3)">20K</text>
+ </g>
+
+ <text font-size="7.0pt" transform="rotate(90) translate(44.5 0) rotate(-90) translate(-6.5 0)">HZ</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-slope-vcf" viewBox="0 0 50px 60px">
+ <g transform="translate(25 30)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(24 0) rotate(240) translate(-2 3)">1</text>
+ <polyline points="0,0 2,0" stroke-width="0.7" transform="rotate(-176) translate(22 0)"/>
+ <text font-size="6.0pt" transform="rotate(-149.6) translate(24 0) rotate(149.6) translate(-1.5 1)">2</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-112.1) translate(22 0)"/>
+ <text font-size="6.0pt" transform="rotate(-83.3) translate(24 0) rotate(83.3) translate(-2 2)">4</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-59.1) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-37.7) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-18.4) translate(22 0)"/>
+ <text font-size="6.0pt" transform="rotate(-0.7) translate(24 0) rotate(0.7) translate(-2 2)">8</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(15.8) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(31.4) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(46) translate(22 0)"/>
+ <text font-size="6.0pt" transform="rotate(60) translate(24 0) rotate(-60) translate(-5 3)">12</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-mode-vcf" viewBox="0 0 60px 60px">
+ <g transform="translate(30 30)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-67.5) translate(11 0)"/>
+ <text font-size="6.0pt" transform="rotate(-67.5) translate(24 0) rotate(67.5) translate(-3 7)">LP</text>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-22.5) translate(11 0)"/>
+ <text font-size="6.0pt" transform="rotate(-22.5) translate(24 0) rotate(22.5) translate(-7 5)">HP</text>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(22.5) translate(11 0)"/>
+ <text font-size="6.0pt" transform="rotate(22.5) translate(24 0) rotate(-22.5) translate(-7 0)">BP</text>
+
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(67.5) translate(11 0)"/>
+ <text font-size="6.0pt" transform="rotate(67.5) translate(24 0) rotate(-67.5) translate(-3 -1.5)">BR</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-linear-vcf" viewBox="0 0 50px 50px">
+ <g transform="translate(25 25)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(24 0) rotate(240) translate(-4 3)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-180) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-120) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-60) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(0) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(22 0)"/>
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(60) translate(22 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">VCF</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+
+
+
+
+ <g transform="translate(21 25)">
+ <g transform="translate(20 20)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(34 34)">
+ <polyline points="-10,0 10,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-10 0,10" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="33.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-frequency-vcf" transform="translate(-21 0)" href="#dial-frequency-vcf"/>
+ </g>
+
+ <g transform="translate(25 126)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(10 27) rotate(270)">CV</text>
+ <g transform="translate(20 12)"><svg id="FREQUENCY_CV_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(8 0)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(82 126)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(10 27) rotate(270)">FM</text>
+ <g transform="translate(20 12)"><svg id="FM_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(8 0)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(54 165)">
+ <text font-size="8pt" letter-spacing="2px" transform="translate(7 38) rotate(270)">MODE</text>
+ <g transform="translate(13 11)"><svg id="MODE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-mode-vcf" transform="translate(-9 -11)" href="#dial-mode-vcf"/>
+ </g>
+
+ <g transform="translate(2 220)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(13.5 43.5) rotate(270)">RES/BW</text>
+ <g transform="translate(24.5 0)"><svg id="Q_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-linear-vcf" transform="translate(18.5 -6)" href="#dial-linear-vcf"/>
+ </g>
+
+ <g transform="translate(73 220)">
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(13.4 38.5) rotate(270)">SLOPE</text>
+ <g transform="translate(24.5 0)"><svg id="SLOPE_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-slope-vcf" transform="translate(18.5 -11)" href="#dial-slope-vcf"/>
+ </g>
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="130" height="47" rx="5" transform="translate(10 44)"/>
+ <rect class="input-background" width="98" height="44" rx="5" transform="translate(26 0)"/>
+ <rect class="input-background-filler" width="98" height="10" transform="translate(26 34)"/>
+ <rect class="input-background" width="97" height="47" rx="5" transform="translate(10 44)"/>
+ <rect class="input-background-filler" width="10" height="47" transform="translate(97 44)"/>
+
+ <g transform="translate(16 0)">
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="FREQUENCY_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(9 40)">CV</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">V/OCT</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="FM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(9 40)">FM</text>
+ </g>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="IN_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(10.5 40)">IN</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="Q_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">R/BW</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="SLOPE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(7 40)">SLP</text>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1px" transform="translate(6 40)">OUT</text>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/VCM-lowcontrast-pp.svg b/res-pp/VCM-lowcontrast-pp.svg
@@ -0,0 +1,357 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-level-vcm" viewBox="0 0 60px 60px">
+ <g transform="translate(30 30)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(25 0) rotate(240) translate(-2.3 2.5)">0</text>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-210) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-180) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-150) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-120) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-90) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-60) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(-30) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(0) translate(22 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="0.7" transform="rotate(30) translate(22 0)"/>
+ <polyline points="0,0 5,0" stroke-width="1" transform="rotate(60) translate(22 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">VCM</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(0 32)">
+ <g class="io-group" transform="translate(10 1)">
+ <rect class="input-background" width="63" height="43" rx="5"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="IN1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 39)">IN</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="CV1_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8.5 39)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(89.5 3.5)"><svg id="LEVEL1_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-vcm" transform="translate(78.5 -7.5)" href="#dial-level-vcm"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(139 13.8) rotate(90)">CH1</text>
+ </g>
+
+ <g transform="translate(0 96)">
+ <g class="io-group" transform="translate(10 1)">
+ <rect class="input-background" width="63" height="43" rx="5"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="IN2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 39)">IN</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="CV2_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8.5 39)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(89.5 3.5)"><svg id="LEVEL2_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-vcm" transform="translate(78.5 -7.5)" href="#dial-level-vcm"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(139 13.8) rotate(90)">CH2</text>
+ </g>
+
+ <g transform="translate(0 160)">
+ <g class="io-group" transform="translate(10 1)">
+ <rect class="input-background" width="63" height="43" rx="5"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="IN3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 39)">IN</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="CV3_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8.5 39)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(89.5 3.5)"><svg id="LEVEL3_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-vcm" transform="translate(78.5 -7.5)" href="#dial-level-vcm"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(139 13.8) rotate(90)">CH3</text>
+ </g>
+
+ <g transform="translate(0 225)">
+ <g class="io-group" transform="translate(10 1)">
+ <rect class="input-background" width="63" height="43" rx="5"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="IN4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(10 39)">IN</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="CV4_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8.5 39)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(89.5 3.5)"><svg id="LEVEL4_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-vcm" transform="translate(78.5 -7.5)" href="#dial-level-vcm"/>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(139 13.8) rotate(90)">CH4</text>
+ </g>
+
+ <g transform="translate(0 290)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(11 30.5) rotate(-90)">MIX</text>
+ <g transform="translate(22.5 3.5)"><svg id="MIX_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-level-vcm" transform="translate(11.5 -7.5)" href="#dial-level-vcm"/>
+ <g class="io-group" transform="translate(77 0)">
+ <rect class="output-background" width="63" height="43" rx="5"/>
+ <rect class="input-background" width="31.5" height="43" rx="5"/>
+ <rect class="input-background-filler" width="5" height="43" transform="translate(26.5 0)"/>
+ <g transform="translate(1 0)">
+ <g transform="translate(3 4)"><svg id="MIX_CV_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8.5 39)">CV</text>
+ </g>
+ <g transform="translate(32 0)">
+ <g transform="translate(3 4)"><svg id="MIX_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 39)">OUT</text>
+ </g>
+ </g>
+
+ <g transform="translate(42 54)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">LINEAR</text>
+ <g transform="translate(49 -1.3)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+
+
+
+
+
+</svg>
diff --git a/res-pp/VCO-lowcontrast-pp.svg b/res-pp/VCO-lowcontrast-pp.svg
@@ -0,0 +1,494 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="150.0" height="380.0" viewBox="0 0 150.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-fm-vco" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(18 0) rotate(240) translate(-2 2)">0</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(15 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(15 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(60) translate(15 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="150.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 149.0,1 149.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 149.5,0.5 149.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 150.0,0 150.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(75.0 19)">VCO</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(75.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(59.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(21 25)">
+
+
+
+ <g transform="translate(20 20)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(34 34)">
+ <polyline points="-10,0 10,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-10 0,10" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="33.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-1 0)">
+ <g transform="translate(54 54)">
+ <g transform="rotate(-240) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(240) translate(-6 3)">-3</text>
+ </g>
+ <g transform="rotate(-220.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-206.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(206.667) translate(-5.5 3)">-2</text>
+ </g>
+ <g transform="rotate(-187.23) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-173.333) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(173.333) translate(-4 3)">-1</text>
+ </g>
+ <g transform="rotate(-153.89) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-140) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" letter-spacing="1px" transform="translate(16 0) rotate(140) translate(-6 3.5)">0V</text>
+ </g>
+ <g transform="rotate(-120.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-106.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(106.667) translate(-2.7 3)">1</text>
+ </g>
+ <g transform="rotate(-87.23) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-73.33) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(73.333) translate(-2.7 3)">2</text>
+ </g>
+ <g transform="rotate(-53.89) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-40) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(40) translate(-2.7 3)">3</text>
+ </g>
+ <g transform="rotate(-20.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-6.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(6.667) translate(-2.7 3)">4</text>
+ </g>
+ <g transform="rotate(12.77) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(26.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-26.667) translate(-2.7 3)">5</text>
+ </g>
+ <g transform="rotate(46.11) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(60) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-60) translate(-2.7 3)">6</text>
+ </g>
+ </g>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(30 135)">0V = C4 = 261.63HZ</text>
+
+
+
+ <g transform="translate(35 153)">
+
+
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(0 22) rotate(270)">FINE</text>
+ <g transform="translate(13 0)"><svg id="FINE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ <g transform="translate(36 141)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g transform="translate(73 150)">
+ <g transform="translate(0 1)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(10 6.1)">SLOW</text>
+ <g transform="translate(41 -1.3)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 14)">
+ <text font-size="6pt" letter-spacing="0.5px" transform="translate(8 6.1)">LINEAR</text>
+ <g transform="translate(41 -1.3)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+ </g>
+
+
+
+ <g transform="translate(44 188)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(10 22.5) rotate(270)">PW</text>
+ <g transform="translate(18 0)"><svg id="PW_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(52.5 178.5)">
+ <g transform="translate(22.5 22.5)">
+ <g transform="rotate(-240) translate(15 0)">
+ <text font-size="9.0pt" transform="translate(3 0) rotate(240) translate(-2.2 3.6)">-</text>
+ </g>
+ <g transform="rotate(-210) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-180) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-150) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-120) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-90) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(2 0) rotate(90) translate(-2 2)">0</text>
+ </g>
+ <g transform="rotate(-60) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(-30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(0) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(30) translate(15 0)">
+ <polyline points="0,0 2.5,0" stroke-width="0.7"/>
+ </g>
+ <g transform="rotate(60) translate(15 0)">
+ <text font-size="5.0pt" transform="translate(3 0) rotate(-60) translate(-2 2)">+</text>
+ </g>
+ </g>
+ </g>
+
+
+
+ <g transform="translate(44 230)">
+
+ <g transform="translate(0 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(10 22) rotate(270)">FM</text>
+ <g transform="translate(18 0)"><svg id="FM_PARAM">
+ <g transform="translate(13 13)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="12.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(57 -0)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1 -1)">EXP</text>
+ <g transform="translate(0 2)"><svg id="FM_TYPE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(0 34)">LIN</text>
+ </g>
+ </g>
+ <use xlink:href="#dial-fm-vco" transform="translate(52.5 220.5)" href="#dial-fm-vco"/>
+
+
+
+ <g class="io-group" transform="translate(0 269)">
+ <rect class="output-background" width="130" height="91" rx="5" transform="translate(10 0)"/>
+
+ <rect class="input-background" width="65" height="91" rx="5" transform="translate(10 0)"/>
+ <rect class="input-background-filler" width="10" height="8" transform="translate(65 0)"/>
+ <rect class="input-background-filler" width="10" height="8" transform="translate(65 83)"/>
+
+ <g transform="translate(12 0)">
+ <g transform="translate(3 5)"><svg id="PW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8 40)">PW</text>
+ </g>
+ <g transform="translate(44 0)">
+ <g transform="translate(3 5)"><svg id="FM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(8 40)">FM</text>
+ </g>
+ <g transform="translate(76 0)">
+ <g transform="translate(3 5)"><svg id="SQUARE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <polyline class="output-label" points="0,4 0,0 6,0 6,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(108 0)">
+ <g transform="translate(3 5)"><svg id="SAW_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <polyline class="output-label" points="0,8 12,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+
+ <g transform="translate(10 44)">
+ <g transform="translate(2 0)">
+ <g transform="translate(3 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(1 40)">V/OCT</text>
+ </g>
+ <g transform="translate(34 0)">
+ <g transform="translate(3 5)"><svg id="SYNC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">SYNC</text>
+ </g>
+ <g transform="translate(66 0)">
+ <g transform="translate(3 5)"><svg id="TRIANGLE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <polyline class="output-label" points="0,4 3,0 9,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ </g>
+ <g transform="translate(98 0)">
+ <g transform="translate(3 5)"><svg id="SINE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+
+ <g transform="translate(9 33.5)">
+
+ <path class="output-label" d="M 0 4 A 2 3 0 0 1 6 4" stroke-width="1" stroke="#ccc" fill="none"/>
+ <path class="output-label" d="M 6 4 A 2 3 0 0 0 12 4" stroke-width="1" stroke="#ccc" fill="none"/>
+ </g>
+ </g>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/VU-lowcontrast-pp.svg b/res-pp/VU-lowcontrast-pp.svg
@@ -0,0 +1,264 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="vu-vu" viewBox="0 0 18px 180px">
+
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 0)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 0)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 15)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 15)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 30)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 30)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 45)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 45)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 60)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 60)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 75)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 75)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 90)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 90)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 105)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 105)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 120)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 120)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 135)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 135)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 150)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 150)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(3 165)"/>
+ <rect width="5" height="13" x="0" y="1" rx="0" fill="#aaa" transform="translate(10 165)"/>
+ </symbol>
+
+ <symbol id="guide-db-vu" viewBox="0 0 20px 183px">
+ <g transform="translate(0 15)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">6</text>
+ </g>
+ <g transform="translate(0 30)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(0) translate(-2.5 2.6)">0</text>
+ </g>
+ <g transform="translate(0 45)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-4 2.2)">-6</text>
+ </g>
+ <g transform="translate(0 60)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-12</text>
+ </g>
+ <g transform="translate(0 90)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-24</text>
+ </g>
+ <g transform="translate(0 120)">
+
+
+
+ </g>
+ <g transform="translate(0 150)">
+ <polyline points="0,0 3,0" fill="none" transform="translate(11 0)"/>
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-7 2.2)">-48</text>
+ </g>
+ <g transform="translate(0 170)">
+ <text font-size="6.0pt" transform="translate(7 0) rotate(-90) translate(-9 4.5)">dB</text>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">VU</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 18)">
+ <use id="VU_WIDGET" xlink:href="#vu-vu" transform="translate(13.5 -1)" href="#vu-vu"/>
+ <use xlink:href="#guide-db-vu" transform="translate(0 -1)" href="#guide-db-vu"/>
+ </g>
+
+ <g transform="translate(0 200)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="L_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">L</text>
+ <g transform="translate(5 38)"><svg id="R_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="0.5px" transform="translate(9 70)">R (L)</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 0)"><svg id="L_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 32)">L</text>
+ <g transform="translate(5 35)"><svg id="R_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(15 67)">R</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Walk-lowcontrast-pp.svg b/res-pp/Walk-lowcontrast-pp.svg
@@ -0,0 +1,269 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">WALK</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(10 0)">RATE</text>
+ <g transform="translate(0 3.5)"><svg id="RATE_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(0 3)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 4,0" stroke-width="1.0" transform="rotate(-240) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(17 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 82)">
+ <text font-size="6pt" letter-spacing="1.5px" transform="translate(4.5 0)">OFFSET</text>
+ <g transform="translate(14.5 9)"><svg id="OFFSET_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -3)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 121)">
+ <text font-size="6pt" letter-spacing="2.0px" transform="translate(5.5 0)">SCALE</text>
+ <g transform="translate(14.5 9)"><svg id="SCALE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2.5 -3)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(0 157)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 133)"/>
+ <rect class="input-background" width="34" height="140" rx="5"/>
+ <g transform="translate(5 3)"><svg id="RATE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(6 35)">RATE</text>
+ <g transform="translate(5 38)"><svg id="OFFSET_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="1.2px" transform="translate(2 70)">OFFSET</text>
+ <g transform="translate(5 73)"><svg id="SCALE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(2.5 105)">SCALE</text>
+ <g transform="translate(5 108)"><svg id="JUMP_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(5 140)">JUMP</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 146)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">OUT</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/Walk2-lowcontrast-pp.svg b/res-pp/Walk2-lowcontrast-pp.svg
@@ -0,0 +1,421 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="210.0" height="380.0" viewBox="0 0 210.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+
+ <rect class="module-background background-fill" width="210.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 209.0,1 209.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 209.5,0.5 209.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 210.0,0 210.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(105.0 19)">WALK2</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(105.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(89.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(10 25)">
+ <svg id="DISPLAY_WIDGET">
+ <rect cx="0" cy="0" width="190" height="190" fill="#444"/>
+ </svg>
+ </g>
+
+ <g transform="translate(0 227)">
+ <g transform="translate(6 0)">
+ <text font-size="8pt" transform="translate(45 0)">X</text>
+ <polyline points="0,0 30,0" stroke-width="1" fill="none" transform="translate(13 -4)"/>
+ <polyline points="0,0 30,0" stroke-width="1" fill="none" transform="translate(53 -4)"/>
+ </g>
+ <g transform="translate(111 0)">
+ <text font-size="8pt" transform="translate(40 0)">Y</text>
+ <polyline points="0,0 30,0" stroke-width="1" fill="none" transform="translate(8 -4)"/>
+ <polyline points="0,0 30,0" stroke-width="1" fill="none" transform="translate(48 -4)"/>
+ </g>
+ </g>
+
+ <g transform="translate(12 235)">
+ <g transform="translate(-2 0)">
+ <text font-size="7pt" letter-spacing="1.5px" transform="translate(9 33.5) rotate(270)">RATE</text>
+ <g transform="translate(10 -3)"><svg id="RATE_X_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(8 -3)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 4,0" stroke-width="1.0" transform="rotate(-240) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(17 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(145.5 235)">
+ <g transform="translate(-2 0)">
+ <text font-size="7pt" letter-spacing="1.5px" transform="translate(47 5) rotate(90)">RATE</text>
+ <g transform="translate(0 -3)"><svg id="RATE_Y_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(-2 -3)">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 4,0" stroke-width="1.0" transform="rotate(-240) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(60) translate(17 0)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(105 234)">
+ <text font-size="7pt" letter-spacing="2px" transform="translate(3.3 17) rotate(270)">OFF</text>
+
+ <g transform="translate(-30 0)"><svg id="OFFSET_X_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-42 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g transform="translate(14 0)"><svg id="OFFSET_Y_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g transform="translate(105 262.5)">
+ <text font-size="7pt" letter-spacing="2px" transform="translate(3.3 17) rotate(270)">SCL</text>
+
+ <g transform="translate(-30 0)"><svg id="SCALE_X_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(-42 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g transform="translate(14 0)"><svg id="SCALE_Y_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(2 -12)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(7 281)">
+ <rect class="input-background" width="62" height="79" rx="5"/>
+ <rect class="output-background" width="22" height="40" rx="5" transform="translate(40 39)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31 39)"/>
+ <rect class="output-background-filler" width="31" height="20" transform="translate(31 39)"/>
+ <g transform="translate(3.5 3)"><svg id="OFFSET_X_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <g transform="translate(34.5 3)"><svg id="SCALE_X_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(6 36)">OFF</text>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(37.5 36)">SCL</text>
+ <g transform="translate(3.5 42)"><svg id="RATE_X_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(3.5 75)">RATE</text>
+ <g transform="translate(34.5 42)"><svg id="OUT_X_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1.5px" transform="translate(37 75)">OUT</text>
+ </g>
+
+ <g class="io-group" transform="translate(142 281)">
+ <rect class="input-background" width="62" height="79" rx="5"/>
+ <rect class="output-background" width="22" height="40" rx="5" transform="translate(40 39)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31 39)"/>
+ <rect class="output-background-filler" width="31" height="20" transform="translate(31 39)"/>
+ <g transform="translate(3.5 3)"><svg id="OFFSET_Y_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(6 36)">OFF</text>
+ <g transform="translate(34.5 3)"><svg id="SCALE_Y_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(37.5 36)">SCL</text>
+ <g transform="translate(3.5 42)"><svg id="RATE_Y_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(3.5 75)">RATE</text>
+ <g transform="translate(34.5 42)"><svg id="OUT_Y_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1.5px" transform="translate(37 75)">OUT</text>
+ </g>
+
+ <g class="io-group" transform="translate(74.5 288)">
+ <rect class="input-background" width="61" height="40" rx="5"/>
+ <rect class="output-background" width="22" height="40" rx="5" transform="translate(40)"/>
+ <rect class="output-background-filler" width="20" height="40" transform="translate(31)"/>
+ <g transform="translate(3.5 3)"><svg id="JUMP_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1.5px" transform="translate(4 36)">TRIG</text>
+ <g transform="translate(34.5 3)"><svg id="DISTANCE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="1.5px" transform="translate(35.5 36)">DIST</text>
+ </g>
+
+ <g transform="translate(96 332)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(-10 24.5) rotate(-90)">TRIG</text>
+ <g transform="translate(2 0)">
+ <g transform="translate(-7.5 1)"><svg id="JUMP_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(1 6.7)">JUMP</text>
+ </g>
+ <g transform="translate(2 10)">
+ <g transform="translate(-7.5 1)"><svg id="SAMPLEHOLD_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="0.5px" transform="translate(1 6.7)">S&H</text>
+ </g>
+ <g transform="translate(2 20)">
+ <g transform="translate(-7.5 1)"><svg id="TRACKHOLD_LIGHT">
+ <rect width="6.4" height="6.4" fill="#0f0"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="1px" transform="translate(1 6.7)">T&H</text>
+ </g>
+ <g transform="translate(26 9.7)"><svg id="JUMP_MODE_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+</svg>
diff --git a/res-pp/XCO-lowcontrast-pp.svg b/res-pp/XCO-lowcontrast-pp.svg
@@ -0,0 +1,796 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="300.0" height="380.0" viewBox="0 0 300.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-fm-xco" viewBox="0 0 50px 50px">
+ <g transform="translate(25 25)">
+ <text font-size="6.0pt" transform="rotate(-240) translate(24 0) rotate(240) translate(-4 3)">0</text>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-210) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-180) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-150) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-120) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-90) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-60) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(-30) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(0) translate(22 0)"/>
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="rotate(30) translate(22 0)"/>
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(60) translate(22 0)"/>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="300.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 299.0,1 299.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 299.5,0.5 299.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 300.0,0 300.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <text class="title" font-size="12pt" letter-spacing="4px" text-anchor="middle" transform="translate(150.0 19)">XCO</text>
+ <g transform="translate(0 374)">
+ <text class="brand" font-size="8pt" letter-spacing="2px" text-anchor="middle" transform="translate(150.0 0)">BOGAUDIO</text>
+ <rect class="background-fill" width="3" height="3" transform="translate(134.5 -5)"/>
+ </g>
+
+
+ <g transform="translate(20 25)">
+
+
+
+ <g transform="translate(20 20)"><svg id="FREQUENCY_PARAM">
+ <g transform="translate(34 34)">
+ <polyline points="-10,0 10,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-10 0,10" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="33.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(20 25)">
+ <g transform="translate(54 54)">
+ <g transform="rotate(-240) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(240) translate(-6 3)">-3</text>
+ </g>
+ <g transform="rotate(-220.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-206.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(206.667) translate(-5.5 3)">-2</text>
+ </g>
+ <g transform="rotate(-187.23) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-173.333) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(173.333) translate(-4 3)">-1</text>
+ </g>
+ <g transform="rotate(-153.89) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-140) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" letter-spacing="1px" transform="translate(16 0) rotate(140) translate(-6 3.5)">0V</text>
+ </g>
+ <g transform="rotate(-120.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-106.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(106.667) translate(-2.7 3)">1</text>
+ </g>
+ <g transform="rotate(-87.23) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-73.33) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(73.333) translate(-2.7 3)">2</text>
+ </g>
+ <g transform="rotate(-53.89) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-40) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(40) translate(-2.7 3)">3</text>
+ </g>
+ <g transform="rotate(-20.56) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(-6.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(6.667) translate(-2.7 3)">4</text>
+ </g>
+ <g transform="rotate(12.77) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(26.667) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-26.667) translate(-2.7 3)">5</text>
+ </g>
+ <g transform="rotate(46.11) translate(34 0)">
+ <polyline points="0,0 3,0" stroke-width="0.7" transform="translate(3 0)"/>
+ </g>
+
+ <g transform="rotate(60) translate(34 0)">
+ <polyline points="0,0 5,0" stroke-width="1" transform="translate(3 0)"/>
+ <text font-size="7.0pt" transform="translate(14 0) rotate(-60) translate(-2.7 3)">6</text>
+ </g>
+ </g>
+ </g>
+
+ <text font-size="6pt" letter-spacing="1px" transform="translate(30 135)">0V = C4 = 261.63HZ</text>
+
+
+ <g transform="translate(34 153)">
+
+
+
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(0 22) rotate(270)">FINE</text>
+ <g transform="translate(13 0)"><svg id="FINE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+
+ </g>
+ <g transform="translate(35 141)">
+ <g transform="translate(20 20)">
+ <polyline points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(43)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-20)"/>
+ <path d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#b3b3b3" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g transform="translate(72 158.5)">
+ <text font-size="6pt" letter-spacing="2px" transform="translate(9 6.1)">SLOW</text>
+ <g transform="translate(40 -1.3)"><svg id="SLOW_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(31 194)">
+ <g transform="translate(4 0)">
+
+ <text font-size="8pt" letter-spacing="2px" transform="translate(9 27) rotate(270)">FM</text>
+ <g transform="translate(20 0)"><svg id="FM_DEPTH_PARAM">
+ <g transform="translate(19 19)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="18.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g class="io-group" transform="translate(-19 52)">
+ <rect class="input-background" width="71" height="47" rx="5" transform="translate(10 0)"/>
+ <g transform="translate(10 0)">
+
+ <g transform="translate(7 5)"><svg id="FM_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(11 40)">FM</text>
+ </g>
+ <g transform="translate(47 0)">
+
+ <g transform="translate(3 5)"><svg id="FM_DEPTH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0 40)">DEPTH</text>
+ </g>
+ </g>
+ <g transform="translate(63 52)">
+
+ <g transform="translate(8 9)">
+ <text font-size="5pt" letter-spacing="2px" transform="translate(-1 -1)">EXP</text>
+ <g transform="translate(0 2)"><svg id="FM_TYPE_PARAM">
+ <rect width="14px" height="24px" stroke-width="1" stroke="#000" fill="#ddd"/>
+ <rect width="14px" height="12px" stroke-width="0" fill="#000"/>
+ </svg></g>
+ <text font-size="5pt" letter-spacing="2px" transform="translate(0 34)">LIN</text>
+ </g>
+ </g>
+ </g>
+ <use xlink:href="#dial-fm-xco" transform="translate(49 188)" href="#dial-fm-xco"/>
+
+
+
+
+ <rect class="output-background" width="193" height="47" rx="5" transform="translate(97 313)"/>
+
+ <g class="io-group" transform="translate(140 30)">
+ <rect class="input-background" width="30" height="330" rx="5"/>
+
+
+
+
+
+ <g transform="translate(9 6)">
+
+ <polyline class="input-label" points="0,4 0,0 6,0 6,8 12,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ <g transform="translate(3 30)">
+ <g transform="translate(4 0)"><svg id="SQUARE_PW_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(5 30)">PW</text>
+ <g transform="translate(0 35)"><svg id="SQUARE_PW_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 118)">
+ <g transform="translate(4 0)"><svg id="SQUARE_PHASE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2 30)">PHS</text>
+ <g transform="translate(0 35)"><svg id="SQUARE_PHASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 207)">
+ <g transform="translate(4 0)"><svg id="SQUARE_MIX_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2.5 30)">MIX</text>
+ <g transform="translate(0 35)"><svg id="SQUARE_MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 288)">
+ <rect class="output-background-filler" width="32" height="5" transform="translate(-1 -5)"/>
+ <rect class="output-background" width="32" height="47" rx="5" transform="translate(-1 -5)"/>
+ <g transform="translate(3 0)">
+ <g transform="translate(0 0)"><svg id="SQUARE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(2 36)">OUT</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(135 48)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(135 136)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(135 225)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(180 30)">
+ <rect class="input-background" width="30" height="330" rx="5"/>
+
+
+
+
+
+ <g transform="translate(9 6)">
+
+ <polyline class="input-label" points="0,8 12,0 12,8" stroke-width="1" fill="none"/>
+ </g>
+ <g transform="translate(3 30)">
+ <g transform="translate(4 0)"><svg id="SAW_SATURATION_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2.5 30)">SAT</text>
+ <g transform="translate(0 35)"><svg id="SAW_SATURATION_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 118)">
+ <g transform="translate(4 0)"><svg id="SAW_PHASE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2 30)">PHS</text>
+ <g transform="translate(0 35)"><svg id="SAW_PHASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 207)">
+ <g transform="translate(4 0)"><svg id="SAW_MIX_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2.5 30)">MIX</text>
+ <g transform="translate(0 35)"><svg id="SAW_MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 288)">
+ <rect class="output-background-filler" width="32" height="5" transform="translate(-1 -5)"/>
+ <rect class="output-background" width="32" height="47" rx="5" transform="translate(-1 -5)"/>
+ <g transform="translate(3 0)">
+ <g transform="translate(0 0)"><svg id="SAW_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(2 36)">OUT</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(175 48)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(175 136)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(175 225)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(220 30)">
+ <rect class="input-background" width="30" height="330" rx="5"/>
+
+
+
+
+
+ <g transform="translate(9 6)">
+
+ <polyline class="input-label" points="0,4 3,0 9,8 12,4" stroke-width="1" fill="none"/>
+ </g>
+ <g transform="translate(3 30)">
+ <g transform="translate(4 0)"><svg id="TRIANGLE_SAMPLE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(1.5 30)">SAM</text>
+ <g transform="translate(0 35)"><svg id="TRIANGLE_SAMPLE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 118)">
+ <g transform="translate(4 0)"><svg id="TRIANGLE_PHASE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2 30)">PHS</text>
+ <g transform="translate(0 35)"><svg id="TRIANGLE_PHASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 207)">
+ <g transform="translate(4 0)"><svg id="TRIANGLE_MIX_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2.5 30)">MIX</text>
+ <g transform="translate(0 35)"><svg id="TRIANGLE_MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 288)">
+ <rect class="output-background-filler" width="32" height="5" transform="translate(-1 -5)"/>
+ <rect class="output-background" width="32" height="47" rx="5" transform="translate(-1 -5)"/>
+ <g transform="translate(3 0)">
+ <g transform="translate(0 0)"><svg id="TRIANGLE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(2 36)">OUT</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(215 48)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(215 136)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(215 225)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+ <g class="io-group" transform="translate(260 30)">
+ <rect class="input-background" width="30" height="330" rx="5"/>
+
+
+
+
+
+ <g transform="translate(9 6)">
+
+ <path class="input-label" d="M 0 4 A 2 3 0 0 1 6 4" stroke-width="1" stroke="#666" fill="none"/>
+ <path class="input-label" d="M 6 4 A 2 3 0 0 0 12 4" stroke-width="1" stroke="#666" fill="none"/>
+ </g>
+ <g transform="translate(3 30)">
+ <g transform="translate(4 0)"><svg id="SINE_FEEDBACK_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(0.5 30)">FDBK</text>
+ <g transform="translate(0 35)"><svg id="SINE_FEEDBACK_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 118)">
+ <g transform="translate(4 0)"><svg id="SINE_PHASE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2 30)">PHS</text>
+ <g transform="translate(0 35)"><svg id="SINE_PHASE_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g transform="translate(3 207)">
+ <g transform="translate(4 0)"><svg id="SINE_MIX_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="2px" transform="translate(2.5 30)">MIX</text>
+ <g transform="translate(0 35)"><svg id="SINE_MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ </g>
+ <g class="io-group" transform="translate(0 288)">
+ <rect class="output-background-filler" width="31" height="5" transform="translate(-1 -5)"/>
+ <rect class="output-background" width="31" height="47" rx="5" transform="translate(-1 -5)"/>
+ <g transform="translate(3 0)">
+ <g transform="translate(0 0)"><svg id="SINE_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(2 36)">OUT</text>
+ </g>
+ </g>
+ </g>
+ <g transform="translate(255 48)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(255 136)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-90) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-20)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+ <g transform="translate(255 225)">
+ <g transform="translate(20 20)">
+ <polyline class="input-label" points="0,0 4,0" stroke-width="1" transform="rotate(-240) translate(10 0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 1 12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(43)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(0)"/>
+ <path class="input-label" d="M 0 -12.5 A 12.5 12.5 0 0 0 -12.5 0" stroke-width="0.7" stroke-linecap="round" stroke="#666" fill="none" transform="rotate(-43)"/>
+ </g>
+ </g>
+
+
+ <g class="io-group" transform="translate(0 313)">
+ <rect class="input-background" width="71" height="47" rx="5" transform="translate(10 0)"/>
+ <g transform="translate(10 0)">
+
+ <g transform="translate(7 5)"><svg id="PITCH_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(5 40)">V/OCT</text>
+ </g>
+ <g transform="translate(47 0)">
+
+ <g transform="translate(3 5)"><svg id="SYNC_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="6pt" letter-spacing="1px" transform="translate(3 40)">SYNC</text>
+ </g>
+ <g transform="translate(100 0)">
+
+ <g transform="translate(3 5)"><svg id="MIX_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="6pt" letter-spacing="2px" transform="translate(5 40)">MIX</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/XFade-lowcontrast-pp.svg b/res-pp/XFade-lowcontrast-pp.svg
@@ -0,0 +1,277 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="45.0" height="380.0" viewBox="0 0 45.0 380.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <defs>
+ <symbol id="dial-mixab-xfade" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <text font-size="5.0pt" transform="rotate(-240) translate(20 0) rotate(240) translate(-2 2)">A</text>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-210) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-180) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-150) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-120) translate(17 0)"/>
+ <polyline points="0,0 3.5,0" stroke-width="1" transform="rotate(-90) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-60) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(-30) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(0) translate(17 0)"/>
+ <polyline points="0,0 2.5,0" stroke-width="0.7" transform="rotate(30) translate(17 0)"/>
+ <text font-size="5.0pt" transform="rotate(60) translate(20 0) rotate(-60) translate(-2 2)">B</text>
+ </g>
+ </symbol>
+
+ <symbol id="dial-curve-xfade" viewBox="0 0 45px 45px">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-180) translate(9.5 0)"/>
+ <g transform="rotate(-180) translate(16 0) rotate(180) translate(-2.5 -2.5)">
+
+ <polyline points="0,0 2.5,5" stroke-width="1" stroke-linecap="round" fill="none" transform="translate(0 0)"/>
+ <polyline points="5,0 2.5,5" stroke-width="1" stroke-linecap="round" fill="none" transform="translate(0 0)"/>
+ </g>
+
+ <polyline points="0,0 2,0" stroke-width="0.7" transform="rotate(-135) translate(9.5 0)"/>
+
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(-90) translate(9.5 0)"/>
+ <g transform="rotate(-90) translate(16 0) rotate(90) translate(-2.5 -2.5)">
+
+ <polyline points="0,0 5,5" stroke-width="1" stroke-linecap="round" fill="none" transform="translate(0 0)"/>
+ <polyline points="5,0 0,5" stroke-width="1" stroke-linecap="round" fill="none" transform="translate(0 0)"/>
+ </g>
+
+ <polyline points="0,0 2,0" stroke-width="0.7" transform="rotate(-45) translate(9.5 0)"/>
+
+ <polyline points="0,0 2,0" stroke-width="1" transform="rotate(0) translate(9.5 0)"/>
+ <g transform="rotate(0) translate(16 0) rotate(-0) translate(-2.5 -2.5)">
+
+ <polyline points="2.5,0 5,5" stroke-width="1" stroke-linecap="round" fill="none" transform="translate(0 0)"/>
+ <polyline points="2.5,0 0,5" stroke-width="1" stroke-linecap="round" fill="none" transform="translate(0 0)"/>
+ </g>
+ </g>
+ </symbol>
+ </defs>
+
+
+
+ <rect class="module-background background-fill" width="45.0" height="380.0"/>
+
+
+ <polyline class="module-border-inner" points="1,1 44.0,1 44.0,379.0 1,379.0 1,1" stroke-width="0.5" fill="none"/>
+ <polyline class="module-border-middle" points="0.5,0.5 44.5,0.5 44.5,379.5 0.5,379.5 0.5,0.5" stroke-width="0.8" fill="none"/>
+ <polyline class="module-border-outer" points="0,0 45.0,0 45.0,380.0 0,380.0 0,0" stroke-width="1" fill="none"/>
+
+ <g transform="rotate(-90) translate(-376.0 13)">
+ <text class="title" font-size="7pt" letter-spacing="2.5px">XFADE</text>
+ <g transform="translate(0 12)">
+ <text class="brand" font-size="7pt" letter-spacing="2px">BGA</text>
+ <rect class="background-fill" width="3.0" height="3" fill="#ddd" transform="translate(11.5 -5)"/>
+ </g>
+ </g>
+
+
+ <g transform="translate(0 25)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(14 0)">MIX</text>
+ <g transform="translate(0 3)"><svg id="MIX_PARAM">
+ <g transform="translate(22.5 22.5)">
+ <polyline points="-5,0 5,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-5 0,5" stroke-width="1" stroke="#00f"/>
+ <circle cx="0" cy="0" r="14" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-mixab-xfade" transform="translate(0 3)" href="#dial-mixab-xfade"/>
+ <g class="io-group" transform="translate(5.5 49)">
+ <rect class="input-background" width="34" height="38" rx="5"/>
+ <g transform="translate(5 3)"><svg id="MIX_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(11 35)">CV</text>
+ </g>
+ </g>
+
+ <g transform="translate(0 135)">
+ <text font-size="6pt" letter-spacing="1px" transform="translate(7.5 0)">SHAPE</text>
+ <g transform="translate(14.5 17.5)"><svg id="CURVE_PARAM">
+ <g transform="translate(8 8)">
+ <polyline points="-3,0 3,0" stroke-width="1" stroke="#00f"/>
+ <polyline points="0,-3 0,3" stroke-width="1" stroke="#00f"/>
+ <circle r="7.5" stroke-width="1" stroke="#00f" fill="none"/>
+ </g>
+ </svg></g>
+ <use xlink:href="#dial-curve-xfade" transform="translate(0 3)" href="#dial-curve-xfade"/>
+ </g>
+
+ <g transform="translate(10.5 178)">
+ <text font-size="5pt" letter-spacing="1px" transform="translate(0 6)">LIN</text>
+ <g transform="translate(15 -1)"><svg id="LINEAR_PARAM">
+ <g transform="translate(4.5 4.5)">
+ <circle r="4" stroke-width="1" stroke="#00f" fill="#f00"/>
+ </g>
+ </svg></g>
+ </g>
+
+ <g transform="translate(0 210)">
+ <g class="io-group" transform="translate(5.5 0)">
+ <rect class="input-background-filler" width="34" height="10" transform="translate(0 63)"/>
+ <rect class="input-background" width="34" height="70" rx="5"/>
+ <g transform="translate(5 3)"><svg id="A_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15 35)">A</text>
+ <g transform="translate(5 38)"><svg id="B_INPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#0f0" fill="#0f0"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#0f0" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="input-label" font-size="5pt" letter-spacing="2px" transform="translate(15 70)">B</text>
+ </g>
+ <g class="io-group" transform="translate(5.5 76)">
+ <rect class="output-background-filler" width="34" height="10" transform="translate(0 -3)"/>
+ <rect class="output-background" width="34" height="35" rx="5"/>
+ <g transform="translate(5 0)"><svg id="OUT_OUTPUT">
+ <g transform="translate(12 12)">
+ <circle cx="0" cy="0" r="5" stroke-width="1" stroke="#f00" fill="#f00"/>
+ <circle cx="0" cy="0" r="10.5" stroke-width="3" stroke="#f00" fill="none"/>
+ </g>
+ </svg></g>
+ <text class="output-label" font-size="5pt" letter-spacing="2px" transform="translate(8.3 32)">MIX</text>
+ </g>
+ </g>
+</svg>
diff --git a/res-pp/knob_16px-lowcontrast-pp.svg b/res-pp/knob_16px-lowcontrast-pp.svg
@@ -0,0 +1,8 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.0" height="16.0" version="1.1" viewBox="0 0 16.0 16.0">
+ <g transform="translate(8 8)">
+ <circle r="7.8" fill="#555"/>
+ <circle r="6" fill="#333"/>
+ <polyline points="0,0 0,-6.5" stroke-width="2" stroke="#fff" stroke-linecap="round"/>
+ </g>
+</svg>
diff --git a/res-pp/knob_19px-lowcontrast-pp.svg b/res-pp/knob_19px-lowcontrast-pp.svg
@@ -0,0 +1,144 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="19.0" height="19.0" version="1.1" viewBox="0 0 19.0 19.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <g transform="translate(9.5 9.5)">
+ <circle class="knob-rim" cx="0" cy="0" r="9.3"/>
+ <circle class="knob-center" cx="0" cy="0" r="7.3"/>
+ </g>
+ <circle class="knob-tick" cx="9.5" cy="1.6" r="1.3"/>
+ <circle class="knob-tick" cx="9.5" cy="1.9" r="1.3"/>
+</svg>
diff --git a/res-pp/knob_26px-lowcontrast-pp.svg b/res-pp/knob_26px-lowcontrast-pp.svg
@@ -0,0 +1,144 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="26.0" height="26.0" version="1.1" viewBox="0 0 26.0 26.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <g transform="translate(13 13)">
+ <circle class="knob-rim" cx="0" cy="0" r="12.8"/>
+ <circle class="knob-center" cx="0" cy="0" r="9.7"/>
+ </g>
+ <circle class="knob-tick" cx="13" cy="1.6" r="1.3"/>
+ <circle class="knob-tick" cx="13" cy="1.9" r="1.3"/>
+</svg>
diff --git a/res-pp/knob_29px-lowcontrast-pp.svg b/res-pp/knob_29px-lowcontrast-pp.svg
@@ -0,0 +1,145 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="29.0" height="29.0" version="1.1" viewBox="0 0 29.0 29.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <g transform="translate(14.5 14.5)">
+ <circle class="knob-rim" cx="0" cy="0" r="14.3"/>
+ <circle class="knob-center" cx="0" cy="0" r="10.9"/>
+ </g>
+ <circle class="knob-tick" cx="14.5" cy="1.6" r="1.3"/>
+ <circle class="knob-tick" cx="14.5" cy="1.9" r="1.3"/>
+ <circle class="knob-tick" cx="14.5" cy="2.2" r="1.3"/>
+</svg>
diff --git a/res-pp/knob_38px-lowcontrast-pp.svg b/res-pp/knob_38px-lowcontrast-pp.svg
@@ -0,0 +1,143 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="38.0" height="38.0" version="1.1" viewBox="0 0 38.0 38.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <g transform="translate(19 19)">
+ <circle class="knob-rim" cx="0" cy="0" r="18.7"/>
+ <circle class="knob-center" cx="0" cy="0" r="14"/>
+ </g>
+ <circle class="knob-tick" cx="19" cy="2.7" r="1.8"/>
+</svg>
diff --git a/res-pp/knob_45px-lowcontrast-pp.svg b/res-pp/knob_45px-lowcontrast-pp.svg
@@ -0,0 +1,143 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="45.0" height="45.0" version="1.1" viewBox="0 0 45.0 45.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <g transform="translate(22.5 22.5)">
+ <circle class="knob-rim" r="22.2"/>
+ <circle class="knob-center" r="18"/>
+ </g>
+ <polyline class="knob-tick" points="22.5,2 22.5,2.7" stroke="#fff" stroke-width="3" stroke-linecap="round"/>
+</svg>
diff --git a/res-pp/knob_68px-lowcontrast-pp.svg b/res-pp/knob_68px-lowcontrast-pp.svg
@@ -0,0 +1,143 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="68.0" height="68.0" version="1.1" viewBox="0 0 68.0 68.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+ <g transform="translate(34 34)">
+ <circle class="knob-rim" r="33.8"/>
+ <circle class="knob-center" r="27"/>
+ </g>
+ <polyline class="knob-tick" points="34,2 34,4.5" stroke-width="3" stroke-linecap="round" fill="none"/>
+</svg>
diff --git a/res-pp/port-lowcontrast-pp.svg b/res-pp/port-lowcontrast-pp.svg
@@ -0,0 +1,147 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24.0" height="24.0" version="1.1" viewBox="0 0 24.0 24.0">
+ <style>text {
+ fill: #333;
+ font-family: 'Roboto', sans-serif;
+ font-weight: bold;
+}
+text.title {
+ font-family: 'Comfortaa', sans-serif;
+ font-weight: normal;
+}
+text.brand {
+ font-family: 'Audiowide', sans-serif;
+ font-weight: bold;
+}
+
+polyline {
+ stroke: #333;
+}
+path {
+ stroke: #333;
+}
+
+rect.module-background, .background-fill {
+ fill: #ddd;
+}
+polyline.module-border-inner {
+ stroke: #e4e4e4;
+}
+polyline.module-border-middle {
+ stroke: #ebebeb;
+}
+polyline.module-border-outer {
+ stroke: #f2f2f2;
+}
+
+g.io-group {
+}
+rect.input-background, rect.input-background-filler {
+ fill: #fafafa;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #bbb;
+}
+text.input-label, text.output-label {
+ /* font-size: 6pt; */
+}
+polyline.input-label, polyline.output-label {
+}
+path.input-label, path.output-label {
+}
+
+circle.port-rim {
+ stroke: #f0f0f0;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #eee;
+}
+circle.knob-rim {
+ fill: #333;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+
+
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
+</style>
+
+
+ <g transform="translate(12 12)">
+ <circle class="port-barrel" r="6" stroke-width="1"/>
+ <circle class="port-rim" r="9" stroke-width="4.5" fill="none"/>
+ <circle r="6" stroke-width=".5" stroke="#777" fill="none"/>
+ <circle r="6.5" stroke-width=".5" stroke="#aaa" fill="none"/>
+ <circle r="11.2" stroke-width=".5" stroke="#bbb" fill="none"/>
+ <circle r="11.7" stroke-width=".5" stroke="#888" fill="none"/>
+ </g>
+</svg>
diff --git a/res-src/skin-lowcontrast.css b/res-src/skin-lowcontrast.css
@@ -0,0 +1,62 @@
+text {
+ fill: #b3b3b3;
+}
+
+polyline {
+ stroke: #b3b3b3;
+}
+path {
+ stroke: #b3b3b3;
+}
+
+rect.module-background, .background-fill {
+ fill: #333;
+}
+polyline.module-border-inner {
+ stroke: #191919;
+}
+polyline.module-border-middle {
+ stroke: #111;
+}
+polyline.module-border-outer {
+ stroke: #000;
+}
+
+rect.input-background, rect.input-background-filler {
+ fill: #b3b3b3;
+}
+rect.output-background, rect.output-background-filler {
+ fill: #888;
+}
+text.input-label {
+ fill: #666;
+}
+polyline.input-label, path.input-label {
+ stroke: #666;
+}
+text.output-label {
+ fill: #ccc;
+}
+polyline.output-label, path.output-label {
+ stroke: #ccc;
+}
+
+circle.port-rim {
+ stroke: #ccc;
+}
+circle.port-barrel {
+ stroke: #222;
+ fill: #222;
+}
+circle.knob-center {
+ fill: #bbb;
+}
+circle.knob-rim {
+ fill: #555;
+}
+circle.knob-tick {
+ fill: #fff;
+}
+polyline.knob-tick {
+ stroke: #fff;
+}
diff --git a/res/AD-lowcontrast.svg b/res/AD-lowcontrast.svg
Binary files differ.
diff --git a/res/ADSR-lowcontrast.svg b/res/ADSR-lowcontrast.svg
Binary files differ.
diff --git a/res/AMRM-lowcontrast.svg b/res/AMRM-lowcontrast.svg
Binary files differ.
diff --git a/res/ASR-lowcontrast.svg b/res/ASR-lowcontrast.svg
Binary files differ.
diff --git a/res/Additator-lowcontrast.svg b/res/Additator-lowcontrast.svg
Binary files differ.
diff --git a/res/AddrSeq-lowcontrast.svg b/res/AddrSeq-lowcontrast.svg
Binary files differ.
diff --git a/res/Analyzer-lowcontrast.svg b/res/Analyzer-lowcontrast.svg
Binary files differ.
diff --git a/res/Arp-lowcontrast.svg b/res/Arp-lowcontrast.svg
Binary files differ.
diff --git a/res/Assign-lowcontrast.svg b/res/Assign-lowcontrast.svg
Binary files differ.
diff --git a/res/Blank3-lowcontrast.svg b/res/Blank3-lowcontrast.svg
Binary files differ.
diff --git a/res/Blank6-lowcontrast.svg b/res/Blank6-lowcontrast.svg
Binary files differ.
diff --git a/res/Bool-lowcontrast.svg b/res/Bool-lowcontrast.svg
Binary files differ.
diff --git a/res/CVD-lowcontrast.svg b/res/CVD-lowcontrast.svg
Binary files differ.
diff --git a/res/Clpr-lowcontrast.svg b/res/Clpr-lowcontrast.svg
Binary files differ.
diff --git a/res/Cmp-lowcontrast.svg b/res/Cmp-lowcontrast.svg
Binary files differ.
diff --git a/res/CmpDist-lowcontrast.svg b/res/CmpDist-lowcontrast.svg
Binary files differ.
diff --git a/res/DADSRH-lowcontrast.svg b/res/DADSRH-lowcontrast.svg
Binary files differ.
diff --git a/res/DADSRHPlus-lowcontrast.svg b/res/DADSRHPlus-lowcontrast.svg
Binary files differ.
diff --git a/res/DGate-lowcontrast.svg b/res/DGate-lowcontrast.svg
Binary files differ.
diff --git a/res/Detune-lowcontrast.svg b/res/Detune-lowcontrast.svg
Binary files differ.
diff --git a/res/EQ-lowcontrast.svg b/res/EQ-lowcontrast.svg
Binary files differ.
diff --git a/res/EQS-lowcontrast.svg b/res/EQS-lowcontrast.svg
Binary files differ.
diff --git a/res/Edge-lowcontrast.svg b/res/Edge-lowcontrast.svg
Binary files differ.
diff --git a/res/EightFO-lowcontrast.svg b/res/EightFO-lowcontrast.svg
Binary files differ.
diff --git a/res/EightOne-lowcontrast.svg b/res/EightOne-lowcontrast.svg
Binary files differ.
diff --git a/res/FFB-lowcontrast.svg b/res/FFB-lowcontrast.svg
Binary files differ.
diff --git a/res/FMOp-lowcontrast.svg b/res/FMOp-lowcontrast.svg
Binary files differ.
diff --git a/res/FlipFlop-lowcontrast.svg b/res/FlipFlop-lowcontrast.svg
Binary files differ.
diff --git a/res/Follow-lowcontrast.svg b/res/Follow-lowcontrast.svg
Binary files differ.
diff --git a/res/FourMan-lowcontrast.svg b/res/FourMan-lowcontrast.svg
Binary files differ.
diff --git a/res/Inv-lowcontrast.svg b/res/Inv-lowcontrast.svg
Binary files differ.
diff --git a/res/LFO-lowcontrast.svg b/res/LFO-lowcontrast.svg
Binary files differ.
diff --git a/res/LLFO-lowcontrast.svg b/res/LLFO-lowcontrast.svg
Binary files differ.
diff --git a/res/LVCF-lowcontrast.svg b/res/LVCF-lowcontrast.svg
Binary files differ.
diff --git a/res/LVCO-lowcontrast.svg b/res/LVCO-lowcontrast.svg
Binary files differ.
diff --git a/res/Lag-lowcontrast.svg b/res/Lag-lowcontrast.svg
Binary files differ.
diff --git a/res/Lmtr-lowcontrast.svg b/res/Lmtr-lowcontrast.svg
Binary files differ.
diff --git a/res/Manual-lowcontrast.svg b/res/Manual-lowcontrast.svg
Binary files differ.
diff --git a/res/Matrix44-lowcontrast.svg b/res/Matrix44-lowcontrast.svg
Binary files differ.
diff --git a/res/Matrix88-lowcontrast.svg b/res/Matrix88-lowcontrast.svg
Binary files differ.
diff --git a/res/Mix1-lowcontrast.svg b/res/Mix1-lowcontrast.svg
Binary files differ.
diff --git a/res/Mix2-lowcontrast.svg b/res/Mix2-lowcontrast.svg
Binary files differ.
diff --git a/res/Mix4-lowcontrast.svg b/res/Mix4-lowcontrast.svg
Binary files differ.
diff --git a/res/Mix4x-lowcontrast.svg b/res/Mix4x-lowcontrast.svg
Binary files differ.
diff --git a/res/Mix8-lowcontrast.svg b/res/Mix8-lowcontrast.svg
Binary files differ.
diff --git a/res/Mix8x-lowcontrast.svg b/res/Mix8x-lowcontrast.svg
Binary files differ.
diff --git a/res/Mono-lowcontrast.svg b/res/Mono-lowcontrast.svg
Binary files differ.
diff --git a/res/Mult-lowcontrast.svg b/res/Mult-lowcontrast.svg
Binary files differ.
diff --git a/res/Mumix-lowcontrast.svg b/res/Mumix-lowcontrast.svg
Binary files differ.
diff --git a/res/Mute8-lowcontrast.svg b/res/Mute8-lowcontrast.svg
Binary files differ.
diff --git a/res/Noise-lowcontrast.svg b/res/Noise-lowcontrast.svg
Binary files differ.
diff --git a/res/Nsgt-lowcontrast.svg b/res/Nsgt-lowcontrast.svg
Binary files differ.
diff --git a/res/Offset-lowcontrast.svg b/res/Offset-lowcontrast.svg
Binary files differ.
diff --git a/res/OneEight-lowcontrast.svg b/res/OneEight-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ-lowcontrast.svg b/res/PEQ-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ14-lowcontrast.svg b/res/PEQ14-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ14XF-lowcontrast.svg b/res/PEQ14XF-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ14XR-lowcontrast.svg b/res/PEQ14XR-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ14XV-lowcontrast.svg b/res/PEQ14XV-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ6-lowcontrast.svg b/res/PEQ6-lowcontrast.svg
Binary files differ.
diff --git a/res/PEQ6XF-lowcontrast.svg b/res/PEQ6XF-lowcontrast.svg
Binary files differ.
diff --git a/res/Pan-lowcontrast.svg b/res/Pan-lowcontrast.svg
Binary files differ.
diff --git a/res/Pgmr-lowcontrast.svg b/res/Pgmr-lowcontrast.svg
Binary files differ.
diff --git a/res/PgmrX-lowcontrast.svg b/res/PgmrX-lowcontrast.svg
Binary files differ.
diff --git a/res/PolyCon16-lowcontrast.svg b/res/PolyCon16-lowcontrast.svg
Binary files differ.
diff --git a/res/PolyCon8-lowcontrast.svg b/res/PolyCon8-lowcontrast.svg
Binary files differ.
diff --git a/res/PolyMult-lowcontrast.svg b/res/PolyMult-lowcontrast.svg
Binary files differ.
diff --git a/res/PolyOff16-lowcontrast.svg b/res/PolyOff16-lowcontrast.svg
Binary files differ.
diff --git a/res/PolyOff8-lowcontrast.svg b/res/PolyOff8-lowcontrast.svg
Binary files differ.
diff --git a/res/Pressor-lowcontrast.svg b/res/Pressor-lowcontrast.svg
Binary files differ.
diff --git a/res/Pulse-lowcontrast.svg b/res/Pulse-lowcontrast.svg
Binary files differ.
diff --git a/res/Reftone-lowcontrast.svg b/res/Reftone-lowcontrast.svg
Binary files differ.
diff --git a/res/SampleHold-lowcontrast.svg b/res/SampleHold-lowcontrast.svg
Binary files differ.
diff --git a/res/Shaper-lowcontrast.svg b/res/Shaper-lowcontrast.svg
Binary files differ.
diff --git a/res/ShaperPlus-lowcontrast.svg b/res/ShaperPlus-lowcontrast.svg
Binary files differ.
diff --git a/res/Sine-lowcontrast.svg b/res/Sine-lowcontrast.svg
Binary files differ.
diff --git a/res/Slew-lowcontrast.svg b/res/Slew-lowcontrast.svg
Binary files differ.
diff --git a/res/Stack-lowcontrast.svg b/res/Stack-lowcontrast.svg
Binary files differ.
diff --git a/res/Sums-lowcontrast.svg b/res/Sums-lowcontrast.svg
Binary files differ.
diff --git a/res/Switch-lowcontrast.svg b/res/Switch-lowcontrast.svg
Binary files differ.
diff --git a/res/Switch1616-lowcontrast.svg b/res/Switch1616-lowcontrast.svg
Binary files differ.
diff --git a/res/Switch44-lowcontrast.svg b/res/Switch44-lowcontrast.svg
Binary files differ.
diff --git a/res/Switch88-lowcontrast.svg b/res/Switch88-lowcontrast.svg
Binary files differ.
diff --git a/res/Test-lowcontrast.svg b/res/Test-lowcontrast.svg
Binary files differ.
diff --git a/res/Test2-lowcontrast.svg b/res/Test2-lowcontrast.svg
Binary files differ.
diff --git a/res/TestExpanderBase-lowcontrast.svg b/res/TestExpanderBase-lowcontrast.svg
Binary files differ.
diff --git a/res/TestExpanderExtension-lowcontrast.svg b/res/TestExpanderExtension-lowcontrast.svg
Binary files differ.
diff --git a/res/TestVCF-lowcontrast.svg b/res/TestVCF-lowcontrast.svg
Binary files differ.
diff --git a/res/UMix-lowcontrast.svg b/res/UMix-lowcontrast.svg
Binary files differ.
diff --git a/res/Unison-lowcontrast.svg b/res/Unison-lowcontrast.svg
Binary files differ.
diff --git a/res/VCA-lowcontrast.svg b/res/VCA-lowcontrast.svg
Binary files differ.
diff --git a/res/VCAmp-lowcontrast.svg b/res/VCAmp-lowcontrast.svg
Binary files differ.
diff --git a/res/VCF-lowcontrast.svg b/res/VCF-lowcontrast.svg
Binary files differ.
diff --git a/res/VCM-lowcontrast.svg b/res/VCM-lowcontrast.svg
Binary files differ.
diff --git a/res/VCO-lowcontrast.svg b/res/VCO-lowcontrast.svg
Binary files differ.
diff --git a/res/VU-lowcontrast.svg b/res/VU-lowcontrast.svg
Binary files differ.
diff --git a/res/Walk-lowcontrast.svg b/res/Walk-lowcontrast.svg
Binary files differ.
diff --git a/res/Walk2-lowcontrast.svg b/res/Walk2-lowcontrast.svg
Binary files differ.
diff --git a/res/XCO-lowcontrast.svg b/res/XCO-lowcontrast.svg
Binary files differ.
diff --git a/res/XFade-lowcontrast.svg b/res/XFade-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_16px-lowcontrast.svg b/res/knob_16px-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_19px-lowcontrast.svg b/res/knob_19px-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_26px-lowcontrast.svg b/res/knob_26px-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_29px-lowcontrast.svg b/res/knob_29px-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_38px-lowcontrast.svg b/res/knob_38px-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_45px-lowcontrast.svg b/res/knob_45px-lowcontrast.svg
Binary files differ.
diff --git a/res/knob_68px-lowcontrast.svg b/res/knob_68px-lowcontrast.svg
Binary files differ.
diff --git a/res/port-lowcontrast.svg b/res/port-lowcontrast.svg
Binary files differ.
diff --git a/res/skin_css_values.json b/res/skin_css_values.json
Binary files differ.
diff --git a/src/skins.cpp b/src/skins.cpp
@@ -98,6 +98,7 @@ NVGcolor Skins::cssColorToNVGColor(const char* color, const NVGcolor& ifError) {
void Skins::loadSkins() {
_available.push_back(Skin("light", "Light"));
_available.push_back(Skin("dark", "Dark"));
+ _available.push_back(Skin("lowcontrast", "Dark (low-contrast)"));
_default = "light";
std::string path = rack::asset::user("BogaudioModules.json");
