/* Teil 1: unveraendert aus vorlage/saalplan-reservierung.html uebernommen.
   Hier bitte nichts aendern - Ergaenzungen gehoeren in Teil 2 weiter unten. */

/* ==========================================================================
   SAALPLAN
   Eine einzelne Datei, keine Bibliotheken, läuft offline im Browser.
   Sitzplätze und Beschriftungen stehen im KONFIG-Block im JavaScript-Teil.
   ========================================================================== */

:root{
  --grund:       #f6f5f4;
  --flaeche:     #ffffff;
  --tinte:       #2a1b1e;
  --text-weich:  #7a6a6d;
  --linie:       #e7e2e1;
  --linie-fest:  #d6cecd;
  --dunkel:      #652631;
  --platte:      #f0e4e4;
  --platte-rand: #d9c3c4;
  --platte-text: #7e4953;
  --frei-bg:     #e4f1e7;
  --frei-rand:   #79b489;
  --frei-text:   #1d5334;
  --frei-hover:  #d3e9d9;
  --belegt-bg:   #c93a2b;
  --belegt-rand: #a32b1f;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:"Manrope","Segoe UI",Helvetica,Arial,sans-serif;
  font-size:15px;line-height:1.45;color:var(--tinte);background:var(--grund);
  -webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;
}
button{font:inherit;color:inherit;cursor:pointer;}
:focus-visible{outline:2px solid #2f6fd0;outline-offset:2px;}

/* ---------- Kopf ---------- */
.kopf{
  position:sticky;top:0;z-index:20;background:var(--dunkel);color:#fbf4f4;
}
.kopf-innen{
  max-width:1280px;margin:0 auto;padding:14px 24px;
  display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;
}
.kopf h1{margin:0;font-size:18px;font-weight:700;letter-spacing:-.2px;}
.kopf .datum{font-size:13px;color:#e0c4c8;margin-top:1px;}
.rechts{display:flex;align-items:center;gap:20px;margin-left:auto;}
.werte{display:flex;gap:18px;}
.werte div{display:flex;align-items:baseline;gap:6px;}
.werte b{font-size:18px;font-weight:700;}
.werte span{font-size:12px;color:#e0c4c8;}
.punkt{width:8px;height:8px;border-radius:50%;display:inline-block;}
.punkt.frei{background:#9dd3a9;}
.punkt.belegt{background:#f0a99f;}

.login{
  border:1px solid #96636c;color:#f2e2e4;text-decoration:none;
  padding:6px 16px;border-radius:99px;font-size:13px;font-weight:600;
  white-space:nowrap;transition:background .12s ease;
}
.login:hover{background:#7e4953;border-color:#b0838b;}

/* ---------- Plan ---------- */
.raum{max-width:1280px;margin:0 auto;padding:22px 24px 60px;}
.plan{
  background:var(--flaeche);border:1px solid var(--linie);border-radius:16px;
  padding:22px;box-shadow:0 1px 2px rgba(16,32,26,.05),0 10px 28px rgba(16,32,26,.045);
}
.buehne{
  border:1px solid var(--linie-fest);border-radius:10px;background:#faf8f7;
  text-align:center;padding:13px;margin-bottom:16px;
}
.buehne .wort{font-size:14px;font-weight:700;letter-spacing:6px;}
.buehne .wann{font-size:13px;color:var(--text-weich);margin-top:1px;}

.kinderzeile{display:flex;justify-content:center;margin-bottom:18px;}

.saal{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px 20px;align-items:stretch;
}
.plan-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:6px;}
.plan-innen{min-width:900px;}
.scroll-hinweis{
  display:none;margin:0 0 10px;font-size:13px;color:var(--text-weich);
}
@media (max-width:980px){
  .raum{padding:14px 12px 40px;}
  .plan{padding:14px;border-radius:12px;}
  .scroll-hinweis{display:block;}
}
.zelle{display:flex;flex-direction:column;gap:10px;}
.zelle .tisch{flex:0 0 auto;}

/* Beschriftungen wie Eingang und Schank: waagrecht beschriftet, halbe Breite,
   füllen in der Höhe den Platz, der unter dem Tisch ohnehin frei ist */
.marke{
  flex:1 1 auto;min-height:74px;width:50%;align-self:flex-end;
  border:1px solid var(--linie-fest);border-radius:10px;background:#faf8f7;
  color:var(--text-weich);font-size:13px;font-weight:600;letter-spacing:2px;
  display:flex;align-items:center;justify-content:center;text-align:center;
  padding:9px 8px;
}

/* ---------- Tisch ---------- */
.tisch{
  border:1px solid var(--linie);border-radius:12px;
  padding:11px 13px 13px;background:var(--flaeche);
}
.tisch-kopf{
  display:flex;align-items:center;gap:9px;
  padding-bottom:8px;margin-bottom:9px;border-bottom:1px solid var(--linie);
}
.abzeichen{
  width:26px;height:26px;border-radius:8px;background:var(--platte);
  border:1px solid var(--platte-rand);color:var(--platte-text);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;
}
.bezeichnung{font-weight:600;font-size:14px;}
.stand{margin-left:auto;font-size:12px;color:var(--text-weich);}
.stand.voll{color:var(--dunkel);font-weight:700;}

.tisch-raster{display:grid;grid-template-columns:1fr auto 1fr;gap:5px;}
.platte{
  grid-column:2;width:36px;border-radius:7px;
  background:var(--platte);border:1px solid var(--platte-rand);color:var(--platte-text);
  display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;
}
.bank{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;}

/* ---------- Sitzplatz ---------- */
.platz{
  min-width:36px;height:32px;padding:0 6px;border-radius:7px;
  border:1px solid var(--frei-rand);background:var(--frei-bg);color:var(--frei-text);
  font-size:13px;font-weight:600;
  display:flex;align-items:center;justify-content:center;
  transition:background .12s ease;
}
.platz:hover{background:var(--frei-hover);}
.platz.leer{visibility:hidden;pointer-events:none;}
.platz[data-status="belegt"]{background:var(--belegt-bg);border-color:var(--belegt-rand);color:#fff5f3;}
.platz[data-status="belegt"]:hover{background:#b13224;}

/* ---------- Legende ---------- */
.legende{
  display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;
  margin-top:18px;padding-top:14px;border-top:1px solid var(--linie);
  font-size:13px;color:var(--text-weich);
}
.legende i{
  width:18px;height:14px;border-radius:4px;border:1px solid;
  display:inline-block;vertical-align:-2px;margin-right:6px;
}
.l-frei{background:var(--frei-bg);border-color:var(--frei-rand);}
.l-belegt{background:var(--belegt-bg);border-color:var(--belegt-rand);}
.l-tisch{background:var(--platte);border-color:var(--platte-rand);}

@media (prefers-reduced-motion:reduce){*{transition:none !important;}}

/* ==========================================================================
   Teil 2: Ergaenzungen fuer das Reservierungssystem.
   Verwendet ausschliesslich die Farben aus Teil 1, damit der Plan und die
   uebrigen Seiten zusammengehoeren.
   ========================================================================== */

:root{
  --gesperrt-bg:   #e9e5e4;
  --gesperrt-rand: #c8c1bf;
  --gesperrt-text: #8b8180;
  --gewaehlt-rand: #4a1c24;
  --warn-bg:       #fdf3e7;
  --warn-rand:     #e3c396;
  --warn-text:     #7a4f16;
  --fehler-bg:     #fdecea;
  --fehler-rand:   #e9a79f;
}

a{color:var(--dunkel);}

/* ---------- Kopf: Rueckweg und Zaehler der Auswahl ---------- */
.kopf .zurueck{
  color:#e0c4c8;text-decoration:none;font-size:13px;font-weight:600;
}
.kopf .zurueck:hover{color:#fbf4f4;text-decoration:underline;}
.werte b.gewaehlt-zahl{color:#f6dfe2;}
.punkt.gewaehlt{background:#f0e4e4;}

/* ---------- Terminauswahl ---------- */
.seitenkopf{max-width:1280px;margin:0 auto;padding:26px 24px 4px;}
.seitenkopf h2{margin:0 0 4px;font-size:22px;font-weight:700;letter-spacing:-.3px;}
.seitenkopf p{margin:0;color:var(--text-weich);max-width:62ch;}

.termine{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
  gap:14px;margin:0;padding:0;list-style:none;
}
.termin{
  background:var(--flaeche);border:1px solid var(--linie);border-radius:14px;
  padding:16px 18px;display:flex;flex-direction:column;gap:3px;
  box-shadow:0 1px 2px rgba(16,32,26,.05);
  text-decoration:none;color:inherit;transition:border-color .12s ease,box-shadow .12s ease;
}
a.termin:hover{border-color:var(--platte-rand);box-shadow:0 2px 4px rgba(16,32,26,.07),0 10px 24px rgba(16,32,26,.05);}
.termin .tag{font-size:13px;color:var(--text-weich);font-weight:600;letter-spacing:.3px;}
.termin .datum{font-size:20px;font-weight:700;letter-spacing:-.3px;}
.termin .zeit{font-size:14px;color:var(--text-weich);}
.termin .rest{margin-top:9px;padding-top:9px;border-top:1px solid var(--linie);font-size:14px;font-weight:600;color:var(--frei-text);}
.termin.zu{opacity:.62;cursor:not-allowed;background:#faf8f7;}
.termin.zu .rest{color:var(--dunkel);}
.termin .marke-zu{
  align-self:flex-start;margin-top:9px;font-size:12px;font-weight:700;letter-spacing:.6px;
  text-transform:uppercase;background:var(--platte);border:1px solid var(--platte-rand);
  color:var(--platte-text);border-radius:99px;padding:3px 10px;
}

/* ---------- Platzzustaende, die es in der Vorlage noch nicht gab ---------- */
.platz[data-status="gesperrt"]{
  background:var(--gesperrt-bg);border-color:var(--gesperrt-rand);color:var(--gesperrt-text);
}
.platz[data-status="gesperrt"]:hover{background:var(--gesperrt-bg);}
.platz[data-status="gewaehlt"]{
  background:var(--dunkel);border-color:var(--gewaehlt-rand);color:#fbf4f4;
}
.platz[data-status="gewaehlt"]:hover{background:#7e4953;}
.platz:disabled{cursor:default;}
.l-gesperrt{background:var(--gesperrt-bg);border-color:var(--gesperrt-rand);}
.l-gewaehlt{background:var(--dunkel);border-color:var(--gewaehlt-rand);}

/* ---------- Meldungen ---------- */
.meldung{
  border-radius:12px;padding:13px 16px;margin:0 0 16px;font-size:14px;
  border:1px solid var(--linie-fest);background:var(--flaeche);
}
.meldung.warnung{background:var(--warn-bg);border-color:var(--warn-rand);color:var(--warn-text);}
.meldung.fehler{background:var(--fehler-bg);border-color:var(--fehler-rand);color:#8d2b1e;}
.meldung b{font-weight:700;}

/* ---------- Formular ---------- */
.formular{
  background:var(--flaeche);border:1px solid var(--linie);border-radius:16px;
  padding:22px;margin-top:18px;
  box-shadow:0 1px 2px rgba(16,32,26,.05),0 10px 28px rgba(16,32,26,.045);
}
.formular h2{margin:0 0 3px;font-size:18px;font-weight:700;}
.formular .beistrich{margin:0 0 18px;color:var(--text-weich);font-size:14px;}
.felder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;}
@media (max-width:620px){.felder{grid-template-columns:1fr;}}
.feld{display:flex;flex-direction:column;gap:5px;}
.feld.breit{grid-column:1 / -1;}
.feld label{font-size:13px;font-weight:600;}
.feld .pflicht{color:var(--dunkel);}
.feld input{
  font:inherit;padding:10px 12px;border-radius:9px;background:var(--grund);
  border:1px solid var(--linie-fest);color:var(--tinte);
}
.feld input:focus{outline:2px solid #2f6fd0;outline-offset:1px;}
.feld .erklaerung{font-size:12px;color:var(--text-weich);}

/* Honigtopf: fuer Menschen unsichtbar, fuer einfache Skripte verlockend.
   Bewusst nicht display:none, das ueberspringen manche Skripte gezielt. */
.honigtopf{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

.auswahl-schau{
  border:1px solid var(--linie);border-radius:12px;background:var(--grund);
  padding:12px 14px;margin-bottom:18px;font-size:14px;
}
.auswahl-schau .nichts{color:var(--text-weich);}
.auswahl-schau b{font-weight:700;}
.marken{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.marken span{
  background:var(--platte);border:1px solid var(--platte-rand);color:var(--platte-text);
  border-radius:7px;padding:3px 9px;font-size:13px;font-weight:600;
}

.absenden{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:20px;}
.knopf{
  background:var(--dunkel);color:#fbf4f4;border:1px solid var(--gewaehlt-rand);
  border-radius:99px;padding:11px 26px;font-size:15px;font-weight:700;
  transition:background .12s ease;
}
.knopf:hover:not(:disabled){background:#7e4953;}
.knopf:disabled{opacity:.45;cursor:not-allowed;}
.knopf.schlicht{background:transparent;color:var(--dunkel);border-color:var(--platte-rand);}
.knopf.schlicht:hover{background:var(--platte);}
.datenhinweis{font-size:13px;color:var(--text-weich);max-width:52ch;}

/* ---------- Bestaetigung ---------- */
.bestaetigung{
  background:var(--flaeche);border:1px solid var(--linie);border-radius:16px;padding:26px;
  box-shadow:0 1px 2px rgba(16,32,26,.05),0 10px 28px rgba(16,32,26,.045);
}
.bestaetigung h2{margin:0 0 6px;font-size:22px;font-weight:700;letter-spacing:-.3px;}
.bestaetigung .vorsatz{margin:0 0 20px;color:var(--text-weich);}
.uebersicht{border-top:1px solid var(--linie);margin:0;}
.uebersicht div{
  display:flex;gap:16px;padding:11px 0;border-bottom:1px solid var(--linie);
  font-size:15px;flex-wrap:wrap;
}
.uebersicht dt{flex:0 0 170px;color:var(--text-weich);font-size:14px;}
.uebersicht dd{margin:0;font-weight:600;}
.verbindlich{
  margin-top:20px;border:1px solid var(--warn-rand);background:var(--warn-bg);
  color:var(--warn-text);border-radius:12px;padding:14px 16px;font-size:14px;
}
.verbindlich b{font-weight:700;}

/* ---------- Fussbereich ---------- */
.fuss{border-top:1px solid var(--linie);margin-top:40px;background:var(--flaeche);}
.fuss-innen{
  max-width:1280px;margin:0 auto;padding:20px 24px 30px;
  display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;
  font-size:13px;color:var(--text-weich);
}
.fuss a{color:var(--text-weich);}
.fuss a:hover{color:var(--dunkel);}
.fuss .verein{margin-right:auto;font-weight:600;color:var(--tinte);}

@media print{
  .kopf,.fuss,.formular,.legende,.scroll-hinweis{display:none !important;}
  .plan{box-shadow:none;border:none;padding:0;}
  .plan-scroll{overflow:visible;}
  .plan-innen{min-width:0;}
}

/* ==========================================================================
   Teil 3: Adminbereich.
   ========================================================================== */

.kopf .abmeldeform{margin:0;}
button.login{background:transparent;}

/* Im Adminplan steht auf belegten Plaetzen der Name statt der Nummer.
   Dafuer brauchen die Kaestchen mehr Breite; das dreispaltige Raster bleibt,
   der Plan wird nur breiter und scrollt seitlich. */
.raum.weit{max-width:1660px;}
.plan-innen.admin{min-width:1240px;}
.platz.breit{
  min-width:92px;padding:0 8px;font-size:12px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block;
  line-height:30px;text-align:center;
}
.platz.breit[data-status="frei"],
.platz.breit[data-status="gewaehlt"]{font-size:13px;}
.platz[data-status="belegt"]{cursor:pointer;}
.platz[data-status="gesperrt"]{cursor:pointer;}

/* ---------- Bereichskopf ---------- */
.bereichskopf{
  display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;
  margin:26px 0 14px;
}
.bereichskopf:first-child{margin-top:0;}
.bereichskopf h2{margin:0;font-size:20px;font-weight:700;letter-spacing:-.3px;}
.bereichskopf > div:first-child{margin-right:auto;}
.bereichskopf .knoepfe{margin-left:auto;}
.leise{color:var(--text-weich);font-size:13px;margin:2px 0 0;}

.knoepfe{display:flex;flex-wrap:wrap;gap:7px;align-items:center;}
.knoepfe form{margin:0;}
.knopf.klein{padding:6px 14px;font-size:13px;font-weight:600;}
.knopf.gefahr{color:var(--belegt-bg);border-color:var(--fehler-rand);}
.knopf.gefahr:hover{background:var(--fehler-bg);}

/* ---------- Auswahlleiste ---------- */
.auswahlleiste{
  display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;
  background:var(--platte);border:1px solid var(--platte-rand);
  border-radius:12px;padding:12px 16px;margin-bottom:16px;
  font-size:14px;font-weight:600;color:var(--platte-text);
}
.auswahlleiste .marken{margin:0;}
.auswahlleiste .marken span{background:var(--flaeche);}
.auswahlleiste .knoepfe{margin-left:auto;}
/* Muss sein: das display:flex oben wuerde sonst das hidden-Attribut
   ueberstimmen, und die Leiste stuende auch ohne Auswahl da. */
.auswahlleiste[hidden]{display:none;}

/* ---------- Tabellen ---------- */
.tabelle-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.liste{
  width:100%;border-collapse:collapse;background:var(--flaeche);
  border:1px solid var(--linie);border-radius:14px;overflow:hidden;
  font-size:14px;
}
.liste th,.liste td{padding:11px 14px;text-align:left;vertical-align:top;}
.liste thead th{
  background:#faf8f7;border-bottom:1px solid var(--linie-fest);
  font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;
  color:var(--text-weich);white-space:nowrap;
}
.liste tbody tr{border-bottom:1px solid var(--linie);}
.liste tbody tr:last-child{border-bottom:none;}
.liste tbody tr:hover{background:#fcfbfa;}
.liste .zahl{text-align:right;font-variant-numeric:tabular-nums;}
.liste tr.storniert{color:var(--text-weich);}
.liste tr.storniert b{font-weight:600;}

/* Nicht ".marke" nennen - so heisst in der Vorlage schon die Beschriftung
   fuer Eingang und Schank, die halbhoch neben dem Tisch steht. */
.zustandsmarke{
  display:inline-block;font-size:12px;font-weight:700;letter-spacing:.3px;
  border-radius:99px;padding:3px 10px;white-space:nowrap;
}
.zustandsmarke.gut{background:var(--frei-bg);border:1px solid var(--frei-rand);color:var(--frei-text);}
.zustandsmarke.zu{background:var(--platte);border:1px solid var(--platte-rand);color:var(--platte-text);}

/* ---------- Anmeldung und schmale Formulare ---------- */
.anmeldung{max-width:460px;margin:30px auto;}
.formular.schmal{max-width:620px;}
.anmeldung .formular{margin-top:0;}
.feld select{
  font:inherit;padding:10px 12px;border-radius:9px;background:var(--grund);
  border:1px solid var(--linie-fest);color:var(--tinte);
}
code{
  background:var(--grund);border:1px solid var(--linie);border-radius:5px;
  padding:1px 5px;font-size:13px;
}

/* ---------- Fenster ---------- */
dialog.fenster{
  border:1px solid var(--linie-fest);border-radius:16px;padding:24px;
  background:var(--flaeche);color:var(--tinte);max-width:640px;width:calc(100% - 32px);
  box-shadow:0 12px 48px rgba(16,32,26,.22);
}
dialog.fenster::backdrop{background:rgba(42,27,30,.42);}
dialog.fenster h3{margin:0 0 4px;font-size:19px;font-weight:700;letter-spacing:-.2px;}
dialog.fenster .leise{margin:0 0 18px;}
dialog.fenster .felder{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;}
@media (max-width:620px){dialog.fenster .felder{grid-template-columns:1fr;}}
dialog.fenster input[readonly]{
  background:#faf8f7;color:var(--text-weich);border-style:dashed;
}
dialog.fenster .storno{
  margin-top:18px;padding-top:16px;border-top:1px solid var(--linie);
}

/* ---------- Druckblatt ---------- */
.druckblatt{
  background:var(--flaeche);border:1px solid var(--linie);border-radius:14px;padding:24px;
}
.blattkopf{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:flex-start;
  padding-bottom:14px;border-bottom:2px solid var(--dunkel);}
.blattkopf h1{margin:0;font-size:22px;font-weight:700;letter-spacing:-.3px;}
.blattkopf p{margin:2px 0 0;color:var(--text-weich);font-size:14px;}
.blattzahlen{display:flex;gap:20px;margin-left:auto;}
.blattzahlen div{display:flex;flex-direction:column;align-items:flex-end;}
.blattzahlen b{font-size:22px;font-weight:700;}
.blattzahlen span{font-size:12px;color:var(--text-weich);}
.blattnotiz{margin:10px 0 16px;font-size:13px;color:var(--text-weich);}
.liste.druck{border:none;border-radius:0;}
.liste.druck tbody tr:hover{background:transparent;}
.liste.druck .haken{width:70px;border:none;}
.liste.druck .haken::after{
  content:"";display:block;width:17px;height:17px;
  border:1px solid var(--linie-fest);border-radius:4px;
}
.notizzeile td{padding-top:0;font-size:13px;color:var(--text-weich);}
.gesperrtzeile{color:var(--text-weich);background:#faf8f7;}

@media print{
  .nicht-drucken{display:none !important;}
  .druckblatt{border:none;border-radius:0;padding:0;}
  .liste.druck thead{display:table-header-group;}   /* Kopfzeile auf jeder Seite */
  .liste.druck tr{break-inside:avoid;}
  .liste.druck tbody tr:nth-child(even){background:#f7f7f7;}
  body{font-size:12px;}
  @page{margin:14mm;}
}

/* ---------- Gefahrenbereich ---------- */
.gefahrenfeld{
  border:2px solid var(--fehler-rand);border-radius:16px;background:var(--fehler-bg);
  padding:22px;margin-bottom:10px;
}
.gefahrenfeld h3{margin:0 0 4px;font-size:18px;font-weight:700;color:#8d2b1e;}
.gefahrenfeld > p{margin:0 0 16px;font-size:14px;max-width:80ch;}
.gefahrenfeld .liste{margin-bottom:14px;}
.gefahrenfeld .leise{margin:0;max-width:80ch;}
.alle-zeile{background:#fff4f2;}
.alle-zeile td{border-top:2px solid var(--fehler-rand);}
.knopf.gefahr-voll{
  background:var(--belegt-bg);border-color:var(--belegt-rand);color:#fff5f3;
}
.knopf.gefahr-voll:hover{background:#b13224;}
dialog.gefahrenfenster{border-color:var(--fehler-rand);border-width:2px;}
.gefahrensatz{
  margin:0 0 18px;padding:12px 14px;border-radius:10px;
  background:var(--fehler-bg);border:1px solid var(--fehler-rand);
  font-size:14px;color:#8d2b1e;
}
dialog.gefahrenfenster .feld{margin-bottom:14px;}
.gefahrenweg{
  margin-top:44px;padding-top:18px;border-top:1px solid var(--linie);
  font-size:13px;
}
.gefahrenweg a{color:var(--text-weich);text-decoration:none;}
.gefahrenweg a:hover{color:var(--belegt-bg);text-decoration:underline;}