<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Rise to the top of the Tensor Trust leaderboard by fooling AI language models, and help researchers make more secure AI along the way.">
    <title>{% block title_override%}{% block title_head %}Banking with AI{% endblock title_head %} | Tensor Trust{% endblock title_override %}</title>
    {% load static %}
    <link rel="icon" type="image/png" href="{% static 'images/favicon.png' %}" sizes="128x128">
    <link
        rel="stylesheet" 
        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" 
        integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" 
        crossorigin="anonymous" 
        referrerpolicy="no-referrer" />
    <link
        rel="stylesheet"
        href="https://cdnjs.cloudflare.com/ajax/libs/inter-ui/3.19.3/inter.css"
        integrity="sha512-3kSeajrEqMrItwRkYz09bOsHsl4/wpoT6mgw5Aw+eSLweQtX7kZp2P/Dm7hnUg/TrbTGesAgCPwvZpllhuROTw=="
        crossorigin="anonymous"
        referrerpolicy="no-referrer" />
    <script
        src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"
        integrity="sha512-J9QfbPuFlqGD2CYVCa6zn8/7PEgZnGpM5qtFOBZgwujjDnG5w5Fjx46YzqvIh/ORstcj7luStvvIHkisQi5SKw=="
        crossorigin="anonymous"
        referrerpolicy="no-referrer"></script>
    <script
        src="https://cdnjs.cloudflare.com/ajax/libs/garlic.js/1.4.2/garlic.min.js"
        integrity="sha384-qalT3nvc6AjtzIMLeV8HVCPahbvSLkXYtnGchjjItxfrtFM7rjrh4vjpzrpiBOe8"
        crossorigin="anonymous"></script>
    <script
        src="https://unpkg.com/htmx.org@1.9.5/dist/htmx.min.js"
        integrity="sha384-xcuj3WpfgjlKF+FXhSQFQ0ZNr39ln+hwjN3npfM9VBnUskLolQAcN80McRIVOPuO"
        crossorigin="anonymous"></script>
    <script
        src="https://unpkg.com/htmx.org@1.9.5/dist/ext/sse.js"
        integrity="sha384-9sPcBiA9fhU9fq7gfjFF29VlQp6vyoGP5skQ99zfpnpCEUZ2+9f+XmIk/DGE+ndH"
        crossorigin="anonymous"></script>
    <script src="{% static 'js/common.js' %}"></script>
    <script src="{% static 'js/vendor/sse.js' %}"></script>
    <script src="{% static 'js/vgrow.js' %}"></script>
    <script src="{% static 'js/hx-post-streaming.js' %}"></script>
    {% load static tailwind_tags %}
    {% tailwind_css %}
    {% block head %}
    {% endblock %}
</head>

<body
    class="bg-beige"
    {% if request.user.is_authenticated %}
        hx-ext="sse" sse-connect="{% url 'notifications' %}"
    {% endif %}
>
    <nav class="bg-cream p-6">
        <div class="flex flex-col md:flex-row justify-between items-center max-w-5xl mx-auto">
            {% if request.user.is_authenticated %}
                <div class="flex flex-col md:flex-row items-center">
                    <div class="flex justify-center md:justify-start w-full mb-4 md:mr-7 md:mb-0 md:w-auto">
                        <a href="{% url 'overview' %}">
                            <img src="{% static 'images/logo-1544x250.png' %}" alt="Logo showing a robot with a safe and the words 'Tensor Trust' next to it" class="md:max-h-12">
                        </a>
                    </div>
                        <div class="nav-links">
                            <a href="{% url 'overview' %}" class="md:text-lg mr-1 md:mr-4 hover:underline">Home</a>
                            <a href="{% url 'security' %}" class="md:text-lg mr-1 md:mr-4 hover:underline">Defend</a>
                            <a href="{% url 'subaccounts' %}" class="md:text-lg mr-1 md:mr-4 hover:underline">Attack</a>
                            <a href="{% url 'leaderboard' %}" class="md:text-lg mr-1 md:mr-4 hover:underline">Leaderboard</a>
                            <!-- There cannot be any spaces in the innerText of
                            this element or else the Discord button will split
                            across lines when the screen is small. -->
                            <a href="https://discord.gg/9R2PaHf4RG" class="text-xs md:text-lg discord-btn whitespace-nowrap" target="_blank"><span class="hidden md:inline">Chat&nbsp;</span><i class="fab fa-discord"></i></a>
                        </div>
                </div>
            {% else %}
                <div class="flex justify-center w-full w-auto">
                    <a href="{% url 'create_account' %}">
                        <img src="{% static 'images/logo-1544x250.png' %}" alt="Logo showing a robot with a safe and the words 'Tensor Trust' next to it" class="max-h-24">
                    </a>
                </div>
            {% endif %}

            {% if request.user.is_authenticated %}
                {% load gameui %}
                <div class="hidden md:block text-sm">
                    <p class="font-semibold">{{ account.account_name }}</p>
                    <p>
                        <span class="font-semibold">Balance:</span>
                        $<span sse-swap="new_balance">{{ account.balance }} 💰</span>
                    </p>
                    <p><span class="font-semibold">Tier:</span> {% tier account.balance "title" %} {% tier account.balance "emoji" %}</p>
                    <p>
                        <span class="font-semibold">Status:</span>
                        <span sse-swap="lock_state_changed">
                            {% if account.locked %}
                                Locked 🔒
                            {% else %}
                                Unlocked 🟢
                            {% endif %}
                        </span>
                    </p>
                </div>
            {% endif %}
        </div>
    </nav>

    <div class="container max-w-4xl mx-auto px-4">
        {% include "migration_alert.html" %}
        {% if account.unlock_at is not None %}
            <div sse-swap="lock_state_changed_alert">
                {% include "lock_alert.html" with locked=account.locked has_been_attacked=account.has_been_attacked auto_unlock_time_left=account.auto_unlock_time_left %}
            </div>
        {% endif %}
        {% if messages %}
            {% for message in messages %}
                <div class="django-messages {% if message.tags %}{{ message.tags }}{% endif %}">
                    {{ message }}
                </div>
            {% endfor %}
        {% endif %}
        {% block content %}
        {% endblock %}
    </div>
    {# Things like modals can go in post_content. It's useful for stuff that #}
    {# needs to exist outside of the main container. #}
    {% block post_content %}
    {% endblock %}
    <hr class="border-stone-400 border-t-1 max-w-md mx-auto mt-8">
    <footer class="text-center py-3 mb-6">
        <p class="text-stone-500">
            &copy; 2023 Tensor Trust. All rights reversed.
            <br/>
            <a href="{% url 'consent_and_terms' %}" class="underline hover:text-stone-700">Consent and Terms</a>
            | <a href="{% url 'paper' %}" target="_blank" class="underline hover:text-stone-700">Paper</a>
            | <a href="https://github.com/HumanCompatibleAI/tensor-trust" target="_blank" class="underline hover:text-stone-700">Code</a>
        </p>
        <p class="mt-2 text-stone-500 text-xs">
            <span class="font-semibold">Tensor Trust Bank Managers</span>
            <br/>
            <a class="underline hover:text-stone-700" href="https://twitter.com/sdtoyer">Sam</a>,
            <a class="underline hover:text-stone-700" href="https://twitter.com/OliviaGWatkins2">Olivia</a>,
            <a class="underline hover:text-stone-700" href="https://twitter.com/EthanMendes3">Ethan</a>,
            <a class="underline hover:text-stone-700" href="https://twitter.com/justinsvegliato">Justin</a>,
            <a class="underline hover:text-stone-700" href="https://twitter.com/LukeBailey181">Luke</a>,
            <a class="underline hover:text-stone-700" href="https://twitter.com/cnnmonsugar">Tiffany</a>,
            <a class="underline hover:text-stone-700" href="https://twitter.com/isaacongjw">Isaac</a>,
            <a class="underline hover:text-stone-700" href="https://kael.tech.blog/">Karim</a>
        </p>
    </footer>
</body>

</html>
