fluid-studio{display:block;max-width:900px;color:var(--ink);font:15px/1.48 var(--sans,"Segoe UI",sans-serif)}
.fl-bench{border:1px solid var(--rule);border-radius:9px;overflow:hidden;background:var(--panel)}
.fl-stage{background:var(--stage);padding:18px clamp(14px,4%,32px) 9px;color:var(--stage-ink)}
.fl-title,.fl-controls,.fl-buttons{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.fl-title{justify-content:space-between}.fl-title h3{font-size:16px;font-weight:600;margin:0}.fl-title span,.fl-controls output,.fl-status{font:12px/1.5 var(--mono,Consolas,monospace)}
.fl-title span{color:var(--stage-muted)}.fl-stage canvas{display:block;width:100%;height:clamp(210px,38vw,365px)}
.fl-controls{padding:15px clamp(14px,4%,32px) 3px;gap:12px 22px;align-items:end}
.fl-controls label{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:12px;font-size:13px;font-weight:620;min-width:132px;flex:1}
.fl-controls output{color:var(--muted)}.fl-controls input{grid-column:1/-1;margin:0;width:100%;height:35px;accent-color:var(--action)}
.fl-buttons{gap:6px}.fl-buttons button{min-height:44px;padding:7px 12px;border:1px solid var(--control-border);border-radius:4px;color:var(--ink);background:var(--paper);cursor:pointer}.fl-buttons [data-action="play"]{color:var(--on-action);background:var(--action);border-color:var(--action)}.fl-buttons :disabled{cursor:default;opacity:.5}
.fl-bench :is(input,button):focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.fl-status,.fl-note{margin:0;padding:7px clamp(14px,4%,32px) 0}.fl-status{font-weight:600}.fl-note{padding-bottom:15px;font-size:13px;color:var(--muted)}
@media(max-width:500px){.fl-stage{padding-inline:10px}.fl-buttons{flex-basis:100%}.fl-title span{font-size:11px}}