/* Geisterarchiv – Hilfeseite der Wirkwerkstatt (ergänzt bibliothek.css) */
.hilfe .text { max-width: 860px; }
.inhalt { margin: 18px 0 30px; padding: 14px 20px; border: 1px solid rgba(110, 74, 29, .35); border-radius: 6px; background: rgba(255, 250, 235, .35); }
.inhalt b { font: 500 18px "Alegreya", serif; font-variant: small-caps; letter-spacing: .1em; color: #9a2c1b; }
.inhalt ol { columns: 2; column-gap: 28px; margin: 8px 0 0; padding-left: 20px; }
.inhalt li { margin: 3px 0; break-inside: avoid; }
.hilfe h2 { scroll-margin-top: 20px; }
.bild { margin: 18px 0 22px; }
.bild img { display: block; width: 100%; height: auto; border-radius: 6px; border: 1px solid rgba(43, 26, 14, .5); box-shadow: 0 8px 24px rgba(43, 26, 14, .35); }
.bild figcaption { margin-top: 8px; font-style: italic; font-size: 15.5px; line-height: 1.45; opacity: .8; }
.bild.breit { margin-left: -40px; margin-right: -40px; }
.bild.mittel { max-width: 560px; margin-left: auto; margin-right: auto; }
.bildpaar { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.bildtext { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 26px; align-items: start; margin: 10px 0; }
.bild.schmal { margin-top: 4px; }
.schritte li { margin-bottom: 6px; }
.tabelle-huelle { overflow-x: auto; margin: 10px 0 18px; }
.hilfe .tabelle { width: 100%; border-collapse: collapse; font-size: 15.5px; }
.hilfe .tabelle th { text-align: left; font: 500 14px "Alegreya", serif; font-variant: small-caps; letter-spacing: .08em; color: #7a4f22; border-bottom: 1px solid rgba(110, 74, 29, .45); padding: 6px 8px; }
.hilfe .tabelle td { padding: 7px 8px; border-bottom: 1px solid rgba(110, 74, 29, .18); vertical-align: top; }
.rollen-tabelle td:first-child { font-weight: 600; white-space: nowrap; }
.r-traegt { color: #4f7a2a; } .r-faerbt { color: #a8701a; } .r-stoert { color: #a3321c; } .r-ruht { opacity: .7; } .r-warn { color: #c2410c; }
.zeichen { display: inline-block; width: 1.3em; text-align: center; font-weight: 600; }
.zeichen.gut { color: #4f7a2a; } .zeichen.farbe { color: #a8701a; } .zeichen.gegen { color: #a3321c; } .zeichen.warn { color: #c2410c; } .zeichen.info { opacity: .7; }
/* Bestandteile */
.teile { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; margin: 8px 0 22px; }
.teil { border: 1px solid rgba(201, 163, 82, .22); border-radius: 6px; background: radial-gradient(ellipse at 20% 0, rgba(59, 39, 21, .9), rgba(26, 16, 8, .9)); }
.teil[open] { grid-column: 1 / -1; }
.teil summary { display: grid; grid-template-columns: 64px 1fr; gap: 12px; align-items: center; padding: 10px 12px; cursor: pointer; list-style: none; }
.teil summary::-webkit-details-marker { display: none; }
.teil-bild { position: relative; width: 64px; height: 64px; }
.teil-bild img { width: 64px; height: 64px; object-fit: contain; filter: drop-shadow(2px 4px 3px rgba(0, 0, 0, .6)); }
.teil.grimoire .teil-bild img, .teil-bild img[src*="/siegel/"] { background: radial-gradient(circle, #eedcae, #cdb07a); border-radius: 50%; mix-blend-mode: normal; padding: 6px; box-sizing: border-box; }
.teil-glyph { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font: 400 26px "Garamond", "Segoe UI Symbol", serif; color: rgba(25, 18, 10, .78); text-shadow: 0 1px 0 rgba(255, 246, 220, .5); pointer-events: none; }
.teil-text { display: flex; flex-direction: column; gap: 1px; line-height: 1.25; color: rgba(234, 217, 179, .9); }
.teil-text b { font-size: 17px; color: #ead9b3; font-weight: 600; }
.teil-klein { font-style: italic; font-size: 14.5px; opacity: .85; }
.teil-info, .teil-kraft { font-size: 13.5px; opacity: .75; }
.teil-marken { font-size: 12.5px; letter-spacing: .04em; color: var(--gold); opacity: .85; }
.teil.giftig .teil-marken { color: #ff8a5c; }
.teil-karte { padding: 0 16px 14px 88px; }
.teil-karte h4 { margin: 10px 0 2px; font: 500 13px "Alegreya", serif; font-variant: small-caps; letter-spacing: .1em; color: var(--gold); }
.teil-karte p { margin: 0; font-size: 15.5px; line-height: 1.5; color: rgba(234, 217, 179, .9); }
.teil-karte .vorsicht { color: #ffb08f; }
.rezeptnamen { columns: 2; column-gap: 28px; }
.rezeptnamen li { break-inside: avoid; margin-bottom: 4px; }
.vorsicht-liste li { margin-bottom: 6px; }
.fragen dt { margin-top: 12px; font-weight: 600; color: #9a2c1b; }
.fragen dd { margin: 3px 0 0; line-height: 1.5; }
@media (max-width: 920px) { .bild.breit { margin-left: 0; margin-right: 0; } }
@media (max-width: 640px) {
  .inhalt ol, .rezeptnamen { columns: 1; }
  .bildpaar, .bildtext { grid-template-columns: 1fr; }
  .bild.schmal { max-width: 300px; margin-left: auto; margin-right: auto; }
  .teil-karte { padding-left: 16px; }
}
.teil summary, .teil summary * { font-variant: normal; text-transform: none; letter-spacing: normal; }