.game
    .game-map-step
        .invit
            #map
        .controls
            button.button.geolocation-button(aria-label=__('Geolocalize yourself on the map'))  
                i(data-feather="map-pin")
            button.button.start-button(aria-label=__('Start the game'))
                i(data-feather="play")
            button.button.quizz-start-button(aria-label=__('Launch a quizz'))
                i(data-feather="clipboard")
    .game-quizz.none
        .invit
            .game-loading 
                <svg class="spinner" width="65px" height="65px" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
                <circle class="path" fill="none" stroke-width="6" stroke-linecap="round" cx="33" cy="33" r="30"></circle>
                </svg>
            .game-audio
                .game-quizz-step.none
                    ul.proposals
                .game-results-step.none
                    p.message
                    .species.answer 
                        p #{ __('It was a') } 
                            span.com
                            span.sci 
                audio(controls).none
        .controls
            button.button.restart-button(aria-label=__('Start a new quizz'))
                i(data-feather="repeat")
            button.button.map-button(aria-label=__('Return to the map'))
                i(data-feather="map")
        
    link(rel="stylesheet" href="/dist/leaflet/leaflet.css")
    link(rel="stylesheet" href="/stylesheets/spinner.css")
    script(src="/dist/leaflet/leaflet.js")
    script(src="/dist/axios/axios.min.js")
    script(src="/javascripts/game.js" type="module")