{% extends "global/Page.html" %}
{% load otree %}
{% block content %}
{% include "joint_inference/_styles.html" %}

<h2>How you play</h2>

<h3>Each trial in 5 steps</h3>

<ol style="line-height: 1.8;">
    <li><b>Draw your sample.</b> 10 or 50 balls from Box 1 (with replacement).</li>
    <li><b>Q1. First estimate.</b> How many of the 100 balls in Box 1 are red?</li>
    <li><b>See two reports.</b> Report A and Report B — one is from your partner, one is from the imposter.</li>
    <li><b>Q2. Identity bet.</b> You decide how confident you are that Report A came from your partner. You will see a list of choices between:
        <ul style="margin: 4px 0;">
            <li><b>Option A:</b> bet that Report A is your partner's report (you earn 100 points if correct, 0 otherwise)</li>
            <li><b>Option B:</b> take a lottery that pays 100 points with a known probability</li>
        </ul>
        In each row, the probability in Option B changes. As the lottery becomes more attractive, you may want to switch from Option A to Option B. Choose the point at which you prefer the lottery instead of the bet.</li>
    <li><b>Q3. Updated estimate.</b> Update your estimate of red balls in Box 1.</li>
</ol>

<h3>Scoring</h3>

<p>For each of the {{ num_main }} scored trials, <b>one of Q1, Q2, or Q3 is randomly selected</b> to determine your points for that trial.</p>

<table style="margin: 16px 0; border-collapse: collapse;">
    <tr style="background: #eee;">
        <th style="padding: 8px 14px; border: 1px solid #ccc; text-align: left;">Question</th>
        <th style="padding: 8px 14px; border: 1px solid #ccc; text-align: left;">How it scores</th>
    </tr>
    <tr>
        <td style="padding: 8px 14px; border: 1px solid #ccc;"><b>Q1, Q3</b> (estimates)</td>
        <td style="padding: 8px 14px; border: 1px solid #ccc;">You earn <b>100 minus your error squared, scaled so that off by 20 or more = 0 points</b>. For example: off by 5 = 93 points, off by 10 = 75 points, off by 15 = 43 points, off by 20 or more = 0 points.</td>
    </tr>
    <tr>
        <td style="padding: 8px 14px; border: 1px solid #ccc;"><b>Q2</b> (identity bet)</td>
        <td style="padding: 8px 14px; border: 1px solid #ccc;">One row of the price list is selected at random; your chosen option is played out. 0 or 100 points.</td>
    </tr>
</table>

<p><b>Maximum per trial: 100 points.</b></p>

<h3>Practice first, then play for real</h3>

<p>You'll start with <b>{{ num_practice }} practice trials</b> with feedback after each, so you can see how the game works. Practice trials earn no points.</p>

<p>Then you'll play <b>{{ num_main }} scored trials</b> back-to-back without feedback. Your results and points will be shown at the end.</p>

<p style="background: #e8f4ff; padding: 12px; border-radius: 6px; margin-top: 16px;">
Ready? Click below to start the first practice trial.
</p>

{{ next_button }}
{% endblock %}