Index: src/app/professor/profile/page.tsx
===================================================================
--- src/app/professor/profile/page.tsx	(revision 50f2fb4b186356bc63dde83200e8b04fe71d2c7a)
+++ src/app/professor/profile/page.tsx	(revision d7deae59461c29e9dd209dd391ce311c8eae7b63)
@@ -98,10 +98,10 @@
   const { t } = useTranslation();
   return (
-    <div className="flex justify-between items-center py-3 border-b border-gray-100 last:border-b-0">
-      <div className="flex items-center gap-2 text-gray-600 font-medium">
+    <div className="flex justify-between items-center py-3 border-b border-border last:border-b-0">
+      <div className="flex items-center gap-2 text-muted-foreground font-medium">
         {icon && <FontAwesomeIcon icon={icon} className="w-4 h-4" />}
         <span>{t(label)}:</span>
       </div>
-      <div className="text-gray-900 font-semibold text-right max-w-xs break-words">
+      <div className="text-card-foreground font-semibold text-right max-w-xs break-words">
         {value || t('n_a')}
       </div>
@@ -119,5 +119,5 @@
   const { t } = useTranslation();
   return (
-    <div className="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden">
+    <div className="bg-card rounded-xl shadow-sm border border-border overflow-hidden">
       <div className="bg-primary text-white px-6 py-4">
         <div className="flex items-center gap-3">
@@ -185,5 +185,5 @@
     return (
       <div className="min-h-screen pb-8">
-        <div className="bg-white rounded-xl shadow-sm border border-gray-100 p-6">{t('loading')}</div>
+        <div className="bg-card rounded-xl shadow-sm border border-border p-6">{t('loading')}</div>
       </div>
     );
@@ -208,6 +208,6 @@
         <div className="flex items-center gap-6">
           <div className="relative">
-            <div className="w-20 h-20 bg-white bg-opacity-20 rounded-full flex items-center justify-center border-2 border-white border-opacity-30">
-              <FontAwesomeIcon icon={faUser} className="text-3xl text-primary" />
+            <div className="w-20 h-20 bg-white rounded-full flex items-center justify-center border-2 border-white shadow-lg">
+              <FontAwesomeIcon icon={faUser} className="text-3xl text-[#0272D1]" />
             </div>
             <div className="absolute -bottom-1 -right-1 w-6 h-6 bg-green-500 rounded-full border-2 border-white"></div>
Index: src/app/professor/students/page.tsx
===================================================================
--- src/app/professor/students/page.tsx	(revision 50f2fb4b186356bc63dde83200e8b04fe71d2c7a)
+++ src/app/professor/students/page.tsx	(revision d7deae59461c29e9dd209dd391ce311c8eae7b63)
@@ -129,10 +129,10 @@
 
   return (
-    <div className="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
+    <div className="bg-card rounded-xl shadow-sm border border-border p-6">
       <div className="flex flex-col gap-4 md:flex-row md:items-end md:justify-between">
 
         <div>
-          <h1 className="text-2xl font-semibold text-gray-900">{t('prof_students_title')}</h1>
-          <p className="text-gray-700 mt-1">
+          <h1 className="text-2xl font-semibold text-card-foreground">{t('prof_students_title')}</h1>
+          <p className="text-muted-foreground mt-1">
             {t('prof_students_data_note')} <span className="font-mono">/api/prof/students</span> (demo store).
           </p>
@@ -141,7 +141,7 @@
         <div className="flex flex-col sm:flex-row gap-3">
           <div className="flex flex-col">
-            <label className="text-sm text-gray-700">{t('filter_by_subject')}</label>
+            <label className="text-sm text-muted-foreground">{t('filter_by_subject')}</label>
             <select
-              className="border border-gray-300 rounded-lg px-3 py-2"
+              className="border border-border rounded-lg px-3 py-2"
               value={subjectFilter}
               onChange={(e) => setSubjectFilter(e.target.value)}
@@ -159,7 +159,7 @@
 
           <div className="flex flex-col">
-            <label className="text-sm text-gray-700">{t('find_student_by_id')}</label>
+            <label className="text-sm text-muted-foreground">{t('find_student_by_id')}</label>
             <input
-              className="border border-gray-300 rounded-lg px-3 py-2"
+              className="border border-border rounded-lg px-3 py-2"
               placeholder={t('student_id_placeholder')}
               value={studentIdQuery}
@@ -177,12 +177,12 @@
 
       <div className="mt-6 overflow-x-auto">
-        <table className="min-w-full border border-gray-200 rounded-lg overflow-hidden">
-          <thead className="bg-gray-50">
+        <table className="min-w-full border border-border rounded-lg overflow-hidden">
+          <thead className="bg-accent">
             <tr>
-              <th className="text-left text-sm font-semibold text-gray-700 px-4 py-3 border-b">{t('student')}</th>
-              <th className="text-left text-sm font-semibold text-gray-700 px-4 py-3 border-b">{t('id')}</th>
-              <th className="text-left text-sm font-semibold text-gray-700 px-4 py-3 border-b">{t('subject')}</th>
-              <th className="text-left text-sm font-semibold text-gray-700 px-4 py-3 border-b">{t('grade')}</th>
-              <th className="text-left text-sm font-semibold text-gray-700 px-4 py-3 border-b">{t('actions')}</th>
+              <th className="text-left text-sm font-semibold text-muted-foreground px-4 py-3 border-b">{t('student')}</th>
+              <th className="text-left text-sm font-semibold text-muted-foreground px-4 py-3 border-b">{t('id')}</th>
+              <th className="text-left text-sm font-semibold text-muted-foreground px-4 py-3 border-b">{t('subject')}</th>
+              <th className="text-left text-sm font-semibold text-muted-foreground px-4 py-3 border-b">{t('grade')}</th>
+              <th className="text-left text-sm font-semibold text-muted-foreground px-4 py-3 border-b">{t('actions')}</th>
             </tr>
           </thead>
@@ -190,5 +190,5 @@
             {loading ? (
               <tr>
-                <td className="px-4 py-4 text-gray-700" colSpan={5}>
+                <td className="px-4 py-4 text-muted-foreground" colSpan={5}>
                   {t('loading')}
                 </td>
@@ -196,5 +196,5 @@
             ) : filteredRows.length === 0 ? (
               <tr>
-                <td className="px-4 py-4 text-gray-700" colSpan={5}>
+                <td className="px-4 py-4 text-muted-foreground" colSpan={5}>
                   {t('no_students_found')}
                 </td>
@@ -207,12 +207,12 @@
 
                 return (
-                  <tr key={key} className="hover:bg-gray-50">
-                    <td className="px-4 py-3 border-b text-gray-900">{r.studentName}</td>
-                    <td className="px-4 py-3 border-b text-gray-900">{r.studentIdStr}</td>
-                    <td className="px-4 py-3 border-b text-gray-900">{r.subjectName}</td>
+                  <tr key={key} className="hover:bg-accent">
+                    <td className="px-4 py-3 border-b text-card-foreground">{r.studentName}</td>
+                    <td className="px-4 py-3 border-b text-card-foreground">{r.studentIdStr}</td>
+                    <td className="px-4 py-3 border-b text-card-foreground">{r.subjectName}</td>
                     <td className="px-4 py-3 border-b">
                       <div className="flex items-center gap-3">
                         <select
-                          className="border border-gray-300 rounded-lg px-3 py-2"
+                          className="border border-border rounded-lg px-3 py-2"
                           value={selected}
                           onChange={(e) =>
@@ -229,5 +229,5 @@
                           ))}
                         </select>
-                        <span className="text-sm text-gray-600">
+                        <span className="text-sm text-muted-foreground">
                           {t('current')}: {r.grade > 0 ? r.grade : t('none')}
                         </span>