diff --git a/client/src/pages/horoscope.tsx b/client/src/pages/horoscope.tsx
index 336a546..c7eaff4 100644
--- a/client/src/pages/horoscope.tsx
+++ b/client/src/pages/horoscope.tsx
@@ -62,7 +62,7 @@ function SignGrid({ onSelect, selectedIndex, aiHoroscopes }: { onSelect: (i: num
         <Star className="w-5 h-5 text-primary" />
         Ihr Sternzeichen wählen
       </h2>
-      <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-3">
+      <div className="grid grid-cols-2 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
         {SIGNS.map((sign, i) => {
           const ec = ELEMENT_COLORS[sign.element];
           const aiH = aiHoroscopes.find(h => h.signIndex === i);
@@ -84,17 +84,17 @@ function SignGrid({ onSelect, selectedIndex, aiHoroscopes }: { onSelect: (i: num
                   src={(horoscope as any).imageUrl}
                   alt={`Sternzeichen ${sign.name}`}
                   loading="lazy"
-                  className="w-full h-24 object-cover rounded-lg mb-3"
+                  className="w-full h-40 md:h-44 object-cover rounded-lg mb-3"
                 />
               )}
               <div className="flex items-center gap-2 mb-2">
                 <span className="text-2xl">{sign.symbol}</span>
                 <div>
-                  <span className={`text-sm font-semibold block ${isSelected ? ec.text : "text-foreground"}`}>{sign.name}</span>
-                  <span className="text-[10px] text-muted-foreground">{sign.date}</span>
+                  <span className={`text-base font-semibold block ${isSelected ? ec.text : "text-foreground"}`}>{sign.name}</span>
+                  <span className="text-[11px] text-muted-foreground">{sign.date}</span>
                 </div>
               </div>
-              <p className="text-[11px] text-foreground/60 leading-relaxed line-clamp-3">{horoscope.general.substring(0, 100)}...</p>
+              <p className="text-xs text-foreground/70 leading-relaxed line-clamp-4">{horoscope.general.substring(0, 180)}...</p>
               <div className="flex items-center gap-1 mt-2 text-[10px] text-primary">
                 Lesen <ArrowRight className="w-3 h-3" />
               </div>
@@ -116,6 +116,7 @@ function SignDetail({ signIndex, onNavigate, aiHoroscopes }: { signIndex: number
   const dailyColor = getDailyColor(signIndex);
   const detailRef = useRef<HTMLDivElement>(null);
   const isAI = !!aiH;
+  const imgFor = (i: number) => aiHoroscopes.find((h) => h.signIndex === i)?.imageUrl || null;
 
   const prevIndex = (signIndex - 1 + SIGNS.length) % SIGNS.length;
   const nextIndex = (signIndex + 1) % SIGNS.length;
@@ -309,6 +310,14 @@ function SignDetail({ signIndex, onNavigate, aiHoroscopes }: { signIndex: number
                   className={`${sEc.bg} hover:opacity-80 border ${sEc.border} rounded-lg p-3 transition-all text-left`}
                   data-testid={`button-sign-other-${s.name.toLowerCase()}`}
                 >
+                  {imgFor(origIdx) && (
+                    <img
+                      src={imgFor(origIdx)!}
+                      alt={`Tageshoroskop ${s.name}`}
+                      loading="lazy"
+                      className="w-full h-20 object-cover rounded-md mb-2"
+                    />
+                  )}
                   <div className="flex items-center gap-2 mb-1">
                     <span className="text-xl">{s.symbol}</span>
                     <span className={`font-medium text-sm ${sEc.text}`}>{s.name}</span>
@@ -379,20 +388,9 @@ export default function HoroscopePage() {
       <InterstitialAd forceShow />
       <PageSideAds />
       <main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4">
-        <div className="flex items-center gap-3 mb-2">
-          <Link href="/">
-            <button className="text-muted-foreground hover:text-foreground transition-colors" data-testid="button-back-home">
-              <ChevronLeft className="w-5 h-5" />
-            </button>
-          </Link>
-          <h1 className="text-2xl font-bold text-foreground flex items-center gap-2" data-testid="text-horoscope-title">
-            <Star className="w-6 h-6 text-primary" />
-            Horoskop
-          </h1>
-        </div>
-        <p className="text-muted-foreground text-sm mb-8 ml-8" data-testid="text-horoscope-subtitle">
-          Entdecken Sie, was die Sterne für Sie bereithalten — Ihr persönliches Tageshoroskop für alle zwölf Sternzeichen.
-        </p>
+        <h1 className="sr-only" data-testid="text-horoscope-title">
+          Horoskop — Tageshoroskop für alle zwölf Sternzeichen
+        </h1>
 
         {aiLoading && (
           <div className="flex items-center gap-2 mb-6 text-sm text-primary bg-primary/10 border border-primary/20 rounded-lg px-4 py-2" data-testid="text-horoscope-loading">
@@ -408,13 +406,7 @@ export default function HoroscopePage() {
         <div ref={detailRef}>
           {selected !== null ? (
             <SignDetail signIndex={selected} onNavigate={handleSelect} aiHoroscopes={aiHoroscopes} />
-          ) : (
-            <div className="text-center py-16 bg-card rounded-xl border border-card-border" data-testid="text-horoscope-prompt">
-              <Sparkles className="w-16 h-16 text-primary mx-auto mb-4" />
-              <p className="text-muted-foreground text-lg">Wählen Sie oben Ihr Sternzeichen</p>
-              <p className="text-muted-foreground/60 text-sm mt-1">für Ihr persönliches Tages-, Wochen- und Monatshoroskop</p>
-            </div>
-          )}
+          ) : null}
         </div>
       </main>
       <Footer />