/* ── Start Screen (Layout auch für #screen-loading, s. unten) ── */
    #screen-start, #screen-loading {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      /* Platz für die fixed positionierte Mascot-Figur unten links reservieren,
         damit die Zentrierung des Inhalts nie damit kollidiert (s. --companion-reserve).
         Um --start-content-lift reduziert: rückt den zentrierten Inhalt bewusst
         etwas näher ans Maskottchen statt toten Leerraum darüber zu lassen.
         Gilt auch für #screen-loading, das die Figur+Blase mitnutzt (s. updateSpontiForScreen) —
         die screen-spezifische Regel weiter unten darf padding-bottom daher nicht zurücksetzen. */
      padding-bottom: calc(var(--companion-reserve) - var(--start-content-lift));
    }

    #screen-start.screen.active { display: flex; }