<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, interactive-widget=resizes-content">
    <meta name="theme-color" content="#271b5b">
    <meta name="asset-version" content="{{ static_version }}">
    <title>{% if page_title %}{{ page_title }}{% else %}DevPlace - The Developer Social Network{% endif %}</title>
    <meta name="description" content="{% if meta_description %}{{ meta_description }}{% else %}Track industry shifts. Discover bold releases. Share what you're building in an open environment built by developers, for developers.{% endif %}">
    <link rel="canonical" href="{{ canonical_url or request.url }}">
    {% if prev_url %}<link rel="prev" href="{{ prev_url }}">{% endif %}
    {% if next_url %}<link rel="next" href="{{ next_url }}">{% endif %}
    <meta name="robots" content="{{ meta_robots or 'index,follow' }}">
    {% if meta_keywords %}<meta name="keywords" content="{{ meta_keywords }}">{% endif %}

    <meta property="og:title" content="{{ og_title or page_title or 'DevPlace' }}">
    <meta property="og:description" content="{{ og_description or meta_description or 'The Developer Social Network' }}">
    <meta property="og:type" content="{{ og_type or 'website' }}">
    <meta property="og:url" content="{{ canonical_url or request.url }}">
    <meta property="og:image" content="{{ static_url(og_image or '/static/og-default.png') }}">
    {% if not og_image or og_image == '/static/og-default.png' %}
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">
    {% endif %}
    <meta property="og:image:alt" content="{{ og_title or page_title or 'DevPlace' }}">
    <meta property="og:site_name" content="DevPlace">
    <meta property="og:locale" content="en_US">

    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="{{ og_title or page_title or 'DevPlace' }}">
    <meta name="twitter:description" content="{{ og_description or meta_description or 'The Developer Social Network' }}">
    <meta name="twitter:image" content="{{ static_url(og_image or '/static/og-default.png') }}">
    <meta name="twitter:image:alt" content="{{ og_title or page_title or 'DevPlace' }}">

    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>&#x1f4bb;</text></svg>">
    <link rel="apple-touch-icon" href="{{ static_url('/static/apple-touch-icon.png') }}">
    <link rel="manifest" href="/manifest.json">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="DevPlace">

    <link rel="modulepreload" href="{{ static_url('/static/js/Application.js') }}">
    <link rel="modulepreload" href="{{ static_url('/static/js/components/index.js') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/variables.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/base.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/components.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/vendor/atom-one-dark.min.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/markdown.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/mention.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/attachments.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/lightbox.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/media.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/engagement.css') }}">
    <link rel="stylesheet" href="{{ static_url('/static/css/opinionwar.css') }}">
    {% block extra_head %}{% endblock %}
    {{ custom_css_tag(request) }}
    {{ extra_head_tag() }}

    {% if page_schema %}
    <script type="application/ld+json">
{{ page_schema | safe }}
    </script>
    {% endif %}
</head>
<body data-user-uid="{{ user['uid'] if user else '' }}">
    <a class="skip-link" href="#main-content">Skip to main content</a>
    <nav class="topnav" aria-label="Primary">
        <div class="topnav-inner">
            <a href="/feed" class="topnav-logo">Dev<span>Place</span></a>
            <div class="topnav-links">
                <a href="/" class="topnav-link {{ nav_active(request, '/') }}"><span class="icon">🏠</span> Home</a>
                <a href="/feed" class="topnav-link {{ nav_active(request, '/feed') }}"><span class="icon">📝</span> Posts</a>
                <a href="/news" class="topnav-link {{ nav_active(request, '/news') }}"><span class="icon">📰</span> News</a>
                <a href="/gists" class="topnav-link {{ nav_active(request, '/gists') }}"><span class="icon">📄</span> Gists</a>
                <a href="/projects" class="topnav-link {{ nav_active(request, '/projects') }}"><span class="icon">🚀</span> Projects</a>
                <a href="/quizzes" class="topnav-link {{ nav_active(request, '/quizzes') }}"><span class="icon">🧩</span> Quizzes</a>
                <a href="/battles" class="topnav-link {{ nav_active(request, '/battles') }}"><span class="icon">&#x2694;&#xFE0E;</span> Battles</a>
                {% if user %}<a href="/game" class="topnav-link {{ nav_active(request, '/game') }}"><span class="icon">🌱</span> Farm</a>{% endif %}
            </div>
            <div class="topnav-right">
                <a href="/leaderboard" class="topnav-icon {{ nav_active(request, '/leaderboard') }}" title="Leaderboard" aria-label="Leaderboard">
                    <span class="nav-bell" aria-hidden="true">🏆</span>
                </a>
                <div class="topnav-tools-dropdown {{ nav_active(request, '/tools') }}">
                    <button type="button" class="topnav-icon topnav-tools-toggle" aria-expanded="false" aria-controls="tools-menu" title="Tools" aria-label="Tools"><span class="nav-bell" aria-hidden="true">🧰</span></button>
                    <div class="dropdown-menu" id="tools-menu">
                        <a href="/tools/seo" class="dropdown-item"><span class="icon">🔍</span> SEO Diagnostics</a>
                        <a href="/tools/deepsearch" class="dropdown-item"><span class="icon">🧠</span> DeepSearch</a>
                        <a href="/tools/isslop" class="dropdown-item"><span class="icon">🧪</span> AI Usage Analyzer</a>
                    </div>
                </div>
                {% if user %}
                {% set msg_unread = get_unread_messages(user["uid"]) %}
                <a href="/messages" class="topnav-icon {{ nav_active(request, '/messages') }}" data-counter="messages" data-counter-noun="messages" title="Messages" aria-label="{% if msg_unread %}{{ msg_unread }} unread messages{% else %}Messages, no unread{% endif %}">
                    <span class="nav-bell" aria-hidden="true">✉️<span class="nav-badge" data-counter-badge {% if msg_unread == 0 %}hidden{% endif %}>{{ msg_unread }}</span></span>
                </a>
                <button type="button" class="topnav-icon" data-push-enable hidden title="Enable push notifications" aria-label="Enable push notifications">
                    <span class="nav-bell">🔕</span>
                </button>
                {% set unread_count = get_unread_count(user["uid"]) %}
                <a href="/notifications" class="topnav-icon" data-counter="notifications" data-counter-noun="notifications" title="Notifications" aria-label="{% if unread_count %}{{ unread_count }} unread notifications{% else %}Notifications, no unread{% endif %}">
                    <span class="nav-bell" aria-hidden="true">🔔<span class="nav-badge" data-counter-badge {% if unread_count == 0 %}hidden{% endif %}>{{ unread_count }}</span></span>
                </a>
                {% if is_admin(user) %}
                <a href="/admin" class="topnav-icon {{ nav_active(request, '/admin') }}" title="Admin" aria-label="Admin">
                    <span class="nav-bell">⚙️</span>
                </a>
                {% endif %}
                <div class="topnav-user-dropdown">
                    <button type="button" class="topnav-user" aria-label="User menu" aria-expanded="false" aria-controls="user-menu">
                        <span class="avatar-badge"><img src="{{ avatar_url('multiavatar', avatar_seed(user), 32) }}" class="avatar-img avatar-sm" alt="{{ user['username'] }}" loading="lazy">{% set _user = user %}{% include "_presence_dot.html" %}{% include "_award_badge.html" %}</span>
                        <div class="topnav-user-info">
                            <span class="topnav-user-name">{{ user['username'] }}</span>
                            <span class="topnav-user-level">Level {{ user.get('level', 1) }}</span>
                        </div>
                    </button>
                    <div class="dropdown-menu" id="user-menu">
                        <a href="/profile/{{ user['username'] }}" class="dropdown-item"><span class="icon">👤</span> Profile</a>
                        <a href="/devii/" class="dropdown-item" data-devii-open><span class="icon">🤖</span> Devii</a>
                        <a href="/bookmarks/saved" class="dropdown-item"><span class="icon">🔖</span> Saved</a>
                        <a href="/auth/logout" class="dropdown-item"><span class="icon">🚪</span> Logout</a>
                    </div>
                </div>
                {% else %}
                <a href="/auth/login" class="topnav-link"><span class="icon">🔑</span> Login</a>
                <a href="/auth/signup" class="btn btn-primary btn-sm"><span class="icon">✨</span>Sign Up</a>
                {% set _ios_url = ios_app_url() %}
                {% if _ios_url %}
                <a href="{{ _ios_url }}" class="app-store-nav-link" target="_blank" rel="noopener noreferrer" aria-label="Download the DevPlace app on the App Store">
                    <img src="{{ static_url('/static/app-store-badge.svg') }}" alt="App Store" class="app-store-nav-badge" width="90" height="30" loading="lazy">
                </a>
                {% endif %}
                {% endif %}
                <button type="button" class="topnav-hamburger" id="hamburger-btn" aria-label="Toggle menu" aria-controls="mobile-panel" aria-expanded="false">☰</button>
            </div>
        </div>
    </nav>

    <div class="topnav-mobile-overlay" id="mobile-overlay" aria-hidden="true"></div>
    <div class="topnav-mobile-panel" id="mobile-panel" inert>
        <nav class="topnav-mobile-links" aria-label="Mobile">
            <a href="/" class="topnav-mobile-link {{ nav_active(request, '/') }}"><span class="icon">🏠</span> Home</a>
            <a href="/feed" class="topnav-mobile-link {{ nav_active(request, '/feed') }}"><span class="icon">📝</span> Posts</a>
            <a href="/news" class="topnav-mobile-link {{ nav_active(request, '/news') }}"><span class="icon">📰</span> News</a>
            <a href="/gists" class="topnav-mobile-link {{ nav_active(request, '/gists') }}"><span class="icon">📄</span> Gists</a>
            <a href="/projects" class="topnav-mobile-link {{ nav_active(request, '/projects') }}"><span class="icon">🚀</span> Projects</a>
            <a href="/quizzes" class="topnav-mobile-link {{ nav_active(request, '/quizzes') }}"><span class="icon">🧩</span> Quizzes</a>
            <a href="/battles" class="topnav-mobile-link {{ nav_active(request, '/battles') }}"><span class="icon">&#x2694;&#xFE0E;</span> Battles</a>
            <a href="/leaderboard" class="topnav-mobile-link {{ nav_active(request, '/leaderboard') }}"><span class="icon">🏆</span> Leaderboard</a>
            {% if user %}<a href="/game" class="topnav-mobile-link {{ nav_active(request, '/game') }}"><span class="icon">🌱</span> Farm</a>{% endif %}
            <div class="topnav-mobile-divider"></div>
            <div class="topnav-mobile-section-label">Tools</div>
            <a href="/tools/seo" class="topnav-mobile-link {{ nav_active(request, '/tools/seo') }}"><span class="icon">🔍</span> SEO Diagnostics</a>
            <a href="/tools/deepsearch" class="topnav-mobile-link {{ nav_active(request, '/tools/deepsearch') }}"><span class="icon">🧠</span> DeepSearch</a>
            <a href="/tools/isslop" class="topnav-mobile-link {{ nav_active(request, '/tools/isslop') }}"><span class="icon">🧪</span> AI Usage Analyzer</a>
            {% if user %}
            <a href="/messages" class="topnav-mobile-link {{ nav_active(request, '/messages') }}" data-counter="messages" data-counter-noun="messages" aria-label="{% if get_unread_messages(user['uid']) %}Messages, {{ get_unread_messages(user['uid']) }} unread{% else %}Messages, no unread{% endif %}"><span class="icon">✉️</span> Messages<span class="nav-badge nav-badge-inline" data-counter-badge {% if get_unread_messages(user["uid"]) == 0 %}hidden{% endif %} aria-hidden="true">{{ get_unread_messages(user["uid"]) }}</span></a>
            <a href="/notifications" class="topnav-mobile-link {{ nav_active(request, '/notifications') }}" data-counter="notifications" data-counter-noun="notifications" aria-label="{% if get_unread_count(user['uid']) %}Notifications, {{ get_unread_count(user['uid']) }} unread{% else %}Notifications, no unread{% endif %}"><span class="icon">🔔</span> Notifications<span class="nav-badge nav-badge-inline" data-counter-badge {% if get_unread_count(user["uid"]) == 0 %}hidden{% endif %} aria-hidden="true">{{ get_unread_count(user["uid"]) }}</span></a>
            {% if is_admin(user) %}
            <div class="topnav-mobile-divider"></div>
            <div class="topnav-mobile-section-label">Admin</div>
            <a href="/admin" class="topnav-mobile-link {{ nav_active(request, '/admin', exact=True) }}"><span class="icon">🛡️</span> Dashboard</a>
            <a href="/admin/users" class="topnav-mobile-link {{ nav_active(request, '/admin/users') }}"><span class="icon">👥</span> Users</a>
            <a href="/admin/news" class="topnav-mobile-link {{ nav_active(request, '/admin/news') }}"><span class="icon">📰</span> News</a>
            <a href="/admin/media" class="topnav-mobile-link {{ nav_active(request, '/admin/media') }}"><span class="icon">🖼️</span> Media</a>
            <a href="/admin/trash" class="topnav-mobile-link {{ nav_active(request, '/admin/trash') }}"><span class="icon">🗑️</span> Trash</a>
            <a href="/admin/services" class="topnav-mobile-link {{ nav_active(request, '/admin/services') }}"><span class="icon">⚙️</span> Services</a>
            <a href="/admin/containers" class="topnav-mobile-link {{ nav_active(request, '/admin/containers') }}"><span class="icon">📦</span> Containers</a>
            <a href="/admin/bots" class="topnav-mobile-link {{ nav_active(request, '/admin/bots') }}"><span class="icon">🤖</span> Bot Monitor</a>
            <a href="/admin/ai-usage" class="topnav-mobile-link {{ nav_active(request, '/admin/ai-usage') }}"><span class="icon">📊</span> AI usage</a>
            <a href="/admin/audit-log" class="topnav-mobile-link {{ nav_active(request, '/admin/audit-log') }}"><span class="icon">📋</span> Audit Log</a>
            <a href="/admin/notifications" class="topnav-mobile-link {{ nav_active(request, '/admin/notifications') }}"><span class="icon">🔔</span> Notifications</a>
            <a href="/admin/settings" class="topnav-mobile-link {{ nav_active(request, '/admin/settings') }}"><span class="icon">🔧</span> Settings</a>
            {% endif %}
            <div class="topnav-mobile-divider"></div>
            <div class="topnav-mobile-user">
                <span class="avatar-badge"><img src="{{ avatar_url('multiavatar', avatar_seed(user), 32) }}" class="avatar-img avatar-sm" alt="{{ user['username'] }}" loading="lazy">{% set _user = user %}{% include "_presence_dot.html" %}{% include "_award_badge.html" %}</span>
                <div class="topnav-mobile-user-info">
                    <span>{{ user['username'] }}</span>
                    <span class="topnav-mobile-user-level">Level {{ user.get('level', 1) }}</span>
                </div>
            </div>
            <a href="/profile/{{ user['username'] }}" class="topnav-mobile-link"><span class="icon">👤</span> Profile</a>
            <a href="/devii/" class="topnav-mobile-link" data-devii-open><span class="icon">🤖</span> Devii</a>
            <a href="/bookmarks/saved" class="topnav-mobile-link {{ nav_active(request, '/bookmarks') }}"><span class="icon">🔖</span> Saved</a>
            <a href="/auth/logout" class="topnav-mobile-link"><span class="icon">🚪</span> Logout</a>
            {% else %}
            <div class="topnav-mobile-divider"></div>
            <a href="/auth/login" class="topnav-mobile-link"><span class="icon">🔑</span> Login</a>
            <a href="/auth/signup" class="topnav-mobile-link"><span class="icon">✨</span> Sign Up</a>
            {% set _ios_url = ios_app_url() %}
            {% if _ios_url %}
            <a href="{{ _ios_url }}" class="topnav-mobile-link app-store-mobile-link" target="_blank" rel="noopener noreferrer" aria-label="Download the DevPlace app on the App Store">
                <img src="{{ static_url('/static/app-store-badge.svg') }}" alt="Download on the App Store" class="app-store-mobile-badge" width="120" height="40" loading="lazy">
            </a>
            {% endif %}
            {% endif %}
        </nav>
    </div>

    {% if breadcrumbs and breadcrumbs|length > 1 %}
    <nav aria-label="Breadcrumb" class="breadcrumb">
        <ol>
            {% for crumb in breadcrumbs %}
            <li>
                {% if not loop.last %}
                <a href="{{ crumb.url }}">{{ crumb.name }}</a>
                {% else %}
                <span aria-current="page">{{ crumb.name }}</span>
                {% endif %}
            </li>
            {% endfor %}
        </ol>
    </nav>
    {% endif %}

    <main id="main-content" class="page" tabindex="-1" data-page-type="{{ page_type_for(request) }}">
        {% block content %}{% endblock %}
    </main>

{% block footer %}
    <footer class="site-footer">
        <div class="footer-inner">
            {% include "_footer_links.html" %}
        </div>
    </footer>
{% endblock %}

    {%- set _response_time = response_time_ms(request) -%}
    {%- if _response_time %}<div class="response-time-indicator" title="Server response time" aria-hidden="true">{{ _response_time }} ms</div>{% endif -%}

    {% if user %}
    {% include "_report_dialog.html" %}
    <template id="comment-reply-template">
        {% set _comment_target_uid = "" %}{% set _comment_target_type = "" %}{% include "_comment_form.html" %}
    </template>
    {% endif %}

    <script defer src="{{ static_url('/static/vendor/marked.umd.js') }}"></script>
    <script defer src="{{ static_url('/static/vendor/highlight.min.js') }}"></script>
    <script defer src="{{ static_url('/static/vendor/purify.min.js') }}"></script>
    <script type="module" src="{{ static_url('/static/js/Application.js') }}"></script>
    {% block extra_js %}{% endblock %}
    {{ custom_js_tag(request) }}
</body>
</html>
