Redesign the auth background and drop the icon badge.

The login/register backdrop (fluffy white cloud blobs + sun glow) read
as cheap. Replace it with a calmer, more premium take that stays in the
landing's blue/glass language: a deep brand gradient, a faint
infrastructure grid masked toward the edges, soft brand-blue glows and a
vignette. Remove the icon chip above the title on both pages.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

frontend/src/app/[lang]/login/page.tsx

@@ -3,7 +3,7 @@
 import { useState } from 'react';
 import { useAuthStore } from '@/lib/store';
 import { notify } from '@/lib/notify';
-import { LogIn, ArrowLeft } from 'lucide-react';
+import { ArrowLeft } from 'lucide-react';
 import { AuthShell } from '@/components/auth/AuthShell';
 import { AuthField } from '@/components/auth/AuthField';
 import { useT } from '@/i18n/I18nProvider';
@@ -33,7 +33,6 @@ export default function LoginPage() {
 
   return (
     <AuthShell
-      icon={<LogIn className="h-7 w-7" />}
       title={tl.title}
       subtitle={tl.subtitle}
       altPrompt={tl.altPrompt}

frontend/src/app/[lang]/register/page.tsx

@@ -3,7 +3,7 @@
 import { useState } from 'react';
 import { useAuthStore } from '@/lib/store';
 import { notify } from '@/lib/notify';
-import { UserPlus, ArrowLeft } from 'lucide-react';
+import { ArrowLeft } from 'lucide-react';
 import { AuthShell } from '@/components/auth/AuthShell';
 import { AuthField } from '@/components/auth/AuthField';
 import { useT } from '@/i18n/I18nProvider';
@@ -32,7 +32,6 @@ export default function RegisterPage() {
 
   return (
     <AuthShell
-      icon={<UserPlus className="h-7 w-7" />}
       title={tr.title}
       subtitle={tr.subtitle}
       altPrompt={tr.altPrompt}

frontend/src/components/auth/AuthShell.tsx

@@ -6,12 +6,11 @@ import { useT } from '@/i18n/I18nProvider';
 import { LanguageSwitcher } from '@/i18n/LanguageSwitcher';
 import { Logo } from '@/components/landing/Logo';
 
-// Cinematic auth shell that echoes the Abrban landing: a calm blue sky (the
-// "clear sky" finale), soft drifting clouds, a warm sun glow, the brand logo,
-// and the form inside a frosted dark-glass panel. Direction is inherited from
-// the locale-aware root layout.
+// Auth shell that carries the Abrban brand into a calmer, more premium key: a
+// deep blue gradient, a faint infrastructure grid, soft brand-blue glows and a
+// vignette — no fluffy clouds — with the form inside the same frosted dark-glass
+// panel used across the landing. Direction is inherited from the root layout.
 export function AuthShell({
-  icon,
   title,
   subtitle,
   children,
@@ -19,7 +18,6 @@ export function AuthShell({
   altHref,
   altLabel,
 }: {
-  icon: ReactNode;
   title: string;
   subtitle: string;
   children: ReactNode;
@@ -29,22 +27,20 @@ export function AuthShell({
 }) {
   const t = useT();
   return (
-    <div className="relative min-h-screen w-full overflow-hidden bg-gradient-to-b from-[#1b6fd0] via-[#589add] to-[#cfe6f7] text-white">
-      {/* Sky atmosphere: warm sun glow, drifting clouds, soft vignette */}
-      <div className="pointer-events-none absolute inset-0 overflow-hidden">
-        <div className="absolute right-[10%] top-[-10%] h-80 w-80 rounded-full bg-[radial-gradient(circle,_rgba(255,244,214,0.9),_rgba(255,236,190,0.28)_45%,_transparent_70%)] blur-2xl" />
-        <div className="abrban-float absolute left-[-6%] top-[20%] h-40 w-80 rounded-full bg-white/40 blur-3xl" />
-        <div
-          className="abrban-float absolute right-[-5%] top-[42%] h-44 w-96 rounded-full bg-white/30 blur-3xl"
-          style={{ animationDelay: '1.4s' }}
-        />
-        <div
-          className="abrban-float absolute bottom-[4%] left-[16%] h-40 w-[30rem] rounded-full bg-white/45 blur-3xl"
-          style={{ animationDelay: '0.7s' }}
-        />
-        <div className="absolute inset-0 bg-[radial-gradient(ellipse_at_center,_transparent_52%,_rgba(8,20,40,0.5)_100%)]" />
-        {/* Horizon: darken the lower area so the panel + footer link stay legible */}
-        <div className="absolute inset-x-0 bottom-0 h-3/5 bg-gradient-to-t from-[rgba(7,16,38,0.82)] via-[rgba(8,18,42,0.38)] to-transparent" />
+    <div className="relative min-h-screen w-full overflow-hidden bg-[#081427] text-white">
+      {/* Background atmosphere */}
+      <div className="pointer-events-none absolute inset-0">
+        {/* Deep brand gradient */}
+        <div className="absolute inset-0 bg-[radial-gradient(125%_120%_at_50%_-10%,#1f5aa0_0%,#0e2c57_45%,#081427_100%)]" />
+        {/* Fine infrastructure grid, faded toward the edges */}
+        <div className="absolute inset-0 opacity-[0.16] [background-image:linear-gradient(rgba(255,255,255,0.10)_1px,transparent_1px),linear-gradient(90deg,rgba(255,255,255,0.10)_1px,transparent_1px)] [background-size:54px_54px] [mask-image:radial-gradient(ellipse_at_center,black_45%,transparent_92%)] [-webkit-mask-image:radial-gradient(ellipse_at_center,black_45%,transparent_92%)]" />
+        {/* Soft brand-blue glows */}
+        <div className="absolute right-[-8%] top-[-12%] h-[30rem] w-[30rem] rounded-full bg-[radial-gradient(circle,_rgba(59,130,246,0.40),_transparent_70%)] blur-3xl" />
+        <div className="absolute bottom-[-14%] left-[-10%] h-[28rem] w-[28rem] rounded-full bg-[radial-gradient(circle,_rgba(37,99,235,0.34),_transparent_70%)] blur-3xl" />
+        {/* Crisp hairline along the very top */}
+        <div className="absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-white/25 to-transparent" />
+        {/* Vignette to focus the centre */}
+        <div className="absolute inset-0 bg-[radial-gradient(ellipse_at_center,_transparent_55%,_rgba(4,10,22,0.55)_100%)]" />
       </div>
 
       {/* Header */}
@@ -67,9 +63,6 @@ export function AuthShell({
       <main className="relative z-10 flex min-h-[calc(100vh-80px)] items-center justify-center px-4 pb-16">
         <div className="w-full max-w-md">
           <div className="mb-7 text-center">
-            <div className="mx-auto mb-4 inline-flex h-16 w-16 items-center justify-center rounded-2xl bg-white/12 text-white ring-1 ring-white/20 backdrop-blur-md">
-              {icon}
-            </div>
             <h1 className="abrban-ink text-3xl font-black tracking-tight sm:text-4xl">{title}</h1>
             <p className="abrban-ink mt-2 text-white/85">{subtitle}</p>
           </div>