feat(ui): add floating info button to reopen modal and enforce single-session flow

static/style.css

@@ -275,4 +275,29 @@ button:hover {
 @keyframes slideDown {
   from {transform: translateY(-50px); opacity: 0;}
   to {transform: translateY(0); opacity: 1;}
+}
+
+/* --- Floating Info Button (FAB) --- */
+.info-fab {
+  position: fixed;
+  bottom: 20px;
+  right: 20px;
+  background-color: #28a745;
+  color: white;
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  text-align: center;
+  line-height: 50px;
+  font-size: 24px;
+  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
+  cursor: pointer;
+  z-index: 1900;
+  transition: transform 0.3s, background-color 0.3s;
+  display: none; /* Começa escondido, só aparece quando fecha o modal */
+}
+
+.info-fab:hover {
+  background-color: #218838;
+  transform: scale(1.1);
 }

templates/start.html

@@ -40,30 +40,14 @@
         </div>
     </div>
 
+    <!-- Floating Info Button -->
+    <div id="infoFab" class="info-fab" onclick="openModal()" title="Sobre o Projeto">
+        ℹ️
+    </div>
+
     <form  class="chat-box" method="POST">
         <h1 id="titulo-criar-perfil">Vamos criar seu perfil?</h1>
 
-        <div class="small-link" id="link-ja-tenho">
-            <a href="#" onclick="mostrarPerfis(); return false;">Já tenho perfil</a>
-        </div>
-
-        <div class="small-link hidden" id="link-criar">
-            <a href="/">Criar perfil</a>
-        </div>
-
-        <div id="existing-profiles" class="hidden">
-            <h1>Selecione um perfil</h1>
-            {% if profiles %}
-                <ul>
-                    {% for id, data in profiles.items() %}
-                        <li><a href="/perfil/{{ id }}">{{ data.name or "Usuário " ~ id }}</a></li>
-                    {% endfor %}
-                </ul>
-            {% else %}
-                <p>Não há perfis cadastrados.</p>
-            {% endif %}
-        </div>
-
         <div id="formulario-perfil">
             <label for="name">Seu nome:</label>
             <input type="text" id="name" name="name" required 
@@ -94,19 +78,30 @@
     <script>
         // Modal Logic
         const modal = document.getElementById("introModal");
+        const fab = document.getElementById("infoFab");
+
+        // Função para abrir o modal
+        function openModal() {
+            modal.style.display = "block";
+            fab.style.display = "none";
+        }
 
         // Função para fechar o modal
         function closeModal() {
             modal.style.display = "none";
-            // Marca na sessão que o intro já foi visto (chave atualizada para resetar para usuários antigos)
-            sessionStorage.setItem('introShown_v2', 'true');
+            fab.style.display = "block"; // Mostra o botão flutuante
+            // Marca na sessão que o intro já foi visto
+            sessionStorage.setItem('introShown_v3', 'true');
         }
 
-        // Ao carregar a página, verifica se deve mostrar o modal
+        // Ao carregar a página
         window.addEventListener('load', function() {
-            // Se NÃO tiver a flag 'introShown_v2' na sessão, mostra o modal
-            if (!sessionStorage.getItem('introShown_v2')) {
-                modal.style.display = "block";
+            // Se NÃO tiver a flag, mostra modal
+            if (!sessionStorage.getItem('introShown_v3')) {
+                openModal();
+            } else {
+                // Se já viu, mostra só o botão flutuante
+                fab.style.display = "block";
             }
         });
 
@@ -123,10 +118,7 @@
             const errorMsg = document.getElementById('genre-error');
             let checkedOne = Array.prototype.slice.call(checkboxes).some(x => x.checked);
 
-            // Verifica se está na tela de "Criar perfil" (se o formulario-perfil não está hidden)
-            const formVisible = !document.getElementById('formulario-perfil').classList.contains('hidden');
-
-            if (formVisible && !checkedOne) {
+            if (!checkedOne) {
                 e.preventDefault(); // Impede o envio
                 errorMsg.style.display = 'block';
             } else {