/* ============================================================================
MERCOFINA — Design-System v2
Farbwelt: Waffenwelt Walch (Markengrün #22c55e = theme-color des Shops)
auf dunklem Graphit, abgestimmt auf den Sachkundetrainer.
Legacy-Klassen (.topbar, .list, .detail, .card, .tbl, .badge, …) bleiben
vollständig kompatibel — alle bestehenden Seiten profitieren ohne Umbau.
========================================================================== */
:root{
/* Flächen */
--bg:#0c0e13;
--bg-elevated:#12151d;
--card:#171b25;
--card-2:#1e2330;
--card-3:#262c3c;
--line:rgba(255,255,255,0.07);
--line-2:rgba(255,255,255,0.14);
/* Text */
--fg:#e9ecf2;
--muted:#98a0b3;
--subtle:#5d6478;
/* Marke (Waffenwelt Walch Grün) */
--accent:#22c55e;
--accent-hover:#34d873;
--accent-dark:#16a34a;
--accent-dim:rgba(34,197,94,0.12);
--accent-border:rgba(34,197,94,0.35);
/* Semantik */
--ok:#22c55e; --ok-bg:rgba(34,197,94,0.10); --ok-bdr:rgba(34,197,94,0.30);
--warn:#fbbf24; --warn-bg:rgba(251,191,36,0.10);--warn-bdr:rgba(251,191,36,0.30);
--bad:#f87171; --bad-bg:rgba(248,113,113,0.10);--bad-bdr:rgba(248,113,113,0.30);
--pflicht-bg:rgba(248,113,113,0.045);--pflicht-linie:rgba(248,113,113,0.45);
--info:#60a5fa; --info-bg:rgba(96,165,250,0.10);--info-bdr:rgba(96,165,250,0.30);
--shadow-sm:0 1px 3px rgba(0,0,0,0.35);
--shadow-md:0 6px 24px rgba(0,0,0,0.45);
/* Die Umrandung eines BEDIENELEMENTS — nicht zu verwechseln mit --line,
der Zierlinie. WCAG 1.4.11 verlangt 3:1 gegen die Nachbarfarbe, damit
man sieht, WO ein Feld anfaengt. `--line` erreicht dort 1,23:1.
Gemessen auf --card-2: 0.35 Weiss ergibt 3,17:1.
NUR FUER BEDIENELEMENTE. Zierlinien (Tabellenzeilen, Kartenkanten,
Trenner) fallen nicht unter 1.4.11 — sie machen kein Bedienelement
erkennbar. `--line` und `--line-2` bleiben deshalb, wie sie sind. */
--feld-rand:rgba(255,255,255,0.35);
/* Der Fokusring faellt unter dieselbe Regel (und unter 2.4.7). Mit 0.35
Deckkraft erreichte er 1,99:1 — man sah kaum, wo man steht. 0.65
ergibt 3,68:1. */
--focus:0 0 0 3px rgba(34,197,94,0.65);
/* ---- SKALEN (01.09.2026) ------------------------------------------
Michael: „Ein Button mit einem leicht unterschiedlichen Innenabstand
oder sonstigen leichten Unterschieden ist ein FEHLER. Das war der
Ausgangspunkt des Audits, das Ziel identische Bausteine, nicht 50
kopierte."
Gemessen am 31.08.2026 (scripts/audit/bausteine.js): 138 verschiedene
Innenabstaende, 29 Schriftgroessen, 25 Radien. Darunter 14.5px und
15.5px Schrift und Radien von 3, 5, 7, 9, 10, 11, 14 px — Werte, die
niemand entscheidet. Sie entstehen, wenn eine Regel kopiert und
einmal nachjustiert wird.
FARBEN waren seit Durchgang 11 tokenisiert, MASSE nie. Genau dort sass
deshalb die ganze Kopiererei — und genau deshalb konnten die
Durchgaenge 1 und 11 gruen sein, waehrend jede zweite Werkzeugleiste
ihren Knopf von Hand nachbaut: Ein nachgebauter Knopf ist weder tot
noch falsch gefaerbt und faellt durch beide Raster.
DIE SKALEN SIND NICHT SCHMUECKEND, SIE SIND DIE AUSWAHL. Wer einen
neuen Wert braucht, nimmt die naechste Stufe — oder begruendet eine
neue. Ein roher Pixelwert in einer Komponentenregel ist ab jetzt ein
Befund; `scripts/audit/bausteine.js` zaehlt sie. */
/* Abstand: 4-px-Raster. Ein 2-px-Raster waere billiger zu erreichen
gewesen, ist aber keine Skala — es ist dasselbe Problem mit besseren
Namen. */
--s-1:4px;
--s-2:8px;
--s-3:12px;
--s-4:16px;
--s-5:24px;
--s-6:32px;
/* Schrift. Die Drift sass zwischen 10 und 16 px: dreizehn Werte,
darunter 10.5, 11.5, 12.5, 13.5, 14.5, 15.5.
ES WIRD AUFGERUNDET, NIE AB. Der erste Anlauf rundete kaufmaennisch
und machte die Listenschrift 4 % KLEINER (12.5 -> 12 an 47 Stellen) —
bei einem Audit, das an der Lesbarkeit arbeitet, die falsche Richtung.
Wer den ganzen Tag Listen liest, soll eher mehr sehen als weniger. */
--t-0:9px; /* Marken, die keine Saetze sind: Aufklapp-, Sortierpfeil */
--t-1:11px;
--t-2:12px;
--t-3:13px;
--t-4:14px;
--t-5:16px;
--t-6:20px; /* Ueberschriften: hier standen 17, 19, 20, 22 px */
--t-7:26px; /* und hier 24, 25, 26, 28 px */
--r-klein:4px; /* war 3, 4, 5 px */
--r-mittel:6px; /* war 6, 7 px */
--r-gross:20px; /* grosse Flaechen */
--r-pille:999px; /* voll gerundet — Absicht, kein Rastfall */
--r-inner:8px;
--r-card:12px;
--topbar-h:52px;
--subbar-h:37px; /* Unterleiste der Bereichs-Navigation (nav.js) */
/* ---- SCHRIFT AUF DER AKZENTFLAECHE (10.09.2026) --------------------
Stand als #04170b fest in der Grundregel des Knopfes. Auf dem hellen
Tannengruen waere dieses Fast-Schwarz zwar lesbar, aber der Knopf
saehe aus wie deaktiviert; umgekehrt ist Weiss auf dem hellen
Signalgruen der dunklen Erscheinung unlesbar. Die Schrift auf einer
Akzentflaeche ist damit KEIN fester Wert, sondern haengt an der
Erscheinung — also ein Token. */
--auf-akzent:#04170b;
/* ---- ELF TOKEN, DIE GEFEHLT HABEN (10.09.2026) ---------------------
Gefunden beim Auflösen der 112 harten Farben in dieser Datei. Diese
Dinge kamen mehrfach vor, hatten aber keinen Namen — also hat sich
jede Stelle ihren eigenen Wert ausgedacht. Der SCHLEIER stand in fünf
Fassungen da (rgba(5,7,10,.65), rgba(6,10,8,.62), rgba(0,0,0,.55) …),
obwohl jedes Mal dasselbe gemeint war: „was dahinter liegt, ist
gerade nicht dran". Der grosse SCHATTEN in drei Grössen. */
/* Der Schleier hinter einem Fenster. */
--schleier:rgba(6,10,8,0.62);
/* Der Bildbetrachter verdunkelt fast ganz — ein Foto wird auf Schwarz
beurteilt, in beiden Erscheinungen. Bewusst gleich, kein Vergessen. */
--schleier-stark:rgba(0,0,0,0.92);
/* Zeile unter dem Zeiger, gewählte Zeile. */
--zeile-hover:rgba(255,255,255,0.03);
--zeile-aktiv:rgba(255,255,255,0.05);
/* Der grosse Schatten (Fenster, schwebende Listen). --shadow-md ist für
Karten, dies für Dinge, die WIRKLICH über allem liegen. */
--shadow-lg:0 14px 40px rgba(0,0,0,0.5);
/* Schrift auf einer SEMANTISCHEN Fläche (roter Ablehnen-Knopf, gefüllte
Warnpille, grüne Master-Marke). Der Bruder von --auf-akzent, und er
KIPPT genauso: In der dunklen Erscheinung sind --ok/--warn/--bad HELLE
Farben, in der hellen sind sie DUNKEL — die Schrift darauf muss also
mitkippen, nicht feststehen.
DAS HAT EINEN ECHTEN FEHLER AUFGEDECKT: `.actions .reject` setzte
weisse Schrift auf --bad. Auf dem hellen Rot der dunklen Erscheinung
(#f87171) sind das 2,8:1 — durchgefallen (WCAG 1.4.3). Mit diesem
Token sind es 7,2:1. Der Umschalter hat die Stelle sichtbar gemacht;
falsch war sie schon vorher. */
--auf-signal:#0d0705;
/* ---- PAPIERFARBEN: in BEIDEN Erscheinungen gleich -------------------
Diese Werte bilden GEGENSTÄNDE ab, nicht Mercofina. Eine PDF-Seite und ein
Produktfoto liegen auf Weiss, ein Kassenbon ist Thermopapier, eine
Kameravorschau ist schwarz. Nichts davon ändert sich, wenn jemand die
Ansicht umschaltet. Sie stehen als Token da, damit klar ist: nicht
vergessen, sondern entschieden. */
--blatt:#ffffff;
/* Klickflächen AUF dem Blatt (das-papier-ist-die-maske): Das Blatt ist in
beiden Erscheinungen weiss, also auch das Grün darauf gleich. */
--blatt-feld:#15803d;
--blatt-feld-hell:rgba(21,128,61,.10);
/* Pflichtangabe, die fehlt (Kunde, Position, Lieferung): dezent rot
(Michael, 25.09.2026: „Nimm bitte ein dezenteres Rot“). */
--blatt-pflicht:#c25450;
--blatt-pflicht-hell:rgba(194,84,80,.045);
--blatt-grau:#595959; /* die graue Hinweisschrift des PDFs */
--papier:#f6f4ee;
--papier-schrift:#1b1b1b;
--papier-leise:#444444;
--papier-linie:#999999;
--kamera:#000000;
/* Womit der Browser seine eigenen Bedienelemente zeichnet (Datumswaehler,
Rollbalken, Ankreuzfelder). Stand als `color-scheme:dark` einzeln an
`input[type="date"]`; damit waeren in der hellen Erscheinung genau die
Datumsfelder dunkel geblieben. */
--browser-schema:dark;
}
/* ======================================================================
DIE HELLE ERSCHEINUNG — Regelwerk `mercofina-hat-zwei-erscheinungen`
Michael, 09.09.2026: „Und ist es moeglich, Mercofina sowohl in einem hellen
als auch unserem Dark Design darzustellen? Umschaltbar?" — und zur
Farbe: „Das Helle Mercofina kann gerne auch weg vom Gruen. Gruen weiss ist
wahrscheinlich nicht so prickelnd."
HIER STEHEN NUR WERTE. Keine Regel, kein Mass, kein Aufbau. Das ist die
ganze Zusage: Wer eine Komponente baut, muss von dieser Erscheinung
nichts wissen — er nimmt Token, und beide Welten stimmen.
UMGEKEHRT IST DAS DER PRUEFSTEIN. `selftest-bausteine` ZAEHLT Regeln und
hat beim Umbau am 01.09.2026 dreimal gruen gemeldet, waehrend etwas
kaputt war. Beim Umschalten dagegen wird jede hart geschriebene Farbe
SICHTBAR falsch. Deshalb ist die zweite Erscheinung nicht Beiwerk des
Umbaus, sondern sein Messgeraet.
DAS GRUEN IST GERECHNET, NICHT GEWAEHLT. #22c55e steht auf dem dunklen
Grund bei rund 8:1, auf Weiss nur bei rund 2:1 — als Schrift oder duenne
Linie dort unlesbar (WCAG 1.4.3, 4.5:1). Nachgedunkelt auf #15803d
erreicht es 4,5:1 gegen den Papiergrund und 5,0:1 gegen Weiss auf der
Knopffl aeche. Dieselbe Marke, dieselbe Bedeutung, lesbar.
DUNKEL BLEIBT DER STANDARD. Hell ist ein Angebot, keine Umstellung.
====================================================================== */
:root[data-erscheinung="hell"]{
/* Flaechen — warmes Papier, kein reines Weiss. Reines #ffffff unter einer
Liste, die den ganzen Tag gelesen wird, blendet; der leichte Gruenstich
haelt die Flaeche mit der Marke zusammen. */
--bg:#f2f4f1;
--bg-elevated:#f8faf7;
--card:#ffffff;
--card-2:#eef1ec;
--card-3:#e3e7df;
--line:rgba(16,24,20,0.10);
--line-2:rgba(16,24,20,0.20);
/* Text */
--fg:#161a17; /* 15,8:1 auf --bg */
--muted:#5a6360; /* 5,5:1 auf --bg */
--subtle:#8a9490; /* nur fuer Zierschrift, nie fuer Saetze */
/* Marke */
--accent:#15803d;
--accent-hover:#166534;
--accent-dark:#14532d;
--accent-dim:rgba(21,128,61,0.10);
--accent-border:rgba(21,128,61,0.35);
--auf-akzent:#ffffff;
/* Semantik — dieselben Bedeutungen, andere Werte. Das Ocker musste
dunkler als das dunkle Pendant: #fbbf24 erreicht auf Papier nur
4,4:1 und faellt damit knapp durch. */
--ok:#15803d; --ok-bg:rgba(21,128,61,0.10); --ok-bdr:rgba(21,128,61,0.30);
--warn:#8a5200; --warn-bg:rgba(138,82,0,0.10); --warn-bdr:rgba(138,82,0,0.30);
--bad:#b91c1c; --bad-bg:rgba(185,28,28,0.09); --bad-bdr:rgba(185,28,28,0.30);
--pflicht-bg:rgba(185,28,28,0.035);--pflicht-linie:rgba(185,28,28,0.40);
--info:#1d4ed8; --info-bg:rgba(29,78,216,0.09); --info-bdr:rgba(29,78,216,0.30);
/* Schatten sind auf Dunkel gerechnet: rgba(0,0,0,.45) wirkt auf Papier
wie ein Fleck. Auf Hell traegt die Kante, nicht der Schlagschatten. */
--shadow-sm:0 1px 2px rgba(16,24,20,0.08);
--shadow-md:0 6px 20px rgba(16,24,20,0.12);
/* Bedienelement-Rand und Fokusring: dieselbe Zusage wie im Dunkeln
(WCAG 1.4.11, 3:1 gegen die Nachbarfarbe), andere Richtung. */
--feld-rand:rgba(16,24,20,0.28);
--focus:0 0 0 3px rgba(21,128,61,0.35);
/* Der Schleier verdunkelt auch auf Papier — er soll ja zeigen, dass das
Dahinterliegende nicht dran ist. Nur schwächer: Auf hellem Grund
genügt weniger für denselben Abstand. */
--schleier:rgba(16,24,20,0.42);
/* --schleier-stark bleibt schwarz: das Foto wird auf Schwarz beurteilt. */
--schleier-stark:rgba(0,0,0,0.92);
--zeile-hover:rgba(16,24,20,0.04);
--zeile-aktiv:rgba(16,24,20,0.07);
--shadow-lg:0 14px 40px rgba(16,24,20,0.18);
/* Hier kippt die Signalschrift auf Weiss: --ok/--warn/--bad sind in
dieser Erscheinung dunkel (5,0 / 5,7 / 5,8 : 1 gegen Weiss). */
--auf-signal:#ffffff;
/* Papierfarben bleiben, wie sie sind. Papier ist Papier. */
--blatt:#ffffff;
/* Klickflächen AUF dem Blatt (das-papier-ist-die-maske): Das Blatt ist in
beiden Erscheinungen weiss, also auch das Grün darauf gleich. */
--blatt-feld:#15803d;
--blatt-feld-hell:rgba(21,128,61,.10);
/* Pflichtangabe, die fehlt (Kunde, Position, Lieferung): dezent rot
(Michael, 25.09.2026: „Nimm bitte ein dezenteres Rot“). */
--blatt-pflicht:#c25450;
--blatt-pflicht-hell:rgba(194,84,80,.045);
--blatt-grau:#595959; /* die graue Hinweisschrift des PDFs */
--papier:#f6f4ee;
--papier-schrift:#1b1b1b;
--papier-leise:#444444;
--papier-linie:#999999;
--kamera:#000000;
--browser-schema:light;
}
*{box-sizing:border-box}
html{
height:100%;
/* KEINE Text-Aufblähung am Handy (Befund Michael, 02.09.2026, Screenshots
vom Telefon): Chrome/Android vergrößert bei Inhalten, die breiter als
der Bildschirm sind, NUR Fließtext-Blöcke (Absätze, Überschriften,
Aufklapp-Titel) und lässt Felder/Tabellen klein — das ergibt genau die
ungleich großen Texte im Konto-Fenster und über den Zuordnungen.
100% = Schrift bleibt überall so groß, wie sie gesetzt ist. */
-webkit-text-size-adjust:100%;
text-size-adjust:100%;
}
body{
margin:0;
font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
background:var(--bg);
color:var(--fg);
-webkit-font-smoothing:antialiased;
}
::selection{background:var(--accent-border)}
/* Dezente Scrollbars */
*{scrollbar-width:thin;scrollbar-color:var(--card-3) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--card-3);border-radius:var(--r-inner);border:2px solid var(--bg)}
*::-webkit-scrollbar-track{background:transparent}
.muted{color:var(--muted)}
a{color:var(--accent)}
a:hover{color:var(--accent-hover)}
code{background:var(--card-2);padding:1px var(--s-2);border-radius:var(--r-mittel);border:1px solid var(--line);font-size:var(--t-3)}
h1,h2,h3,h4{letter-spacing:-0.01em}
/* ============================== Formulare ============================== */
label{display:block;margin:var(--s-4) 0 var(--s-2);font-size:var(--t-3);color:var(--muted)}
input,select,textarea{
width:100%;padding:var(--s-2) var(--s-3);
border:1px solid var(--feld-rand);border-radius:var(--r-inner);
background:var(--card-2);color:var(--fg);outline:none;
font:inherit;font-size:var(--t-4);
transition:border-color 130ms,box-shadow 130ms,background 130ms;
}
/* DER PLATZHALTER IST TEXT — und Text hat 4,5:1 (WCAG 1.4.3, keine Ausnahme
fuer Platzhalter). `--subtle` erreicht auf dem Feldgrund `--card-2` nur
2,66:1; `--muted` erreicht 5,99:1 und bleibt trotzdem deutlich leiser als
der eingegebene Text (`--fg`, 13,26:1). Der Unterschied zwischen „hier
steht ein Beispiel" und „hier steht meine Eingabe" bleibt also erhalten.
Gemessen, nicht geschaetzt — und lange uebersehen: Ein Platzhalter ist kein
TEXTKNOTEN, deshalb kam er in der Kontrastmessung von Paket 5 (359 Stellen)
gar nicht vor. Er stand seitdem als offener Punkt im STATUS.
Die frueher eigene Regel fuer `.sicht-suche` ist damit ueberfluessig — sie
sagte hier schon das Richtige, aber nur an einer Stelle. */
input::placeholder,textarea::placeholder{color:var(--muted)}
/* Filter-/Suchfelder (type="search"): eingebautes ✕ zum Leeren, auf dunklem
Grund sichtbar gemacht. Live-Filter reagieren aufs input-Event, Reload-
Filter (Journal/Belege) zusätzlich aufs search-Event. */
input[type="search"]::-webkit-search-cancel-button{
-webkit-appearance:none;appearance:none;
height:14px;width:14px;margin-left:6px;cursor:pointer;flex:none;
background:var(--muted);
-webkit-mask:url('data:image/svg+xml;utf8,') center/contain no-repeat;
mask:url('data:image/svg+xml;utf8,') center/contain no-repeat;
}
input[type="search"]::-webkit-search-cancel-button:hover{background:var(--fg)}
input:hover,select:hover,textarea:hover{border-color:var(--line-2)}
input:focus,select:focus,textarea:focus{border-color:var(--accent-border);box-shadow:var(--focus);background:var(--card)}
/* GEAENDERT gegenueber dem vorbelegten Ist-Stand (04.09.2026, Umbau-Dialog:
Michael „das geaenderte Feld hervorheben, dann sieht man sofort, was
geaendert wurde"). Bewusst am Feld selbst und nicht als Zusatzzeile — die
Markierung soll dort sein, wo die Aenderung steht. */
input.geaendert,select.geaendert,textarea.geaendert{border-color:var(--warn-bdr);background:var(--warn-bg)}
/* Ein Kaestchen hat keinen Rand zum Faerben — die Umrandung liegt aussen.
Kein Wort daneben (Michael, 05.09.2026: „ein geaendert an der Stelle ist
nicht sehr sinnvoll"). */
input[type=checkbox].geaendert{outline:2px solid var(--warn-bdr);outline-offset:2px}
select{cursor:pointer;appearance:none;-webkit-appearance:none;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2398a0b3' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
background-repeat:no-repeat;background-position:right 10px center;padding-right:32px}
select[multiple]{background-image:none;padding-right:11px}
input[type="checkbox"]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}
input[type="radio"]{width:15px;height:15px;accent-color:var(--accent);cursor:pointer}
/* Der Browser zeichnet Datumswaehler, Rollbalken und Ankreuzfelder selbst.
Das stand hier als `color-scheme:dark` an genau EINER Feldart — in der
hellen Erscheinung waeren damit die Datumsfelder dunkel geblieben, und
die Rollbalken auch. Jetzt sagt es die Wurzel fuer alles auf einmal. */
:root{color-scheme:var(--browser-schema)}
/* File-Input im Dark Theme */
input[type="file"]{padding:0;background:none;border:0}
input[type="file"]::file-selector-button{
padding:var(--s-2) var(--s-4);border:1px solid var(--line);border-radius:var(--r-inner);
background:var(--card-3);color:var(--fg);font-size:var(--t-3);font-family:inherit;
cursor:pointer;margin-right:10px;transition:background 130ms,border-color 130ms;
}
input[type="file"]::file-selector-button:hover{background:var(--card-2);border-color:var(--line-2)}
/* ============================== Buttons ================================ */
/*
* SCHALENMODUS — dieselbe Seite, am Handy schmaler.
*
* Michael, 28.08.2026: „Bei Inventur und Stempeluhr fällt man irgendwie aus der
* App raus, also die Oberfläche ändert sich."
*
* Inventur und Stempeluhr sind bewusst keine zweite Fassung in der Schale
* (`mercofinago-ist-eine-schale`): Zwei Fassungen derselben Sache driften
* auseinander, und die zweite ist immer die ältere. Stattdessen trägt, was nur
* am Schreibtisch Sinn hat, ein `data-nur-mercofina` — und verschwindet, wenn
* nav.js die Seite als Geräte-Sitzung erkennt.
*/
body[data-schale="mercofinago"] [data-nur-mercofina]{display:none !important}
/* Und die Gegenrichtung: ein kurzer Satz, der nur am Handy steht — dort, wo
die lange Erklärung Knöpfe beschreibt, die es in der Schale gar nicht gibt. */
[data-nur-schale]{display:none !important}
body[data-schale="mercofinago"] [data-nur-schale]{display:revert !important}
body[data-schale="mercofinago"] .seite{height:auto}
body[data-schale="mercofinago"] .pane-body{padding:var(--s-4)}
/* Die Reiterleiste kommt aus `mercofinago.css` und ist dort ein Flex-Kind des
Schalenrahmens. Hier gibt es diesen Rahmen nicht — also steht sie fest am
unteren Rand, und der Seiteninhalt bekommt Platz darunter. */
body[data-schale="mercofinago"]{padding-bottom:74px}
/* Die kleine Zahl am Reiter. Sie sitzt am Symbol, nicht neben dem Wort: Ein
Reiter ist ein Fuenftel Handybreite, und eine Zahl in der Zeile schoebe die
Beschriftung ab. */
.go-reiter > * { position:relative; }
.go-zahl{
position:absolute; top:2px; left:50%; margin-left:5px;
min-width:15px; height:15px; padding:0 var(--s-1); box-sizing:border-box;
border-radius:var(--r-inner); background:var(--accent); color:var(--auf-akzent);
font:700 9.5px/15px ui-sans-serif,system-ui,sans-serif; font-style:normal;
text-align:center; letter-spacing:0;
}
body[data-schale="mercofinago"] .go-reiter{
position:fixed;left:0;right:0;bottom:0;z-index:40;
max-width:640px;margin:0 auto;
}
/* Ein LINK, der wie ein Knopf aussieht — fuer Wege, die eine SEITE oeffnen
statt eine Aktion auszuloesen („Mercofina GO oeffnen“). Ein