fix: style OIDC login button with divider line and icon

Replace the plain boxy btn-secondary with a modern outlined button
that has a login icon, horizontal "or" divider, and hover effects.

public/index.html

@@ -44,8 +44,11 @@
         <div id="login-error" class="wizard-error" hidden></div>
         <button id="btn-login-submit" class="btn-primary" style="width:100%;margin-top:8px">Sign In</button>
         <div id="oidc-login-section" hidden>
-          <div style="text-align:center;margin:12px 0 4px;color:var(--text-muted);font-size:12px">or</div>
-          <a id="btn-oidc-login" href="/api/auth/oidc/authorize" class="btn-secondary" style="width:100%;display:block;text-align:center;text-decoration:none">Sign in with SSO</a>
+          <div class="login-divider"><span>or</span></div>
+          <a id="btn-oidc-login" href="/api/auth/oidc/authorize" class="btn-oidc">
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"/><polyline points="10 17 15 12 10 7"/><line x1="15" y1="12" x2="3" y2="12"/></svg>
+            <span id="btn-oidc-login-label">Sign in with SSO</span>
+          </a>
         </div>
         <div style="text-align:center;margin-top:8px">
           <a href="#" id="link-forgot-password" style="font-size:12px;color:var(--text-muted)">Forgot password?</a>