.hypnos-audio-controls{
  position:fixed;
  right:max(14px,env(safe-area-inset-right));
  bottom:max(14px,calc(env(safe-area-inset-bottom) + 10px));
  z-index:80;
  display:flex;
  gap:8px;
  padding:7px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(5,5,5,.78);
  box-shadow:0 12px 35px rgba(0,0,0,.45);
  backdrop-filter:blur(12px);
}
.hypnos-audio-button{
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  padding:0;
  border:1px solid rgba(255,255,255,.13);
  border-radius:50%;
  background:#171717;
  color:#fff;
  font-size:1.05rem;
  line-height:1;
  cursor:pointer;
  box-shadow:inset 0 1px rgba(255,255,255,.08);
  transition:transform .16s ease,border-color .16s ease,background .16s ease,opacity .16s ease;
}
.hypnos-audio-button:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.38);
}
.hypnos-audio-button:focus-visible{
  outline:3px solid #fff;
  outline-offset:2px;
}
.hypnos-audio-button[aria-pressed="false"]{
  opacity:.58;
  background:#0c0c0c;
}
.hypnos-audio-button.is-pulsing{
  animation:hypnos-audio-pulse .28s ease;
}
@keyframes hypnos-audio-pulse{
  50%{transform:scale(.88)}
}
@media(max-width:620px){
  .hypnos-audio-controls{right:10px;bottom:max(10px,calc(env(safe-area-inset-bottom) + 6px));padding:5px;gap:5px}
  .hypnos-audio-button{width:38px;height:38px;font-size:.96rem}
}
@media(prefers-reduced-motion:reduce){
  .hypnos-audio-button{transition:none}
  .hypnos-audio-button.is-pulsing{animation:none}
}