{% extends "base.html" %}
{% block title %}Blokus — Game{% endblock %}
{% block content %}
<div id="game-container">
    <div id="board-container">
        <div id="board"></div>
        <div id="placement-overlay"></div>
    </div>
    <div id="sidebar">
        <div id="player-info"></div>
        <div id="pieces"></div>
        <div id="controls">
            <button id="save-btn">Save Replay</button>
            <a href="/">Back to Menu</a>
        </div>
    </div>
</div>
<div id="status-bar">
    <span id="status-text">Loading...</span>
    <button id="status-save-btn" style="display:none;">Save Now</button>
</div>

<script>
    window.GAME_SESSION_ID = "{{ session_id }}";
    window.BOARD_SIZE = {{ board_size }};
    window.CELL_SIZE = 30;
</script>
{% endblock %}