Files
dogfather-universe/workspace/crew-index.html
T
DogFatherGitandClaude Opus 5 c00c209ac9 Dogen statt Geld -- und die Texte schreiben die Leute selbst
Filipe, 28.09.2026:
  "der text der dazu erscheint sollen die leute selber schreiben
   koennen. soll auf nicht zu viel aber auch nicht zu wenig
   schreiben koennen. aber es sollen personalisierte texte sein von
   den leuten selbst."
  "mann soll nie die summe sehen sondern die dogen auch mit dem
   symbol ... es soll auch nie geld da stehen sondern Dogen."
  "ich will dass die den leuten auch als punkte hinzugefuegt werden."

DER TEXT KOMMT VON DEM, DER GIBT

Bisher konnte ihn nur die Leitung tippen; beim Melden schickte der
Zuschauer gar nichts mit. Jetzt stehen nach dem Tippen auf einen
Betrag zwei Felder da: Name auf der Karte (mit dem eigenen Namen
vorausgefuellt) und der eigene Text, bis 140 Zeichen.

140 ist gemessen, nicht geraten: Die Karte steht je nach Stufe sechs
bis elf Sekunden. Bei 140 Zeichen sind das zwei bis drei Zeilen -- die
fasst man im Vorbeischauen. Bei 200 wird die Schrift auf einer kleinen
Karte so eng, dass niemand mehr hinsieht, und ein Gruss, den keiner
liest, ist schlechter als ein kurzer. Der Zaehler erscheint erst ab
30 uebrigen Zeichen; einer, der von Anfang an mitlaeuft, macht aus
einem Gruss eine Aufgabe.

UND EINE SCHRANKE DAVOR. Der Text kommt von einem Fremden und steht
gleich im Livestream. Er laeuft ohnehin durch die Bestaetigung -- neu
ist, dass die Leitung ihn dort AENDERN kann. Ohne das bliebe nur "ganz
ablehnen", und dann faellt wegen eines Wortes eine echte Spende unter
den Tisch.

NIE WIEDER GELD AUF DEM BILDSCHIRM

Ein Doge sind zehn Euro (Filipes Angabe "1 euro sind 0,10 dogen",
rueckgefragt und bestaetigt -- zwischen den beiden Lesarten liegt der
Faktor 100). Gerechnet wird in Tausendsteln, nie in Kommazahlen.

Das Entscheidende ist nicht die Beschriftung: DER BROWSER BEKOMMT
KEINEN EURO-BETRAG MEHR, auch nicht verborgen im JSON. Der Kurs steht
einmal auf dem Server. Was nicht gesendet wird, kann an keiner Stelle
versehentlich erscheinen, und niemand muss daran denken. Gemessen:
38 Felder im Stand, kein Geldfeld, kein Eurozeichen, auch nicht auf
der Buehnentafel. Der einzige Ort, an dem noch ein Euro entsteht, ist
die PayPal-Adresse -- weil PayPal ihn braucht.

DIE PUNKTE: EIN BUCH, KEIN ZAEHLER

Ein Feld `dogen` an der Person waere kuerzer gewesen -- und die zweite
Antwort auf dieselbe Frage. Der Stand IST die Summe der Buchungen, und
eine Summe kann sich nicht von ihren Posten entfernen. Weil Filipe
spaeter etwas daran haengen will ("spezielle sachen ... wo mit diesen
dogpunkten zu tun hat"), steht neben jeder Zeile ein Grund und ein
Datum: Ein Zaehler, der kleiner wird, laesst keine Frage mehr
beantworten.

Dass nie doppelt gutgeschrieben wird, entscheidet ein eindeutiger
Index in der Datenbank und keine Bedingung im Programm -- "nochmal
zeigen" und ein wiederholter Strom koennen es damit gar nicht
ausloesen.

Ohne Person keine Punkte: Eine von Hand eingetragene Spende hat oft
nur einen Vornamen auf dem Handy. Daraus eine Person zu RATEN waere
schlimmer als keine Gutschrift -- deshalb waehlt die Leitung sie aus,
und tut sie es nicht, laeuft die Karte trotzdem.

DAS SYMBOL IST VORBEREITET

Filipe: "die symbole schick ich dir spaeter." Es wird im Regiepult
hochgeladen, ohne Deploy -- bis dahin steht eine gezeichnete Muenze
da. Es liegt bei den Stufenbildern, weil das der einzige Weg ist, der
Bilder OHNE Anmeldung ausliefert; sonst fehlte es ausgerechnet im
Stream.

=======================================================================
UND EINE REPARATUR AN DEM, WAS HEUTE MITTAG LIVE GING

Seit 3fedeea7 war der Buehnenmodus (reaktion.html?nur=buehne) kaputt:
Leinwand null Pixel hoch, im Stream ein schwarzes Bild. Das ist die
Fensterquelle fuer den Fall, dass Gaeste im Bild sind.

Ursache: Teil A hat die Zeilen des Saals festgenagelt (#teil-live auf
Zeile 2). Im Buehnenmodus stand aber seit jeher eine eigene Regel, die
dem Saal nur EINE Zeile gibt -- das Video landete in einer impliziten
Zeile, die sich nach ihrem Inhalt bemisst, waehrend die Leinwand ihre
Hoehe aus der Zeile nimmt. Beide warten aufeinander, heraus kommt
null.

Das ist heute der VIERTE Fall von "zwei Regeln fuer dieselbe Frage"
(Tafeln, Saalzeilen, Kamerabreite, Buehnenmodus). Die Loesung ist
jedes Mal dieselbe: nicht die zweite Regel richtig stellen, sondern
sie abschaffen.

DREI DINGE, DIE DARAN LEHRREICH SIND:

1. MEINE EIGENE PRUEFUNG WAR GRUEN UND WERTLOS. Ich hatte nach Teil A
   extra geprueft: "genau eine Regel bestimmt die Zeilen des Saals".
   Sie verlangte, dass die Zeile mit `.saal` BEGINNT -- und hat
   `body[data-nur="buehne"] .saal { … }` deshalb nie gesehen. Jetzt
   zaehlt sie jede Regel, in deren Auswahl `.saal` vorkommt, mit einer
   Gegenprobe, die eine eingeschobene zweite wirklich findet.

2. EINE SEITE MIT ZWEI ANSICHTEN BRAUCHT BEIDE MESSUNGEN. Nach Teil A
   liefen `pruef-buehne` (Schnittstelle) und `mess-reaktion` (normale
   Ansicht). `mess-buehne` -- die einzige, die diese Ansicht
   ueberhaupt oeffnet -- lief nicht.

3. EIN PYTHON-SKRIPT, DAS ERST AM ENDE SCHREIBT, MELDET "ok" FUER
   AENDERUNGEN, DIE NIE ANKOMMEN. Eine fehlgeschlagene Zusicherung hat
   einen ganzen Stapel verworfen, obwohl die erste Aenderung schon
   bestaetigt war. Die Messung meldete daraufhin "Auf der Karte steht:
   undefined" -- kein Fehler im Code, sondern eine Zeile, die nie
   geschrieben wurde. Gefunden hat es die Messung, nicht das Lesen.

pruef-spenden 136/0 (vorher 95) - pruef-reaktion 321/0 -
pruef-buehne 36/0 - pruef-css-klassen ok - pruef-tippziele 11/0 -
mess-reaktion und mess-buehne ohne Beanstandung

Co-Authored-By: Claude Opus 5 <[email protected]>
2026-09-28 18:54:02 +02:00

466 lines
22 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
<title>Anmeldung · DogFather Universe</title>
<!-- WEDER "Arbeitsbereich" NOCH "die Modis" (11.09.2026).
Seit die Community durch diese Wand kommt, liest sie auch diesen
Satz. "Privater Arbeitsbereich fuer DogFather und die Modis" waere
fuer sie schlicht falsch -- und das Erste, was sie ueber das Haus
erfaehrt. -->
<meta name="description" content="Privater Bereich rund um DogFather. Zugang nur mit persönlichem Code." />
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<!-- Die Farbe der Fensterleiste, wenn der Workspace als App laeuft.
Stand auf #0674b9 (kraeftiges Blau) und stach damit als einziger
heller Balken ueber einer durchweg dunklen Seite. Jetzt derselbe
Ton wie die Kopfleiste darunter (#06090f), damit Leiste und Seite
eine Flaeche sind statt zweier. -->
<meta name="theme-color" content="#06090f" />
<!-- Die Bühne ist der erste Eindruck. Ohne diesen Hinweis lädt der Browser sie erst,
nachdem er das CSS gelesen hat - das kostet spürbar Zeit. Quer- und Hochformat
sind getrennt, damit das Handy nicht die große Fassung zieht.
Hier steht bewusst WebP und nicht AVIF, obwohl die AVIF-Fassungen erzeugt
werden und rund ein Drittel kleiner wären: Der ausliefernde Server läuft auf
Express 4, dessen `send` eine alte MIME-Tabelle ohne AVIF mitbringt. Die
Dateien kämen als application/octet-stream an und würden wegen des
nosniff-Headers vom Browser verweigert - die Bühne bliebe leer. Sobald der
Workspace einen eigenen Server bekommt, kann AVIF wieder eingeschaltet
werden (die Dateien liegen bereit). -->
<link rel="preload" as="image" href="assets/img/buehne/crew-gate-1920.webp"
type="image/webp" media="(min-width: 900px)" />
<link rel="preload" as="image" href="assets/img/buehne/crew-gate-hoch-580.webp"
type="image/webp" media="(max-width: 899px)" />
<link rel="icon" type="image/png" href="/assets/img/app-symbole/crew-32.png?v=202609281853" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/crew-180.png?v=202609281853" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609281853" />
<!-- Diese Wand steht NUR auf der Adresse von Team Dogi (ueberall sonst
404, siehe crewWeiche). Sie darf das Haus deshalb direkt nennen
statt ueber den Platzhalter haus.css zu gehen -- und sie MUSS es:
Eine Zugangswand, die sich erst nach dem Umbiegen faerbt, waere
die eine Seite, auf der man das Umfaerben sieht. -->
<link rel="stylesheet" href="assets/css/crew-haus.css?v=202609281853" />
</head>
<body class="gate gate--crew">
<!-- ====================================================================
DIE DREI ZEICHEN DIESER WAND (10.09.2026)
Filipe: "3 rollen. dogfather. rechte hand und modis."
Von den fuenf Zeichen der anderen Wand bleibt nur der Husky -- die
uebrigen gehoeren zu Rollen, die es hier nicht gibt, und ihre
Namen haetten im Quelltext nichts verloren.
DER HUSKY BEI DOGFATHER UND BEI DER RECHTEN HAND, die Pfote bei
den Modis (Filipe, 10.09.2026, mit Bildschirmfoto: "bei rechte
hand soll der husky sein und bei modis soll die pfote sein").
DAS DREHT EINE FRUEHERE VORGABE UM, und der Grund gehoert dazu: Am
09.09. hiess es "das modi symbol soll das gleiche sein wie bei
dogfather" -- damals gab es hier zwei Rollen, und der Satz
bedeutete "die Modis gehoeren zu Dogi, nicht zur Agentur". Mit
drei Rollen sagt dieselbe Absicht etwas anderes: Der Husky steht
bei den beiden, die den Ueberblick haben, die Pfote bei denen, die
taeglich unterwegs sind. Zwei gleiche Zeichen und ein anderes --
das liest sich als Gruppe, nicht als Reihe.
Die Pfote traegt bei 22 px, weil es fuenf klar getrennte Flaechen
sind und keine Innenzeichnung -- dasselbe Argument, mit dem auf der
anderen Wand eine Silhouette einem geschliffenen Koerper gewichen
ist.
================================================================= -->
<svg width="0" height="0" style="position:absolute;overflow:hidden" aria-hidden="true"><defs>
<!-- ================================================================
DIE KRONE BEI DOGFATHER (22.09.2026)
Filipe: "bei dogi soll kein husky sein sondern eine krone. die
auch extrem auffaellt damit man den unterschied extrem
erkennt."
WARUM ES NOETIG WAR: Drei der fuenf Rollen auf dieser Wand
trugen denselben Husky -- DogFather, rechte Hand, linke Hand.
Drei gleiche Zeichen untereinander sind kein Zeichen mehr,
sondern Tapete; man liest dann nur noch die Namen, und dafuer
braucht es kein Bild.
WARUM GOLD UND NICHT DER ROLLENTON: Die anderen vier Zeichen
sind blau bis blaugrau (Husky silbern, Pfote blau, Community
blaugrau). Eine Krone im selben Farbkreis waere eine andere
FORM, aber kein anderer Eindruck. Gold ist der einzige Ton im
Haus, der hier nicht schon vergeben ist -- und der, den eine
Krone ohnehin hat. Es sind die vorhandenen Hausfarben
(--k-gold-Familie), kein neuer Ton und kein Leuchten: Die Wand
bleibt augenschonend, der Unterschied kommt aus Form und
Farbkreis, nicht aus Helligkeit.
UND WAS SIE NICHT HEISST: Der Untertitel bleibt "Ueberblick &
Entscheidungen" -- eine AUFGABE, kein Rang. Das Zeichen sagt
hier "das ist die Rolle, die du suchst", nicht "der steht ueber
den anderen". Genau deshalb aendert sich am Text nichts und die
vier anderen Rollen behalten ihre Zeichen unveraendert.
================================================================ -->
<linearGradient id="rs-krone" x1=".1" y1="0" x2=".7" y2="1">
<stop offset="0" stop-color="#ffe9b8"/>
<stop offset=".42" stop-color="#e8c07d"/>
<stop offset="1" stop-color="#b8863c"/>
</linearGradient>
<linearGradient id="rs-krone-band" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#f3d79b"/>
<stop offset="1" stop-color="#a9762f"/>
</linearGradient>
<g id="r-krone">
<!-- Der Koerper: fuenf Zacken. Die Taeler sind bewusst tief (bis
y=12), damit die Silhouette auch bei 22 px noch als Krone und
nicht als Zackenband gelesen wird. -->
<path fill="url(#rs-krone)"
d="M4.55 16.4 3.55 7.35 8.15 11.95 12 4.85 15.85 11.95 20.45 7.35 19.45 16.4 Z"/>
<!-- Die Kugeln auf den drei hohen Zacken. Sie sind das, was eine
Krone von einem Zackenrad unterscheidet. -->
<circle fill="url(#rs-krone)" cx="3.55" cy="6.6" r="1.5"/>
<circle fill="url(#rs-krone)" cx="12" cy="4.1" r="1.75"/>
<circle fill="url(#rs-krone)" cx="20.45" cy="6.6" r="1.5"/>
<!-- Das Band. Eigener Verlauf, dunkler nach unten -- ohne ihn
verschmilzt es mit dem Koerper zu einer Flaeche. -->
<rect fill="url(#rs-krone-band)" x="3.75" y="16.5" width="16.5" height="3.55" rx="1.3"/>
<!-- Drei Steine im Band. Der mittlere groesser, damit das Auge
eine Mitte hat. -->
<circle fill="#5f3c12" opacity=".55" cx="7.6" cy="18.3" r=".75"/>
<circle fill="#5f3c12" opacity=".55" cx="12" cy="18.3" r=".95"/>
<circle fill="#5f3c12" opacity=".55" cx="16.4" cy="18.3" r=".75"/>
<!-- Lichtkante oben links. Echtes Licht faellt nicht flaechig,
sondern auf eine Kante -- dieselbe Ueberlegung wie beim
Lichtstreifen auf dem Pfotenballen. -->
<path fill="rgba(255,255,255,.42)"
d="M4.75 15.2 4.0 8.6 6.1 10.7 Z"/>
</g>
<!-- Der Husky ist ein FOTO, kein Pfad. Der Filter zieht ihn auf zwei
Toene zusammen (dunkles Blaugrau -> Silber), damit er neben
gezeichneten Zeichen nicht wie ein Fremdkoerper wirkt. -->
<filter id="rs-husky-duo" color-interpolation-filters="sRGB">
<feComponentTransfer>
<feFuncR type="table" tableValues="0.165 0.910"/>
<feFuncG type="table" tableValues="0.212 0.933"/>
<feFuncB type="table" tableValues="0.267 0.965"/>
</feComponentTransfer>
</filter>
<g id="r-husky">
<image href="assets/img/marke-husky.webp" x="0" y="0" width="24" height="24"
preserveAspectRatio="xMidYMid meet" filter="url(#rs-husky-duo)"/>
<circle fill="#7ec8f2" cx="7.73" cy="12.1" r="1.05"/>
<circle fill="#16232f" cx="7.73" cy="12.1" r="0.52"/>
<circle fill="#ffffff" opacity=".85" cx="7.5" cy="11.85" r="0.2"/>
</g>
<!-- Der Ton der Pfote ist der Modi-Ton (#5f8a9f) nach oben
aufgehellt: dasselbe Blau wie das App-Symbol, nur heller, damit
es bei 22 px gegen den dunklen Grund steht. -->
<linearGradient id="rs-pfote" x1="0" y1="0" x2=".35" y2="1">
<stop offset="0" stop-color="#cfe4ef"/>
<stop offset=".55" stop-color="#8fb6c8"/>
<stop offset="1" stop-color="#5f8a9f"/>
</linearGradient>
<g id="r-pfote">
<ellipse fill="url(#rs-pfote)" cx="12" cy="15.9" rx="5.3" ry="4.4"/>
<ellipse fill="url(#rs-pfote)" cx="6.5" cy="10.1" rx="2" ry="2.6"
transform="rotate(-20 6.5 10.1)"/>
<ellipse fill="url(#rs-pfote)" cx="10.1" cy="7.4" rx="2.05" ry="2.7"/>
<ellipse fill="url(#rs-pfote)" cx="13.9" cy="7.4" rx="2.05" ry="2.7"/>
<ellipse fill="url(#rs-pfote)" cx="17.5" cy="10.1" rx="2" ry="2.6"
transform="rotate(20 17.5 10.1)"/>
<!-- Ein Lichtstreifen oben links auf dem Ballen -- ohne ihn ist er
eine flache Flaeche. -->
<path fill="rgba(255,255,255,.32)"
d="M8.4 13.6c1-1.3 2.6-2 4.2-1.9-1.7.5-3 1.6-3.6 2.9z"/>
</g>
<!-- DIE COMMUNITY (11.09.2026).
Zwei Figuren, keine einzelne. Das Zeichen EINER Person ist im
Haus schon vergeben; zwei Rollen mit demselben Zeichen heisst,
dass das Zeichen nichts mehr sagt.
(Und ja: Hier stand zuerst der Name jener anderen Rolle. Diese
Datei wird an jedes Mitglied der Community ausgeliefert, samt
Kommentaren -- eine Rolle der Agentur hat darin nichts verloren.
Gefunden hat das nicht das Auge, sondern pruef-crew-adresse, die
seit dem 10.09. genau danach sucht. Zum zweiten Mal an einem Tag,
und zum zweiten Mal in einem Kommentar, der erklaert, warum man
so etwas nicht schreibt.)
Die hintere Figur ist leiser gesetzt und teilweise verdeckt -- das
ist keine Zierde: Bei 22 px verschmelzen zwei gleich helle Formen
zu einem Klecks. Erst der Helligkeitsunterschied macht daraus zwei
Menschen.
DERSELBE VERLAUF WIE DIE PFOTE, nicht der Husky-Filter: Die Pfote
steht bei denen, die taeglich unterwegs sind, der Husky bei denen
mit dem Ueberblick. Die Community ist weder das eine noch das
andere -- sie bekommt die Farbe der Pfote und eine eigene Form.
Ein drittes Farbsystem auf einer Wand mit vier Kacheln waere
Unruhe ohne Aussage. -->
<g id="r-leute">
<circle fill="url(#rs-pfote)" opacity=".55" cx="15.9" cy="8.1" r="2.9"/>
<path fill="url(#rs-pfote)" opacity=".55"
d="M10.6 20.4v-2.2c0-2.6 2.4-4.3 5.3-4.3s5.3 1.7 5.3 4.3v2.2z"/>
<circle fill="url(#rs-pfote)" cx="9.2" cy="7.4" r="3.4"/>
<path fill="url(#rs-pfote)"
d="M2.8 20.4v-2.5c0-3 2.9-5 6.4-5s6.4 2 6.4 5v2.5z"/>
<path fill="rgba(255,255,255,.3)"
d="M6.6 5.6a3.4 3.4 0 0 1 3.6-1.4c-1.4.3-2.5 1.2-3 2.4z"/>
</g>
</defs></svg>
<!-- ---------- Bühne: Bild + Schleier ---------------------------------- -->
<div class="buehne" aria-hidden="true">
<picture>
<!-- BIS 2560 PIXEL (07.09.2026). Vorher endete die Reihe bei 1600 --
auf einem 2550 px breiten Schirm rechnete der Browser das Bild
also um das 1,6-fache hoch, und jede Kante wurde weich. Genau
das sah man als "nicht hochwertig", ohne es benennen zu koennen.
Eine hoehere Bildguete haette daran nichts geaendert: Man kann
keine Bildpunkte zurueckholen, die nie ausgeliefert wurden.
Ueber srcset laedt trotzdem jeder nur die Stufe, die er
braucht -- ein Handy weiterhin 32 KB. -->
<source media="(min-width: 900px)" type="image/webp"
srcset="assets/img/buehne/crew-gate-960.webp 960w,
assets/img/buehne/crew-gate-1280.webp 1280w,
assets/img/buehne/crew-gate-1600.webp 1600w,
assets/img/buehne/crew-gate-1920.webp 1920w,
assets/img/buehne/crew-gate-2560.webp 2560w" sizes="100vw" />
<source type="image/webp"
srcset="assets/img/buehne/crew-gate-hoch-440.webp 440w,
assets/img/buehne/crew-gate-hoch-580.webp 580w,
assets/img/buehne/crew-gate-hoch-900.webp 900w" sizes="100vw" />
<img class="buehne__bild" src="assets/img/buehne/crew-gate-1280.webp" alt=""
width="1647" height="955" fetchpriority="high" decoding="async" />
</picture>
<div class="buehne__schleier"></div>
</div>
<!-- ---------- Tafel ----------------------------------------------------
DER ANKER (06.09.2026). Im Motiv steht rechts eine LEERE TAFEL mit
Neonrahmen -- dort gehoert die Anmeldekarte hinein, und zwar genau
hinein, nicht ungefaehr.
Das geht nur, wenn man weiss, wo die gemalte Tafel auf dem
Bildschirm landet. Das Bild liegt mit `object-fit: cover` darunter;
je nach Fensterform schneidet der Browser oben/unten oder
links/rechts etwas ab. Dieser Anker rechnet genau dieselbe
Cover-Geometrie noch einmal nach (siehe gate.css) -- er ist damit
deckungsgleich mit dem Bild, und die Karte kann in Prozent des
BILDES sitzen statt in Prozent des Fensters.
Er faengt keine Klicks ab (pointer-events: none); nur die Karte
darin ist bedienbar. -->
<div class="tafel-anker">
<main class="tafel" id="tafel">
<div class="tafel__kante" aria-hidden="true"></div>
<!-- 10.09.2026, Wunsch Filipe: hier soll alles auf DogFather und sein
Team zugeschnitten sein.
Zwei Namen und ein Zeichen dazwischen -- nebeneinander, nicht
uebereinander. Dogi steht hier nicht ueber den Modis, sie machen
das zusammen.
Das "x" steht als eigenes Element, damit es kleiner und in der
Zwischenfarbe gesetzt werden kann -- so liest man zwei Namen und
ein Zeichen dazwischen, nicht drei gleich laute Wörter. Es trägt
aria-hidden nicht: Vorgelesen wird "DogFather x Team Dogi", und
genau so spricht man es auch aus. -->
<header class="kopf">
<p class="marke marke--paar">
<span class="marke__dogi">DogFather</span>
<span class="marke__x">×</span>
<span class="marke__crew">Team&nbsp;Dogi</span>
</p>
<h1 class="titel">Team&nbsp;Dogi</h1>
<p class="unterzeile">Team Dogi und das Rudel. Zugang nur mit persönlichem Code.</p>
</header>
<div class="rollen" role="radiogroup" aria-labelledby="rollen-schild">
<p class="feldschild" id="rollen-schild">Womit meldest du dich an?</p>
<button type="button" class="rolle" data-rolle="admin" role="radio" aria-checked="false">
<svg class="rolle__zeichen rolle__zeichen--krone" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-krone"/></svg>
<span class="rolle__text">
<span class="rolle__name">DogFather</span>
<span class="rolle__zusatz">Überblick &amp; Entscheidungen</span>
</span>
</button>
<!-- Der Untertitel beschreibt eine AUFGABE, kein Recht -- dieselbe
Ueberlegung wie auf der anderen Wand: Wer vor der Auswahl
steht, fragt sich nicht, was er duerfte, sondern was er hier
tut. Und er stellt niemanden ueber jemanden: "vertritt und
koordiniert" ist eine Taetigkeit, kein Rang. -->
<button type="button" class="rolle" data-rolle="hand" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-husky"/></svg>
<span class="rolle__text">
<span class="rolle__name">Rechte Hand</span>
<span class="rolle__zusatz">Vertritt und koordiniert</span>
</span>
</button>
<!-- DIE LINKE HAND (21.09.2026).
SIE MUSS HIER STEHEN, SONST GIBT ES SIE NICHT. Die Anmeldung
sucht `WHERE rolle = ?` auf die angetippte Kachel. Ohne diese
Karte koennte sich eine linke Hand mit dem richtigen Code
NIEMALS anmelden -- und der Fehler saehe aus wie ein falscher
Code, nicht wie eine fehlende Kachel. Gemessen, nicht
angenommen: Es gibt auf dieser Wand keinen rollenuebergreifenden
Sonderweg.
DERSELBE HUSKY wie rechts: Beide tun dasselbe. Was sie
unterscheidet, gehoert nicht auf die Anmeldewand, sondern in
die Rollenauswahl bei den Personen -- hier steht nur, was
jemand HIER tut. -->
<button type="button" class="rolle" data-rolle="linke" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-husky"/></svg>
<span class="rolle__text">
<span class="rolle__name">Linke Hand</span>
<span class="rolle__zusatz">Vertritt und koordiniert</span>
</span>
</button>
<button type="button" class="rolle" data-rolle="modi" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-pfote"/></svg>
<span class="rolle__text">
<span class="rolle__name">Modi</span>
<span class="rolle__zusatz">Chat, Live und eigene Aufgaben</span>
</span>
</button>
<!-- DIE VIERTE KACHEL (Entscheidung Filipe, 11.09.2026).
Das Rudel ist kein eigenes Haus mehr, sondern ein Raum in
diesem. Damit kommt die Community durch DIESE Wand, und sie
braucht etwas zum Drauftippen.
SIE STEHT GANZ UNTEN, und das ist nicht Rangfolge, sondern
Haeufigkeit: Die drei darueber melden sich taeglich an, die
Community-Kachel wird von jedem Einzelnen genau einmal
gedrueckt und danach merkt sich der Browser die Wahl
(localStorage, siehe gate.js). Wer taeglich kommt, soll oben
finden, was er taeglich braucht.
DER UNTERTITEL BESCHREIBT EINEN ORT, KEINE RECHTE -- dieselbe
Ueberlegung wie bei den drei anderen: Wer vor der Auswahl
steht, fragt sich nicht, was er duerfte, sondern wo er
hinwill. -->
<button type="button" class="rolle" data-rolle="gast" role="radio" aria-checked="false">
<svg class="rolle__zeichen" viewBox="0 0 24 24" aria-hidden="true"><use href="#r-leute"/></svg>
<span class="rolle__text">
<span class="rolle__name">Community</span>
<span class="rolle__zusatz">Das Rudel</span>
</span>
</button>
</div>
<!-- ==== DAS ALTER (15.09.2026) ================================
Auf der Regelseite steht seit dem 11.09. „ab 18". Bis heute war
das ein Satz; jetzt ist es eine Bedingung.
Es erscheint nur bei der Community-Kachel: Wer zum Team gehört,
hat seinen Zugang von DogFather persönlich bekommen – da ist die
Frage vorher geklärt, und ein Häkchen an der Tür wäre nur im Weg.
Das Häkchen ist NICHT die Sicherung, es ist die Frage. Geprüft
und festgehalten wird sie am Server; hier steht sie nur so, dass
man sie liest, bevor man sie setzt. -->
<div class="alterfrage" id="alterfrage" hidden>
<label class="alterfrage__zeile">
<input type="checkbox" id="alter-ok" />
<span class="alterfrage__text">
Ich bin mindestens <strong id="alter-zahl">18</strong> Jahre alt.
</span>
</label>
</div>
<form class="formular" id="formular" novalidate>
<label class="feldschild" for="code">
Persönlicher Zugangscode <span class="fuer" id="fuer" hidden></span>
</label>
<div class="feld">
<input type="password" id="code" name="code" inputmode="text"
autocomplete="current-password" spellcheck="false"
placeholder="Code eingeben" aria-describedby="hinweis fehler" />
<button type="button" class="feld__auge" id="auge"
aria-label="Code anzeigen" aria-pressed="false">
<svg viewBox="0 0 24 24" aria-hidden="true">
<path class="strich" d="M2.5 12S6 5.8 12 5.8 21.5 12 21.5 12 18 18.2 12 18.2 2.5 12 2.5 12Z"/>
<circle class="strich" cx="12" cy="12" r="2.9"/>
<path class="strich durch" d="m4 20 16-16"/>
</svg>
</button>
</div>
<p class="hinweis" id="hinweis" hidden>Feststelltaste ist aktiv.</p>
<p class="fehler" id="fehler" role="alert" aria-live="polite"></p>
<button type="submit" class="knopf" id="knopf">
<span class="knopf__text">Anmelden</span>
<span class="knopf__laden" aria-hidden="true"></span>
</button>
</form>
<!-- EINE TÜR BRAUCHT EINE KLINGEL (ergänzt 19.09.2026).
Hier standen vier Kacheln, ein Feld „Code eingeben" und ein
Knopf. Wer keinen Code hat, fand keinen einzigen Satz, der ihm
sagt, was jetzt zu tun ist. Für die Community ist das besonders
teuer: Sie ist die einzige Rolle, die von außen kommt und
niemanden im Haus kennt. -->
<!-- ZWEI SORTEN MENSCHEN STEHEN HIER (ergaenzt 20.09.2026).
Der Satz galt nur der Community ("Frag im Live nach"). Ein
Modi oder die rechte Hand steht aber auf derselben Wand --
und wenn sein Code nicht geht, nennt ihm die Seite
niemanden, den er fragen koennte. Der Zusatz kostet eine
Zeile und schliesst die einzige Sackgasse, die es vor der
Anmeldung ueberhaupt geben kann. -->
<p class="fuss fuss--woher">Noch keinen Code? Frag im Live nach – Team&nbsp;Dogi gibt ihn dir persönlich.<br />
Gehörst du zum Team und dein Code geht nicht? Schreib DogFather – er macht dir einen neuen.</p>
<!-- DAS ANGEBOT ZUM INSTALLIEREN GEHOERT HIERHER (22.09.2026).
Filipe: "ich will einen installieren button. damit die leute es
viel einfacher haben die seite auf dem pc oder auf dem handy zu
installieren!!!"
Diese Seite ist die, auf der jeder zuerst landet -- und die
einzige, die keine Kopfleiste hat. Genau deshalb fehlte das
Angebot hier bisher ganz.
UNTER dem Anmelden-Knopf und nicht darueber: Wer hier ist, will
sich anmelden. Das Installieren ist das zweite Anliegen, nicht
das erste. Der Knopf ist von selbst weg, sobald die App liegt. -->
<p class="gate-install" data-install-platz></p>
<p class="fuss">
Verschlüsselte Verbindung · Zugriffe werden protokolliert
</p>
</main>
</div>
<script src="assets/js/gate.js?v=202609281853" defer></script>
<script src="assets/js/installieren.js?v=202609281853" defer></script>
</body>
</html>