{% extends 'Game/index.html.twig' %}

{% block title %} - Game Rules{% endblock %}

{% block metas %}
  {%- set _ogImage = 'https://' ~ app.request.host ~ asset('/images/mine-1600x627.png') -%}
  <meta property="og:url" content="{{ url('MineSeekerBundle_rules') | replace({'http://': 'https://'}) }}"/>
  <meta property="og:type" content="website"/>
  <meta property="og:site_name" content="MineSeeker"/>
  <meta property="og:title" content="Game Rules · MineSeeker"/>
  <meta property="og:description" content="Learn how to play MineSeeker and discover what you unlock by creating a free account."/>
  <meta property="og:image" content="{{ _ogImage }}"/>
  <meta property="og:image:width" content="1600"/>
  <meta property="og:image:height" content="627"/>
  <meta name="twitter:card" content="summary_large_image"/>
  <meta name="twitter:title" content="Game Rules · MineSeeker"/>
  <meta name="twitter:description" content="Learn how to play MineSeeker and discover what you unlock by creating a free account."/>
  <meta name="twitter:image" content="{{ _ogImage }}"/>
{% endblock %}

{% block body %}
  <div class="txt">
    <h2>MineSeeker Game Rules</h2>

    <p>MineSeeker is a real-time 1v1 twist on the classic minesweeper formula. Two players &mdash; <strong>Red</strong> and <strong>Blue</strong> &mdash; race over the same hidden minefield, taking turns to <strong>hunt the mines</strong>. Each mine you detonate is claimed in your colour and scores a point. The first player to claim the majority of the mines wins.</p>

    <h3>1. The Board</h3>

    <ul>
      <li>The playing field is a <strong>16&times;16 grid</strong> of covered cells.</li>
      <li><strong>51 mines</strong> are hidden randomly across the board at the start of each match.</li>
      <li>Every non-mine cell displays a number indicating how many of its eight neighbours contain a mine &mdash; these numbers are your clues. Cells with no adjacent mines are empty.</li>
    </ul>

    <h3>2. Turn Order</h3>

    <ul>
      <li>Players alternate turns. On your turn the status bar reads <em>&ldquo;It is your turn! Make a move&rdquo;</em>; while you wait it reads <em>&ldquo;Your buddy is making a move&rdquo;</em>.</li>
      <li>On your turn you must perform exactly one action: reveal a cell, flag/unflag a cell, or deploy your bomb.</li>
      <li><strong>If you hit a mine, you keep your turn</strong> and may click again. Your turn only ends when you reveal a safe cell (or use your bomb).</li>
    </ul>

    <h3>3. Revealing Cells</h3>

    <ul>
      <li><strong>Left-click</strong> a covered cell to reveal it.</li>
      <li>Revealing a <strong>numbered cell</strong> just uncovers the clue &mdash; no points are awarded &mdash; and your turn ends.</li>
      <li>Revealing an <strong>empty cell</strong> triggers a <strong>flood-fill</strong> that opens all connected empty cells and their numbered borders in a single move. Flood-fill will never step onto a mine, so empty-area sweeps are always safe.</li>
      <li><strong>Right-click</strong> a covered cell to place a flag where you suspect a mine. Flagged cells cannot be revealed until unflagged.</li>
    </ul>

    <h3>4. Claiming Mines &amp; Scoring</h3>

    <ul>
      <li>Clicking a mine is the <strong>goal</strong> of the game, not a failure. The mine is marked with your colour&rsquo;s flag and scores <strong>one point</strong> for you.</li>
      <li>You keep the turn and may click again &mdash; rack up a streak while you&rsquo;re hot.</li>
      <li>Your turn only ends when you finally reveal a safe cell (or deploy your bomb).</li>
    </ul>

    <h3>5. The Bomb</h3>

    <ul>
      <li>Each player carries <strong>one bomb</strong> per match.</li>
      <li>Detonating your bomb clears a <strong>5&times;5 blast radius</strong> (25 cells) around the target. <strong>Every mine inside the radius is claimed for your colour and adds to your score.</strong> Numbered cells in the radius are also revealed.</li>
      <li>The bomb consumes your turn and can only be used once. Save it for a dense patch of suspected mines to burst ahead on the scoreboard.</li>
    </ul>

    <h3>6. Winning the Match</h3>

    <p>A match ends in one of three ways:</p>
    <ul>
      <li><strong>Majority reached</strong> &mdash; the first player to claim more than half of the mines (26 of 51) wins immediately.</li>
      <li><strong>A player resigns</strong> &mdash; the remaining player wins.</li>
      <li><strong>Draw</strong> &mdash; if neither player reaches the majority and scores end up equal, the match is recorded as a draw.</li>
    </ul>

    <h3>7. Bonus Points</h3>

    <p>In addition to scoring points by claiming mines, MineSeeker rewards skilled play with <strong>bonus points</strong>. These are tracked separately from your main score and displayed in the Bonus Statistics dialog after each match.</p>

    <ul>
      <li><strong>Blind Hit (+2 points)</strong> &mdash; Click a mine with no revealed numbered neighbors around it. No clues to help you!</li>
      <li><strong>Chain Combo</strong> &mdash; Click consecutive mines without revealing a safe cell in between. Your longest streak is tracked.</li>
      <li><strong>Edge Mine (+1 point)</strong> &mdash; Click a mine on the board boundary (top row, bottom row, left column, or right column).</li>
      <li><strong>Endgame Mine (+3 points)</strong> &mdash; Click a mine when 10 or fewer mines remain on the board. High risk, high reward.</li>
      <li><strong>Safe Cell Bonus (+0.5 points per cell)</strong> &mdash; Reveal 2 or more safe cells in a single click. Larger area sweeps earn more points.</li>
    </ul>

    <h3>8. Playing as a Guest</h3>

    <p>No account is required to play. Just open the game, share the match link with a friend, and play. Guest matches are not saved to a history and carry no stats.</p>

    <h2 style="margin-top: 40px;">Registered User Privileges</h2>

    <p>Creating a free account unlocks everything the guest experience leaves behind. Registration takes under a minute and your email is only used for account recovery.</p>

    <h3>1. Persistent Game History</h3>

    <ul>
      <li>Every match you play is recorded with timestamps, the full move list, the final grid, and your opponent&rsquo;s name.</li>
      <li>Replay past battles cell-by-cell and share them with a public UUID link so friends can watch your finest detonations.</li>
    </ul>

    <div class="img-container">
      <img style="margin-top: 15px;" src="{{ asset('images/privileges/history.png') }}" alt="Recent Game History" />
    </div>

    <h3>2. Player Statistics</h3>

    <ul>
      <li>Total games, wins, losses, and draws.</li>
      <li>Win rate percentage, average score, personal best score, and total mines hit.</li>
      <li>A 6-month trend dashboard charting wins, losses, and draws per month.</li>
    </ul>

    <div class="img-container">
      <img style="margin-top: 15px;" src="{{ asset('images/privileges/stat.png') }}" alt="Statistics" />
    </div>

    <h3>3. Profile &amp; Identity</h3>

    <ul>
      <li>Upload a custom <strong>avatar</strong> that appears next to your username on the board and in the shared battles.</li>
      <li>Your username is reserved &mdash; no one else can take it.</li>
    </ul>

    <h3>4. Account Security</h3>

    <ul>
      <li><strong>Two-factor authentication (TOTP):</strong> Protect your account with an authenticator app and a set of one-time backup codes.</li>
      <li><strong>WebAuthn passkeys:</strong> Register one or more hardware/biometric security keys for passwordless sign-in.</li>
      <li>A dedicated <strong>Security</strong> dashboard to manage backup codes, review registered credentials, and rotate them at any time.</li>
    </ul>

    <div class="img-container">
      <img style="margin-top: 15px;" src="{{ asset('images/privileges/security.png') }}" alt="Security Dashboard" />
    </div>

    <h3>5. Shareable Battle Pages</h3>

    <ul>
      <li>Each recorded match gets a public page with both players&rsquo; names, avatars, final scores, the outcome, and a compact summary of how it played out.</li>
      <li>Perfect for proving that impossible last-turn comeback.</li>
    </ul>

    <div class="img-container">
      <img style="margin-top: 15px;" src="{{ asset('images/privileges/battle.png') }}" alt="Shareable Battle Pages" />
    </div>

    <div class="img-container">
      <img style="margin-top: 15px;" src="{{ asset('images/privileges/shared-battle.png') }}" alt="Shared Battle Page" />
    </div>

    <p style="margin-top: 32px;">Ready to level up? <a href="{{ path('MineSeekerBundle_register') }}">Create your free account</a> or <a href="{{ path('MineSeekerBundle_gamePlay') }}">jump straight into a match</a>.</p>
  </div>
{% endblock %}
