/* speaker-cleaner.css : speaker cleaner / water eject. Hard-coded colours only inside the .display panel. */
#speaker-cleaner .sc-display { padding: 16px 12px 14px; }
#speaker-cleaner .sc-time { margin: 6px 0 2px; }
#speaker-cleaner .sc-unit { font-size: .38em; font-weight: 500; color: #a8a29e; margin-left: 4px; }
#speaker-cleaner .sc-freq { color: #e7e5e4; }
#speaker-cleaner .sc-display[data-running="true"] { box-shadow: 0 0 0 3px #4ade80 inset; }
#speaker-cleaner .sc-progress { height: 6px; border-radius: 3px; background: #292524; margin: 12px 4px 0; overflow: hidden; }
#speaker-cleaner .sc-progress i { display: block; height: 100%; width: 100%; background: #4ade80; transform-origin: left center; transform: scaleX(0); }
#speaker-cleaner .sc-go { display: flex; width: 100%; margin-top: 14px; min-height: 64px; font-size: 19px; }
#speaker-cleaner .sc-safety { margin: 10px 0 0; color: var(--body); }
#speaker-cleaner .sc-block { margin-top: 14px; }
#speaker-cleaner .sc-label { margin-bottom: 6px; }
#speaker-cleaner .chips .chip { min-height: 44px; }
#speaker-cleaner .sc-range input { width: 220px; min-height: 32px; }
#speaker-cleaner .sc-loud { margin: 8px 0; }
#speaker-cleaner .sc-keys { margin: 12px 0 0; }
@media (max-width: 640px) { #speaker-cleaner .sc-range input { width: 170px; } }
@media (hover: none) { #speaker-cleaner .sc-keys { display: none; } }