html.sv-pwa-mobileApp{
  color-scheme: light dark;
}

@media (max-width:980px){
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage){
    --sv112-pad: clamp(10px, 3.2vw, 14px);
    --sv112-dock-space: calc(env(safe-area-inset-bottom, 0px) + 92px);
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-top{
    margin:0 0 10px !important;
    padding:calc(env(safe-area-inset-top, 0px) + 8px) var(--sv112-pad) 10px !important;
    background:color-mix(in srgb, var(--sv-bg) 84%, var(--sv-card)) !important;
    border-bottom:1px solid color-mix(in srgb, var(--sv-border) 86%, transparent) !important;
    backdrop-filter:saturate(1.15) blur(14px);
    -webkit-backdrop-filter:saturate(1.15) blur(14px);
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-topLeft,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-topRight{
    gap:8px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-topBrand{
    font-size:clamp(24px, 8vw, 30px) !important;
    letter-spacing:-0.03em !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-topPage{
    max-width:48vw !important;
    font-size:12px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-icoBtn{
    width:38px !important;
    height:38px !important;
    border-radius:14px !important;
    background:color-mix(in srgb, var(--sv-card) 92%, transparent);
    border:1px solid color-mix(in srgb, var(--sv-border) 82%, transparent);
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-icoBtn .sv-ico{
    width:22px !important;
    height:22px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-shell,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-pad{
    padding-bottom:var(--sv112-dock-space) !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-pad{
    padding-left:var(--sv112-pad) !important;
    padding-right:var(--sv112-pad) !important;
  }

  html.sv-pwa-mobileApp body.sv-page-home:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) #sv-stories,
  html.sv-pwa-mobileApp body.sv-page-home:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) #sv-feed{
    margin-left:var(--sv112-pad) !important;
    margin-right:var(--sv112-pad) !important;
  }

  html.sv-pwa-mobileApp body.sv-page-home:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) #sv-stories{
    padding-top:2px !important;
    padding-bottom:8px !important;
    gap:8px !important;
  }

  html.sv-pwa-mobileApp body.sv-page-home:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-story{
    border-radius:22px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-feed,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-card,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-searchPageV2 .sv-searchPanel,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-notiHead,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-liveCard,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-gFbCard,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-gFbComposer,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-hashHead,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-hashTabs,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-modalCard{
    border-radius:18px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-feed,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-searchPageV2 .sv-searchPanel,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-notiHead{
    box-shadow:var(--sv-shadow) !important;
  }

  html.sv-pwa-mobileApp body.sv-page-search:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-searchPageV2,
  html.sv-pwa-mobileApp body.sv-page-notifications:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-pad{
    padding-top:2px !important;
  }

  html.sv-pwa-mobileApp body.sv-page-notifications:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-notiHeadTop,
  html.sv-pwa-mobileApp body.sv-page-notifications:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-notiHeadBtns,
  html.sv-pwa-mobileApp body.sv-page-notifications:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-notiTools{
    gap:10px !important;
  }

  html.sv-pwa-mobileApp body.sv-page-notifications:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-notiHeadBtns{
    flex-wrap:wrap !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-bottom{
    left:8px !important;
    right:8px !important;
    width:auto !important;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius:24px !important;
    border:1px solid color-mix(in srgb, var(--sv-border) 86%, transparent) !important;
    background:color-mix(in srgb, var(--sv-bg) 78%, var(--sv-card)) !important;
    box-shadow:0 16px 38px rgba(0,0,0,.16) !important;
    backdrop-filter:saturate(1.18) blur(18px);
    -webkit-backdrop-filter:saturate(1.18) blur(18px);
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-bottom .sv-btmLink{
    min-height:50px !important;
    padding:8px 6px !important;
    gap:4px !important;
    border-radius:16px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-bottom .sv-btmIco,
  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-bottom .sv-btmIco svg{
    width:25px !important;
    height:25px !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-bottom .sv-btmLbl{
    font-size:11px !important;
    line-height:1.1 !important;
  }

  html.sv-pwa-mobileApp body:not(.sv-auth-page):not(.sv-authPage):not(.sv-reelsPage) .sv-fab{
    width:54px !important;
    height:54px !important;
    margin-top:-12px !important;
    border-radius:18px !important;
    box-shadow:0 14px 30px rgba(0,0,0,.20) !important;
  }
}
