/* Werkstatt-Siegel für Lab-Räume — Museum-Plakette am KI-Moment.
   Gegenstück zu site/src/components/Siegel.astro (gleiche Optik, standalone).
   Einbinden: <link rel="stylesheet" href="../_shared/siegel.css?v=1">
             <script src="../_shared/siegel.js?v=1" defer></script>
   Markup:   <button class="fable-siegel" data-titel="…" data-was="…"
               data-womit="…" data-dauer="…" data-bruecke="…" data-bruecke-url="…">✳</button>
   Dunkle Bühne: zusätzlich class "fable-siegel--dunkel". */

.fable-siegel-wrap { position: relative; display: inline-block; line-height: 1; }
.fable-siegel {
  display: inline-grid; place-items: center;
  width: 1.55rem; height: 1.55rem; padding: 0;
  margin: -0.2rem 0;
  border: 1px solid rgba(200, 165, 91, 0.55);
  border-radius: 50%;
  background: rgba(200, 165, 91, 0.1);
  color: #A8853F;
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 0.8rem; font-style: normal; line-height: 1;
  cursor: pointer; vertical-align: baseline;
  transition: background 0.25s ease, border-color 0.25s ease;
}
.fable-siegel:hover, .fable-siegel[aria-expanded="true"] {
  background: rgba(200, 165, 91, 0.22);
  border-color: #C8A55B;
}
.fable-siegel:focus-visible { outline: 2px solid #A8853F; outline-offset: 2px; }
.fable-siegel--dunkel {
  color: #DCC089;
  border-color: rgba(220, 192, 137, 0.55);
  background: rgba(220, 192, 137, 0.12);
}

.fs-karte {
  position: absolute; z-index: 80;
  bottom: calc(100% + 0.65rem); left: 50%; transform: translateX(-50%);
  width: min(86vw, 21rem);
  background: #FBF8F3;
  border: 1px solid #E8DDC8;
  border-top: 2px solid #C8A55B;
  border-radius: 10px;
  box-shadow: 0 18px 44px -16px rgba(31, 26, 23, 0.32);
  padding: 0.95rem 1.05rem 1rem;
  text-align: left; cursor: auto;
  font-style: normal; text-transform: none; letter-spacing: 0;
}
.fs-karte > * { display: block; margin: 0; max-width: none; }
.fs-kopf {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 0.62rem; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase;
  color: #A8853F; margin-bottom: 0.55rem; padding-right: 1.4rem;
}
.fs-zu {
  position: absolute; top: 0.5rem; right: 0.55rem;
  border: 0; background: none; padding: 0.2rem; cursor: pointer;
  color: #877B71; font-size: 0.8rem; line-height: 1;
}
.fs-zu:hover { color: #1F1A17; }
.fs-was {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 0.88rem; line-height: 1.55; color: #1F1A17;
  margin-bottom: 0.7rem;
}
.fs-zeile {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 0.78rem; line-height: 1.5; color: #4A413B;
  margin-bottom: 0.25rem;
}
.fs-label {
  display: inline-block; min-width: 3.4rem;
  font-size: 0.62rem; font-weight: 600; letter-spacing: 0.16em;
  text-transform: uppercase; color: #877B71;
}
.fs-bruecke {
  margin-top: 0.65rem; padding-top: 0.6rem;
  border-top: 1px solid #E8DDC8;
  font-family: 'EB Garamond', Georgia, serif; font-style: italic;
  font-size: 0.92rem; line-height: 1.5; color: #8B1A6B;
  text-decoration: none;
}
a.fs-bruecke:hover { color: #6E1455; }
