1 files changed, 100 insertions, 0 deletions
diff --git a/makima/ios/Sources/Makima/Design/Components/MastheadBar.swift b/makima/ios/Sources/Makima/Design/Components/MastheadBar.swift
new file mode 100644
index 0000000..a304f95
--- /dev/null
+++ b/makima/ios/Sources/Makima/Design/Components/MastheadBar.swift
@@ -0,0 +1,100 @@
+import SwiftUI
+
+enum WebSocketStatus {
+    case idle, connecting, online, offline
+
+    var label: String {
+        switch self {
+        case .idle:       return "WS//IDLE"
+        case .connecting: return "WS//…"
+        case .online:     return "WS//ONLINE"
+        case .offline:    return "WS//OFFLINE"
+        }
+    }
+
+    var color: Color {
+        switch self {
+        case .idle:       return Palette.foregroundMuted
+        case .connecting: return Palette.warn
+        case .online:     return Palette.ok
+        case .offline:    return Palette.danger
+        }
+    }
+}
+
+/// Top chrome strip, replaces a traditional nav bar.
+/// Composition: small logo + "MAKIMA" brand + spacer + ws-pill + server label + version.
+struct MastheadBar: View {
+    let serverLabel: String
+    let wsStatus: WebSocketStatus
+    let version: String
+
+    var body: some View {
+        HStack(spacing: 10) {
+            Logo(size: 22)
+            Text("MAKIMA")
+                .font(.system(.caption, design: .monospaced).weight(.semibold))
+                .tracking(2)
+                .foregroundStyle(Palette.foreground)
+
+            Spacer(minLength: 8)
+
+            Text(wsStatus.label)
+                .font(Typography.navLabel)
+                .foregroundStyle(wsStatus.color)
+            Text("·")
+                .foregroundStyle(Palette.borderMuted)
+            Text(serverLabel)
+                .font(Typography.navLabel)
+                .foregroundStyle(Palette.accent)
+            Text("·")
+                .foregroundStyle(Palette.borderMuted)
+            Text("v\(version)")
+                .font(Typography.navLabel)
+                .foregroundStyle(Palette.foregroundMuted)
+        }
+        .padding(.horizontal, 14)
+        .padding(.vertical, 10)
+        .background(
+            LinearGradient(
+                colors: [Palette.backgroundDeep.opacity(0.95), Palette.panel.opacity(0.7)],
+                startPoint: .top, endPoint: .bottom
+            )
+        )
+        .overlay(alignment: .bottom) {
+            Rectangle().fill(Palette.border).frame(height: 2)
+        }
+    }
+}
+
+struct NavStripPlaceholder: View {
+    private let labels = ["LISTEN", "DIRECTIVES", "ORDERS", "CONTRACTS", "DAEMONS", "HISTORY"]
+
+    var body: some View {
+        HStack(spacing: 10) {
+            Text("NAV//")
+                .font(Typography.navLabel)
+                .foregroundStyle(Palette.accent)
+                .padding(.trailing, 4)
+                .overlay(alignment: .trailing) {
+                    Rectangle().fill(Palette.borderMuted).frame(width: 1, height: 14)
+                        .offset(x: 4)
+                }
+            ForEach(labels, id: \.self) { l in
+                Text(l)
+                    .font(Typography.navLabel)
+                    .foregroundStyle(Palette.accent.opacity(0.8))
+            }
+            Spacer()
+        }
+        .padding(.horizontal, 12)
+        .padding(.vertical, 10)
+        .background(Palette.panel)
+        .overlay(alignment: .top) {
+            Rectangle().fill(Palette.borderMuted).frame(height: 1)
+        }
+        .overlay(alignment: .bottom) {
+            Rectangle().fill(Palette.borderMuted).frame(height: 1)
+        }
+    }
+}