Upload 7 files

templates/auth/change_password.html

@@ -0,0 +1,73 @@
+{% extends "base.html" %}
+
+{% block title %}{% if has_password %}Change{% else %}Set{% endif %} Password - PyRunner{% endblock %}
+
+{% block content %}
+<div class="min-h-[calc(100vh-12rem)] flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md">
+        <div class="text-center mb-10">
+            <div class="w-16 h-16 bg-code-accent/20 rounded-2xl flex items-center justify-center mx-auto mb-6">
+                <svg class="w-8 h-8 text-code-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
+                </svg>
+            </div>
+            <h1 class="text-2xl font-bold text-code-text mb-2">
+                {% if has_password %}Change Password{% else %}Set Password{% endif %}
+            </h1>
+            <p class="text-code-muted">
+                {% if has_password %}
+                    Update your account password
+                {% else %}
+                    Create a password for your account
+                {% endif %}
+            </p>
+        </div>
+
+        <div class="bg-code-surface border border-code-border rounded-xl p-8">
+            {% if form.errors %}
+                <div class="mb-6 p-4 bg-code-red/10 border border-code-red/30 rounded-lg">
+                    {% for error in form.non_field_errors %}
+                        <p class="text-sm text-code-red">{{ error }}</p>
+                    {% endfor %}
+                </div>
+            {% endif %}
+
+            <form method="post" class="space-y-5">
+                {% csrf_token %}
+
+                <div>
+                    <label for="id_password" class="block text-sm font-medium text-code-muted mb-2">
+                        New Password
+                    </label>
+                    {{ form.password }}
+                    {% if form.password.help_text %}
+                        <p class="mt-1 text-xs text-code-muted">{{ form.password.help_text }}</p>
+                    {% endif %}
+                    {% if form.password.errors %}
+                        <p class="mt-1 text-xs text-code-red">{{ form.password.errors.0 }}</p>
+                    {% endif %}
+                </div>
+
+                <div>
+                    <label for="id_password_confirm" class="block text-sm font-medium text-code-muted mb-2">
+                        Confirm Password
+                    </label>
+                    {{ form.password_confirm }}
+                    {% if form.password_confirm.errors %}
+                        <p class="mt-1 text-xs text-code-red">{{ form.password_confirm.errors.0 }}</p>
+                    {% endif %}
+                </div>
+
+                <div class="flex space-x-4 pt-2">
+                    <a href="{% url 'cpanel:settings' %}" class="flex-1 py-3 px-4 bg-code-bg hover:bg-code-bg/80 text-code-text border border-code-border font-medium rounded-lg transition-colors text-center">
+                        Cancel
+                    </a>
+                    <button type="submit" class="flex-1 py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors">
+                        {% if has_password %}Change Password{% else %}Set Password{% endif %}
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+{% endblock %}

templates/auth/forgot_password.html

@@ -0,0 +1,54 @@
+{% extends "base.html" %}
+
+{% block title %}Forgot Password - PyRunner{% endblock %}
+
+{% block content %}
+<div class="min-h-[calc(100vh-12rem)] flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md">
+        <div class="text-center mb-10">
+            <div class="w-16 h-16 bg-code-accent/20 rounded-2xl flex items-center justify-center mx-auto mb-6">
+                <svg class="w-8 h-8 text-code-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
+                </svg>
+            </div>
+            <h1 class="text-2xl font-bold text-code-text mb-2">Forgot Password</h1>
+            <p class="text-code-muted">Enter your email to receive a password reset link</p>
+        </div>
+
+        <div class="bg-code-surface border border-code-border rounded-xl p-8">
+            <form method="post" class="space-y-5">
+                {% csrf_token %}
+
+                <div>
+                    <label for="email" class="block text-sm font-medium text-code-muted mb-2">
+                        Email address
+                    </label>
+                    <input
+                        type="email"
+                        id="email"
+                        name="email"
+                        required
+                        autocomplete="email"
+                        autofocus
+                        placeholder="you@example.com"
+                        class="w-full px-4 py-3 bg-code-bg border border-code-border rounded-lg text-code-text placeholder-code-muted/50 focus:outline-none focus:ring-2 focus:ring-code-accent/50 focus:border-code-accent transition-all"
+                    >
+                </div>
+
+                <button
+                    type="submit"
+                    class="w-full py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors"
+                >
+                    Send Reset Link
+                </button>
+            </form>
+
+            <div class="mt-6 text-center">
+                <a href="{% url 'auth:login' %}" class="text-sm text-code-muted hover:text-code-accent transition-colors">
+                    Back to sign in
+                </a>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}

templates/auth/invite_invalid.html

@@ -0,0 +1,55 @@
+{% extends "base.html" %}
+
+{% block title %}Invalid Invite - PyRunner{% endblock %}
+
+{% block content %}
+<div class="min-h-[calc(100vh-12rem)] flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md text-center">
+        <div class="w-20 h-20 bg-code-red/20 rounded-full flex items-center justify-center mx-auto mb-6">
+            <svg class="w-10 h-10 text-code-red" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
+            </svg>
+        </div>
+
+        <h1 class="text-2xl font-bold text-code-text mb-4">{{ error }}</h1>
+
+        <p class="text-code-muted mb-8">
+            {{ message }}
+        </p>
+
+        <div class="bg-code-surface border border-code-border rounded-xl p-6 mb-8">
+            <h3 class="text-sm font-medium text-code-text mb-3">What can you do?</h3>
+            <ul class="text-sm text-code-muted space-y-2 text-left">
+                <li class="flex items-start">
+                    <svg class="w-4 h-4 text-code-accent mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                    Ask an administrator for a new invite
+                </li>
+                <li class="flex items-start">
+                    <svg class="w-4 h-4 text-code-accent mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                    Check if you have the correct link
+                </li>
+                <li class="flex items-start">
+                    <svg class="w-4 h-4 text-code-accent mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                    If you already have an account, try signing in
+                </li>
+            </ul>
+        </div>
+
+        <a
+            href="{% url 'auth:login' %}"
+            class="inline-flex items-center text-code-accent hover:text-code-accent/80 transition-colors"
+        >
+            <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/>
+            </svg>
+            Back to sign in
+        </a>
+    </div>
+</div>
+{% endblock %}

templates/auth/login.html

@@ -0,0 +1,145 @@
+{% extends "base.html" %}
+
+{% block title %}Sign In - PyRunner{% endblock %}
+
+{% block header %}{% endblock %}
+{% block footer %}{% endblock %}
+
+{% block content %}
+<div class="min-h-screen flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md">
+        <div class="text-center mb-10">
+            <div class="w-16 h-16 bg-code-accent/20 rounded-2xl flex items-center justify-center mx-auto mb-6 glow-accent">
+                <svg class="w-8 h-8 text-code-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/>
+                </svg>
+            </div>
+            <h1 class="text-3xl font-bold gradient-text mb-6">PyRunner</h1>
+        </div>
+
+        <div class="bg-code-surface border border-code-border rounded-xl p-8">
+            <h2 class="text-xl font-semibold text-code-text mb-6 text-center">Sign In</h2>
+
+            {% if error_message %}
+                <div class="mb-6 p-4 bg-code-red/10 border border-code-red/30 rounded-lg">
+                    <p class="text-sm text-code-red">{{ error_message }}</p>
+                </div>
+            {% endif %}
+
+            <!-- Password Login Form -->
+            <form method="post" class="space-y-5" id="password-form">
+                {% csrf_token %}
+                <input type="hidden" name="action" value="password">
+
+                <div>
+                    <label for="id_email" class="block text-sm font-medium text-code-muted mb-2">
+                        Email address
+                    </label>
+                    {{ password_form.email }}
+                </div>
+
+                <div>
+                    <label for="id_password" class="block text-sm font-medium text-code-muted mb-2">
+                        Password
+                    </label>
+                    {{ password_form.password }}
+                </div>
+
+                <button
+                    type="submit"
+                    class="w-full py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors focus:outline-none focus:ring-2 focus:ring-code-accent/50 focus:ring-offset-2 focus:ring-offset-code-surface"
+                >
+                    Sign In
+                </button>
+            </form>
+
+            {% if email_enabled %}
+                <!-- Forgot Password Link -->
+                <div class="mt-4 text-center">
+                    <a href="{% url 'auth:forgot_password' %}" class="text-sm text-code-muted hover:text-code-accent transition-colors">
+                        Forgot your password?
+                    </a>
+                </div>
+
+                <!-- Divider -->
+                <div class="relative my-6">
+                    <div class="absolute inset-0 flex items-center">
+                        <div class="w-full border-t border-code-border"></div>
+                    </div>
+                    <div class="relative flex justify-center text-sm">
+                        <span class="px-4 bg-code-surface text-code-muted">or</span>
+                    </div>
+                </div>
+
+                <!-- Magic Link Section -->
+                <div id="magic-link-section">
+                    <button
+                        type="button"
+                        onclick="toggleMagicLink()"
+                        id="magic-link-toggle"
+                        class="w-full py-3 px-4 bg-code-bg hover:bg-code-bg/80 text-code-text border border-code-border font-medium rounded-lg transition-colors flex items-center justify-center space-x-2"
+                    >
+                        <svg class="w-5 h-5 text-code-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
+                        </svg>
+                        <span>Use Magic Link Instead</span>
+                    </button>
+
+                    <form method="post" class="hidden mt-4 space-y-4" id="magic-link-form">
+                        {% csrf_token %}
+                        <input type="hidden" name="action" value="magic_link">
+
+                        <div>
+                            <label for="magic_email" class="block text-sm font-medium text-code-muted mb-2">
+                                Email address
+                            </label>
+                            <input
+                                type="email"
+                                id="magic_email"
+                                name="magic_email"
+                                required
+                                autocomplete="email"
+                                placeholder="you@example.com"
+                                class="w-full px-4 py-3 bg-code-bg border border-code-border rounded-lg text-code-text placeholder-code-muted/50 focus:outline-none focus:ring-2 focus:ring-code-accent/50 focus:border-code-accent transition-all"
+                            >
+                        </div>
+
+                        <button
+                            type="submit"
+                            class="w-full py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors"
+                        >
+                            Send Magic Link
+                        </button>
+
+                        <button
+                            type="button"
+                            onclick="toggleMagicLink()"
+                            class="w-full py-2 text-sm text-code-muted hover:text-code-text transition-colors"
+                        >
+                            Back to password login
+                        </button>
+                    </form>
+                </div>
+            {% endif %}
+        </div>
+    </div>
+</div>
+
+<script>
+function toggleMagicLink() {
+    const toggle = document.getElementById('magic-link-toggle');
+    const form = document.getElementById('magic-link-form');
+    const passwordForm = document.getElementById('password-form');
+
+    if (form.classList.contains('hidden')) {
+        form.classList.remove('hidden');
+        toggle.classList.add('hidden');
+        passwordForm.classList.add('hidden');
+    } else {
+        form.classList.add('hidden');
+        toggle.classList.remove('hidden');
+        passwordForm.classList.remove('hidden');
+    }
+}
+</script>
+{% endblock %}

templates/auth/magic_link_sent.html

@@ -0,0 +1,127 @@
+{% extends "base.html" %}
+
+{% block title %}{% if show_magic_link %}Sign In{% else %}Check Your Email{% endif %} - PyRunner{% endblock %}
+
+{% block content %}
+<div class="min-h-[calc(100vh-12rem)] flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md text-center">
+        {% if show_magic_link %}
+        <!-- Email not configured - show magic link with security warning -->
+        <div class="w-20 h-20 bg-red-500/20 rounded-full flex items-center justify-center mx-auto mb-6">
+            <svg class="w-10 h-10 text-red-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
+            </svg>
+        </div>
+
+        <h1 class="text-2xl font-bold text-code-text mb-4">Your Sign-In Link</h1>
+
+        <!-- Security Warning -->
+        <div class="bg-red-500/10 border border-red-500/30 rounded-xl p-5 mb-6 text-left">
+            <div class="flex items-start gap-3 mb-3">
+                <svg class="w-5 h-5 text-red-400 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
+                </svg>
+                <div>
+                    <h3 class="text-red-400 font-semibold text-sm">Security Warning: Email Not Configured</h3>
+                    <p class="text-xs text-code-muted mt-1">
+                        Sign-in links are displayed on-screen because email is disabled.
+                        <strong class="text-red-300">Anyone who sees this screen can sign in.</strong>
+                    </p>
+                </div>
+            </div>
+            <p class="text-xs text-red-300/80 ml-8">
+                Configure SMTP in Settings → Email Notifications to send links securely.
+            </p>
+        </div>
+
+        <!-- Sign In Button and Link -->
+        <div class="bg-code-surface border border-code-border rounded-xl p-6 mb-6">
+            <a href="{{ magic_link_url }}"
+               class="block w-full py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors text-center mb-4">
+                Sign In Now
+            </a>
+
+            <div class="relative">
+                <input type="text"
+                       value="{{ magic_link_url }}"
+                       readonly
+                       id="magic-link-input"
+                       class="w-full px-4 py-3 pr-20 bg-code-bg border border-code-border rounded-lg text-code-text font-mono text-xs">
+                <button onclick="copyMagicLink()"
+                        id="copy-btn"
+                        class="absolute right-2 top-1/2 -translate-y-1/2 px-3 py-1.5 bg-code-surface border border-code-border rounded text-code-muted text-sm hover:text-code-text hover:bg-code-border transition-colors">
+                    Copy
+                </button>
+            </div>
+
+            <p class="text-xs text-code-muted mt-3 text-center">
+                Expires in 15 minutes. One-time use only.
+            </p>
+        </div>
+
+        <script>
+        function copyMagicLink() {
+            const input = document.getElementById('magic-link-input');
+            const btn = document.getElementById('copy-btn');
+            navigator.clipboard.writeText(input.value).then(() => {
+                btn.textContent = 'Copied!';
+                btn.classList.add('text-code-green');
+                setTimeout(() => {
+                    btn.textContent = 'Copy';
+                    btn.classList.remove('text-code-green');
+                }, 2000);
+            });
+        }
+        </script>
+
+        {% else %}
+        <!-- Email configured - show check email message -->
+        <div class="w-20 h-20 bg-code-green/20 rounded-full flex items-center justify-center mx-auto mb-6">
+            <svg class="w-10 h-10 text-code-green" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
+            </svg>
+        </div>
+
+        <h1 class="text-2xl font-bold text-code-text mb-4">Check your email</h1>
+
+        <p class="text-code-muted mb-8">
+            We've sent you a magic link to sign in. Click the link in your email to continue.
+        </p>
+
+        <div class="bg-code-surface border border-code-border rounded-xl p-6 mb-8">
+            <h3 class="text-sm font-medium text-code-text mb-3">Didn't receive the email?</h3>
+            <ul class="text-sm text-code-muted space-y-2 text-left">
+                <li class="flex items-start">
+                    <svg class="w-4 h-4 text-code-accent mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                    Check your spam or junk folder
+                </li>
+                <li class="flex items-start">
+                    <svg class="w-4 h-4 text-code-accent mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                    Make sure you entered the correct email
+                </li>
+                <li class="flex items-start">
+                    <svg class="w-4 h-4 text-code-accent mr-2 mt-0.5 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
+                    </svg>
+                    The link expires in 15 minutes
+                </li>
+            </ul>
+        </div>
+        {% endif %}
+
+        <a
+            href="{% url 'auth:login' %}"
+            class="inline-flex items-center text-code-accent hover:text-code-accent/80 transition-colors"
+        >
+            <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/>
+            </svg>
+            Back to sign in
+        </a>
+    </div>
+</div>
+{% endblock %}

templates/auth/reset_password.html

@@ -0,0 +1,80 @@
+{% extends "base.html" %}
+
+{% block title %}Reset Password - PyRunner{% endblock %}
+
+{% block content %}
+<div class="min-h-[calc(100vh-12rem)] flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md">
+        <div class="text-center mb-10">
+            <div class="w-16 h-16 bg-code-accent/20 rounded-2xl flex items-center justify-center mx-auto mb-6">
+                <svg class="w-8 h-8 text-code-accent" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/>
+                </svg>
+            </div>
+            <h1 class="text-2xl font-bold text-code-text mb-2">Reset Password</h1>
+            <p class="text-code-muted">Enter your new password</p>
+        </div>
+
+        <div class="bg-code-surface border border-code-border rounded-xl p-8">
+            {% if error %}
+                <!-- Error State -->
+                <div class="text-center">
+                    <div class="w-16 h-16 bg-code-red/20 rounded-full flex items-center justify-center mx-auto mb-6">
+                        <svg class="w-8 h-8 text-code-red" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+                        </svg>
+                    </div>
+                    <h2 class="text-xl font-semibold text-code-text mb-2">{{ error }}</h2>
+                    <p class="text-code-muted mb-6">{{ message }}</p>
+                    <a href="{% url 'auth:forgot_password' %}" class="inline-block py-3 px-6 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors">
+                        Request New Link
+                    </a>
+                </div>
+            {% else %}
+                <!-- Reset Form -->
+                {% if form.errors %}
+                    <div class="mb-6 p-4 bg-code-red/10 border border-code-red/30 rounded-lg">
+                        {% for error in form.non_field_errors %}
+                            <p class="text-sm text-code-red">{{ error }}</p>
+                        {% endfor %}
+                    </div>
+                {% endif %}
+
+                <form method="post" class="space-y-5">
+                    {% csrf_token %}
+
+                    <div>
+                        <label for="id_password" class="block text-sm font-medium text-code-muted mb-2">
+                            New Password
+                        </label>
+                        {{ form.password }}
+                        {% if form.password.help_text %}
+                            <p class="mt-1 text-xs text-code-muted">{{ form.password.help_text }}</p>
+                        {% endif %}
+                        {% if form.password.errors %}
+                            <p class="mt-1 text-xs text-code-red">{{ form.password.errors.0 }}</p>
+                        {% endif %}
+                    </div>
+
+                    <div>
+                        <label for="id_password_confirm" class="block text-sm font-medium text-code-muted mb-2">
+                            Confirm Password
+                        </label>
+                        {{ form.password_confirm }}
+                        {% if form.password_confirm.errors %}
+                            <p class="mt-1 text-xs text-code-red">{{ form.password_confirm.errors.0 }}</p>
+                        {% endif %}
+                    </div>
+
+                    <button
+                        type="submit"
+                        class="w-full py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors"
+                    >
+                        Reset Password
+                    </button>
+                </form>
+            {% endif %}
+        </div>
+    </div>
+</div>
+{% endblock %}

templates/auth/verify.html

@@ -0,0 +1,26 @@
+{% extends "base.html" %}
+
+{% block title %}{{ error }} - PyRunner{% endblock %}
+
+{% block content %}
+<div class="min-h-[calc(100vh-12rem)] flex items-center justify-center px-4 py-12">
+    <div class="w-full max-w-md text-center">
+        <div class="w-20 h-20 bg-code-red/20 rounded-full flex items-center justify-center mx-auto mb-6">
+            <svg class="w-10 h-10 text-code-red" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
+            </svg>
+        </div>
+
+        <h1 class="text-2xl font-bold text-code-text mb-4">{{ error }}</h1>
+
+        <p class="text-code-muted mb-8">{{ message }}</p>
+
+        <a
+            href="{% url 'auth:login' %}"
+            class="inline-flex items-center justify-center w-full py-3 px-4 bg-code-accent hover:bg-code-accent/90 text-white font-semibold rounded-lg transition-colors"
+        >
+            Request a new link
+        </a>
+    </div>
+</div>
+{% endblock %}