#575: IT-P brand icon + login hero image

Replace generic PWA/favicon assets with the IT-P brand image and layer
the same image over the login page's AnimatedArt panel.

- Generated icon-192/512, maskable-512, and apple-touch-icon (180) from
  the attached IT-P photo via ImageMagick (center crop 1110x1110, then
  resize). Maskable has #0B1E3F padding so the safe zone is respected
  on Android adaptive icons.
- Copied source as public/brand-itp.jpg for the login hero.
- index.html: added explicit PNG icon links (192, 512) before the
  existing favicon.svg fallback, plus cache-bust query (?v=itp1) on
  apple-touch-icon so iPad PWA re-installs pick up the new artwork.
- manifest.webmanifest: same ?v=itp1 cache-bust on all icon entries.
- login.tsx: layered IT-P image over AnimatedArt with mix-blend-screen
  (opacity 90%) plus top/bottom and right-edge dark gradients so the
  composition reads as one piece and the right edge fades cleanly into
  the form panel. Still hidden on < lg per scope.

Did not change favicon.svg itself (kept as last-resort vector
fallback). Mobile (< lg) shows no hero — explicit choice per plan
("إخفاؤها بشكل مدروس").

artifacts/tx-os/index.html

@@ -4,6 +4,8 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1, interactive-widget=resizes-content" />
     <title>Tx OS</title>
+    <link rel="icon" type="image/png" sizes="192x192" href="/icons/icon-192.png?v=itp1" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/icons/icon-512.png?v=itp1" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <!--
       PWA / "Add to Home Screen" — when the user installs Tx OS to the
@@ -15,7 +17,7 @@
       remove and re-add the icon to pick up the manifest.
     -->
     <link rel="manifest" href="/manifest.webmanifest" />
-    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png?v=itp1" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-status-bar-style" content="default" />

artifacts/tx-os/public/manifest.webmanifest

@@ -9,19 +9,19 @@
   "theme_color": "#0B1E3F",
   "icons": [
     {
-      "src": "/icons/icon-192.png",
+      "src": "/icons/icon-192.png?v=itp1",
       "sizes": "192x192",
       "type": "image/png",
       "purpose": "any"
     },
     {
-      "src": "/icons/icon-512.png",
+      "src": "/icons/icon-512.png?v=itp1",
       "sizes": "512x512",
       "type": "image/png",
       "purpose": "any"
     },
     {
-      "src": "/icons/icon-maskable-512.png",
+      "src": "/icons/icon-maskable-512.png?v=itp1",
       "sizes": "512x512",
       "type": "image/png",
       "purpose": "maskable"

artifacts/tx-os/src/pages/login.tsx

@@ -66,9 +66,33 @@ export default function LoginPage() {
         {lang === "ar" ? "EN" : "عربي"}
       </button>
 
-      {/* Animated art panel — hidden on small screens, no logo, no text */}
+      {/* Animated art panel — IT-P brand image layered over animated art.
+          Hidden on small screens. The image sits above AnimatedArt with a
+          soft gradient overlay so the lines/orbs still bleed through at the
+          edges and the composition reads as one piece. */}
       <div className="hidden lg:block lg:w-1/2 relative overflow-hidden shrink-0">
         <AnimatedArt />
+        <div
+          className="absolute inset-0 bg-center bg-cover bg-no-repeat opacity-90 mix-blend-screen"
+          style={{ backgroundImage: "url('/brand-itp.jpg?v=itp1')" }}
+          aria-hidden
+        />
+        <div
+          className="absolute inset-0"
+          style={{
+            background:
+              "linear-gradient(180deg, rgba(11,30,63,0.35) 0%, rgba(11,30,63,0) 30%, rgba(11,30,63,0) 70%, rgba(11,30,63,0.6) 100%)",
+          }}
+          aria-hidden
+        />
+        <div
+          className="absolute inset-y-0 right-0 w-24"
+          style={{
+            background:
+              "linear-gradient(90deg, rgba(11,30,63,0) 0%, rgba(11,30,63,0.5) 100%)",
+          }}
+          aria-hidden
+        />
       </div>
 
       {/* Form panel */}