/* Contrôles indépendants de la feuille alfred.css existante */
body > main { position: relative; min-height: 100dvh; padding-bottom: 82px; box-sizing: border-box; }
.alfred-controls {
  position: absolute; left: 16px; right: 16px; bottom: 12px;
  display: flex; align-items: center; gap: 14px; min-height: 56px;
  padding: 8px 18px; box-sizing: border-box;
  border: 1px solid rgba(255,255,255,.10); border-radius: 16px;
  background: rgba(35,37,41,.92); color: #f4f4f5;
  box-shadow: 0 8px 28px rgba(0,0,0,.14);
  font: 14px/1.3 system-ui, sans-serif;
}
.alfred-controls .audio-toggle { flex: 0 0 auto; width: 42px; height: 42px; padding: 0; border: 1px solid transparent; border-radius: 12px; background: transparent; color: inherit; font-size: 23px; cursor: pointer; }
.alfred-controls .audio-toggle:hover, .alfred-controls .audio-toggle:focus-visible { background: rgba(255,255,255,.10); outline-offset: 2px; }
.alfred-controls .audio-toggle[aria-pressed="true"] { background: rgba(225,100,100,.14); border-color: rgba(225,100,100,.28); }
.alfred-controls .volume-label { white-space: nowrap; color: #c8c8ce; }
.alfred-controls input[type="range"] { min-width: 60px; flex: 1; accent-color: #d1d5db; cursor: pointer; }
.alfred-controls output { min-width: 44px; text-align: right; font-variant-numeric: tabular-nums; }
.alfred-controls .controls-separator { height: 25px; width: 1px; background: rgba(255,255,255,.16); }
@media (max-width: 480px) { .alfred-controls { gap: 8px; padding: 6px 9px; left: 8px; right: 8px; } .alfred-controls .volume-label { display: none; } }

/* Deux curseurs dans la barre inférieure */
.alfred-controls { gap: 10px; }
.alfred-controls input[type="range"] { min-width: 55px; }
.alfred-controls output { min-width: 48px; }
@media (max-width: 700px) {
  body > main { padding-bottom: 126px; }
  .alfred-controls { flex-wrap: wrap; justify-content: center; }
  .alfred-controls input[type="range"] { flex: 1 1 80px; }
  .alfred-controls .controls-separator { display: none; }
}