feat: adiciona barra de botoes de atalho rapido de modo (musica, video, imagem, chat) no rodape com validacao cruzada

public/style.css

@@ -2103,3 +2103,92 @@ code {
   from { opacity: 0; transform: translateY(8px); }
   to { opacity: 1; transform: translateY(0); }
 }
+
+/* ==========================================================================
+   BARRA DE MODOS DE PROMPT RÁPIDOS (RODAPÉ DO INPUT)
+   ========================================================================== */
+.prompt-modes-bar {
+  display: flex;
+  gap: 8px;
+  margin-bottom: 8px;
+  overflow-x: auto;
+  padding: 4px 2px;
+  scrollbar-width: none; /* Firefox */
+  -ms-overflow-style: none; /* IE/Edge */
+}
+
+.prompt-modes-bar::-webkit-scrollbar {
+  display: none; /* Chrome, Safari, Opera */
+}
+
+.btn-prompt-mode {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  background-color: var(--bg-secondary);
+  border: 1px solid var(--border-light);
+  border-radius: 20px;
+  padding: 6px 14px;
+  color: var(--text-secondary);
+  font-size: 12px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: all var(--transition-fast) cubic-bezier(0.4, 0, 0.2, 1);
+  white-space: nowrap;
+  font-family: var(--font-sans);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+}
+
+.btn-prompt-mode:hover {
+  transform: translateY(-1.5px);
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  background-color: var(--bg-tertiary);
+}
+
+.btn-prompt-mode:active {
+  transform: translateY(0);
+}
+
+.btn-prompt-mode .mode-icon {
+  font-size: 14px;
+}
+
+/* Modo Música: Estilos e Cores (Roxo/Violeta) */
+.btn-prompt-mode.mode-music {
+  border-color: rgba(168, 85, 247, 0.3);
+}
+.btn-prompt-mode.mode-music:hover {
+  border-color: rgb(168, 85, 247);
+  background-color: rgba(168, 85, 247, 0.06);
+  color: rgb(216, 180, 254);
+}
+
+/* Modo Vídeo: Estilos e Cores (Azul/Ciano) */
+.btn-prompt-mode.mode-video {
+  border-color: rgba(6, 182, 212, 0.3);
+}
+.btn-prompt-mode.mode-video:hover {
+  border-color: rgb(6, 182, 212);
+  background-color: rgba(6, 182, 212, 0.06);
+  color: rgb(165, 243, 252);
+}
+
+/* Modo Imagem: Estilos e Cores (Laranja/Rosa) */
+.btn-prompt-mode.mode-image {
+  border-color: rgba(249, 115, 22, 0.3);
+}
+.btn-prompt-mode.mode-image:hover {
+  border-color: rgb(249, 115, 22);
+  background-color: rgba(249, 115, 22, 0.06);
+  color: rgb(253, 186, 116);
+}
+
+/* Modo Texto/História: Estilos e Cores (Verde Kemily) */
+.btn-prompt-mode.mode-text {
+  border-color: rgba(16, 163, 127, 0.3);
+}
+.btn-prompt-mode.mode-text:hover {
+  border-color: var(--brand-green);
+  background-color: rgba(16, 163, 127, 0.06);
+  color: rgb(167, 243, 208);
+}