fix: botao de ver senha no login ficava esticado pra largura total

.login-cartao button { width: 100%; } tinha mais especificidade CSS
que .botao-ver-senha e forcava o botao do olho a ocupar 100% da
largura do campo, jogando o icone (alinhado por padrao a esquerda no
flex) pro canto esquerdo por cima do input. Regra do width:100% agora
so mira o botao de submit; o campo de senha vira um wrapper flex
(input + botao lado a lado), mais robusto que posicionamento absoluto.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

app/templates/login.html

@@ -17,16 +17,23 @@
     .login-cartao h1 { font-size: 1.3rem; margin-bottom: 4px; }
     .login-subtitulo { color: var(--cor-texto-secundario); font-size: 0.9rem; margin: 0 0 20px; }
     .login-cartao form { text-align: left; }
-    .login-cartao button { width: 100%; }
+    .login-cartao > form > button[type="submit"] { width: 100%; }
-    .campo-senha { position: relative; }
+    .campo-senha {
-    .campo-senha input { padding-right: 40px; }
+      display: flex; align-items: center;
-    .botao-ver-senha {
+      border: 1px solid var(--cor-borda); border-radius: 8px; background: var(--cor-fundo);
-      position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
-      margin: 0; padding: 6px; width: auto; background: transparent; border: none;
-      color: var(--cor-texto-secundario); cursor: pointer; display: flex; align-items: center;
     }
-    .botao-ver-senha:hover { color: var(--cor-texto); }
+    .campo-senha input {
-    .botao-ver-senha svg { width: 18px; height: 18px; }
+      flex: 1; min-width: 0; border: none; background: transparent;
+    }
+    .campo-senha input:focus-visible { outline: none; }
+    .campo-senha:focus-within { outline: 2px solid var(--cor-acento); outline-offset: 2px; }
+    .campo-senha .botao-ver-senha {
+      flex-shrink: 0; margin: 0; padding: 0 12px; width: auto; height: 100%;
+      background: transparent; border: none; color: var(--cor-texto-secundario);
+      cursor: pointer; display: flex; align-items: center; justify-content: center;
+    }
+    .campo-senha .botao-ver-senha:hover { color: var(--cor-texto); }
+    .campo-senha .botao-ver-senha svg { width: 18px; height: 18px; }
   </style>
 </head>
 <body>