try to fix this spaghetti of a code

public/login.html

@@ -4,26 +4,24 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Login</title>
+    <link rel="stylesheet" href="shared.css">
     <link rel="stylesheet" href="styles_login.css">
     <link rel="icon" href="gambling.png" type="image/x-icon">
 </head>
 <body>
 <h1>Login / Register</h1>
 <form method="post" action="/login">
-    <input type="text" name="username" placeholder="Username">
-    <input type="password" name="password" placeholder="Password">
+    <label for="username">Username</label>
+    <input id="username" type="text" name="username" placeholder="Username" autocomplete="username" maxlength="40" required>
+    <label for="password">Password</label>
+    <input id="password" type="password" name="password" placeholder="Password" autocomplete="current-password" required aria-describedby="password-hint">
+    <small id="password-hint">Passwords support up to 72 UTF-8 bytes.</small>
     <div class="auth-actions">
         <button type="submit" id="login-button">Login</button>
         <button type="button" id="register-button">Register</button>
     </div>
-    <p id="auth-error" class="auth-error hidden"></p>
+    <p id="auth-error" role="alert" aria-live="polite" class="auth-error hidden"></p>
 </form>
-<div id="loading-screen" class="hidden">
-    <div class="loading-text" id="loading-text">Loading...</div>
-    <div class="progress-bar">
-        <div class="progress" id="progress"></div>
-    </div>
-</div>
 </body>
 <script src="frontend_login.js"></script>
 </html>