.flac-demo{margin:var(--space-6) 0;border:var(--border-width) solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);font-family:var(--font-ui);scroll-margin-top:88px;overflow:hidden;container-type:inline-size}.flac-demo-head{flex-direction:column;gap:2px;padding:14px 20px;display:flex}.flac-demo-label{letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted);font-size:12px;font-weight:600}.flac-demo-name{font-size:17px;font-weight:600;line-height:1.3}.flac-demo-plot{border-block:var(--border-width) solid var(--color-border);background:var(--chart-bg);padding:10px 14px 14px}.flac-demo-axis-title{color:var(--chart-label);margin:0 0 6px;font-size:13px}.flac-demo-chart{padding:4px 6px 14px 64px}.flac-demo-chart.residual{padding-bottom:44px}.flac-demo-svg{width:100%;font-size:var(--text-chart);font-variant-numeric:tabular-nums;display:block;overflow:visible}.flac-demo-svg.signal{height:200px}.flac-demo-svg.residual{height:120px}.flac-demo-grid line{stroke:var(--chart-grid);stroke-width:1px}.flac-demo-axis{stroke:var(--chart-axis);stroke-width:1px}.flac-demo-warmup-band{fill:var(--chart-grid);opacity:.6}.flac-demo-band-label{fill:var(--chart-label)}.flac-demo-line{fill:none;stroke:var(--chart-signal);stroke-width:1.25px;opacity:.55;vector-effect:non-scaling-stroke}.flac-demo-sample{fill:var(--chart-signal)}.flac-demo-sample.warmup{fill:var(--chart-label)}.flac-demo-prediction{fill:none;stroke:var(--chart-result);stroke-width:2px}.flac-demo-stem{stroke:var(--chart-sample);stroke-width:2px}.flac-demo-residual{fill:var(--chart-sample)}.flac-demo-ticks{fill:var(--chart-label)}.flac-demo-body{flex-direction:column;gap:12px;padding:12px 20px;display:flex}.flac-demo-legend{flex-wrap:wrap;align-items:center;gap:6px 18px;margin:0;padding:0;font-size:14px;list-style:none;display:flex}.flac-demo-legend li{align-items:center;gap:6px;display:flex}.flac-demo-key{border-radius:50%;flex:none}.flac-demo-key.sample{background:var(--chart-signal);width:8px;height:8px}.flac-demo-key.prediction{border:2px solid var(--chart-result);width:12px;height:12px}.flac-demo-key.residual{background:var(--chart-sample);border-radius:2px;width:4px;height:14px}.flac-demo-key.warmup{background:radial-gradient(circle, var(--chart-label) 3.5px, transparent 4px), var(--chart-grid);border-radius:2px;width:16px;height:14px}.flac-demo-status{border-radius:var(--radius-md);background:var(--color-bg);box-shadow:inset 0 0 0 1px var(--color-border-strong);align-items:flex-start;gap:8px;margin:0;padding:8px 12px;font-size:14px;line-height:1.45;display:flex}.flac-demo-icon{color:var(--color-text-muted);flex:none;margin-top:1px;display:flex}.flac-demo-results{grid-template-columns:minmax(0,2fr) minmax(0,3fr);align-items:start;gap:16px;display:grid}.flac-demo-summary{font-variant-numeric:tabular-nums;gap:4px;margin:0;font-size:14px;display:grid}.flac-demo-summary div{border-bottom:var(--border-width) solid var(--color-border);flex-wrap:wrap;justify-content:space-between;gap:2px 12px;padding-bottom:4px;display:flex}.flac-demo-summary dt{color:var(--color-text-muted)}.flac-demo-summary dd{white-space:nowrap;margin:0}.flac-demo-summary .total dt,.flac-demo-summary .total dd{color:var(--color-text);font-weight:600}.flac-demo-steps{border-radius:var(--radius-md);min-width:0;overflow-x:auto}.flac-demo-steps:focus-visible{box-shadow:var(--focus-ring);outline:none}.flac-demo-steps table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:13px}.flac-demo-steps th,.flac-demo-steps td{border-bottom:var(--border-width) solid var(--color-border);text-align:right;white-space:nowrap;padding:3px 8px}.flac-demo-steps thead th{color:var(--color-text-muted);font-weight:600}.flac-demo-steps tbody th{color:var(--color-text-muted);font-weight:400}.flac-demo-steps .code,.flac-demo-steps thead th:last-child{text-align:left}.flac-demo-steps .code{font-family:var(--font-mono);font-size:12px}.flac-demo-steps-note{color:var(--color-text-muted);margin:6px 0 0;font-size:13px}.flac-demo .visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.flac-demo-controls{border:0;border-top:var(--border-width) solid var(--color-border);flex-direction:column;gap:12px;min-width:0;margin:0;padding:14px 20px 16px;display:flex}.flac-demo-group{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.flac-demo-group-label{min-width:11em;margin-right:4px;font-size:14px}.flac-demo-choice{border:var(--border-width) solid var(--color-border-strong);border-radius:var(--radius-full);height:32px;color:var(--color-text);font:500 14px var(--font-ui);font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;padding:0 12px}.flac-demo-choice.order{min-width:40px}.flac-demo-choice[aria-pressed=true]{border-color:var(--color-accent);background:var(--color-accent-soft);font-weight:600}.flac-demo-actions{justify-content:flex-end;display:flex}.flac-demo-reset{border:var(--border-width) solid var(--color-border-strong);border-radius:var(--radius-md);height:36px;color:var(--color-text);font:500 14px var(--font-ui);cursor:pointer;background:0 0;align-items:center;gap:6px;padding:0 12px;display:inline-flex}@media (hover:hover){.flac-demo-choice:hover,.flac-demo-reset:hover{background:var(--color-bg)}.flac-demo-choice[aria-pressed=true]:hover{background:var(--color-accent-soft)}}.flac-demo-controls:disabled .flac-demo-group,.flac-demo-controls:disabled .flac-demo-actions{opacity:.5}.flac-demo-controls:disabled *{cursor:not-allowed}.flac-demo-note{color:var(--color-text-muted);margin:0;font-size:13px;line-height:1.45}.flac-demo[data-state=ready] .flac-demo-note{display:none}.flac-demo[data-state=error] .flac-demo-note{color:var(--color-error)}.flac-demo-caption{border-top:var(--border-width) solid var(--color-border);color:var(--color-text-muted);padding:10px 20px 14px;font-size:14px;line-height:1.45}.flac-demo-caption b{color:var(--color-text);font-weight:600}@container (width<=719px){.flac-demo-results{grid-template-columns:minmax(0,1fr)}}@container (width<=559px){.flac-demo-head,.flac-demo-body,.flac-demo-controls,.flac-demo-caption{padding-inline:16px}.flac-demo-plot{padding-inline:10px}.flac-demo-chart{padding-left:58px}.flac-demo-svg.signal{height:170px}.flac-demo-svg .minor{display:none}.flac-demo-group-label{min-width:100%}}
