Как стилизовать значок входящей почты/чата Shopify 2.0 (внутри iframe)?

ПРОБЛЕМА

Значок чата Shopify мешает большому количеству контента (распространенный вопрос на их форумах), но старые решения CSS не работают, потому что новый значок папки «Входящие/чат» теперь находится внутри iframe, а мой JS хромает.

ПЫТАЛСЯ

Прочитал много ответов Stackoverflow, а также сообщений в блогах, но не могу заставить его работать, извините. И в сочетании с возрастом некоторых ответов неясно, являются ли ответы, которые я пробовал, «правильным» способом ведения дел.

Тем не менее, вот упрощенная версия того, где я нахожусь...

<iframe id = "dummy-chat-button-iframe" name = "dummy-chat-button-iframe" src = "about:blank"></iframe>

<script>
  var iframe = document.getElementById("dummy-chat-button-iframe");
  var element = iframe.contentWindow.document.getElementById("dummy-chat-button")[0];
  element.style.height = "40px";
  element.style.width = "40px";
</script>

Вышеприведенное было тестом, чтобы увидеть, могу ли я повлиять на элементы внутри iframe, фактические селекторы/стили, на которые мне нужно настроить таргетинг, будут...

button#dummy-chat-button.chat-toggle {
  margin-top: 3px;
  height: 40px;
  width: 40px;
  padding: 0;
}
button.chat-toggle svg {
  width: auto;
  height: 20px;
  margin: auto;
}

ПРИМЕЧАНИЕ. Я не контролирую HTML-код iframe, стили или сам вызов iframe, поэтому могу использовать CSS и JS только вне iframe.

ВОПРОСЫ

1. Основываясь на приведенной выше информации, может ли кто-нибудь показать мне JS, необходимый для стилизации элементов в iframe?
2. Учитывая количество стилей, которые мне нужно изменить, должен ли я добавить элемент <style> в заголовок iframe и возможно ли это с помощью JS?

Извините, мой JS настолько ограничен, любая помощь или указатели в правильном направлении будут очень признательны.

Привет, Бен