diff --git a/src/app/globals.css b/src/app/globals.css
index e663bf4d..3ee7cc85 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -248,6 +248,7 @@ body {
 }
 .card-base {
   background-color: var(--color-navbar);
+  color: var(--color-navbar-text);
   border-radius: var(--radius-md);
   box-shadow: var(--shadow-card);
   border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);
@@ -292,6 +293,7 @@ a:hover {
 }
 .card {
   background: var(--color-navbar);
+  color: var(--color-navbar-text);
   border: 1px solid color-mix(in srgb, var(--color-text-muted) 12%, transparent);
   border-radius: var(--card-border-radius);
   box-shadow: var(--shadow-card);
@@ -457,6 +459,7 @@ tbody tr:hover {
 /* Cards used inside admin pages */
 .admin-card {
   background: var(--color-navbar);
+  color: var(--color-navbar-text);
   border: 1px solid var(--border);
   border-radius: 16px;
   box-shadow: var(--shadow-card);
@@ -571,7 +574,7 @@ tbody tr:hover {
   flex-direction: column;
   width: 100%;
   background: var(--color-navbar);
-  color: var(--color-text);
+  color: var(--color-navbar-text);
   border: 1px solid color-mix(in srgb, var(--color-text-muted) 12%, transparent);
   border-radius: var(--radius-lg);
   box-shadow: var(--shadow-card);
@@ -609,7 +612,7 @@ tbody tr:hover {
   font-weight: 700;
   font-size: 1rem;
   line-height: 1.3;
-  color: var(--color-text);
+  color: var(--color-navbar-text);
 }
 .content-card-subtitle {
   margin: 0.15rem 0 0;
diff --git a/src/app/news/page.tsx b/src/app/news/page.tsx
index 5580c5dc..849e002f 100644
--- a/src/app/news/page.tsx
+++ b/src/app/news/page.tsx
@@ -64,13 +64,13 @@ export default async function NewsPage() {
                   />
                 )}
                 <div style={{ padding: "1rem 1.1rem", flex: 1, display: "flex", flexDirection: "column" }}>
-                  <h3 style={{ margin: 0, fontSize: "1.05rem", color: "var(--color-text)", lineHeight: 1.4 }}>
+                  <h3 style={{ margin: 0, fontSize: "1.05rem", color: "var(--color-navbar-text)", lineHeight: 1.4 }}>
                     {a.title}
                   </h3>
                   <p className="muted" style={{ margin: "0.35rem 0 0.6rem", fontSize: "0.78rem" }}>
                     {formatDate(a.createdAt)}
                   </p>
-                  <p style={{ margin: 0, color: "var(--color-text)", fontSize: "0.88rem", lineHeight: 1.55 }}>
+                  <p style={{ margin: 0, color: "var(--color-navbar-text)", fontSize: "0.88rem", lineHeight: 1.55 }}>
                     {excerpt(a.shortStory, 150)}
                   </p>
                 </div>