fix: use FontAwesome icons matching Players page (#8)

public/css/courses.css

@@ -367,11 +367,6 @@
     display: none;
 }
 
-/* ── Icon button spin state (keyframes defined in shared.css) ─── */
-
-.icon-btn.spinning {
-    animation: spin 0.8s linear infinite;
-}
 
 /* ── Tjing results ───────────────────────────────── */
 

views/partials/course-layouts.ejs

@@ -43,7 +43,7 @@
   <div class="inactive-layouts">
     <button class="inactive-toggle" type="button" onclick="toggleInactiveLayouts(this)" aria-expanded="false">
       <span>Inactive layouts (<%= inactiveLayouts.length %>) — Not played in last year</span>
-      <i class="icon-chev">&#9662;</i>
+      <i class="icon-chev fas fa-chevron-down"></i>
     </button>
     <ul class="layout-list inactive-layouts-body" hidden>
       <% inactiveLayouts.forEach(function(l) { %>

views/partials/course-table.ejs

@@ -24,8 +24,12 @@
       <div class="course-city"><%= course.city || '—' %></div>
       <div class="course-updated"><%= course.last_updated ? new Date(course.last_updated).toISOString().slice(0,10) : '—' %></div>
       <div class="course-actions">
-        <button class="icon-btn" onclick="event.stopPropagation(); scrapeLayouts(<%= course.id %>, this)" title="Refresh layouts">&#x21BB;</button>
-        <button class="icon-btn icon-chev" onclick="event.stopPropagation(); toggleCourseLayouts(<%= course.id %>)" title="Expand"><i>&#9662;</i></button>
+        <button class="icon-btn refresh-icon" onclick="event.stopPropagation(); scrapeLayouts(<%= course.id %>, this)" title="Refresh layouts" aria-label="Refresh layouts">
+          <i class="fas fa-sync-alt"></i>
+        </button>
+        <button class="icon-btn icon-chev" onclick="event.stopPropagation(); toggleCourseLayouts(<%= course.id %>)" title="Expand row" aria-label="Expand">
+          <i class="fas fa-chevron-down"></i>
+        </button>
       </div>
     </div>
     <div class="expanded-content" id="course-layouts-<%= course.id %>">