diff --git a/GrepoRemoteLoader.user.js b/GrepoRemoteLoader.user.js
index d4e9442..e03cef5 100644
--- a/GrepoRemoteLoader.user.js
+++ b/GrepoRemoteLoader.user.js
@@ -19,6 +19,17 @@
     const MAX_TRIES  = 3;
     const RETRY_BASE = 3000; // 3 s, then 6 s
 
+    // ----------------------------------------------------------------
+    // CLAN_KEY: Set this to your clan's unique key.
+    // Leave it empty ('') and the bot will refuse to run.
+    // ----------------------------------------------------------------
+    const CLAN_KEY = ''; // <-- paste your clan key here
+
+    if (!CLAN_KEY || CLAN_KEY.trim() === '') {
+        console.error('[Loader] ❌ CLAN_KEY is not set. Bot will not start. Contact your admin for the key.');
+        return; // stop everything
+    }
+
     function loadBot(attempt) {
         attempt = attempt || 1;
         console.log(`[Loader] Fetching bot code (attempt ${attempt}/${MAX_TRIES})...`);
@@ -26,10 +37,14 @@
         GM_xmlhttpRequest({
             method: 'GET',
             url: `${BASE_URL}/api/bot?t=${Date.now()}`,
+            headers: {
+                'X-Clan-Key': CLAN_KEY
+            },
             onload: function(response) {
                 if (response.status === 200) {
                     console.log('[Loader] Bot code downloaded. Executing...');
                     try {
+                        window.__GRC_CLAN_KEY = CLAN_KEY; // make key available inside the bot's scope
                         eval(response.responseText);
                     } catch (e) {
                         console.error('[Loader] Execution error:', e);
diff --git a/app.py b/app.py
index b0c4adb..d646e37 100644
--- a/app.py
+++ b/app.py
@@ -1,33 +1,67 @@
-from flask import Flask, request, jsonify
+from flask import Flask, request, jsonify, redirect, url_for
 from flask_cors import CORS
-from db import init_db
+from flask_login import LoginManager, UserMixin, login_user, logout_user, login_required, current_user
+from db import init_db, get_db
 from routes.api import api
 from routes.dashboard import dashboard
+from routes.auth import auth
 
-# Initialise DB schema (e.g. creating newly added tables) when the app starts
+# Initialise DB schema when the app starts
 init_db()
 
 app = Flask(__name__)
+app.secret_key = 'grc-super-secret-key-change-in-production'
 
+# ----------------------------------------------------------------
+# Flask-Login setup
+# ----------------------------------------------------------------
+login_manager = LoginManager()
+login_manager.init_app(app)
+login_manager.login_view = 'auth.login'
+login_manager.login_message = 'Παρακαλώ συνδεθείτε για να συνεχίσετε.'
+
+class User(UserMixin):
+    def __init__(self, id, username):
+        self.id       = id
+        self.username = username
+
+@login_manager.user_loader
+def load_user(user_id):
+    conn = get_db()
+    row  = conn.execute('SELECT id, username FROM users WHERE id = ?', (user_id,)).fetchone()
+    conn.close()
+    if row:
+        return User(row['id'], row['username'])
+    return None
+
+# Make current_user available in all templates
+@app.context_processor
+def inject_user():
+    return dict(current_user=current_user)
+
+# ----------------------------------------------------------------
+# CORS
+# ----------------------------------------------------------------
 CORS(app, resources={r"/*": {"origins": "*"}}, supports_credentials=False)
 
-# Belt-and-suspenders: inject CORS headers on every response,
-# including error responses that flask-cors might miss.
 @app.after_request
 def add_cors_headers(response):
     response.headers['Access-Control-Allow-Origin']  = '*'
     response.headers['Access-Control-Allow-Methods'] = 'GET, POST, DELETE, OPTIONS'
-    response.headers['Access-Control-Allow-Headers'] = 'Content-Type, Authorization'
+    response.headers['Access-Control-Allow-Headers'] = 'Content-Type, Authorization, X-Clan-Key'
     return response
 
-# Explicitly handle OPTIONS preflight for all routes
 @app.route('/', defaults={'path': ''}, methods=['OPTIONS'])
 @app.route('/<path:path>', methods=['OPTIONS'])
 def handle_options(path):
     return jsonify({}), 200
 
+# ----------------------------------------------------------------
+# Blueprints
+# ----------------------------------------------------------------
 app.register_blueprint(api)
 app.register_blueprint(dashboard)
+app.register_blueprint(auth)
 
 if __name__ == '__main__':
     print("✅ Grepolis Remote — DB initialised")
diff --git a/bot_modules/00_config.js b/bot_modules/00_config.js
index d53724a..1d4b46d 100644
--- a/bot_modules/00_config.js
+++ b/bot_modules/00_config.js
@@ -3,9 +3,12 @@
 // Runs first; everything here is available to all other modules.
 // ================================================================
 
-const uw = typeof unsafeWindow !== 'undefined' ? unsafeWindow : window;
+const uw       = typeof unsafeWindow !== 'undefined' ? unsafeWindow : window;
 const BASE_URL = 'https://grepo.haunter-pets.top';
 
+// Read the clan key injected by the Loader before eval()
+const CLAN_KEY = window.__GRC_CLAN_KEY || '';
+
 // Returns a random integer between min and max (inclusive)
 function randInt(min, max) {
     return Math.floor(Math.random() * (max - min + 1)) + min;
@@ -29,3 +32,12 @@ function log(msg) {
 function sleep(ms) {
     return new Promise(r => setTimeout(r, ms));
 }
+
+// Wrapper around fetch() that automatically injects the X-Clan-Key header
+// on every request. Use this instead of fetch() everywhere in the bot.
+function apiFetch(url, options) {
+    options = options || {};
+    options.headers = options.headers || {};
+    options.headers['X-Clan-Key'] = CLAN_KEY;
+    return fetch(url, options);
+}
diff --git a/bot_modules/02_state.js b/bot_modules/02_state.js
index 30e8015..f0bc4d2 100644
--- a/bot_modules/02_state.js
+++ b/bot_modules/02_state.js
@@ -200,7 +200,7 @@ function pushState() {
     if (paused) return;
     try {
         const payload = gatherState();
-        fetch(`${BASE_URL}/api/state`, {
+        apiFetch(`${BASE_URL}/api/state`, {
             method: 'POST',
             headers: { 'Content-Type': 'application/json' },
             body: JSON.stringify(payload)
@@ -236,7 +236,7 @@ if (uw.$) {
 
 // ---- Report command result back to relay -----------------------------
 function reportResult(cmdId, status, message) {
-    fetch(`${BASE_URL}/api/commands/${cmdId}/result`, {
+    apiFetch(`${BASE_URL}/api/commands/${cmdId}/result`, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ status, message })
diff --git a/bot_modules/03_captcha.js b/bot_modules/03_captcha.js
index 0e4c210..57910a0 100644
--- a/bot_modules/03_captcha.js
+++ b/bot_modules/03_captcha.js
@@ -8,7 +8,7 @@ let captchaActive = false;
 function reportCaptcha(detected) {
     const player_id = uw.Game?.player_id;
     if (!player_id) return;
-    fetch(`${BASE_URL}/api/captcha/alert?player_id=${player_id}`, {
+    apiFetch(`${BASE_URL}/api/captcha/alert?player_id=${player_id}`, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ detected })
diff --git a/bot_modules/05_main.js b/bot_modules/05_main.js
index 097ba1c..d18b3cd 100644
--- a/bot_modules/05_main.js
+++ b/bot_modules/05_main.js
@@ -10,7 +10,7 @@ async function pollAndExecute() {
 
     let cmdData;
     try {
-        const res = await fetch(`${BASE_URL}/api/commands/pending?player_id=${player_id}`);
+        const res = await apiFetch(`${BASE_URL}/api/commands/pending?player_id=${player_id}`);
         cmdData   = await res.json();
     } catch (e) {
         log(`Poll failed: ${e}`);
@@ -114,7 +114,7 @@ async function pollAndExecute() {
             if (allFull) {
                 log('⚠️ Auto-farm: ALL warehouses are full (>95%) — skipping loot this cycle');
                 try {
-                    await fetch(`${BASE_URL}/api/farm_status?player_id=${uw.Game.player_id}`, {
+                    await apiFetch(`${BASE_URL}/api/farm_status?player_id=${uw.Game.player_id}`, {
                         method: 'POST',
                         headers: { 'Content-Type': 'application/json' },
                         body: JSON.stringify({ warehouse_full: true })
@@ -122,7 +122,7 @@ async function pollAndExecute() {
                 } catch (e) {}
             } else if (claimedAny) {
                 try {
-                    await fetch(`${BASE_URL}/api/farm_status?player_id=${uw.Game.player_id}`, {
+                    await apiFetch(`${BASE_URL}/api/farm_status?player_id=${uw.Game.player_id}`, {
                         method: 'POST',
                         headers: { 'Content-Type': 'application/json' },
                         body: JSON.stringify({ warehouse_full: false })
diff --git a/db.py b/db.py
index f1af9c3..4bfcbea 100644
--- a/db.py
+++ b/db.py
@@ -1,5 +1,6 @@
 import sqlite3
 import os
+import secrets
 
 DB_PATH = os.path.join(os.path.dirname(__file__), 'grepo.db')
 
@@ -81,5 +82,43 @@ def init_db():
         except Exception:
             pass  # column already exists
 
+    # Users — website admin accounts
+    c.execute('''
+        CREATE TABLE IF NOT EXISTS users (
+            id            INTEGER PRIMARY KEY AUTOINCREMENT,
+            username      TEXT    NOT NULL UNIQUE,
+            password_hash TEXT    NOT NULL,
+            created_at    TEXT    NOT NULL DEFAULT (datetime('now'))
+        )
+    ''')
+
+    # Clans — groups owned by a user, identified by a unique clan_key
+    c.execute('''
+        CREATE TABLE IF NOT EXISTS clans (
+            id         INTEGER PRIMARY KEY AUTOINCREMENT,
+            owner_id   INTEGER NOT NULL REFERENCES users(id),
+            name       TEXT    NOT NULL,
+            clan_key   TEXT    NOT NULL UNIQUE,
+            created_at TEXT    NOT NULL DEFAULT (datetime('now'))
+        )
+    ''')
+
+    # Clan members — links Grepolis player_ids to a clan
+    c.execute('''
+        CREATE TABLE IF NOT EXISTS clan_members (
+            id          INTEGER PRIMARY KEY AUTOINCREMENT,
+            clan_id     INTEGER NOT NULL REFERENCES clans(id),
+            player_id   TEXT    NOT NULL,
+            player_name TEXT,
+            joined_at   TEXT    NOT NULL DEFAULT (datetime('now')),
+            UNIQUE(clan_id, player_id)
+        )
+    ''')
+
     conn.commit()
     conn.close()
+
+
+def generate_clan_key():
+    """Generate a short, unique, human-readable clan key."""
+    return secrets.token_urlsafe(8).upper()[:10]
diff --git a/requirements.txt b/requirements.txt
index 18ebecf..17bf17b 100644
--- a/requirements.txt
+++ b/requirements.txt
@@ -1,3 +1,4 @@
 flask
 flask-cors
+flask-login
 gunicorn
\ No newline at end of file
diff --git a/routes/api.py b/routes/api.py
index 15666fe..8a595a3 100644
--- a/routes/api.py
+++ b/routes/api.py
@@ -8,6 +8,38 @@ from flask import make_response
 api = Blueprint('api', __name__)
 
 
+# ------------------------------------------------------------------
+# Helper — look up clan by the X-Clan-Key header.
+# Returns the clan row dict, or None if key is missing / invalid.
+# ------------------------------------------------------------------
+def _get_clan_from_request():
+    key = request.headers.get('X-Clan-Key', '').strip()
+    if not key:
+        return None
+    conn = get_db()
+    clan = conn.execute('SELECT * FROM clans WHERE clan_key = ?', (key,)).fetchone()
+    conn.close()
+    return clan
+
+
+# ------------------------------------------------------------------
+# Helper — auto-register a player_id under a clan on first push.
+# ------------------------------------------------------------------
+def _auto_register_member(clan_id, player_id, player_name):
+    conn = get_db()
+    conn.execute('''
+        INSERT OR IGNORE INTO clan_members (clan_id, player_id, player_name)
+        VALUES (?, ?, ?)
+    ''', (clan_id, str(player_id), player_name or ''))
+    # Update name in case it changed
+    conn.execute('''
+        UPDATE clan_members SET player_name = ?
+        WHERE clan_id = ? AND player_id = ?
+    ''', (player_name or '', clan_id, str(player_id)))
+    conn.commit()
+    conn.close()
+
+
 # ------------------------------------------------------------------
 # POST /api/state
 # Tampermonkey pushes a full town snapshot every poll cycle.
@@ -18,11 +50,16 @@ def receive_state():
     if not data:
         return jsonify({'error': 'no data'}), 400
 
-    towns = data.get('towns', [])
-    player       = data.get('player', '')
-    player_id    = data.get('player_id', '')
-    alliance_id  = str(data.get('alliance_id', '') or '')
-    world_id     = data.get('world_id', '')
+    towns     = data.get('towns', [])
+    player    = data.get('player', '')
+    player_id = data.get('player_id', '')
+    alliance_id = str(data.get('alliance_id', '') or '')
+    world_id  = data.get('world_id', '')
+
+    # Auto-register this player to the clan that matches the key (if any)
+    clan = _get_clan_from_request()
+    if clan:
+        _auto_register_member(clan['id'], player_id, player)
 
     conn = get_db()
     c = conn.cursor()
@@ -260,9 +297,15 @@ def farm_status():
 # ------------------------------------------------------------------
 @api.route('/api/bot', methods=['GET'])
 def serve_bot():
+    # Require a valid clan key — reject unknown clients
+    clan = _get_clan_from_request()
+    if not clan:
+        return make_response('Unauthorized: invalid or missing clan key', 403)
+
     bot_dir = os.path.join(os.path.dirname(os.path.dirname(__file__)), 'bot_modules')
     if not os.path.exists(bot_dir):
         return make_response("Bot modules directory not found", 404)
+
         
     modules = sorted([f for f in os.listdir(bot_dir) if f.endswith('.js')])
     
diff --git a/routes/auth.py b/routes/auth.py
new file mode 100644
index 0000000..adad502
--- /dev/null
+++ b/routes/auth.py
@@ -0,0 +1,194 @@
+from flask import Blueprint, render_template, request, jsonify, redirect, url_for, flash
+from flask_login import login_user, logout_user, login_required, current_user
+from werkzeug.security import generate_password_hash, check_password_hash
+from db import get_db, generate_clan_key
+from datetime import datetime
+
+auth = Blueprint('auth', __name__)
+
+
+# ------------------------------------------------------------------
+# Helper — resolve the User class from app (avoid circular import)
+# ------------------------------------------------------------------
+def _make_user(row):
+    from app import User
+    return User(row['id'], row['username'])
+
+
+# ------------------------------------------------------------------
+# GET/POST /auth/login
+# ------------------------------------------------------------------
+@auth.route('/auth/login', methods=['GET', 'POST'])
+def login():
+    if current_user.is_authenticated:
+        return redirect(url_for('dashboard.index'))
+
+    error = None
+    if request.method == 'POST':
+        username = request.form.get('username', '').strip()
+        password = request.form.get('password', '')
+
+        conn = get_db()
+        row  = conn.execute(
+            'SELECT id, username, password_hash FROM users WHERE username = ?', (username,)
+        ).fetchone()
+        conn.close()
+
+        if row and check_password_hash(row['password_hash'], password):
+            user = _make_user(row)
+            login_user(user, remember=True)
+            return redirect(url_for('dashboard.index'))
+        else:
+            error = 'Λάθος όνομα χρήστη ή κωδικός.'
+
+    return render_template('login.html', error=error)
+
+
+# ------------------------------------------------------------------
+# GET/POST /auth/register
+# ------------------------------------------------------------------
+@auth.route('/auth/register', methods=['GET', 'POST'])
+def register():
+    if current_user.is_authenticated:
+        return redirect(url_for('dashboard.index'))
+
+    error = None
+    if request.method == 'POST':
+        username = request.form.get('username', '').strip()
+        password = request.form.get('password', '')
+        confirm  = request.form.get('confirm', '')
+
+        if not username or not password:
+            error = 'Συμπλήρωσε όνομα χρήστη και κωδικό.'
+        elif password != confirm:
+            error = 'Οι κωδικοί δεν ταιριάζουν.'
+        elif len(password) < 6:
+            error = 'Ο κωδικός πρέπει να έχει τουλάχιστον 6 χαρακτήρες.'
+        else:
+            conn = get_db()
+            existing = conn.execute(
+                'SELECT id FROM users WHERE username = ?', (username,)
+            ).fetchone()
+            if existing:
+                error = 'Το όνομα χρήστη χρησιμοποιείται ήδη.'
+                conn.close()
+            else:
+                pw_hash = generate_password_hash(password)
+                conn.execute(
+                    'INSERT INTO users (username, password_hash) VALUES (?, ?)',
+                    (username, pw_hash)
+                )
+                conn.commit()
+                row = conn.execute(
+                    'SELECT id, username, password_hash FROM users WHERE username = ?', (username,)
+                ).fetchone()
+                conn.close()
+                user = _make_user(row)
+                login_user(user, remember=True)
+                return redirect(url_for('auth.options'))
+
+    return render_template('register.html', error=error)
+
+
+# ------------------------------------------------------------------
+# GET /auth/logout
+# ------------------------------------------------------------------
+@auth.route('/auth/logout')
+@login_required
+def logout():
+    logout_user()
+    return redirect(url_for('auth.login'))
+
+
+# ------------------------------------------------------------------
+# GET/POST /auth/options  — Clan management page
+# ------------------------------------------------------------------
+@auth.route('/auth/options', methods=['GET', 'POST'])
+@login_required
+def options():
+    conn = get_db()
+
+    # Load this user's clan (one clan per user for now)
+    clan = conn.execute(
+        'SELECT * FROM clans WHERE owner_id = ?', (current_user.id,)
+    ).fetchone()
+
+    members = []
+    if clan:
+        members = conn.execute(
+            '''SELECT cm.id, cm.player_id, cm.player_name, cm.joined_at,
+                      ts.updated_at
+               FROM clan_members cm
+               LEFT JOIN town_state ts ON ts.player_id = cm.player_id
+               WHERE cm.clan_id = ?
+               GROUP BY cm.player_id
+               ORDER BY cm.joined_at DESC''',
+            (clan['id'],)
+        ).fetchall()
+
+    conn.close()
+    return render_template('options.html', clan=clan, members=members)
+
+
+# ------------------------------------------------------------------
+# POST /auth/clan/create
+# ------------------------------------------------------------------
+@auth.route('/auth/clan/create', methods=['POST'])
+@login_required
+def create_clan():
+    clan_name = request.form.get('clan_name', '').strip()
+    if not clan_name:
+        return redirect(url_for('auth.options'))
+
+    conn = get_db()
+    existing = conn.execute(
+        'SELECT id FROM clans WHERE owner_id = ?', (current_user.id,)
+    ).fetchone()
+
+    if not existing:
+        key = generate_clan_key()
+        conn.execute(
+            'INSERT INTO clans (owner_id, name, clan_key) VALUES (?, ?, ?)',
+            (current_user.id, clan_name, key)
+        )
+        conn.commit()
+
+    conn.close()
+    return redirect(url_for('auth.options'))
+
+
+# ------------------------------------------------------------------
+# POST /auth/clan/regenerate-key
+# ------------------------------------------------------------------
+@auth.route('/auth/clan/regenerate-key', methods=['POST'])
+@login_required
+def regenerate_key():
+    new_key = generate_clan_key()
+    conn = get_db()
+    conn.execute(
+        'UPDATE clans SET clan_key = ? WHERE owner_id = ?',
+        (new_key, current_user.id)
+    )
+    conn.commit()
+    conn.close()
+    return redirect(url_for('auth.options'))
+
+
+# ------------------------------------------------------------------
+# POST /auth/clan/remove-member/<player_id>
+# ------------------------------------------------------------------
+@auth.route('/auth/clan/remove-member/<player_id>', methods=['POST'])
+@login_required
+def remove_member(player_id):
+    conn = get_db()
+    clan = conn.execute(
+        'SELECT id FROM clans WHERE owner_id = ?', (current_user.id,)
+    ).fetchone()
+    if clan:
+        conn.execute(
+            'DELETE FROM clan_members WHERE clan_id = ? AND player_id = ?',
+            (clan['id'], player_id)
+        )
+        conn.commit()
+    conn.close()
+    return redirect(url_for('auth.options'))
diff --git a/routes/dashboard.py b/routes/dashboard.py
index efd400e..e1e8fd4 100644
--- a/routes/dashboard.py
+++ b/routes/dashboard.py
@@ -1,4 +1,5 @@
 from flask import Blueprint, render_template, request, jsonify
+from flask_login import login_required, current_user
 from db import get_db
 import json
 from datetime import datetime, timedelta
@@ -11,21 +12,36 @@ dashboard = Blueprint('dashboard', __name__)
 # Serve the dashboard HTML
 # ------------------------------------------------------------------
 @dashboard.route('/')
+@login_required
 def index():
     conn = get_db()
+
+    # Get the logged-in user's clan
+    clan = conn.execute(
+        'SELECT id FROM clans WHERE owner_id = ?', (current_user.id,)
+    ).fetchone()
+
+    if not clan:
+        # User has no clan yet — send them to options to create one
+        conn.close()
+        return render_template('index.html', players=[], no_clan=True)
+
+    clan_id = clan['id']
+
+    # Only fetch players that are members of this clan
     rows = conn.execute('''
-        SELECT player, player_id, MAX(updated_at) as last_seen, MAX(world_id) as world_id 
-        FROM town_state 
-        WHERE player IS NOT NULL 
-        GROUP BY player, player_id 
-        ORDER BY player ASC
-    ''').fetchall()
-    
-    # Pre-fetch all active captchas
+        SELECT ts.player, ts.player_id, MAX(ts.updated_at) as last_seen, MAX(ts.world_id) as world_id
+        FROM town_state ts
+        INNER JOIN clan_members cm ON cm.player_id = ts.player_id AND cm.clan_id = ?
+        WHERE ts.player IS NOT NULL
+        GROUP BY ts.player, ts.player_id
+        ORDER BY ts.player ASC
+    ''', (clan_id,)).fetchall()
+
     captcha_rows = conn.execute("SELECT key, value FROM kv_store WHERE key LIKE 'captcha_active_%'").fetchall()
     active_captchas = {r['key'].replace('captcha_active_', ''): True for r in captcha_rows if r['value'] == '1'}
     conn.close()
-    
+
     players = []
     now = datetime.utcnow()
     for r in rows:
@@ -37,26 +53,30 @@ def index():
                     is_online = True
             except Exception:
                 pass
-        
+
         players.append({
-            'player': r['player'],
-            'player_id': r['player_id'],
-            'world_id': r['world_id'] or 'Unknown',
-            'is_online': is_online,
+            'player':         r['player'],
+            'player_id':      r['player_id'],
+            'world_id':       r['world_id'] or 'Unknown',
+            'is_online':      is_online,
             'captcha_active': active_captchas.get(r['player_id'], False)
         })
 
-    return render_template('index.html', players=players)
+    return render_template('index.html', players=players, no_clan=False)
+
 
 @dashboard.route('/player/<player_id>')
+@login_required
 def player_hub(player_id):
     return render_template('hub.html', player_id=player_id)
 
 @dashboard.route('/player/<player_id>/admin')
+@login_required
 def player_dashboard(player_id):
     return render_template('dashboard.html', player_id=player_id)
 
 @dashboard.route('/player/<player_id>/farm')
+@login_required
 def player_farm(player_id):
     return render_template('farm.html', player_id=player_id)
 
diff --git a/templates/index.html b/templates/index.html
index c2c63e4..b146792 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -5,26 +5,64 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Grepolis Remote Dashboard - Select Player</title>
 <link rel="stylesheet" href="/static/css/styles.css">
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
 <style>
+  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
   body {
+    font-family: 'Inter', 'Segoe UI', sans-serif;
+    background-color: #0d1117;
+    min-height: 100vh;
+    color: #e6edf3;
+  }
+  /* --- Top nav --- */
+  .topbar {
+    background: #161b22;
+    border-bottom: 1px solid #30363d;
+    padding: 14px 32px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .topbar-logo { font-size: 1.1rem; font-weight: 700; color: #c8a44a; }
+  .topbar-nav  { display: flex; gap: 16px; align-items: center; }
+  .topbar-nav a {
+    color: #8b949e; font-size: 0.875rem; text-decoration: none;
+    padding: 6px 12px; border-radius: 6px; transition: background 0.2s, color 0.2s;
+  }
+  .topbar-nav a:hover { background: #21262d; color: #e6edf3; }
+  .topbar-nav .user-badge { color: #c8a44a; font-size: 0.875rem; font-weight: 600; }
+  .btn-logout {
+    background: rgba(248,81,73,0.1); color: #f85149;
+    border: 1px solid rgba(248,81,73,0.3); padding: 6px 14px; border-radius: 6px;
+    font-size: 0.875rem; font-family: inherit; text-decoration: none;
+    transition: background 0.2s;
+  }
+  .btn-logout:hover { background: rgba(248,81,73,0.2) !important; }
+
+  /* --- Main content --- */
+  .main-content {
     display: flex;
     justify-content: center;
-    align-items: center;
-    min-height: 100vh;
-    background-color: #1a1a24;
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    align-items: flex-start;
+    padding: 60px 20px;
+    min-height: calc(100vh - 57px);
   }
   .landing-container {
-    background: #2a2a36;
+    background: #161b22;
+    border: 1px solid #30363d;
     padding: 2rem;
-    border-radius: 8px;
-    box-shadow: 0 4px 6px rgba(0,0,0,0.3);
+    border-radius: 10px;
+    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
     text-align: center;
-    max-width: 500px;
+    max-width: 520px;
     width: 100%;
   }
+  .landing-container h1 { color: #c8a44a; margin-bottom: 5px; font-size: 1.5rem; }
+  .landing-container > p { color: #8b949e; margin-bottom: 20px; font-size: 0.9rem; }
+
   .player-card {
-    background: #3a3a46;
+    background: #21262d;
     margin: 10px 0;
     padding: 15px;
     border-radius: 6px;
@@ -33,66 +71,86 @@
     color: white;
     display: block;
     transition: background 0.2s, transform 0.1s;
-    font-size: 1.1rem;
-    border: 1px solid #4a4a56;
+    font-size: 1rem;
+    border: 1px solid #30363d;
   }
-  .player-card:hover {
-    background: #5a5a66;
-    transform: translateY(-2px);
-    border-color: #c8a44a;
+  .player-card:hover { background: #30363d; transform: translateY(-2px); border-color: #c8a44a; }
+  .player-card span  { color: #8b949e; font-size: 0.8rem; margin-left: 8px; }
+
+  .no-clan-box {
+    background: rgba(200,164,74,0.1);
+    border: 1px solid rgba(200,164,74,0.3);
+    border-radius: 8px;
+    padding: 20px;
+    margin-top: 10px;
   }
-  .player-card span {
-    color: #888;
-    font-size: 0.8rem;
-    margin-left: 10px;
-  }
-  h1 {
-    color: #c8a44a;
-    margin-bottom: 5px;
-  }
-  p {
-    color: #aaa;
-    margin-bottom: 20px;
+  .no-clan-box p { color: #c8a44a; margin-bottom: 12px; }
+  .btn-create {
+    display: inline-block;
+    background: #c8a44a; color: #0d1117;
+    padding: 9px 20px; border-radius: 6px;
+    font-weight: 700; font-size: 0.875rem; text-decoration: none;
+    transition: background 0.2s;
   }
+  .btn-create:hover { background: #e0b85a; }
 </style>
 </head>
 <body>
-  <div class="landing-container">
-    <h1>⚔️ Grepolis Remote</h1>
-    <p>Select an active account to manage</p>
-    
-    {% if not players %}
-      <p style="color: #ffaa55;">No players found! Install the Tampermonkey script and log into the game first.</p>
-    {% endif %}
 
-    {% for p in players %}
-      <a href="/player/{{ p.player_id }}" class="player-card">
-        <div style="display: flex; justify-content: space-between; align-items: center;">
-          <div>
-            <strong>{{ p.player }}</strong> <span style="color: #6fcfcf;">[{{ p.world_id }}]</span> <span>(ID: {{ p.player_id }})</span>
-          </div>
-          <div style="display: flex; gap: 8px;">
-            {% if p.captcha_active %}
-              <span style="display: flex; align-items: center; gap: 6px; background: rgba(255, 100, 100, 0.2); padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; color: #ff6464; font-weight: bold; border: 1px solid rgba(255, 100, 100, 0.5); box-shadow: 0 0 8px rgba(255, 100, 100, 0.4);">
-                ⚠️ Captcha
-              </span>
-            {% endif %}
-
-            {% if p.is_online %}
-              <span style="display: flex; align-items: center; gap: 6px; background: rgba(50, 150, 50, 0.2); padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; color: #7bcc7b; font-weight: bold; border: 1px solid rgba(123, 204, 123, 0.3);">
-                <span style="display: inline-block; width: 8px; height: 8px; background: #7bcc7b; border-radius: 50%; box-shadow: 0 0 6px #7bcc7b;"></span>
-                Online
-              </span>
-            {% else %}
-              <span style="display: flex; align-items: center; gap: 6px; background: rgba(150, 50, 50, 0.2); padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; color: #cc7b7b; font-weight: bold; border: 1px solid rgba(204, 123, 123, 0.3);">
-                <span style="display: inline-block; width: 8px; height: 8px; background: #cc7b7b; border-radius: 50%;"></span>
-                Offline
-              </span>
-            {% endif %}
-          </div>
-        </div>
-      </a>
-    {% endfor %}
+  <div class="topbar">
+    <span class="topbar-logo">⚔️ Grepolis Remote</span>
+    <div class="topbar-nav">
+      {% if current_user.is_authenticated %}
+        <span class="user-badge">{{ current_user.username }}</span>
+        <a href="/auth/options">Ρυθμίσεις</a>
+        <a href="/auth/logout" class="btn-logout">Αποσύνδεση</a>
+      {% endif %}
+    </div>
   </div>
+
+  <div class="main-content">
+    <div class="landing-container">
+      <h1>⚔️ Grepolis Remote</h1>
+      <p>Select an active account to manage</p>
+
+      {% if no_clan %}
+        <div class="no-clan-box">
+          <p>Δεν έχετε δημιουργήσει clan ακόμη. Πηγαίνετε στις Ρυθμίσεις για να ξεκινήσετε.</p>
+          <a href="/auth/options" class="btn-create">🏰 Δημιουργία Clan →</a>
+        </div>
+      {% elif not players %}
+        <p style="color:#ffaa55;">Κανένας παίκτης δεν έχει συνδεθεί ακόμη. Βεβαιωθείτε ότι το Loader script τρέχει με το σωστό Clan Key.</p>
+      {% endif %}
+
+      {% for p in players %}
+        <a href="/player/{{ p.player_id }}" class="player-card">
+          <div style="display: flex; justify-content: space-between; align-items: center;">
+            <div>
+              <strong>{{ p.player }}</strong>
+              <span style="color:#6fcfcf;">[{{ p.world_id }}]</span>
+              <span>(ID: {{ p.player_id }})</span>
+            </div>
+            <div style="display: flex; gap: 8px;">
+              {% if p.captcha_active %}
+                <span style="display:flex;align-items:center;gap:6px;background:rgba(255,100,100,0.2);padding:5px 12px;border-radius:20px;font-size:0.8rem;color:#ff6464;font-weight:bold;border:1px solid rgba(255,100,100,0.5);">
+                  ⚠️ Captcha
+                </span>
+              {% endif %}
+              {% if p.is_online %}
+                <span style="display:flex;align-items:center;gap:6px;background:rgba(50,150,50,0.2);padding:5px 12px;border-radius:20px;font-size:0.8rem;color:#7bcc7b;font-weight:bold;border:1px solid rgba(123,204,123,0.3);">
+                  <span style="display:inline-block;width:8px;height:8px;background:#7bcc7b;border-radius:50%;box-shadow:0 0 6px #7bcc7b;"></span>Online
+                </span>
+              {% else %}
+                <span style="display:flex;align-items:center;gap:6px;background:rgba(150,50,50,0.2);padding:5px 12px;border-radius:20px;font-size:0.8rem;color:#cc7b7b;font-weight:bold;border:1px solid rgba(204,123,123,0.3);">
+                  <span style="display:inline-block;width:8px;height:8px;background:#cc7b7b;border-radius:50%;"></span>Offline
+                </span>
+              {% endif %}
+            </div>
+          </div>
+        </a>
+      {% endfor %}
+    </div>
+  </div>
+
 </body>
 </html>
diff --git a/templates/login.html b/templates/login.html
new file mode 100644
index 0000000..6ee952a
--- /dev/null
+++ b/templates/login.html
@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<html lang="el">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Grepolis Remote — Σύνδεση</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+<style>
+  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+  body {
+    font-family: 'Inter', sans-serif;
+    background: #0d1117;
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #e6edf3;
+  }
+  .card {
+    background: #161b22;
+    border: 1px solid #30363d;
+    border-radius: 12px;
+    padding: 40px 36px;
+    width: 100%;
+    max-width: 400px;
+    box-shadow: 0 8px 32px rgba(0,0,0,0.5);
+  }
+  .logo {
+    text-align: center;
+    margin-bottom: 28px;
+  }
+  .logo h1 {
+    font-size: 1.6rem;
+    font-weight: 700;
+    color: #c8a44a;
+  }
+  .logo p { color: #8b949e; font-size: 0.9rem; margin-top: 6px; }
+  .form-group { margin-bottom: 18px; }
+  label { display: block; font-size: 0.85rem; font-weight: 500; color: #8b949e; margin-bottom: 6px; }
+  input[type="text"], input[type="password"] {
+    width: 100%;
+    padding: 10px 14px;
+    background: #0d1117;
+    border: 1px solid #30363d;
+    border-radius: 6px;
+    color: #e6edf3;
+    font-size: 0.95rem;
+    font-family: inherit;
+    transition: border-color 0.2s;
+  }
+  input:focus { outline: none; border-color: #c8a44a; }
+  .btn {
+    width: 100%;
+    padding: 11px;
+    background: #c8a44a;
+    color: #0d1117;
+    border: none;
+    border-radius: 6px;
+    font-size: 0.95rem;
+    font-weight: 700;
+    font-family: inherit;
+    cursor: pointer;
+    transition: background 0.2s, transform 0.1s;
+    margin-top: 4px;
+  }
+  .btn:hover { background: #e0b85a; transform: translateY(-1px); }
+  .error {
+    background: rgba(248,81,73,0.12);
+    border: 1px solid rgba(248,81,73,0.4);
+    border-radius: 6px;
+    padding: 10px 14px;
+    color: #f85149;
+    font-size: 0.875rem;
+    margin-bottom: 18px;
+  }
+  .footer-link {
+    text-align: center;
+    margin-top: 22px;
+    font-size: 0.85rem;
+    color: #8b949e;
+  }
+  .footer-link a { color: #c8a44a; text-decoration: none; }
+  .footer-link a:hover { text-decoration: underline; }
+</style>
+</head>
+<body>
+<div class="card">
+  <div class="logo">
+    <h1>⚔️ Grepolis Remote</h1>
+    <p>Συνδεθείτε στον λογαριασμό σας</p>
+  </div>
+
+  {% if error %}
+  <div class="error">{{ error }}</div>
+  {% endif %}
+
+  <form method="POST" action="/auth/login">
+    <div class="form-group">
+      <label for="username">Όνομα Χρήστη</label>
+      <input type="text" id="username" name="username" autocomplete="username" required>
+    </div>
+    <div class="form-group">
+      <label for="password">Κωδικός</label>
+      <input type="password" id="password" name="password" autocomplete="current-password" required>
+    </div>
+    <button type="submit" class="btn">Σύνδεση →</button>
+  </form>
+
+  <div class="footer-link">
+    Δεν έχετε λογαριασμό; <a href="/auth/register">Εγγραφή</a>
+  </div>
+</div>
+</body>
+</html>
diff --git a/templates/options.html b/templates/options.html
new file mode 100644
index 0000000..56fd104
--- /dev/null
+++ b/templates/options.html
@@ -0,0 +1,260 @@
+<!DOCTYPE html>
+<html lang="el">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Grepolis Remote — Ρυθμίσεις Clan</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+<style>
+  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+  body { font-family: 'Inter', sans-serif; background: #0d1117; color: #e6edf3; min-height: 100vh; }
+
+  /* --- Top nav --- */
+  .topbar {
+    background: #161b22;
+    border-bottom: 1px solid #30363d;
+    padding: 14px 32px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .topbar-logo { font-size: 1.1rem; font-weight: 700; color: #c8a44a; text-decoration: none; }
+  .topbar-nav { display: flex; gap: 16px; align-items: center; }
+  .topbar-nav a {
+    color: #8b949e; font-size: 0.875rem; text-decoration: none;
+    padding: 6px 12px; border-radius: 6px; transition: background 0.2s, color 0.2s;
+  }
+  .topbar-nav a:hover { background: #21262d; color: #e6edf3; }
+  .topbar-nav a.active { color: #c8a44a; }
+  .topbar-nav .btn-logout {
+    background: rgba(248,81,73,0.1); color: #f85149;
+    border: 1px solid rgba(248,81,73,0.3); padding: 6px 14px; border-radius: 6px;
+    cursor: pointer; font-size: 0.875rem; font-family: inherit; text-decoration: none;
+    transition: background 0.2s;
+  }
+  .topbar-nav .btn-logout:hover { background: rgba(248,81,73,0.2); }
+
+  /* --- Page layout --- */
+  .page { max-width: 760px; margin: 40px auto; padding: 0 20px; }
+  .page-title { font-size: 1.5rem; font-weight: 700; margin-bottom: 6px; }
+  .page-subtitle { color: #8b949e; font-size: 0.9rem; margin-bottom: 32px; }
+
+  /* --- Cards --- */
+  .card {
+    background: #161b22;
+    border: 1px solid #30363d;
+    border-radius: 10px;
+    padding: 24px 28px;
+    margin-bottom: 24px;
+  }
+  .card-title {
+    font-size: 1rem; font-weight: 600;
+    margin-bottom: 18px; padding-bottom: 12px;
+    border-bottom: 1px solid #30363d;
+    display: flex; align-items: center; gap: 8px;
+  }
+
+  /* --- Key display --- */
+  .key-box {
+    background: #0d1117;
+    border: 1px solid #30363d;
+    border-radius: 6px;
+    padding: 14px 18px;
+    display: flex; align-items: center; justify-content: space-between;
+    gap: 12px; margin-bottom: 14px;
+  }
+  .key-value {
+    font-family: 'Courier New', monospace;
+    font-size: 1.4rem;
+    font-weight: 700;
+    color: #c8a44a;
+    letter-spacing: 3px;
+  }
+  .btn-copy {
+    background: #21262d; color: #e6edf3;
+    border: 1px solid #30363d; border-radius: 6px;
+    padding: 6px 14px; font-size: 0.8rem; cursor: pointer;
+    font-family: inherit; transition: background 0.2s; white-space: nowrap;
+  }
+  .btn-copy:hover { background: #30363d; }
+
+  /* --- Create clan form --- */
+  .inline-form { display: flex; gap: 10px; }
+  .inline-form input[type="text"] {
+    flex: 1; padding: 9px 14px;
+    background: #0d1117; border: 1px solid #30363d; border-radius: 6px;
+    color: #e6edf3; font-size: 0.9rem; font-family: inherit;
+  }
+  .inline-form input:focus { outline: none; border-color: #c8a44a; }
+
+  /* --- Buttons --- */
+  .btn-primary {
+    background: #c8a44a; color: #0d1117;
+    border: none; border-radius: 6px; padding: 9px 18px;
+    font-weight: 700; font-size: 0.875rem; font-family: inherit;
+    cursor: pointer; transition: background 0.2s, transform 0.1s; white-space: nowrap;
+  }
+  .btn-primary:hover { background: #e0b85a; transform: translateY(-1px); }
+
+  .btn-danger {
+    background: rgba(248,81,73,0.1); color: #f85149;
+    border: 1px solid rgba(248,81,73,0.3); border-radius: 6px;
+    padding: 5px 12px; font-size: 0.8rem; font-family: inherit;
+    cursor: pointer; transition: background 0.2s;
+  }
+  .btn-danger:hover { background: rgba(248,81,73,0.2); }
+
+  .btn-warning {
+    background: rgba(210,153,34,0.1); color: #d99512;
+    border: 1px solid rgba(210,153,34,0.3); border-radius: 6px;
+    padding: 7px 14px; font-size: 0.8rem; font-family: inherit;
+    cursor: pointer; transition: background 0.2s; margin-top: 6px;
+  }
+  .btn-warning:hover { background: rgba(210,153,34,0.2); }
+
+  /* --- Members table --- */
+  .members-table { width: 100%; border-collapse: collapse; }
+  .members-table th {
+    text-align: left; font-size: 0.75rem; color: #8b949e;
+    text-transform: uppercase; letter-spacing: 0.5px;
+    padding: 0 0 10px 0; border-bottom: 1px solid #30363d;
+  }
+  .members-table td {
+    padding: 12px 0; border-bottom: 1px solid #21262d;
+    font-size: 0.875rem; vertical-align: middle;
+  }
+  .members-table tr:last-child td { border-bottom: none; }
+  .player-name { font-weight: 600; }
+  .player-id   { color: #8b949e; font-size: 0.78rem; font-family: monospace; }
+  .status-online  { color: #3fb950; font-size: 0.78rem; font-weight: 600; }
+  .status-offline { color: #8b949e; font-size: 0.78rem; }
+  .empty-state {
+    text-align: center; padding: 32px 0;
+    color: #8b949e; font-size: 0.9rem;
+  }
+
+  .warn-box {
+    background: rgba(210,153,34,0.1);
+    border: 1px solid rgba(210,153,34,0.3);
+    border-radius: 6px; padding: 12px 16px;
+    color: #d99512; font-size: 0.85rem; margin-top: 10px;
+  }
+</style>
+</head>
+<body>
+
+<div class="topbar">
+  <a class="topbar-logo" href="/">⚔️ Grepolis Remote</a>
+  <div class="topbar-nav">
+    <a href="/">Clients</a>
+    <a href="/auth/options" class="active">Ρυθμίσεις</a>
+    <a href="/auth/logout" class="btn-logout">Αποσύνδεση</a>
+  </div>
+</div>
+
+<div class="page">
+  <div class="page-title">Ρυθμίσεις Clan</div>
+  <div class="page-subtitle">Διαχείριση της ομάδας σας και του κλειδιού πρόσβασης</div>
+
+  {% if clan %}
+  <!-- ===================== Clan Key Section ===================== -->
+  <div class="card">
+    <div class="card-title">🔑 Clan Key</div>
+    <p style="color:#8b949e; font-size:0.875rem; margin-bottom:14px;">
+      Μοιραστείτε αυτό το κλειδί με τους παίκτες σας. Πρέπει να το προσθέσουν στο Loader script τους για να συνδεθούν στην ομάδα σας.
+    </p>
+    <div class="key-box">
+      <span class="key-value" id="clanKeyDisplay">{{ clan.clan_key }}</span>
+      <button class="btn-copy" onclick="copyKey()">📋 Αντιγραφή</button>
+    </div>
+    <div class="warn-box">
+      ⚠️ Εάν αναγεννήσετε το κλειδί, οι παίκτες σας θα πρέπει να ενημερώσουν το script τους με το νέο κλειδί.
+    </div>
+    <form method="POST" action="/auth/clan/regenerate-key"
+          onsubmit="return confirm('Σίγουρα; Οι παίκτες σου θα πρέπει να ανανεώσουν το κλειδί τους.');">
+      <button type="submit" class="btn-warning">🔄 Αναγέννηση Κλειδιού</button>
+    </form>
+  </div>
+
+  <!-- ===================== Members Section ===================== -->
+  <div class="card">
+    <div class="card-title">👥 Μέλη Clan — {{ clan.name }}</div>
+    {% if members %}
+    <table class="members-table">
+      <thead>
+        <tr>
+          <th>Παίκτης</th>
+          <th>Κατάσταση</th>
+          <th>Προστέθηκε</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        {% for m in members %}
+        {% set last_seen = m.updated_at %}
+        {% if last_seen %}
+          {% set diff = (now - last_seen) | int %}
+        {% endif %}
+        <tr>
+          <td>
+            <div class="player-name">{{ m.player_name or 'Άγνωστος' }}</div>
+            <div class="player-id">ID: {{ m.player_id }}</div>
+          </td>
+          <td>
+            {% if m.updated_at and (now_ts - m.updated_at|string|int) < 150 %}
+              <span class="status-online">● Online</span>
+            {% else %}
+              <span class="status-offline">● Offline</span>
+            {% endif %}
+          </td>
+          <td style="color:#8b949e; font-size:0.8rem;">{{ m.joined_at[:10] }}</td>
+          <td style="text-align:right;">
+            <form method="POST" action="/auth/clan/remove-member/{{ m.player_id }}"
+                  onsubmit="return confirm('Αφαίρεση παίκτη {{ m.player_name }}?');">
+              <button type="submit" class="btn-danger">Αφαίρεση</button>
+            </form>
+          </td>
+        </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+    {% else %}
+    <div class="empty-state">
+      Δεν υπάρχουν μέλη ακόμη.<br>
+      <span style="font-size:0.8rem; margin-top:6px; display:block;">
+        Μοιραστείτε το Clan Key με τους παίκτες σας για να συνδεθούν.
+      </span>
+    </div>
+    {% endif %}
+  </div>
+
+  {% else %}
+  <!-- ===================== Create Clan Section ===================== -->
+  <div class="card">
+    <div class="card-title">🏰 Δημιουργία Clan</div>
+    <p style="color:#8b949e; font-size:0.875rem; margin-bottom:18px;">
+      Δεν έχετε δημιουργήσει clan ακόμη. Δώστε ένα όνομα για να ξεκινήσετε.
+    </p>
+    <form method="POST" action="/auth/clan/create" class="inline-form">
+      <input type="text" name="clan_name" placeholder="π.χ. Alpha Squad" required>
+      <button type="submit" class="btn-primary">Δημιουργία →</button>
+    </form>
+  </div>
+  {% endif %}
+
+</div>
+
+<script>
+function copyKey() {
+  const key = document.getElementById('clanKeyDisplay').textContent;
+  navigator.clipboard.writeText(key).then(() => {
+    const btn = document.querySelector('.btn-copy');
+    btn.textContent = '✅ Αντιγράφηκε!';
+    setTimeout(() => btn.textContent = '📋 Αντιγραφή', 2000);
+  });
+}
+</script>
+
+</body>
+</html>
diff --git a/templates/register.html b/templates/register.html
new file mode 100644
index 0000000..2cd3301
--- /dev/null
+++ b/templates/register.html
@@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html lang="el">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>Grepolis Remote — Εγγραφή</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+<style>
+  *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+  body {
+    font-family: 'Inter', sans-serif;
+    background: #0d1117;
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #e6edf3;
+  }
+  .card {
+    background: #161b22;
+    border: 1px solid #30363d;
+    border-radius: 12px;
+    padding: 40px 36px;
+    width: 100%;
+    max-width: 400px;
+    box-shadow: 0 8px 32px rgba(0,0,0,0.5);
+  }
+  .logo { text-align: center; margin-bottom: 28px; }
+  .logo h1 { font-size: 1.6rem; font-weight: 700; color: #c8a44a; }
+  .logo p  { color: #8b949e; font-size: 0.9rem; margin-top: 6px; }
+  .form-group { margin-bottom: 18px; }
+  label { display: block; font-size: 0.85rem; font-weight: 500; color: #8b949e; margin-bottom: 6px; }
+  input[type="text"], input[type="password"] {
+    width: 100%;
+    padding: 10px 14px;
+    background: #0d1117;
+    border: 1px solid #30363d;
+    border-radius: 6px;
+    color: #e6edf3;
+    font-size: 0.95rem;
+    font-family: inherit;
+    transition: border-color 0.2s;
+  }
+  input:focus { outline: none; border-color: #c8a44a; }
+  .btn {
+    width: 100%;
+    padding: 11px;
+    background: #c8a44a;
+    color: #0d1117;
+    border: none;
+    border-radius: 6px;
+    font-size: 0.95rem;
+    font-weight: 700;
+    font-family: inherit;
+    cursor: pointer;
+    transition: background 0.2s, transform 0.1s;
+    margin-top: 4px;
+  }
+  .btn:hover { background: #e0b85a; transform: translateY(-1px); }
+  .error {
+    background: rgba(248,81,73,0.12);
+    border: 1px solid rgba(248,81,73,0.4);
+    border-radius: 6px;
+    padding: 10px 14px;
+    color: #f85149;
+    font-size: 0.875rem;
+    margin-bottom: 18px;
+  }
+  .footer-link {
+    text-align: center;
+    margin-top: 22px;
+    font-size: 0.85rem;
+    color: #8b949e;
+  }
+  .footer-link a { color: #c8a44a; text-decoration: none; }
+  .footer-link a:hover { text-decoration: underline; }
+</style>
+</head>
+<body>
+<div class="card">
+  <div class="logo">
+    <h1>⚔️ Grepolis Remote</h1>
+    <p>Δημιουργία νέου λογαριασμού</p>
+  </div>
+
+  {% if error %}
+  <div class="error">{{ error }}</div>
+  {% endif %}
+
+  <form method="POST" action="/auth/register">
+    <div class="form-group">
+      <label for="username">Όνομα Χρήστη</label>
+      <input type="text" id="username" name="username" autocomplete="username" required>
+    </div>
+    <div class="form-group">
+      <label for="password">Κωδικός</label>
+      <input type="password" id="password" name="password" autocomplete="new-password" required>
+    </div>
+    <div class="form-group">
+      <label for="confirm">Επαλήθευση Κωδικού</label>
+      <input type="password" id="confirm" name="confirm" autocomplete="new-password" required>
+    </div>
+    <button type="submit" class="btn">Εγγραφή →</button>
+  </form>
+
+  <div class="footer-link">
+    Έχετε ήδη λογαριασμό; <a href="/auth/login">Σύνδεση</a>
+  </div>
+</div>
+</body>
+</html>