/* ════════════════════════════════════════════════════════════════
   guest_onboarding.css — Namensfenster des Gastmodus
   ────────────────────────────────────────────────────────────────
   Nur das Fenster, das nach dem Namen fragt. Scheinwerfer und
   Sprechblase der Einführung stehen in onboarding_tour.css — die
   braucht auch die Einführung für angemeldete Nutzer.

   Das Fenster benutzt bewusst KEINE eigenen Klassen, sondern die des
   Diagramm-Dialogs (.editor-modal-overlay / .editor-card /
   .editor-input …). So sieht es aus wie jedes andere Fenster der
   Anwendung und folgt automatisch jedem Themenwechsel. Hier stehen
   nur die wenigen Ergänzungen, die es zusätzlich braucht.
   ════════════════════════════════════════════════════════════════ */

.gname-sub {
    font-size: 13px;
    line-height: 1.55;
    color: rgba(56, 71, 79, 0.72);
    margin: -12px 0 20px;
}
[data-theme="dark"] .gname-sub { color: rgba(232, 234, 240, 0.66); }

.gname-hint {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 16px;
    padding: 11px 13px;
    border-radius: 12px;
    background: rgba(79, 103, 115, 0.07);
    font-size: 12px;
    line-height: 1.5;
    color: rgba(56, 71, 79, 0.75);
}
[data-theme="dark"] .gname-hint {
    background: rgba(255, 255, 255, 0.07);
    color: rgba(232, 234, 240, 0.7);
}
.gname-hint svg { flex: 0 0 auto; margin-top: 1px; opacity: 0.55; }

/* Der Weiter-Knopf trägt einen Pfeil — deshalb Flex statt Blockschrift. */
.gname-next {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}