.sr-panels{gap:8px;margin-bottom:10px;display:flex}.sr-panel{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.sr-label{align-items:center;gap:6px;font-size:.8rem;font-weight:600;display:flex}.sr-badge{background:var(--bg-soft,#1e293b);color:var(--text-dim);border:1px solid var(--border);border-radius:10px;padding:1px 6px;font-size:.7rem;font-weight:400}.sr-chart{padding:6px!important}.sr-steps{color:var(--text-dim);text-align:center;font-variant-numeric:tabular-nums;min-height:1.1em;font-size:.72rem}.sr-toolbar{align-items:center;gap:6px;margin-bottom:12px;display:flex}.sr-nav{border:1px solid var(--border);background:var(--bg-surface);width:32px;height:32px;color:var(--text-dim);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;font-size:16px;transition:color .1s,background .1s,border-color .1s;display:inline-flex}.sr-nav:hover{color:var(--text);background:var(--bg-hover);border-color:var(--accent)}.sr-play{border:1px solid var(--accent);background:color-mix(in srgb, var(--accent) 12%, transparent);height:32px;color:var(--accent);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:0 14px;font-size:.85rem;font-weight:500;transition:background .15s,color .15s,border-color .15s;display:flex}.sr-play:hover{background:color-mix(in srgb, var(--accent) 22%, transparent)}.sr-play.playing{color:#86efac;background:#14532d;border-color:#22c55e}.sr-play.playing:hover{background:#166534}.sr-pi{font-size:11px}