/* js/sound.js: #/lab/sounds */
.snd-lab .snd-tg{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin:var(--s4) 0 var(--s2)}
.snd-sw{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-radius:var(--r-2);background:var(--surface-2);color:var(--ink);border:1px solid var(--rule);font:500 16px var(--sans)}
.snd-sw span{color:var(--soft)}.snd-sw.on{background:var(--paper);color:var(--paper-ink)}.snd-sw.on span{color:var(--paper-soft)}
.snd-vol{display:flex;gap:var(--s3);align-items:center;color:var(--soft);font:16px var(--sans);margin-bottom:var(--s4)}.snd-vol input{flex:1}
.snd-colors{display:flex;flex-direction:column;gap:6px}.snd-row{display:flex;gap:6px}
.snd-c{flex:1;aspect-ratio:1;min-width:0;border:0;border-radius:50%;background:var(--c);transition:transform .15s var(--spring)}.snd-c:active{transform:scale(.86)}
.snd-now{min-height:1.4em;font-family:var(--mono)}
.snd-paints{display:flex;flex-direction:column;gap:var(--s2)}
.snd-p{display:flex;gap:var(--s3);align-items:center;padding:10px;border-radius:var(--r-2);background:var(--surface-1);border:1px solid var(--rule);color:var(--ink);text-align:left}
.snd-pal{display:flex;width:96px;height:32px;border-radius:var(--r-1);overflow:hidden;flex:none}.snd-pal i{background:var(--c)}
.snd-pt{display:flex;flex-direction:column;font:500 16px var(--sans)}.snd-pt small{color:var(--soft);font-weight:400}
.snd-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.snd-b{display:flex;flex-direction:column;align-items:flex-start;padding:12px 14px;border-radius:var(--r-2);background:var(--surface-2);border:1px solid var(--rule);color:var(--ink);font:500 16px var(--sans);text-align:left}
.snd-b small{color:var(--soft);font-weight:400;font-size:14px}.snd-b:active{transform:scale(.97)}