/* ===================================================================
   aeri-zustaende-2.css - die Launen, Teil 2: Entschuldigung, Laden,
   Neugierig, Schlaf. Dazu die Regel für bewegungsarme Anzeige.
   =================================================================== */

/* --- 6. Entschuldigung: kleiner werden, nicht jammern -------------
   Die schwierigste Laune. Halb geschlossene Lider allein wirken
   genervt; erst die Brauen mit angehobenen INNEN-Enden machen daraus
   Bedauern. Dazu senkt sich der Kopf, statt sich nur zu neigen.       */

.aeri--entschuldigung .aeri-schweben     { animation-duration: 8s; }
.aeri--entschuldigung .aeri-neigung      { transform: rotate(-1deg) translateY(6px) scale(.97); }
.aeri--entschuldigung .aeri-drift        { animation-duration: 11s; }
.aeri--entschuldigung .aeri-fluegel      { transform: rotate(27deg); animation: none; }
.aeri--entschuldigung .aeri-kamm--rechts,
.aeri--entschuldigung .aeri-kamm--links  { transform: rotate(46deg); animation: none; }
.aeri--entschuldigung .aeri-auge         { transform: translateY(2.5px); }
.aeri--entschuldigung .aeri-lid          { transform: scaleY(.34); animation: none; }
.aeri--entschuldigung .aeri-wimper       { opacity: .45; }
.aeri--entschuldigung .aeri-mund-ruhe    { opacity: 0; }
.aeri--entschuldigung .aeri-mund-sanft   { opacity: .8; }
.aeri--entschuldigung .aeri-bloom        { opacity: .45; animation: none; }
.aeri--entschuldigung .aeri-pfuetze      { opacity: .12; animation: none; }
.aeri--entschuldigung .aeri-schweif      { animation-duration: 8s; }

.aeri--entschuldigung .aeri-braue--links {
    opacity: .85;
    transform: translateY(-1px) rotate(-15deg);
}

.aeri--entschuldigung .aeri-braue--rechts {
    opacity: .85;
    transform: translateY(-1px) rotate(15deg);
}

/* --- 7. Laden: der Ring läuft, Aeri bleibt ruhig ------------------ */

.aeri--laden .aeri-ring      { opacity: 1; }
.aeri--laden .aeri-ring-bahn { opacity: .16; }
.aeri--laden .aeri-ring-lauf {
    transform-box: view-box;
    transform-origin: 100px 100px;
    animation: aeri-kreisen 1.5s linear infinite;
}

.aeri--laden.aeri--blick-rechts .aeri-auge { transform: translate(3px, -1.5px); }
.aeri--laden.aeri--blick-links  .aeri-auge { transform: translate(-3px, -1.5px); }
.aeri--laden .aeri-bloom { animation-duration: 3.2s; }

@keyframes aeri-kreisen {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* --- 8. Neugierig: Kopf schief, ein Fragezeichen ----------------- */

/* Kopf schief und ein Fragezeichen genügen. Ein halbes Lid auf einem Auge
   sah nicht neugierig aus, sondern skeptisch. */
.aeri--neugierig.aeri--blick-rechts .aeri-neigung { transform: rotate(11deg); }
.aeri--neugierig.aeri--blick-links  .aeri-neigung { transform: rotate(-11deg); }

.aeri--neugierig .aeri-kamm--rechts  { transform: rotate(-16deg); animation: none; }
.aeri--neugierig .aeri-kamm--links   { transform: rotate(9deg); animation: none; }
.aeri--neugierig .aeri-mund-ruhe     { opacity: 0; }
.aeri--neugierig .aeri-mund-offen    {
    opacity: .85;
    transform-box: fill-box;
    transform-origin: top center;
    transform: scaleY(.62);
}

.aeri--neugierig .aeri-braue--links,
.aeri--neugierig .aeri-braue--rechts { opacity: .7; transform: translateY(-3px); }

.aeri--neugierig .aeri-frage { opacity: 1; }
.aeri--neugierig .aeri-frage text {
    transform-box: fill-box;
    transform-origin: center bottom;
    animation: aeri-fragen 2.8s ease-in-out infinite;
}

@keyframes aeri-fragen {
    0%, 100% { transform: rotate(-6deg) translateY(0); }
    50%      { transform: rotate(8deg) translateY(-4px); }
}

/* --- 9. Schlaf: alles wird langsam und dunkler ------------------- */

.aeri--schlaf .aeri-schweben  { animation-duration: 10s; }
.aeri--schlaf .aeri-drift     { animation-duration: 14s; }
.aeri--schlaf .aeri-neigung   { transform: rotate(-2deg) translateY(7px); }
.aeri--schlaf .aeri-schweif   { animation-duration: 10s; }
.aeri--schlaf .aeri-kamm--rechts,
.aeri--schlaf .aeri-kamm--links { transform: rotate(32deg); animation: none; }
.aeri--schlaf .aeri-lid       { transform: scaleY(1); animation: none; }
.aeri--schlaf .aeri-wimper    { opacity: .65; }
.aeri--schlaf .aeri-mund-ruhe { opacity: .5; }
.aeri--schlaf .aeri-pfuetze   { animation-duration: 10s; }

/* Eigene Kurven statt Umwidmung: eine laufende Animation schlägt sonst
   jeden festen Wert, den man daneben schreibt. */
.aeri--schlaf .aeri-fluegel {
    animation: aeri-schlafatem 10s ease-in-out infinite;
}
.aeri--schlaf .aeri-bloom {
    animation: aeri-atem-schwach 10s ease-in-out infinite;
}

.aeri--schlaf .aeri-schlummer { opacity: 1; }
.aeri--schlaf .aeri-schlummer text {
    transform-box: fill-box;
    transform-origin: center;
    animation: aeri-schlummern 3.6s ease-in-out infinite;
}
.aeri--schlaf .aeri-schlummer text:nth-child(2) { animation-delay: .5s; }
.aeri--schlaf .aeri-schlummer text:nth-child(3) { animation-delay: 1s; }

@keyframes aeri-schlafatem {
    0%, 100% { transform: rotate(17deg); }
    50%      { transform: rotate(24deg); }
}

@keyframes aeri-atem-schwach {
    0%, 100% { opacity: .3; transform: scale(.95); }
    50%      { opacity: .5; transform: scale(1); }
}

@keyframes aeri-schlummern {
    0%   { opacity: 0; transform: translate(-2px, 5px) scale(.7); }
    40%  { opacity: 1; transform: none; }
    100% { opacity: 0; transform: translate(6px, -8px) scale(1.05); }
}

/* --- Bewegungsarm: die Launen bleiben lesbar, nur die Bewegung fällt weg --- */

@media (prefers-reduced-motion: reduce) {
    .aeri--erklaeren.aeri--blick-rechts .aeri-fluegel--rechts,
    .aeri--erklaeren.aeri--blick-links  .aeri-fluegel--links { transform: rotate(-16deg); }

    .aeri--winken.aeri--blick-rechts .aeri-fluegel--rechts,
    .aeri--winken.aeri--blick-links  .aeri-fluegel--links { transform: rotate(-32deg); }

    .aeri--erklaeren .aeri-mund-offen,
    .aeri--denken .aeri-denken,
    .aeri--freude .aeri-funken,
    .aeri--schlaf .aeri-schlummer,
    .aeri--neugierig .aeri-frage { opacity: 1; }

    .aeri--laden .aeri-ring-lauf { transform: rotate(-40deg); }
}
