/* Fraction Fence Line */
.ff-panel { background: #eaf6ff; border-radius: 18px; padding: 8px 10px 14px; box-shadow: var(--shadow); display: grid; gap: 6px; }
.ff-line { width: 100%; height: auto; }
.ff-post { transition: transform .15s ease; }
.ff-slider { -webkit-appearance: none; appearance: none; width: calc(100% - 22px); margin: 0 11px; height: 48px; background: transparent; cursor: pointer; }
.ff-slider::-webkit-slider-runnable-track { height: 12px; background: #d8c3a0; border-radius: 6px; }
.ff-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 44px; height: 44px; margin-top: -16px; border-radius: 50%; background: #c0392b; border: 4px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,.3); }
.ff-slider::-moz-range-track { height: 12px; background: #d8c3a0; border-radius: 6px; }
.ff-slider::-moz-range-thumb { width: 40px; height: 40px; border-radius: 50%; background: #c0392b; border: 4px solid #fff; }
.ff-slider:focus-visible { outline: 4px solid var(--focus); border-radius: 12px; }
.ff-row { display: flex; align-items: center; gap: 10px; }
.ff-nudge { min-width: 64px; font-size: 24px; }
.ff-readout { flex: 1; margin: 0; text-align: center; font-weight: 900; font-size: 20px; }
