/* ============================================================
   ELANUM Zeichen · Bewegung
   Die Form steht. Eigene Ebenen tragen Linie und Licht, damit das
   Spektrum darunter nur einmal gezeichnet wird.
   Reduzierte Bewegung und Pause zeigen das ruhende Zeichen.
   ============================================================ */
.zeichen{position:relative;display:block;aspect-ratio:1}
.zeichen>img{display:block;width:100%;height:auto;aspect-ratio:1}
.zeichen__ebene{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
/* Bis das Skript den Zeichenaufbau vorbereitet hat, steht dort nichts (Versteck-Guard aus boot.js) */
html.motion-pending:not(.motion-ready):not(.motion-timeout) .zeichen[data-zeichen=aufbau]:not(.is-bereit) img{opacity:0}

/* ---------- Zeichenaufbau: feine Linie im Markenspektrum, dann die Farbe ---------- */
.zeichen__aufbau{display:none}
.zeichen.is-aufbau .zeichen__aufbau{display:block;will-change:opacity}
/* Das Bild bleibt dauerhaft auf eigener Ebene: so wird es beim Aufbau nicht neu gezeichnet */
.zeichen[data-zeichen=aufbau] .zeichen__bild{will-change:opacity}
.zeichen__linie{fill:none;stroke-width:calc(var(--zeichen-einheit,2) * 1.4);stroke-linecap:round;stroke-dasharray:1 2}

/* ---------- Lichtlauf: ein Glanz kreist um die Mitte ---------- */
.zeichen__licht{display:block;overflow:hidden;opacity:.6;mix-blend-mode:screen}
.zeichen__schimmer{position:absolute;inset:0;will-change:transform;animation:zeichen-lichtlauf 24s linear infinite}
@keyframes zeichen-lichtlauf{to{transform:rotate(1turn)}}

/* ---------- Ruhe ---------- */
@media(prefers-reduced-motion:reduce){.zeichen :is(.zeichen__licht,.zeichen__aufbau){display:none}}
body[data-motion=off] .zeichen :is(.zeichen__licht,.zeichen__aufbau){display:none}