diff --git a/.github/workflows/pages.yml b/.github/workflows/pages.yml
new file mode 100644
index 0000000..5155206
--- /dev/null
+++ b/.github/workflows/pages.yml
@@ -0,0 +1,32 @@
+name: Deploy Prototype to Pages
+
+on:
+  push:
+    branches:
+      - claude/fitness-app-styling-7giJD
+      - main
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/configure-pages@v5
+      - uses: actions/upload-pages-artifact@v3
+        with:
+          path: fabio-antunes-app/prototype
+      - id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/fabio-antunes-app/prototype/assets/styles.css b/fabio-antunes-app/prototype/assets/styles.css
index adef3aa..7b8cbb7 100644
--- a/fabio-antunes-app/prototype/assets/styles.css
+++ b/fabio-antunes-app/prototype/assets/styles.css
@@ -5,8 +5,8 @@
 
 :root {
   /* Backgrounds */
-  --bg-base: #0A0A0A;
-  --bg-surface: #141414;
+  --bg-primary: #0A0A0A;
+  --bg-secondary: #1A1A1A;
   --bg-elevated: #1C1C1C;
   --bg-overlay: rgba(20, 20, 20, 0.85);
 
@@ -16,14 +16,14 @@
   --border-strong: #3A3A3A;
 
   /* Brand — Gold */
-  --gold: #DAAC2F;
-  --gold-light: #F5C75A;
-  --gold-dark: #CFA847;
+  --gold: #D4AF37;
+  --gold-light: #F4C430;
+  --gold-dark: #8B6914;
   --gold-muted: #8C7028;
-  --gold-glow: rgba(218, 172, 47, 0.18);
+  --gold-glow: rgba(212, 175, 55, 0.18);
 
   /* Text */
-  --text-primary: #FAFAFA;
+  --text-primary: #FFFFFF;
   --text-secondary: #B8B8B8;
   --text-tertiary: #6E6E6E;
   --text-quaternary: #4A4A4A;
@@ -58,7 +58,7 @@
 
   /* Shadows */
   --shadow-card: 0 4px 24px -8px rgba(0, 0, 0, 0.6);
-  --shadow-gold: 0 8px 32px -12px rgba(218, 172, 47, 0.4);
+  --shadow-gold: 0 8px 32px -12px rgba(212, 175, 55, 0.4);
 }
 
 /* Reset */
@@ -77,7 +77,7 @@ body {
   font-size: 15px;
   line-height: 1.5;
   color: var(--text-primary);
-  background: var(--bg-base);
+  background: var(--bg-primary);
   -webkit-tap-highlight-color: transparent;
   overscroll-behavior: none;
 }
@@ -96,9 +96,9 @@ a { color: inherit; text-decoration: none; }
   align-items: center;
   justify-content: center;
   background:
-    radial-gradient(circle at 20% 0%, rgba(218, 172, 47, 0.06) 0%, transparent 50%),
-    radial-gradient(circle at 80% 100%, rgba(218, 172, 47, 0.04) 0%, transparent 50%),
-    var(--bg-base);
+    radial-gradient(circle at 20% 0%, rgba(212, 175, 55, 0.06) 0%, transparent 50%),
+    radial-gradient(circle at 80% 100%, rgba(212, 175, 55, 0.04) 0%, transparent 50%),
+    var(--bg-primary);
   padding: var(--space-6) var(--space-4);
 }
 
@@ -106,7 +106,7 @@ a { color: inherit; text-decoration: none; }
   width: 100%;
   max-width: 412px;
   min-height: 100dvh;
-  background: var(--bg-base);
+  background: var(--bg-primary);
   position: relative;
   overflow: hidden;
 }
@@ -121,7 +121,7 @@ a { color: inherit; text-decoration: none; }
       0 0 0 8px #050505,
       0 0 0 9px #1a1a1a,
       0 40px 80px -20px rgba(0,0,0,0.8),
-      0 0 120px rgba(218, 172, 47, 0.05);
+      0 0 120px rgba(212, 175, 55, 0.05);
     overflow: hidden;
   }
 }
@@ -207,7 +207,7 @@ a { color: inherit; text-decoration: none; }
   width: 11px;
   height: 11px;
   background: var(--success);
-  border: 2px solid var(--bg-base);
+  border: 2px solid var(--bg-primary);
   border-radius: var(--radius-full);
 }
 
@@ -218,12 +218,16 @@ a { color: inherit; text-decoration: none; }
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: var(--space-3);
-  padding: var(--space-3) 0 var(--space-2);
+  padding: var(--space-3) 0 var(--space-3);
   border-bottom: 1px solid var(--border-subtle);
   margin: 0 var(--space-5) var(--space-4);
 }
-.brandbar-logo { width: 22px; height: 22px; }
+.brandbar-logo {
+  height: 44px;
+  width: auto;
+  max-width: 100%;
+  object-fit: contain;
+}
 .brandbar-text {
   font-size: 11px;
   letter-spacing: 0.24em;
@@ -241,8 +245,8 @@ a { color: inherit; text-decoration: none; }
   padding: var(--space-6);
   border-radius: var(--radius-lg);
   background:
-    linear-gradient(135deg, rgba(218, 172, 47, 0.08) 0%, transparent 50%),
-    var(--bg-surface);
+    linear-gradient(135deg, rgba(212, 175, 55, 0.08) 0%, transparent 50%),
+    var(--bg-secondary);
   border: 1px solid var(--border);
   overflow: hidden;
 }
@@ -341,7 +345,7 @@ a { color: inherit; text-decoration: none; }
   transition: transform 0.1s ease, box-shadow 0.2s ease;
   box-shadow: var(--shadow-gold);
 }
-.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 36px -10px rgba(218, 172, 47, 0.6); }
+.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 36px -10px rgba(212, 175, 55, 0.6); }
 .btn-primary:active { transform: translateY(0); }
 .btn-primary svg { width: 18px; height: 18px; }
 
@@ -380,7 +384,7 @@ a { color: inherit; text-decoration: none; }
   gap: var(--space-3);
 }
 .goal-card {
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
   padding: var(--space-4);
@@ -408,7 +412,7 @@ a { color: inherit; text-decoration: none; }
   content: '';
   position: absolute;
   inset: 4px;
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border-radius: 50%;
 }
 .ring svg {
@@ -447,7 +451,7 @@ a { color: inherit; text-decoration: none; }
   gap: var(--space-3);
 }
 .action {
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
   padding: var(--space-4);
@@ -500,7 +504,7 @@ a { color: inherit; text-decoration: none; }
 .coach-card {
   margin: 0 var(--space-5) var(--space-6);
   padding: var(--space-4);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
   display: flex;
@@ -587,7 +591,7 @@ a { color: inherit; text-decoration: none; }
   width: 40px;
   height: 40px;
   border-radius: var(--radius-full);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   display: grid;
   place-items: center;
@@ -621,15 +625,15 @@ a { color: inherit; text-decoration: none; }
   padding: var(--space-6);
   border-radius: var(--radius-lg);
   overflow: hidden;
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border);
 }
 .banner-bg {
   position: absolute;
   inset: 0;
   background:
-    radial-gradient(circle at 100% 0%, rgba(218, 172, 47, 0.18), transparent 60%),
-    radial-gradient(circle at 0% 100%, rgba(218, 172, 47, 0.08), transparent 50%);
+    radial-gradient(circle at 100% 0%, rgba(212, 175, 55, 0.18), transparent 60%),
+    radial-gradient(circle at 0% 100%, rgba(212, 175, 55, 0.08), transparent 50%);
   pointer-events: none;
 }
 .banner::before {
@@ -698,7 +702,7 @@ a { color: inherit; text-decoration: none; }
   gap: var(--space-3);
   margin: 0 var(--space-5) var(--space-6);
   padding: var(--space-4);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-left: 3px solid var(--gold);
   border-radius: var(--radius);
@@ -741,7 +745,7 @@ a { color: inherit; text-decoration: none; }
   align-items: center;
   gap: var(--space-3);
   padding: var(--space-3);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
   transition: all 0.15s ease;
@@ -880,7 +884,7 @@ a { color: inherit; text-decoration: none; }
   position: absolute;
   inset: 0;
   background:
-    radial-gradient(circle at 50% 50%, rgba(218, 172, 47, 0.12), transparent 60%);
+    radial-gradient(circle at 50% 50%, rgba(212, 175, 55, 0.12), transparent 60%);
 }
 .exercise-media-icon {
   width: 60%;
@@ -916,7 +920,7 @@ a { color: inherit; text-decoration: none; }
 .lastperf {
   margin: 0 var(--space-5) var(--space-6);
   padding: var(--space-4);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
 }
@@ -972,7 +976,7 @@ a { color: inherit; text-decoration: none; }
    Sets tracker
    ============================================ */
 .sets {
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
   padding: var(--space-3);
@@ -1034,7 +1038,7 @@ a { color: inherit; text-decoration: none; }
   outline: none;
   transition: border-color 0.15s ease, background 0.15s ease;
 }
-.set-input:focus { border-color: var(--gold); background: var(--bg-base); }
+.set-input:focus { border-color: var(--gold); background: var(--bg-primary); }
 .set.active .set-input { border-color: var(--gold-muted); }
 .set-input::placeholder { color: var(--text-quaternary); }
 
@@ -1161,7 +1165,7 @@ a { color: inherit; text-decoration: none; }
   font-weight: 600;
   color: var(--text-tertiary);
   border-radius: var(--radius-full);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   transition: all 0.15s ease;
 }
@@ -1178,7 +1182,7 @@ a { color: inherit; text-decoration: none; }
 .metric-card {
   margin: 0 var(--space-5) var(--space-6);
   padding: var(--space-5);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius-lg);
 }
@@ -1279,14 +1283,14 @@ a { color: inherit; text-decoration: none; }
   align-items: center;
   gap: var(--space-3);
   padding: var(--space-3) var(--space-4);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
   transition: border-color 0.15s ease;
 }
 .pr-card:hover { border-color: var(--gold-muted); }
 .pr-card.new {
-  background: linear-gradient(135deg, rgba(218, 172, 47, 0.1), transparent 60%), var(--bg-surface);
+  background: linear-gradient(135deg, rgba(212, 175, 55, 0.1), transparent 60%), var(--bg-secondary);
   border-color: var(--gold-muted);
 }
 .pr-icon {
@@ -1334,7 +1338,7 @@ a { color: inherit; text-decoration: none; }
 }
 .health-card {
   padding: var(--space-4);
-  background: var(--bg-surface);
+  background: var(--bg-secondary);
   border: 1px solid var(--border-subtle);
   border-radius: var(--radius);
 }
diff --git a/fabio-antunes-app/prototype/index.html b/fabio-antunes-app/prototype/index.html
index 90f4613..693cb0c 100644
--- a/fabio-antunes-app/prototype/index.html
+++ b/fabio-antunes-app/prototype/index.html
@@ -35,8 +35,7 @@ <h1 class="greeting-name">Servus, <span class="accent">Fabio</span></h1>
 
       <!-- Brand bar -->
       <div class="brandbar">
-        <img src="assets/logo.svg" class="brandbar-logo" alt="FA"/>
-        <div class="brandbar-text">Prime Coaching</div>
+        <img src="assets/logo.png" class="brandbar-logo" alt="Fabio Antunes — Prime Coaching"/>
       </div>
 
       <!-- Hero workout card -->