/* Roth Conversion Strategy Planner — tool-specific additions only.
 * Anything reusable belongs in brand.css so the other tools inherit it too.
 * This file holds the conversion slider and nothing else. */

.sfui .sliderrow{padding:4px 0 14px;}
.sfui .sliderrow input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:4px;margin:8px 0 0;padding:0;
  background:var(--input-line);border-radius:3px;border:0;cursor:pointer;}
.sfui .sliderrow input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--brand-navy);border:3px solid var(--card);
  box-shadow:0 1px 4px rgba(20,32,58,.35);cursor:pointer;}
.sfui .sliderrow input[type=range]::-moz-range-thumb{
  width:20px;height:20px;border-radius:50%;background:var(--brand-navy);
  border:3px solid var(--card);box-shadow:0 1px 4px rgba(20,32,58,.35);cursor:pointer;}
.sfui .sliderrow input[type=range]:focus-visible{outline:2px solid var(--brand-gold);
  outline-offset:4px;}
.sfui .sliderscale{display:flex;justify-content:space-between;margin-top:6px;
  font-family:var(--mono);font-size:10.5px;color:var(--muted);}

/* The findings stack sits directly on the cream, not inside a card. */
.sfui .rail .flag{margin:0 0 12px;}