import SwiftUI struct ShareStatsCardView: View {    static let size = CGSize(width: 1200, height: 630)     let payload: ShareStatsPayload     static func providerDisplayLimit(for providerCount: Int) -> Int {        providerCount > 5 ? 4 : min(providerCount, 5)    }     static func providerPaletteIndex(        for model: ShareStatsModelPayload,        providers: [ShareStatsProviderPayload]) -> Int?    {        providers.firstIndex { $0.provider == model.provider }    }     private let background = Color(red: 0.078, green: 0.067, blue: 0.063)    private let primary = Color(red: 0.96, green: 0.94, blue: 0.91)    private let secondary = Color(red: 0.70, green: 0.66, blue: 0.62)    private let accent = Color(red: 0.93, green: 0.56, blue: 0.36)     var body: some View {        VStack(alignment: .leading, spacing: 0) {            self.header            self.hero                .padding(.top, 16)            Rectangle()                .fill(self.secondary.opacity(0.22))                .frame(height: 1)                .padding(.vertical, 17)            self.rankings                .frame(height: 286, alignment: .top)            Spacer(minLength: 10)            self.footer        }        .padding(.horizontal, 52)        .padding(.vertical, 34)        .frame(width: Self.size.width, height: Self.size.height, alignment: .topLeading)        .background(self.background)        .foregroundStyle(self.primary)        .environment(\.colorScheme, .dark)    }     private var header: some View {        HStack(alignment: .center) {            HStack(spacing: 14) {                ShareStatsMark(accent: self.accent)                    .frame(width: 34, height: 34)                Text("CodexBar")                    .font(.system(size: 26, weight: .semibold, design: .rounded))            }            Spacer()            Text("LOCAL SNAPSHOT")                .font(.system(size: 14, weight: .semibold, design: .rounded))                .tracking(1.8)                .foregroundStyle(self.secondary)                .padding(.horizontal, 15)                .padding(.vertical, 9)                .overlay {                    RoundedRectangle(cornerRadius: 12)                        .stroke(self.secondary.opacity(0.45), lineWidth: 1)                }        }    }     private var hero: some View {        HStack(alignment: .bottom, spacing: 52) {            VStack(alignment: .leading, spacing: 2) {                Text("TRACKED TOKENS · \(self.payload.days) DAYS")                    .font(.system(size: 20, weight: .semibold, design: .rounded))                    .tracking(1.8)                    .foregroundStyle(self.secondary)                Text(self.payload.totalTokens.map(ShareStatsFormatting.compactCount) ?? "—")                    .font(.system(size: 104, weight: .semibold, design: .rounded))                    .monospacedDigit()                    .lineLimit(1)                    .minimumScaleFactor(0.72)            }            .frame(maxWidth: .infinity, alignment: .leading)             VStack(alignment: .leading, spacing: 9) {                Text("EST. \(self.payload.days)-DAY SPEND")                    .font(.system(size: 18, weight: .semibold, design: .rounded))                    .tracking(1.2)                    .foregroundStyle(self.secondary)                ForEach(self.payload.currencies.prefix(2)) { currency in                    HStack(alignment: .firstTextBaseline) {                        Text("\(currency.currencyCode) · \(currency.coveredDayCount)/\(self.payload.days)d")                            .font(.system(size: 17, weight: .semibold, design: .rounded))                            .foregroundStyle(self.secondary)                        Spacer()                        Text(currency.estimatedCost.map {                            ShareStatsFormatting.currency($0, code: currency.currencyCode)                        } ?? "Unavailable")                            .font(.system(size: 32, weight: .semibold, design: .rounded))                            .monospacedDigit()                            .lineLimit(1)                            .minimumScaleFactor(0.72)                    }                }                Text(self.currencySummary)                    .font(.system(size: 16, weight: .medium, design: .rounded))                    .foregroundStyle(self.secondary)            }            .frame(width: 390, alignment: .leading)        }        .frame(height: 132, alignment: .bottom)    }     private var currencySummary: String {        let hiddenCount = self.payload.currencies.count - min(self.payload.currencies.count, 2)        return hiddenCount > 0            ? "+\(hiddenCount) more currencies · see subscription rows"            : "\(self.payload.providers.count) subscriptions · native currencies kept separate"    }     private var rankings: some View {        HStack(alignment: .top, spacing: 46) {            VStack(alignment: .leading, spacing: 6) {                self.sectionHeader("SUBSCRIPTIONS", detail: "\(self.payload.providers.count) CONNECTED")                ForEach(                    Array(self.payload.providers.prefix(self.providerDisplayLimit).enumerated()),                    id: \.offset)                { index, provider in                    ShareStatsProviderRow(                        rank: index + 1,                        provider: provider,                        days: self.payload.days,                        color: ShareStatsPalette.color(at: index))                }                if self.payload.providers.count > self.providerDisplayLimit {                    Text("+\(self.payload.providers.count - self.providerDisplayLimit) more configured")                        .font(.system(size: 16, weight: .medium, design: .rounded))                        .foregroundStyle(self.secondary)                        .padding(.leading, 20)                }            }            .frame(width: 554, alignment: .topLeading)             VStack(alignment: .leading, spacing: 0) {                VStack(alignment: .leading, spacing: 6) {                    self.sectionHeader("TOP MODELS", detail: "BY USAGE")                    if self.payload.topModels.isEmpty {                        Text("No model-level history in this local snapshot")                            .font(.system(size: 18, weight: .medium, design: .rounded))                            .foregroundStyle(self.secondary)                            .padding(.top, 4)                    } else {                        ForEach(                            Array(self.payload.topModels.prefix(3).enumerated()),                            id: \.offset)                        { index, model in                            ShareStatsModelRow(                                rank: index + 1,                                model: model,                                color: self.color(for: model))                        }                    }                }                Text("Only aggregate usage, plan tier, and estimated spend are included.")                    .font(.system(size: 16, weight: .medium, design: .rounded))                    .foregroundStyle(self.secondary)                    .padding(.top, 18)            }            .frame(maxWidth: .infinity, alignment: .topLeading)        }    }     private var providerDisplayLimit: Int {        Self.providerDisplayLimit(for: self.payload.providers.count)    }     private func color(for model: ShareStatsModelPayload) -> Color {        guard let index = Self.providerPaletteIndex(for: model, providers: self.payload.providers) else {            return self.secondary        }        return ShareStatsPalette.color(at: index)    }     private func sectionHeader(_ title: String, detail: String) -> some View {        HStack(alignment: .firstTextBaseline) {            Text(title)                .font(.system(size: 18, weight: .semibold, design: .rounded))                .tracking(1.5)            Spacer()            Text(detail)                .font(.system(size: 16, weight: .semibold, design: .rounded))                .tracking(1.0)        }        .foregroundStyle(self.secondary)    }     private var footer: some View {        HStack(spacing: 12) {            Label("LOCAL · AGGREGATE ONLY", systemImage: "lock.shield")            Spacer()            Text("DATA THROUGH \(ShareStatsFormatting.dataThrough(self.payload.periodEnd).uppercased())")        }        .font(.system(size: 14, weight: .medium, design: .rounded))        .tracking(0.7)        .foregroundStyle(self.secondary)    }} private struct ShareStatsModelRow: View {    let rank: Int    let model: ShareStatsModelPayload    let color: Color     var body: some View {        HStack(spacing: 9) {            Capsule()                .fill(self.color)                .frame(width: 5, height: 34)            Text(String(format: "%02d", self.rank))                .font(.system(size: 17, weight: .bold, design: .rounded))                .monospacedDigit()                .foregroundStyle(Color(red: 0.70, green: 0.66, blue: 0.62))                .frame(width: 27, alignment: .leading)            VStack(alignment: .leading, spacing: 1) {                Text(self.model.modelName)                    .font(.system(size: 20, weight: .semibold, design: .rounded))                    .lineLimit(1)                    .minimumScaleFactor(0.82)                Text(self.model.providerName)                    .font(.system(size: 16, weight: .medium, design: .rounded))                    .foregroundStyle(Color(red: 0.70, green: 0.66, blue: 0.62))                    .lineLimit(1)            }            Spacer(minLength: 10)            Text(self.detail)                .font(.system(size: 17, weight: .medium, design: .rounded))                .monospacedDigit()                .foregroundStyle(Color(red: 0.78, green: 0.74, blue: 0.69))                .lineLimit(1)        }        .padding(.horizontal, 9)        .frame(height: 48)        .background(Color.white.opacity(0.035), in: RoundedRectangle(cornerRadius: 9))        .overlay {            RoundedRectangle(cornerRadius: 9)                .stroke(Color.white.opacity(0.10), lineWidth: 1)        }    }     private var detail: String {        if let cost = self.model.estimatedCost, cost.isFinite {            return "~\(ShareStatsFormatting.currency(cost, code: self.model.currencyCode))"        }        return self.model.totalTokens.map(ShareStatsFormatting.compactCount) ?? "used"    }} private struct ShareStatsProviderRow: View {    let rank: Int    let provider: ShareStatsProviderPayload    let days: Int    let color: Color     var body: some View {        HStack(spacing: 9) {            Capsule()                .fill(self.color)                .frame(width: 6, height: 30)            Text(String(format: "%02d", self.rank))                .font(.system(size: 17, weight: .bold, design: .rounded))                .monospacedDigit()                .foregroundStyle(Color(red: 0.70, green: 0.66, blue: 0.62))                .frame(width: 27, alignment: .leading)            HStack(spacing: 8) {                Text(self.provider.providerName)                    .font(.system(size: 20, weight: .semibold, design: .rounded))                    .lineLimit(1)                    .minimumScaleFactor(0.82)                if let subscriptionName = self.provider.subscriptionName {                    Text("· \(subscriptionName)")                        .font(.system(size: 17, weight: .medium, design: .rounded))                        .foregroundStyle(Color(red: 0.70, green: 0.66, blue: 0.62))                        .lineLimit(1)                }            }            Spacer(minLength: 12)            Text(self.detail)                .font(.system(size: 18, weight: .medium, design: .rounded))                .monospacedDigit()                .foregroundStyle(Color(red: 0.78, green: 0.74, blue: 0.69))                .lineLimit(1)                .minimumScaleFactor(0.82)        }        .padding(.horizontal, 9)        .frame(height: 44)        .background(Color.white.opacity(0.035), in: RoundedRectangle(cornerRadius: 9))        .overlay {            RoundedRectangle(cornerRadius: 9)                .stroke(Color.white.opacity(0.10), lineWidth: 1)        }    }     private var detail: String {        var metrics: [String] = []        if let tokens = self.provider.totalTokens {            metrics.append(ShareStatsFormatting.compactCount(tokens))        }        if let cost = self.provider.estimatedCost, cost.isFinite {            metrics.append("~\(ShareStatsFormatting.currency(cost, code: self.provider.currencyCode))")            if self.provider.coveredDayCount < self.days {                metrics.append("\(self.provider.coveredDayCount)/\(self.days)d")            }        } else {            metrics.append("Spend unavailable")        }        return metrics.isEmpty ? "connected" : metrics.joined(separator: " · ")    }} private enum ShareStatsPalette {    static let colors = [        Color(red: 1.00, green: 0.60, blue: 0.38),        Color(red: 0.60, green: 0.66, blue: 1.00),        Color(red: 0.38, green: 0.84, blue: 0.72),        Color(red: 0.95, green: 0.79, blue: 0.41),        Color(red: 0.44, green: 0.77, blue: 0.96),        Color(red: 0.95, green: 0.55, blue: 0.67),    ]     static func color(at index: Int) -> Color {        self.colors[index % self.colors.count]    }} private struct ShareStatsMark: View {    let accent: Color     var body: some View {        HStack(alignment: .bottom, spacing: 4) {            ForEach(Array([0.38, 0.68, 1.0].enumerated()), id: \.offset) { _, height in                Capsule()                    .fill(self.accent)                    .frame(width: 5, height: 28 * height)            }        }        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)    }}