/* Rueckmeldung. Besitzer: Frontend Developer. Kaskadenposition 5 von 6.

   Auftragskarte, Zeitschiene, Warteschlangen-Alterung, Bewertungsbereich,
   Versuchsspur (Aufgabe 8, Spec §4). Legt ausschliesslich .rueck-… Klassen
   an — Komposition mit bestehenden Bausteinen (.btn, .marke, .massnahme, …)
   ist erlaubt, ein neuer Name ohne das Praefix nicht. stil-schnitt.test.js
   prueft das. */

/* --- Auftragskarte (Spec §4.1) ------------------------------------------
   Aus der einzeiligen .meinAnruf-Flexreihe wird eine Karte auf --eben-2:
   "deins, jetzt" — dieselbe Bedeutung wie ein aufgeklappter Abschnitt.
   Rahmenfarbe ueber --rolle-kante, damit sie beim Anrufer warm und beim
   Support kalt ist, ohne eigene Farbregel (Spec §2.1). */
.rueck-auftragskarte{background:var(--surface-2);border:1px solid var(--rolle-kante);
  border-radius:var(--r-s);padding:.9rem 1.1rem;margin-bottom:1rem;
  box-shadow:var(--eben-2);display:flex;flex-direction:column;gap:.5rem;}
.rueck-auftragskarte-kopf{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;}
.rueck-auftragskarte-kopf b{font-size:var(--tx-l);}
/* Mono, wie die Uhr — beides sind Kennzahlen, keine Prosa (Spec §2.2). */
.rueck-auftragskarte-zeit{font-family:var(--mono);color:var(--rolle);
  margin-left:auto;font-size:var(--tx-s);}
/* "Alex ist in der Leitung." — eine Textzeile, kein Chip: sie soll wie ein
   Satz gelesen werden, nicht wie ein weiteres Etikett (Spec §4.1). */
.rueck-auftragskarte-wer{margin:0;color:var(--text-2);font-size:var(--tx-s);}

/* --- Zeitschiene (Spec §4.2) ---------------------------------------------
   2px-Leiste unter der Kopfleiste. .leiste ist position:sticky (buehne.css)
   — das reicht als Bezugsrahmen fuer position:absolute (sticky gilt dafuer
   als positioniert). Breite kommt aus --rest (0..1, leiste.js:
   restAnteil()), als scaleX statt width: guenstiger fuer den Compositor,
   und width waere ohnehin nur eine von mehreren gueltigen Umsetzungen
   derselben Vorgabe. Der Farbwechsel unter 60s ist EIN Geschwister-Selektor
   auf die schon bestehende .uhr--knapp-Klasse — keine neue Bedingung, kein
   JS-Zusatz. Der Puls selbst (Spec §2.5) ist Bewegung und gehoert
   bewegung.css (Whimsy Injector); hier steht nur der ruhige Zustand, auf
   dem er aufsetzt. */
.rueck-zeitschiene{position:absolute;left:0;bottom:-1px;width:100%;height:2px;
  transform-origin:left;transform:scaleX(var(--rest, 1));
  background:var(--rolle);}
.uhr.uhr--knapp ~ .rueck-zeitschiene{background:var(--accent);}

/* --- Warteschlangen-Alterung (Spec §4.2) ---------------------------------
   .anrufzeile traegt --wartet-anteil (0..1, leiste.js: zeileSetzen()) —
   dieselbe Zahl, die auch die alt-1/2/3-Stufen fuer den reduced-motion-Pfad
   bestimmt (Aufgabe 3/9). color-mix faerbt den Grund stufenlos Richtung
   --schlecht; die kriechende ANIMATION (animation-delay-basiert, damit sie
   nach einem DOM-Update an der richtigen Stelle weiterlaeuft) ist
   bewegung.css. Farbe traegt hier nie allein: der Mono-Zaehler in
   .anrufdauer bleibt so oder so lesbar (Spec §4.4 "Farbe allein"). */
.rueck-alterung{background:color-mix(in srgb, var(--schlecht) calc(var(--wartet-anteil, 0) * 55%), var(--surface));}

/* --- Verloren-Zaehler (Spec §4.2) -----------------------------------------
   Von der Fussnote zum Zaehler neben der Warteschlange. Das einmalige
   Aufblitzen beim Hochzaehlen ist der Haken .rueck-verloren--neu
   (leiste.js) fuer bewegung.css — hier nur die ruhige Chip-Form. */
.rueck-verloren{display:inline-flex;align-items:center;gap:.4rem;
  font-family:var(--mono);color:var(--schlecht);
  background:color-mix(in srgb, var(--schlecht) 10%, transparent);
  border:1px solid color-mix(in srgb, var(--schlecht) 30%, transparent);
  border-radius:999px;padding:.25rem .7rem;font-size:var(--tx-xs);}

/* --- Versuchsspur (Spec §4.3) ---------------------------------------------
   .rueck-versuchsspur ist die durchgestrichene Mono-Nummer VOR jeder
   Massnahme (ansicht-support.js: listeAufbauen()); .massnahme--falsch ist
   der bestehende Haken aus Aufgabe 3 (Spec §5.4), hier bekommt er endlich
   sein Aussehen: gedaempft, durchgestrichen — nicht mehr sendbar wirkend,
   ohne wirklich gesperrt zu sein (ein zweiter Versuch bleibt technisch
   moeglich, das Spiel verbietet ihn nicht). Das Zittern selbst (Spec §2.5)
   ist wieder bewegung.css. */
.rueck-versuchsspur{display:inline-block;min-width:1.4em;font-family:var(--mono);
  color:var(--text-3);font-size:var(--tx-xs);}
.massnahme--falsch{opacity:.6;}
.massnahme--falsch .rueck-versuchsspur{color:var(--schlecht);text-decoration:line-through;}

/* --- Haertefall Handy (Spec §0.3, Koordinator: "die Chateingabe beginnt
   103px unter der Falz") --------------------------------------------------
   Die volle Loesung — eigene Scrollbereiche in der Seitenspalte
   (grid-template-rows:auto 1fr auto, Spec §2.4) — ist Aufgabe 5
   (buehne.css, UI Designer): dort wird sie strukturell geloest, nicht hier
   geflickt. Diese Regel ist ein eigenstaendiger Zwischenschritt aus meinem
   Dateibereich, komponiert .chatform (nicht neu definiert) und macht das
   Feld auf JEDER Breite ohne Scrollen erreichbar — ganz ohne Breakpoint,
   der hier ohnehin verboten waere (Spec §5.2). Wird buehne.css die eigene
   Scroll-Loesung ergaenzen, wird diese Regel dort wirkungslos (die Seite
   scrollt dann gar nicht mehr als Ganzes) statt zu kollidieren. */
.chatform{position:sticky;bottom:0;background:var(--bg);z-index:1;}