Destaca palavra na tela de definições

src/components/BlocoDefinicoes.vue

@@ -2,7 +2,25 @@
   <div>
     <h2>Valendo!</h2>
 
-    <p>Palavra: {{ estado.sala.palavra || 'não definida' }}</p>
+    <p>
+      <h4 class="centralizado"> 
+        {{ estado.sala.palavra || 'não definida' }}
+        <span class="sem-negrito">   
+          é:
+        </span>  
+      </h4>
+    </p>
+
+    <p v-if="estado.souMediador">Os jogadores estão escrevendo suas definições!</p>
+    <div v-if="!estado.souMediador">
+
+      <input type="text" id="minhaDefinicao" v-model="minhaDefinicao" />
+      <button @click="enviarDefinicao">Enviar definição</button>
+    </div>
+
+    <div>
+      <p>Tempo restante: {{ tempoRestante }} segundos</p>
+    </div>
 
     <p v-if="estado.souMediador">Você é o mediador da rodada!</p>
     <p v-if="!estado.souMediador">
@@ -15,20 +33,7 @@
       <p>Escreve uma definição convincente para os demais jogadores.</p>
       <p>Você ganha pontos para cada voto que sua definição receber!</p>
     </div>
-
-    <p v-if="estado.souMediador">Os jogadores estão escrevendo suas definições!</p>
-    <div v-if="!estado.souMediador">
-      <label for="minhaDefinicao">
-        <b>Escreva sua definição:</b>
-      </label>
-      <br />
-      <input type="text" id="minhaDefinicao" v-model="minhaDefinicao" />
-      <button @click="enviarDefinicao">Enviar definição</button>
-    </div>
-
-    <div>
-      <p>Tempo restante: {{ tempoRestante }} segundos</p>
-    </div>
+
   </div>
 </template>
 
@@ -67,5 +72,10 @@ onMounted(contagemRegressiva);
 </script>
 
 <style>
-/* Estilos */
+.sem-negrito {
+  font-weight: 100;
+}
+.centralizado {
+  text-align: center;
+}  
 </style>