diff --git a/frontend/index.html b/frontend/index.html
index f399367..5576587 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -94,7 +94,7 @@
             box-shadow: 0 1px 0 0 var(--tab-bg);
         }
 
-        /* ── Linux Chrome ── */
+        /* ── Chrome (Linux + Mac) ── */
         /* Inactive: always inset dimensions, separator via ::before */
         .browser-chrome .tab {
             border-radius: 8px;
@@ -134,6 +134,37 @@
             box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.1);
         }
 
+        /* ── Safari (Mac only) ── */
+        /* Compact, flat, evenly spaced, no icons on inactive tabs */
+        .browser-safari .tab {
+            border-radius: 6px;
+            margin: 0 1px;
+            height: 28px;
+            padding: 4px 10px;
+            min-width: 80px;
+        }
+
+        .browser-safari .tab .tab-icon {
+            display: none;
+        }
+
+        .browser-safari .tab:hover {
+            background: var(--tab-hover);
+            border-radius: 6px;
+        }
+
+        /* Selected: subtle white pill, show icon */
+        .browser-safari .tab-active,
+        .browser-safari .tab-active:hover {
+            background: var(--tab-bg);
+            border-radius: 6px;
+            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+        }
+
+        .browser-safari .tab-active .tab-icon {
+            display: inline;
+        }
+
         .tab-about .tab-title {
             font-weight: 600;
         }
@@ -219,6 +250,16 @@
             border-radius: 8px;
         }
 
+        /* Safari: centered URL bar, more minimal */
+        .browser-safari .iframe-urlbar {
+            justify-content: center;
+            border-radius: 8px;
+        }
+
+        .browser-safari .iframe-urlbar .url-title {
+            display: none;
+        }
+
         .iframe-urlbar .tab-icon {
             flex-shrink: 0;
         }