adding files

.gitignore

@@ -0,0 +1,213 @@
+config.ini
+*.env
+app.log
+test.py
+logs
+
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[codz]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py.cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# UV
+#   Similar to Pipfile.lock, it is generally recommended to include uv.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#uv.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+#poetry.toml
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#   pdm recommends including project-wide configuration in pdm.toml, but excluding .pdm-python.
+#   https://pdm-project.org/en/latest/usage/project/#working-with-version-control
+#pdm.lock
+#pdm.toml
+.pdm-python
+.pdm-build/
+
+# pixi
+#   Similar to Pipfile.lock, it is generally recommended to include pixi.lock in version control.
+#pixi.lock
+#   Pixi creates a virtual environment in the .pixi directory, just like venv module creates one
+#   in the .venv directory. It is recommended not to include this directory in version control.
+.pixi
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.envrc
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+#.idea/
+
+# Abstra
+# Abstra is an AI-powered process automation framework.
+# Ignore directories containing user credentials, local state, and settings.
+# Learn more at https://abstra.io/docs
+.abstra/
+
+# Visual Studio Code
+#  Visual Studio Code specific template is maintained in a separate VisualStudioCode.gitignore 
+#  that can be found at https://github.com/github/gitignore/blob/main/Global/VisualStudioCode.gitignore
+#  and can be added to the global gitignore or merged into this file. However, if you prefer, 
+#  you could uncomment the following to ignore the entire vscode folder
+# .vscode/
+
+# Ruff stuff:
+.ruff_cache/
+
+# PyPI configuration file
+.pypirc
+
+# Cursor
+#  Cursor is an AI-powered code editor. `.cursorignore` specifies files/directories to
+#  exclude from AI features like autocomplete and code analysis. Recommended for sensitive data
+#  refer to https://docs.cursor.com/context/ignore-files
+.cursorignore
+.cursorindexingignore
+
+# Marimo
+marimo/_static/
+marimo/_lsp/
+__marimo__/

app.py

@@ -0,0 +1,59 @@
+import gradio as gr
+
+from mcp_servers.mcp_manager import start_mcp_servers
+start_mcp_servers()
+
+from support.log_manager import logger
+from support.settings import SERVER_PORT
+from pages import home, play, stats
+from support.style.css import final_css
+from support.game_settings import JS
+
+
+# Custom header HTML
+custom_header = """
+<div class="custom-navbar">
+    <div class="navbar-title">🕵️ Agentic Codenames</div>
+    <div class="navbar-links">
+        <a href="#" class="nav-link active" data-tab-id="home_id">Home</a>
+        <a href="#" class="nav-link" data-tab-id="play_id">Play</a>
+        <a href="#" class="nav-link" data-tab-id="stats_id">Stats</a>
+    </div>
+</div>
+"""
+
+# Create main application
+with gr.Blocks(fill_width=True, title="Agentic Codenames", css=final_css, js=JS) as demo:
+    gr.HTML(custom_header)
+
+    with gr.Tabs(elem_classes="hidden-tabs"):
+        with gr.Tab("🏠 Home", id="home_id_tab", elem_classes="tab_btn"):
+            home.demo.render()
+
+        with gr.Tab("🎮 Play", id="play_id_tab", elem_classes="tab_btn"):
+            play.demo.render()
+
+        with gr.Tab("📊 Stats", id="stats_id_tab", elem_classes="tab_btn"):
+            stats.demo.render()
+
+    # Render home page (default/main page)
+    # home.demo.render()
+
+# Add additional pages using route method
+# with demo.route("Play", "/play"):
+#     gr.HTML(custom_header)
+#     play.demo.render()
+
+# with demo.route("Stats", "/stats"):
+#     gr.HTML(custom_header)
+#     stats.demo.render()
+
+if __name__ == "__main__":
+    demo.launch(
+        share=False,
+        inline=True,
+        server_name='0.0.0.0',
+        server_port=SERVER_PORT,
+        allowed_paths=["assets"],
+        favicon_path='assets/favicon.ico'
+    )

mcp_servers/boss_server.py

@@ -0,0 +1,60 @@
+import logging
+import os
+
+from langchain_core.messages import ToolMessage
+from langgraph.types import Command
+from mcp.server.fastmcp import FastMCP
+from support.tools.general import convert_to_string
+from typing import Union, Any, List, Dict
+from uuid import uuid4
+
+
+os.makedirs("logs", exist_ok=True)
+logging.basicConfig(
+    filename='logs/boss_server.log',                    # Log file name
+    filemode='a',                          # 'a' for append, 'w' to overwrite
+    level=logging.INFO,                    # Minimum level to log
+    format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
+    datefmt='%Y-%m-%d %H:%M:%S'
+)
+logger = logging.getLogger(__name__)
+
+
+mcp = FastMCP("BossServer")
+
+
+@mcp.tool()
+async def ChooseWord(
+    clue_number: int,
+    clue: Union[str, Dict, List, Any],
+):
+    """Use this tool if you think that some of the informations are missing.
+    Args:
+        clue_number: the number of word of your team that can be linked to the word.
+        clue: a single word that can be linked to {clue_number} words on the board."""
+
+    clue = convert_to_string(clue)
+
+    logger.info(f"Chosen clue: {clue} for number: {clue_number}")
+
+    return Command(
+        # goto=f"{team_color}_captain",
+        update={
+            "clue_number": clue_number,
+            "clue": clue,
+            "messages": [ToolMessage(
+                content=f"{clue}, {clue_number}",
+                name="ChooseWord",
+                tool_call_id=str(uuid4())
+            )],
+        }
+    )
+
+
+def start_boss_server():
+    mcp.settings.port = 8000
+    mcp.run(transport="stdio")
+
+
+if __name__ == "__main__":
+    start_boss_server()

mcp_servers/captain_server.py

@@ -0,0 +1,100 @@
+import logging
+import os
+
+from langchain_core.messages import ToolMessage
+from langgraph.types import Command
+from mcp.server.fastmcp import FastMCP
+from typing import Union, Any, List, Dict
+from uuid import uuid4
+
+
+os.makedirs("logs", exist_ok=True)
+logging.basicConfig(
+    filename='logs/captain_server.log',                    # Log file name
+    filemode='a',                          # 'a' for append, 'w' to overwrite
+    level=logging.INFO,                    # Minimum level to log
+    format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
+    datefmt='%Y-%m-%d %H:%M:%S'
+)
+logger = logging.getLogger(__name__)
+
+
+mcp = FastMCP("CaptainServer")
+
+
+@mcp.tool()
+async def TeamFinalChoice(
+    guesses: List[str],
+):
+    """Use this tool if you think that some of the informations are missing.
+    Args:
+        guesses: a list of words (string) that you think are associated to the word told by the Boss Agent."""
+
+    logger.info(f"Final choices made: {guesses}")
+
+    artifact = {"guesses": guesses}
+
+    return Command(
+        update={
+            "guesses": guesses,
+            "messages": [ToolMessage(
+                content="I made my final choices: " + ", ".join(guesses),
+                name="TeamFinalChoice",
+                artifact=artifact,
+                tool_call_id=str(uuid4())
+            )],
+        }
+    )
+
+
+@mcp.tool()
+async def Call_Agent_1(
+    message: Union[str, Dict, List, Any],
+):
+    """Use this tool to call Agent 1 for help.
+    Args:
+        message: a message for Agent 1."""
+
+    logger.info(f"Calling Agent 1 with message: {message}")
+
+    return Command(
+        update={
+            "round_messages": [message],
+            "messages": [ToolMessage(
+                content=message,
+                name="Call_Agent_1",
+                tool_call_id=str(uuid4())
+            )],
+        }
+    )
+
+
+@mcp.tool()
+async def Call_Agent_2(
+    message: Union[str, Dict, List, Any],
+):
+    """Use this tool to call Agent 2 for help.
+    Args:
+        message: a message for Agent 2."""
+
+    logger.info(f"Calling Agent 2 with message: {message}")
+
+    return Command(
+        update={
+            "round_messages": [message],
+            "messages": [ToolMessage(
+                content=message,
+                name="Call_Agent_2",
+                tool_call_id=str(uuid4())
+            )],
+        }
+    )
+
+
+def start_captain_server():
+    mcp.settings.port = 8001
+    mcp.run(transport="stdio")
+
+
+if __name__ == "__main__":
+    start_captain_server()

mcp_servers/mcp_manager.py

@@ -0,0 +1,43 @@
+import subprocess
+import time
+import os
+from support.log_manager import logger
+
+
+def start_mcp_servers():
+    """Start both MCP servers as separate processes"""
+
+    # Start boss server as subprocess
+    boss_process = subprocess.Popen(
+        ["python", "-m", "mcp_servers.boss_server"],
+        stdin=subprocess.PIPE,
+        stdout=subprocess.PIPE,
+        stderr=subprocess.PIPE,
+        cwd=os.getcwd()
+    )
+
+    # Start captain server as subprocess
+    captain_process = subprocess.Popen(
+        ["python", "-m", "mcp_servers.captain_server"],
+        stdin=subprocess.PIPE,
+        stdout=subprocess.PIPE,
+        stderr=subprocess.PIPE,
+        cwd=os.getcwd()
+    )
+
+    # Give servers time to start
+    time.sleep(3)
+
+    # Check if processes are running
+    if boss_process.poll() is None:
+        logger.info("BossServer started successfully as subprocess")
+    else:
+        logger.error("BossServer failed to start")
+
+    if captain_process.poll() is None:
+        logger.info("CaptainServer started successfully as subprocess")
+    else:
+        logger.error("CaptainServer failed to start")
+
+    # Store process references for cleanup if needed
+    return boss_process, captain_process

pages/__init__.py

@@ -0,0 +1,3 @@
+from . import home, play, stats
+
+__all__ = ['home', 'play', 'stats']

pages/home.py

@@ -0,0 +1,19 @@
+import gradio as gr
+from support.game_settings import APP_DESCRIPTION, GAME_RULES_HTML
+
+with gr.Blocks(fill_width=True) as demo:
+    # Rules section with HTML
+    with gr.Row(elem_id="row_description", equal_height=True):
+        gr.Markdown(APP_DESCRIPTION, elem_id="app_description")
+        gr.HTML(GAME_RULES_HTML, elem_id="rules_accordion")
+
+    # with gr.Row():
+    #     gr.HTML("""
+    #         <div style="text-align: center; margin: 2rem 0;">
+    #             <p style="font-size: 1.2rem;">Ready to start playing?</p>
+    #             <p style="color: #666;">Navigate to the <strong>Play</strong> page to begin your game!</p>
+    #         </div>
+    #     """)
+
+if __name__ == "__main__":
+    demo.launch()

pages/play.py

@@ -0,0 +1,497 @@
+import gradio as gr
+
+from support.api_keys_manager import get_required_teams
+from support.build_graph import MyGraph
+from support.database import save_game_to_db
+from support.log_manager import logger
+from support.manage_game import Game
+from support.game_settings import TEAM_MODEL_PRESETS
+from support.utils import format_messages_as_feed, generate_team_html, plot_game_board_with_guesses
+
+
+graph = MyGraph()
+TEAM_OPTIONS = list(TEAM_MODEL_PRESETS.keys()) + ["random"]
+
+
+def validate_api_keys(red_team, blue_team, openai_key, google_key, anthropic_key, hf_key, current_api_keys):
+    """Validate that all required API keys are provided."""
+    required_teams = get_required_teams(red_team, blue_team)
+
+    # Build the API keys dictionary
+    api_keys = {}
+    missing_keys = []
+
+    key_mapping = {
+        "openai": (openai_key, "OPENAI_API_KEY", "OpenAI"),
+        "google": (google_key, "GOOGLE_API_KEY", "Google"),
+        "anthropic": (anthropic_key, "ANTHROPIC_API_KEY", "Anthropic"),
+        "opensource": (hf_key, "HUGGINGFACEHUB_API_TOKEN", "HuggingFace")
+    }
+
+    for team in required_teams:
+        key_value, key_name, display_name = key_mapping[team]
+        if key_value and key_value.strip():
+            api_keys[key_name] = key_value.strip()
+        else:
+            missing_keys.append(display_name)
+
+    if missing_keys:
+        error_msg = f"⚠️ Missing API keys for: {', '.join(missing_keys)}"
+        return api_keys, False, error_msg
+
+    return api_keys, True, "✅ All API keys validated!"
+
+
+with gr.Blocks(fill_width=True) as demo:
+    game_state = gr.State()
+    players_state = gr.State(value=[])
+    board_state = gr.State(value={})
+    game_started = gr.State(value=False)
+    guessed_words_state = gr.State(value=[])
+    messages_state = gr.State(value=[])
+    chat_history_state = gr.State(value=[])
+    is_human_playing_state = gr.State(value=False)
+    turn_state = gr.State(value=0)
+    winners_state = gr.State(value=None)
+    api_keys_state = gr.State(value={})
+
+    # Team selection (visible initially)
+    with gr.Row(elem_id="game_setup_row"):
+        with gr.Row(elem_id="team_selection_row") as team_selection:
+            red_team_dropdown = gr.Dropdown(
+                choices=TEAM_OPTIONS,
+                value="google",
+                label="🔴 Red Team",
+                info="Select the model team for the Red side.",
+                elem_id="red_team_dropdown",
+            )
+            blue_team_dropdown = gr.Dropdown(
+                choices=TEAM_OPTIONS,
+                value="openai",
+                label="🔵 Blue Team",
+                info="Select the model team for the Blue side.",
+                elem_id="blue_team_dropdown"
+            )
+
+        with gr.Group(visible=True, elem_id="api_keys_section") as api_keys_section:
+            gr.Markdown("### 🔑 API Keys")
+            gr.Markdown("*Enter API keys for the selected teams. Keys are only required for active teams.*")
+
+            google_api_input = gr.Textbox(
+                label="Google API Key",
+                placeholder="AIza...",
+                type="password",
+                visible=True,  # Default visible since google is selected
+                elem_id="google_api_key",
+                interactive=True
+            )
+
+            openai_api_input = gr.Textbox(
+                label="OpenAI API Key",
+                placeholder="sk-...",
+                type="password",
+                visible=True,
+                elem_id="openai_api_key",
+                interactive=True
+            )
+
+            anthropic_api_input = gr.Textbox(
+                label="Anthropic API Key",
+                placeholder="sk-ant-...",
+                type="password",
+                visible=False,
+                elem_id="anthropic_api_key",
+                interactive=True
+            )
+
+            hf_api_input = gr.Textbox(
+                label="HuggingFace API Token",
+                placeholder="hf_...",
+                type="password",
+                visible=False,
+                elem_id="hf_api_key"
+            )
+
+            validation_status = gr.Markdown("", visible=False)
+
+            new_game_btn = gr.Button("🔄 Generate New Game", variant="secondary", size="sm", elem_id="new_game_btn", visible=False)
+
+    start_btn = gr.Button(
+        "🎲 Generate Teams and Start Playing!",
+        variant="primary",
+        size="lg",
+        elem_id="start_game_btn",
+        visible=True
+    )
+
+    # Game content (hidden initially)
+    with gr.Column(visible=False, elem_id="game_content") as game_content:
+        with gr.Accordion("👥 Teams Overview", open=True, elem_id="teams_accordion") as teams_section:
+            team_html = gr.HTML("")
+            player_info_md = gr.Markdown(value="", elem_id="player_info")
+
+            # Boss control section
+            with gr.Row(elem_id="boss_control_row") as play_as_boss_section:
+                with gr.Column(scale=1):
+                    gr.Markdown("### 🎮 Play as Boss")
+                    with gr.Row():
+                        red_boss_btn = gr.Button("🔴 Play as Red Boss", size="sm", elem_id="red_boss_btn")
+                        blue_boss_btn = gr.Button("🔵 Play as Blue Boss", size="sm", elem_id="blue_boss_btn")
+
+            # Hidden input sections for boss name
+            with gr.Column(visible=False, elem_id="red_boss_input") as red_boss_input_section:
+                gr.Markdown("#### 👤 Enter Your Name (Red Team)")
+                red_boss_name_input = gr.Textbox(
+                    placeholder="Your name...",
+                    label="Name",
+                    show_label=False,
+                    elem_id="red_boss_name_input"
+                )
+                with gr.Row(elem_id="red_boss_actions"):
+                    save_red_boss_btn = gr.Button("💾 Save", variant="primary", size="sm", elem_id="save_red_boss_btn")
+                    cancel_red_boss_btn = gr.Button("❌ Cancel", size="sm", elem_id="cancel_red_boss_btn")
+
+                with gr.Row(elem_id="red_error"):
+                    empty_red = gr.Button("❌ You have to insert a valid name, or cancel", variant="primary", size="sm", visible=False, interactive=False, elem_id="error_red_display")
+
+            with gr.Column(visible=False, elem_id="blue_boss_input") as blue_boss_input_section:
+                gr.Markdown("#### 👤 Enter Your Name (Blue Team)")
+                blue_boss_name_input = gr.Textbox(
+                    placeholder="Your name...",
+                    label="Name",
+                    show_label=False,
+                    elem_id="blue_boss_name_input"
+                )
+                with gr.Row(elem_id="blue_boss_actions"):
+                    save_blue_boss_btn = gr.Button("💾 Save", variant="primary", size="sm", elem_id="save_blue_boss_btn")
+                    cancel_blue_boss_btn = gr.Button("❌ Cancel", size="sm", elem_id="cancel_blue_boss_btn")
+
+                with gr.Row(elem_id="blue_error"):
+                    empty_blue = gr.Button("❌ You have to insert a valid name, or cancel", variant="primary", size="sm", visible=False, interactive=False, elem_id="error_blue_display")
+
+        with gr.Row(elem_id="game_row", equal_height=True):
+            with gr.Column(elem_id="board_column"):
+                gr.Markdown("### 🎯 Game Board", elem_id="board_header")
+                board_plot = gr.Image(
+                    label="Game Board",
+                    show_label=False,
+                    elem_id="game_board_img",
+                )
+
+            with gr.Column(elem_id="chat_column"):
+                gr.Markdown("### 💬 Game Feed", elem_id="chat_header")
+
+                # Replace ChatInterface with custom HTML feed
+                message_feed = gr.HTML(value="", elem_id="message_feed_container", autoscroll=True)
+
+                with gr.Row(elem_id="input_game_section"):
+                    with gr.Row(visible=False) as input_game_values:
+                        user_input = gr.Textbox(
+                            placeholder="Type your message...",
+                            show_label=True,
+                            scale=9,
+                            visible=True,
+                            label="Your Clue"
+                        )
+                        dropdown = gr.Dropdown(
+                            choices=[i for i in range(1, 10)],
+                            label="Clue number",
+                            value=1,
+                            interactive=True
+                        )
+                    send_btn = gr.Button("Send", elem_id="send_message_btn")
+
+    # Helper functions
+    def start_game(red_team_choice, blue_team_choice, openai_key, google_key, anthropic_key, hf_key):
+        # Validate API keys first
+        api_keys, is_valid, message = validate_api_keys(
+            red_team_choice, blue_team_choice, openai_key, google_key, anthropic_key, hf_key, {}
+        )
+
+        if not is_valid:
+            # Return error state without starting game
+            return {
+                validation_status: gr.update(visible=True, value=message),
+                api_keys_state: api_keys,
+                game_state: None,
+                new_game_btn: gr.update(visible=False),
+                start_btn: gr.update(visible=True),
+                game_content: gr.update(visible=False),
+                team_html: "",
+                board_plot: None,
+                game_started: False,
+                players_state: [],
+                board_state: {},
+                messages_state: []
+            }
+
+        # Create game with validated API keys
+        game = Game(red_team=red_team_choice, blue_team=blue_team_choice, api_keys=api_keys)
+        starting_team = game.board.get('starting_team', 'red')
+        html = generate_team_html(game.players, starting_team)
+        board_img = plot_game_board_with_guesses(game.board)
+
+        return {
+            game_state: game,
+            new_game_btn: gr.update(visible=True),
+            start_btn: gr.update(visible=False),
+            game_content: gr.update(visible=True),
+            team_html: html,
+            board_plot: board_img,
+            game_started: True,
+            players_state: game.players,
+            board_state: game.board,
+            messages_state: [],
+            api_keys_state: api_keys,
+            validation_status: gr.update(visible=True, value="✅ Game started successfully!")
+        }
+
+    def generate_new_game(red_team_choice, blue_team_choice, openai_key, google_key, anthropic_key, hf_key, current_api_keys):
+        # Validate API keys first
+        api_keys, is_valid, message = validate_api_keys(
+            red_team_choice, blue_team_choice, openai_key, google_key, anthropic_key, hf_key, current_api_keys
+        )
+
+        if not is_valid:
+            # Raise error to show in UI
+            raise gr.Error(message)
+
+        # Create game with validated API keys
+        game = Game(red_team=red_team_choice, blue_team=blue_team_choice, api_keys=api_keys)
+        starting_team = game.board.get('starting_team', 'red')
+        html = generate_team_html(game.players, starting_team)
+        board_img = plot_game_board_with_guesses(game.board)
+
+        return game, html, board_img, game.players, game.board, [], gr.update(visible=True), api_keys
+
+    def show_red_boss_input():
+        return gr.Column(visible=True)
+
+    def show_blue_boss_input():
+        return gr.Column(visible=True)
+
+    def hide_red_boss_input():
+        return gr.Column(visible=False)
+
+    def hide_blue_boss_input():
+        return gr.Column(visible=False)
+
+    def update_api_key_inputs(red_team, blue_team):
+        """Update visibility and state of API key inputs based on team selection."""
+        required_teams = get_required_teams(red_team, blue_team)
+
+        # Return visibility states for each team's API input
+        updates = {}
+        for team in ["openai", "google", "anthropic", "opensource"]:
+            updates[team] = gr.update(visible=team in required_teams)
+
+        return (
+            updates["openai"],
+            updates["google"],
+            updates["anthropic"],
+            updates["opensource"]
+        )
+
+    def update_boss_player(team_color, name, players, board, is_human_playing):
+        """Update the boss player with human name and model"""
+        if not name or not name.strip():
+            return generate_team_html(players, board.get('starting_team')), players, gr.Column(visible=True), gr.Row(visible=True), gr.Row(visible=False), is_human_playing, gr.Button(visible=True)
+
+        for player in players:
+            if player.team == team_color and player.role == "boss":
+                player.name = name.strip()
+                player.model_name = "Human brain"
+                break
+
+        # Regenerate HTML with updated player info
+        starting_team = board.get('starting_team')
+        html = generate_team_html(players, starting_team, True)
+        is_human_playing = True
+        return html, players, gr.Column(visible=False), gr.Row(visible=False), gr.Row(visible=True), is_human_playing, gr.Button(visible=False)
+
+    async def process_message(user_msg, messages, players, board, dropdown, guessed, chat_history, is_human_playing, turn):
+        """Process user message and stream responses"""
+
+        accumulated_messages = list(messages) if messages else []
+        async for new_msg, guessed, updated_board, updated_chat_history, winners in graph.stream_graph(user_msg, messages, players, board, dropdown, guessed, chat_history, is_human_playing, turn):
+
+            logger.error(f"Winners: {winners}")
+
+            if len(new_msg) > len(accumulated_messages):
+                # Add only the new messages that weren't there before
+                accumulated_messages = list(new_msg)
+            else:
+                # Update existing messages (for streaming updates)
+                accumulated_messages = list(new_msg)
+
+            messages = accumulated_messages
+            feed_html = format_messages_as_feed(accumulated_messages, players, winners)
+            yield feed_html, guessed, messages, updated_board, updated_chat_history, winners
+
+    def update_plot(guessed_words, board, previous_bord_img):
+        if not guessed_words or not board:
+            return previous_bord_img
+        logger.info(f"Calling update_plot: {guessed_words}")
+        board_img = plot_game_board_with_guesses(board, guessed_words)
+        return board_img
+
+    def deactivate_send(game, winner_and_score):
+        if winner_and_score is None or game is None:
+            logger.error(f"Winner state: {winner_and_score}")
+            return gr.Button(visible=True)
+
+    def send_to_database(game, winner_and_score):
+
+        """Save game results to database"""
+        if winner_and_score is None or game is None:
+            return
+        
+        winner_team = winner_and_score[0]
+        scores = winner_and_score[1]
+        reason = winner_and_score[2] if len(winner_and_score) > 2 else None
+
+        # Log to console
+        logger.info(f"\n{'='*50}")
+        logger.info("GAME COMPLETED - Saving to Database")
+        logger.info(f"{'='*50}")
+        logger.info(f"Winner: {winner_team.upper()} team")
+        logger.info(f"Scores - Red: {scores[0]}, Blue: {scores[1]}")
+        if reason:
+            logger.info(f"Reason: {reason}")
+        logger.info("\nTeam Compositions:")
+        logger.info(f"Red Team ({game.red_team_choice}):")
+        for player in [p for p in game.players if p.team == 'red']:
+            logger.info(f"  - {player.role}: {player.name} ({player.model_name})")
+        logger.info(f"Blue Team ({game.blue_team_choice}):")
+        for player in [p for p in game.players if p.team == 'blue']:
+            logger.info(f"  - {player.role}: {player.name} ({player.model_name})")
+
+        # Save to database
+        try:
+            game_id = save_game_to_db(game, winner_and_score)
+            logger.info(f"\n✅ Game saved successfully! (ID: {game_id})")
+            logger.info(f"{'='*50}\n")
+        except Exception as e:
+            logger.info(f"\n❌ Error saving game to database: {e}")
+            logger.info(f"{'='*50}\n")
+            
+
+    # Event handlers
+    start_btn.click(
+        fn=start_game,
+        inputs=[red_team_dropdown, blue_team_dropdown, openai_api_input, google_api_input, anthropic_api_input, hf_api_input],
+        outputs=[game_state, new_game_btn, start_btn, game_content, team_html, board_plot, game_started, players_state, board_state, messages_state, api_keys_state, validation_status]
+    )
+
+    # Update new game button click handler
+    new_game_btn.click(
+        fn=generate_new_game,
+        inputs=[
+            red_team_dropdown,
+            blue_team_dropdown,
+            openai_api_input,
+            google_api_input,
+            anthropic_api_input,
+            hf_api_input,
+            api_keys_state
+        ],
+        outputs=[
+            game_state,
+            team_html,
+            board_plot,
+            players_state,
+            board_state,
+            messages_state,
+            play_as_boss_section,
+            api_keys_state
+        ]
+    )
+
+    red_team_dropdown.change(
+        fn=update_api_key_inputs,
+        inputs=[red_team_dropdown, blue_team_dropdown],
+        outputs=[openai_api_input, google_api_input, anthropic_api_input, hf_api_input]
+    )
+
+    blue_team_dropdown.change(
+        fn=update_api_key_inputs,
+        inputs=[red_team_dropdown, blue_team_dropdown],
+        outputs=[openai_api_input, google_api_input, anthropic_api_input, hf_api_input]
+    )
+
+    # Show/hide boss input sections
+    red_boss_btn.click(
+        fn=show_red_boss_input,
+        outputs=[red_boss_input_section]
+    )
+
+    blue_boss_btn.click(
+        fn=show_blue_boss_input,
+        outputs=[blue_boss_input_section]
+    )
+
+    cancel_red_boss_btn.click(
+        fn=hide_red_boss_input,
+        outputs=[red_boss_input_section]
+    )
+
+    cancel_blue_boss_btn.click(
+        fn=hide_blue_boss_input,
+        outputs=[blue_boss_input_section]
+    )
+
+    # Save boss name handlers
+    save_red_boss_btn.click(
+        fn=lambda name, players, board, is_human_playing: update_boss_player("red", name, players, board, is_human_playing),
+        inputs=[red_boss_name_input, players_state, board_state, is_human_playing_state],
+        outputs=[team_html, players_state, red_boss_input_section, play_as_boss_section, input_game_values, is_human_playing_state, empty_red]
+    ).then(
+        fn=lambda: "",
+        outputs=[red_boss_name_input]
+    )
+
+    save_blue_boss_btn.click(
+        fn=lambda name, players, board, is_human_playing: update_boss_player("blue", name, players, board, is_human_playing),
+        inputs=[blue_boss_name_input, players_state, board_state, is_human_playing_state],
+        outputs=[team_html, players_state, blue_boss_input_section, play_as_boss_section, input_game_values, is_human_playing_state, empty_blue]
+    ).then(
+        fn=lambda: "",
+        outputs=[blue_boss_name_input]
+    )
+
+    send_btn.click(
+        fn=lambda: gr.Button(interactive=False),
+        outputs=[send_btn]
+    ).then(
+        fn=process_message,
+        inputs=[user_input, messages_state, players_state, board_state, dropdown, guessed_words_state, chat_history_state, is_human_playing_state, turn_state],
+        outputs=[message_feed, guessed_words_state, messages_state, board_state, chat_history_state, winners_state]
+    ).then(
+        fn=lambda: "",
+        outputs=[user_input]
+    ).then(
+        fn=lambda turn: turn + 1,
+        inputs=[turn_state],
+        outputs=[turn_state]
+    ).then(
+        fn=lambda: gr.Button(interactive=True),
+        outputs=[send_btn]
+    )
+
+    guessed_words_state.change(
+        fn=update_plot,
+        inputs=[guessed_words_state, board_state, board_plot],
+        outputs=[board_plot]
+    )
+
+    winners_state.change(
+        fn=send_to_database,
+        inputs=[game_state, winners_state]
+    ).then(
+        fn=deactivate_send,
+        inputs=[game_state, winners_state],
+        outputs=[send_btn]
+    )
+
+if __name__ == "__main__":
+    demo.launch()

pages/stats.py

@@ -0,0 +1,162 @@
+import gradio as gr
+import pandas as pd
+
+from support.database import get_stats
+from support.utils import display_model_name, format_game_history_html
+
+
+def create_model_stats_table(model_stats):
+    """Create a DataFrame for model statistics"""
+    if not model_stats:
+        return pd.DataFrame()
+
+    data = []
+    for model, stats in model_stats.items():
+        win_rate = (stats['wins'] / stats['games'] * 100) if stats['games'] > 0 else 0
+        data.append({
+            'Model': display_model_name(model),
+            'Games': stats['games'],
+            'Wins': stats['wins'],
+            'Losses': stats['losses'],
+            'Win Rate': f"{win_rate:.1f}%"
+        })
+
+    df = pd.DataFrame(data)
+    df = df.sort_values('Games', ascending=False)
+    return df
+
+
+# def create_provider_stats_table(provider_stats):
+#     """Create a DataFrame for provider statistics"""
+#     data = []
+#     for provider, stats in provider_stats.items():
+#         if stats['games'] > 0:
+#             win_rate = (stats['wins'] / stats['games'] * 100) if stats['games'] > 0 else 0
+#             data.append({
+#                 'Provider': provider.title(),
+#                 'Games': stats['games'],
+#                 'Wins': stats['wins'],
+#                 'Losses': stats['losses'],
+#                 'Win Rate': f"{win_rate:.1f}%"
+#             })
+
+#     df = pd.DataFrame(data)
+#     df = df.sort_values('Games', ascending=False)
+#     return df
+def create_provider_stats_html(provider_stats):
+    html = """
+    <table class="provider-table">
+        <tr>
+            <th>Provider</th>
+            <th>Games</th>
+            <th>Wins</th>
+            <th>Losses</th>
+            <th>Win Rate</th>
+        </tr>
+    """
+
+    for provider, stats in provider_stats.items():
+        if stats['games'] == 0:
+            continue
+
+        win_rate = (stats['wins'] / stats['games']) * 100
+        logo_url = f"/gradio_api/file=assets/providers/{provider}.png"   # <= adjust path
+
+        html += f"""
+        <tr>
+            <td class="logo_cell"><img src="{logo_url}" class="provider-logo"> {provider.title()}</td>
+            <td>{stats['games']}</td>
+            <td>{stats['wins']}</td>
+            <td>{stats['losses']}</td>
+            <td>{win_rate:.1f}%</td>
+        </tr>
+        """
+
+    html += "</table>"
+    return html
+
+
+def load_stats():
+    """Load and format all statistics"""
+    stats = get_stats()
+
+    total_games = stats['total_games']
+    game_history_html = format_game_history_html(stats['game_history'])
+    model_df = create_model_stats_table(stats['model_stats'])
+    # provider_df = create_provider_stats_table(stats['provider_stats'])
+    provider_df = create_provider_stats_html(stats['provider_stats'])
+
+    html_played_games = f"""
+        <div class="played-games-container">
+            <div class="played-games-label">🎮 PLAYED GAMES</div>
+            <div class="played-games-count">{total_games}</div>
+        </div>
+    """
+
+    html_played_games = f"""
+        <div class="stats-card">
+            <div class="stats-icon">🎮</div>
+            <div class="stats-content">
+                <div class="stats-label">Total Games Played</div>
+                <div class="stats-value">{total_games}</div>
+            </div>
+        </div>
+    """
+
+    return html_played_games, game_history_html, model_df, provider_df
+
+
+# Create the Gradio interface
+with gr.Blocks(elem_id="stats_container") as demo:
+
+    with gr.Row(elem_classes="games_played"):
+        gr.HTML("""
+            <div style="display: flex; align-items: center; gap: 20px; margin-left: 1%; margin-right: 1%;">
+                <h1 style="margin: 0;">📊 Statistics Dashboard</h1>
+                <button onclick='refreshStats()' class='custom-refresh-btn'>
+                    🔄 Refresh Stats
+                </button>
+            </div>
+        """)
+        refresh_btn = gr.Button("🔄 Refresh Stats", variant="primary", size="sm", elem_classes="refresh_btn", visible=True, elem_id="refresh_btn")
+
+    with gr.Row():
+        total_games_display = gr.HTML()
+
+    with gr.Tabs(elem_id="stats_tabs"):
+        with gr.Tab("🎮 Game History"):
+            game_history_display = gr.HTML(label="Game History")
+
+        with gr.Tab("🤖 Model Statistics", elem_classes="model_stats_tab"):
+            gr.Markdown("### Individual Model Performance", elem_classes="stats_title")
+            model_stats_table = gr.Dataframe(
+                label="Model Statistics",
+                interactive=False,
+                wrap=True,
+                elem_classes="stats_table"
+            )
+
+        with gr.Tab("🏢 Provider Statistics", elem_classes="grouped_stats_tab"):
+            gr.Markdown("### Provider Performance (Grouped)", elem_classes="stats_title")
+            # provider_stats_table = gr.Dataframe(
+            #     label="Provider Statistics",
+            #     interactive=False,
+            #     wrap=True,
+            #     elem_classes="stats_table"
+            # )
+            provider_stats_table = gr.HTML(label="Provider Stats")
+
+    # Load stats on page load
+    demo.load(
+        fn=load_stats,
+        outputs=[total_games_display, game_history_display, model_stats_table, provider_stats_table]
+    )
+
+    # Refresh button
+    refresh_btn.click(
+        fn=load_stats,
+        outputs=[total_games_display, game_history_display, model_stats_table, provider_stats_table]
+    )
+
+if __name__ == "__main__":
+    demo.launch()

requirements.txt

@@ -0,0 +1,21 @@
+aiohttp==3.13.2
+google-genai==1.46.0
+gradio==5.49.1
+langchain-anthropic==1.0.0
+langchain-core==1.0.5
+langchain-google-genai==3.0.0
+langchain-huggingface @ git+https://github.com/dip9811111/langchain.git@add-huggingface-reasoning#subdirectory=libs/partners/huggingface
+langchain-mcp-adapters==0.1.13
+langchain-openai==1.0.0
+langgraph==1.0.1
+matplotlib==3.10.7
+Markdown==3.9
+mcp==1.22.0
+pandas==2.3.3
+Pillow
+python-dotenv==1.2.1
+regex==2025.9.18
+SQLAlchemy==2.0.44
+typing_extensions==4.15.0
+
+

support/api_keys_manager.py

@@ -0,0 +1,52 @@
+TEAM_API_KEY_MAP = {
+    "openai": ("OPENAI_API_KEY", "OpenAI API Key"),
+    "google": ("GOOGLE_API_KEY", "Google API Key"),
+    "anthropic": ("ANTHROPIC_API_KEY", "Anthropic API Key"),
+    "opensource": ("HUGGINGFACEHUB_API_TOKEN", "HuggingFace API Token"),
+}
+
+def get_required_teams(red_team, blue_team):
+    """Get unique teams that require API keys."""
+    teams = set()
+    
+    # Handle random selections - could be any team
+    if red_team == "random":
+        teams.update(["openai", "google", "anthropic", "opensource"])
+    else:
+        teams.add(red_team)
+    
+    if blue_team == "random":
+        teams.update(["openai", "google", "anthropic", "opensource"])
+    else:
+        teams.add(blue_team)
+    
+    return sorted(teams)
+
+
+def validate_api_keys(red_team, blue_team, openai_key, google_key, anthropic_key, hf_key, current_api_keys):
+    """Validate that all required API keys are provided."""
+    required_teams = get_required_teams(red_team, blue_team)
+    
+    # Build the API keys dictionary
+    api_keys = {}
+    missing_keys = []
+    
+    key_mapping = {
+        "openai": (openai_key, "OPENAI_API_KEY", "OpenAI"),
+        "google": (google_key, "GOOGLE_API_KEY", "Google"),
+        "anthropic": (anthropic_key, "ANTHROPIC_API_KEY", "Anthropic"),
+        "opensource": (hf_key, "HUGGINGFACEHUB_API_TOKEN", "HuggingFace")
+    }
+    
+    for team in required_teams:
+        key_value, key_name, display_name = key_mapping[team]
+        if key_value and key_value.strip():
+            api_keys[key_name] = key_value.strip()
+        else:
+            missing_keys.append(display_name)
+    
+    if missing_keys:
+        error_msg = f"⚠️ Missing API keys for: {', '.join(missing_keys)}"
+        return api_keys, False, error_msg
+    
+    return api_keys, True, "✅ All API keys validated!"

support/build_graph.py

@@ -0,0 +1,1633 @@
+
+import json
+import os
+import random
+
+from gradio import ChatMessage
+from langchain_core.messages import AIMessage, AIMessageChunk, HumanMessage, ToolMessage
+from langgraph.graph import StateGraph, START, END
+from langgraph.graph.message import add_messages
+from langgraph.prebuilt import ToolNode
+from support.log_manager import logger
+from support.my_tools import captain_agent_tools, boss_agent_tools
+from support.tools.boss_agent_tools import create_fake_tool_call
+from support.prompts import captain_agent_system_prompt, player_agent_system_prompt, boss_agent_system_prompt
+from typing import Annotated, List, Literal, Optional
+from typing_extensions import TypedDict
+
+
+class State(TypedDict):
+    messages: Annotated[list, add_messages]
+    chat_history: List[str]
+    round_messages: Annotated[list, add_messages]
+    original_board: dict
+    board: dict
+    players: List  # Player type
+    current_team: Literal['red', 'blue']
+    current_role: str
+    turn: int
+    last_user_message: str
+    guesses: List[str]
+    clue: Optional[str]
+    clue_number: Optional[int]
+    next_team: Literal['red', 'blue']
+    history_guessed_words: List[str]
+    human_clue: str
+    human_clue_number: int
+    teams_reviewed: List[str]
+    end_round: bool
+    winner_and_score: tuple
+
+
+class MyGraph:
+    def __init__(self):
+
+        self.red_team = self._create_red_team_graph()
+        self.blue_team = self._create_blue_team_graph()
+        self.graph = self._create_graph()
+
+        self.players = []
+        self.board = None
+        self.guessed_words = []
+        self.current_team = ""
+        self.chat_history = []
+        self.winners = []
+
+        self.IS_HUMAN_PLAYING = None
+
+    def _create_red_team_graph(self):
+        """Compile red team subgraph"""
+        builder = StateGraph(State)
+
+        # Core team nodes
+        builder.add_node("red_boss", self.red_boss)
+        builder.add_node("red_captain", self.red_captain)
+        builder.add_node("red_agent_1", self.red_agent_1)
+        builder.add_node("red_agent_2", self.red_agent_2)
+
+        # Tool nodes
+        choose_word_tool = ToolNode(tools=[boss_agent_tools[0]])
+        final_choice = ToolNode(tools=[captain_agent_tools[0]])
+        transfer_to_agent_1 = ToolNode(tools=[captain_agent_tools[1]])
+        transfer_to_agent_2 = ToolNode(tools=[captain_agent_tools[2]])
+
+        builder.add_node("choose_word_tool", choose_word_tool)
+        builder.add_node("final_choice", final_choice)
+        builder.add_node("transfer_to_agent_1", transfer_to_agent_1)
+        builder.add_node("transfer_to_agent_2", transfer_to_agent_2)
+        builder.add_node("update_turn", self.update_turn)
+
+        # Team flow
+        builder.add_edge(START, "red_boss")
+        builder.add_conditional_edges(
+            "red_boss",
+            self.boss_choice,
+            {
+                "choose_word_tool": "choose_word_tool",
+                "red_boss": "red_boss",
+            },
+        )
+        # builder.add_edge("red_boss", "choose_word_tool")
+        builder.add_edge("choose_word_tool", "red_captain")
+
+        builder.add_conditional_edges(
+            "red_captain",
+            self.should_continue,
+            {
+                "final_choice": "final_choice",
+                "transfer_to_agent_1": "transfer_to_agent_1",
+                "transfer_to_agent_2": "transfer_to_agent_2",
+                "red_captain": "red_captain",
+            },
+        )
+
+        builder.add_edge("transfer_to_agent_1", "red_agent_1")
+        builder.add_edge("transfer_to_agent_2", "red_agent_2")
+        builder.add_edge("red_agent_1", "red_captain")
+        builder.add_edge("red_agent_2", "red_captain")
+        builder.add_edge("final_choice", "update_turn")
+        builder.add_edge("update_turn", END)
+
+        return builder.compile()
+
+    def _create_blue_team_graph(self):
+        """Compile blue team subgraph"""
+        builder = StateGraph(State)
+
+        # Core team nodes
+        builder.add_node("blue_boss", self.blue_boss)
+        builder.add_node("blue_captain", self.blue_captain)
+        builder.add_node("blue_agent_1", self.blue_agent_1)
+        builder.add_node("blue_agent_2", self.blue_agent_2)
+
+        # Tool nodes
+        choose_word_tool = ToolNode(tools=[boss_agent_tools[0]])
+        final_choice = ToolNode(tools=[captain_agent_tools[0]])
+        transfer_to_agent_1 = ToolNode(tools=[captain_agent_tools[1]])
+        transfer_to_agent_2 = ToolNode(tools=[captain_agent_tools[2]])
+
+        builder.add_node("choose_word_tool", choose_word_tool)
+        builder.add_node("final_choice", final_choice)
+        builder.add_node("transfer_to_agent_1", transfer_to_agent_1)
+        builder.add_node("transfer_to_agent_2", transfer_to_agent_2)
+        builder.add_node("update_turn", self.update_turn)
+
+        # Team flow
+        builder.add_edge(START, "blue_boss")
+        builder.add_conditional_edges(
+            "blue_boss",
+            self.boss_choice,
+            {
+                "choose_word_tool": "choose_word_tool",
+                "blue_boss": "blue_boss",
+            },
+        )
+        # builder.add_edge("blue_boss", "choose_word_tool")
+        builder.add_edge("choose_word_tool", "blue_captain")
+
+        builder.add_conditional_edges(
+            "blue_captain",
+            self.should_continue,
+            {
+                "final_choice": "final_choice",
+                "transfer_to_agent_1": "transfer_to_agent_1",
+                "transfer_to_agent_2": "transfer_to_agent_2",
+                "blue_captain": "blue_captain",
+            },
+        )
+
+        builder.add_edge("transfer_to_agent_1", "blue_agent_1")
+        builder.add_edge("transfer_to_agent_2", "blue_agent_2")
+        builder.add_edge("blue_agent_1", "blue_captain")
+        builder.add_edge("blue_agent_2", "blue_captain")
+        builder.add_edge("final_choice", "update_turn")
+        builder.add_edge("update_turn", END)
+
+        return builder.compile()
+
+    def _create_graph(self) -> StateGraph:
+        """Create and compile the graph."""
+
+        builder = StateGraph(State)
+
+        red_graph = self._create_red_team_graph()
+        blue_graph = self._create_blue_team_graph()
+
+        builder.add_node("judge", self.judge)
+        # builder.add_node("red_team", lambda s: self.call_team(s, "red"))
+        # builder.add_node("blue_team", lambda s: self.call_team(s, "blue"))
+        builder.add_node("red_team", red_graph)
+        builder.add_node("blue_team", blue_graph)
+
+        builder.add_edge(START, "judge")
+        builder.add_conditional_edges(
+            "judge",
+            self.route_after_judge,
+            ["red_team", "blue_team", END],
+        )
+        builder.add_edge("red_team", "judge")
+        builder.add_edge("blue_team", "judge")
+
+        graph = builder.compile()
+
+        # Optional visualization
+        if not os.path.exists("graph.png"):
+            try:
+                img = graph.get_graph(xray=True).draw_mermaid_png()
+                with open("graph.png", "wb") as f:
+                    f.write(img)
+            except Exception as e:
+                logger.error(f"[GRAPH IMAGE ERROR]: {e}")
+
+        return graph
+
+    # --- Agent Node Implementations ---
+    async def red_boss(self, state: State):
+        """Red team boss gives a clue"""
+        logger.info("[RED BOSS] MOMENT ")
+        boss = next((p for p in state["players"] if p.team == "red" and p.role == "boss"), None)
+        if not boss:
+            return state
+
+        board = state["board"]
+        team_name = state["current_team"].upper()
+        formatted_boss_system_prompt = boss_agent_system_prompt.format(team_name)
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+        self.current_team = state["current_team"]
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_boss_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    Keep in mind the history of the game so far:\n
+                    [HISTORY]\n{formatted_history}\n[/END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Here is the current board:\n
+                    Red words: {", ".join(board['red'])}\n
+                    Blue words: {", ".join(board['blue'])}\n
+                    Neutral words: {", ".join(board['neutral'])}\n
+                    Killer word: {board['killer']}\n\n
+                    Based on this board, provide a clue and a number of words that relate to that clue.
+                """
+            }
+        ]
+
+        if self.IS_HUMAN_PLAYING and boss.model_name == "Human brain":
+            clue_ = state['human_clue']
+            clue_number = state['human_clue_number']
+            answer = create_fake_tool_call(clue_, clue_number)
+        else:
+            llm_with_tools = boss.model.bind_tools(boss_agent_tools, tool_choice="ChooseWord")
+            answer = await llm_with_tools.ainvoke(new_message)
+
+        logger.info(f"[RED BOSS ANSWER]: {answer}")
+
+        chat_entry, clue, clue_number, _ = self._format_chat_entry(boss, answer)
+
+        return {
+            "messages": [answer],
+            "current_role": "captain",
+            "chat_history": state.get("chat_history", []) + [chat_entry],
+            "clue": clue,
+            "clue_number": clue_number,
+        }
+
+    async def red_captain(self, state: State):
+        """Red team captain coordinates guessing"""
+
+        logger.info("°°°"*50)
+        logger.info(f"[RED CAPTAIN] State clue: {state['clue']}")
+        captain = next((p for p in state["players"] if p.team == "red" and p.role == "captain"), None)
+        agents = [p for p in state["players"] if p.team == "red" and p.role == "player"]
+        if not captain:
+            return state
+
+        board = state["board"]
+
+        available_words = (
+            board["red"] +
+            board["blue"] +
+            board["neutral"] +
+            [board["killer"]]
+        )
+
+        random.shuffle(available_words)
+
+        logger.info(f"AVAILABLE WORDS: {available_words}")
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        team_name = state["current_team"].upper()
+        formatted_captain_system_prompt = captain_agent_system_prompt.format(
+            team_name,
+            agents[0].name,
+            agents[1].name
+        )
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_captain_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    Consider the history of the game so far:\n[HISTORY]\n{formatted_history}\n[/END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Here is the list of words on the board:\n{', '.join(available_words)}\n\n
+                    This is what your boss said: '{state['clue']}' {state['clue_number']}, suggest which words to guess.
+                """
+            }
+        ]
+
+        llm_with_tools = captain.model.bind_tools(
+            captain_agent_tools,
+        )
+        answer = await llm_with_tools.ainvoke(new_message)
+
+        logger.info(f"[RED CAPTAIN ANSWER]: {answer}")
+        logger.info("°°°"*50)
+        chat_entry, _, _, guesses = self._format_chat_entry(captain, answer)
+
+        return {
+            "messages": [answer],
+            "chat_history": state.get("chat_history", []) + [chat_entry],
+            "guesses": guesses
+        }
+
+    async def red_agent_1(self, state: State):
+        """Red team agent 1 discusses the clue"""
+
+        logger.info("---"*50)
+        logger.info("[RED AGENT 1]")
+        logger.info("MESSAGES")
+        logger.info(state['messages'])
+        logger.info("---"*20)
+
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        captain = next((p for p in state["players"] if p.team == "red" and p.role == "captain"), None)
+        agents = [p for p in state["players"] if p.team == "red" and p.role == "player"]
+        if not agents:
+            return state
+
+        agent = agents[0]
+
+        board = state["board"]
+
+        available_words = (
+            board["red"] +
+            board["blue"] +
+            board["neutral"] +
+            [board["killer"]]
+        )
+
+        random.shuffle(available_words)
+
+        team_name = state["current_team"].upper()
+        formatted_player_system_prompt = player_agent_system_prompt.format(
+            team_name,
+            captain.name,
+            agents[1].name
+        )
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_player_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    [HISTORY]\n{formatted_history}\n[END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Available words: {', '.join(available_words)}
+                """
+            }
+        ]
+
+        answer = await agent.model.ainvoke(new_message)
+        chat_entry, _, _, _ = self._format_chat_entry(agent, answer)
+
+        logger.info(['RED AGENT 1 ANSWER'])
+        logger.info(answer)
+
+        return {
+            "messages": [answer],
+            "chat_history": state.get("chat_history", []) + [chat_entry]
+        }
+
+    async def red_agent_2(self, state: State):
+        """Red team agent 2 discusses the clue"""
+
+        logger.info(f"[RED AGENT 2] State clue: {state['clue']}")
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        captain = next((p for p in state["players"] if p.team == "red" and p.role == "captain"), None)
+        agents = [p for p in state["players"] if p.team == "red" and p.role == "player"]
+        if len(agents) < 2:
+            return state
+
+        agent = agents[1]
+        board = state["board"]
+
+        available_words = (
+            board["red"] +
+            board["blue"] +
+            board["neutral"] +
+            [board["killer"]]
+        )
+
+        random.shuffle(available_words)
+
+        team_name = state["current_team"].upper()
+        formatted_player_system_prompt = player_agent_system_prompt.format(
+            team_name,
+            captain.name,
+            agents[0].name
+        )
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_player_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    [HISTORY]\n{formatted_history}\n[END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Available words: {', '.join(available_words)}
+                """
+            }
+        ]
+
+        answer = await agent.model.ainvoke(new_message)
+        chat_entry, _, _, _ = self._format_chat_entry(agent, answer)
+
+        logger.info(['RED AGENT 2 ANSWER'])
+        logger.info(answer)
+
+        return {
+            "messages": [answer],
+            "chat_history": state.get("chat_history", []) + [chat_entry]
+        }
+
+    async def blue_boss(self, state: State):
+        """Blue team boss gives a clue"""
+        logger.info("[BLUE BOSS MOMENT]")
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        boss = next((p for p in state["players"] if p.team == "blue" and p.role == "boss"), None)
+        if not boss:
+            return state
+
+        board = state["board"]
+        team_name = state["current_team"].upper()
+        formatted_boss_system_prompt = boss_agent_system_prompt.format(team_name)
+        self.current_team = state["current_team"]
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_boss_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    Keep in mind the history of the game so far:\n
+                    [HISTORY]\n{formatted_history}\n[/END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Here is the current board:\n
+                    Red words: {", ".join(board['red'])}\n
+                    Blue words: {", ".join(board['blue'])}\n
+                    Neutral words: {", ".join(board['neutral'])}\n
+                    Killer word: {board['killer']}\n\n
+                    Based on this board, provide a clue and a number of words that relate to that clue.
+                """
+            }
+        ]
+
+        if self.IS_HUMAN_PLAYING and boss.model_name == "Human brain":
+            clue_ = state['human_clue']
+            clue_number = state['human_clue_number']
+            answer = create_fake_tool_call(clue_, clue_number)
+        else:
+            llm_with_tools = boss.model.bind_tools(boss_agent_tools, tool_choice="ChooseWord")
+            answer = await llm_with_tools.ainvoke(new_message)
+
+        logger.info(f"[BLUE BOSS ANSWER] : {answer}")
+
+        chat_entry, clue, clue_number, _ = self._format_chat_entry(boss, answer)
+
+        return {
+            "messages": [answer],
+            "current_role": "captain",
+            "chat_history": state.get("chat_history", []) + [chat_entry],
+            "clue": clue,
+            "clue_number": clue_number,
+        }
+
+    async def blue_captain(self, state: State):
+        """Blue team captain coordinates guessing"""
+
+        logger.info("°°°"*50)
+        logger.info(f"[BLUE CAPTAIN] State clue: {state['clue']}")
+        captain = next((p for p in state["players"] if p.team == "blue" and p.role == "captain"), None)
+        agents = [p for p in state["players"] if p.team == "blue" and p.role == "player"]
+        if not captain:
+            return state
+
+        board = state["board"]
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        available_words = (
+            board["red"] +
+            board["blue"] +
+            board["neutral"] +
+            [board["killer"]]
+        )
+
+        random.shuffle(available_words)
+
+        team_name = state["current_team"].upper()
+        formatted_captain_system_prompt = captain_agent_system_prompt.format(
+            team_name,
+            agents[0].name,
+            agents[1].name
+        )
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_captain_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    Consider the history of the game so far:\n[HISTORY]\n{formatted_history}\n[/END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Here is the list of words on the board:\n{', '.join(available_words)}\n\n
+                    This is what your boss said: '{state['clue']}' {state['clue_number']}, suggest which words to guess.
+                """
+            }
+        ]
+
+        llm_with_tools = captain.model.bind_tools(
+            captain_agent_tools,
+        )
+        answer = await llm_with_tools.ainvoke(new_message)
+
+        logger.info(f"[BLUE CAPTAIN ANSWER] : {answer}")
+        logger.info("°°°"*50)
+        chat_entry, _, _, guesses = self._format_chat_entry(captain, answer)
+
+        return {
+            "messages": [answer],
+            "chat_history": state.get("chat_history", []) + [chat_entry],
+            "guesses": guesses
+        }
+
+    async def blue_agent_1(self, state: State):
+        """Blue team agent 1 discusses the clue"""
+        logger.info("---"*50)
+        logger.info("[BLUE AGENT 1]")
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        captain = next((p for p in state["players"] if p.team == "blue" and p.role == "captain"), None)
+        agents = [p for p in state["players"] if p.team == "blue" and p.role == "player"]
+        if not agents:
+            return state
+
+        agent = agents[0]
+        board = state["board"]
+
+        available_words = (
+            board["red"] +
+            board["blue"] +
+            board["neutral"] +
+            [board["killer"]]
+        )
+
+        random.shuffle(available_words)
+
+        team_name = state["current_team"].upper()
+        formatted_player_system_prompt = player_agent_system_prompt.format(
+            team_name,
+            captain.name,
+            agents[1].name
+        )
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_player_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    [HISTORY]\n{formatted_history}\n[END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Available words: {', '.join(available_words)}
+                """
+            }
+        ]
+
+        answer = await agent.model.ainvoke(new_message)
+
+        logger.info(['BLUE AGENT 1 ANSWER'])
+        logger.info(answer)
+        chat_entry, _, _, _ = self._format_chat_entry(agent, answer)
+
+        return {
+            "messages": [answer],
+            "chat_history": state.get("chat_history", []) + [chat_entry]
+        }
+
+    async def blue_agent_2(self, state: State):
+        """Blue team agent 2 discusses the clue"""
+        logger.info("---"*50)
+        logger.info("[BLUE AGENT 2]")
+        chat_history = state["chat_history"]
+        # formatted_history = "\n".join([
+        #     entry.get("content", "")
+        #     for entry in chat_history
+        # ])
+        formatted_history, current_round_messages = self._split_chat_history(chat_history)
+
+        captain = next((p for p in state["players"] if p.team == "blue" and p.role == "captain"), None)
+        agents = [p for p in state["players"] if p.team == "blue" and p.role == "player"]
+        if not agents:
+            return state
+
+        agent = agents[1]
+        board = state["board"]
+
+        available_words = (
+            board["red"] +
+            board["blue"] +
+            board["neutral"] +
+            [board["killer"]]
+        )
+
+        random.shuffle(available_words)
+
+        team_name = state["current_team"].upper()
+        formatted_player_system_prompt = player_agent_system_prompt.format(
+            team_name,
+            captain.name,
+            agents[0].name
+        )
+
+        new_message = [
+            {
+                "role": "system",
+                "content": formatted_player_system_prompt
+            },
+            {
+                "role": "user",
+                "content": f"""
+                    [HISTORY]\n{formatted_history}\n[END HISTORY]\n\n
+                    [CURRENT ROUND MESSAGES]\n{current_round_messages}\n[/END CURRENT ROUND MESSAGES]\n\n
+                    Available words: {', '.join(available_words)}
+                """
+            }
+        ]
+
+        answer = await agent.model.ainvoke(new_message)
+
+        logger.info(['BLUE AGENT 2 ANSWER'])
+        logger.info(answer)
+        chat_entry, _, _, _ = self._format_chat_entry(agent, answer)
+
+        return {
+            "messages": [answer],
+            "chat_history": state.get("chat_history", []) + [chat_entry]
+        }
+
+    def update_turn(self, state: State):
+        """Update turn counter"""
+        turn = state.get("turn", 1)
+
+        return {
+            "turn": turn+1
+        }
+
+    def judge(self, state: State):
+        """Evaluate guesses, update board, check win/lose conditions."""
+
+        # Helper function to check win conditions
+        def check_win_condition():
+            """Returns (is_game_over, winner, win_message) tuple"""
+            red_remaining = len(board.get("red", []))
+            blue_remaining = len(board.get("blue", []))
+
+            if red_remaining == 0:
+                return True, "red", (red_remaining, blue_remaining)
+
+            if blue_remaining == 0:
+                return True, "blue", (red_remaining, blue_remaining)
+
+            return False, None, None
+
+        # Helper function to create multiple messages
+        def create_multi_message_state(messages_content_list, next_team=None, switch_role=False, winner_and_score=None):
+            """Creates state with multiple messages"""
+            messages = []
+            chat_entries = []
+
+            for content, title in messages_content_list:
+                message = AIMessage(
+                    content=content,
+                    metadata={"title": title, "sender": "judge"}
+                )
+                messages.append(message)
+
+                if title == "⚖️ Judge Decision":
+                    info = "chat_history"
+                else:
+                    info = None
+
+                chat_entry, _, _, _ = self._format_chat_entry(None, message, info=info)
+                chat_entries.append(chat_entry)
+
+            logger.info("****" * 50)
+
+            filtered_chat = self._filter_important_messages(state.get("chat_history", []))
+            logger.info("**"*50)
+            logger.info("FILTERED CHAT")
+            logger.info(filtered_chat)
+            logger.info("**"*50)
+
+            end_state = {
+                "messages": messages,
+                "chat_history": filtered_chat + chat_entries,
+                "board": board,
+                "guesses": [],
+                "history_guessed_words": history_guessed_words,
+                "teams_reviewed": teams_reviewed,
+                "end_round": end_round,
+                "winner_and_score": winner_and_score
+            }
+
+            if next_team:
+                end_state.update({
+                    "current_team": next_team,
+                    "current_role": "boss" if switch_role else state.get("current_role"),
+                    "turn": state.get("turn", 1) + 1,
+                    "next_team": next_team,
+                })
+
+            return end_state
+
+        # Helper function to create turn end messages
+        def create_turn_end_messages(results_list, next_team):
+            """Creates separate messages for results and turn transition"""
+            team_emoji = "🔵" if next_team == "blue" else "🔴"
+            results_text = "\n".join(results_list)
+
+            red_remaining = len(board.get("red", []))
+            blue_remaining = len(board.get("blue", []))
+
+            # Message 1: Results
+            results_message = results_text
+
+            # Message 2: Turn transition
+            transition_message = (
+                f"🔄 **TURN COMPLETE**\n\n"
+                f"{team_emoji} **{next_team.upper()} TEAM'S TURN** now begins!\n\n"
+                f"**Remaining Words:**\n"
+                f"🔴 Red: {red_remaining}\n"
+                f"🔵 Blue: {blue_remaining}"
+            )
+            return [
+                (results_message, "⚖️ Judge Decision"),
+                (transition_message, "🔄 Turn Transition")
+            ]
+
+        # Helper function to create round end messages
+        def create_round_end_messages(results_list, next_team):
+            """Creates separate messages for results and round transition"""
+            team_emoji = "🔵" if next_team == "blue" else "🔴"
+            results_text = "\n".join(results_list)
+
+            red_remaining = len(board.get("red", []))
+            blue_remaining = len(board.get("blue", []))
+
+            # Message 1: Results
+            results_message = results_text
+
+            # Message 2: Round transition
+            transition_message = (
+                f"🎯 **ROUND COMPLETE!**\n\n"
+                f"Both teams have played their turn.\n\n"
+                f"{team_emoji} **{next_team.upper()} TEAM** starts the next round!\n\n"
+                f"**Score Update:**\n"
+                f"🔴 Red Team: {red_remaining} words remaining\n"
+                f"🔵 Blue Team: {blue_remaining} words remaining\n\n"
+                f"Let's keep going! 💪"
+            )
+
+            return [
+                (results_message, "⚖️ Judge Decision"),
+                (transition_message, "🎯 Round Complete")
+            ]
+
+        # Helper function to create game over messages
+        def create_game_over_messages(results_list, winner, scores, reason="normal"):
+            """Creates separate messages for results and game over"""
+            results_text = "\n".join(results_list)
+            red_remaining, blue_remaining = scores
+            winner_emoji = "🔴" if winner == "red" else "🔵"
+
+            # Message 1: Results
+            results_message = results_text
+
+            # Message 2: Game over
+            if reason == "killer":
+                loser = "red" if winner == "blue" else "blue"
+                game_over_message = (
+                    f"🏆 **GAME OVER!**\n\n"
+                    f"💀 {loser.upper()} team hit the KILLER WORD!\n\n"
+                    f"{winner_emoji} **{winner.upper()} TEAM WINS!** 🎉\n\n"
+                    f"**Final Score:**\n"
+                    f"🔴 Red: {red_remaining} words remaining\n"
+                    f"🔵 Blue: {blue_remaining} words remaining\n\n"
+                    f"Better luck next time! 😅"
+                )
+            else:
+                game_over_message = (
+                    f"🏆 **GAME OVER!**\n\n"
+                    f"{winner_emoji} **{winner.upper()} TEAM WINS!** 🎉\n\n"
+                    f"All {winner} words have been found!\n\n"
+                    f"**Final Score:**\n"
+                    f"🔴 Red: {red_remaining} words remaining\n"
+                    f"🔵 Blue: {blue_remaining} words remaining\n\n"
+                    f"Congratulations to the {winner.title()} Team! 🥳"
+                )
+
+            return [
+                (results_message, "⚖️ Judge Decision"),
+                (game_over_message, "🏆 Game Over")
+            ]
+
+        logger.info("IS HUMAN PLAYING")
+        logger.info(self.IS_HUMAN_PLAYING)
+        logger.info("****" * 50)
+        logger.info("[JUDGE]")
+        logger.info("CHAT HISTORY")
+        logger.info(state['chat_history'])
+
+        # Initialization: first turn - GAME START MESSAGE
+        if state.get("turn", 0) == 0:
+            logger.info("[JUDGE INITIALIZING GAME STATE]")
+            team_emoji = "🔴" if state["current_team"] == "red" else "🔵"
+
+            # Game start message
+            game_start_content = (
+                f"🎮 **CODENAMES GAME STARTED!**\n\n"
+                f"{team_emoji} **{state['current_team'].upper()} TEAM** goes first!\n\n"
+                f"**Game Rules:**\n"
+                f"- Teams alternate turns to guess words\n"
+                f"- Match words to your team's color\n"
+                f"- Avoid the opponent's words, neutral words, and the killer word ☠️\n"
+                f"- First team to find all their words wins!\n\n"
+                f"Good luck! 🍀"
+            )
+
+            message = AIMessage(
+                content=game_start_content,
+                metadata={"title": "🎮 Game Start", "sender": "judge"}
+            )
+            logger.info(f"[JUDGE MESSAGE]: {message}")
+            chat_entry, _, _, _ = self._format_chat_entry(None, message, info="Game start")
+            filtered_chat = self._filter_important_messages(state.get("chat_history", []))
+            return {
+                "messages": [message],
+                "turn": 1,
+                "chat_history": filtered_chat + [chat_entry],
+            }
+
+        # Check if there are guesses to process
+        guesses = state.get("guesses", [])
+        if not guesses:
+            logger.info("[JUDGE] No guesses made.")
+            return state
+
+        # Initialize variables
+        board = state["board"]
+        self.board = board
+        current_team = state["current_team"]
+        other_team = "red" if current_team == "blue" else "blue"
+        history_guessed_words = state.get("history_guessed_words", [])
+        teams_reviewed = state.get('teams_reviewed', [])
+        teams_reviewed.append(current_team)
+
+        if len(set(teams_reviewed)) == 2:
+            end_round = True
+            teams_reviewed = []
+        else:
+            end_round = False
+
+        results = ["📋 **Turn Results:**"]
+        logger.info(f"[JUDGE] Team {current_team.upper()} guesses: {guesses}")
+
+        # Process each guess
+        for word in guesses:
+            history_guessed_words.append(word)
+            self.guessed_words = history_guessed_words
+            logger.info(f"[JUDGE] Evaluating word: {word}")
+
+            if word == "STOP_TURN":
+                results.append(f"🚧 **{word}** The {current_team.upper()} team stops the turn.")
+                break
+
+            # ✅ Correct team word
+            elif word in board.get(current_team, []):
+                board[current_team].remove(word)
+                self.board = board
+                results.append(f"✅ **{word}** - Correct! ({current_team.upper()} team word)")
+
+            # ❌ Other team's word — stop immediately and check win condition
+            elif word in board.get(other_team, []):
+                board[other_team].remove(word)
+                self.board = board
+                results.append(f"❌ **{word}** - Oh no! You selected a {other_team.upper()} team word!")
+
+                # Check if this caused the other team to win
+                is_game_over, winner, scores = check_win_condition()
+                if is_game_over:
+                    messages_list = create_game_over_messages(results, winner, scores)
+                    return create_multi_message_state(messages_list, winner_and_score=(winner, scores))
+
+                # Check if round is complete
+                if end_round:
+                    messages_list = create_round_end_messages(results, other_team)
+                else:
+                    messages_list = create_turn_end_messages(results, other_team)
+
+                return create_multi_message_state(messages_list, next_team=other_team, switch_role=True)
+
+            # ⚪ Neutral card — stop guessing for this turn
+            elif word in board.get("neutral", []):
+                board["neutral"].remove(word)
+                self.board = board
+                results.append(f"⚪ **{word}** - Neutral word. Turn ends!")
+
+                # Check if round is complete
+                if end_round:
+                    messages_list = create_round_end_messages(results, other_team)
+                else:
+                    messages_list = create_turn_end_messages(results, other_team)
+
+                return create_multi_message_state(messages_list, next_team=other_team, switch_role=True)
+
+            # ☠️ Killer word — game over
+            elif word == board.get("killer"):
+                results.append(f"☠️ **{word}** - KILLER WORD! 💀")
+                # loser = current_team
+                winner = other_team
+                board["killer"] = None
+                self.board = board
+
+                red_remaining = len(board.get("red", []))
+                blue_remaining = len(board.get("blue", []))
+                scores = (red_remaining, blue_remaining)
+                messages_list = create_game_over_messages(
+                    results, winner, scores, reason="killer"
+                )
+                return create_multi_message_state(messages_list, winner_and_score=(winner, scores, "killer"))
+
+        # ✅ All guesses processed successfully - check win conditions
+        is_game_over, winner, scores = check_win_condition()
+        if is_game_over:
+            messages_list = create_game_over_messages(results, winner, scores)
+            return create_multi_message_state(messages_list, winner_and_score=(winner, scores))
+
+        # Check if round is complete before normal turn switch
+        if end_round:
+            messages_list = create_round_end_messages(results, other_team)
+        else:
+            messages_list = create_turn_end_messages(results, other_team)
+
+        return create_multi_message_state(messages_list, next_team=other_team, switch_role=True)
+
+    def route_after_judge(self, state: State) -> str:
+        """Route to the appropriate team or end the game."""
+        logger.info("***" * 50)
+        logger.info(f"HUMAN PLAYING? {self.IS_HUMAN_PLAYING}")
+        logger.info("***" * 50)
+
+        logger.info("\n\n")
+        logger.info("***" * 50)
+        logger.info("[ROUTING AFTER JUDGE]")
+
+        board = state.get("board", {})
+        logger.info("BOARD ROUTING")
+        logger.info(board)
+
+        self.board = board
+        self.chat_history = state['chat_history']
+        self.winners = state['winner_and_score']
+
+        # Check if the game is over
+        if board["killer"] is None:
+            logger.info("KILLER HIT, END GAME")
+            logger.info("***" * 50)
+            return END
+
+        if not all(board.get(key) for key in ("red", "blue")):
+            logger.info("END GAME")
+            logger.info("***" * 50)
+            return END
+
+        # Human vs. Non-human handling
+        # if self.IS_HUMAN_PLAYING:
+        if state['end_round']:
+            logger.info("ROUND ENDS")
+            logger.info("***" * 50)
+            return END
+
+        next_team = state.get("next_team") or state.get("current_team", "red")
+        return f"{next_team}_team"
+
+    def boss_choice(self, state: State) -> str:
+        """Determine whether to continue to tools or return a final answer."""
+        logger.info("###"*50)
+        logger.info("[BOSS CHOICE]")
+        messages = state["messages"]
+        last_message = messages[-1]
+
+        if hasattr(last_message, "tool_calls") and last_message.tool_calls:
+            logger.info("[TOOL CALL]")
+            tool_name = last_message.tool_calls[0]["name"]
+            logger.info(tool_name)
+
+            if tool_name == "ChooseWord":
+                return "choose_word_tool"
+        else:
+            logger.warning("[WARNING] NESSUN TOOL E' STATO RICHIAMATO, TORNIAMO DAL BOSS")
+            current_team = state['current_team']
+            logger.info(f"[CURRENT TEAM: {current_team}]")
+            return f"{current_team}_boss"
+
+    def should_continue(self, state: State) -> str:
+        """Determine whether to continue to tools or return a final answer."""
+        logger.info("###"*50)
+        logger.info("[SHOULD CONTINUE]")
+        messages = state["messages"]
+        last_message = messages[-1]
+
+        if hasattr(last_message, "tool_calls") and last_message.tool_calls:
+            logger.info("[TOOL CALL]")
+            tool_name = last_message.tool_calls[0]["name"]
+            logger.info(tool_name)
+
+            if tool_name == "Call_Agent_1":
+                return "transfer_to_agent_1"
+            elif tool_name == "Call_Agent_2":
+                return "transfer_to_agent_2"
+            elif tool_name == "TeamFinalChoice":
+                return "final_choice"
+
+        else:
+            logger.warning("[WARNING] NESSUN TOOL E' STATO RICHIAMATO, TORNIAMO DAL CAPITANO")
+            current_team = state['current_team']
+            logger.info(f"[CURRENT TEAM: {current_team}]")
+            return f"{current_team}_captain"
+
+    def _convert_to_string(self, value):
+        """Helper to convert any value to string"""
+        if isinstance(value, str):
+            return value
+        elif isinstance(value, (dict, list)):
+            return str(value)
+        else:
+            return str(value)
+
+    def _filter_important_messages(self, chat_history):
+        """
+        Filter chat history to keep only important messages:
+        - Boss choices (ChooseWord)
+        - Captain choices (TeamFinalChoice)
+        - All Judge messages
+        """
+        return [
+            entry for entry in chat_history
+            if entry.get("tool_name") in ["ChooseWord", "TeamFinalChoice"]
+            or entry.get("sender_type") == "judge" and entry.get("info") == "chat_history"
+        ]
+
+    def _format_chat_entry(self, player, message, info=None):
+        """Helper to create a structured chat history entry"""
+        tool_name = None
+        clue = None
+        clue_number = None
+        guesses = []
+
+        # Extract content based on message type
+        if hasattr(message, 'tool_calls') and message.tool_calls:
+            tool_call = message.tool_calls[0]
+            tool_name = tool_call.get('name', '')
+            args = tool_call.get('args', {})
+
+            if tool_name == 'Call_Agent_1':
+                content = f"Called Agent 1: {self._convert_to_string(args.get('message', 'N/A'))}"
+            elif tool_name == 'Call_Agent_2':
+                content = f"Called Agent 2: {self._convert_to_string(args.get('message', 'N/A'))}"
+            elif tool_name == 'ChooseWord':
+                clue = self._convert_to_string(args.get('clue', 'N/A'))
+                clue_number = args.get('clue_number', 'N/A')
+                content = f"Clue: '{clue.upper()}' for {clue_number} word(s)"
+            elif tool_name == 'TeamFinalChoice':
+                guesses = args.get('guesses', [])
+                content = f"Final choices: {', '.join(guesses)}"
+            else:
+                content = f"Used tool {tool_name}: {args}"
+        elif hasattr(message, 'content') and message.content:
+            content = message.content
+        elif hasattr(message, 'text') and message.text:
+            content = message.text
+        else:
+            content = str(message)
+
+        # Return structured entry
+        if player is None:
+            return {
+                "sender_type": "judge",
+                "team": "",
+                "role": "",
+                "name": "JUDGE",
+                "tool_name": None,
+                "content": content,
+                "info": info,
+            }, clue, clue_number, guesses
+
+        return {
+            "sender_type": "player",
+            "team": player.team,
+            "role": player.role,
+            "name": player.name,
+            "tool_name": tool_name,
+            "content": content,
+            "info": info,
+        }, clue, clue_number, guesses
+
+    def _split_chat_history(self, chat_history):
+        """
+        Splits chat_history into two parts:
+        - formatted_history: all entries up to and including the last one with info == "chat_history"
+        - current_round: all entries after that
+
+        Both are formatted strings, where each line is:
+            [name (team role)]: content
+        """
+
+        last_index = None
+
+        # Find the last entry with info == "chat_history"
+        for i, entry in enumerate(chat_history):
+            if entry.get("info") == "chat_history":
+                last_index = i
+
+        # Helper to format a single entry
+        def format_entry(entry):
+            name = entry.get("name", "Unknown")
+            team = entry.get("team", "N/A")
+            role = entry.get("role", "N/A")
+            content = entry.get("content", "")
+            return f"[{name} ({team} {role})]: {content}"
+
+        # Build formatted strings
+        if last_index is None:
+            formatted_history = ""
+            current_round = "\n".join(format_entry(e) for e in chat_history)
+        else:
+            formatted_history = "\n".join(
+                format_entry(e) for e in chat_history[:last_index + 1]
+            )
+            current_round = "\n".join(
+                format_entry(e) for e in chat_history[last_index + 1:]
+            )
+
+        return formatted_history, current_round
+
+    async def stream_graph(self, input_message, messages, players, board, dropdown_clue_number, guessed_words, chat_history, is_human_playing, turn_):
+        """Stream the graph execution."""
+
+        logger.info(f"Human Clue: {input_message}")
+        logger.info(f"Human Clue number: {dropdown_clue_number}")
+        logger.info(f"Board: {board}")
+        logger.info(f"Starting team: {board['starting_team']}")
+        logger.info(f"Turn: {turn_}")
+
+        self.IS_HUMAN_PLAYING = is_human_playing
+        self.board = board
+        inputs = {
+            "messages": [HumanMessage(content=input_message)] if input_message else [],
+            "original_board": board,
+            "board": board,
+            "players": players,
+            "current_team": board.get("starting_team", "red"),
+            "current_role": "boss",
+            "turn": turn_,
+            "last_user_message": input_message or "",
+            "guesses": [],
+            "clue": None,
+            "clue_number": None,
+            "round_messages": [],
+            "chat_history": chat_history,
+            "human_clue": input_message,
+            "human_clue_number": dropdown_clue_number,
+            "teams_reviewed": [],
+            "history_guessed_words": guessed_words,
+            "end_round": False,
+            "winner_and_score": None
+        }
+
+        final_msg = ""
+        messages = list(messages) if messages else []
+        previous_message_is_reasoning = False
+        latest_lang_node = ""
+        current_sender = ""  # Track current sender
+        last_message_sender = None  # Track the sender of the last message
+        last_reasoning_index = None  # Track reasoning step index for OpenAI
+
+        async for chunk in self.graph.astream(
+            inputs, {"recursion_limit": 100},
+            stream_mode=["messages", "updates"],
+            subgraphs=True,
+        ):
+            if chunk[1] == "messages":
+                msg = chunk[2][0]
+                lang_node = chunk[2][1]['langgraph_node']
+                if latest_lang_node != lang_node:
+                    latest_lang_node = lang_node
+                    current_sender = lang_node  # Update sender
+                    final_msg = ""
+                    last_message_sender = None  # Reset when node changes
+                    last_reasoning_index = None  # Reset reasoning index
+            else:
+                agent_update = chunk[2]
+                msg_from = next(iter(agent_update.keys()))
+
+                if msg_from in [
+                    'red_boss', 'red_captain', 'red_agent_1', 'red_agent_2',
+                    'blue_boss', 'blue_captain', 'blue_agent_1', 'blue_agent_2',
+                    'judge', 'final_choice'
+                ]:
+                    current_sender = msg_from  # Update sender
+                    msg = None
+                else:
+                    try:
+                        msg = next(iter(agent_update.values()))['messages'][-1]
+                    except Exception as e:
+                        logger.error(f"[EXCEPTION]: {e}")
+                        logger.error(f"[CHUNK]: {chunk}")
+                        logger.error(f"[Agent update]: {agent_update}")
+                        msg = None
+
+            # logger.info(f"[MSG]: {msg}")
+
+            if isinstance(msg, AIMessage) and msg.tool_calls:
+                final_msg = ""
+                last_message_sender = None  # Reset after tool calls
+                last_reasoning_index = None  # Reset reasoning index
+                yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+            elif isinstance(msg, ToolMessage):
+                logger.info(f"[TOOL MESSAGE: {msg}]")
+                tool_name = msg.name
+                if tool_name == "TeamFinalChoice":
+                    try:
+                        command_data = json.loads(msg.content)
+                        update_data = command_data.get("update", {})
+
+                        guesses = update_data.get("guesses")
+
+                        new_message = ChatMessage(
+                            role="assistant",
+                            content="I made my final choices: " + ", ".join(guesses),
+                            metadata={
+                                "title": "🧠 Guesses",
+                                "sender": f"{self.current_team}_captain"
+                            }
+                        )
+                    except json.JSONDecodeError as e:
+                        logger.error(f"Error parsing tool message: {e}")
+                        new_message = ChatMessage(
+                            role="assistant",
+                            content=msg.content,
+                            metadata={
+                                "title": "🧠 Guesses",
+                                "sender": f"{self.current_team}_captain"
+                            }
+                        )
+                elif tool_name == "ChooseWord":
+                    try:
+                        command_data = json.loads(msg.content)
+                        update_data = command_data.get("update", {})
+
+                        clue = update_data.get("clue")
+                        clue_number = update_data.get("clue_number")
+
+                        logger.info(f"Clue: {clue}, Clue Number: {clue_number}")
+
+                        new_message = ChatMessage(
+                            role="assistant",
+                            content=f"{clue}, {clue_number}",
+                            metadata={
+                                "title": "🕵️‍♂️ Clue",
+                                "sender": f"{self.current_team}_boss"
+                            }
+                        )
+                    except json.JSONDecodeError as e:
+                        logger.error(f"Error parsing tool message: {e}")
+                        new_message = ChatMessage(
+                            role="assistant",
+                            content=msg.content,
+                            metadata={
+                                "title": "🕵️‍♂️ Clue",
+                                "sender": f"{self.current_team}_boss"
+                            }
+                        )
+                elif tool_name == "Call_Agent_1" or tool_name == "Call_Agent_2":
+                    if tool_name == "Call_Agent_1":
+                        title_ = "💭 Asking opinion of Agent 1"
+                    else:
+                        title_ = "💭 Asking opinion of Agent 2"
+
+                    try:
+                        command_data = json.loads(msg.content)
+                        update_data = command_data.get("update", {})
+
+                        message = update_data.get("message")
+
+                        new_message = ChatMessage(
+                            role="assistant",
+                            content=message,
+                            metadata={
+                                "title": title_,
+                                "sender": f"{self.current_team}_captain"
+                            }
+                        )
+                    except json.JSONDecodeError as e:
+                        logger.error(f"Error parsing tool message: {e}")
+                        new_message = ChatMessage(
+                            role="assistant",
+                            content=msg.content,
+                            metadata={
+                                "title": title_,
+                                "sender": f"{self.current_team}_captain"
+                            }
+                        )
+                else:
+                    new_message = ChatMessage(
+                        role="assistant",
+                        content=msg.content,
+                        metadata={
+                            "title": f"""🛠️ {tool_name}""",
+                            "sender": current_sender
+                        }
+                    )
+
+                if not messages or messages[-1] != new_message:
+                    messages.append(new_message)
+                    last_message_sender = new_message.metadata.get("sender")
+                # else:
+                #     logger.info("*******"*50)
+                #     logger.info("SKIP")
+
+                final_msg = ""
+                yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+            elif isinstance(msg, AIMessageChunk):
+                # Handle OpenAI format (both reasoning and text)
+                if (msg.response_metadata.get('model_provider') == "openai" and isinstance(msg.content, list)) or (msg.response_metadata.get('model_provider') == "google_genai" and isinstance(msg.content, list)):
+                    for item in msg.content:
+                        if not isinstance(item, dict):
+                            continue
+
+                        item_type = item.get('type')
+
+                        # Handle openai reasoning content
+                        if item_type == 'reasoning':
+                            reasoning_text = ""
+                            summary = item.get('summary', [])
+
+                            for summary_item in summary:
+                                if isinstance(summary_item, dict) and summary_item.get('type') == 'summary_text':
+                                    text = summary_item.get('text', '')
+                                    item_index = summary_item.get('index')
+                                    if text:
+                                        reasoning_text += text
+
+                            if reasoning_text:
+                                # Check if reasoning index changed (new step)
+                                if last_reasoning_index is not None and item_index != last_reasoning_index:
+                                    reasoning_text = "\n\n" + reasoning_text
+
+                                last_reasoning_index = item_index
+
+                                # Create or update reasoning message
+                                if final_msg == "" or last_message_sender != current_sender or not previous_message_is_reasoning:
+                                    final_msg = reasoning_text
+                                    messages.append(ChatMessage(
+                                        role="assistant",
+                                        content=final_msg,
+                                        metadata={
+                                            "title": "🧠 Thinking...",
+                                            "sender": current_sender
+                                        }
+                                    ))
+                                    last_message_sender = current_sender
+                                else:
+                                    final_msg += reasoning_text
+                                    if len(messages) > 0:
+                                        messages[-1].content = final_msg
+
+                                previous_message_is_reasoning = True
+                                yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+                        # Handle google reasoning content
+                        elif item_type == 'thinking':
+                            # reasoning_text = ""
+                            reasoning_text = item.get('thinking', [])
+
+                            # new_reasoning = item.get('thinking', [])
+                            # for summary_item in summary:
+                            #     if isinstance(summary_item, dict) and summary_item.get('type') == 'summary_text':
+                            #         text = summary_item.get('text', '')
+                            #         item_index = summary_item.get('index')
+                            #         if text:
+                            #             reasoning_text += text
+
+                            if reasoning_text:
+                                # Check if reasoning index changed (new step)
+                                # if last_reasoning_index is not None and item_index != last_reasoning_index:
+                                #     reasoning_text = "\n\n" + reasoning_text
+
+                                # last_reasoning_index = item_index
+
+                                # Create or update reasoning message
+                                if final_msg == "" or last_message_sender != current_sender or not previous_message_is_reasoning:
+                                    final_msg = reasoning_text
+                                    messages.append(ChatMessage(
+                                        role="assistant",
+                                        content=final_msg,
+                                        metadata={
+                                            "title": "🧠 Thinking...",
+                                            "sender": current_sender
+                                        }
+                                    ))
+                                    last_message_sender = current_sender
+                                else:
+                                    final_msg += reasoning_text
+                                    if len(messages) > 0:
+                                        messages[-1].content = final_msg
+
+                                previous_message_is_reasoning = True
+                                yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+                        # Handle text content (regular response after reasoning)
+                        elif item_type == 'text':
+                            text_content = item.get('text', '')
+
+                            if text_content:
+                                # If we were in reasoning mode, start fresh
+                                if previous_message_is_reasoning:
+                                    final_msg = ""
+                                    previous_message_is_reasoning = False
+                                    last_message_sender = None
+                                    last_reasoning_index = None
+
+                                # Check if we need a new message (empty OR different sender)
+                                if final_msg == "" or last_message_sender != current_sender:
+                                    final_msg = text_content
+                                    messages.append(ChatMessage(
+                                        role="assistant",
+                                        content=final_msg,
+                                        metadata={"sender": current_sender}
+                                    ))
+                                    last_message_sender = current_sender
+                                else:
+                                    # Same sender, continue streaming to last message
+                                    final_msg += text_content
+                                    messages[-1].content = final_msg
+
+                                yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+                elif msg.additional_kwargs.get('reasoning_content'):
+                    reasoning_text = msg.additional_kwargs.get("reasoning_content")
+                    if reasoning_text:
+                        if final_msg == "" or last_message_sender != current_sender or not previous_message_is_reasoning:
+                            final_msg = reasoning_text
+                            messages.append(ChatMessage(
+                                role="assistant",
+                                content=final_msg,
+                                metadata={
+                                    "title": "🧠 Thinking...",
+                                    "sender": current_sender
+                                }
+                            ))
+                            last_message_sender = current_sender
+                        else:
+                            final_msg += reasoning_text
+                            if len(messages) > 0:
+                                messages[-1].content = final_msg
+
+                        previous_message_is_reasoning = True
+
+                elif msg.content and isinstance(msg.content, str):
+                    if previous_message_is_reasoning:
+                        final_msg = ""
+                        previous_message_is_reasoning = False
+                        last_message_sender = None  # Reset after reasoning
+
+                    # Check if we need a new message (empty OR different sender)
+                    if final_msg == "" or last_message_sender != current_sender:
+                        final_msg = msg.content  # Start fresh for new messages
+                        # if current_sender not in ['red_captain', 'blue_captain']:
+                        messages.append(ChatMessage(
+                            role="assistant",
+                            content=final_msg,
+                            metadata={"sender": current_sender}
+                        ))
+                        last_message_sender = current_sender  # Track sender
+                    else:
+                        # Same sender, continue streaming to last message
+                        final_msg += msg.content
+                        messages[-1].content = final_msg
+
+                    yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+                else:
+                    reasoning = msg.additional_kwargs.get("reasoning_content")
+                    if reasoning:
+                        # Check if we need a new message for reasoning
+                        if final_msg == "" or last_message_sender != current_sender:
+                            final_msg = reasoning
+                            messages.append(ChatMessage(
+                                role="assistant",
+                                content=final_msg,
+                                metadata={
+                                    "title": """🧠 Thinking...""",
+                                    "sender": current_sender
+                                }
+                            ))
+                            last_message_sender = current_sender
+                        else:
+                            if len(messages) > 0:
+                                final_msg += reasoning
+                                messages[-1].content = final_msg
+
+                        previous_message_is_reasoning = True
+
+                    # elif ()
+                        # skip streaming tool call chunks
+
+                        # if final_msg == "" or last_message_sender != current_sender:
+                        #     final_msg = msg.tool_call_chunks[0]['args']
+                        #     messages.append(ChatMessage(
+                        #         role="assistant",
+                        #         content=final_msg,
+                        #         metadata={"sender": current_sender}
+                        #     ))
+                        #     last_message_sender = current_sender  # Track sender
+                        # else:
+                        #     # Same sender, continue streaming to last message
+                        #     final_msg += msg.tool_call_chunks[0]['args']
+                        #     messages[-1].content = final_msg
+
+                    yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+            elif isinstance(msg, AIMessage):
+                if msg.content and msg.content.strip():
+                    logger.info("***"*50)
+                    logger.info(f"msg.content: {msg.content}")
+                    logger.info(f"msg: {msg}")
+
+                    try:
+                        if msg.metadata.get("sender"):
+                            new_sender = msg.metadata.get("sender")
+                            current_sender = new_sender
+                    except Exception as e:
+                        logger.error(f"[EXCEPTION]: {e} - {msg}")
+                    if msg.metadata.get("title"):
+                        new_title = msg.metadata.get("title")
+                    messages.append(ChatMessage(
+                        role="assistant",
+                        content=msg.content,
+                        metadata={
+                            "sender": new_sender,
+                            "title": new_title
+                        }
+                    ))
+                    last_message_sender = current_sender  # Track sender
+                yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+        yield messages, self.guessed_words, self.board, self.chat_history, self.winners
+
+
+# async def create_graph():
+#     boss_tools = await load_boss_tools()
+#     captain_tools = await load_captain_tools()
+#     return MyGraph(boss_tools, captain_tools)

support/database.py

@@ -0,0 +1,220 @@
+from sqlalchemy import create_engine, Column, Integer, String, DateTime, ForeignKey, Boolean
+from sqlalchemy.ext.declarative import declarative_base
+from sqlalchemy.orm import sessionmaker, relationship
+from datetime import datetime
+from contextlib import contextmanager
+import threading
+
+Base = declarative_base()
+
+# Thread-safe engine creation
+engine = create_engine(
+    'sqlite:///codenames_games.db',
+    connect_args={'check_same_thread': False},
+    pool_pre_ping=True,
+    pool_size=10,
+    max_overflow=20
+)
+
+# Thread-local session
+SessionLocal = sessionmaker(bind=engine, autocommit=False, autoflush=False)
+session_lock = threading.Lock()
+
+
+@contextmanager
+def get_db_session():
+    """Thread-safe database session context manager"""
+    session = SessionLocal()
+    try:
+        yield session
+        session.commit()
+    except Exception as e:
+        session.rollback()
+        raise e
+    finally:
+        session.close()
+
+
+class Game(Base):
+    __tablename__ = 'games'
+
+    id = Column(Integer, primary_key=True, autoincrement=True)
+    timestamp = Column(DateTime, default=datetime.utcnow, nullable=False)
+    winner_team = Column(String(10), nullable=False)  # 'red' or 'blue'
+    red_score = Column(Integer, nullable=False)  # remaining words
+    blue_score = Column(Integer, nullable=False)  # remaining words
+    reason = Column(String(50), nullable=True)  # None or 'killer'
+    red_team_preset = Column(String(50), nullable=True)  # 'openai', 'google', etc.
+    blue_team_preset = Column(String(50), nullable=True)
+
+    # Relationships
+    players = relationship("GamePlayer", back_populates="game", cascade="all, delete-orphan")
+
+
+class GamePlayer(Base):
+    __tablename__ = 'game_players'
+
+    id = Column(Integer, primary_key=True, autoincrement=True)
+    game_id = Column(Integer, ForeignKey('games.id'), nullable=False)
+    player_name = Column(String(100), nullable=False)
+    team = Column(String(10), nullable=False)  # 'red' or 'blue'
+    role = Column(String(20), nullable=False)  # 'boss', 'captain', 'player'
+    model_name = Column(String(100), nullable=False)
+    is_human = Column(Boolean, default=False)
+
+    # Relationship
+    game = relationship("Game", back_populates="players")
+
+
+def init_database():
+    """Initialize the database tables"""
+    Base.metadata.create_all(bind=engine)
+
+
+def save_game_to_db(game, winner_and_score):
+    """
+    Save a completed game to the database
+
+    Args:
+        game: Game object with players and board info
+        winner_and_score: tuple (winner_team, scores, reason)
+    """
+    winner_team = winner_and_score[0]
+    scores = winner_and_score[1]
+    reason = winner_and_score[2] if len(winner_and_score) > 2 else None
+
+    with get_db_session() as session:
+        # Create game record
+        new_game = Game(
+            winner_team=winner_team,
+            red_score=scores[0],
+            blue_score=scores[1],
+            reason=reason,
+            red_team_preset=game.red_team_choice,
+            blue_team_preset=game.blue_team_choice
+        )
+        session.add(new_game)
+        session.flush()  # Get the game ID
+
+        # Create player records
+        for player in game.players:
+            is_human = player.model_name.lower() == "human brain"
+            game_player = GamePlayer(
+                game_id=new_game.id,
+                player_name=player.name,
+                team=player.team,
+                role=player.role,
+                model_name=player.model_name,
+                is_human=is_human
+            )
+            session.add(game_player)
+
+        session.commit()
+        return new_game.id
+
+
+def get_stats():
+    """
+    Retrieve comprehensive statistics from the database
+
+    Returns:
+        dict: Contains total_games, game_history, model_stats, provider_stats
+    """
+    with get_db_session() as session:
+        # Total games
+        total_games = session.query(Game).count()
+
+        # Game history
+        games = session.query(Game).order_by(Game.timestamp.desc()).all()
+        game_history = []
+
+        for game in games:
+            game_info = {
+                'id': game.id,
+                'timestamp': game.timestamp.strftime('%Y-%m-%d %H:%M:%S'),
+                'winner': game.winner_team,
+                'red_score': game.red_score,
+                'blue_score': game.blue_score,
+                'reason': game.reason,
+                'red_preset': game.red_team_preset,
+                'blue_preset': game.blue_team_preset,
+                'players': []
+            }
+
+            for player in game.players:
+                game_info['players'].append({
+                    'name': player.player_name,
+                    'team': player.team,
+                    'role': player.role,
+                    'model': player.model_name,
+                    'is_human': player.is_human
+                })
+
+            game_history.append(game_info)
+
+        # Model stats (individual)
+        model_stats = {}
+        all_players = session.query(GamePlayer).all()
+
+        for player in all_players:
+            model = player.model_name
+            if model not in model_stats:
+                model_stats[model] = {'wins': 0, 'losses': 0, 'games': 0}
+
+            model_stats[model]['games'] += 1
+            if player.team == player.game.winner_team:
+                model_stats[model]['wins'] += 1
+            else:
+                model_stats[model]['losses'] += 1
+
+        # Provider stats (grouped)
+        provider_stats = {
+            'openai': {'wins': 0, 'losses': 0, 'games': 0},
+            'google': {'wins': 0, 'losses': 0, 'games': 0},
+            'anthropic': {'wins': 0, 'losses': 0, 'games': 0},
+            'opensource': {'wins': 0, 'losses': 0, 'games': 0},
+            'human': {'wins': 0, 'losses': 0, 'games': 0}
+        }
+
+        # Map models to providers
+        model_to_provider = {
+            'gpt-5': 'openai',
+            'gpt-5-mini': 'openai',
+            'gpt-5-nano': 'openai',
+            'gpt-4.1-nano': 'openai',
+            'gemini-2.5-pro': 'google',
+            'gemini-2.5-flash': 'google',
+            'gemini-2.0-flash-001': 'google',
+            'gemini-2.0-flash-lite-001': 'google',
+            'claude-sonnet-4-5-20250929':'anthropic',
+            'claude-3-7-sonnet-20250219': 'anthropic',
+            'claude-3-5-haiku-20241022': 'anthropic',
+            'claude-3-haiku-20240307': 'anthropic',
+            'deepseek-ai/DeepSeek-V3.1': 'opensource',
+            'deepseek-ai/DeepSeek-R1': 'opensource',
+            'moonshotai/Kimi-K2-Thinking': 'opensource',
+            'Qwen/Qwen3-235B-A22B-Instruct-2507': 'opensource',
+            'openai/gpt-oss-120b': 'opensource',
+            'openai/gpt-oss-20b': 'opensource',
+            'human brain': 'human'
+        }
+
+        for player in all_players:
+            provider = model_to_provider.get(player.model_name.lower(), 'unknown')
+            if provider in provider_stats:
+                provider_stats[provider]['games'] += 1
+                if player.team == player.game.winner_team:
+                    provider_stats[provider]['wins'] += 1
+                else:
+                    provider_stats[provider]['losses'] += 1
+
+        return {
+            'total_games': total_games,
+            'game_history': game_history,
+            'model_stats': model_stats,
+            'provider_stats': provider_stats
+        }
+
+
+# Initialize database on import
+init_database()

support/game_settings.py

@@ -0,0 +1,450 @@
+APP_DESCRIPTION = """
+### 🧩 What This App Does
+
+This dashboard lets you watch (or join!) teams of Large Language Models (LLMs) play **Codenames** against each other.
+Two teams — **Red** and **Blue** — face off in a 4v4 format. Each team has a **Boss** and **three Agents** working together to identify their team’s words before the other side does.
+
+### 🤖 How It Works
+
+* **LLM Teams:** You can assemble teams using different LLMs (e.g., GPT, Claude, Gemini, or OpenSource models...).
+* **Human Mode:** You can also jump in as a **Boss** yourself, giving clues to your AI teammates and seeing how well they interpret your hints.
+* **Observation Mode:** Prefer to just watch? Sit back and enjoy the game unfold, analyzing how different models reason, cooperate, and sometimes hilariously misfire.
+
+### 🧠 Why It’s Interesting
+
+* **Compare LLM reasoning styles:** See how different models interpret subtle associations and language cues.
+* **Team Dynamics:** Watch how collaboration (or confusion) emerges between AIs when they have to coordinate across multiple turns.
+* **Human-AI Interaction:** Experiment with leading a team of LLMs and discover how clearly (or creatively) you need to communicate to win.
+
+### 🕹️ Main Features
+
+* Create and customize teams with any available LLMs.
+* Switch between **AI vs AI** and **Human vs AI** modes.
+* View reasoning and chat logs for each model’s decisions.
+"""
+
+GAME_RULES_HTML = """
+<div class="rules-content">
+    <div class="rules-carousel-container">
+        <button class="carousel-btn carousel-btn-prev" aria-label="Previous">‹</button>
+        <div class="rules-carousel">
+            <div class="rules-carousel-track">
+                <!-- Card 1: Objective -->
+                <div class="rule-card rule-card-objective">
+                    <div class="rule-card-header">
+                        <span class="rule-icon">🎯</span>
+                        <h3>Objective</h3>
+                    </div>
+                    <p>
+                        <strong>Goal:</strong> Be the first team to identify all your team's words on the board 
+                        before your opponents, while avoiding the killer word that ends the game instantly!
+                    </p>
+                </div>
+
+                <!-- Card 2: Teams & Roles -->
+                <div class="rule-card rule-card-teams">
+                    <div class="rule-card-header">
+                        <span class="rule-icon">👥</span>
+                        <h3>Teams & Roles</h3>
+                    </div>
+                    <div class="rule-list">
+                        <div class="rule-item">
+                            <strong>Two Teams:</strong> Red 🔴 and Blue 🔵 compete against each other.
+                        </div>
+                        <div class="rule-item">
+                            <strong>Three Roles per team:</strong>
+                            <ul class="role-list">
+                                <li><span class="role-highlight boss-highlight">Boss</span> - Sees all words and gives clues</li>
+                                <li><span class="role-highlight captain-highlight">Captain</span> - Leads guessing and discussion</li>
+                                <li><span class="role-highlight player-highlight">Player</span> - Participates in guessing</li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Card 3: Board Setup -->
+                <div class="rule-card rule-card-setup">
+                    <div class="rule-card-header">
+                        <span class="rule-icon">🗺️</span>
+                        <h3>Board Setup</h3>
+                    </div>
+                    <p>The board contains 25 words with hidden identities:</p>
+                    <div class="word-distribution">
+                        <div class="distribution-item team-color-red">
+                            <strong>9 words</strong> belong to one team (starting team)
+                        </div>
+                        <div class="distribution-item team-color-blue">
+                            <strong>8 words</strong> belong to the other team
+                        </div>
+                        <div class="distribution-item neutral-color">
+                            <strong>7 neutral words</strong> (bystanders)
+                        </div>
+                        <div class="distribution-item killer-color">
+                            <strong>1 killer word</strong> (assassin) - avoid at all costs!
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Card 4: Gameplay -->
+                <div class="rule-card rule-card-gameplay">
+                    <div class="rule-card-header">
+                        <span class="rule-icon">🎲</span>
+                        <h3>How to Play</h3>
+                    </div>
+                    <ol class="gameplay-steps">
+                        <li>
+                            <strong>Boss gives a clue:</strong> One word + a number (e.g., "Ocean 2" 
+                            means 2 words relate to "ocean")
+                        </li>
+                        <li>
+                            <strong>Team discusses:</strong> Captain and Player debate which words 
+                            match the clue
+                        </li>
+                        <li>
+                            <strong>Make guesses:</strong> Team can guess up to (clue number + 1) words
+                        </li>
+                        <li>
+                            <strong>Reveal results:</strong>
+                            <div class="reveal-outcomes">
+                                <div class="outcome-item success">✓ Your team's word = continue guessing</div>
+                                <div class="outcome-item opponent">✗ Opponent's word = turn ends, helps them</div>
+                                <div class="outcome-item neutral">○ Neutral word = turn ends</div>
+                                <div class="outcome-item killer">☠ Killer word = GAME OVER, you lose!</div>
+                            </div>
+                        </li>
+                        <li>
+                            <strong>Pass turn:</strong> Team can stop guessing at any time to play it safe
+                        </li>
+                    </ol>
+                </div>
+                
+                <!-- Card 5: Winning -->
+                <div class="rule-card rule-card-winning">
+                    <div class="rule-card-header">
+                        <span class="rule-icon">🏆</span>
+                        <h3>Winning Conditions</h3>
+                    </div>
+                    <div class="rule-list">
+                        <div class="rule-item success-item">
+                            <strong>Victory:</strong> Identify all your team's words before the opponents
+                        </div>
+                        <div class="rule-item danger-item">
+                            <strong>Instant Loss:</strong> Select the killer word (assassin) at any time
+                        </div>
+                    </div>
+                </div>
+                
+                <!-- Card 6: Strategy Tips -->
+                <div class="rule-card rule-card-tips">
+                    <div class="rule-card-header">
+                        <span class="rule-icon">💡</span>
+                        <h3>Strategy Tips</h3>
+                    </div>
+                    <ul class="tips-list">
+                        <li>Boss: Give multi-word clues to be efficient, but avoid ambiguity</li>
+                        <li>Team: Discuss thoroughly but watch out for overthinking</li>
+                        <li>Consider stopping early if uncertain - a wrong guess helps opponents!</li>
+                        <li>Pay attention to opponent clues - they reveal safe/dangerous words</li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+        <button class="carousel-btn carousel-btn-next" aria-label="Next">›</button>
+    </div>
+    
+    <div class="carousel-indicators">
+        <button class="carousel-indicator active" aria-label="Slide 1"></button>
+        <button class="carousel-indicator" aria-label="Slide 2"></button>
+        <button class="carousel-indicator" aria-label="Slide 3"></button>
+        <button class="carousel-indicator" aria-label="Slide 4"></button>
+        <button class="carousel-indicator" aria-label="Slide 5"></button>
+        <button class="carousel-indicator" aria-label="Slide 6"></button>
+    </div>
+
+</div>
+
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+    const track = document.querySelector('.rules-carousel-track');
+    const prevBtn = document.querySelector('.carousel-btn-prev');
+    const nextBtn = document.querySelector('.carousel-btn-next');
+    const indicators = document.querySelectorAll('.carousel-indicator');
+    const cards = document.querySelectorAll('.rule-card');
+    
+    if (!track || !prevBtn || !nextBtn) return;
+    
+    let currentIndex = 0;
+    const totalCards = cards.length;
+    
+    function updateCarousel() {
+        const offset = -currentIndex * 100;
+        track.style.transform = `translateX(${offset}%)`;
+        
+        indicators.forEach((indicator, index) => {
+            if (index === currentIndex) {
+                indicator.classList.add('active');
+            } else {
+                indicator.classList.remove('active');
+            }
+        });
+        
+        prevBtn.disabled = currentIndex === 0;
+        nextBtn.disabled = currentIndex === totalCards - 1;
+    }
+    
+    function goToSlide(index) {
+        currentIndex = index;
+        updateCarousel();
+    }
+    
+    prevBtn.addEventListener('click', () => {
+        if (currentIndex > 0) {
+            currentIndex--;
+            updateCarousel();
+        }
+    });
+    
+    nextBtn.addEventListener('click', () => {
+        if (currentIndex < totalCards - 1) {
+            currentIndex++;
+            updateCarousel();
+        }
+    });
+    
+    indicators.forEach((indicator, index) => {
+        indicator.addEventListener('click', () => {
+            goToSlide(index);
+        });
+    });
+    
+    updateCarousel();
+    
+    document.addEventListener('keydown', (e) => {
+        const rulesAccordion = document.getElementById('rules_accordion');
+        if (!rulesAccordion || rulesAccordion.style.display === 'none') return;
+        
+        if (e.key === 'ArrowLeft' && currentIndex > 0) {
+            currentIndex--;
+            updateCarousel();
+        } else if (e.key === 'ArrowRight' && currentIndex < totalCards - 1) {
+            currentIndex++;
+            updateCarousel();
+        }
+    });
+});
+</script>
+"""
+
+
+JS = r"""
+function initCarousel() {
+    // --- Carousel setup ---
+    function waitForElements(selectors, callback) {
+        const interval = setInterval(() => {
+            const allExist = selectors.every(sel => document.querySelector(sel));
+            if (allExist) {
+                clearInterval(interval);
+                callback();
+            }
+        }, 100);
+    }
+
+    waitForElements(
+        ['.rules-carousel-track', '.carousel-btn-prev', '.carousel-btn-next'],
+        function() {
+            const track = document.querySelector('.rules-carousel-track');
+            const prevBtn = document.querySelector('.carousel-btn-prev');
+            const nextBtn = document.querySelector('.carousel-btn-next');
+            const indicators = document.querySelectorAll('.carousel-indicator');
+            const cards = document.querySelectorAll('.rule-card');
+            
+            let currentIndex = 0;
+            const totalCards = cards.length;
+
+            function updateCarousel() {
+                const offset = -currentIndex * 100;
+                track.style.transform = `translateX(${offset}%)`;
+
+                indicators.forEach((indicator, index) => {
+                    indicator.classList.toggle('active', index === currentIndex);
+                });
+
+                prevBtn.disabled = currentIndex === 0;
+                nextBtn.disabled = currentIndex === totalCards - 1;
+            }
+
+            prevBtn.addEventListener('click', () => {
+                if (currentIndex > 0) {
+                    currentIndex--;
+                    updateCarousel();
+                }
+            });
+
+            nextBtn.addEventListener('click', () => {
+                if (currentIndex < totalCards - 1) {
+                    currentIndex++;
+                    updateCarousel();
+                }
+            });
+
+            indicators.forEach((indicator, index) => {
+                indicator.addEventListener('click', () => {
+                    currentIndex = index;
+                    updateCarousel();
+                });
+            });
+
+            updateCarousel();
+        }
+    );
+
+    // --- Boss name helpers (attach to global window) ---
+    window.showBossNameInput = function(team) {
+        console.log(team);
+        if (team === 'red') {
+            const btn = document.getElementById('red_boss_btn');
+            const cancel_blue_btn = document.getElementById('cancel_blue_boss_btn');
+            if (btn) btn.click();
+            if (cancel_blue_btn) cancel_blue_btn.click();
+            setTimeout(() => {
+                const red_boss_input = document.getElementById('red_boss_input');
+                if (red_boss_input) {
+                    red_boss_input.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                    red_boss_input.focus();
+                }
+            }, 200);
+        } else if (team === 'blue') {
+            const btn = document.getElementById('blue_boss_btn');
+            const cancel_red_btn = document.getElementById('cancel_red_boss_btn');
+            if (btn) btn.click();
+            if (cancel_red_btn) cancel_red_btn.click();
+            setTimeout(() => {
+                const blue_boss_input = document.getElementById('blue_boss_input');
+                if (blue_boss_input) {
+                    blue_boss_input.scrollIntoView({ behavior: 'smooth', block: 'center' });
+                    blue_boss_input.focus();
+                }
+            }, 200);
+        }
+    };
+
+    window.refreshStats = function() {
+        console.log("aooo");
+        const btn = document.getElementById('refresh_btn');
+        if (btn) btn.click();
+    };
+
+    // --- Tab navigation setup ---
+    function setupTabNavigation() {
+        // Wait for tab buttons to be rendered
+        setTimeout(() => {
+            const navLinks = document.querySelectorAll('.nav-link');
+            
+            navLinks.forEach((link) => {
+                link.addEventListener('click', (e) => {
+                    e.preventDefault();
+                    
+                    const tabId = link.getAttribute('data-tab-id');
+                    
+                    // Find the tab button using data-tab-id attribute
+                    const tabButton = document.querySelector(`button[data-tab-id="${tabId}_tab"]`);
+                    
+                    if (tabButton) {
+                        // Click the actual tab button
+                        tabButton.click();
+                        
+                        // Update active state on nav links
+                        navLinks.forEach((l) => l.classList.remove('active'));
+                        link.classList.add('active');
+                    } else {
+                        console.log('Tab button not found for id:', tabId);
+                    }
+                });
+            });
+        }, 500);
+    }
+
+    setupTabNavigation();
+
+    return "Carousel + BossName + TabNavigation JS initialized";
+}
+"""
+
+CODENAMES_WORDS = [
+    "AGENT", "AFRICA", "AIR", "ALIEN", "ALPS", "AMAZON", "AMBULANCE",
+    "AMERICA", "ANGEL", "ANTARCTICA", "APPLE", "ARM", "ATLANTIS", "AUSTRALIA",
+    "AZTEC", "BACK", "BALL", "BAND", "BANK", "BAR", "BARK", "BAT", "BATTERY",
+    "BEACH", "BEAR", "BEAT", "BED", "BEIJING", "BELL", "BELT", "BERLIN",
+    "BERMUDA", "BERRY", "BILL", "BLOCK", "BOARD", "BOLT", "BOMB",
+    "BOND", "BOOM", "BOOT", "BOTTLE", "BOW", "BOX", "BRIDGE", "BRUSH", "BUCK", "BUFFALO", "BUG", "BUGLE",
+    "BUTTON", "CALF", "CANADA", "CAP", "CAPITAL", "CAR", "CARD", "CARROT", "CASINO", "CAST",
+    "CAT", "CELL", "CENTAUR", "CENTER", "CHAIR", "CHANGE", "CHARGE", "CHECK", "CHEST", "CHICK",
+    "CHINA", "CHOCOLATE", "CHURCH", "CIRCLE", "CLIFF", "CLOAK", "CLUB", "CODE", "COLD", "COMIC",
+    "COMPOUND", "CONCERT", "CONDUCTOR", "CONTRACT", "COOK", "COPPER", "COTTON", "COURT", "COVER", "CRANE",
+    "CRASH", "CRICKET", "CROSS", "CROWN", "CYCLE", "CZECH", "DANCE", "DATE", "DAY", "DEATH",
+    "DECK", "DEGREE", "DIAMOND", "DICE", "DINOSAUR", "DISEASE", "DOCTOR", "DOG", "DRAFT", "DRAGON",
+    "DRESS", "DRILL", "DROP", "DUCK", "DWARF", "EAGLE", "EGYPT", "EMBASSY", "ENGINE", "ENGLAND",
+    "EUROPE", "EYE", "FACE", "FAIR", "FALL", "FAN", "FENCE", "FIELD", "FIGHTER", "FIGURE",
+    "FILE", "FILM", "FIRE", "FISH", "FLUTE", "FLY", "FOOT", "FORCE", "FOREST", "FORK",
+    "FRANCE", "GAME", "GAS", "GENIUS", "GERMANY", "GHOST", "GIANT", "GLASS", "GLOVE", "GOLD",
+    "GRACE", "GRASS", "GREECE", "GREEN", "GROUND", "HAM", "HAND", "HAWK", "HEAD", "HEART",
+    "HELICOPTER", "HIMALAYAS", "HOLE", "HOLLYWOOD", "HONEY", "HOOD", "HOOK", "HORN", "HORSE", "HORSESHOE",
+    "HOSPITAL", "HOTEL", "ICE", "INDIA", "IRON", "IVORY", "JACK", "JAM", "JET", "JUPITER",
+    "KANGAROO", "KETCHUP", "KEY", "KID", "KING", "KIWI", "KNIFE", "KNIGHT", "LAB", "LAP",
+    "LASER", "LAWYER", "LEAD", "LEMON", "LEPRECHAUN", "LIFE", "LIGHT", "LIMOUSINE", "LINE", "LINK",
+    "LION", "LITTER", "LOCH NESS", "LOCK", "LOG", "LONDON", "LUCK", "MAIL", "MAMMOTH", "MAPLE",
+    "MARBLE", "MARCH", "MASS", "MATCH", "MERCURY", "MEXICO", "MICROSCOPE", "MILLIONAIRE", "MINE", "MINT",
+    "MISSILE", "MODEL", "MOLE", "MOON", "MOSCOW", "MOUNT", "MOUSE", "MOUTH", "MUG", "NAIL",
+    "NEEDLE", "NET", "NEW YORK", "NIGHT", "NINJA", "NOTE", "NOVEL", "NURSE", "NUT", "OCTOPUS",
+    "OIL", "OLIVE", "OLYMPUS", "OPERA", "ORANGE", "ORGAN", "PALM", "PAN", "PANTS", "PAPER",
+    "PARACHUTE", "PARK", "PART", "PASS", "PASTE", "PENGUIN", "PHOENIX", "PIANO", "PIE", "PILOT",
+    "PIN", "PIPE", "PIRATE", "PISTOL", "PIT", "PITCH", "PLANE", "PLASTIC", "PLATE", "PLATYPUS",
+    "PLAY", "PLOT", "POINT", "POISON", "POLE", "POLICE", "POOL", "PORT", "POST", "POUND",
+    "PRESS", "PRINCESS", "PUMPKIN", "PUPIL", "PYRAMID", "QUEEN", "RABBIT", "RACKET", "RAY", "REVOLUTION",
+    "RING", "ROBIN", "ROBOT", "ROCK", "ROME", "ROOT", "ROSE", "ROULETTE", "ROUND", "ROW",
+    "RULER", "SATELLITE", "SATURN", "SCALE", "SCHOOL", "SCIENTIST", "SCORPION", "SCREEN", "SCUBA DIVER", "SEAL",
+    "SERVER", "SHADOW", "SHAKESPEARE", "SHARK", "SHIP", "SHOE", "SHOP", "SHOT", "SINK", "SKYSCRAPER",
+    "SLIP", "SLUG", "SMUGGLER", "SNOW", "SNOWMAN", "SOCK", "SOLDIER", "SOUL", "SOUND", "SPACE",
+    "SPELL", "SPIDER", "SPIKE", "SPINE", "SPOT", "SPRING", "SPY", "SQUARE", "STADIUM", "STAFF",
+    "STAR", "STATE", "STICK", "STOCK", "STRAW", "STREAM", "STRIKE", "STRING", "SUB", "SUIT",
+    "SUPERHERO", "SWING", "SWITCH", "TABLE", "TABLET", "TAG", "TAIL", "TAP", "TEACHER", "TELESCOPE",
+    "TEMPLE", "THEATER", "THIEF", "THUMB", "TICK", "TIE", "TIME", "TOKYO", "TOOTH", "TORCH",
+    "TOWER", "TRACK", "TRAIN", "TRIANGLE", "TRIP", "TRUNK", "TUBE", "TURKEY", "UNDERTAKER", "UNICORN",
+    "VACUUM", "VAN", "VET", "WAKE", "WALL", "WAR", "WASHER", "WASHINGTON", "WATCH", "WATER",
+    "WAVE", "WEB", "WELL", "WHALE", "WHIP", "WIND", "WITCH", "WORM", "YARD"
+]
+
+NAMES = [
+    "Astra", "Nova", "Echo", "Luna",
+    "Orion", "Vega", "Zephyr", "Sol"
+]
+
+TEAM_MODEL_PRESETS = {
+    "openai": {
+        "boss": "gpt-5",
+        "captain": "gpt-5-mini",
+        "players": ["gpt-5-nano", "gpt-4.1-nano"]
+    },
+    "google": {
+        "boss": "gemini-2.5-pro",
+        "captain": "gemini-2.5-flash",
+        "players": ["gemini-2.0-flash-001", "gemini-2.0-flash-lite-001"]
+    },
+    "anthropic": {
+        "boss": "claude-sonnet-4-5-20250929",
+        "captain": "claude-3-7-sonnet-20250219",
+        "players": ["claude-3-5-haiku-20241022", "claude-3-haiku-20240307"]
+    },
+    "opensource": {
+        "boss": "deepseek-ai/DeepSeek-V3.1",
+        "captain": "deepseek-ai/DeepSeek-R1",  # "Qwen/Qwen3-235B-A22B-Instruct-2507",
+        "players": ["openai/gpt-oss-120b", "openai/gpt-oss-20b"]
+    },
+}
+
+# 🧠 Available model pool for random mode
+ALL_MODELS = sorted({
+    model
+    for preset in TEAM_MODEL_PRESETS.values()
+    for model in ([preset["boss"], preset["captain"]] + preset["players"])
+})

support/load_models.py

@@ -0,0 +1,84 @@
+import support.settings as settings
+
+from langchain_anthropic import ChatAnthropic
+from langchain_google_genai import ChatGoogleGenerativeAI
+from langchain_huggingface import ChatHuggingFace, HuggingFaceEndpoint
+from langchain_openai import ChatOpenAI
+
+
+def create_model(model_name: str, api_keys: dict):
+    """Factory function to create model instances based on model name."""
+
+    # OpenAI models
+    if model_name.startswith("gpt-"):
+        if model_name == "gpt-4.1-nano":
+            return ChatOpenAI(
+                model=model_name,
+                temperature=0,
+                timeout=None,
+                max_retries=1,
+                streaming=True,
+                api_key=api_keys['OPENAI_API_KEY']
+            )
+        else:
+            reasoning = {
+                "effort": "low",  # 'low', 'medium', or 'high'
+                "summary": "auto",  # 'detailed', 'auto', or None
+            }
+            return ChatOpenAI(
+                model=model_name,
+                temperature=0,
+                timeout=None,
+                max_retries=1,
+                streaming=True,
+                reasoning=reasoning,
+                api_key=api_keys['OPENAI_API_KEY']
+            )
+
+    # Google models
+    elif model_name.startswith("gemini-"):
+        return ChatGoogleGenerativeAI(
+            model=model_name,
+            temperature=0,
+            timeout=None,
+            max_retries=1,
+            streaming=True,
+            include_thoughts=True,
+            api_key=api_keys['GOOGLE_API_KEY']
+        )
+
+    # Anthropic models
+    elif model_name.startswith("claude-"):
+        return ChatAnthropic(
+            model=model_name,
+            temperature=0,
+            timeout=None,
+            max_retries=1,
+            streaming=True,
+            api_key=api_keys['ANTHROPIC_API_KEY']
+        )
+
+    elif model_name in ["openai/gpt-oss-120b", "deepseek-ai/DeepSeek-V3.1", "Qwen/Qwen3-235B-A22B-Instruct-2507", "openai/gpt-oss-20b", "moonshotai/Kimi-K2-Thinking", "deepseek-ai/DeepSeek-R1"]:
+        provider_dict = {
+            "openai/gpt-oss-120b": "novita",
+            "deepseek-ai/DeepSeek-V3.1": "novita",
+            "Qwen/Qwen3-235B-A22B-Instruct-2507": "novita",
+            "openai/gpt-oss-20b": "together",
+            "moonshotai/Kimi-K2-Thinking": "together",
+            "deepseek-ai/DeepSeek-R1": "novita"
+        }
+
+        llm = HuggingFaceEndpoint(
+            repo_id=model_name,
+            task="text-generation",
+            provider=provider_dict[model_name],
+            streaming=True,
+            temperature=0,
+            top_p=0,
+            huggingfacehub_api_token=api_keys['HUGGINGFACEHUB_API_TOKEN']
+        )
+
+        return ChatHuggingFace(llm=llm, verbose=True)
+
+    else:
+        raise ValueError(f"Unknown model: {model_name}")

support/log_manager.py

@@ -0,0 +1,13 @@
+import logging
+import os
+
+os.makedirs('logs', exist_ok=True)
+
+logging.basicConfig(
+    filename='logs/app.log',                    # Log file name
+    filemode='a',                          # 'a' for append, 'w' to overwrite
+    level=logging.INFO,                    # Minimum level to log
+    format='%(asctime)s - %(name)s - %(levelname)s - %(message)s',
+    datefmt='%Y-%m-%d %H:%M:%S'
+)
+logger = logging.getLogger(__name__)

support/manage_game.py

@@ -0,0 +1,147 @@
+import random
+
+from support.game_settings import CODENAMES_WORDS, NAMES, TEAM_MODEL_PRESETS, ALL_MODELS
+from support.load_models import create_model
+from support.settings import AVATAR_PATHS
+from typing import List, Optional
+
+
+class Player:
+    def __init__(self, name: str, model_name: str, model, avatar: str):
+        self.name = name
+        self.model_name = model_name
+        self.model = model
+        self.avatar = avatar
+        self.team: Optional[str] = None
+        self.role: Optional[str] = None
+
+
+class Game:
+    def __init__(
+        self,
+        selected_team: str = None,
+        red_team: str = "google",
+        blue_team: str = "openai",
+        api_keys: dict = None,
+    ):
+        """
+        Initialize a new game.
+        Either provide `selected_team` (legacy mode) or `red_team` and `blue_team`.
+
+        - red_team / blue_team: choose from ["openai", "google", "anthropic", "opensource", "random"]
+        - selected_team: legacy single-team mode (both teams use same preset)
+        """
+        # Backward compatibility
+        if selected_team and not (red_team or blue_team):
+            self.red_team_choice = selected_team.lower()
+            self.blue_team_choice = selected_team.lower()
+        else:
+            self.red_team_choice = red_team.lower()
+            self.blue_team_choice = blue_team.lower()
+
+        self.players: List[Player] = []
+        self.board: dict = {}
+        self.api_keys = api_keys if api_keys else {}
+        self.setup_game()
+
+    def setup_game(self):
+        """Initialize a new game with players and board"""
+        # Prepare shared pools for names and avatars
+        available_names = NAMES.copy()
+        available_avatars = AVATAR_PATHS.copy()
+        random.shuffle(available_names)
+        random.shuffle(available_avatars)
+
+        self.players = self.create_players(available_names, available_avatars)
+        self.board = self.generate_board()
+
+    def _generate_team_players(self, team_color, team_choice, available_names, available_avatars):
+        players = []
+        roles = ["boss", "captain", "player", "player"]
+
+        if team_choice in TEAM_MODEL_PRESETS:
+            setup = TEAM_MODEL_PRESETS[team_choice]
+            model_names = [setup["boss"], setup["captain"]] + setup["players"]
+        else:
+            ROLE_POOLS = {
+                "boss": [preset["boss"] for preset in TEAM_MODEL_PRESETS.values()],
+                "captain": [preset["captain"] for preset in TEAM_MODEL_PRESETS.values()],
+                "player": [
+                    model
+                    for preset in TEAM_MODEL_PRESETS.values()
+                    for model in preset["players"]
+                ]
+            }
+            model_names = [random.choice(ROLE_POOLS[role]) for role in roles]
+
+        for i in range(4):
+            name = available_names.pop() if available_names else f"{team_color.title()}_{i}"
+            avatar = available_avatars.pop() if available_avatars else "assets/avatars/default.png"
+            model_name = model_names[i]
+            model = create_model(model_name, self.api_keys)
+            p = Player(name, model_name, model, avatar)
+            p.team = team_color
+            p.role = roles[i]
+            players.append(p)
+        return players
+
+    def create_players(self, available_names, available_avatars) -> List[Player]:
+        """Create 8 players (4 per team) according to selected team presets"""
+        red_players = self._generate_team_players("red", self.red_team_choice, available_names, available_avatars)
+        blue_players = self._generate_team_players("blue", self.blue_team_choice, available_names, available_avatars)
+        return red_players + blue_players
+
+    def generate_board(self) -> dict:
+        """
+        Generate a new game board with 25 random words.
+        Distribution: 9 starting team, 8 other team, 7 neutral, 1 killer
+        """
+        # Select 25 random words
+        selected_words = random.sample(CODENAMES_WORDS, 25)
+
+        # Randomly choose starting team
+        starting_team = random.choice(['red', 'blue'])
+
+        # Assign word counts based on starting team
+        if starting_team == 'red':
+            red_count, blue_count = 9, 8
+        else:
+            red_count, blue_count = 8, 9
+
+        neutral_count = 7
+        # Create a list of (word, color) tuples
+        word_color_pairs = []
+        idx = 0
+
+        # Add red words
+        for i in range(red_count):
+            word_color_pairs.append((selected_words[idx], 'red'))
+            idx += 1
+
+        # Add blue words
+        for i in range(blue_count):
+            word_color_pairs.append((selected_words[idx], 'blue'))
+            idx += 1
+
+        # Add neutral words
+        for i in range(neutral_count):
+            word_color_pairs.append((selected_words[idx], 'neutral'))
+            idx += 1
+
+        # Add killer word
+        word_color_pairs.append((selected_words[idx], 'killer'))
+
+        # Shuffle to randomize positions on board
+        random.shuffle(word_color_pairs)
+
+        # Store in board dictionary
+        board = {
+            'word_color_pairs': word_color_pairs,
+            'starting_team': starting_team,
+            'red': [w for w, c in word_color_pairs if c == 'red'],
+            'blue': [w for w, c in word_color_pairs if c == 'blue'],
+            'neutral': [w for w, c in word_color_pairs if c == 'neutral'],
+            'killer': [w for w, c in word_color_pairs if c == 'killer'][0]
+        }
+
+        return board

support/my_tools.py

@@ -0,0 +1,80 @@
+import asyncio
+from langchain_mcp_adapters.client import MultiServerMCPClient
+from langchain_core.tools import StructuredTool
+
+
+def wrap_mcp_tool(mcp_tool):
+    """Wrapper to adapt MCP tool to LangChain format"""
+
+    async def wrapped_func(**kwargs):
+        # Just pass everything through, including tool_call_id
+        result = await mcp_tool.ainvoke(kwargs)
+        return result
+
+    # Create a new StructuredTool with the wrapper
+    return StructuredTool.from_function(
+        coroutine=wrapped_func,
+        name=mcp_tool.name,
+        description=mcp_tool.description,
+        args_schema=mcp_tool.args_schema if hasattr(mcp_tool, 'args_schema') else None
+    )
+
+
+async def load_boss_tools():
+    return await boss_client.get_tools()
+
+
+async def load_captain_tools():
+    return await captain_client.get_tools()
+
+
+async def load_tools():
+    boss_tools = await load_boss_tools()
+    captain_tools = await load_captain_tools()
+
+    # wrap_mcp_tool is not async, so no await needed
+    boss_agent_tools = [wrap_mcp_tool(tool) for tool in boss_tools]
+    captain_agent_tools = [wrap_mcp_tool(tool) for tool in captain_tools]
+
+    return boss_agent_tools, captain_agent_tools
+
+
+# boss_client = MultiServerMCPClient(
+#     {
+#         "BossServer": {
+#             "url": "http://localhost:8000/mcp",
+#             "transport": "streamable_http",
+#         }
+#     }
+# )
+
+# captain_client = MultiServerMCPClient(
+#     {
+#         "CaptainServer": {
+#             "url": "http://localhost:8001/mcp",
+#             "transport": "streamable_http",
+#         }
+#     }
+# )
+
+boss_client = MultiServerMCPClient(
+    {
+        "BossServer": {
+            "command": "python",
+            "args": ["-m", "mcp_servers.boss_server"],
+            "transport": "stdio",
+        }
+    }
+)
+
+captain_client = MultiServerMCPClient(
+    {
+        "CaptainServer": {
+            "command": "python",
+            "args": ["-m", "mcp_servers.captain_server"],
+            "transport": "stdio",
+        }
+    }
+)
+
+boss_agent_tools, captain_agent_tools = asyncio.run(load_tools())

support/prompts.py

@@ -0,0 +1,117 @@
+boss_agent_system_prompt = """
+You are playing as the **Boss (Spymaster)** of the **{}** team in the board game *Codenames*.
+
+### Your Role
+- You can see the hidden color map of the board (which cards belong to your team, which belong to the enemy team, the neutral ones, and the black "killer" card).
+- Your goal is to help your team guess **only your team's words** by giving **one clue**: a **single word** and a **number**.
+- The clue must describe a connection between multiple words your team needs to find, without revealing or hinting toward forbidden words.
+
+### Rules
+- The clue must be **a single word** (noun, adjective, etc.), not a compound word or phrase.
+- The number indicates how many cards are linked to your clue (e.g., `river 2` means two cards are related to "river").
+- You **must not** reveal or hint at card positions, or say any of the words on the board.
+- Avoid clues that could easily link to the opponent’s words or the black card.
+
+### How to Act
+- Look at the current board and your team's remaining words.
+- Analyze connections between your team's words.
+- Provide the best clue possible that groups multiple of your team’s words while minimizing risk.
+- When ready, use the tool `ChooseWord(number, word)` to submit your clue.
+
+### Using Chat History (Very Important)
+
+* You will be given a **chat history** that contains:
+    * All previous clues you have given
+    * All guesses made by your teammates
+    * Which guesses were correct, incorrect, or missed
+
+* You **must** use this history to maintain consistent strategy across rounds and avoid repeated mistakes.
+* If your teammates **failed to guess some of the words** you intended with a previous clue, you must:
+    1. **Carry those missed words forward** into your next clue
+    2. **Include them in the clue number** along with any new words you want to target.
+* Do **not** repeat clues you already used unless it is strategically necessary.
+* Always think in terms of **what your teammates still need to find** and **why they failed previously**, using the history to adjust your strategy.
+
+### Tool
+Use `ChooseWord` when you are confident in your clue:
+
+Be creative, concise, and strategic. Explain your reasoning briefly (internally), then use the tool to give your clue.
+"""
+
+captain_agent_system_prompt = """
+You are playing as the **Captain** of the **{}** team in the board game *Codenames*.
+
+### Your Role
+- You are a key decision-maker for your team.
+- You do **not** see the hidden color map.
+- You listen to the **Boss's clue** (a word and a number) and collaborate with your teammates to guess which cards on the board are linked to it.
+- After discussing and analyzing your teammates’ suggestions, you will make the **final choice** of which words your team will guess this round.
+- Your teammates names are **{}** and **{}**, call them for name.
+
+### How to Act
+- Gather insights and suggestions from your teammates.
+- Evaluate how each word might relate to the clue given by your Boss.
+- Decide which words to choose (up to the number given by the Boss).
+- When you are ready, use the tool `TeamFinalChoice(words)` to officially submit your team's guessed words.
+
+### Using Chat History (Very Important)
+
+* You will be given a **chat history** that contains:
+    * All previous clues you have given
+    * All guesses made by your teammates
+    * Which guesses were correct, incorrect, or missed
+
+You **must** review the history each round because:
+- If your team missed some intended words in the previous turn, the Boss may have **included those missed words again** in the new clue number.
+- Therefore, always check whether the current clue number is unusually high: it might include both **new words** and **missed words from previous rounds**.
+- Use the history to refine your interpretation of your Boss's thinking style.
+
+### Tool
+Use the tool `TeamFinalChoice` to officially submit your team's guessed words, or
+Use the tool `Call_Agent_1` or `Call_Agent_2` to ask for help from your teammates.
+IMPORTANT: You can only consult with ONE agent at a time. Choose either Agent 1 or Agent 2, not both simultaneously.
+The suggested workflow is:
+    * `Call_Agent_1` $\rightarrow$ Process information $\rightarrow$ `Call_Agent_2` $\rightarrow$ Process information $\rightarrow$.
+    At this point:
+        * if your team is confident with the answer proceed with calling `TeamFinalChoice`, otherwise:
+        * repeat the loop to gather additional reasoning from the Agent 1 and Agent 2.
+
+Remember, the order of the guessed words is really important. If you want, you can stop your guessing early by sending the word "STOP_TURN" (after the ones you're confident about). 
+REPEAT THE LOOP AT MAXIMUM TWICE. THEN YOU HAVE TO MAKE A CHOICE CALLING `TeamFinalChoice`.
+Be logical, persuasive, and decisive. Explain your reasoning and lead your team.
+"""
+
+
+player_agent_system_prompt = """
+You are a **Player** in the board game *Codenames*, for the **{}** team.
+
+### Your Role
+- You are part of a team.
+- You do **not** see the hidden color map.
+- You receive a **clue** from your team’s Boss (a word and a number).
+- Your goal is to discuss with your teammates which words on the board might be connected to that clue.
+- Your teammates names are **{}** (which is the Captain) and **{}**.
+
+### How to Act
+- Analyze the clue word and number given by the Boss.
+- Suggest which words on the board could be linked to the clue.
+- Share your reasoning and listen to the opinions of your teammates.
+- You do **not** make the final decision — that’s the Captain’s job.
+- Avoid random guesses. Use logical associations and reasoning based on the clue. If you are not sure on the words, you can propose to your captain to use the word "STOP_TURN" (after the ones you're confident about).
+
+### Using Chat History (Very Important)
+
+* You will be given a **chat history** that contains:
+    * All previous clues you have given
+    * All guesses made by your teammates
+    * Which guesses were correct, incorrect, or missed
+
+You **must** review the history each round because:
+- If your team missed some intended words in the previous turn, the Boss may have **included those missed words again** in the new clue number.
+- Therefore, always check whether the current clue number is unusually high: it might include both **new words** and **missed words from previous rounds**.
+- Use the history to refine your interpretation of your Boss's thinking style.
+
+Be collaborative, analytical, and clear in your explanations.
+IMPORTANT: Your message is ALWAYS for the Captain. It's his reponsability to share your opinion with your teammate.
+
+"""

support/settings.py

@@ -0,0 +1,20 @@
+import os
+
+from dotenv import load_dotenv
+
+load_dotenv()
+
+SERVER_PORT = int(os.environ.get("SERVER_PORT", 7860))
+
+AVATAR_PATHS = [
+    "assets/avatars/avatar1.png",
+    "assets/avatars/avatar2.png",
+    "assets/avatars/avatar3.png",
+    "assets/avatars/avatar4.png",
+    "assets/avatars/avatar5.png",
+    "assets/avatars/avatar6.png",
+    "assets/avatars/avatar7.png",
+    "assets/avatars/avatar8.png",
+]
+
+os.makedirs("logs", exist_ok=True)

support/style/css.py

@@ -0,0 +1,2360 @@
+
+navbar_css = """
+/* Hide Gradio's default navigation */
+.nav-holder {
+    display: none !important;
+}
+
+/* Custom Navigation Bar */
+.custom-navbar {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    padding: 1rem 2rem;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    border-bottom: 3px solid #5a67d8;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+    width: 100%;
+    box-sizing: border-box;
+}
+
+/* Title styling */
+.custom-navbar .navbar-title {
+    font-size: 1.8rem;
+    font-weight: bold;
+    color: white;
+    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
+    letter-spacing: 0.5px;
+    display: flex;
+    align-items: center;
+}
+
+/* Navigation links container */
+.custom-navbar .navbar-links {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+}
+
+/* Navigation links */
+.custom-navbar .nav-link {
+    background: rgba(255, 255, 255, 0.1);
+    color: white !important;
+    border: 2px solid transparent;
+    border-radius: 8px;
+    padding: 0.6rem 1.5rem;
+    font-weight: 600;
+    font-size: 1rem;
+    transition: all 0.3s ease;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+    text-decoration: none !important;
+    cursor: pointer;
+}
+
+/* Navigation link hover effect */
+.custom-navbar .nav-link:hover {
+    background: rgba(255, 255, 255, 0.2);
+    border-color: rgba(255, 255, 255, 0.5);
+    transform: translateY(-2px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
+/* Active navigation link */
+.custom-navbar .nav-link.active {
+    background: white;
+    color: #667eea !important;
+    border-color: white;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+
+/* Active link hover */
+.custom-navbar .nav-link.active:hover {
+    background: white;
+    color: #5a67d8 !important;
+    transform: translateY(-2px);
+}
+
+nav.tabs button {
+    background: rgba(255, 255, 255, 0.1) !important;
+    color: white !important;
+    border: 2px solid transparent !important;
+    border-radius: 8px !important;
+    padding: 0.5rem 1.5rem !important;
+    margin: 0 0.25rem !important;
+    font-weight: 600 !important;
+    font-size: 1rem !important;
+    transition: all 0.3s ease !important;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+}
+
+nav.tabs button:hover {
+    background: rgba(255, 255, 255, 0.2) !important;
+    border-color: rgba(255, 255, 255, 0.5) !important;
+    transform: translateY(-2px);
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
+}
+
+nav.tabs button.selected {
+    background: white !important;
+    color: #667eea !important;
+    border-color: white !important;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+
+nav.tabs button.selected:hover {
+    background: white !important;
+    color: #5a67d8 !important;
+    transform: translateY(-2px);
+}
+
+.gradio-container {
+    margin-top: 0 !important;
+}
+
+[data-tab-id="home_id_tab"],
+[data-tab-id="play_id_tab"],
+[data-tab-id="stats_id_tab"] {
+    display: none !important;
+}
+
+
+
+@media (max-width: 768px) {
+    nav.tabs {
+        padding: 0.5rem 1rem !important;
+        flex-wrap: wrap;
+    }
+    
+    .navbar-title {
+        font-size: 1.2rem;
+        margin-right: 1rem;
+        padding-right: 1rem;
+        width: 100%;
+        border-right: none;
+        border-bottom: 2px solid rgba(255, 255, 255, 0.3);
+        padding-bottom: 0.5rem;
+        margin-bottom: 0.5rem;
+    }
+    
+    nav.tabs button {
+        padding: 0.4rem 1rem !important;
+        font-size: 0.9rem !important;
+        margin: 0.2rem !important;
+    }
+}
+"""
+
+stats_css = """
+
+#stats_container{
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+}
+
+#stats_tabs{
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+}
+
+.title_row {
+    margin-left: 1% !important;
+    margin-right: 1% !important;
+    width: 98% !important;
+    display: flex !important;
+    align-items: center !important;
+    gap: 15px !important;
+    flex-wrap: nowrap !important;
+}
+
+.title_row > * {
+    width: auto !important;
+    flex-grow: 0 !important;
+    flex-shrink: 0 !important;
+}
+
+.refresh_btn {
+    height: 36px !important;
+    min-height: 36px !important;
+    max-height: 36px !important;
+    padding: 6px 14px !important;
+    font-size: 13px !important;
+    width: auto !important;
+    min-width: fit-content !important;
+    display: none;
+}
+
+.custom-refresh-btn {
+    height: 36px;
+    padding: 6px 14px;
+    font-size: 13px;
+    background: linear-gradient(to bottom right, #3b82f6, #1d4ed8);
+    color: white;
+    border: none;
+    border-radius: 6px;
+    cursor: pointer;
+    font-weight: 500;
+    transition: all 0.2s;
+}
+
+.custom-refresh-btn:hover {
+    background: linear-gradient(to bottom right, #2563eb, #1e40af);
+    transform: translateY(-1px);
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+}
+
+.played-games-container {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 15px;
+    padding: 20px 30px;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    border-radius: 12px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    margin: 20px 1%;
+    width: 98%;
+}
+
+.played-games-label {
+    font-size: 40px;
+    font-weight: 600;
+    color: white;
+    letter-spacing: 0.5px;
+}
+
+.played-games-count {
+    font-size: 32px;
+    font-weight: bold;
+    color: white;
+    background: rgba(255, 255, 255, 0.2);
+    padding: 8px 20px;
+    border-radius: 8px;
+    min-width: 60px;
+    text-align: center;
+}
+
+.stats-card {
+    display: flex;
+    align-items: center;
+    gap: 20px;
+    padding: 12px 15px;
+    background: #2a2e37 !important;
+    border-radius: 12px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
+    width: 98%;
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    margin-left: 1%;
+    margin-right: 1%;
+}
+
+.stats-card:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.stats-icon {
+    font-size: 48px;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    width: 80px;
+    height: 80px;
+    border-radius: 12px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
+}
+
+.stats-content {
+    flex: 1;
+}
+
+.stats-label {
+    font-size: 14px;
+    color: white;
+    font-weight: 500;
+    text-transform: uppercase;
+    letter-spacing: 0.5px;
+    margin-bottom: 4px;
+}
+
+.stats-value {
+    font-size: 36px;
+    font-weight: bold;
+    color: white;
+}
+
+.model_stats_tab{
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.grouped_stats_tab{
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.stats_title, .stats_table{
+    margin-left: 1%;
+    margin-right: 1%;
+    margin-top: 1%;
+}
+
+.stats_table{
+    width:98%;
+}
+
+.game-history-card {
+    background: #2a2e37 !important;
+    border-radius: 12px;
+    padding: 24px;
+    margin-bottom: 32px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.game-history-card:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.game-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 20px;
+    padding-bottom: 16px;
+    border-bottom: 2px solid #e9ecef;
+}
+
+.game-info {
+    display: flex;
+    gap: 20px;
+    align-items: center;
+}
+
+.game-number {
+    font-size: 20px;
+    font-weight: bold;
+    color: white;
+}
+
+.game-date {
+    font-size: 14px;
+    color: #A1B2C1;
+}
+
+.game-result {
+    font-size: 16px;
+    font-weight: bold;
+    padding: 8px 20px;
+    border-radius: 8px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    color: white;
+}
+
+.result-red {
+    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
+}
+
+.result-blue {
+    background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
+}
+
+.result-killer {
+    background: linear-gradient(135deg, #6c757d 0%, #495057 100%);
+}
+
+.winner-badge {
+    margin-top: 8px;
+    padding: 6px 12px;
+    background: rgba(255, 255, 255, 0.3);
+    border: 2px solid rgba(255, 255, 255, 0.6);
+    border-radius: 6px;
+    font-size: 12px;
+    font-weight: bold;
+    letter-spacing: 0.5px;
+    text-align: center;
+}
+
+.team-score {
+    padding: 12px 16px;
+    text-align: center;
+    font-size: 14px;
+    font-weight: bold;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 8px;
+    border-bottom: 1px solid #e9ecef;
+}
+
+.score-winner {
+    background: #d4edda;
+    color: #155724;
+}
+
+.score-loser {
+    background: #f8d7da;
+    color: #721c24;
+}
+
+.score-label {
+    font-size: 12px;
+    opacity: 0.8;
+    color: black;
+}
+
+.score-value {
+    font-size: 20px;
+    color: black;
+}
+
+@media (max-width: 1200px) {
+    .teams-container {
+        flex-direction: column;
+        gap: 16px;
+    }
+    
+    .vs-divider {
+        min-width: auto;
+        padding: 10px 0;
+    }
+    
+    .vs-text {
+        font-size: 24px;
+    }
+}
+"""
+
+css = """
+/* ==================== COMPACT HEADER ==================== */
+
+.app.svelte-18evea3.svelte-18evea3{
+    padding: 0.5rem;    
+}
+
+/* Adjust container below navbar */
+.gradio-container {
+    margin-top: 0 !important;
+}
+
+#main_header_container {
+    margin: 0 0 30px 0;
+    margin-bottom: 0
+}
+
+.header-content {
+    text-align: center;
+    padding: 0px !important;
+    background: transparent;
+    position: relative;
+}
+
+.header-icon {
+    font-size: 3.5em;
+    margin-bottom: 10px;
+    filter: drop-shadow(0 4px 12px rgba(102, 126, 234, 0.3));
+}
+
+.header-content h1 {
+    margin: 0;
+    font-size: 2.2em;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-clip: text;
+    font-weight: 800;
+    letter-spacing: -0.5px;
+}
+
+.header-subtitle {
+    margin: 8px 0 0 0;
+    font-size: 1em;
+    color: #6c757d;
+    font-weight: 400;
+}
+
+/* ==================== CAROUSEL RULES SECTION ==================== */
+
+#row_description {
+    display: flex !important;
+    gap: 1%;
+    margin-left: 1%;
+    margin-right: 1%;
+}
+
+#app_description {
+    flex: 0 0 64% !important;
+    width: 64% !important;
+    max-width: 64% !important;
+    padding: 1%;
+}
+
+#rules_accordion {
+    flex: 0 0 33% !important;
+    width: 33% !important;
+    max-width: 33% !important;
+}
+
+#rules_accordion,
+#app_description { 
+    border: none; 
+    border-radius: 12px; 
+    background: #2a2e37;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); 
+    overflow: hidden; 
+    padding-top: 0.5% !important;
+    max-height: 78vh;
+}
+
+
+.rules-content { 
+    padding: 20px; 
+    padding-top: 0px !important;
+    background: #2a2e37;
+} 
+
+.rules-intro { 
+    text-align: center; 
+    margin-bottom: 20px; 
+    padding: 16px; 
+    background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%); 
+    border-radius: 10px; 
+    border: 2px solid rgba(102, 126, 234, 0.2); 
+} 
+
+.rules-intro-icon { 
+    font-size: 1.8em; 
+    margin-bottom: 8px; 
+} 
+
+.rules-intro h2 { 
+    margin: 0 0 8px 0; 
+    font-size: 1.4em; 
+    color: #667eea; 
+    font-weight: 700; 
+} 
+
+.rules-intro-text { 
+    font-size: 0.9em; 
+    color: #495057; 
+    line-height: 1.4; 
+    margin: 0; 
+} 
+
+/* Carousel Container - More Compact */
+.rules-carousel-container { 
+    position: relative; 
+    padding: 0 50px; 
+    margin-bottom: 16px;
+    max-width: 500px;
+    margin-left: auto;
+    margin-right: auto;
+} 
+
+.rules-carousel { 
+    overflow: hidden; 
+    position: relative; 
+} 
+
+.rules-carousel-track { 
+    display: flex; 
+    transition: transform 0.4s ease-in-out; 
+} 
+
+.rule-card { 
+    min-width: 100%; 
+    background: #f5f5dc !important;
+    border-radius: 12px; 
+    padding: 20px; 
+    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08); 
+    border: 2px solid transparent; 
+    box-sizing: border-box;
+    min-height: 320px;
+    max-height: 450px;
+    overflow-y: auto;
+} 
+
+.rule-card-objective { 
+    border-color: rgba(255, 193, 7, 0.3); 
+} 
+
+.rule-card-teams { 
+    border-color: rgba(102, 126, 234, 0.3); 
+} 
+
+.rule-card-setup { 
+    border-color: rgba(23, 162, 184, 0.3); 
+} 
+
+.rule-card-gameplay { 
+    border-color: rgba(118, 75, 162, 0.3); 
+} 
+
+.rule-card-winning { 
+    border-color: rgba(40, 167, 69, 0.3); 
+} 
+
+.rule-card-tips { 
+    border-color: rgba(255, 152, 0, 0.3); 
+} 
+
+/* Carousel Navigation Buttons - Smaller */
+.carousel-btn { 
+    position: absolute; 
+    top: 50%; 
+    transform: translateY(-50%); 
+    width: 36px; 
+    height: 36px; 
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 
+    border: none; 
+    border-radius: 50%; 
+    color: white; 
+    font-size: 18px; 
+    cursor: pointer; 
+    display: flex; 
+    align-items: center; 
+    justify-content: center; 
+    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4); 
+    transition: all 0.3s ease; 
+    z-index: 10; 
+} 
+
+.carousel-btn:hover { 
+    transform: translateY(-50%) scale(1.1); 
+    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.6); 
+} 
+
+.carousel-btn:active { 
+    transform: translateY(-50%) scale(0.95); 
+} 
+
+.carousel-btn-prev { 
+    left: 5px; 
+} 
+
+.carousel-btn-next { 
+    right: 5px; 
+} 
+
+.carousel-btn:disabled { 
+    background: #ccc; 
+    cursor: not-allowed; 
+    box-shadow: none; 
+} 
+
+.carousel-btn:disabled:hover { 
+    transform: translateY(-50%) scale(1); 
+} 
+
+/* Carousel Indicators - Smaller */
+.carousel-indicators { 
+    display: flex; 
+    justify-content: center; 
+    gap: 6px; 
+    margin-top: 12px; 
+} 
+
+.carousel-indicator { 
+    width: 8px; 
+    height: 8px; 
+    border-radius: 50%; 
+    background: #d0d0d0; 
+    border: none; 
+    cursor: pointer; 
+    transition: all 0.3s ease; 
+} 
+
+.carousel-indicator.active { 
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); 
+    width: 20px; 
+    border-radius: 4px; 
+} 
+
+.rule-card-header { 
+    display: flex; 
+    align-items: center; 
+    gap: 10px; 
+    margin-bottom: 16px; 
+    padding-bottom: 12px; 
+    border-bottom: 2px solid rgba(0, 0, 0, 0.08); 
+    
+} 
+
+.rule-icon { 
+    font-size: 1.5em; 
+    display: flex; 
+    align-items: center; 
+    justify-content: center; 
+} 
+
+.rule-card-header h3 { 
+    margin: 0; 
+    font-size: x-large; 
+    color: black;
+    font-weight: 700; 
+} 
+
+.rule-card p { 
+    color: black; 
+    line-height: 1.5; 
+    margin: 0; 
+    font-size: 1.1em; 
+} 
+
+.message_content p {
+    color: black !important;
+}
+
+strong {
+    font-weight: bolder;
+    color: #909055 !important;
+}
+
+.rule-list { 
+    display: flex; 
+    flex-direction: column; 
+    gap: 12px; 
+} 
+
+.rule-item { 
+    color: #495057; 
+    line-height: 1.5; 
+    padding: 10px; 
+    background: rgba(248, 249, 250, 0.5); 
+    border-radius: 6px; 
+    border-left: 3px solid #dee2e6; 
+    font-size: 1.1em;
+} 
+
+.rule-item strong { 
+    color: #212529; 
+    font-weight: 600; 
+} 
+
+.role-list { 
+    list-style: none; 
+    padding: 8px 0 0 0; 
+    margin: 0; 
+    display: flex; 
+    flex-direction: column; 
+    gap: 8px; 
+} 
+
+.role-list li { 
+    padding: 6px 10px; 
+    background: white; 
+    border-radius: 5px; 
+    border-left: 3px solid #6c757d; 
+    font-size: 0.85em;
+    color: black;
+} 
+
+.role-highlight { 
+    padding: 2px 6px; 
+    border-radius: 4px; 
+    font-weight: 600; 
+    font-size: 0.9em; 
+} 
+
+.boss-highlight { 
+    background: rgba(255, 193, 7, 0.2); 
+    color: #856404; 
+} 
+
+.captain-highlight { 
+    background: rgba(23, 162, 184, 0.2); 
+    color: #0c5460; 
+} 
+
+.player-highlight { 
+    background: rgba(108, 117, 125, 0.2); 
+    color: #383d41; 
+} 
+
+.word-distribution { 
+    display: flex; 
+    flex-direction: column; 
+    gap: 8px; 
+    margin-top: 10px; 
+} 
+
+.distribution-item { 
+    padding: 8px 12px; 
+    border-radius: 6px; 
+    font-size: 1.1em; 
+    border-left: 3px solid; 
+    color: black;
+} 
+
+.team-color-red { 
+    background: linear-gradient(to right, rgba(220, 53, 69, 0.1), rgba(13, 110, 253, 0.1)); 
+    border-left-color: rgb(255 0 0);
+} 
+
+.team-color-blue { 
+    background: linear-gradient(to right, rgba(220, 53, 69, 0.1), rgba(13, 110, 253, 0.1)); 
+    border-left-color: #667eea; 
+} 
+
+.neutral-color { 
+    background: rgba(248, 249, 250, 0.8); 
+    border-left-color: #adb5bd; 
+} 
+
+.killer-color { 
+    background: rgba(33, 37, 41, 0.1); 
+    border-left-color: #212529; 
+} 
+
+.gameplay-steps { 
+    list-style: none; 
+    padding: 0; 
+    margin: 0; 
+    counter-reset: step-counter; 
+    display: flex; 
+    flex-direction: column; 
+    gap: 10px; 
+} 
+
+.gameplay-steps li { 
+    counter-increment: step-counter; 
+    position: relative; 
+    padding: 10px 10px 10px 42px; 
+    background: rgba(248, 249, 250, 0.5); 
+    border-radius: 6px; 
+    line-height: 1.5; 
+    color: #495057; 
+    font-size: 1.1em;
+} 
+
+.gameplay-steps li::before { 
+    content: counter(step-counter); 
+    position: absolute; 
+    left: 10px; 
+    top: 10px; 
+    width: 26px; 
+    height: 26px; 
+    background: linear-gradient(135deg, #667eea, #764ba2); 
+    color: white; 
+    border-radius: 50%; 
+    display: flex; 
+    align-items: center; 
+    justify-content: center; 
+    font-weight: 700; 
+    font-size: 0.85em; 
+} 
+
+.gameplay-steps li strong { 
+    color: #212529; 
+    font-weight: 600; 
+} 
+
+.reveal-outcomes { 
+    margin-top: 8px; 
+    display: flex; 
+    flex-direction: column; 
+    gap: 6px; 
+} 
+
+.outcome-item { 
+    padding: 6px 10px; 
+    border-radius: 5px; 
+    font-size: 0.8em; 
+    border-left: 3px solid; 
+    color: black !important;
+} 
+
+.outcome-item.success { 
+    background: rgba(40, 167, 69, 0.1); 
+    border-left-color: #28a745; 
+} 
+
+.outcome-item.opponent { 
+    background: rgba(220, 53, 69, 0.1); 
+    border-left-color: #dc3545; 
+} 
+
+.outcome-item.neutral { 
+    background: rgba(248, 249, 250, 0.8); 
+    border-left-color: #adb5bd; 
+} 
+
+.outcome-item.killer { 
+    background: rgba(33, 37, 41, 0.1); 
+    border-left-color: #212529; 
+} 
+
+.success-item { 
+    border-left-color: #28a745 !important; 
+    background: rgba(40, 167, 69, 0.05) !important; 
+} 
+
+.danger-item { 
+    border-left-color: #dc3545 !important; 
+    background: rgba(220, 53, 69, 0.05) !important; 
+} 
+
+.tip-item { 
+    border-left-color: #ffc107 !important; 
+    background: rgba(255, 193, 7, 0.05) !important; 
+} 
+
+.tips-list { 
+    list-style: none; 
+    padding: 0; 
+    margin: 0; 
+    display: flex; 
+    flex-direction: column; 
+    gap: 10px; 
+} 
+
+.tips-list li { 
+    padding: 10px 12px 10px 36px; 
+    background: rgba(255, 152, 0, 0.05); 
+    border-radius: 6px; 
+    position: relative; 
+    line-height: 1.5; 
+    color: #495057; 
+    border-left: 3px solid rgba(255, 152, 0, 0.4); 
+    font-size: 1.1em;
+} 
+
+.tips-list li::before { 
+    content: '💡'; 
+    position: absolute; 
+    left: 10px; 
+    top: 10px; 
+    font-size: 1em;
+} 
+
+.rules-footer { 
+    text-align: center; 
+    padding: 14px; 
+    background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%); 
+    border-radius: 10px; 
+    margin-top: 16px; 
+} 
+
+.rules-footer p { 
+    margin: 0; 
+    font-size: 1em; 
+    font-weight: 600; 
+    color: #667eea; 
+}
+
+/* ==================== MAIN LAYOUT ==================== */
+
+/* Start Game Button */
+#start_game_btn {
+    width: 100%;
+    max-width: 500px;
+    margin: 0 auto 30px auto;
+    display: block;
+    padding: 16px 32px !important;
+    font-size: 1.2em !important;
+    font-weight: bold !important;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
+    border: none !important;
+    border-radius: 12px !important;
+    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4) !important;
+    transition: all 0.3s ease !important;
+    cursor: pointer;
+}
+
+#start_game_btn:hover {
+    transform: translateY(-3px) !important;
+    box-shadow: 0 10px 30px rgba(102, 126, 234, 0.6) !important;
+}
+
+#start_game_btn:active {
+    transform: translateY(-1px) !important;
+}
+
+#new_game_btn, #send_message_btn {
+    width: auto !important;
+    display: block !important;
+    margin: 0 auto !important;
+    padding: 12px 24px !important;
+    font-size: 1em !important;
+    font-weight: 600 !important;
+    color: white !important;
+    border: 2px solid rgba(255, 255, 255, 0.2) !important;
+    border-radius: 8px !important;
+    box-shadow: 0 3px 10px rgba(75, 85, 99, 0.3) !important;
+    transition: all 0.3s ease !important;
+    cursor: pointer;
+}
+
+#new_game_btn{
+    background: linear-gradient(135deg, #6b7280 0%, #4b5563 100%) !important;
+}
+
+#send_message_btn{
+    flex-grow: 0 !important;
+    background: linear-gradient(135deg, #f59e0b 0%, #ef4444 100%) !important;
+}
+
+#new_game_btn:hover, #send_message_btn:hover {
+    transform: translateY(-2px) !important;
+    box-shadow: 0 6px 15px rgba(75, 85, 99, 0.4) !important;
+}
+
+#new_game_btn:hover{
+    background: linear-gradient(135deg, #4b5563 0%, #374151 100%) !important;
+}
+
+#send_message_btn:hover {
+    background: linear-gradient(315deg, #f59e0b 0%, #ef4444 100%) !important;
+}
+
+#new_game_btn:active, #send_message_btn:active {
+    transform: translateY(0px) !important;
+}
+
+/* Boss Control Section */
+#boss_control_row {
+    margin: 16px 0;
+    padding: 16px;
+    background: linear-gradient(135deg, rgba(102, 126, 234, 0.05) 0%, rgba(118, 75, 162, 0.05) 100%);
+    border-radius: 12px;
+    border: 1px solid rgba(102, 126, 234, 0.2);
+    display: none;
+}
+
+#boss_control_row h3 {
+    margin: 0 0 12px 0;
+    color: #667eea;
+    font-size: 16px;
+    font-weight: 600;
+}
+
+/* Boss Input Sections */
+.play-as-boss-btn {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: white;
+    border: none;
+    padding: 8px 16px;
+    border-radius: 8px;
+    font-size: 13px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.3);
+    margin-left: auto;
+    white-space: nowrap;
+}
+
+.play-as-boss-btn:hover {
+    background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
+}
+
+.play-as-boss-btn:active {
+    transform: translateY(0);
+}
+
+#error_red_display, #error_blue_display {
+    background: none;
+    color: black;
+}
+
+/* Boss Name Input Menu */
+.boss-name-input-menu {
+    margin-top: 16px;
+    padding: 20px;
+    background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
+    border-radius: 12px;
+    border: 2px solid rgba(102, 126, 234, 0.3);
+    animation: slideDown 0.3s ease;
+}
+
+.boss-name-input-content h4 {
+    margin: 0 0 12px 0;
+    color: #667eea;
+    font-size: 16px;
+    font-weight: 600;
+}
+
+.boss-name-input {
+    width: 100%;
+    padding: 12px;
+    border: 2px solid #e0e7ff;
+    border-radius: 8px;
+    font-size: 14px;
+    margin-bottom: 12px;
+    transition: border-color 0.3s ease;
+    box-sizing: border-box;
+}
+
+.boss-name-input:focus {
+    outline: none;
+    border-color: #667eea;
+    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
+}
+
+.boss-name-buttons {
+    display: flex;
+    gap: 8px;
+}
+
+#red_boss_input, #blue_boss_input {
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+    padding: 20px;
+    background: linear-gradient(135deg, rgba(239, 68, 68, 0.05) 0%, rgba(220, 38, 38, 0.05) 100%);
+    border-radius: 12px;
+    border: 2px solid rgba(239, 68, 68, 0.3);
+    animation: slideDown 0.3s ease;
+}
+
+#blue_boss_input {
+    background: linear-gradient(135deg, rgba(59, 130, 246, 0.05) 0%, rgba(37, 99, 235, 0.05) 100%);
+    border-color: rgba(59, 130, 246, 0.3);
+}
+
+@keyframes slideDown {
+    from {
+        opacity: 0;
+        transform: translateY(-10px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+#red_boss_input h4, #blue_boss_input h4 {
+    margin: 0 0 12px 0;
+    font-size: 15px;
+    font-weight: 600;
+}
+
+#red_boss_input h4 {
+    color: #dc2626;
+}
+
+#blue_boss_input h4 {
+    color: #2563eb;
+}
+
+/* Human Player Indicator */
+.human-indicator {
+    display: inline-block;
+    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
+    color: white;
+    padding: 4px 10px;
+    border-radius: 12px;
+    font-size: 11px;
+    font-weight: 600;
+    margin-left: 8px;
+    box-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);
+}
+
+/* Player row updates */
+.player-row {
+    display: flex;
+    align-items: center;
+    padding: 12px;
+    background: rgba(255, 255, 255, 0.5);
+    border-radius: 8px;
+    margin-bottom: 8px;
+    transition: all 0.2s ease;
+    gap: 12px;
+}
+
+.player-row:hover {
+    background: rgba(255, 255, 255, 0.8);
+    transform: translateX(4px);
+}
+
+.player-details {
+    flex: 1;
+    min-width: 0;
+}
+
+.player-meta {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 6px;
+    margin-top: 4px;
+}
+
+/* Game Content Area */
+#game_content {
+    animation: fadeIn 0.5s ease-in;
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(20px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+/* Teams Accordion */
+#game_setup_row{
+    display: flex;
+    flex-direction: column;
+}
+
+#teams_accordion {
+    margin-bottom: 20px;
+    border: 2px solid #17a2b8;
+    border-radius: 12px;
+    background: rgb(42, 46, 55) !important;
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+}
+
+/* Game Row - Horizontal Layout */
+#game_row {
+    display: flex;
+    gap: 20px;
+    align-items: stretch;
+    margin-top: 20px;
+    height: 70vh;
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+    flex-direction: row;
+}
+
+/* Board Column - FIXED IMAGE DISPLAY */
+#board_column {
+    background: rgb(42, 46, 55) !important;
+    border-radius: 12px;
+    padding: 20px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    min-width: 0;
+    overflow: hidden;
+    flex: 0 0 calc(39% - 10px);
+    display: flex;
+    flex-direction: column; /* Changed from row to column */
+    height: 100%;
+}
+
+#board_header {
+    margin: 0 0 15px 0;
+    color: #667eea;
+    border-bottom: 2px solid #667eea;
+    padding-bottom: 10px;
+    flex-shrink: 0;
+}
+
+#game_board_img {
+    border-radius: 8px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+    width: 100% !important;
+    height: 85% !important;
+    object-fit: contain !important;
+    display: flex !important;
+    align-items: center !important; /* Center vertically */
+    justify-content: center !important; /* Center horizontally */
+    margin: 0 !important;
+    max-width: 100% !important;
+    max-height: 100% !important;
+    flex-grow: 1 !important;
+    overflow: hidden !important;
+}
+
+#game_board_img img {
+    max-width: 100% !important;
+    max-height: 100% !important;
+    width: auto !important; /* Let it size naturally */
+    height: auto !important; /* Let it size naturally */
+    object-fit: contain !important;
+    display: block !important;
+}
+
+/* Chat Column */
+#chat_column {
+    background: rgb(42, 46, 55) !important;
+    border-radius: 12px;
+    padding: 20px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    flex: 0 0 calc(59% - 10px);
+    min-width: 0;
+}
+
+#chat_header {
+    margin: 0 0 15px 0;
+    color: #764ba2;
+    border-bottom: 2px solid #764ba2;
+    padding-bottom: 10px;
+    flex-shrink: 0;
+    flex-grow: 0;
+}
+
+#input_game_section {
+    display: flex;
+    flex-flow: row;
+    place-content: center;
+    align-items: center;
+    flex-shrink: 1;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-content: center;
+    justify-content: center;
+    flex-grow: 0 !important;
+}
+
+.game-chatbot {
+    border-radius: 8px;
+    border: 2px solid #e9ecef;
+}
+
+/* ==================== FIREWORKS ==================== */
+
+/* Fireworks container */
+.firework {
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    left: 0;
+    pointer-events: none;
+    z-index: 9999;
+}
+
+/* Firework particles */
+.firework::before,
+.firework::after {
+    content: '';
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    border-radius: 50%;
+}
+
+.firework::before {
+    left: 30%;
+    top: 60%;
+    animation-delay: 0s;
+}
+
+.firework::after {
+    left: 70%;
+    top: 50%;
+    animation-delay: 1s;
+}
+
+/* Red team fireworks */
+.message_red.firework::before,
+.message_red.firework::after {
+    animation: firework-red 2s ease-in-out infinite;
+}
+
+/* Blue team fireworks */
+.message_blue.firework::before,
+.message_blue.firework::after {
+    animation: firework-blue 2s ease-in-out infinite;
+}
+
+
+/* INTENSE RED FIREWORK */
+@keyframes firework-red {
+    0% {
+        opacity: 1;
+        box-shadow:
+            0 0 0 0px #ff0000,
+            0 0 0 0px #ff0000,
+            0 0 0 0px #ff0000,
+            0 0 0 0px #ff0000;
+        transform: translate(0, 0) scale(1);
+    }
+    25% { opacity: 1; }
+    100% {
+        opacity: 0;
+        box-shadow:
+            -120px -80px 0 3px #ff0000,
+            -80px -120px 0 3px #b00000,
+            80px -120px 0 3px #ff4d4d,
+            120px -80px 0 3px #ff0000,
+            120px 80px 0 3px #b00000,
+            80px 120px 0 3px #ff4d4d,
+            -80px 120px 0 3px #ff0000,
+            -120px 80px 0 3px #b00000,
+            -100px 0 0 3px #ff4d4d,
+            100px 0 0 3px #ff0000,
+            0 -100px 0 3px #b00000,
+            0 100px 0 3px #ff4d4d,
+            -70px -70px 0 3px #ff0000,
+            70px -70px 0 3px #b00000,
+            -70px 70px 0 3px #ff4d4d,
+            70px 70px 0 3px #ff0000,
+            -90px -40px 0 2px #ffe066,
+            90px -40px 0 2px #ff0000,
+            -90px 40px 0 2px #b00000,
+            90px 40px 0 2px #ff4d4d,
+            -40px -90px 0 2px #ff0000,
+            40px -90px 0 2px #ffe066,
+            -40px 90px 0 2px #b00000,
+            40px 90px 0 2px #ff4d4d,
+            -110px -20px 0 2px #ff0000,
+            110px -20px 0 2px #b00000,
+            -110px 20px 0 2px #ff4d4d,
+            110px 20px 0 2px #ff0000,
+            -60px -100px 0 2px #ffe066,
+            60px -100px 0 2px #b00000,
+            -60px 100px 0 2px #ff4d4d,
+            60px 100px 0 2px #ff0000,
+            -130px 0 0 2px #b00000,
+            130px 0 0 2px #ff4d4d,
+            0 -130px 0 2px #ff0000,
+            0 130px 0 2px #ffe066,
+            -100px -60px 0 1px #b00000,
+            100px -60px 0 1px #ff0000,
+            -100px 60px 0 1px #ff4d4d,
+            100px 60px 0 1px #ff0000,
+            -50px -110px 0 1px #b00000,
+            50px -110px 0 1px #ffe066,
+            -50px 110px 0 1px #ff4d4d,
+            50px 110px 0 1px #ff0000,
+            -85px -85px 0 1px #b00000,
+            85px -85px 0 1px #ff0000,
+            -85px 85px 0 1px #ff4d4d,
+            85px 85px 0 1px #ffe066;
+        transform: translate(0, -20px) scale(1.2);
+    }
+}
+
+
+/* INTENSE BLUE FIREWORK */
+@keyframes firework-blue {
+    0% {
+        opacity: 1;
+        box-shadow:
+            0 0 0 0px #0066ff,
+            0 0 0 0px #0066ff,
+            0 0 0 0px #0066ff,
+            0 0 0 0px #0066ff;
+        transform: translate(0, 0) scale(1);
+    }
+    25% { opacity: 1; }
+    100% {
+        opacity: 0;
+        box-shadow:
+            -120px -80px 0 3px #0066ff,
+            -80px -120px 0 3px #003399,
+            80px -120px 0 3px #4da6ff,
+            120px -80px 0 3px #0066ff,
+            120px 80px 0 3px #003399,
+            80px 120px 0 3px #4da6ff,
+            -80px 120px 0 3px #0066ff,
+            -120px 80px 0 3px #003399,
+            -100px 0 0 3px #4da6ff,
+            100px 0 0 3px #0066ff,
+            0 -100px 0 3px #003399,
+            0 100px 0 3px #4da6ff,
+            -70px -70px 0 3px #0066ff,
+            70px -70px 0 3px #003399,
+            -70px 70px 0 3px #4da6ff,
+            70px 70px 0 3px #0066ff,
+            -90px -40px 0 2px #ffe066,
+            90px -40px 0 2px #0066ff,
+            -90px 40px 0 2px #003399,
+            90px 40px 0 2px #4da6ff,
+            -40px -90px 0 2px #0066ff,
+            40px -90px 0 2px #ffe066,
+            -40px 90px 0 2px #003399,
+            40px 90px 0 2px #4da6ff,
+            -110px -20px 0 2px #0066ff,
+            110px -20px 0 2px #003399,
+            -110px 20px 0 2px #4da6ff,
+            110px 20px 0 2px #0066ff,
+            -60px -100px 0 2px #ffe066,
+            60px -100px 0 2px #003399,
+            -60px 100px 0 2px #4da6ff,
+            60px 100px 0 2px #0066ff,
+            -130px 0 0 2px #003399,
+            130px 0 0 2px #4da6ff,
+            0 -130px 0 2px #0066ff,
+            0 130px 0 2px #ffe066,
+            -100px -60px 0 1px #003399,
+            100px -60px 0 1px #0066ff,
+            -100px 60px 0 1px #4da6ff,
+            100px 60px 0 1px #0066ff,
+            -50px -110px 0 1px #003399,
+            50px -110px 0 1px #ffe066,
+            -50px 110px 0 1px #4da6ff,
+            50px 110px 0 1px #0066ff,
+            -85px -85px 0 1px #003399,
+            85px -85px 0 1px #0066ff,
+            -85px 85px 0 1px #4da6ff,
+            85px 85px 0 1px #ffe066;
+        transform: translate(0, -20px) scale(1.2);
+    }
+}
+
+
+/* ==================== TEAMS STYLING ==================== */
+
+.teams-container {
+    display: flex;
+    gap: 20px;
+    align-items: stretch;
+    padding: 20px;
+    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
+    border-radius: 12px;
+}
+
+.vs-divider {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-width: 60px;
+}
+
+.vs-text {
+    font-size: 32px;
+    font-weight: bold;
+    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
+    animation: pulse 2s ease-in-out infinite;
+}
+
+@keyframes pulse {
+    0%, 100% { transform: scale(1); }
+    50% { transform: scale(1.1); }
+}
+
+.team-card {
+    flex: 1;
+    background: white;
+    border-radius: 12px;
+    overflow: hidden;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.team-card:hover {
+    transform: translateY(-4px);
+    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15), 0 4px 8px rgba(0, 0, 0, 0.1);
+}
+
+.team-header {
+    padding: 16px 20px;
+    color: white;
+    font-weight: bold;
+    position: relative;
+}
+
+.team-red .team-header {
+    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
+}
+
+.team-blue .team-header {
+    background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
+}
+
+.team-header h3 {
+    margin: 0;
+    font-size: 18px;
+    letter-spacing: 0.5px;
+}
+
+.starting-badge {
+    margin-top: 8px;
+    padding: 6px 12px;
+    background: rgba(255, 255, 255, 0.3);
+    border: 2px solid rgba(255, 255, 255, 0.6);
+    border-radius: 6px;
+    font-size: 12px;
+    font-weight: bold;
+    letter-spacing: 0.5px;
+    text-align: center;
+    animation: glow 2s ease-in-out infinite;
+}
+
+@keyframes glow {
+    0%, 100% {
+        box-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
+    }
+    50% {
+        box-shadow: 0 0 20px rgba(255, 255, 255, 0.8);
+    }
+}
+
+.team-body {
+    padding: 16px;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+}
+
+.player-avatar {
+    width: 48px;
+    height: 48px;
+    border-radius: 50%;
+    object-fit: cover;
+    border: 3px solid white;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    flex-shrink: 0;
+}
+
+.player-name {
+    font-weight: 600;
+    font-size: 14px;
+    color: #212529;
+    margin-bottom: 4px;
+}
+
+.role-badge {
+    display: inline-block;
+    padding: 2px 8px;
+    border-radius: 4px;
+    font-size: 10px;
+    font-weight: 600;
+    letter-spacing: 0.5px;
+    text-transform: uppercase;
+}
+
+.role-boss {
+    background: #ffc107;
+    color: #000;
+}
+
+.role-captain {
+    background: #17a2b8;
+    color: white;
+}
+
+.role-player {
+    background: #6c757d;
+    color: white;
+}
+
+.player-model {
+    font-size: 11px;
+    color: #6c757d;
+    font-family: monospace;
+}
+
+/* Team Selection Row */
+#team_selection_row {
+    padding: 24px;
+    background: linear-gradient(135deg, #dc3545 0%, #ff6b6b 40%, #0d6efd 100%);
+    border-radius: 12px;
+    margin-bottom: 20px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+    margin-left: 1%;
+    margin-right: 1%;
+    width: 98%;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;          /* Allow wrapping to next line */
+    align-items: center;
+    justify-content: center;  /* Optional: center horizontally */
+    gap: 16px;  
+}
+
+#api_keys_section{
+    margin-left: 1%;
+    width: 98%;
+    margin-right: 1%;
+    padding: 1%;
+}
+
+#new_game_btn {
+    flex-basis: 100%;         /* Force the button to occupy a full line */
+    text-align: center;
+    display: flex;
+    justify-content: center;
+    margin-top: 20px !important;
+}
+
+.wrap:hover, #blue_team_dropdown .wrap:hover {
+    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
+}
+
+#red_team_dropdown .wrap:hover {
+    border-color: #dc3545;
+    box-shadow: 0 8px 16px rgba(220, 53, 69, 0.3);
+}
+
+#blue_team_dropdown .wrap:hover {
+    border-color: #0d6efd;
+    box-shadow: 0 8px 16px rgba(13, 110, 253, 0.3);
+}
+
+#red_team_dropdown input, #blue_team_dropdown input {
+    background: linear-gradient(to bottom, #ffffff 0%, #f8f9fa 100%);
+    border: none;
+    padding: 14px 16px;
+    font-size: 15px;
+    font-weight: 600;
+    border-radius: 8px;
+    transition: all 0.2s ease;
+}
+
+#red_team_dropdown input:focus, #blue_team_dropdown input:focus {
+    background: white;
+    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
+}
+
+#red_team_dropdown input {
+    color: #dc3545;
+}
+
+#blue_team_dropdown input {
+    color: #0d6efd;
+}
+
+#red_team_dropdown .icon, #blue_team_dropdown .icon {
+    transition: transform 0.3s ease;
+}
+
+/* Boss Action Buttons */
+#red_boss_btn, #blue_boss_btn {
+    flex: 1;
+    padding: 12px 20px;
+    font-weight: 600;
+    border-radius: 8px;
+    transition: transform 0.2s ease, box-shadow 0.2s ease;
+    border: none;
+    font-size: 16px;
+    display: none;
+}
+
+#red_boss_btn:hover, #blue_boss_btn:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
+}
+
+#red_boss_btn {
+    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
+    color: white;
+}
+
+#red_boss_btn:hover {
+    background: linear-gradient(135deg, #c82333 0%, #bd2130 100%);
+}
+
+#blue_boss_btn {
+    background: linear-gradient(135deg, #0d6efd 0%, #0b5ed7 100%);
+    color: white;
+}
+
+#blue_boss_btn:hover {
+    background: linear-gradient(135deg, #0b5ed7 0%, #0a58ca 100%);
+}
+
+/* Boss Name Input */
+#red_boss_name_input, #blue_boss_name_input {
+    background: #f8f9fa;
+    border: 2px solid #e9ecef;
+    border-radius: 8px;
+    padding: 10px 12px;
+    font-size: 14px;
+    transition: border-color 0.2s ease, background 0.2s ease;
+}
+
+#red_boss_name_input:focus {
+    border-color: #dc3545;
+    background: white;
+    outline: none;
+}
+
+#blue_boss_name_input:focus {
+    border-color: #0d6efd;
+    background: white;
+    outline: none;
+}
+
+/* Save Buttons */
+#save_red_boss_btn, #save_blue_boss_btn {
+    background: #28a745;
+    color: white;
+    padding: 8px 16px;
+    border-radius: 6px;
+    font-weight: 600;
+    border: none;
+    transition: background 0.2s ease, transform 0.2s ease;
+    font-size: 16px;
+}
+
+#save_red_boss_btn:hover, #save_blue_boss_btn:hover {
+    background: #218838;
+    transform: translateY(-1px);
+}
+
+/* Cancel Buttons */
+#cancel_red_boss_btn, #cancel_blue_boss_btn {
+    background: #6c757d;
+    color: white;
+    padding: 8px 16px;
+    border-radius: 6px;
+    font-weight: 600;
+    border: none;
+    transition: background 0.2s ease, transform 0.2s ease;
+}
+
+#cancel_red_boss_btn:hover, #cancel_blue_boss_btn:hover {
+    background: #5a6268;
+    transform: translateY(-1px);
+}
+
+/* ==================== MESSAGE FEED STYLING ==================== */
+
+#message_feed_container {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    min-height: 400px;
+    flex-grow: 1;
+    min-height: 0;
+}
+
+#message_feed {
+    flex: 1;
+    overflow-y: auto;
+    padding-right: 8px;
+}
+
+.message_card {
+    background: white;
+    border-radius: 12px;
+    padding: 20px;
+    margin-bottom: 16px;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+    transition: transform 0.2s, box-shadow 0.2s;
+    border-left: 4px solid #e0e0e0;
+}
+
+.message_card:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+}
+
+.message_header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 12px;
+    gap: 12px;
+}
+
+.message_avatar {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    object-fit: cover;
+    border: 2px solid #e0e0e0;
+}
+
+.message_header_text {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+}
+
+.message_sender {
+    font-size: 14px;
+    font-weight: 700;
+    color: #262626;
+}
+
+.message_title {
+    font-size: 12px;
+    color: #8e8e8e;
+    font-weight: 400;
+}
+
+.message_icon {
+    font-size: 20px;
+    margin-left: auto;
+}
+
+.message_content {
+    color: #262626;
+    line-height: 1.6;
+    font-size: 14px;
+    white-space: pre-wrap;
+    padding-left: 52px;
+}
+
+.message_content li,
+.message_content code {
+    color: black;
+}
+
+.message_thinking {
+    border-left-color: #9b59b6;
+    background: linear-gradient(to right, #f8f4fc, white);
+}
+
+.message_tool {
+    border-left-color: #3498db;
+    background: linear-gradient(to right, #f0f8ff, white);
+}
+
+.message_red {
+    border-left-color: #e74c3c;
+}
+
+.message_blue {
+    border-left-color: #3498db;
+}
+
+.message_boss {
+    background: linear-gradient(to right, #fff5f5, white);
+}
+
+.message_captain {
+    background: linear-gradient(to right, #fffef5, white);
+}
+
+.message_agent {
+    background: linear-gradient(to right, #f5fff5, white);
+}
+
+.message_judge {
+    border-left-color: #95a5a6;
+    background: linear-gradient(to right, #f8f9fa, white);
+}
+
+.message_red .message_avatar {
+    border-color: #e74c3c;
+}
+
+.message_blue .message_avatar {
+    border-color: #3498db;
+}
+
+.message_judge .message_avatar {
+    border-color: #95a5a6;
+}
+
+/* Scrollbar styling */
+#message_feed::-webkit-scrollbar {
+    width: 8px;
+}
+
+#message_feed::-webkit-scrollbar-track {
+    background: #f1f1f1;
+    border-radius: 4px;
+}
+
+#message_feed::-webkit-scrollbar-thumb {
+    background: #888;
+    border-radius: 4px;
+}
+
+#message_feed::-webkit-scrollbar-thumb:hover {
+    background: #555;
+}
+
+/* ==================== TABLE ==================== */
+
+.provider-table {
+    width: 100%;
+    border-collapse: collapse;
+}
+
+.provider-table th, .provider-table td {
+    border: 1px solid #ddd;
+    padding: 8px;
+}
+
+.provider-table th {
+    font-size: 26px;
+}
+
+.provider-table td {
+    font-size: 18px;
+}
+
+.logo_cell {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-content: center;
+    align-items: center;
+}
+
+.provider-logo {
+    height: 45px;
+    vertical-align: middle;
+    margin-right: 6px;
+}
+
+
+
+/* ==================== RESPONSIVE DESIGN ==================== */
+
+@media (max-width: 1200px) {
+    #game_row {
+        flex-direction: column;
+        min-height: auto;
+    }
+
+    #board_column {
+        min-height: auto;
+        max-height: 500px;
+    }
+
+    #chat_column {
+        min-height: 500px;
+    }
+    
+    .header-content h1 {
+        font-size: 1.6em;
+    }
+    
+    .rules-carousel-container {
+        padding: 0 50px;
+    }
+}
+
+@media (max-width: 768px) {
+
+    nav.tabs {
+        padding: 0.5rem 1rem !important;
+        flex-wrap: wrap;
+    }
+    
+    nav.tabs::before {
+        font-size: 1.2rem;
+        margin-right: 1rem;
+        padding-right: 1rem;
+        width: 100%;
+        border-right: none;
+        border-bottom: 2px solid rgba(255, 255, 255, 0.3);
+        padding-bottom: 0.5rem;
+        margin-bottom: 0.5rem;
+    }
+    
+    nav.tabs button {
+        padding: 0.4rem 1rem !important;
+        font-size: 0.9rem !important;
+        margin: 0.2rem !important;
+    }
+
+    .teams-container {
+        flex-direction: column;
+    }
+
+    .vs-divider {
+        min-width: auto;
+        padding: 10px 0;
+    }
+
+    .vs-text {
+        transform: rotate(90deg);
+    }
+
+    .header-content h1 {
+        font-size: 1.5em;
+    }
+    
+    .header-icon {
+        font-size: 1.8em;
+    }
+
+    #start_game_btn {
+        font-size: 1.1em !important;
+        padding: 14px 28px !important;
+    }
+    
+    .rules-intro h2 {
+        font-size: 1.5em;
+    }
+    
+    .rules-carousel-container {
+        padding: 0 45px;
+    }
+    
+    .carousel-btn {
+        width: 35px;
+        height: 35px;
+        font-size: 18px;
+    }
+    
+    #game_row {
+        gap: 15px;
+    }
+    
+    #board_column, #chat_column {
+        padding: 15px;
+    }
+    
+    #chat_column {
+        min-height: 450px;
+    }
+    
+    #message_feed_container {
+        min-height: 300px;
+    }
+    
+    .message_card {
+        padding: 15px;
+    }
+    
+    .message_content {
+        padding-left: 0;
+        margin-top: 8px;
+    }
+}
+
+@media (max-width: 480px) {
+    .header-content {
+        padding: 15px 10px;
+    }
+    
+    .header-content h1 {
+        font-size: 1.3em;
+    }
+    
+    .header-subtitle {
+        font-size: 0.85em;
+    }
+    
+    .rules-content {
+        padding: 15px 10px;
+    }
+    
+    .rules-intro {
+        padding: 15px 10px;
+    }
+    
+    .rules-carousel-container {
+        padding: 0 40px;
+    }
+    
+    .carousel-btn {
+        width: 30px;
+        height: 30px;
+        font-size: 16px;
+    }
+    
+    .carousel-btn-prev {
+        left: 5px;
+    }
+    
+    .carousel-btn-next {
+        right: 5px;
+    }
+    
+    .rule-card {
+        padding: 16px;
+    }
+    
+    .rule-card-header h3 {
+        font-size: 1.2em;
+    }
+    
+    #team_selection_row {
+        padding: 15px;
+    }
+    
+    #board_column, #chat_column {
+        padding: 12px;
+    }
+    
+    #chat_column {
+        min-height: 400px;
+    }
+    
+    #message_feed_container {
+        min-height: 250px;
+    }
+    
+    .message_card {
+        padding: 12px;
+        margin-bottom: 12px;
+    }
+    
+    .message_avatar {
+        width: 32px;
+        height: 32px;
+    }
+    
+    .message_sender {
+        font-size: 13px;
+    }
+    
+    .message_title {
+        font-size: 11px;
+    }
+    
+    .message_content {
+        font-size: 13px;
+    }
+}
+"""
+
+# Custom CSS for Instagram-like feed
+final_css = navbar_css + stats_css + css + """
+
+#message_feed_container {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden; /* prevent scroll outside */
+}
+
+/* The feed itself is scrollable inside the container */
+#message_feed {
+    flex: 1;
+    overflow-y: auto;
+    height: 100%;
+}
+
+/* Optional: smooth animation */
+#message_feed_container, #message_feed {
+    transition: height 0.2s ease;
+}
+
+.message_card {
+    background: white;
+    border-radius: 12px;
+    padding: 20px;
+    margin-bottom: 16px;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+    transition: transform 0.2s, box-shadow 0.2s;
+    border-left: 4px solid #e0e0e0;
+}
+
+.message_card:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+}
+
+.message_header {
+    display: flex;
+    align-items: center;
+    margin-bottom: 12px;
+    gap: 12px;
+}
+
+.message_avatar {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    object-fit: cover;
+    border: 2px solid #e0e0e0;
+}
+
+.message_header_text {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+}
+
+.message_sender {
+    font-size: 14px;
+    font-weight: 700;
+    color: #262626;
+}
+
+.message_title {
+    font-size: 12px;
+    color: #8e8e8e;
+    font-weight: 400;
+}
+
+.message_icon {
+    font-size: 20px;
+    margin-left: auto;
+}
+
+.message_content {
+    color: #262626;
+    line-height: 1.6;
+    font-size: 14px;
+    white-space: pre-wrap;
+    padding-left: 52px;
+}
+
+.message_thinking {
+    border-left-color: #9b59b6;
+    background: linear-gradient(to right, #f8f4fc, white);
+}
+
+.message_tool {
+    border-left-color: #3498db;
+    background: linear-gradient(to right, #f0f8ff, white);
+}
+
+.message_red {
+    border-left-color: #e74c3c;
+}
+
+.message_blue {
+    border-left-color: #3498db;
+}
+
+.message_boss {
+    background: linear-gradient(to right, #fff5f5, white);
+}
+
+.message_captain {
+    background: linear-gradient(to right, #fffef5, white);
+}
+
+.message_agent {
+    background: linear-gradient(to right, #f5fff5, white);
+}
+
+.message_judge {
+    border-left-color: #95a5a6;
+    background: linear-gradient(to right, #f8f9fa, white);
+}
+
+.message_red .message_avatar {
+    border-color: #e74c3c;
+}
+
+.message_blue .message_avatar {
+    border-color: #3498db;
+}
+
+.message_judge .message_avatar {
+    border-color: #95a5a6;
+}
+
+/* Scrollbar styling */
+#message_feed::-webkit-scrollbar {
+    width: 8px;
+}
+
+#message_feed::-webkit-scrollbar-track {
+    background: #f1f1f1;
+    border-radius: 4px;
+}
+
+#message_feed::-webkit-scrollbar-thumb {
+    background: #888;
+    border-radius: 4px;
+}
+
+#message_feed::-webkit-scrollbar-thumb:hover {
+    background: #555;
+}
+"""

support/supportLLM.py

@@ -0,0 +1,264 @@
+import re
+
+from bs4 import BeautifulSoup
+from pydantic import BaseModel, Field
+from typing import Optional
+
+
+def clean_html_from_json(d):
+    if isinstance(d, dict):
+        return {k: clean_html_from_json(v) for k, v in d.items()}
+    elif isinstance(d, list):
+        return [clean_html_from_json(item) for item in d]
+    elif isinstance(d, str):
+        return BeautifulSoup(d, "html.parser").get_text(separator=" ", strip=True)
+    else:
+        return d
+
+
+def format_docs(docs):
+    all_chunks = "\n\n".join(doc.page_content for doc in docs)
+
+    # Match the custom [END OF PAGE: i] markers
+    pattern = r'(.*?)\[END OF PAGE: (\d+)\]'
+    matches = re.findall(pattern, all_chunks, re.DOTALL)
+
+    page_map = {}
+    for content, page_number_str in matches:
+        page_number = int(page_number_str)
+        page_map[page_number] = content.strip()  # Overwrites if page is duplicated
+
+    # Sort by page number and reassemble the final document
+    sorted_chunks = [page_map[page] for page in sorted(page_map.keys())]
+    final_context = "\n\n".join(sorted_chunks)
+
+    return final_context
+    
+
+# model_dict = {
+#     "llama3.3": "llama3.3:70b-instruct-q8_0",
+#     "deepseek": "deepseek-r1:70b-llama-distill-q8_0",
+#     "phi4": "phi4:14b-q8_0",
+#     "gemma": "gemma2:27b-instruct-q8_0",  # ollama pull gemma2:27b-instruct-q8_0,
+#     "qwen": "hf.co/bartowski/Qwen2.5-14B-Instruct-1M-GGUF:Q8_0",
+# }
+
+system_prompt_templates = {
+    "llama3.3": """
+        <|begin_of_text|>
+        <|start_header_id|>system<|end_header_id|>
+        {system_prompt}
+    """,
+    "deepseek": """
+        <|begin▁of▁sentence|>
+        {system_prompt}
+    """,
+    "phi4": """
+        <|im_start|>system<|im_sep|>
+        {system_prompt}
+    """,
+    "gemma": """
+        <start_of_turn>model
+        {system_prompt}
+    """,
+    "qwen": """
+        <|im_start|>
+        system
+        {system_prompt}
+    """,
+    "gpt-4o": "{system_prompt}",
+    "openai": "{system_prompt}",
+}
+
+user_prompt_templates = {
+    "llama3.3": """
+        <|eot_id|>
+        <|start_header_id|>user<|end_header_id|>
+        {user_prompt}
+        <|eot_id|>
+        <|start_header_id|>assistant<|end_header_id|>
+    """,
+    "deepseek": """
+        <|User|>
+        {user_prompt}
+        <|Assistant|>
+    """,
+    "phi4": """
+        <|im_end|>
+        <|im_start|>user<|im_sep|>
+        {user_prompt}
+        <|im_start|>assistant<|im_sep|>
+    """,
+    "gemma": """
+        <end_of_turn>
+        <start_of_turn>user
+        {user_prompt}<end_of_turn>
+        <start_of_turn>model
+    """,
+    "qwen": """
+        <|im_end|>
+        <|im_start|>user
+        {user_prompt}<|im_end|>
+        <|im_start|>assistant
+    """,
+    "gpt-4o": "{user_prompt}",
+    "openai": "{user_prompt}",
+}
+
+
+orchestrator_system_prompt = """
+You are the Oracle — a highly intelligent orchestrator that determines the correct sequence of actions based on the user's question and the available tools.
+
+Your role is to provide to the user a final answer which is clear and complete as most as possible.
+You are the leader of a team, composed of:
+
+# Research Agent: The role of the research agent is to provide a complete report about all the important pieces of information that have been retrieved during the findind of information
+    - The Research Agent can: 
+        Download information about countries
+        Check which information have been already collected
+        Retrieve information in the documents
+
+# Answering Agent: The role of the Answering Agent is to provide the final answer to the user.
+    - The Answering Agent can: 
+        Merge together all the information and provide to the user a final answer
+        Enrich the final answer using python code for operations (if needed: for example to create a plot, math operations or whatever.)
+
+
+## IMPORTANT BEHAVIOR RULES:
+
+- **Explain Reasoning**: Before calling any tool, explain *why* you are using it.
+- **Respect Language**: Always respond in the **same language** as the user's question or in the language the user explicitly requests, regardless of this prompt being in English.
+
+## SUMMARY:
+Be deliberate. Always justify your decisions. Choose tools wisely based on the user’s query. Respect language. Be professional.
+"""
+
+research_system_prompt = """
+You are the ResearchAgent — a highly intelligent researcher that determines the correct sequence of actions based on the user's question and the available tools.
+
+Your task is to decide how to use the tools provided in order to obtain all the information needed to answer the users question professionally and accurately.
+It's EXTREMELY important that you use the more updated data to answer your question. So you have to retrieve information from updatated sources, even when you think you 
+have all the information to answer the question.
+
+## TOOL USAGE STRATEGY:
+
+1. **Check Existing Data**  
+   First, use the `WhichCountryInformationIHaveTool` to check if data about the requested country is already available.
+
+2. **Download if Missing**  
+   If the data is not yet available for the requested country, use the `DownloadCountryInformationTool` by specifying both `country_code` (ISO Alpha-3) and `country_name`.
+
+3. **Retrieve Relevant Information**  
+   Once the data is available, use the `RetrieverTool` with a well-formed `query` and the correct `country_code` to extract the information relevant to the user's request.
+   Even if you think you know the answer, user the RetrieverTool to obtain the most updated information.
+
+4. **Return Final Answer**  
+   At the end, after gathering all the necessary information, you MUST pass the information to the OrchestratorAgent.
+
+## IMPORTANT BEHAVIOR RULES:
+
+- **Explain Reasoning**: Before calling any tool, explain *why* you are using it.
+- **Respect Language**: Always respond in the **same language** as the user's question or in the language the user explicitly requests, regardless of this prompt being in English.
+
+## SUMMARY:
+
+Be deliberate. Always justify your decisions. Choose tools wisely based on the user’s query. Respect language. Be professional.
+"""
+
+answering_agent_system_prompt = """
+You are **Dr. Voyage**, a warm, knowledgeable, and attentive travel medicine specialist.
+Your role is to provide patients with expert medical advice tailored to their international travel plans. 
+You will receive information from the ResearchAgent.
+
+ Your responsibilities are:
+
+ 1. **Interpret the data** thoroughly.
+ 2. **Highlight key medical considerations** provided in the Research Report.
+ 3. Respond in the voice of a **compassionate, professional doctor**, using clear, empathetic language while being direct and factual.
+ 4. If you have to display an image, use {path_image} as a placeholder, do not write any base64.
+
+ ## TOOL USAGE STRATEGY:
+
+1. **Check Existing Data**  
+   If you don't have all the information you need to answer the user question, you can ask the ResearchAgent for additional information.
+   Otherwise, provide a final answer.
+ 
+ 🔍 **Your goal** is to ensure each traveler is medically safe and well-prepared for their journey.
+
+ # VERY IMPORTANT:
+- You MUST always respond in the **same language** as the user question, or the language requested by the user.
+- Even if this instruction is given in English, your answer must match the user question language, or the language requested by the user.
+"""
+
+rag_sections_system_prompt = """You are an expert in answering user questions based on a provided context and extracting structured data from technical reports.
+
+Your primary goal is to extract precise answers strictly from the given context while adhering to the schema specified by the user.
+
+- If the information required to answer the question is explicitly present in the context, provide a direct and accurate response.
+- If the requested schema is provided, ensure that the extracted data follows it exactly.
+- Do not include any assumptions, external knowledge, or fabricated information.
+"""
+
+# rag_system_prompt = """You are an expert in answering user questions based on a provided context.
+
+# Your primary goal is to extract precise answers strictly from the given context while adhering to the schema specified by the user.
+
+# - If the information required to answer the question is explicitly present in the context, provide a direct and accurate response.
+# - If the requested schema is provided, ensure that the extracted data follows it exactly.
+# - Do not include any assumptions, external knowledge, or fabricated information.
+# - Answer using the same language of the user, or the language requested by the user.
+
+# # VERY IMPORTANT:
+# - You MUST always respond in the **same language** as the user question, or the language requested by the user.
+# - Even if this instruction is given in English, your answer must match the user question language, or the language requested by the user.
+
+# If the answer is not found in the context, clearly state that the information is unavailable."""
+
+rag_system_prompt = """
+
+ You are **Dr. Voyage**, a warm, knowledgeable, and attentive travel medicine specialist. Your role is to provide patients with expert medical advice tailored to their international travel plans. Each patient will give you:
+
+ * Their **travel destination(s)**
+ * Specific **health concerns or requests** (e.g., required vaccinations, local diseases, medication considerations, travel advisories)
+ * Contextual **information about the country’s health situation**, which you must read carefully
+
+ Your responsibilities are:
+
+ 1. **Interpret the country health data** thoroughly.
+ 2. **Highlight key medical considerations**, such as:
+
+    * Required or recommended **vaccinations**
+    * Presence of **infectious diseases** (e.g., malaria, dengue, yellow fever)
+    * Risks from **food, water, insects, or climate**
+    * **Medication regulations** (e.g., banned substances)
+    * Accessibility of **healthcare services** at the destination
+ 3. Respond in the voice of a **compassionate, professional doctor**, using clear, empathetic language while being direct and factual.
+ 4. Provide a **summary checklist** of what the patient should do before traveling.
+
+ If information is missing, **ask clarifying questions**. If something is especially urgent or dangerous, **flag it clearly** in your response.
+
+ 🔍 **Your goal** is to ensure each traveler is medically safe and well-prepared for their journey.
+
+ # VERY IMPORTANT:
+- You MUST always respond in the **same language** as the user question, or the language requested by the user.
+- Even if this instruction is given in English, your answer must match the user question language, or the language requested by the user.
+
+"""
+
+default_template = """
+    {system_prompt}
+    {user_prompt}
+"""
+
+
+
+class OutputScript(BaseModel):
+    """
+    The output must strictly follow this structure. The only allowed output is valid Python code.
+    No explanations, comments, examples, or additional content are permitted.
+    """
+    python_script: Optional[str] = Field(
+        default=None,
+        description="The Python script to generate. Only include the executable Python code—no output examples, explanations, or comments."
+    )
+    

support/tools/boss_agent_tools.py

@@ -0,0 +1,24 @@
+# Fake tool call generator when human user is playing
+
+def create_fake_tool_call(clue: str, clue_number: int):
+    from langchain_core.messages import AIMessage
+    from uuid import uuid4
+    """Creates a fake AIMessage that mimics an LLM tool call"""
+    tool_call_id = str(uuid4())
+
+    fake_message = AIMessage(
+        content="",
+        tool_calls=[
+            {
+                "name": "ChooseWord",
+                "args": {
+                    "clue": clue,
+                    "clue_number": clue_number
+                },
+                "id": tool_call_id,
+                "type": "tool_call"
+            }
+        ]
+    )
+
+    return fake_message

support/tools/general.py

@@ -0,0 +1,19 @@
+import json
+
+def convert_to_string(input_var):
+    try:
+        if isinstance(input_var, str):
+            converted_input = input_var
+        elif isinstance(input_var, (dict, list)):
+            converted_input = json.dumps(
+                input_var,
+                ensure_ascii=False,
+                sort_keys=True,
+                indent=2
+            )
+        else:
+            converted_input = str(input_var)
+    except Exception as e:
+        converted_input = f"[Serialization Error: {e}] Raw: {repr(input_var)}"
+
+    return converted_input

support/utils.py

@@ -0,0 +1,569 @@
+import io
+import markdown
+import matplotlib.pyplot as plt
+import matplotlib.patches as mpatches
+import regex
+
+from PIL import Image
+
+
+def display_model_name(model_name):
+    """Format model name for display"""
+    model_map = {
+        "gpt-5": "GPT-5",
+        "gpt-5-mini": "GPT-5 Mini",
+        "gpt-5-nano": "GPT-5 Nano",
+        "gpt-4.1-nano": "GPT-4.1 Nano",
+        "gemini-2.5-pro": "Gemini 2.5 Pro",
+        "gemini-2.5-flash": "Gemini 2.5 Flash",
+        "gemini-2.0-flash-001": "Gemini 2.0 Flash",
+        "gemini-2.0-flash-lite-001": "Gemini 2.0 Flash Lite",
+        "claude-sonnet-4-5-20250929": "Claude Sonnet 4.5",
+        "claude-3-7-sonnet-20250219": "Claude 3.7 Sonnet",
+        "claude-3-5-haiku-20241022": "Claude 3.5 Haiku",
+        "claude-3-haiku-20240307": "Claude 3 Haiku",
+        "deepseek-ai/DeepSeek-V3.1": "DeepSeek V3.1",
+        "deepseek-ai/DeepSeek-R1": "DeepSeek R1",
+        "Qwen/Qwen3-235B-A22B-Instruct-2507": "Qwen3 235B",
+        "openai/gpt-oss-120b": "GPT-OSS 120B",
+        "openai/gpt-oss-20b": "GPT-OSS 20B",
+        "moonshotai/Kimi-K2-Thinking": "Kimi K2 Thinking",
+        "human brain": "Human Brain"
+    }
+    return model_map.get(model_name, model_name)
+
+
+def format_messages_as_feed(messages, players, winner_and_score):
+    """Convert messages to Instagram-like feed HTML"""
+
+    if winner_and_score:
+        winner_team = winner_and_score[0]
+        fireworks_animation = f"""
+            <div class='firework message_{winner_team}'></div>
+        """
+    else:
+        fireworks_animation = ""
+
+    emoji_pattern = regex.compile(r'^\p{Emoji_Presentation}|\p{Emoji}\uFE0F')
+    html = '<div id="message_feed">'
+
+    # Initialize markdown with proper extensions
+    md = markdown.Markdown(extensions=[
+        'fenced_code',
+        'tables',
+        'nl2br',
+        'sane_lists'  # Better list handling
+    ])
+
+    # Create a mapping of sender identifiers to players
+    player_map = {}
+    for p in players:
+        if p.team and p.role:
+            key = f"{p.team}_{p.role}"
+            if key not in player_map:
+                player_map[key] = []
+            player_map[key].append(p)
+
+            if p.role == "player":
+                agent_num = len(player_map[key])
+                player_map[f"{p.team}_agent_{agent_num}"] = p
+
+    for msg in messages:
+        content = getattr(msg, 'content', '')
+
+        if not content or not str(content).strip():
+            continue
+
+        metadata = getattr(msg, 'metadata', {}) or {}
+        title = metadata.get('title', '') if isinstance(metadata, dict) else ''
+        sender = metadata.get('sender', '') if isinstance(metadata, dict) else ''
+
+        # Find the player for this sender
+        player = None
+        team = ''
+        avatar = 'assets/robot.png'
+        display_sender = ''
+
+        if sender:
+            sender_lower = sender.lower()
+
+            if sender_lower in player_map:
+                if isinstance(player_map[sender_lower], list):
+                    player = player_map[sender_lower][0]
+                else:
+                    player = player_map[sender_lower]
+
+            if player:
+                avatar = f"/gradio_api/file={player.avatar}"
+                display_sender = f"{player.name} ({player.role.title()})"
+                team = player.team
+            else:
+                display_sender = sender.replace('_', ' ').title()
+
+                if 'red' in sender_lower:
+                    team = 'red'
+                elif 'blue' in sender_lower:
+                    team = 'blue'
+                elif 'judge' in sender_lower:
+                    avatar = "/gradio_api/file=assets/avatars/judge.png"
+                    team = 'judge'
+
+        # Determine card class based on team and role
+        card_class = 'message_card'
+
+        if team == 'red':
+            card_class += ' message_red'
+        elif team == 'blue':
+            card_class += ' message_blue'
+        elif team == 'judge' or 'judge' in sender.lower():
+            card_class += ' message_judge'
+
+        if player and player.role:
+            if player.role == 'boss':
+                card_class += ' message_boss'
+            elif player.role == 'captain':
+                card_class += ' message_captain'
+            elif player.role == 'player':
+                card_class += ' message_agent'
+
+        if 'Thinking' in title:
+            card_class += ' message_thinking'
+        elif '🛠️' in title or 'tool' in title.lower() or 'Using' in content:
+            card_class += ' message_tool'
+
+        # Extract icon from title if present
+        icon = ''
+        clean_title = title
+        if title:
+            parts = title.split(' ', 1)
+            if len(parts) > 1 and regex.match(emoji_pattern, parts[0]):
+                icon = parts[0]
+                clean_title = parts[1] if len(parts) > 1 else ''
+
+        if not clean_title:
+            icon = "✉️"
+
+        # IMPORTANT: Reset markdown parser and convert content
+        md.reset()
+        content_html = md.convert(str(content))
+
+        html += f'''
+        <div class="{card_class}">
+            <div class="message_header">
+                <img src="{avatar}" class="message_avatar" onerror="this.style.display='none'"/>
+                <div class="message_header_text">
+                    <span class="message_sender">{display_sender}</span>
+                    <span class="message_title">{clean_title or 'Message'}</span>
+                </div>
+                <span class="message_icon">{icon}</span>
+            </div>
+            <div class="message_content">{content_html}</div>
+        </div>
+        '''
+
+    html += '</div>'
+    if fireworks_animation:
+        html = f'{html}{fireworks_animation}'
+    return html
+
+
+def generate_team_html(players, starting_team=None, is_human_playing=False):
+    """Generate improved team cards with working avatars and starting team indicator"""
+
+    role_order = {"boss": 0, "captain": 1, "player": 2}
+
+    red_players = sorted(
+        [p for p in players if p.team == "red"],
+        key=lambda p: role_order.get(p.role, 99)
+    )
+
+    blue_players = sorted(
+        [p for p in players if p.team == "blue"],
+        key=lambda p: role_order.get(p.role, 99)
+    )
+
+    def create_team_card(team_players, team_color, is_starting):
+        team_name = team_color.upper()
+        emoji = "🔴" if team_color == "red" else "🔵"
+
+        # Add starting team badge if applicable
+        starting_badge = ""
+        if is_starting:
+            starting_badge = "<div class='starting-badge'>🎯 STARTING TEAM</div>"
+        else:
+            starting_badge = "<div class='starting-badge'>⚔️ OPPONENT TEAM</div>"
+
+        players_html = ""
+        for p in team_players:
+            role_badge = f"<span class='role-badge role-{p.role}'>{p.role.upper()}</span>"
+            # Use Gradio's file serving path
+            avatar_path = f"/gradio_api/file={p.avatar}"
+
+            human_indicator = ""
+            if not is_human_playing:
+                if p.role == "boss":
+                    human_indicator = f"""
+                    <button class='play-as-boss-btn' onclick='showBossNameInput("{team_color}")'>
+                        🎮 Play as Boss
+                    </button>
+                    """
+            if p.role == "boss" and p.model_name == "Human brain":
+                human_indicator = "<span class='human-indicator'>👤 HUMAN PLAYER</span>"
+
+            players_html += f"""
+            <div class='player-row'>
+                <img src='{avatar_path}' class='player-avatar' onerror="this.style.display='none'">
+                <div class='player-details'>
+                    <div class='player-name'>{p.name}</div>
+                    <div class='player-meta'>
+                        {role_badge}
+                        <span class='player-model'>{display_model_name(p.model_name)}</span>
+                        {human_indicator}
+                    </div>
+                </div>
+            </div>
+            """
+
+        return f"""
+        <div class='team-card team-{team_color}'>
+            <div class='team-header'>
+                <h3>{emoji} {team_name} TEAM</h3>
+                {starting_badge}
+            </div>
+            <div class='team-body'>
+                {players_html}
+            </div>
+        </div>
+        """
+
+    red_card = create_team_card(red_players, "red", starting_team == "red")
+    blue_card = create_team_card(blue_players, "blue", starting_team == "blue")
+
+    return f"""
+    <div class='teams-container'>
+        {red_card}
+        <div class='vs-divider'>
+            <div class='vs-text'>⚔️</div>
+        </div>
+        {blue_card}
+    </div>
+    """
+
+
+def format_game_history_html(game_history):
+    """Format game history as HTML with team cards similar to play page"""
+    if not game_history:
+        return "<div style='text-align: center; padding: 40px;'><h3>No games played yet.</h3></div>"
+
+    games_html = []
+
+    for game in game_history:
+        # Sort players by role
+        role_order = {"boss": 0, "captain": 1, "player": 2}
+        red_players = sorted(
+            [p for p in game['players'] if p['team'] == 'red'],
+            key=lambda p: role_order.get(p['role'], 99)
+        )
+        blue_players = sorted(
+            [p for p in game['players'] if p['team'] == 'blue'],
+            key=lambda p: role_order.get(p['role'], 99)
+        )
+
+        # Determine winner and create result message
+        winner = game['winner']
+        red_score = game['red_score']
+        blue_score = game['blue_score']
+        reason = game['reason']
+
+        # Create result message
+        if reason == 'killer':
+            loser = 'red' if winner == 'blue' else 'blue'
+            result_emoji = "💀"
+            result_text = f"{loser.upper()} team hit the killer word!"
+            result_class = "result-killer"
+        else:
+            result_emoji = "🏆"
+            result_text = f"{winner.upper()} team won!"
+            result_class = f"result-{winner}"
+
+        # Score display
+        # red_score_class = "score-winner" if winner == "red" else "score-loser"
+        # blue_score_class = "score-winner" if winner == "blue" else "score-loser"
+
+        def create_team_card_history(team_players, team_color, is_winner):
+            team_name = team_color.upper()
+            emoji = "🔴" if team_color == "red" else "🔵"
+            score = red_score if team_color == "red" else blue_score
+
+            winner_badge = ""
+            if is_winner:
+                winner_badge = "<div class='winner-badge'>🏆 WINNER</div>"
+            else:
+                winner_badge = "<div class='winner-badge'>😭 LOSER</div>"
+
+            players_html = ""
+            for p in team_players:
+                role_badge = f"<span class='role-badge role-{p['role']}'>{p['role'].upper()}</span>"
+
+                human_indicator = ""
+                if p['is_human']:
+                    human_indicator = "<span class='human-indicator'>👤 HUMAN</span>"
+
+                players_html += f"""
+                <div class='player-row'>
+                    <div class='player-details'>
+                        <div class='player-name'>{p['name']}</div>
+                        <div class='player-meta'>
+                            {role_badge}
+                            <span class='player-model'>{display_model_name(p['model'])}</span>
+                            {human_indicator}
+                        </div>
+                    </div>
+                </div>
+                """
+
+            score_class = "score-winner" if is_winner else "score-loser"
+
+            return f"""
+            <div class='team-card team-{team_color}'>
+                <div class='team-header'>
+                    <h3>{emoji} {team_name} TEAM</h3>
+                    {winner_badge}
+                </div>
+                <div class='team-score {score_class}'>
+                    <span class='score-label'>Remaining Words:</span>
+                    <span class='score-value'>{score}</span>
+                </div>
+                <div class='team-body'>
+                    {players_html}
+                </div>
+            </div>
+            """
+
+        red_card = create_team_card_history(red_players, "red", winner == "red")
+        blue_card = create_team_card_history(blue_players, "blue", winner == "blue")
+
+        game_html = f"""
+        <div class='game-history-card'>
+            <div class='game-header'>
+                <div class='game-info'>
+                    <span class='game-number'>Game #{game['id']}</span>
+                    <span class='game-date'>📅 {game['timestamp']}</span>
+                </div>
+                <div class='game-result {result_class}'>
+                    {result_emoji} {result_text}
+                </div>
+            </div>
+            <div class='teams-container'>
+                {red_card}
+                <div class='vs-divider'>
+                    <div class='vs-text'>VS</div>
+                </div>
+                {blue_card}
+            </div>
+        </div>
+        """
+
+        games_html.append(game_html)
+
+    return "".join(games_html)
+
+
+def plot_game_board(board):
+    """
+    Create a single combined visualization showing words with their color-coded backgrounds.
+    Each card displays the word in white text on a colored background (red, blue, beige, black).
+    """
+    # Color mapping
+    color_map = {
+        'red': '#dc3545',
+        'blue': '#0d6efd',
+        'neutral': '#d4c5b9',  # beige
+        'killer': '#212529'     # black
+    }
+
+    # Get word-color pairs and arrange in 5x5 grid
+    word_color_pairs = board.get('word_color_pairs', [])
+    if len(word_color_pairs) < 25:
+        word_color_pairs = word_color_pairs + [("???", 'neutral')] * (25 - len(word_color_pairs))
+
+    # Create figure with specific size
+    fig, ax = plt.subplots(figsize=(12, 12))
+    ax.set_xlim(-0.5, 4.5)
+    ax.set_ylim(-0.5, 4.5)
+    ax.set_xticks([])
+    ax.set_yticks([])
+    ax.axis('off')
+    ax.set_aspect('equal')
+
+    # Draw grid of cards
+    idx = 0
+    for i in range(5):
+        for j in range(5):
+            if idx >= len(word_color_pairs):
+                break
+
+            word, color = word_color_pairs[idx]
+            bg_color = color_map.get(color, '#e9ecef')
+
+            # Draw card background with rounded corners effect
+            rect = mpatches.FancyBboxPatch(
+                (j - 0.48, i - 0.48), 0.96, 0.96,
+                boxstyle="round,pad=0.02",
+                facecolor=bg_color,
+                edgecolor='#495057',
+                linewidth=2.5,
+                zorder=1
+            )
+            ax.add_patch(rect)
+
+            # Add word text in white
+            # Adjust font size based on word length
+            word_length = len(word)
+            if word_length > 12:
+                fontsize = 13
+            elif word_length > 8:
+                fontsize = 15
+            else:
+                fontsize = 17
+
+            ax.text(
+                j, i, word,
+                ha="center", va="center",
+                fontsize=fontsize,
+                fontweight='bold',
+                color='white',
+                zorder=2,
+                wrap=True
+            )
+
+            idx += 1
+
+    plt.gca().invert_yaxis()
+
+    # Add title with starting team info
+    starting_team = board.get('starting_team', 'red')
+    title_color = color_map[starting_team]
+
+    fig.suptitle(
+        f'{starting_team.upper()} TEAM STARTS',
+        fontsize=18,
+        fontweight='bold',
+        color=title_color,
+        y=0.98
+    )
+
+    # Add legend
+    legend_elements = [
+        mpatches.Patch(facecolor=color_map['red'], edgecolor='#495057', label='Red Team'),
+        mpatches.Patch(facecolor=color_map['blue'], edgecolor='#495057', label='Blue Team'),
+        mpatches.Patch(facecolor=color_map['neutral'], edgecolor='#495057', label='Neutral'),
+        mpatches.Patch(facecolor=color_map['killer'], edgecolor='#495057', label='Killer ☠️')
+    ]
+    ax.legend(
+        handles=legend_elements,
+        loc='upper center',
+        bbox_to_anchor=(0.5, -0.02),
+        ncol=4,
+        frameon=True,
+        fancybox=True,
+        shadow=True,
+        fontsize=11
+    )
+
+    plt.tight_layout()
+
+    # Save to buffer
+    buf = io.BytesIO()
+    plt.savefig(buf, format="png", bbox_inches="tight", dpi=120, facecolor='white')
+    buf.seek(0)
+    plt.close(fig)
+
+    return Image.open(buf)
+
+
+def plot_game_board_with_guesses(board, guessed_words=None):
+    """
+    Plot the game board with crosses or marks over guessed words.
+    """
+
+    color_map = {
+        'red': '#dc3545',
+        'blue': '#0d6efd',
+        'neutral': '#d4c5b9',
+        'killer': '#212529'
+    }
+
+    guessed_words = set(guessed_words or [])
+    word_color_pairs = board.get('word_color_pairs', [])
+    if len(word_color_pairs) < 25:
+        word_color_pairs += [("???", 'neutral')] * (25 - len(word_color_pairs))
+
+    fig, ax = plt.subplots(figsize=(12, 12))
+    ax.set_xlim(-0.5, 4.5)
+    ax.set_ylim(-0.5, 4.5)
+    ax.axis('off')
+    ax.set_aspect('equal')
+
+    idx = 0
+    for i in range(5):
+        for j in range(5):
+            if idx >= len(word_color_pairs):
+                break
+
+            word, color = word_color_pairs[idx]
+            bg_color = color_map.get(color, '#e9ecef')
+
+            # Draw card background
+            rect = mpatches.FancyBboxPatch(
+                (j - 0.48, i - 0.48), 0.96, 0.96,
+                boxstyle="round,pad=0.02",
+                facecolor=bg_color,
+                edgecolor='#495057',
+                linewidth=2.5,
+                zorder=1
+            )
+            ax.add_patch(rect)
+
+            # Add word
+            ax.text(
+                j, i, word,
+                ha="center", va="center",
+                fontsize=15 if len(word) <= 8 else 13,
+                fontweight='bold',
+                color='white',
+                zorder=2,
+                wrap=True
+            )
+
+            # If word was guessed, overlay a cross
+            if word in guessed_words:
+                ax.plot(
+                    [j - 0.4, j + 0.4], [i - 0.4, i + 0.4],
+                    color='black', linewidth=3, alpha=0.8, zorder=3
+                )
+                ax.plot(
+                    [j - 0.4, j + 0.4], [i + 0.4, i - 0.4],
+                    color='black', linewidth=3, alpha=0.8, zorder=3
+                )
+
+            idx += 1
+
+    plt.gca().invert_yaxis()
+    starting_team = board.get('starting_team', 'red')
+    title_color = color_map[starting_team]
+
+    fig.suptitle(
+        f'{starting_team.upper()} TEAM STARTS',
+        fontsize=18,
+        fontweight='bold',
+        color=title_color,
+        y=0.98
+    )
+
+    plt.tight_layout()
+    buf = io.BytesIO()
+    plt.savefig(buf, format="png", bbox_inches="tight", dpi=120, facecolor='white')
+    buf.seek(0)
+    plt.close(fig)
+    return Image.open(buf)