implementado google fontes

src/playground/App.vue

@@ -2,6 +2,8 @@
   <v-container class="py-6">
     <h1 class="text-h5 mb-4">Playground — eli-vue</h1>
 
+
+
     <v-tabs v-model="aba" color="primary" density="comfortable">
       <v-tab value="botao">Botão</v-tab>
       <v-tab value="indicador">Indicador</v-tab>
@@ -77,11 +79,34 @@ export default defineComponent({
   data() {
     return {
       aba: "botao" as AbaPlayground,
+      fontVars: {
+        eli: "",
+        v: "",
+        body: "",
+      },
+      googleSansCheck: "(checando...)" as string,
     };
   },
   mounted() {
     this.sincronizarAbaComHash();
     window.addEventListener("hashchange", this.sincronizarAbaComHash);
+
+    // Coleta variáveis de fonte e confirma carregamento via FontFaceSet.
+    this.fontVars.eli = getComputedStyle(document.documentElement).getPropertyValue("--eli-font-family").trim();
+    this.fontVars.v = getComputedStyle(document.documentElement).getPropertyValue("--v-font-family").trim();
+    this.fontVars.body = getComputedStyle(document.body).fontFamily;
+
+    // Espera fonts carregarem e então checa se o navegador considera Google Sans disponível
+    // (isso não garante 100% que TODOS pesos/estilos foram baixados, mas confirma que a face existe/foi carregada)
+    document.fonts.ready
+      .then(() => {
+        this.googleSansCheck = String(document.fonts.check('12px "Google Sans"'));
+        // atualiza body depois do load, pois pode mudar após o font-face carregar
+        this.fontVars.body = getComputedStyle(document.body).fontFamily;
+      })
+      .catch(() => {
+        this.googleSansCheck = "erro";
+      });
   },
   beforeUnmount() {
     window.removeEventListener("hashchange", this.sincronizarAbaComHash);

src/playground/main.ts

@@ -8,6 +8,10 @@ import { createVuetify } from "vuetify";
 import * as components from "vuetify/components";
 import * as directives from "vuetify/directives";
 
+// Estilos globais da lib (font-face + variáveis de fonte)
+// Importamos DEPOIS do Vuetify para garantir que `--v-font-family` seja sobrescrito.
+import "../styles/eli-vue-fonts.css";
+
 const themeDefault = {
   dark: false,
   colors: {
@@ -161,4 +165,17 @@ const vuetify = createVuetify({
   },
 });
 
-createApp(App).use(vuetify).mount("#app");
+const app = createApp(App);
+
+// Debug rápido: confirma fonte efetiva no playground (ver no DevTools console)
+// Observação: isso é só para o playground, não afeta o build da lib.
+if (import.meta.env.DEV) {
+  // eslint-disable-next-line no-console
+  console.log("[eli-vue] --v-font-family:", getComputedStyle(document.documentElement).getPropertyValue("--v-font-family"));
+  // eslint-disable-next-line no-console
+  console.log("[eli-vue] --eli-font-family:", getComputedStyle(document.documentElement).getPropertyValue("--eli-font-family"));
+  // eslint-disable-next-line no-console
+  console.log("[eli-vue] body font-family:", getComputedStyle(document.body).fontFamily);
+}
+
+app.use(vuetify).mount("#app");