From f70a3323ef5ffa0cc5209c9b25aef6fb8cc8ab7d Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Mon, 28 Sep 2026 12:07:47 +0200
Subject: [PATCH] =?UTF-8?q?Weiterer=20Feinschliff:=20Prim=C3=A4r-CTA,=20Ba?=
 =?UTF-8?q?dges,=20Kartenakzente?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Zweite Polish-Runde nach dem letzten Commit, wieder additiv:

- Primäre Aktion auf der Startseite ("In meiner Nähe") hebt sich jetzt mit
  Amber-Verlauf + Glow von der sekundären ab, statt nur per Rahmenfarbe -
  klarere visuelle Hierarchie auf den ersten Blick.
- Glocken-Badge pulsiert dezent, solange ungelesene Benachrichtigungen
  vorliegen, statt ein statischer Punkt zu sein.
- Favoriten-Stern-Button: aktiver Zustand jetzt mit Hintergrund-Tönung statt
  nur Rahmenfarbe, plus Hover für den inaktiven Zustand.
- Such-Ergebniszeilen mit sanftem Hover-Verschieben statt hartem Wechsel.
- Einstellungen/Verbindungstest-Karten bekommen denselben Amber-Akzentbalken
  wie die Panel-Überschriften - konsistent mit dem Rest der App statt wie
  ein Fremdkörper aus der letzten Runde.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01De7H8hR1Q9DdgyuS2ukN6y
---
 styles.css | 45 +++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 41 insertions(+), 4 deletions(-)

diff --git a/styles.css b/styles.css
index dbce95c..762d8f1 100644
--- a/styles.css
+++ b/styles.css
@@ -210,6 +210,7 @@ button {
   padding: 10px 12px;
   border-radius: 6px;
   font-size: 14px;
+  transition: background .12s ease, transform .12s ease;
 }
 
 .search-result:hover,
@@ -218,6 +219,7 @@ button {
   background: var(--panel);
   outline: 2px solid var(--signal-amber);
   outline-offset: -2px;
+  transform: translateX(2px);
 }
 
 .search-result--empty {
@@ -431,11 +433,15 @@ button {
   border-radius: var(--radius);
   padding: 8px 14px;
   font-size: 13px;
+  transition: border-color .15s ease, background .15s ease, color .15s ease, box-shadow .15s ease;
 }
+.favorite-toggle:hover { border-color: var(--ink-muted); }
 
 .favorite-toggle.is-active {
   color: var(--signal-amber);
   border-color: var(--signal-amber);
+  background: var(--signal-amber-soft);
+  box-shadow: 0 0 0 1px rgba(245, 166, 35, 0.15);
 }
 
 @keyframes favorite-pop {
@@ -1215,6 +1221,11 @@ button:active { transform: translateY(1px); }
   border-radius: 50%;
   background: var(--signal-red);
   border: 1.5px solid var(--panel-raised);
+  animation: badge-pulse 2s ease-in-out infinite;
+}
+@keyframes badge-pulse {
+  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 93, 108, 0.45); }
+  50% { box-shadow: 0 0 0 4px rgba(255, 93, 108, 0); }
 }
 
 .favorites-bar { display: none; }
@@ -1281,7 +1292,17 @@ button:active { transform: translateY(1px); }
 .favorite-card:hover {
   transform: translateY(-2px);
   box-shadow: var(--shadow-md);
-}.action-card--primary { border-color: rgba(245,166,35,.45); }
+}
+.action-card--primary {
+  border-color: rgba(245, 166, 35, .45);
+  background: linear-gradient(155deg, rgba(245,166,35,.16), rgba(245,166,35,.04) 65%), var(--panel);
+  box-shadow: var(--shadow-glow-amber);
+}
+.action-card--primary:hover {
+  border-color: var(--signal-amber);
+  background: linear-gradient(155deg, rgba(245,166,35,.22), rgba(245,166,35,.06) 65%), var(--panel-raised);
+}
+.action-card--primary .action-card__icon { color: var(--signal-amber); }
 .action-card__icon { font-size: 23px; }
 .action-card strong, .action-card small { display: block; }
 .action-card small { color: var(--ink-muted); margin-top: 3px; font-size: 12px; }
@@ -1589,18 +1610,34 @@ button:active { transform: translateY(1px); }
 .recent-item__remove:hover { background: var(--panel-raised); color: var(--signal-red); }
 .recent-empty { color: var(--ink-muted); font-size: 12px; padding: 8px 0; }
 
+.connection-check,
+.settings-section {
+  position: relative;
+  overflow: hidden;
+}
+.connection-check::before,
+.settings-section::before {
+  content: '';
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  width: 3px;
+  background: linear-gradient(180deg, var(--signal-amber), transparent);
+}
+
 .connection-check {
   background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
-  padding: 12px 14px; display: flex; flex-direction: column; gap: 8px;
+  padding: 12px 14px 12px 18px; display: flex; flex-direction: column; gap: 8px;
 }
 .connection-check__row { display: flex; align-items: center; justify-content: space-between; font-size: 13px; }
-.connection-status { color: var(--ink-muted); font-weight: 600; }
+.connection-status { color: var(--ink-muted); font-weight: 600; transition: color .15s ease; }
 .connection-status--ok { color: var(--signal-green); }
 .connection-status--error { color: var(--signal-red); }
 
 .settings-section {
   background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
-  padding: 14px 16px; margin-bottom: 16px;
+  padding: 14px 16px 14px 20px; margin-bottom: 16px;
 }
 .settings-section .section-heading { margin-bottom: 10px; }
 .settings-toggle {