.ss-mobile-tabbar {
  display: none;
}

@media (max-width: 759.98px) {
  :root {
    --ss-mobile-tabbar-base-height: 80px;
    --ss-mobile-tabbar-height: var(--ss-mobile-tabbar-base-height);
    --ss-mobile-tabbar-content-offset: calc(var(--ss-mobile-tabbar-height) + 12px);
    --ss-mobile-tabbar-capsule-width: 52px;
    --ss-mobile-tabbar-capsule-height: 32px;
    --ss-mobile-tabbar-active-shape: path("M17.519 0 H34.481 L39.447 0.375 L41.312 0.75 L42.672 1.125 L43.765 1.5 L44.683 1.875 L45.473 2.25 L46.163 2.625 L46.771 3 L47.31 3.375 L47.79 3.75 L48.217 4.125 L48.597 4.5 L48.934 4.875 L49.232 5.25 L49.493 5.625 L49.72 6 L49.915 6.375 L50.079 6.75 L50.214 7.125 L50.322 7.5 L50.403 7.875 L50.459 8.25 L50.49 8.625 L50.5 9 V23 L50.486 23.375 L50.444 23.75 L50.372 24.125 L50.269 24.5 L50.135 24.875 L49.968 25.25 L49.768 25.625 L49.532 26 L49.26 26.375 L48.949 26.75 L48.597 27.125 L48.201 27.5 L47.756 27.875 L47.259 28.25 L46.704 28.625 L46.083 29 L45.385 29.375 L44.598 29.75 L43.702 30.125 L42.665 30.5 L41.438 30.875 L39.922 31.25 L37.865 31.625 L32.596 32 H19.404 C7.813 32 1.5 28.6 1.5 20 V12 C1.5 1.2 12.431 0 17.519 0 Z");
    --ss-mini-player-content-reserve: 94px;
  }

  body.ss-mobile-tabbar-enabled {
    padding-bottom: calc(var(--ss-mobile-tabbar-content-offset) + 10px);
  }

  body.ss-mobile-tabbar-enabled.ss-mini-visible {
    padding-bottom: calc(var(--ss-mobile-tabbar-content-offset) + 10px + var(--ss-mini-player-content-reserve));
  }

  body.ss-full-player-open.ss-mobile-tabbar-enabled {
    padding-bottom: 0;
  }

  body.ss-mobile-tabbar-auth-standalone .wrapper {
    min-height: calc(100vh + 72px);
  }

  /*
   * Short Search routes otherwise become exactly non-scrollable in standalone
   * iOS and WebKit collapses the visual viewport to the layout viewport. Keep
   * the route one top safe-area taller; when Mini Player is visible, restore
   * the same reserve that its body padding removes from the percentage base.
   */
  body.search.ss-mobile-tabbar-standalone .wrapper {
    min-height: calc(100% + var(--ss-safe-area-top));
  }

  body.search.ss-mobile-tabbar-standalone.ss-mini-visible .wrapper {
    min-height: calc(100% + var(--ss-safe-area-top) + var(--ss-mini-player-content-reserve));
  }

  @supports (min-height: 100dvh) {
    body.ss-mobile-tabbar-auth-standalone .wrapper {
      min-height: calc(100dvh + 72px);
    }
  }

  .ss-mobile-tabbar {
    position: fixed;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 9998;
    display: block;
    padding: 0;
    pointer-events: none;
  }

  body.ss-mobile-tabbar-standalone .ss-mobile-tabbar {
    bottom: calc(var(--ss-safe-area-bottom) * -1);
  }

  .ss-mobile-tabbar__surface {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: clamp(1px, 0.5vw, 4px);
    min-height: var(--ss-mobile-tabbar-height);
    box-sizing: border-box;
    padding: 7px calc(6px + var(--ss-safe-area-right)) 0 calc(6px + var(--ss-safe-area-left));
    background: var(--ss-mobile-tabbar-surface, var(--ss-chrome-surface, #1a1a1a));
    box-shadow: none;
    direction: rtl;
    overflow: hidden;
    pointer-events: auto;
  }

  body.ss-mobile-tabbar-standalone .ss-mobile-tabbar__surface {
    min-height: calc(var(--ss-mobile-tabbar-height) + var(--ss-safe-area-bottom));
    padding-bottom: var(--ss-safe-area-bottom);
  }

  .ss-mobile-tabbar__surface::before {
    content: none;
  }

  .ss-mobile-tabbar__indicator {
    position: absolute;
    top: 7px;
    left: 0;
    z-index: 0;
    width: 0;
    height: var(--ss-mobile-tabbar-capsule-height);
    border-radius: 0;
    -webkit-clip-path: var(--ss-mobile-tabbar-active-shape);
    clip-path: var(--ss-mobile-tabbar-active-shape);
    background: rgba(255, 192, 21, 0.2);
    opacity: 0;
    transform: translate3d(0, 0, 0);
    transition:
      transform 0.51s cubic-bezier(0.28, 1.48, 0.36, 0.98),
      width 0.34s ease,
      opacity 0.22s ease;
    pointer-events: none;
  }

  .ss-mobile-tabbar__item {
    position: relative;
    z-index: 1;
    flex: 1 1 25%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 9px;
    min-width: 0;
    min-height: 62px;
    padding: 0;
    color: #999999;
    text-decoration: none;
    text-align: center;
    transition: color 0.3s ease, transform 0.28s ease;
    -webkit-tap-highlight-color: transparent;
  }

  .ss-mobile-tabbar__item:hover,
  .ss-mobile-tabbar__item:focus-visible {
    color: #cbcbcb;
    text-decoration: none;
    outline: 0;
  }

  .ss-mobile-tabbar__item:active {
    transform: translateY(1px);
  }

  .ss-mobile-tabbar__item.is-active {
    color: #ffffff;
  }

  .ss-mobile-tabbar__icon-shell {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--ss-mobile-tabbar-capsule-width);
    height: var(--ss-mobile-tabbar-capsule-height);
    border-radius: 0;
    -webkit-clip-path: var(--ss-mobile-tabbar-active-shape);
    clip-path: var(--ss-mobile-tabbar-active-shape);
    transition: transform 0.46s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .ss-mobile-tabbar__item.is-active .ss-mobile-tabbar__icon-shell {
    transform: translateY(0);
  }

  .ss-mobile-tabbar__icon {
    position: relative;
    display: block;
    width: 22px;
    height: 22px;
  }

  .ss-mobile-tabbar__icon i {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
    transition:
      opacity 0.34s ease,
      color 0.32s ease,
      transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .ss-mobile-tabbar__icon-light {
    opacity: 1;
    color: #999999;
    transform: scale(1);
  }

  .ss-mobile-tabbar__icon-solid {
    opacity: 0;
    color: #ffc015;
    transform: scale(0.72);
  }

  .ss-mobile-tabbar__item.is-active .ss-mobile-tabbar__icon-light {
    opacity: 0;
    transform: scale(0.62);
  }

  .ss-mobile-tabbar__item.is-active .ss-mobile-tabbar__icon-solid {
    opacity: 1;
    transform: scale(1);
  }

  .ss-mobile-tabbar__label {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    padding-bottom: 0;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: inherit;
    transition:
      color 0.3s ease,
      transform 0.38s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .ss-mobile-tabbar__item.is-active .ss-mobile-tabbar__label {
    transform: translateY(0);
  }

  #ss-mini-player {
    right: 8px;
    left: 8px;
    bottom: calc(var(--ss-mobile-tabbar-height) + 0px) !important;
  }
}

@media (min-width: 760px) {
  .ss-mobile-tabbar {
    display: none !important;
  }
}