Okruszki nawigacyjne i CTA naglowka jako <Link>

- 16 przyciskow w breadcrumbach zamienionych na <Link> (semantyka linku,
  otwieranie w nowej karcie, podglad celu na hover)
- naglowek: "Moje konto" i "Dodaj ogloszenie za darmo" jako <Link>
- CSS breadcrumbow rozszerzony o warianty <a>, wyglad bez zmian
  (zweryfikowane zrzutami ekranu)

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

frontend/src/App.tsx

@@ -5141,9 +5141,9 @@ function DistrictRankingPage() {
     <section className="district-ranking-page" aria-label="Ranking dzielnic">
       <div className="district-ranking-shell">
         <div className="district-breadcrumb">
-          <button type="button" onClick={() => navigate(ROUTES.account)}>Panel główny</button>
+          <Link to={ROUTES.account}>Panel główny</Link>
           <Icon name="chevron" />
-          <button type="button" className="active" onClick={() => navigate(ROUTES.districtRanking)}>Ranking dzielnic</button>
+          <Link className="active" to={ROUTES.districtRanking}>Ranking dzielnic</Link>
         </div>
 
         <div className="district-ranking-title">
@@ -5272,9 +5272,9 @@ function NegotiationPage({
       <section className="negotiation-page" aria-label="Ile możesz utargować">
         <div className="negotiation-shell">
           <div className="negotiation-breadcrumb">
-            <button type="button" onClick={() => navigate(ROUTES.account)}>Panel główny</button>
+            <Link to={ROUTES.account}>Panel główny</Link>
             <Icon name="chevron" />
-            <button type="button" className="active" onClick={() => navigate(ROUTES.negotiation)}>Ile możesz utargować?</button>
+            <Link className="active" to={ROUTES.negotiation}>Ile możesz utargować?</Link>
           </div>
 
           <div className="negotiation-title">
@@ -5309,9 +5309,9 @@ function NegotiationPage({
     <section className="negotiation-page" aria-label="Ile możesz utargować">
       <div className="negotiation-shell">
         <div className="negotiation-breadcrumb">
-          <button type="button" onClick={() => navigate(ROUTES.account)}>Panel główny</button>
+          <Link to={ROUTES.account}>Panel główny</Link>
           <Icon name="chevron" />
-          <button type="button" className="active" onClick={() => navigate(ROUTES.negotiation)}>Ile możesz utargować?</button>
+          <Link className="active" to={ROUTES.negotiation}>Ile możesz utargować?</Link>
         </div>
 
         <div className="negotiation-title">
@@ -7287,9 +7287,9 @@ function AccountComparisonPage({ onOpenListing }: { onOpenListing: (id: number)
 
         <div className="comparison-main">
           <div className="comparison-breadcrumb">
-            <button type="button" onClick={() => navigate(ROUTES.home)}>Strona główna</button>
+            <Link to={ROUTES.home}>Strona główna</Link>
             <Icon name="chevron" />
-            <button type="button" className="active" onClick={() => navigate(ROUTES.comparison)}>Porównywarka mieszkań</button>
+            <Link className="active" to={ROUTES.comparison}>Porównywarka mieszkań</Link>
           </div>
 
           <div className="comparison-head">
@@ -14890,9 +14890,9 @@ function CreditCalculatorPage({ onSearchWithBudget }: { onSearchWithBudget: (max
     <section className="credit-page" aria-label="Kalkulator zdolności kredytowej">
       <div className="credit-shell">
         <div className="breadcrumb credit-breadcrumb">
-          <button type="button" onClick={() => navigate(ROUTES.guideBuying)}>Poradnik kupna</button>
+          <Link to={ROUTES.guideBuying}>Poradnik kupna</Link>
           <Icon name="chevron" />
-          <button type="button" className="active" onClick={() => navigate(ROUTES.creditCalculator)}>Kalkulator zdolności kredytowej</button>
+          <Link className="active" to={ROUTES.creditCalculator}>Kalkulator zdolności kredytowej</Link>
         </div>
         {pageBody}
       </div>
@@ -15058,9 +15058,9 @@ function ValuationPage() {
     <section className="valuation-page" aria-label="Wycena nieruchomości">
       <div className="valuation-shell">
         <div className="breadcrumb valuation-breadcrumb">
-          <button type="button" onClick={() => navigate(ROUTES.account)}>Panel główny</button>
+          <Link to={ROUTES.account}>Panel główny</Link>
           <Icon name="chevron" />
-          <button type="button" className="active" onClick={() => navigate(ROUTES.valuation)}>Wycena nieruchomości</button>
+          <Link className="active" to={ROUTES.valuation}>Wycena nieruchomości</Link>
         </div>
 
         <div className={`valuation-title ${isValuationResultStep ? 'result' : ''}`}>
@@ -16922,9 +16922,9 @@ function PriceHistoryPage({ user }: { user: AuthUser | null }) {
     <section className="history-page" aria-label="Historia cen">
       <div className="history-shell">
         <div className="breadcrumb history-breadcrumb">
-          <button type="button" onClick={() => navigate(ROUTES.account)}>Panel główny</button>
+          <Link to={ROUTES.account}>Panel główny</Link>
           <Icon name="chevron" />
-          <button type="button" className="active" onClick={() => navigate(ROUTES.priceHistory)}>Historia cen</button>
+          <Link className="active" to={ROUTES.priceHistory}>Historia cen</Link>
         </div>
 
         <div className="history-title">
@@ -18676,10 +18676,10 @@ function Header({
           </NavLink>
         )}
         {!isLoggedIn && (
-          <button className="icon-text" onClick={() => navigate(ROUTES.login)}>
+          <Link className="icon-text" to={ROUTES.login}>
             <Icon name="user" />
             <span>Moje konto</span>
-          </button>
+          </Link>
         )}
         {isLoggedIn && (
           <div className="account-menu-wrap" ref={accountMenuRef}>
@@ -18721,10 +18721,10 @@ function Header({
             )}
           </div>
         )}
-        <button className="post-button" onClick={() => navigate(ROUTES.add)}>
+        <Link className="post-button" to={ROUTES.add}>
           <span>Dodaj ogłoszenie za darmo</span>
           <small>0 zł • Bez prowizji</small>
-        </button>
+        </Link>
       </div>
     </header>
   );
@@ -19644,9 +19644,9 @@ function MessagesPage({
       <div className="messages-shell">
         <div className="messages-header">
           <div className="messages-breadcrumb" aria-label="Nawigacja wiadomości">
-            <button type="button" onClick={() => navigate(ROUTES.account)}>Panel główny</button>
+            <Link to={ROUTES.account}>Panel główny</Link>
             <Icon name="chevron" />
-            <button type="button" className="active" onClick={() => navigate(ROUTES.messages)}>Wiadomości</button>
+            <Link className="active" to={ROUTES.messages}>Wiadomości</Link>
           </div>
           <h1>Wiadomości</h1>
         </div>