{#- chirp-ui: Constellation
    Twinkling ASCII starfield background with gentle drift. Pure CSS.

    Usage:
        from "chirpui/constellation.html" import constellation

        {% call constellation() %}
            <h1>Starfield hero</h1>
        {% end %}

        {% call constellation(variant="warm", density="dense") %}
            <p>Dense warm starfield</p>
        {% end %}
-#}

{% def constellation(density="", variant="", cls="") %}
{# @consumes _hero_variant from: hero_effects — falls back to "" #}
{% set _variant = (variant if variant else consume("_hero_variant", "")) | validate_variant(("", "default", "warm", "cool", "mono"), "") %}
{% set density = density | validate_variant(("", "default", "sparse", "dense"), "") %}
{% set variant_class = " chirpui-constellation--" ~ _variant if _variant else "" %}
{% set density_class = " chirpui-constellation--" ~ density if density else "" %}
{% set count = 16 if density == "dense" else (6 if density == "sparse" else 10) %}
{% set glyphs = ["·", "✦", "·", "★", "·", "·", "✦", "·", "●", "·", "✦", "·", "·", "★", "·", "✦"] %}
{% set positions = [(78, 12), (14, 18), (58, 32), (26, 42), (88, 48), (42, 72), (8, 64), (66, 84), (34, 10), (72, 58), (18, 86), (52, 18), (92, 76), (6, 34), (46, 54), (82, 28)] %}
<div class="chirpui-constellation{{ variant_class }}{{ density_class }}{{ " " ~ cls if cls else "" }}">
    <div class="chirpui-constellation__field" aria-hidden="true">
        {% for i in range(count) %}
        {% set pos = positions[i] %}
        <span class="chirpui-constellation__star" style="left: {{ pos[0] }}%; top: {{ pos[1] }}%">{{ glyphs[i % 16] }}</span>
        {% end %}
    </div>
    <div class="chirpui-constellation__content">
        {% slot %}
    </div>
</div>
{% end %}