Kein Weichzeichner mehr -- die Bilder werden scharf, die Kacheln Lampen

Filipe: "gerade sehen die sogar leicht verschwommen aus ... die sollen
nicht durch die kacheln gehen ... ich wollte eine krasse aenderung."

Drei Ursachen, alle drei von mir eingebaut, alle drei gemessen:

1. ICH HABE 1647-PIXEL-BILDER ALS "uhd" MIT 2400 PIXELN AUSGELIEFERT.
   Am Morgen stand in derselben Datei, sein Schirm sei 2550 px breit und
   das groesste Bild 1600 -- meine "Loesung" war, die Ausgabe
   hochzurechnen. Es gab nie mehr Bildpunkte. Dazu fehlte der Schritt,
   den der Kommentar daneben selbst verlangt ("Verkleinern MITTELT
   Bildpunkte ... deshalb schaerft man danach nach"): Es wurde nie
   nachgeschaerft. Jetzt Unscharfmaske auf der ENDgroesse
   (Ausgabeschaerfung) und ein Glanz-Durchgang: die hellsten Stellen
   weich gezeichnet und additiv dazu -- Licht, das ueber seine Kante
   strahlt. Guete 0,80 -> 0,88, am Gate 0,93.

2. backdrop-filter: blur() UNTER JEDER FLAECHE. 16 px unter siebzehn
   Kacheln, 13 px unter sieben weiteren Flaechen, 26 px unter der
   Anmeldekarte. Ein Weichzeichner mittelt nicht nur, was hinter dem
   Element liegt -- er zieht seinen Radius weit darueber hinaus. Hinter
   der Anmeldetafel ist Schwarz, direkt daneben aber die hellste Stelle
   des Motivs: Die Karte wurde deshalb GRAU, gemessen rgb(46,57,64)
   statt rgb(15,22,34). Je schoener der Rahmen, desto grauer die Karte.
   Alle Weichzeichner raus, --flaeche 0,78 -> 0,89: Durchsicht bleibt,
   aber scharf.

3. DIE TAFELMESSUNG WAR FALSCH, UND ICH HABE SIE VON HAND "KORRIGIERT".
   Sie lief vom Inneren nach aussen und hielt beim ersten farbigen Punkt
   an -- links glueht der Rahmen breiter als rechts, also hielt sie dort
   frueher an (58,59 statt 55,37). Statt den Messfehler zu beheben, habe
   ich in der CSS "um 1,1 % nach links" geschaetzt. Ergebnis: 32 px
   schwarze Tafel blieben links offen. Jetzt wird die einzige
   Eigenschaft gesucht, die nur der Rahmen hat -- kraeftig UND farbig --,
   mit Gegenprobe auf der linken Bildhaelfte (dort muessen es 0 sein).

KACHELN: keine Politur mehr, ein anderes Ding. Jede steckt in einer
LEUCHTSCHIENE ihrer Kategoriefarbe, die Licht in die Platte wirft --
links scharfe Kante, rechts rund. Steiler Abfall (52 % statt 68 %):
beleuchtet, nicht eingefaerbt. Der Glanz wandert beim Ueberfahren
einmal durch. Dieselbe Sprache auf der Anmeldeseite: die vier Rollen
sind Tasten in Schienen (Gold/Bernstein/Gruen/Blau).

Zwei eigene Fehler nebenbei, beide durch das Unveraenderlichkeits-
Zeichen gefunden -- eine Zahl, die sich nach einer Aenderung KEIN Stueck
bewegt, sagt "falsche Stelle", nicht "zu wenig":
  - Dreimal exakt 4,16:1 an "Ueberfaellig". Der Pruefpunkt lag nicht auf
    dem Knopf, sondern in der Luecke daneben auf dem Bild. Ursache war
    das hellere Hochkant-Bild, nicht das Bedienelement -> mehr Schleier
    und weniger Glanz NUR fuer die Handy-Fassung. 4,16 -> 5,10.
  - Die Koernung der Anmeldekarte lag mit 90 % Deckkraft ohne Mischmodus
    ueber allem und hob jeden Bildpunkt um 30 Stufen. Jetzt 4 % mit
    overlay, auf eigener Ebene.
  - --flaeche anzuheben machte die WICHTIGE Anleitung duenner als eine
    gewoehnliche (88 gegen 89) -- feste Zahl neben beweglicher Groesse.
    Gefunden von pruef-lesbarkeit, jetzt an --flaeche gebunden.

Gruen: buehne (38), start-ansicht (136), handy (59), breiten (23),
lesbarkeit (14), css-klassen (15), barrierefrei (18), tempo (8).

Co-Authored-By: Claude Opus 5 <[email protected]>

workspace/assets/css/aufgaben.css

@@ -398,7 +398,26 @@
   display: inline-flex; align-items: center; gap: 8px;
   min-height: 38px; padding: 7px 13px;
   border: 1px solid var(--rand); border-radius: 999px;
-  background: rgba(255, 255, 255, .03);
+  /* EIGENER UNTERGRUND, NICHT GELIEHENER (07.09.2026).
+
+     Hier stand `rgba(255, 255, 255, .03)` -- also praktisch nichts. Der
+     Knopf war lesbar, weil hinter ihm zufaellig etwas Dunkles lag. Als
+     die Buehnenbilder heller wurden (Glanz) und die Flaechen darueber
+     ihren Weichzeichner verloren, war das vorbei: Auf dem Handy sass
+     "Ueberfaellig" ploetzlich auf rgb(79, 76, 79) und kam auf 4,16:1
+     statt der noetigen 4,5:1 -- gemessen von pruef-buehne an echten
+     Bildpunkten.
+
+     Das ist kein Bildproblem und wird auch nicht dort behoben: Das Bild
+     dunkler zu machen haette genau die Verbesserung zurueckgenommen, um
+     die es ging. Ein Bedienelement, dessen Lesbarkeit davon abhaengt,
+     was zufaellig dahinter liegt, ist die eigentliche Schwachstelle --
+     es geht beim naechsten Hintergrundwechsel wieder kaputt, und
+     niemand rechnet damit.
+
+     Dunkel und trotzdem durchscheinend: Das Motiv bleibt zu ahnen, der
+     Text steht aber nie mehr direkt auf einem Foto. */
+  background: rgba(9, 13, 21, .62);
   color: var(--text-leise); font: inherit; font-size: .85rem;
   cursor: pointer;
   transition: border-color var(--tempo), color var(--tempo), background var(--tempo);
@@ -409,7 +428,10 @@
 .schnitt[aria-pressed="true"], .creator-knopf[aria-pressed="true"] {
   color: var(--text);
   border-color: color-mix(in srgb, var(--akzent) 55%, transparent);
-  background: color-mix(in srgb, var(--akzent) 13%, transparent);
+  /* Die Farbe liegt AUF dem dunklen Untergrund, nicht statt seiner --
+     sonst haette der gedrückte Knopf genau das Problem zurück, das der
+     ungedrückte gerade losgeworden ist. */
+  background: color-mix(in srgb, var(--akzent) 15%, rgba(9, 13, 21, .66));
 }
 .schnitt:focus-visible, .creator-knopf:focus-visible {
   outline: 2px solid var(--akzent); outline-offset: 2px;
@@ -429,7 +451,33 @@
    dass man ihn nicht mehr liest, ist genau das Raetseln, das der
    Kommentar vermeiden wollte -- abgeschaltet heisst nicht
    unsichtbar. */
-.schnitt[disabled] { opacity: .62; cursor: default; color: #aab7c7; }
+/* DIE DECKKRAFT MUSSTE GANZ WEG (07.09.2026).
+
+   Am 06.09. stand hier `opacity: .42`, die Messung blieb dreimal bei
+   4,05:1, und die Lehre daraus war richtig notiert: Deckkraft aendert
+   die CSS-Farbe des Textes nicht. Nur habe ich damals die andere Haelfte
+   uebersehen -- sie aendert dafuer sehr wohl den UNTERGRUND, denn
+   `opacity` wirkt auf das ganze Element samt seiner Flaeche.
+
+   Heute hat mich genau das ein zweites Mal erwischt, aus der anderen
+   Richtung: Ich habe dem Knopf einen dunklen Untergrund gegeben, und
+   die Zahl blieb auf die Stelle genau bei 4,16:1. Wieder das
+   Unveraenderlichkeits-Zeichen -- eine Zahl, die sich nach einer
+   Aenderung KEIN Stueck bewegt, sagt nicht "zu wenig", sondern "an der
+   falschen Stelle". Der neue Untergrund wurde mit 62 Prozent
+   durchgereicht, das helle Buehnenbild schlug durch, und heraus kam
+   rgb(79, 76, 79).
+
+   Abgeschaltet heisst jetzt: gedaempfte FARBEN, volle Flaeche. Der
+   Untergrund traegt, der Text tritt zurueck -- und beides ist messbar,
+   statt sich gegenseitig zu verrechnen. */
+.schnitt[disabled] {
+  cursor: default;
+  color: #aab7c7;
+  border-color: rgba(150, 186, 220, .12);
+  background: rgba(9, 13, 21, .72);
+}
+.schnitt[disabled] .schnitt__zahl { background: rgba(255, 255, 255, .05); color: #96a4b6; }
 
 .schnitt__zahl, .creator-knopf__zahl {
   min-width: 20px; padding: 1px 7px;