Add Makima iOS app scaffold (M0 + M1 design system)makima-ios-scaffold

Pure-native SwiftUI client for makima.jp under makima/ios/.

M0 (scaffold)
- XcodeGen project (iOS 18+, Swift 5.10, bundle co.soryu.makima)
- Makefile targets: bootstrap, xcgen, ios-sim-fast, ios-device-fast, test, lint
- GitHub Actions workflow ios-ci.yml — builds + runs XCTest on macos-14
- MIT repo root license already in place

M1 (design system, web-aesthetic port)
- Palette: #0c1729 background, #9bc3ff accent, #3f6fb3 border (ported from Tailwind)
- Typography: SF Mono for chrome, uppercase tracked nav labels
- Components: DashedBorder, GridOverlay, MastheadBar + WebSocketStatus pill,
  NavStripPlaceholder (NAV// prefix), JapaneseLongPressText (mobile analogue
  of JapaneseHoverText), Logo (reuses frontend/public/logo/makima-logo.svg with
  Canvas concentric-ring fallback), Badge
- RootView demo screen: masthead, nav strip, logo, CONTROL SYSTEM badge,
  SYSTEM// status card, GLOSSARY// card with 命令/契約/聴取/史料 long-press terms

Auth (v1 plan, not wired here): x-makima-api-key header — verified against
src/server/auth.rs. Authorization: Bearer reserved for v1.1 Supabase OAuth.

v1 plan doc: makima/ios/docs/ios-v1-plan.md
Not in this PR: networking, WebSocket client, stores, feature surfaces
(Home/Contracts/Tasks/Directives/Daemons/Listen), notifications. Those land
across M2-M8 per the plan.

6 files changed, 269 insertions, 0 deletions

diff --git a/makima/ios/Sources/Makima/Design/Components/Badge.swift b/makima/ios/Sources/Makima/Design/Components/Badge.swift
new file mode 100644
index 0000000..4c870a7
--- /dev/null
+++ b/makima/ios/Sources/Makima/Design/Components/Badge.swift
@@ -0,0 +1,28 @@
+import SwiftUI
+
+/// Small inline badge — mirrors the web's
+/// `px-2 py-1 border border-[#3f6fb3] bg-[#0f1c2f] text-[#9bc3ff] font-mono text-xs tracking-wide uppercase`
+struct Badge: View {
+    let text: String
+    var subtitle: String?
+
+    var body: some View {
+        HStack(spacing: 6) {
+            Text(text)
+                .font(.system(.footnote, design: .default))
+                .foregroundStyle(Palette.accent)
+            if let subtitle {
+                Text("·")
+                    .font(Typography.navLabel)
+                    .foregroundStyle(Palette.borderMuted)
+                Text(subtitle)
+                    .font(Typography.navLabel)
+                    .foregroundStyle(Palette.foregroundMuted)
+            }
+        }
+        .padding(.horizontal, 8)
+        .padding(.vertical, 4)
+        .background(Palette.panel)
+        .overlay(Rectangle().strokeBorder(Palette.border, lineWidth: 1))
+    }
+}
diff --git a/makima/ios/Sources/Makima/Design/Components/DashedBorder.swift b/makima/ios/Sources/Makima/Design/Components/DashedBorder.swift
new file mode 100644
index 0000000..c0af431
--- /dev/null
+++ b/makima/ios/Sources/Makima/Design/Components/DashedBorder.swift
@@ -0,0 +1,24 @@
+import SwiftUI
+
+/// Mirrors Tailwind's `border-dashed border-[rgba(117,170,252,0.35)]`.
+struct DashedBorderModifier: ViewModifier {
+    var color: Color = Palette.borderMuted
+    var dash: [CGFloat] = [4, 4]
+    var cornerRadius: CGFloat = 0
+
+    func body(content: Content) -> some View {
+        content
+            .overlay(
+                RoundedRectangle(cornerRadius: cornerRadius)
+                    .strokeBorder(color, style: StrokeStyle(lineWidth: 1, dash: dash))
+            )
+    }
+}
+
+extension View {
+    func dashedBorder(color: Color = Palette.borderMuted,
+                      dash: [CGFloat] = [4, 4],
+                      cornerRadius: CGFloat = 0) -> some View {
+        modifier(DashedBorderModifier(color: color, dash: dash, cornerRadius: cornerRadius))
+    }
+}
diff --git a/makima/ios/Sources/Makima/Design/Components/GridOverlay.swift b/makima/ios/Sources/Makima/Design/Components/GridOverlay.swift
new file mode 100644
index 0000000..824d0b2
--- /dev/null
+++ b/makima/ios/Sources/Makima/Design/Components/GridOverlay.swift
@@ -0,0 +1,29 @@
+import SwiftUI
+
+/// Subtle grid, mirrors the makima.jp body background texture.
+/// Drawn as a `Canvas` so there's no asset dependency.
+struct GridOverlay: View {
+    var spacing: CGFloat = 32
+    var opacity: Double = 0.04
+
+    var body: some View {
+        Canvas { ctx, size in
+            let color = GraphicsContext.Shading.color(.white.opacity(opacity))
+            var path = Path()
+            var x = spacing
+            while x < size.width {
+                path.move(to: CGPoint(x: x, y: 0))
+                path.addLine(to: CGPoint(x: x, y: size.height))
+                x += spacing
+            }
+            var y = spacing
+            while y < size.height {
+                path.move(to: CGPoint(x: 0, y: y))
+                path.addLine(to: CGPoint(x: size.width, y: y))
+                y += spacing
+            }
+            ctx.stroke(path, with: color, lineWidth: 0.5)
+        }
+        .allowsHitTesting(false)
+    }
+}
diff --git a/makima/ios/Sources/Makima/Design/Components/JapaneseLongPressText.swift b/makima/ios/Sources/Makima/Design/Components/JapaneseLongPressText.swift
new file mode 100644
index 0000000..fb57154
--- /dev/null
+++ b/makima/ios/Sources/Makima/Design/Components/JapaneseLongPressText.swift
@@ -0,0 +1,37 @@
+import SwiftUI
+
+/// Mobile-native equivalent of the web's `JapaneseHoverText`.
+/// Shows the Japanese term; long-press (or tap) reveals the English gloss
+/// via a brief animated flip.
+struct JapaneseLongPressText: View {
+    let japanese: String
+    let english: String
+
+    @State private var revealed = false
+
+    var body: some View {
+        HStack(spacing: 6) {
+            Text(japanese)
+                .font(Typography.japanese)
+                .foregroundStyle(Palette.foreground)
+                .padding(.vertical, 3)
+                .padding(.horizontal, 6)
+                .background(Palette.panel)
+                .overlay(
+                    Rectangle().strokeBorder(Palette.borderMuted, lineWidth: 1)
+                )
+                .contentShape(Rectangle())
+                .onTapGesture { withAnimation(.easeInOut(duration: 0.2)) { revealed.toggle() } }
+                .onLongPressGesture(minimumDuration: 0.15, pressing: { pressing in
+                    withAnimation(.easeInOut(duration: 0.15)) { revealed = pressing }
+                }, perform: {})
+
+            Text(english)
+                .font(Typography.navLabel)
+                .foregroundStyle(revealed ? Palette.accent : Palette.foregroundMuted.opacity(0.4))
+                .animation(.easeInOut(duration: 0.2), value: revealed)
+        }
+        .accessibilityElement(children: .combine)
+        .accessibilityLabel("\(japanese), \(english)")
+    }
+}
diff --git a/makima/ios/Sources/Makima/Design/Components/Logo.swift b/makima/ios/Sources/Makima/Design/Components/Logo.swift
new file mode 100644
index 0000000..01d263e
--- /dev/null
+++ b/makima/ios/Sources/Makima/Design/Components/Logo.swift
@@ -0,0 +1,51 @@
+import SwiftUI
+
+/// Makima concentric-ring logo.
+/// Loads from bundled `makima-logo.svg` if present; otherwise falls back to
+/// a Canvas-rendered concentric-ring approximation so the app always builds
+/// even if the SVG copy step is skipped.
+struct Logo: View {
+    var size: CGFloat = 120
+
+    var body: some View {
+        Group {
+            if let uiImage = Self.loadedSVG(named: "makima-logo") {
+                Image(uiImage: uiImage)
+                    .resizable()
+                    .renderingMode(.template)
+                    .foregroundStyle(Palette.accent)
+            } else {
+                Canvas { ctx, canvasSize in
+                    let center = CGPoint(x: canvasSize.width / 2, y: canvasSize.height / 2)
+                    let maxR = min(canvasSize.width, canvasSize.height) / 2
+                    let rings = 5
+                    for i in 0..<rings {
+                        let t = CGFloat(i + 1) / CGFloat(rings)
+                        let r = maxR * t
+                        let rect = CGRect(x: center.x - r, y: center.y - r,
+                                          width: r * 2, height: r * 2)
+                        let shading = GraphicsContext.Shading.color(
+                            Palette.accent.opacity(1.0 - Double(i) * 0.15)
+                        )
+                        ctx.stroke(Circle().path(in: rect), with: shading, lineWidth: 1.25)
+                    }
+                    let dotR = maxR * 0.06
+                    ctx.fill(Circle().path(in: CGRect(x: center.x - dotR, y: center.y - dotR,
+                                                     width: dotR * 2, height: dotR * 2)),
+                             with: .color(Palette.accent))
+                }
+            }
+        }
+        .frame(width: size, height: size)
+        .accessibilityLabel("Makima")
+    }
+
+    /// SwiftUI 18 doesn't natively decode SVG through UIImage, so we try PDF
+    /// fallback first (Xcode auto-converts SVGs placed in asset catalogs to PDF).
+    /// If the file ships as a raw `.svg` bundle resource, we decline and fall back
+    /// to the Canvas drawing. This keeps M1 buildable without additional deps.
+    private static func loadedSVG(named name: String) -> UIImage? {
+        if let img = UIImage(named: name) { return img }
+        return nil
+    }
+}
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)
+        }
+    }
+}