{% macro section(label, items, main_color, secondary_color, genre_name) -%}
{% set ITEM_MAX = 3 -%}
                <section itemscope itemprop="mainEntity" itemtype="https://schema.org/Question">
                    {% if label == "BPM" -%}
                        {% set emoji = "💓 " -%}
                        {% set units = " BPM" -%}
                    {% elif label == "Root Note" -%}
                        {% set emoji = "🎵 " -%}
                        {% set units = "" -%}
                    {% elif label == "Key" -%}
                        {% set emoji = "🎼 " -%}
                        {% set units = "" -%}
                    {% elif label == "Label" -%}
                        {% set emoji = "🏷️ " -%}
                        {% set units = "" -%}
                    {% elif label == "Genre" -%}
                        {% set emoji = "🏠 " -%}
                        {% set units = "" -%}
                    {% else -%}
                        {% set emoji = "" -%}
                        {% set units = "" -%}
                    {% endif -%}
                    <h3>{{ emoji }}{{ label }}<span class="share"><button>🎁 Share</button></span></h3>
                    <p><small><i itemprop="name">{{ human_question(entity=label, genre=genre_name) }}</i></small></p>
                    <div class="items">
                        {% for item in items -%}

                        {% if loop.index > ITEM_MAX %}{% break %}{% endif -%}

                        {% if loop.index == 1 -%}
                            {% set place_str = "🥇 " -%}
                        {% elif loop.index == 2 -%}
                            {% set place_str = "🥈 " -%}
                        {% elif loop.index == 3 -%}
                            {% set place_str = "🥉 " -%}
                        {% else -%}
                            {% set place_str = "" -%}
                        {% endif -%}
                        <div class="item {{ main_color }}">
                            <p>{{ place_str }}{{ item.weighted_count.count }}%</p>
                            {% set value = item.value -%}
                            {%- if loop.index == 1 %}
                            <div itemscope itemprop="acceptedAnswer" itemtype="https://schema.org/Answer" class="inner {{ secondary_color }}">
                                <p itemprop="text">{{ value }}{{ units }}</p>
                                {%- if label == "Key" %}
                                <p class="inner-extra">{{ value | key_extra_info }}</p>
                                {%- endif %}
                            </div>
                            {%- else %}
                            <div class="inner {{ secondary_color }}">
                                <p>{{ value }}{{ units }}</p>
                                {%- if label == "Key" %}
                                <p class="inner-extra">{{ value | key_extra_info }}</p>
                                {%- endif %}
                            </div>
                            {%- endif %}
                        </div>
                        {% endfor %}
                    </div>
                </section>
{%- endmacro section %}