:root {
  --ui-scale: 1;
  --ui-vh: calc(1vh / var(--ui-scale));
  --ui-vw: calc(1vw / var(--ui-scale));
  --ui-100vh: calc(100 * var(--ui-vh));
}

html {
  zoom: var(--ui-scale);
}

@media (min-width: 1101px) {
  html body {
    min-height: var(--ui-100vh);
  }

  body .app-layout,
  body .main-content {
    min-height: var(--ui-100vh);
  }

  body .sidebar {
    min-height: var(--ui-100vh);
    height: var(--ui-100vh);
  }

  body .chat-sidebar {
    height: calc(var(--ui-100vh) - 48px);
  }

  body .support-ticket-modal,
  body .profile-settings-modal {
    max-height: calc(86 * var(--ui-vh));
  }

  body .app-layout.theater-mode .video-wrapper {
    min-height: min(calc(56.25 * var(--ui-vw)), calc(var(--ui-100vh) - 88px));
  }

  body .app-layout.theater-mode .video-iframe {
    max-height: calc(var(--ui-100vh) - 88px);
  }
}
