@php
    $useUnifiedSeo = true;
    $seo = \App\Support\Seo\SeoDataBuilder::fromArray(
        app(\App\Support\Seo\SeoFactory::class)->fromViewData(get_defined_vars())
    )
        ->addJsonLd([
            '@context' => 'https://schema.org',
            '@type' => 'CollectionPage',
            'name' => $meta['title'] ?? 'Nova Cards - Skinbase Nova',
            'description' => $meta['description'] ?? '',
            'url' => $meta['canonical'] ?? route('cards.index'),
            'isPartOf' => [
                '@type' => 'WebSite',
                'name' => config('app.name'),
                'url' => url('/'),
            ],
            'mainEntity' => collect($cards ?? [])->take(12)->map(function ($card) {
                return [
                    '@type' => 'CreativeWork',
                    'name' => $card['title'] ?? null,
                    'url' => $card['public_url'] ?? null,
                    'creator' => [
                        '@type' => 'Person',
                        'name' => data_get($card, 'creator.username'),
                    ],
                ];
            })->values()->all(),
        ])
        ->build();
@endphp
@extends('layouts.nova')

@section('meta-description', $meta['description'] ?? '')

@section('content')
    <section class="px-6 pt-8 md:px-10">
        <div class="rounded-[34px] border border-white/10 bg-[radial-gradient(circle_at_top_left,rgba(56,189,248,0.14),transparent_38%),linear-gradient(180deg,rgba(15,23,42,0.96),rgba(2,6,23,0.88))] p-6 shadow-[0_24px_70px_rgba(2,6,23,0.32)] md:p-8">
            <p class="text-[11px] font-semibold uppercase tracking-[0.28em] text-sky-200/75">Nova Cards</p>
            <h1 class="mt-3 text-3xl font-semibold tracking-[-0.04em] text-white md:text-5xl">{{ $heading }}</h1>
            <p class="mt-4 max-w-3xl text-sm leading-7 text-slate-300 md:text-base">{{ $subheading }}</p>
            <div class="mt-6 flex flex-wrap gap-3">
                <a href="{{ route('studio.cards.create') }}" class="inline-flex items-center gap-2 rounded-2xl border border-sky-300/20 bg-sky-400/10 px-5 py-3 text-sm font-semibold text-sky-100 transition hover:bg-sky-400/15">
                    <i class="fa-solid fa-plus"></i>
                    Create a card
                </a>
                <a href="{{ route('cards.popular') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                    <i class="fa-solid fa-fire"></i>
                    Popular
                </a>
                <a href="{{ route('cards.remixed') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                    <i class="fa-solid fa-code-branch"></i>
                    Remixed
                </a>
                <a href="{{ route('cards.remix-highlights') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                    <i class="fa-solid fa-sparkles"></i>
                    Best remixes
                </a>
                <a href="{{ route('cards.editorial') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                    <i class="fa-solid fa-feather-pointed"></i>
                    Editorial
                </a>
                <a href="{{ route('cards.seasonal') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                    <i class="fa-solid fa-sun"></i>
                    Seasonal
                </a>
                <a href="{{ route('cards.challenges') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                    <i class="fa-solid fa-trophy"></i>
                    Challenges
                </a>
                @if(($context ?? null) !== 'index')
                    <a href="{{ route('cards.index') }}" class="inline-flex items-center gap-2 rounded-2xl border border-white/10 bg-white/[0.05] px-5 py-3 text-sm font-semibold text-white transition hover:bg-white/[0.08]">
                        <i class="fa-solid fa-compass"></i>
                        Browse all cards
                    </a>
                @endif
            </div>
        </div>
    </section>

    @if(($context ?? null) === 'index' && (!empty($featuredCards) || !empty($trendingCards)))
        <section class="px-6 pt-8 md:px-10">
            <div class="grid gap-6 xl:grid-cols-2">
                <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                    <div class="mb-4 flex items-center justify-between gap-4">
                        <div>
                            <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Featured</p>
                            <h2 class="mt-1 text-2xl font-semibold text-white">Editor’s picks</h2>
                        </div>
                    </div>
                    <div class="grid gap-4 sm:grid-cols-2">
                        @foreach($featuredCards as $card)
                            @include('cards.partials.tile', ['card' => $card])
                        @endforeach
                    </div>
                </div>
                <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                    <div class="mb-4 flex items-center justify-between gap-4">
                        <div>
                            <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Trending</p>
                            <h2 class="mt-1 text-2xl font-semibold text-white">Most viewed right now</h2>
                        </div>
                    </div>
                    <div class="grid gap-4 sm:grid-cols-2">
                        @foreach($trendingCards as $card)
                            @include('cards.partials.tile', ['card' => $card])
                        @endforeach
                    </div>
                </div>
            </div>
        </section>
    @endif

    @if(in_array(($context ?? null), ['creator', 'creator-portfolio'], true) && !empty($creatorSummary))
        <section class="px-6 pt-8 md:px-10">
            <div class="grid gap-6 xl:grid-cols-[minmax(0,1.25fr)_minmax(0,1fr)]">
                <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                    <div class="flex flex-wrap items-start justify-between gap-4">
                        <div>
                            <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Creator profile</p>
                            <h2 class="mt-1 text-2xl font-semibold text-white">{{ $creatorSummary['creator']['display_name'] }}</h2>
                            <p class="mt-2 text-sm leading-7 text-slate-300">{{ ($context ?? null) === 'creator-portfolio' ? 'A dedicated Nova Cards portfolio view with public works, signature themes, remix activity, and publishing history.' : 'A public snapshot of this creator\'s Nova Cards footprint, top styles, and strongest publishing signals.' }}</p>
                        </div>
                        <span class="rounded-full border border-sky-300/20 bg-sky-400/10 px-3 py-1.5 text-[11px] font-semibold uppercase tracking-[0.18em] text-sky-100">{{ '@' . $creatorSummary['creator']['username'] }}</span>
                    </div>

                    <div class="mt-5 flex flex-wrap gap-2">
                        <a href="{{ route('cards.creator', ['username' => strtolower((string) $creatorSummary['creator']['username'])]) }}" class="inline-flex items-center gap-2 rounded-full border px-4 py-2 text-sm font-semibold transition {{ ($context ?? null) === 'creator' ? 'border-sky-300/20 bg-sky-400/10 text-sky-100' : 'border-white/10 bg-white/[0.05] text-white hover:bg-white/[0.08]' }}">
                            <i class="fa-solid fa-user"></i>
                            Profile
                        </a>
                        <a href="{{ route('cards.creator.portfolio', ['username' => strtolower((string) $creatorSummary['creator']['username'])]) }}" class="inline-flex items-center gap-2 rounded-full border px-4 py-2 text-sm font-semibold transition {{ ($context ?? null) === 'creator-portfolio' ? 'border-sky-300/20 bg-sky-400/10 text-sky-100' : 'border-white/10 bg-white/[0.05] text-white hover:bg-white/[0.08]' }}">
                            <i class="fa-solid fa-layer-group"></i>
                            Portfolio
                        </a>
                    </div>

                    <div class="mt-5 grid gap-3 sm:grid-cols-2 xl:grid-cols-6">
                        <div class="rounded-[22px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Public cards</div>
                            <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorSummary['stats']['total_cards'] ?? 0) }}</div>
                        </div>
                        <div class="rounded-[22px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Featured works</div>
                            <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorSummary['stats']['total_featured_cards'] ?? 0) }}</div>
                        </div>
                        <div class="rounded-[22px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Views</div>
                            <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorSummary['stats']['total_views'] ?? 0) }}</div>
                        </div>
                        <div class="rounded-[22px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Saves</div>
                            <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorSummary['stats']['total_saves'] ?? 0) }}</div>
                        </div>
                        <div class="rounded-[22px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Remixes</div>
                            <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorSummary['stats']['total_remixes'] ?? 0) }}</div>
                        </div>
                        <div class="rounded-[22px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Challenge entries</div>
                            <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorSummary['stats']['total_challenge_entries'] ?? 0) }}</div>
                        </div>
                    </div>

                    <div class="mt-5 grid gap-5 lg:grid-cols-3">
                        <div>
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Top styles</div>
                            <div class="mt-3 flex flex-wrap gap-2">
                                @forelse(($creatorSummary['top_styles'] ?? []) as $style)
                                    <a href="{{ route('cards.style', ['styleSlug' => $style['key']]) }}" class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $style['label'] }} <span class="text-xs text-slate-500">{{ $style['cards_count'] }}</span></a>
                                @empty
                                    <span class="text-sm text-slate-500">No dominant style family yet.</span>
                                @endforelse
                            </div>
                        </div>
                        <div>
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Top categories</div>
                            <div class="mt-3 flex flex-wrap gap-2">
                                @forelse(($creatorSummary['top_categories'] ?? []) as $category)
                                    <a href="{{ route('cards.category', ['categorySlug' => $category['slug']]) }}" class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $category['name'] }} <span class="text-xs text-slate-500">{{ $category['cards_count'] }}</span></a>
                                @empty
                                    <span class="text-sm text-slate-500">No category signal yet.</span>
                                @endforelse
                            </div>
                        </div>
                        <div>
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Top tags</div>
                            <div class="mt-3 flex flex-wrap gap-2">
                                @forelse(($creatorSummary['top_tags'] ?? []) as $tag)
                                    <a href="{{ route('cards.tag', ['tagSlug' => $tag['slug']]) }}" class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">#{{ $tag['name'] }} <span class="text-xs text-slate-500">{{ $tag['cards_count'] }}</span></a>
                                @empty
                                    <span class="text-sm text-slate-500">No recurring tags yet.</span>
                                @endforelse
                            </div>
                        </div>
                    </div>

                    <div class="mt-5 rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                        <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Signature themes</div>
                        <div class="mt-4 grid gap-5 lg:grid-cols-2">
                            <div>
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Top palettes</div>
                                <div class="mt-3 flex flex-wrap gap-2">
                                    @forelse(($creatorSummary['top_palettes'] ?? []) as $palette)
                                        <a href="{{ route('cards.palette', ['paletteSlug' => $palette['key']]) }}" class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $palette['label'] }} <span class="text-xs text-slate-500">{{ $palette['cards_count'] }}</span></a>
                                    @empty
                                        <span class="text-sm text-slate-500">No signature palette family yet.</span>
                                    @endforelse
                                </div>
                            </div>
                            <div>
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Signature moods</div>
                                <div class="mt-3 flex flex-wrap gap-2">
                                    @forelse(($creatorSummary['top_moods'] ?? []) as $mood)
                                        <a href="{{ route('cards.mood', ['moodSlug' => $mood['key']]) }}" class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $mood['label'] }} <span class="text-xs text-slate-500">{{ $mood['cards_count'] }}</span></a>
                                    @empty
                                        <span class="text-sm text-slate-500">No recurring mood signal yet.</span>
                                    @endforelse
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="mt-5 grid gap-5 lg:grid-cols-2">
                        <div class="rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Portfolio depth</div>
                            <h3 class="mt-2 text-xl font-semibold text-white">Most remixed works</h3>
                            @if(!empty($creatorMostRemixedWorks))
                                <div class="mt-4 space-y-3">
                                    @foreach($creatorMostRemixedWorks as $card)
                                        <a href="{{ $card['public_url'] }}" class="flex items-start justify-between gap-3 rounded-[20px] border border-white/10 bg-[#08111f]/70 px-4 py-3 transition hover:border-white/20 hover:bg-[#0d1726]">
                                            <div>
                                                <div class="font-semibold text-white">{{ $card['title'] }}</div>
                                                <div class="mt-1 text-xs uppercase tracking-[0.16em] text-slate-500">{{ $card['creator']['username'] ? '@' . $card['creator']['username'] : 'Creator' }}</div>
                                            </div>
                                            <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ number_format($card['remixes_count'] ?? 0) }} remixes</span>
                                        </a>
                                    @endforeach
                                </div>
                            @else
                                <div class="mt-4 rounded-[20px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-6 text-sm text-slate-400">Remix traction will appear here as this creator's cards are remixed by the community.</div>
                            @endif
                        </div>

                        <div class="rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                            <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Participation</div>
                            <h3 class="mt-2 text-xl font-semibold text-white">Challenge track record</h3>
                            @if(!empty($creatorChallengeHistory))
                                <div class="mt-4 space-y-3">
                                    @foreach($creatorChallengeHistory as $entry)
                                        <div class="rounded-[20px] border border-white/10 bg-[#08111f]/70 px-4 py-3">
                                            <div class="flex items-start justify-between gap-3">
                                                <div>
                                                    @if(!empty($entry['challenge_url']))
                                                        <a href="{{ $entry['challenge_url'] }}" class="font-semibold text-white transition hover:text-sky-100">{{ $entry['challenge_title'] }}</a>
                                                    @else
                                                        <div class="font-semibold text-white">{{ $entry['challenge_title'] }}</div>
                                                    @endif
                                                    <div class="mt-1 text-xs uppercase tracking-[0.16em] text-slate-500">{{ $entry['official'] ? 'Official challenge' : ucfirst($entry['challenge_status'] ?: 'challenge') }}</div>
                                                </div>
                                                <span class="rounded-full border border-sky-300/20 bg-sky-400/10 px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-sky-100">{{ $entry['status_label'] }}</span>
                                            </div>
                                            @if(!empty($entry['card_url']))
                                                <div class="mt-3 text-sm text-slate-300">With <a href="{{ $entry['card_url'] }}" class="font-semibold text-sky-100 transition hover:text-white">{{ $entry['card_title'] }}</a></div>
                                            @endif
                                        </div>
                                    @endforeach
                                </div>
                            @else
                                <div class="mt-4 rounded-[20px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-6 text-sm text-slate-400">Challenge entries and featured placements will appear here as this creator participates in Nova Cards challenges.</div>
                            @endif
                        </div>
                    </div>

                    <div class="mt-5 rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                        <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Audience traction</div>
                        <h3 class="mt-2 text-xl font-semibold text-white">Most liked works</h3>
                        @if(!empty($creatorMostLikedWorks))
                            <div class="mt-4 grid gap-3 lg:grid-cols-2">
                                @foreach($creatorMostLikedWorks as $card)
                                    <a href="{{ $card['public_url'] }}" class="flex items-start justify-between gap-3 rounded-[20px] border border-white/10 bg-[#08111f]/70 px-4 py-3 transition hover:border-white/20 hover:bg-[#0d1726]">
                                        <div>
                                            <div class="font-semibold text-white">{{ $card['title'] }}</div>
                                            <div class="mt-1 text-xs uppercase tracking-[0.16em] text-slate-500">{{ $card['creator']['username'] ? '@' . $card['creator']['username'] : 'Creator' }}</div>
                                        </div>
                                        <div class="flex flex-col items-end gap-1 text-right">
                                            <span class="rounded-full border border-rose-300/20 bg-rose-400/10 px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-rose-100">{{ number_format($card['likes_count'] ?? 0) }} likes</span>
                                            <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ number_format($card['saves_count'] ?? 0) }} saves</span>
                                        </div>
                                    </a>
                                @endforeach
                            </div>
                        @else
                            <div class="mt-4 rounded-[20px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-6 text-sm text-slate-400">Audience favorites will appear here once this creator's cards start collecting likes and saves.</div>
                        @endif
                    </div>

                    <div class="mt-5 rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                        <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Remix activity</div>
                        <h3 class="mt-2 text-xl font-semibold text-white">Remix branches</h3>
                        <div class="mt-4 grid gap-3 sm:grid-cols-2">
                            <div class="rounded-[20px] border border-white/10 bg-white/[0.03] p-4">
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Community branches</div>
                                <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorRemixActivity['total_cards_remixed_by_community'] ?? 0) }}</div>
                            </div>
                            <div class="rounded-[20px] border border-white/10 bg-white/[0.03] p-4">
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Published remixes</div>
                                <div class="mt-2 text-2xl font-semibold text-white">{{ number_format($creatorRemixActivity['total_published_remixes'] ?? 0) }}</div>
                            </div>
                        </div>
                        @if(!empty($creatorRemixActivity['branches']))
                            <div class="mt-4 space-y-3">
                                @foreach($creatorRemixActivity['branches'] as $branch)
                                    <div class="rounded-[20px] border border-white/10 bg-[#08111f]/70 px-4 py-4">
                                        <div class="flex flex-wrap items-start justify-between gap-3">
                                            <div>
                                                <a href="{{ $branch['card']['public_url'] }}" class="font-semibold text-white transition hover:text-sky-100">{{ $branch['card']['title'] }}</a>
                                                <div class="mt-1 text-xs uppercase tracking-[0.16em] text-slate-500">{{ $branch['branch_type'] }}</div>
                                            </div>
                                            <a href="{{ $branch['lineage_url'] }}" class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-1.5 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200 transition hover:bg-white/[0.08]">
                                                <i class="fa-solid fa-code-branch"></i>
                                                View lineage
                                            </a>
                                        </div>
                                        <div class="mt-3 text-sm text-slate-300">Source: <span class="font-semibold text-white">{{ $branch['source_label'] }}</span></div>
                                        <div class="mt-3 flex flex-wrap gap-3 text-xs text-slate-400">
                                            <span>{{ number_format($branch['card']['remixes_count'] ?? 0) }} remixes</span>
                                            <span>{{ number_format($branch['card']['likes_count'] ?? 0) }} likes</span>
                                            <span>{{ number_format($branch['card']['saves_count'] ?? 0) }} saves</span>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        @else
                            <div class="mt-4 rounded-[20px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-6 text-sm text-slate-400">Remix branch activity will appear here once this creator publishes remixes or their cards start branching.</div>
                        @endif
                    </div>

                    <div class="mt-5 rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                        <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Remix visualization</div>
                        <h3 class="mt-2 text-xl font-semibold text-white">Remix graph</h3>
                        @if(!empty($creatorRemixGraph))
                            <div class="mt-4 space-y-4">
                                @foreach($creatorRemixGraph as $branch)
                                    <div>
                                        <div class="flex flex-wrap items-center justify-between gap-3 text-sm">
                                            <span class="font-semibold text-white">{{ $branch['root_title'] }}</span>
                                            <span class="text-slate-400">{{ number_format($branch['cards_count']) }} cards · {{ number_format($branch['total_remixes']) }} remixes</span>
                                        </div>
                                        <div class="mt-2 h-3 overflow-hidden rounded-full bg-white/[0.06]">
                                            <div class="h-full rounded-full bg-gradient-to-r from-sky-400 via-cyan-300 to-emerald-300" style="width: {{ $branch['width_percent'] }}%"></div>
                                        </div>
                                        <div class="mt-2 text-xs uppercase tracking-[0.16em] text-slate-500">Peak branch card: {{ $branch['peak_title'] }}</div>
                                    </div>
                                @endforeach
                            </div>
                        @else
                            <div class="mt-4 rounded-[20px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-6 text-sm text-slate-400">Branch volume will chart here once this creator has remix families with visible activity.</div>
                        @endif
                    </div>

                    <div class="mt-5 rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                        <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Creator identity</div>
                        <h3 class="mt-2 text-xl font-semibold text-white">Preference signals</h3>
                        <div class="mt-4 grid gap-5 lg:grid-cols-2">
                            <div>
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Top formats</div>
                                <div class="mt-3 flex flex-wrap gap-2">
                                    @forelse(($creatorPreferenceSignals['top_formats'] ?? []) as $format)
                                        <span class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200">{{ $format['label'] }} <span class="text-xs text-slate-500">{{ $format['cards_count'] }}</span></span>
                                    @empty
                                        <span class="text-sm text-slate-500">No dominant format yet.</span>
                                    @endforelse
                                </div>
                            </div>
                            <div>
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Favorite templates</div>
                                <div class="mt-3 flex flex-wrap gap-2">
                                    @forelse(($creatorPreferenceSignals['top_templates'] ?? []) as $template)
                                        <span class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200">{{ $template['name'] }} <span class="text-xs text-slate-500">{{ $template['cards_count'] }}</span></span>
                                    @empty
                                        <span class="text-sm text-slate-500">No preferred template signal yet.</span>
                                    @endforelse
                                </div>
                            </div>
                        </div>
                        <div class="mt-5 grid gap-3 sm:grid-cols-2">
                            <div class="rounded-[20px] border border-white/10 bg-white/[0.03] p-4">
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Preferred editor mode</div>
                                <div class="mt-2 text-lg font-semibold text-white">{{ $creatorPreferenceSignals['preferred_editor_mode']['label'] ?? 'No preference yet' }}</div>
                                @if(!empty($creatorPreferenceSignals['preferred_editor_mode']))
                                    <div class="mt-1 text-xs uppercase tracking-[0.16em] text-slate-500">{{ number_format($creatorPreferenceSignals['preferred_editor_mode']['cards_count']) }} cards</div>
                                @endif
                            </div>
                            <div class="rounded-[20px] border border-white/10 bg-white/[0.03] p-4">
                                <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Saved presets</div>
                                <div class="mt-3 flex flex-wrap gap-2">
                                    @forelse(($creatorPreferenceSignals['preset_counts'] ?? []) as $preset)
                                        <span class="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200">{{ $preset['label'] }} <span class="text-xs text-slate-500">{{ $preset['presets_count'] }}</span></span>
                                    @empty
                                        <span class="text-sm text-slate-500">No saved presets yet.</span>
                                    @endforelse
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="mt-5 rounded-[24px] border border-white/10 bg-white/[0.03] p-4">
                        <div class="text-[11px] font-semibold uppercase tracking-[0.18em] text-slate-500">Publishing history</div>
                        <h3 class="mt-2 text-xl font-semibold text-white">Recent timeline</h3>
                        @if(!empty($creatorTimeline))
                            <div class="mt-4 space-y-4">
                                @foreach($creatorTimeline as $event)
                                    <div class="flex gap-4 rounded-[20px] border border-white/10 bg-[#08111f]/70 px-4 py-4">
                                        <div class="mt-1 h-2.5 w-2.5 shrink-0 rounded-full bg-sky-300"></div>
                                        <div class="min-w-0 flex-1">
                                            <div class="flex flex-wrap items-center justify-between gap-3">
                                                <a href="{{ $event['card']['public_url'] }}" class="font-semibold text-white transition hover:text-sky-100">{{ $event['card']['title'] }}</a>
                                                <span class="text-xs uppercase tracking-[0.16em] text-slate-500">{{ $event['card']['published_at'] ? \Illuminate\Support\Carbon::parse($event['card']['published_at'])->format('M j, Y') : 'Published' }}</span>
                                            </div>
                                            <div class="mt-2 flex flex-wrap gap-2">
                                                @forelse($event['signals'] as $signal)
                                                    <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ $signal }}</span>
                                                @empty
                                                    <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">Published</span>
                                                @endforelse
                                            </div>
                                            <div class="mt-3 flex flex-wrap gap-3 text-xs text-slate-400">
                                                <span>{{ number_format($event['card']['likes_count'] ?? 0) }} likes</span>
                                                <span>{{ number_format($event['card']['saves_count'] ?? 0) }} saves</span>
                                                <span>{{ number_format($event['card']['remixes_count'] ?? 0) }} remixes</span>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        @else
                            <div class="mt-4 rounded-[20px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-6 text-sm text-slate-400">Recent publishing milestones will appear here once this creator has public card activity.</div>
                        @endif
                    </div>
                </div>

                <div class="space-y-6">
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <div class="mb-4 flex items-center justify-between gap-4">
                            <div>
                                <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Featured works</p>
                                <h2 class="mt-1 text-2xl font-semibold text-white">Staff-curated creator picks</h2>
                            </div>
                        </div>
                        @if(!empty($creatorFeaturedWorks))
                            <div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-1">
                                @foreach($creatorFeaturedWorks as $card)
                                    @include('cards.partials.tile', ['card' => $card])
                                @endforeach
                            </div>
                        @else
                            <div class="rounded-[22px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-8 text-sm text-slate-400">No explicit featured works yet. Staff-featured cards will appear here.</div>
                        @endif
                    </div>

                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <div class="mb-4 flex items-center justify-between gap-4">
                            <div>
                                <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Featured collections</p>
                                <h2 class="mt-1 text-2xl font-semibold text-white">Curated sets by this creator</h2>
                            </div>
                        </div>
                        @if(!empty($creatorFeaturedCollections))
                            <div class="space-y-3">
                                @foreach($creatorFeaturedCollections as $collection)
                                    <a href="{{ $collection['public_url'] }}" class="block rounded-[22px] border border-white/10 bg-white/[0.03] p-4 transition hover:border-white/20 hover:bg-white/[0.05]">
                                        <div class="flex items-start justify-between gap-3">
                                            <div>
                                                <div class="text-base font-semibold text-white">{{ $collection['name'] }}</div>
                                                <div class="mt-1 text-xs uppercase tracking-[0.18em] text-slate-500">{{ $collection['official'] ? 'Official collection' : '@' . ($collection['owner']['username'] ?? 'creator') }}</div>
                                            </div>
                                            <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ $collection['cards_count'] }} cards</span>
                                        </div>
                                        @if(!empty($collection['description']))
                                            <div class="mt-2 text-sm text-slate-400">{{ $collection['description'] }}</div>
                                        @endif
                                    </a>
                                @endforeach
                            </div>
                        @else
                            <div class="rounded-[22px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-8 text-sm text-slate-400">No featured public collections yet.</div>
                        @endif
                    </div>

                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <div class="mb-4 flex items-center justify-between gap-4">
                            <div>
                                <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Creator highlights</p>
                                <h2 class="mt-1 text-2xl font-semibold text-white">Strongest public works</h2>
                            </div>
                        </div>
                        @if(!empty($creatorHighlights))
                            <div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-1">
                                @foreach($creatorHighlights as $card)
                                    @include('cards.partials.tile', ['card' => $card])
                                @endforeach
                            </div>
                        @else
                            <div class="rounded-[22px] border border-dashed border-white/12 bg-white/[0.03] px-4 py-8 text-sm text-slate-400">Highlights will appear as this creator publishes more public cards.</div>
                        @endif
                    </div>
                </div>
            </div>
        </section>
    @endif

    @if(($context ?? null) === 'editorial' && (!empty($featuredCreators) || !empty($landingCollections) || (($landingChallenges ?? collect())->count() > 0)))
        <section class="px-6 pt-8 md:px-10">
            @if(!empty($featuredCreators))
                <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                    <div class="mb-4">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Creators</p>
                        <h2 class="mt-1 text-2xl font-semibold text-white">Featured creators</h2>
                    </div>
                    <div class="grid gap-3 md:grid-cols-2 xl:grid-cols-3">
                        @foreach($featuredCreators as $creator)
                            <a href="{{ $creator['public_url'] }}" class="block rounded-[22px] border border-white/10 bg-white/[0.03] p-4 transition hover:border-white/20 hover:bg-white/[0.05]">
                                <div class="flex items-start justify-between gap-3">
                                    <div>
                                        <div class="text-base font-semibold text-white">{{ $creator['display_name'] }}</div>
                                        <div class="mt-1 text-xs uppercase tracking-[0.18em] text-slate-500">@{{ $creator['username'] }}</div>
                                    </div>
                                    <span class="rounded-full border border-sky-300/20 bg-sky-400/10 px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-sky-100">Staff pick</span>
                                </div>
                                <div class="mt-3 grid grid-cols-3 gap-2 text-center text-xs text-slate-300">
                                    <div class="rounded-2xl border border-white/10 bg-white/[0.04] px-2 py-3">
                                        <div class="text-[10px] uppercase tracking-[0.14em] text-slate-500">Cards</div>
                                        <div class="mt-1 text-sm font-semibold text-white">{{ number_format($creator['public_cards_count']) }}</div>
                                    </div>
                                    <div class="rounded-2xl border border-white/10 bg-white/[0.04] px-2 py-3">
                                        <div class="text-[10px] uppercase tracking-[0.14em] text-slate-500">Featured</div>
                                        <div class="mt-1 text-sm font-semibold text-white">{{ number_format($creator['featured_cards_count']) }}</div>
                                    </div>
                                    <div class="rounded-2xl border border-white/10 bg-white/[0.04] px-2 py-3">
                                        <div class="text-[10px] uppercase tracking-[0.14em] text-slate-500">Views</div>
                                        <div class="mt-1 text-sm font-semibold text-white">{{ number_format($creator['total_views_count']) }}</div>
                                    </div>
                                </div>
                            </a>
                        @endforeach
                    </div>
                </div>
            @endif

            <div class="mt-6 grid gap-6 xl:grid-cols-2">
                @if(!empty($landingCollections))
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <div class="mb-4">
                            <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Collections</p>
                            <h2 class="mt-1 text-2xl font-semibold text-white">Featured collections</h2>
                        </div>
                        <div class="space-y-3">
                            @foreach($landingCollections as $collection)
                                <a href="{{ $collection['public_url'] }}" class="block rounded-[22px] border border-white/10 bg-white/[0.03] p-4 transition hover:border-white/20 hover:bg-white/[0.05]">
                                    <div class="flex items-start justify-between gap-3">
                                        <div>
                                            <div class="text-base font-semibold text-white">{{ $collection['name'] }}</div>
                                            <div class="mt-1 text-xs uppercase tracking-[0.18em] text-slate-500">{{ $collection['official'] ? 'Official collection' : '@' . ($collection['owner']['username'] ?? 'creator') }}</div>
                                        </div>
                                        <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ $collection['cards_count'] }} cards</span>
                                    </div>
                                    @if(!empty($collection['description']))
                                        <div class="mt-2 text-sm text-slate-400">{{ $collection['description'] }}</div>
                                    @endif
                                </a>
                            @endforeach
                        </div>
                    </div>
                @endif
                @if(($landingChallenges ?? collect())->count() > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <div class="mb-4">
                            <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Challenges</p>
                            <h2 class="mt-1 text-2xl font-semibold text-white">Editorial challenge picks</h2>
                        </div>
                        <div class="space-y-3">
                            @foreach($landingChallenges as $challenge)
                                <a href="{{ route('cards.challenges.show', ['slug' => $challenge->slug]) }}" class="block rounded-[22px] border border-white/10 bg-white/[0.03] p-4 transition hover:border-white/20 hover:bg-white/[0.05]">
                                    <div class="flex items-start justify-between gap-3">
                                        <div>
                                            <div class="text-base font-semibold text-white">{{ $challenge->title }}</div>
                                            <div class="mt-1 text-xs uppercase tracking-[0.18em] text-slate-500">{{ ucfirst((string) $challenge->status) }}{{ $challenge->official ? ' · Official' : '' }}</div>
                                        </div>
                                        <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ (int) $challenge->entries_count }} entries</span>
                                    </div>
                                    @if(!empty($challenge->description))
                                        <div class="mt-2 text-sm text-slate-400">{{ $challenge->description }}</div>
                                    @endif
                                </a>
                            @endforeach
                        </div>
                    </div>
                @endif
            </div>
        </section>
    @endif

    @if(($context ?? null) === 'seasonal' && count($seasonalHubs ?? []) > 0)
        <section class="px-6 pt-8 md:px-10">
            <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                <div class="mb-4">
                    <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Seasonal hubs</p>
                    <h2 class="mt-1 text-2xl font-semibold text-white">Recurring themes</h2>
                </div>
                <div class="flex flex-wrap gap-2">
                    @foreach($seasonalHubs as $hub)
                        <span class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200">{{ $hub['label'] }}</span>
                    @endforeach
                </div>
            </div>
        </section>
    @endif

    <section class="px-6 pt-8 md:px-10">
        <div class="grid gap-6 xl:grid-cols-[minmax(0,1fr)_320px]">
            <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                <div class="mb-4 flex items-center justify-between gap-4">
                    <div>
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Latest</p>
                        <h2 class="mt-1 text-2xl font-semibold text-white">{{ in_array(($context ?? null), ['creator', 'creator-portfolio'], true) ? (($context ?? null) === 'creator-portfolio' ? 'Portfolio works' : 'All published works') : 'Published cards' }}</h2>
                    </div>
                </div>
                @if(empty($cards))
                    <div class="rounded-[24px] border border-dashed border-white/12 bg-white/[0.03] px-6 py-14 text-center">
                        <div class="mx-auto flex h-20 w-20 items-center justify-center rounded-[24px] border border-white/12 bg-white/[0.05] text-slate-400">
                            <i class="fa-solid fa-id-card text-3xl"></i>
                        </div>
                        <h3 class="mt-5 text-2xl font-semibold text-white">No public cards yet</h3>
                        <p class="mx-auto mt-3 max-w-xl text-sm leading-7 text-slate-300">As creators publish their Nova Cards, they will appear here with crawlable quote text and preview imagery.</p>
                    </div>
                @else
                    <div class="grid gap-4 sm:grid-cols-2 xl:grid-cols-3">
                        @foreach($cards as $card)
                            @include('cards.partials.tile', ['card' => $card])
                        @endforeach
                    </div>
                @endif

                @if(isset($pagination) && method_exists($pagination, 'links'))
                    <div class="mt-6">
                        {{ $pagination->links() }}
                    </div>
                @endif
            </div>

            <aside class="space-y-6">
                @if(($context ?? null) === 'index' && count($categories ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Categories</p>
                        <div class="mt-4 flex flex-wrap gap-2">
                            @foreach($categories as $category)
                                <a href="{{ route('cards.category', ['categorySlug' => $category->slug]) }}" class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $category->name }}</a>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(($context ?? null) === 'index' && count($tags ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Popular tags</p>
                        <div class="mt-4 flex flex-wrap gap-2">
                            @foreach($tags as $tag)
                                <a href="{{ route('cards.tag', ['tagSlug' => $tag->slug]) }}" class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">#{{ $tag->name }}</a>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['index', 'mood'], true) && count($moodFamilies ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Mood families</p>
                        <div class="mt-4 flex flex-wrap gap-2">
                            @foreach($moodFamilies as $mood)
                                <a href="{{ route('cards.mood', ['moodSlug' => $mood['key']]) }}" class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $mood['label'] }}</a>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['index', 'style'], true) && count($styleFamilies ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Style families</p>
                        <div class="mt-4 flex flex-wrap gap-2">
                            @foreach($styleFamilies as $style)
                                <a href="{{ route('cards.style', ['styleSlug' => $style['key']]) }}" class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $style['label'] }}</a>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['index', 'style', 'palette'], true) && count($paletteFamilies ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Palette families</p>
                        <div class="mt-4 flex flex-wrap gap-2">
                            @foreach($paletteFamilies as $palette)
                                <a href="{{ route('cards.palette', ['paletteSlug' => $palette['key']]) }}" class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200 transition hover:bg-white/[0.08]">{{ $palette['label'] }}</a>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['index', 'seasonal'], true) && count($seasonalHubs ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Seasonal hubs</p>
                        <div class="mt-4 flex flex-wrap gap-2">
                            @foreach($seasonalHubs as $hub)
                                <span class="inline-flex items-center rounded-full border border-white/10 bg-white/[0.05] px-3 py-2 text-sm text-slate-200">{{ $hub['label'] }}</span>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(($context ?? null) === 'index' && count($collections ?? []) > 0)
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Collections</p>
                        <div class="mt-4 space-y-3">
                            @foreach($collections as $collection)
                                <a href="{{ $collection['public_url'] }}" class="block rounded-[22px] border border-white/10 bg-white/[0.03] p-4 transition hover:border-white/20 hover:bg-white/[0.05]">
                                    <div class="flex items-start justify-between gap-3">
                                        <div>
                                            <div class="text-base font-semibold text-white">{{ $collection['name'] }}</div>
                                            <div class="mt-1 text-xs uppercase tracking-[0.18em] text-slate-500">{{ $collection['official'] ? 'Official collection' : '@' . ($collection['owner']['username'] ?? 'creator') }}</div>
                                        </div>
                                        <span class="rounded-full border border-white/10 bg-white/[0.05] px-2.5 py-1 text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-200">{{ $collection['cards_count'] }} cards</span>
                                    </div>
                                    @if(!empty($collection['description']))
                                        <div class="mt-2 text-sm text-slate-400">{{ $collection['description'] }}</div>
                                    @endif
                                </a>
                            @endforeach
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['creator', 'creator-portfolio'], true) && !empty($creatorSummary))
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Creator pages</p>
                        <div class="mt-4 space-y-2 text-sm">
                            <a href="{{ route('cards.creator', ['username' => strtolower((string) $creatorSummary['creator']['username'])]) }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Profile overview</a>
                            <a href="{{ route('cards.creator.portfolio', ['username' => strtolower((string) $creatorSummary['creator']['username'])]) }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Portfolio page</a>
                        </div>
                    </div>

                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Creator signals</p>
                        <div class="mt-4 space-y-3 text-sm text-slate-300">
                            <div class="flex items-center justify-between gap-3 rounded-2xl border border-white/10 bg-white/[0.03] px-4 py-3">
                                <span>Total likes</span>
                                <span class="font-semibold text-white">{{ number_format($creatorSummary['stats']['total_likes'] ?? 0) }}</span>
                            </div>
                            <div class="flex items-center justify-between gap-3 rounded-2xl border border-white/10 bg-white/[0.03] px-4 py-3">
                                <span>Total saves</span>
                                <span class="font-semibold text-white">{{ number_format($creatorSummary['stats']['total_saves'] ?? 0) }}</span>
                            </div>
                            <div class="flex items-center justify-between gap-3 rounded-2xl border border-white/10 bg-white/[0.03] px-4 py-3">
                                <span>Total remixes</span>
                                <span class="font-semibold text-white">{{ number_format($creatorSummary['stats']['total_remixes'] ?? 0) }}</span>
                            </div>
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['remixed', 'remix-highlights'], true))
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Remix discovery</p>
                        <div class="mt-4 space-y-2 text-sm">
                            <a href="{{ route('cards.remixed') }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Latest remixes</a>
                            <a href="{{ route('cards.remix-highlights') }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Best remixes</a>
                        </div>
                    </div>
                @endif

                @if(in_array(($context ?? null), ['editorial', 'seasonal'], true))
                    <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                        <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">Discovery landings</p>
                        <div class="mt-4 space-y-2 text-sm">
                            <a href="{{ route('cards.editorial') }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Editorial picks</a>
                            <a href="{{ route('cards.seasonal') }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Seasonal cards</a>
                        </div>
                    </div>
                @endif

                <div class="rounded-[28px] border border-white/10 bg-white/[0.04] p-5">
                    <p class="text-[11px] font-semibold uppercase tracking-[0.22em] text-slate-500">V2 resources</p>
                    <div class="mt-4 space-y-2 text-sm">
                        <a href="{{ route('cards.templates') }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Template packs</a>
                        <a href="{{ route('cards.assets') }}" class="block rounded-2xl border border-white/10 bg-white/[0.05] px-4 py-3 text-slate-200 transition hover:bg-white/[0.08]">Asset packs</a>
                    </div>
                </div>
            </aside>
        </div>
    </section>
@endsection
