
@media (max-width: 600px) {
  body.ui-skin > header,
  body.ui-skin #content > header {
    padding-left: 12px;
    padding-right: 12px;
    gap: 8px;
  }

  body.ui-skin > header nav a,
  body.ui-skin #content > header nav a {
    padding: 6px 8px;
    font-size: 12px;
  }

  body.ui-skin:not(.ui-admin) :is(#settings-menu, #streamer-menu) {
    position: fixed;
    inset: auto 12px 16px;
    width: auto;
    max-height: min(75dvh, 650px);
    padding: 18px;
    border-radius: 20px;
    z-index: 10020;
  }

  body.ui-skin:not(.ui-admin) #settings-overlay {
    position: fixed;
    z-index: 10010;
  }

  body.ui-skin #emoji-picker {
    max-width: min(320px, calc(100vw - 28px));
    right: min(0px, calc(100% - min(320px, calc(100vw - 28px))));
  }

  .ui-information main,
  .ui-personas main,
  .ui-agency main {
    padding: 30px 16px 40px;
  }

  .ui-faq .faq-item {
    padding: 20px 17px;
    border-radius: 13px;
  }

  .ui-agency .agency-header {
    gap: 14px;
  }

  body.ui-skin .persona-card {
    padding: 18px;
  }

  body.ui-stats {
    padding: 14px;
  }

  .ui-stats > .page-header {
    padding: 16px;
  }

  .ui-admin .admin-content {
    padding: 14px;
  }

  .ui-admin .admin-main-header {
    gap: 10px;
    padding: 12px 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.ui-skin :is(.card, .featured-card, .persona-card, .talent-card, .vod-card, .btn, .period-btn, .tab, #msg-input) {
    transition: none;
  }

  body.ui-skin .vod-card:hover {
    transform: none;
  }

  body.ui-skin :is(#settings-menu, #streamer-menu, #settings-overlay, .toast),
  body.ui-skin > header nav a,
  body.ui-skin #content > header nav a {
    transition: none;
  }

  body.ui-skin :is(
    button, [role="button"], .btn, .auth-btn, .info-icon, .msg-reply,
    .pending-reply-cancel, .stage-invite-btn, .stage-kick-btn,
    #streamer-menu-btn, #ban-popup .ban-btn, #viewer-count, #stage-header-btn, #twitch-indicator
  ):not(:where(
    .stream-chrome *, .main-video-wrap *, .featured-video-wrap *,
    .vod-video-wrap *, .stream-quality-picker *
  )) {
    transition: none;
  }

  body.ui-skin .talent-live-dot {
    animation: none;
  }
}
