Vue3 with vuetify alpha

I am trying to install the latest version of Vuetify 3 with Vue 3 but I am getting an error at run time. I am upgrading from Vue2 to Vue3. It doesn't appear I am integrating Vuetify correctly. I have spent all labor day trying to figure this one out.

Uncaught TypeError: Cannot read properties of undefined (reading 'lgAndUp')

It's coming from my Vue component:

<template>
  <div
    :class="{
      'mx-5 px-5 pt-5': $vuetify.breakpoint.lgAndUp,
      'py-5 my-3 px-0': $vuetify.breakpoint.mdAndDown
    }"
    id="login_router_wrapper"
  >
    <router-view id="login_router"></router-view>
  </div>
</template>
<script>
import { mapState, mapActions, mapMutations } from 'vuex';

export default {
  props: ['errors'],
  data() {
    return {};
  },
  async created() {},
  destroyed() {},
  computed: {},
  methods: {}
};
</script>
<style></style>

My main login_app.js

import 'material-design-icons-iconfont/dist/material-design-icons.css';
import 'vuetify/styles' // Global CSS has to be imported
import { createApp } from 'vue';
import store_login from './store/index-login.js';
import router from './router/index-login.js';
import my_vuetify from './vuetify.js';

import AuthRouter from './components/auth/AuthRouter.vue';
import AuthEntrypoint from './components/auth/AuthEntrypoint.vue';
const login_app = createApp({
  data() {
      return {
          message: 'Hello root Component 1'
      };
  },
  components: {
      'auth-router': AuthRouter,
      'auth-entrypoint': AuthEntrypoint,
  },
});

login_app.use(store_login)
.use(router)
.use(my_vuetify)
.mount('#app-login');

My store

import {createStore} from 'vuex';
import auth from './auth/auth.js';
import loader from './util/loader.js';
import error from './util/error.js';


const store_login = createStore({
  modules: {
    auth,
    loader,
    error
  },
  state: {
    errors: []
  },
  mutations: {},
  getters: {},
  actions: {}
});
export default store_login;

My router

import { createRouter, createWebHistory } from 'vue-router';

import auth from './auth.js';
import AuthRouter from '../components/auth/AuthRouter.vue';
import authResetPassword from './authResetPassword.js';

const router = createRouter({
  history: createWebHistory(),
  routes: [
    {
      path: '/login',
      props: true,
      component: AuthRouter,
      children: [...auth]
    },
    {
      path: '/password',
      props: true,
      component: AuthRouter,
      children: [...authResetPassword]
    }
  ]
});
export default router;

Then Vuetify

import {createVuetify} from 'vuetify';
import 'vuetify/styles' // Global CSS has to be imported

const my_vuetify = createVuetify({
  iconfont: 'mdi', // 'md' || 'mdi' || 'fa' || 'fa4'
  theme: {
    options: {
      customProperties: true
    },
    light: true,
    themes: {
      light: {
        primary: '#9E9E9E',
        secondary: '#b0bec5',
        accent: '#8c9eff',
        error: '#b71c1c',
        background: '#fafafa'
      }
    }
  }
});
export default my_vuetify;