feat: responsive gain section

src/components/dsp408/ChannelGroup/ChannelGroup.css

@@ -1,5 +1,4 @@
 .channel-group {
-  /* container-type: inline-size; */
   position: relative;
   flex: 1 1 0;
   min-height: 0;
@@ -9,9 +8,9 @@
   border: var(--border-width) solid var(--border-hairline);
   border-radius: var(--radius-md);
 
-  padding: 4cqh var(--space-3) 0;
-  margin-bottom: var(--space-1);
-  margin-top: var(--space-1);
+  padding: 6cqh var(--space-3) 1cqh;
+  margin-bottom: 1cqh;
+  margin-top: 1cqh;
   box-sizing: border-box;
   overflow: visible; /* in case something upstream set hidden */
 }
@@ -25,7 +24,7 @@
   padding: 0 var(--space-2);
 
   font-family: var(--font-ui);
-  font-size: 2cqh;
+  font-size: 4cqh;
   font-weight: var(--font-weight-semibold);
   color: var(--text-muted);
 

src/components/dsp408/GainSection/GainSection.css

@@ -39,6 +39,7 @@
 /* Container */
 
 .gain-section {
+  container-type: size;
   position: absolute;
   left: 0;
   right: 0;