Fix portal branding icons and system info

cezen-portal/login.html

@@ -6,7 +6,16 @@
   <title>Sign In — Nexus One AI</title>
   <link rel="stylesheet" href="style.css?v=4">
   <style>
-    body { background: var(--navy); min-height: 100vh; display: flex; align-items: center; justify-content: center; }
+    body {
+      background:
+        radial-gradient(ellipse 80% 55% at  15%   5%, rgba(124,58,237,.18)  0%, transparent 60%),
+        radial-gradient(ellipse 60% 50% at  85%  95%, rgba(99,102,241,.14)  0%, transparent 60%),
+        linear-gradient(160deg, #f8f7ff 0%, #eef2ff 65%, #f5f0ff 100%);
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
 
     .login-wrap {
       width: 100%;
@@ -21,21 +30,22 @@
     .login-brand-name {
       font-size: 28px;
       font-weight: 800;
-      color: white;
+      color: var(--text-primary);
       letter-spacing: .5px;
     }
-    .login-brand-name span { color: var(--teal); }
+    .login-brand-name span { color: var(--brand); }
     .login-brand-sub {
       font-size: 13px;
-      color: rgba(255,255,255,.45);
+      color: var(--text-tertiary);
       margin-top: 6px;
     }
 
     .login-card {
       background:var(--navy2);
+      border: 1px solid var(--border);
       border-radius: 16px;
       padding: 36px 32px;
-      box-shadow: 0 24px 60px rgba(0,0,0,.4);
+      box-shadow: 0 24px 60px rgba(15,23,42,.16);
     }
 
     .login-title {
@@ -71,13 +81,13 @@
     }
     .login-input:focus {
       border-color: var(--teal);
-      box-shadow: 0 0 0 3px rgba(13,148,136,.12);
+      box-shadow: var(--shadow-focus);
     }
 
     .login-btn {
       width: 100%;
       padding: 13px;
-      background: var(--teal);
+      background: var(--brand);
       color: white;
       border: none;
       border-radius: 8px;
@@ -87,7 +97,7 @@
       margin-top: 8px;
       transition: background .15s, transform .1s;
     }
-    .login-btn:hover   { background: #0B7A70; }
+    .login-btn:hover   { background: var(--brand-hover); }
     .login-btn:active  { transform: scale(.98); }
     .login-btn:disabled { background: var(--xlt); cursor: not-allowed; }
 
@@ -107,9 +117,9 @@
       text-align: center;
       margin-top: 28px;
       font-size: 12px;
-      color: rgba(255,255,255,.3);
+      color: var(--text-tertiary);
     }
-    .login-footer a { color: rgba(255,255,255,.5); }
+    .login-footer a { color: var(--text-secondary); }
 
     .login-secure {
       display: flex;