{{ block styles }}
    <link href="{{ static 'global/css/styles.css' }}" rel="stylesheet">
    <link href="{{ static 'global/css/font.css' }}" rel="stylesheet">
    <link href="{{ static 'global/css/screenshot.css' }}" rel="stylesheet">
{{ endblock }}

{{ block scripts }}
    <script src="{{ static 'global/js/disable.js' }}"></script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const inputs = document.querySelectorAll('input');
            inputs.forEach(input => {
                input.addEventListener('mousedown', e => e.preventDefault());
                input.addEventListener('keydown', e => e.preventDefault());
            });
        });
    </script>
{{ endblock }}

{{ extends 'practice/Title.html' }}

{{ block content }}

    
    <div class="instructions">
        <p>In this step, you will estimate the student's score.</p>
        {{ if not is_single }}
            <p><b>Note: This estimate will be shared with your partner.</b></p>
        {{ endif }}
        <p>Below is the interface screenshot for the actual task.</p>
    </div>
    <div class="screenshot-mode">
        <div class="task-group-screen">
            {{ include 'task_group/includes/info_table_reversed.html' }}
            {{ formfields }}
        </div>
    </div>

    {{ next_button }}

{{ endblock }}