/* Só Flashback | chat em modal; usa o chat existente em /chat-test/. */
#modal.sf-chat-modal .modal-window {
  width: min(1170px, 96vw);
  height: min(870px, 94dvh);
  border-color: #1ebbed;
  box-shadow: 0 0 0 1px #e633b34d, 0 0 48px #30a5ff40, 0 22px 90px #000b;
}
#modal.sf-chat-modal .modal-header {
  background: linear-gradient(105deg, #081b2c, #161329 64%, #241329);
  border-bottom-color: #1686ae80;
}
#modal.sf-chat-modal .modal-header strong {
  color: #f4fcff;
}
#modal.sf-chat-modal .modal-close:hover {
  color: #87e9ff;
  border-color: #43c6fa;
}
@media (max-width: 690px) {
  /* Quatro atalhos + menu, sem perder a marca no cabeçalho do celular. */
  .site-header { padding-left: 9px; padding-right: 9px; }
  .brand-name { font-size: clamp(17px, 4.4vw, 26px); letter-spacing: -1.4px; }
  .brand-radio { font-size: 13px; }
  .brand-tag { font-size: 9px; }
  .navigation { flex: none; gap: 0; }
  .navigation .nav-link { width: 41px; min-width: 0; font-size: 9px; }
  .navigation .nav-link svg { width: 21px; height: 21px; }
  .menu-wrap { margin-left: 3px; }
  #modal.sf-chat-modal .modal-window { width: 100vw; height: 100dvh; border-radius: 0; }
}
@media (max-width: 390px) {
  .brand-name { font-size: clamp(16px, 4.6vw, 19px); }
  .navigation .nav-link { width: 34px; font-size: 8px; }
  .navigation .nav-link svg { width: 19px; height: 19px; }
  .menu-wrap { margin-left: 1px; }
  .hamburger { width: 23px; }
  .hamburger span { width: 22px; }
}
@media (max-width: 350px) {
  .site-header { padding-left: 6px; padding-right: 6px; }
  .navigation .nav-link { width: 31px; }
  .brand-name { font-size: 16px; }
}
