/* Stempel: Knopf auf Station-Seiten und Stempelbild. Der Zustand wechselt ohne Bewegung; die Rückmeldung ist der Ring im Wasser
   mit einem Wort am Knopf (rahmen.js, hvHinweis). Kein Konfetti, keine Landung. */
.stempel-bereich { position: relative; margin-top: 1.2rem; padding-top: 1rem; border-top: 1px dashed var(--farbe-linie, #d8cfbd); }
.stempel-bereich[hidden] { display: none; }
.stempel-knopf {
  display: flex;
  align-items: center;
  gap: .9rem;
  width: 100%;
  min-height: 72px;
  padding: .6rem 1rem;
  border: 2px solid var(--farbe-akzent, #8a3b2a);
  border-radius: var(--radius, 10px);
  background: var(--farbe-papier, #f7f3ea);
  color: var(--farbe-akzent, #8a3b2a);
  font: inherit;
  font-size: 1.1rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.stempel-knopf:hover { background: var(--farbe-flaeche-2, #efe8d9); }
.stempel-knopf:focus-visible { outline: 3px solid var(--farbe-fokus, #1a5fb4); outline-offset: 3px; }
.stempel-marke { position: relative; display: inline-flex; flex: 0 0 auto; width: 56px; height: 56px; }
.stempel-klein { width: 56px; height: 56px; opacity: .4; transform: rotate(var(--st-dreh, 0deg)); }
.stempel-klein .stempel-ring circle:first-child { stroke-dasharray: 5 4; }
.ist-gestempelt .stempel-klein { opacity: 1; }
.ist-gestempelt .stempel-klein .stempel-ring circle:first-child { stroke-dasharray: none; }
.ist-gestempelt .stempel-knopf { background: var(--farbe-akzent, #8a3b2a); color: var(--farbe-auf-akzent, #fff); }
.ist-gestempelt .stempel-knopf:hover { filter: brightness(1.08); }
.stempel-status { margin: .6rem 0 0; font-size: var(--t-klein); color: var(--farbe-text-leise, #6b6254); }
.stempel-link { margin: .4rem 0 0; font-size: var(--t-klein); }
.stempel-link a { display: inline-flex; align-items: center; min-height: 44px; }
.stempel-fertig { margin: .8rem 0 0; padding: .7rem .9rem; border-left: 4px solid var(--farbe-akzent, #8a3b2a); background: var(--farbe-flaeche-2, #efe8d9); font-weight: 600; }
.stempel-fertig[hidden] { display: none; }
