diff --git a/src/SentenceStudio.UI/Pages/Index.razor b/src/SentenceStudio.UI/Pages/Index.razor
index b516afa8..ada59ce5 100644
--- a/src/SentenceStudio.UI/Pages/Index.razor
+++ b/src/SentenceStudio.UI/Pages/Index.razor
@@ -472,34 +472,44 @@ else if (vocabSummary is not null)
     var total = vocabSummary.New + vocabSummary.Learning + vocabSummary.Familiar + vocabSummary.Review + vocabSummary.Known;
     <div class="row g-3 mb-4">
         <div class="col-6 col-md">
-            <div class="card card-ss p-3 text-center">
-                <div class="fs-3 fw-bold" style="color: var(--bs-primary);">@vocabSummary.New</div>
-                <div class="text-secondary-ss small">@Localize["Dashboard_VocabNew"]</div>
-            </div>
+            <a href="/vocabulary?q=status:new" class="text-decoration-none">
+                <div class="card card-ss p-3 text-center vocab-tile-hover">
+                    <div class="fs-3 fw-bold" style="color: var(--bs-primary);">@vocabSummary.New</div>
+                    <div class="text-secondary-ss small">@Localize["Dashboard_VocabNew"]</div>
+                </div>
+            </a>
         </div>
         <div class="col-6 col-md">
-            <div class="card card-ss p-3 text-center">
-                <div class="fs-3 fw-bold text-warning-ss">@vocabSummary.Learning</div>
-                <div class="text-secondary-ss small">@Localize["Dashboard_VocabLearning"]</div>
-            </div>
+            <a href="/vocabulary?q=status:learning" class="text-decoration-none">
+                <div class="card card-ss p-3 text-center vocab-tile-hover">
+                    <div class="fs-3 fw-bold text-warning-ss">@vocabSummary.Learning</div>
+                    <div class="text-secondary-ss small">@Localize["Dashboard_VocabLearning"]</div>
+                </div>
+            </a>
         </div>
         <div class="col-6 col-md">
-            <div class="card card-ss p-3 text-center">
-                <div class="fs-3 fw-bold" style="color: var(--bs-info);">@vocabSummary.Familiar</div>
-                <div class="text-secondary-ss small"><i class="bi bi-star me-1"></i>@Localize["Dashboard_VocabFamiliar"]</div>
-            </div>
+            <a href="/vocabulary?q=status:familiar" class="text-decoration-none">
+                <div class="card card-ss p-3 text-center vocab-tile-hover">
+                    <div class="fs-3 fw-bold" style="color: var(--bs-info);">@vocabSummary.Familiar</div>
+                    <div class="text-secondary-ss small"><i class="bi bi-star me-1"></i>@Localize["Dashboard_VocabFamiliar"]</div>
+                </div>
+            </a>
         </div>
         <div class="col-6 col-md">
-            <div class="card card-ss p-3 text-center">
-                <div class="fs-3 fw-bold text-warning-ss">@vocabSummary.Review</div>
-                <div class="text-secondary-ss small">@Localize["Dashboard_VocabReview"]</div>
-            </div>
+            <a href="/vocabulary?q=status:review" class="text-decoration-none">
+                <div class="card card-ss p-3 text-center vocab-tile-hover">
+                    <div class="fs-3 fw-bold text-warning-ss">@vocabSummary.Review</div>
+                    <div class="text-secondary-ss small">@Localize["Dashboard_VocabReview"]</div>
+                </div>
+            </a>
         </div>
         <div class="col-6 col-md">
-            <div class="card card-ss p-3 text-center">
-                <div class="fs-3 fw-bold text-success-ss">@vocabSummary.Known</div>
-                <div class="text-secondary-ss small">@Localize["Dashboard_VocabKnown"]</div>
-            </div>
+            <a href="/vocabulary?q=status:known" class="text-decoration-none">
+                <div class="card card-ss p-3 text-center vocab-tile-hover">
+                    <div class="fs-3 fw-bold text-success-ss">@vocabSummary.Known</div>
+                    <div class="text-secondary-ss small">@Localize["Dashboard_VocabKnown"]</div>
+                </div>
+            </a>
         </div>
     </div>
 
diff --git a/src/SentenceStudio.UI/Pages/Vocabulary.razor b/src/SentenceStudio.UI/Pages/Vocabulary.razor
index bbb6604c..e78c181a 100644
--- a/src/SentenceStudio.UI/Pages/Vocabulary.razor
+++ b/src/SentenceStudio.UI/Pages/Vocabulary.razor
@@ -158,9 +158,11 @@ else
         <select class="form-select form-control-ss" style="max-width: 160px;"
                 value="@CurrentStatus" @onchange="OnStatusDropdown">
             <option value="">All Status</option>
-            <option value="known">Known</option>
-            <option value="familiar">Familiar</option>
+            <option value="new">New</option>
             <option value="learning">Learning</option>
+            <option value="familiar">Familiar</option>
+            <option value="review">Review</option>
+            <option value="known">Known</option>
             <option value="unknown">Unknown</option>
         </select>
 
@@ -263,9 +265,11 @@ else
                     <select class="form-select form-control-ss"
                             value="@CurrentStatus" @onchange="OnStatusDropdown">
                         <option value="">All Status</option>
-                        <option value="known">Known</option>
-                        <option value="familiar">Familiar</option>
+                        <option value="new">New</option>
                         <option value="learning">Learning</option>
+                        <option value="familiar">Familiar</option>
+                        <option value="review">Review</option>
+                        <option value="known">Known</option>
                         <option value="unknown">Unknown</option>
                     </select>
                 </div>
@@ -881,6 +885,18 @@ else
                         "familiar" => filtered.Where(v => v.StatusText == "Familiar"),
                         "learning" => filtered.Where(v => v.StatusText == "Learning"),
                         "unknown" => filtered.Where(v => v.StatusText == "Unknown"),
+                        // "new" = words never practiced (no progress OR progress with 0 attempts, excluding Familiar)
+                        "new" => filtered.Where(v => 
+                            v.Progress == null 
+                            || (v.Progress.TotalAttempts == 0 
+                                && !(v.Progress.IsUserDeclared && v.Progress.VerificationState == VerificationStatus.Pending))),
+                        // "review" = words past their NextReviewDate (not Familiar, not Known)
+                        "review" => filtered.Where(v => 
+                            v.Progress != null 
+                            && !(v.Progress.IsUserDeclared && v.Progress.VerificationState == VerificationStatus.Pending)
+                            && !v.Progress.IsKnown 
+                            && v.Progress.NextReviewDate != null 
+                            && v.Progress.NextReviewDate <= DateTime.Now),
                         _ => filtered
                     },
                     "tag" => filtered.Where(v =>
diff --git a/src/SentenceStudio.UI/wwwroot/css/app.css b/src/SentenceStudio.UI/wwwroot/css/app.css
index 9487e7b9..f0529d1a 100644
--- a/src/SentenceStudio.UI/wwwroot/css/app.css
+++ b/src/SentenceStudio.UI/wwwroot/css/app.css
@@ -1785,3 +1785,18 @@ main.main-content:has(.matching-page-wrapper) {
 .activity-dot-complete {
     box-shadow: 0 0 0 2px var(--bs-success);
 }
+
+/* Vocabulary tile hover effect */
+.vocab-tile-hover {
+    cursor: pointer;
+    transition: transform 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+
+.vocab-tile-hover:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
+
+.vocab-tile-hover:active {
+    transform: translateY(0);
+}