/* melognite-splash-kontrast.css  bk1  (08.10.2026, Auftrag betalogin, Akte docs/roadmap/betalogin-2026-10-08/BEFUND.md)
   NUR fuer Seiten mit DUNKLEM Splash (Beta: house, dnb, hiphop + Werkbaenke house-auth, dnb-auth, hiphop-auth).
   Owner 08.10.2026: "Es gibt grosse Schwierigkeiten auf den Splashseiten ALLER Beta-Tiers mit nicht erkennbarer Schrift vor dem
   (eigentlich sehr gelungenen) farblichen Design und nicht erkennbaren Strukturen (E-Mail-Feld, Sign-In-Code-Feld, ...)".
   URSACHE: melognite-splash-light.css (05.08., HELLER Pergament-Splash) faerbt Schrift, Feldrand und Platzhalter mit !important
   in dunkler Tinte (#1a1510 / #6b5d47 / Rahmen rgba(26,21,16,.22)); diese Seiten legen aber ihren eigenen DUNKLEN Neon-Hintergrund
   (ebenfalls !important) darueber. Ergebnis: dunkle Schrift auf dunklem Grund, Kontrast 1,0-2,9 : 1 (gemessen, Akte Abschnitt 2).
   LOESUNG (Design bleibt: Hintergrund, Verlaeufe, Wappen, Akzentfarben unveraendert): helle Vordergrundfarben, eine halbtransparente
   Flaeche hinter Formular bzw. Code-Eingabe, sichtbare Feldraender (>= 3:1), helle Platzhalter, deutlicher Fokus. Der Senden-Knopf
   behaelt den Genre-Verlauf, bekommt einen hellen Schleier und dunkle Schrift (traegt in allen Stil-Verlaeufen >= 4,5:1).
   Wirkt nur mit der Klasse html.mgn-bk1 (setzt das Inline-Skript neben dem <link>; Tuer ?betakontrast=0 = Stand vorher).
   Spezifitaet (0,3,1)+!important schlaegt splash-light (bis 0,2,0 !important) und die Seiten-Regeln (0,1,0 !important).
   Statisch, keine Animation (Paint-Diaet), kein Skript. ASCII. */

html.mgn-bk1 .splash .splashInner { color: #ece7de !important; }

/* Wasserzeichen: splash-light hebt es fuer den HELLEN Splash auf 22 % Grau (08.08.); auf dunklem Grund liegt es als helle
   Linien unter der Schrift. Die Seiten selbst wollten 6 %; hier 12 % (bleibt sichtbar, stoert die Schrift nicht). */
html.mgn-bk1 .splash .crestBg { opacity: .12 !important; }

/* Marke + Titel */
html.mgn-bk1 .splash .splashBrand .nm { color: #ffffff !important; }
html.mgn-bk1 .splash .splashBrand .sn { color: #ddd6c8 !important; opacity: 1 !important; }
html.mgn-bk1 .splash .splashTitle { color: #ffffff !important; }
/* "Beta"-Zeile (house/dnb, id splashEd): Stil-Verlauf bleibt, mit 30 % hellem Schleier (zweite Hintergrund-Ebene, ebenfalls
   auf die Schrift beschnitten). hiphop (.ed ohne id) traegt eigenen hellen Verlauf und bleibt unberuehrt. */
html.mgn-bk1 .splash #splashEd {
  background-image: linear-gradient(rgba(255, 255, 255, .3), rgba(255, 255, 255, .3)), var(--grad, linear-gradient(120deg, #ffcf40, #ff2d9b)) !important;
}

/* Flaeche hinter Formular und Code-Eingabe */
html.mgn-bk1 .splash .splashForm,
html.mgn-bk1 .splash .splashSent {
  box-sizing: border-box !important; max-width: 360px !important;
  padding: 16px 16px 14px !important; border-radius: 16px !important;
  background: rgba(6, 7, 10, .70) !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .35) !important;
}
html.mgn-bk1 .splash .splashForm label { color: #e6e0d4 !important; font-size: 10.5px !important; }
html.mgn-bk1 .splash .splashNote { color: #d3ccbf !important; font-size: 10.5px !important; line-height: 1.5 !important; }
html.mgn-bk1 .splash .splashErr { color: #ffa3ad !important; font-size: 11px !important; }

/* E-Mail-Feld */
html.mgn-bk1 .splash .splashEmail {
  background: rgba(255, 255, 255, .07) !important; color: #ffffff !important;
  border: 1.5px solid rgba(255, 255, 255, .62) !important;
}
html.mgn-bk1 .splash .splashEmail::placeholder { color: rgba(255, 255, 255, .62) !important; opacity: 1 !important; }
html.mgn-bk1 .splash .splashEmail:focus {
  border-color: #ffffff !important; background: rgba(255, 255, 255, .11) !important; outline: none !important;
  box-shadow: 0 0 0 3px var(--acc, #ffcf40) !important;
}
html.mgn-bk1 .splash .splashEmail.bad { border-color: #ff7d8a !important; box-shadow: 0 0 0 3px rgba(255, 125, 138, .35) !important; }

/* Senden-Knopf: der Hintergrund der Seite (Genre-Verlauf) bleibt; ein heller Schleier als INNEN-Schatten (liegt ueber dem
   Hintergrund, unter der Schrift) + dunkle Schrift. Rechnung fuer alle fuenf Stil-Verlaeufe in der Akte (>= 6:1). */
html.mgn-bk1 .splash .splashBtn {
  box-shadow: inset 0 0 0 999px rgba(255, 255, 255, .38), 0 0 16px var(--acc-glow, rgba(0, 0, 0, 0)) !important;
  color: #15101c !important; -webkit-text-fill-color: #15101c !important; text-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, .7) !important;
}
html.mgn-bk1 .splash .splashBtn:focus-visible { outline: 3px solid #ffffff !important; outline-offset: 3px !important; }
html.mgn-bk1 .splash .splashSkipLink { color: #f5d98b !important; }

/* Code gesendet + Code-Eingabe (Feld kommt aus flaeche.js bzw. hh-kommerz.js) */
html.mgn-bk1 .splash .splashSent .big { color: #ffffff !important; }
html.mgn-bk1 .splash .splashSent .sm { color: #e2dccf !important; }
html.mgn-bk1 .splash .splashSent .sm b { color: #ffffff !important; }
html.mgn-bk1 .splash #splashOtp {
  background: rgba(255, 255, 255, .08) !important; color: #ffffff !important;
  border: 1.5px solid rgba(255, 255, 255, .66) !important;
}
html.mgn-bk1 .splash #splashOtp::placeholder { color: rgba(255, 255, 255, .55) !important; opacity: 1 !important; }
html.mgn-bk1 .splash #splashOtp:focus {
  border-color: #ffffff !important; outline: none !important; box-shadow: 0 0 0 3px var(--acc, #ffcf40) !important;
}
html.mgn-bk1 .splash #splashOtpGo {
  background: rgba(255, 255, 255, .16) !important; color: #ffffff !important;
  border: 1.5px solid rgba(255, 255, 255, .66) !important;
}
html.mgn-bk1 .splash #splashOtpGo:focus-visible { outline: 3px solid var(--acc, #ffcf40) !important; outline-offset: 2px !important; }
html.mgn-bk1 .splash #splashOtpErr { color: #ffa3ad !important; }
html.mgn-bk1 .splash #splashOtpSkip { color: #f5d98b !important; }

/* Ladeanzeige (hiphop) */
html.mgn-bk1 .splash .splashLoadHint,
html.mgn-bk1 .splash .splashMeta,
html.mgn-bk1 .splash .splashSkip { color: #d3ccbf !important; opacity: 1 !important; }
html.mgn-bk1 .splash .splashBarWrap { background: rgba(255, 255, 255, .16) !important; }

/* Links (Fusszeile) - splash-light faerbte sie Rost (#a8471f) */
html.mgn-bk1 .splash a { color: #f5d98b !important; text-decoration-color: rgba(245, 217, 139, .5) !important; }
html.mgn-bk1 .splash a:hover { color: #ffffff !important; }
html.mgn-bk1 .splash .splashFoot .legal { color: #c9c2b4 !important; }
