.config-demo{grid-template-columns:290px minmax(0,1fr) 384px;gap:16px;height:100%;min-height:calc(100vh - 64px);padding:16px;display:grid}.config-sidebar,.config-aside{flex-direction:column;gap:14px;display:flex;overflow-y:auto}.config-stage{min-width:0;display:flex}.config-canvas-wrap{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--navy-800);flex:1;min-height:500px;position:relative;overflow:hidden}.config-canvas{width:100%;height:100%;display:block}.config-switcher{background:var(--navy-900);border:1px solid var(--line);border-radius:var(--radius-sm);grid-template-columns:repeat(5,1fr);gap:4px;padding:4px;display:grid}.config-button{color:var(--text-dim);font-family:var(--mono);background:0 0;border:1px solid #0000;border-radius:4px;padding:8px 2px;font-size:12.5px;font-weight:700;transition:all .15s}.config-button:hover{color:var(--text)}.config-button.is-active{background:var(--navy-600)}.firing-strip{flex-wrap:wrap;align-items:center;gap:2px 4px;display:flex}.firing-step{align-items:center;gap:4px;display:inline-flex}.firing-chip{border:1px solid var(--line-strong);background:var(--navy-900);width:26px;height:26px;color:var(--text-dim);font-family:var(--mono);border-radius:50%;justify-content:center;align-items:center;font-size:13px;font-weight:600;transition:background .1s,color .1s;display:inline-flex}.firing-chip.is-active{color:#0a1626;font-weight:700}.firing-arrow{color:var(--text-faint);font-size:12px}.firing-sound-link{color:var(--text-dim);border-bottom:1px dotted var(--line-strong);margin-top:8px;font-size:13px;text-decoration:none;display:inline-block}.firing-sound-link:hover{color:var(--text);border-bottom-color:var(--text-dim)}.balance-bar{background:var(--navy-900);border:1px solid var(--line);border-radius:5px;height:10px;overflow:hidden}.balance-bar-fill{border-radius:5px 0 0 5px;height:100%;transition:width 80ms linear}.balance-spark{margin:0}.balance-spark svg{width:100%;height:auto;display:block}.readout-hint{font-family:var(--mono);color:var(--text-faint);font-size:11px}@media (max-width:1180px){.config-demo{grid-template-columns:270px minmax(0,1fr);grid-template-areas:"controls stage""aside aside"}.config-sidebar{grid-area:controls}.config-stage{grid-area:stage;min-height:460px}.config-aside{flex-flow:wrap;grid-area:aside}.config-aside>*{flex:1;min-width:280px}}@media (max-width:760px){.config-demo{grid-template-columns:1fr;grid-template-areas:"stage""controls""aside";height:auto}.config-stage{min-height:420px}}