/* Filter Bench → ferronato.me labs identity (see ../portfolio-shell.css).
   Loaded last. Tokens are set on :root as well as body because the plotting
   script reads them from document.documentElement at start-up, so the canvases
   follow the same palette. FIR = mint, IIR = amber, failure = coral. */

:root,
body[data-fm-project="fft"]{
  --ink:var(--fm-bg);
  --ink-2:var(--fm-sunk);
  --panel:var(--fm-panel);
  --panel-hi:var(--fm-panel-2);
  --rule:var(--fm-rule);
  --rule-soft:#2C3033;
  --text:var(--fm-ink);
  --dim:var(--fm-muted);
  --dimmer:var(--fm-dim);
  --fir:var(--fm-d3);
  --iir:var(--fm-d1);
  --sig:var(--fm-d2);
  --alert:var(--fm-bad);
  --violet:var(--fm-d5);
  --sans:var(--fm-sans);
  --cond:var(--fm-sans);
}

body[data-fm-project="fft"]{
  background:radial-gradient(1000px 520px at 70% -12%,rgba(242,182,84,.045),transparent 62%),var(--fm-bg);
  color:var(--fm-ink);
  font-family:var(--fm-sans);
}
body[data-fm-project="fft"] a{color:var(--fm-amber)}

/* ---------- shell hero + tabs (see ../portfolio-shell.css) ---------- */
body[data-fm-project="fft"] .fm-chip.fir{color:var(--fm-d3);border-color:color-mix(in srgb,var(--fm-d3) 45%,transparent)}
body[data-fm-project="fft"] .fm-chip.iir{color:var(--fm-d1);border-color:var(--fm-amber-line)}
body[data-fm-project="fft"] .fm-chip .k{color:var(--fm-dim)}
body[data-fm-project="fft"] .hero-controls{padding:0;border:0;background:none;margin-top:10px;align-items:flex-end}
body[data-fm-project="fft"] .hero-controls .ctl{min-width:200px}
body[data-fm-project="fft"] .fm-hero-fig figcaption strong{color:var(--fm-ink);font-weight:600}
body[data-fm-project="fft"] main section{border-bottom:0;padding:44px 0 32px}
body[data-fm-project="fft"] main section:last-child{border-bottom:0}

/* ---------- hero + section heads ---------- */
body[data-fm-project="fft"] .hero{border-bottom-color:var(--fm-rule)}
body[data-fm-project="fft"] .eyebrow,
body[data-fm-project="fft"] .sec-num{
  font-family:var(--fm-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--fm-amber);
}
body[data-fm-project="fft"] .sec-num i{color:var(--fm-amber)}
body[data-fm-project="fft"] h1,
body[data-fm-project="fft"] h2{font-family:var(--fm-serif);font-weight:400;letter-spacing:-.015em}
body[data-fm-project="fft"] h1{line-height:1}
body[data-fm-project="fft"] h2{line-height:1.08}
body[data-fm-project="fft"] h3{font-family:var(--fm-sans);font-weight:600;font-size:17px;letter-spacing:0}
body[data-fm-project="fft"] .lede,
body[data-fm-project="fft"] .sec-head p{color:var(--fm-muted)}
body[data-fm-project="fft"] section{border-bottom-color:var(--fm-rule)}

/* ---------- panels ---------- */
body[data-fm-project="fft"] .panel{
  background:var(--fm-panel);border:1px solid var(--fm-rule);border-radius:var(--fm-r-panel);box-shadow:var(--fm-shadow);
}
body[data-fm-project="fft"] .panel-head{background:var(--fm-panel-2);border-bottom-color:var(--fm-rule)}
body[data-fm-project="fft"] .panel-title,
body[data-fm-project="fft"] .ctl-lab,
body[data-fm-project="fft"] .keybox .lab,
body[data-fm-project="fft"] th{
  font-family:var(--fm-mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--fm-dim);
}
body[data-fm-project="fft"] .ctl-val{color:var(--fm-ink)}
body[data-fm-project="fft"] .controls{background:var(--fm-sunk);border-top-color:var(--fm-rule)}
body[data-fm-project="fft"] .cap,
body[data-fm-project="fft"] .legend{color:var(--fm-dim)}
body[data-fm-project="fft"] .eq{background:var(--fm-sunk);border-color:var(--fm-rule);border-radius:var(--fm-r-ctl)}
body[data-fm-project="fft"] .keybox{border-radius:0 var(--fm-r-ctl) var(--fm-r-ctl) 0}

/* ---------- chips ---------- */
body[data-fm-project="fft"] .chip{
  font-family:var(--fm-mono);font-size:11px;padding:3px 9px;border-radius:999px;
  background:transparent;border:1px solid var(--fm-rule);color:var(--fm-ink);
}
body[data-fm-project="fft"] .chip .k{color:var(--fm-dim)}
body[data-fm-project="fft"] .chip.fir{border-color:color-mix(in srgb,var(--fm-d3) 45%,transparent);color:var(--fm-d3)}
body[data-fm-project="fft"] .chip.iir{border-color:var(--fm-amber-line);color:var(--fm-d1)}
body[data-fm-project="fft"] .chip.bad{border-color:color-mix(in srgb,var(--fm-bad) 55%,transparent);color:var(--fm-bad)}

/* ---------- buttons + segmented controls ---------- */
body[data-fm-project="fft"] .btn{
  min-height:var(--fm-h-ctl);padding:0 14px;
  font-family:var(--fm-sans);font-size:12.5px;font-weight:500;letter-spacing:0;text-transform:none;
  background:var(--fm-panel-2);color:var(--fm-ink);border:1px solid var(--fm-rule);border-radius:var(--fm-r-ctl);
}
body[data-fm-project="fft"] .btn:hover{border-color:var(--fm-rule-strong);color:var(--fm-ink)}
body[data-fm-project="fft"] .seg{border-color:var(--fm-rule);border-radius:var(--fm-r-ctl)}
body[data-fm-project="fft"] .seg button{
  min-height:28px;padding:0 11px;
  font-family:var(--fm-sans);font-size:12.5px;font-weight:500;letter-spacing:0;
  background:var(--fm-panel-2);color:var(--fm-muted);border-right-color:var(--fm-rule);
}
body[data-fm-project="fft"] .seg button:hover{color:var(--fm-ink)}
body[data-fm-project="fft"] .seg button[aria-pressed=true]{background:var(--fm-amber-soft);color:var(--fm-amber)}
body[data-fm-project="fft"] .seg button:focus-visible,
body[data-fm-project="fft"] .btn:focus-visible,
body[data-fm-project="fft"] input[type=range]:focus-visible{outline-color:var(--fm-amber)}

/* ---------- sliders: neutral track, thumb keeps FIR/IIR colour ---------- */
body[data-fm-project="fft"] input[type=range]::-webkit-slider-runnable-track{height:3px;background:var(--fm-rule-strong)}
body[data-fm-project="fft"] input[type=range]::-moz-range-track{height:3px;background:var(--fm-rule-strong)}
body[data-fm-project="fft"] input[type=range]::-webkit-slider-thumb{width:14px;height:14px;margin-top:-5.5px;background:var(--fm-amber)}
body[data-fm-project="fft"] input[type=range]::-moz-range-thumb{width:14px;height:14px;background:var(--fm-amber)}
body[data-fm-project="fft"] input[type=range].fir::-webkit-slider-thumb{background:var(--fm-d3)}
body[data-fm-project="fft"] input[type=range].fir::-moz-range-thumb{background:var(--fm-d3)}
body[data-fm-project="fft"] input[type=range].iir::-webkit-slider-thumb{background:var(--fm-d1)}
body[data-fm-project="fft"] input[type=range].iir::-moz-range-thumb{background:var(--fm-d1)}

/* ---------- tables, lists, footer ---------- */
body[data-fm-project="fft"] th,
body[data-fm-project="fft"] td{border-bottom-color:var(--fm-rule)}
body[data-fm-project="fft"] td:first-child{font-family:var(--fm-mono)}
body[data-fm-project="fft"] ul.tick li{color:var(--fm-muted)}
body[data-fm-project="fft"] footer{color:var(--fm-dim)}