Zastap useState(view) routingiem opartym o react-router-dom

Rdzen migracji - kazdy widok ma wlasny adres URL:
- render {view === '...'} zastapiony przez <Routes> z 31 trasami
- usuniete: type View, PROTECTED_VIEWS, proteza #login, stan view/mapCity/
  mapOfferType/selectedListingId/messageThreadTarget
- prop onNavigate (166 wystapien) zastapiony hookiem useNavigate w komponentach
- /oferta/:id czyta identyfikator z adresu (ListingDetailRoute)
- /mapa?miasto=&typ= czyta parametry z query stringa (MapSearchRoute)
- dane przejsciowe miedzy trasami (watek wiadomosci, oferta do negocjacji)
  przekazywane w location.state zamiast globalnego stanu
- ProtectedRoute na trasach konta, requireAdmin na /admin
- powrot do zamierzonego celu po zalogowaniu (location.state.from)
- Header i AccountSidebar: <button> -> <NavLink>, aktywnosc z adresu
- strona 404 dla nieznanych adresow
- CSS: selektory menu rozszerzone o warianty <a> (wyglad bez zmian)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/styles.css

@@ -86,13 +86,13 @@ svg {
   row-gap: 6px;
 }
 
-.header-admin .nav button {
+.header-admin .nav button, .header-admin .nav a {
   color: #dbe4f0;
   font-size: 12px;
   padding: 8px 0;
 }
 
-.header-admin .nav button.active::after {
+.header-admin .nav button.active::after, .header-admin .nav a.active::after {
   bottom: 2px;
 }
 
@@ -194,7 +194,7 @@ svg {
   min-width: 0;
 }
 
-.nav button {
+.nav button, .nav a {
   background: transparent;
   border: 0;
   color: #111a2e;
@@ -206,7 +206,7 @@ svg {
   white-space: nowrap;
 }
 
-.nav button.active::after {
+.nav button.active::after, .nav a.active::after {
   background: #13a360;
   border-radius: 999px;
   bottom: 20px;
@@ -10798,7 +10798,7 @@ svg {
     gap: 17px;
   }
 
-  .nav button,
+  .nav button, .nav a,
   .icon-text span {
     font-size: 12px;
   }
@@ -11003,11 +11003,11 @@ svg {
     padding-bottom: 4px;
   }
 
-  .nav button {
+  .nav button, .nav a {
     padding: 8px 0 12px;
   }
 
-  .nav button.active::after {
+  .nav button.active::after, .nav a.active::after {
     bottom: 3px;
   }
 
@@ -13947,7 +13947,7 @@ svg {
   text-transform: uppercase;
 }
 
-.account-menu button {
+.account-menu button, .account-menu a {
   align-items: center;
   background: transparent;
   border: 0;
@@ -13964,12 +13964,12 @@ svg {
   width: 100%;
 }
 
-.account-menu button svg {
+.account-menu button svg, .account-menu a svg {
   color: #7d8ca0;
   font-size: 14px;
 }
 
-.account-menu button span {
+.account-menu button span, .account-menu a span {
   background: #e8f8ef;
   border-radius: 999px;
   color: #109253;
@@ -13978,13 +13978,13 @@ svg {
   padding: 1px 6px;
 }
 
-.account-menu button .tag {
+.account-menu button .tag, .account-menu a .tag {
   border-radius: 4px;
   font-size: 9px;
   padding: 1px 5px;
 }
 
-.account-menu button.active {
+.account-menu button.active, .account-menu a.active {
   background: #ebf6f0;
   color: #109253;
 }
@@ -17044,7 +17044,7 @@ svg {
 .account-alerts article > span svg,
 .account-searches article > span svg,
 .account-tools article > span svg,
-.account-menu button svg {
+.account-menu button svg, .account-menu a svg {
   height: 14px;
   width: 14px;
 }
@@ -26752,3 +26752,24 @@ svg {
 
 /* Routing: stan wczytywania profilu przy wejsciu na trase chroniona */
 .route-loading { padding: 80px 24px; text-align: center; color: #5b6472; font-size: 15px; font-weight: 600; }
+
+/* Routing: NavLink/Link renderuja <a> - zerujemy domyslne style linku,
+   zeby menu wygladalo dokladnie tak jak wczesniejsze <button>. */
+.nav a,
+.account-menu a,
+.brand,
+.icon-text {
+  color: inherit;
+  cursor: pointer;
+  text-decoration: none;
+}
+
+.not-found-page { display: grid; padding: 90px 24px 120px; place-items: center; }
+.not-found-shell { max-width: 520px; text-align: center; }
+.not-found-shell h1 { color: #13a360; font-size: 88px; font-weight: 900; line-height: 1; margin: 0; }
+.not-found-shell h2 { color: #111a2e; font-size: 24px; font-weight: 800; margin: 16px 0 8px; }
+.not-found-shell p { color: #5b6472; font-size: 15px; margin: 0 0 28px; }
+.not-found-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
+.not-found-actions a { border-radius: 10px; font-size: 14px; font-weight: 800; padding: 12px 22px; text-decoration: none; }
+.not-found-primary { background: #13a360; color: #ffffff; }
+.not-found-secondary { border: 1px solid #d5dde7; color: #27384f; }