{% extends "messung_basis.html" %}{% block titel %}{{ u.titel }}{% endblock %}
{% block preload %}<link rel="preload" href="/static/schrift/InstrumentSerif-Italic.woff2" as="font" type="font/woff2" crossorigin>
{% endblock %}{% block css %}<link rel="stylesheet" href="/static/info.css">
{% endblock %}{% block koerperklasse %} info-ueber{% endblock %}
{% set lampe_sinn = t.leit.lampe_sinn_info %}
{# Über uns aus Variante B „Bühne“ (Maintainer 22.10.2026, Mockup .superpowers/sdd/2026-10-21-stufe2-infoseiten/): erzählt in Akten
   wie die Leitseite. Die Lavalampe läuft nur auf der Bühne oben und scrollt weg, darunter liegt der Text ruhig auf dem Grund.
   Bühne (H1 „Musiknerds mit zu vielen Tracks.“, ohne Leipzig) · Kernsatz · Warum Timbre neben dem Messaufbau eines erfundenen
   Beispiel-Tracks (672 | 416) · Wie wir ticken als Dreier · Flow-Satz · Worauf Timbre aufbaut als Fünfer mit dem Motto
   „Von der Community für die Community.“ · Schreib uns mit Mail-Knopf. Kein PayPal-Hinweis auf der Seite selbst (nur im Fuß).
   Keine Namen, Fotos, Clubs oder Zahlen über das Team. Energie als Stufe (++), Tonart als Open Key. #}
{% block weich %} data-weich{% endblock %}{% block inhalt %}
<section class="buehne" aria-labelledby="u-h1">{% if lampe_an %}<canvas class="lava" data-anteile="{{ lava_anteile }}"{% if eb.lavafarben %} data-farben="{{ eb.lavafarben | join(',') }}"{% endif %} aria-hidden="true"></canvas>{% endif %}<div class="spalte"><div class="heldtext"><h1 class="display" id="u-h1">{{ u.h1[0] }}<br>{{ u.h1[1] }} <em>{{ u.h1[2] }}</em></h1><p class="lead">{{ u.intro }}</p></div></div></section>
<section class="kernband spalte" aria-label="{{ t.leit.kernsatz }}"><p class="kernsatz">{% for teil in u.kern %}{% if loop.index0 is odd %}<em>{{ teil }}</em>{% else %}{{ teil }}{% endif %}{% endfor %}</p></section>
<section class="akt spalte" aria-labelledby="w-h"><div class="goldteilung text-gross"><div class="aktkopf"><h2 class="titel" id="w-h">{{ u.warum_titel }}</h2><p class="lead">{{ u.warum[0] }}<b>{{ u.warum[1] }}</b>{{ u.warum[2] }}</p></div>
  <figure class="messaufbau platte eng">
    <figcaption class="etikett kopfzeile"><span class="herkunft schema">{{ u.erfunden }}</span> <span>{{ u.grafik }}</span></figcaption>
    <dl class="messwerte">
      <div><dt>{{ u.tempo }}</dt><dd class="zahl">126 BPM</dd></div>
      <div><dt>{{ u.tonart }}</dt><dd>{{ mess.key }} <span class="etikett">{{ u.tonart_text }}</span></dd></div>
      <div><dt>{{ u.energie }}</dt><dd>{{ mess.energie }}</dd></div>
    </dl>
    <p class="etikett">{{ u.genre }}</p>
    <div class="band" role="img" aria-label="{% for g, p in u.genres %}{{ g }} {{ p }}&nbsp;%{% if not loop.last %}, {% endif %}{% endfor %}">{% for g, p in u.genres %}<i style="flex:{{ p }}"></i>{% endfor %}</div><ul class="bandlegende" aria-hidden="true">{% for g, p in u.genres %}<li>{{ g }} <b>{{ p }} %</b></li>{% endfor %}</ul>
    <p class="etikett">{{ u.netz }}</p>
    <svg class="netz" viewBox="-40 -24 380 348" role="img" aria-label="{{ u.netz }}: {% for a in netz.achsen %}{{ a.name }} {{ a.wert }}{% if not loop.last %}, {% endif %}{% endfor %}"><g class="gitter">{% for ring in netz.ringe %}<polygon points="{{ ring.punkte }}"{% if ring.mitte %} stroke-dasharray="4 4"{% endif %}/>{% endfor %}{% for a in netz.achsen %}<line x1="150" y1="150" x2="{{ a.x }}" y2="{{ a.y }}"/>{% endfor %}</g><polygon class="form" points="{{ netz.flaeche }}"/>{% for a in netz.achsen %}<text x="{{ a.tx }}" y="{{ a.ty }}" text-anchor="middle">{{ a.name }}</text>{% endfor %}</svg>
  </figure></div></section>
<section class="akt spalte" aria-labelledby="t-h"><div class="aktkopf"><h2 class="titel" id="t-h">{{ u.ticken_titel }}</h2></div><ul class="drei">{% for k, txt in u.ticken %}<li class="platte eng"><h3 class="titel2">{{ k }}</h3><p>{{ txt }}</p></li>{% endfor %}</ul></section>
<section class="akt spalte flowakt"><p class="titel flowsatz">{{ u.flow }}</p></section>
{% if u.basis %}<section class="akt spalte" aria-labelledby="b-h"><div class="aktkopf"><h2 class="titel" id="b-h">{{ u.basis_titel }}</h2>{% if u.basis_motto %}<p class="motto titel2"><strong>{{ u.basis_motto }}</strong></p>{% endif %}<p class="lead">{{ u.basis_intro }}</p></div>
  <ul class="fuenf bibliotheken">{% for name, link, was, lizenz in u.basis %}<li class="bib"><h3><a href="{{ link }}" rel="noopener">{{ name }}</a></h3><p>{{ was }}</p><p class="etikett zahl">{{ lizenz }}</p></li>{% endfor %}</ul>
  <p class="etikett betrieb">{{ u.basis_betrieb }}</p>
  <p class="forschungslink">{{ t.forschung.ueber_link }} <a class="knopf" href="/forschung">{{ t.forschung.nav }} <span aria-hidden="true">→</span></a></p></section>{% endif %}
<section class="akt spalte schlussakt" aria-labelledby="s-h"><div class="aktkopf"><h2 class="titel" id="s-h">{{ u.schreib_titel }}</h2><p class="lead">{{ u.schreib[0] }} <a href="mailto:hello@timbremusic.app">hello@timbremusic.app</a>. {{ u.schreib[1] }}</p><div class="knopfreihe"><a class="knopf voll" href="mailto:hello@timbremusic.app">{{ u.mail_knopf }}</a></div></div></section>
{% endblock %}