/* ====== SFX page —— 复用创作音乐页的 .create-split / .cs-right / .music-detail 视觉 ====== */
/* 左表单控件 */
.sfx-opts{margin-top:30px;display:flex;flex-direction:column;gap:18px}
.sfx-opts .opt-row{margin-top:0}
.sfx-slider{display:flex;align-items:center;gap:12px;flex:0 1 auto;min-width:200px}
.sfx-slider input[type=range]{flex:1;accent-color:var(--accent)}
.sfx-val{min-width:40px;text-align:right;color:var(--ink-soft);font-size:13px}

/* 右侧结果：标题 + 变体列表 */
.sfx-detail{padding:0}
.sfx-rhead{flex:none}
.sfx-rhead .md-title{font-size:18px;font-weight:600;color:var(--ink)}
.sfx-rhead .md-sub{margin-top:4px;font-size:12px;color:var(--ink-mute)}
.sfx-variants{display:flex;flex-direction:column;gap:14px;margin-top:18px;min-height:0;overflow-y:auto}
.sfx-variant{display:flex;align-items:center;gap:14px;padding:13px 15px;border:1px solid var(--line);border-radius:var(--r);background:var(--s1)}
.sfx-vplay{position:static;transform:none;width:40px;height:40px;flex:none}
.sfx-vbody{flex:1;min-width:0}
.sfx-vlabel{font-size:11px;color:var(--ink-mute);margin-bottom:7px;letter-spacing:.04em}
.sfx-variant .md-wave{height:38px;margin-top:0}
.sfx-vdl{flex:none;padding:9px 11px}