.mobile-dock{display:none}

@media(max-width:760px){
  body.cloud-catalog{padding-bottom:calc(92px + env(safe-area-inset-bottom))}

  .mobile-dock{
    position:fixed;
    z-index:9;
    left:50%;
    bottom:max(8px,env(safe-area-inset-bottom));
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:4px;
    width:min(430px,calc(100% - 20px));
    min-height:67px;
    padding:7px;
    border:1px solid rgba(179,255,207,.24);
    border-radius:24px;
    background:linear-gradient(145deg,rgba(14,44,27,.9),rgba(5,20,12,.91));
    box-shadow:0 18px 48px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.16);
    backdrop-filter:blur(26px) saturate(1.2);
    -webkit-backdrop-filter:blur(26px) saturate(1.2);
    transform:translateX(-50%);
  }

  .mobile-dock__item{
    display:grid;
    min-width:0;
    min-height:52px;
    place-items:center;
    align-content:center;
    gap:3px;
    padding:5px 3px;
    border:0;
    border-radius:17px;
    background:transparent;
    color:#91a99a;
    text-decoration:none;
    font:700 9px/1.1 "DM Sans",sans-serif;
    transition:background .2s,color .2s,transform .2s;
    -webkit-tap-highlight-color:transparent;
  }

  .mobile-dock__item:active{transform:scale(.94)}
  .mobile-dock__icon{display:grid;width:24px;height:24px;place-items:center;color:currentColor;font:600 20px/1 "Space Grotesk",sans-serif}
  .mobile-dock__item.is-active{background:linear-gradient(145deg,rgba(126,244,166,.2),rgba(92,225,139,.09));color:#c9ffdc;box-shadow:inset 0 0 0 1px rgba(140,249,177,.16)}
  .mobile-dock__item.is-active .mobile-dock__icon{color:#72eca0;text-shadow:0 0 14px rgba(100,232,154,.65)}

  .cloud-catalog .quick-filters{
    position:sticky;
    z-index:4;
    top:max(69px,calc(env(safe-area-inset-top) + 64px));
    border-color:rgba(178,255,206,.2);
    box-shadow:0 13px 32px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.12);
    backdrop-filter:blur(22px);
    -webkit-backdrop-filter:blur(22px);
  }

  .cloud-catalog .quick-filters:after{
    content:"";
    position:sticky;
    right:-12px;
    width:20px;
    align-self:stretch;
    flex:0 0 20px;
    margin-left:-20px;
    pointer-events:none;
    background:linear-gradient(90deg,transparent,rgba(13,45,27,.92));
  }

  .cloud-catalog .search-panel{
    box-sizing:border-box;
    padding:max(12px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));
    overflow:hidden;
  }

  .cloud-catalog .search-dialog{
    width:100%;
    max-height:calc(100vh - 24px);
    max-height:calc(100dvh - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)));
    margin:0;
    overflow-x:hidden;
    overflow-y:auto;
    border-radius:22px;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .cloud-catalog .search-topline{position:sticky;z-index:2;top:-18px;margin:-18px -18px 0;padding:18px 18px 10px;background:linear-gradient(180deg,#10271b 76%,transparent)}
  .cloud-catalog .title-card .card-play{right:10px;bottom:10px;top:auto;left:auto;width:36px;height:36px;opacity:.92;transform:none;background:rgba(238,255,244,.92)}
  .cloud-catalog .title-card:hover .card-play,.cloud-catalog .title-card:focus-visible .card-play{transform:scale(1.04)}
  .cloud-catalog .toast{bottom:calc(91px + env(safe-area-inset-bottom))}
  .cloud-catalog .install-nudge{bottom:calc(88px + env(safe-area-inset-bottom))}
}

@media(display-mode:standalone) and (max-width:760px){
  .mobile-dock{bottom:max(7px,env(safe-area-inset-bottom))}
}