dogfather-universe/workspace/treff-index.html

<!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 · Der Treff</title>
<!-- Die Beschreibung nennt WEDER Rollen NOCH Bereiche des Teams.
     Auf den beiden anderen Waenden steht dort, wofuer sie da sind, und
     das ist dort richtig: Wer sie liest, gehoert ohnehin dazu. Hier
     steht ein Mensch, der NICHT zum Team gehoert. Was er auf der
     Anmeldeseite liest, ist das Einzige, was er ueber das Haus
     erfaehrt, solange er den Code nicht hat.

     UND DIESER KOMMENTAR HAT SICH SELBST ERWISCHT (11.09.2026): Er
     zaehlte urspruenglich als Beispiel auf, was auf der anderen Wand
     steht -- und nannte dabei eine Rolle des Hauses, in einer Datei,
     die jeder Besucher des Treffs im Quelltext lesen kann. Gefunden
     hat das nicht das Auge, sondern eine Zeile in pruef-treff, die
     genau danach sucht. Ein Kommentar in einer ausgelieferten Datei
     ist kein Notizzettel. -->
<meta name="description" content="Der Treffpunkt rund um DogFather. Zugang nur mit persönlichem Code." />
<meta name="robots" content="noindex, nofollow" />
<link rel="manifest" href="/workspace/app.webmanifest" />
<!-- Derselbe Ton wie die Kopfleiste dahinter, damit Fensterleiste und
     Seite eine Flaeche sind statt zweier. -->
<meta name="theme-color" content="#06090f" />

<!-- Quer- und Hochformat getrennt vorgeladen, damit das Handy nicht die
     grosse Fassung zieht. WebP und nicht AVIF: Der ausliefernde Express 4
     bringt eine MIME-Tabelle ohne AVIF mit, die Dateien kaemen als
     application/octet-stream an und wuerden wegen nosniff verweigert --
     die Buehne bliebe leer. (Ausfuehrlich in crew-index.html.) -->
<link rel="preload" as="image" href="assets/img/buehne/treff-gate-1920.webp"
      type="image/webp" media="(min-width: 900px)" />
<link rel="preload" as="image" href="assets/img/buehne/treff-gate-hoch-580.webp"
      type="image/webp" media="(max-width: 899px)" />

<!-- DASSELBE APP-SYMBOL WIE TEAM DOGI, und das ist kein Sparen.
     Es zeigt den Husky -- das Zeichen des HAUSES, nicht das einer
     Rolle. Wer den Treff auf seinen Startbildschirm legt, legt sich
     Dogis Zeichen dorthin, und genau das ist gemeint. Unterschieden
     werden die beiden Apps durch den NAMEN darunter ("Der Treff" gegen
     "Team Dogi"), und niemand hat beide: Ein Konto der Community kommt
     auf crew. nicht herein, ein Konto des Teams hier nicht. -->
<link rel="icon" type="image/png" href="/assets/img/app-symbole/crew-32.png?v=202609111804" />
<link rel="apple-touch-icon" href="/assets/img/app-symbole/crew-180.png?v=202609111804" />
<link rel="stylesheet" href="assets/css/gate.css?v=202609111804" />
<!-- Diese Wand steht NUR auf der Adresse des Treffs (ueberall sonst 404,
     siehe treffWeiche). 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=202609111804" />
</head>

<!-- ====================================================================
     `gate--crew` IST HIER KEIN VERSEHEN (11.09.2026).

     Darin stehen die Abweichungen, die aus der UMGEFAERBTEN Buehne
     folgen: Der Anmeldeknopf laeuft von Lila nach Babyblau statt von
     Rot nach Blau, und die Karte nimmt die Farben des gemalten Rahmens
     auf -- ringsum blau. Die Buehne des Treffs ist dieselbe Szene in
     derselben Farbe; jede dieser Abweichungen gilt hier wortgleich.

     Eine eigene Klasse `gate--treff` waere eine Kopie derselben Werte
     gewesen. Beim naechsten Nachbessern des Knopfes haette jemand eine
     der beiden verbessert -- und das ist genau der Fehler, gegen den
     in diesem Haus die halbe Dokumentation geschrieben ist.

     `data-rolle` sagt dem Anmeldeskript, wofuer diese Wand da ist.
     Ohne Kachelreihe kaeme sonst eine leere Rolle beim Server an, und
     der antwortet darauf wie auf einen falschen Code: 401, ohne dass
     irgendwo etwas kaputt ist.
     ================================================================= -->
<body class="gate gate--crew gate--treff" data-rolle="gast">

<!-- ---------- Bühne: Bild + Schleier ---------------------------------- -->
<div class="buehne" aria-hidden="true">
  <picture>
    <source media="(min-width: 900px)" type="image/webp"
            srcset="assets/img/buehne/treff-gate-960.webp 960w,
                    assets/img/buehne/treff-gate-1280.webp 1280w,
                    assets/img/buehne/treff-gate-1600.webp 1600w,
                    assets/img/buehne/treff-gate-1920.webp 1920w,
                    assets/img/buehne/treff-gate-2560.webp 2560w" sizes="100vw" />
    <source type="image/webp"
            srcset="assets/img/buehne/treff-gate-hoch-440.webp 440w,
                    assets/img/buehne/treff-gate-hoch-580.webp 580w,
                    assets/img/buehne/treff-gate-hoch-900.webp 900w" sizes="100vw" />
    <img class="buehne__bild" src="assets/img/buehne/treff-gate-1280.webp" alt=""
         width="1647" height="955" fetchpriority="high" decoding="async" />
  </picture>
  <div class="buehne__schleier"></div>
</div>

<!-- ---------- Tafel ----------------------------------------------------
     Der Anker rechnet die Cover-Geometrie des Bildes nach, damit die
     Karte in der GEMALTEN Tafel sitzt und nicht ungefaehr dort. Er
     faengt keine Klicks ab; nur die Karte darin ist bedienbar.
     (Herleitung in crew-index.html und gate.css.) -->
<div class="tafel-anker">
<main class="tafel" id="tafel">
  <div class="tafel__kante" aria-hidden="true"></div>

  <!-- EIN NAME, KEIN PAAR.

       Die Wand von Team Dogi setzt oben "DogFather × Team Dogi" -- zwei,
       die das zusammen machen. Hier waere dasselbe falsch: Der Treff
       gehoert nicht DogFather und der Community gemeinsam, er ist der
       Ort, an dem sie sich treffen. Deshalb steht oben nur das Haus und
       darunter der Raum. -->
  <header class="kopf">
    <p class="marke marke--paar">
      <span class="marke__crew">DogFather&nbsp;Universe</span>
    </p>
    <h1 class="titel">Der&nbsp;Treff</h1>
    <p class="unterzeile">Schön, dass du da bist. Gib deinen Code ein.</p>
  </header>

  <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>

  <!-- KEIN "NOCH KEINEN CODE? HIER ANFRAGEN".

       Das waere die naheliegende Zeile und genau die falsche: Sie macht
       aus einer verborgenen Adresse eine oeffentliche Anmeldestelle,
       und jeder, der die Adresse errät, haette einen Weg, Aufmerksamkeit
       zu verlangen. Codes werden persoenlich vergeben -- wer keinen hat,
       hat hier auch nichts zu klaeren. -->
  <p class="fuss">
    Verschlüsselte Verbindung · Zugriffe werden protokolliert
  </p>
</main>
</div>

<script src="assets/js/gate.js?v=202609111804" defer></script>
</body>
</html>