/* =========================================================================
   Familien der Götter · Figurensuche (Lupe oben rechts)
   ========================================================================= */
.such-knopf{width:40px;padding:0;justify-content:center;flex:none}
.such-knopf svg{width:19px;height:19px}
.such-knopf:hover,.such-knopf.ist-offen{border-color:var(--akzent)}
.such-knopf.ist-offen{background:var(--tinte-3)}

.such-panel{position:fixed;right:16px;top:calc(var(--leiste) + 10px);z-index:46;width:min(540px,calc(100vw - 32px));max-height:calc(100vh - var(--leiste) - 28px);max-height:calc(100dvh - var(--leiste) - 28px);display:flex;flex-direction:column;background:var(--tinte);border:1px solid var(--tinte-3);border-radius:22px;box-shadow:0 18px 50px rgba(0,0,0,.5);overflow:hidden;animation:sage-auf .28s var(--feder,ease) both}
.such-panel[hidden]{display:none}

.such-feld{position:relative;display:flex;align-items:center;gap:10px;margin:12px 12px 6px;padding:0 8px 0 14px;height:52px;border-radius:16px;background:var(--tinte-2);border:1.5px solid var(--tinte-3);transition:border-color .2s,box-shadow .2s}
.such-feld:focus-within{border-color:var(--akzent);box-shadow:0 0 0 4px color-mix(in srgb,var(--akzent) 18%,transparent)}
.such-feld>svg{width:20px;height:20px;flex:none;color:var(--akzent)}
.such-eingabe{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--papier);font:500 17px var(--f-text,inherit);outline:none}
.such-eingabe::placeholder{color:var(--papier-2);opacity:.8}
.such-eingabe::-webkit-search-cancel-button{display:none}
.such-leeren{width:30px;height:30px;border-radius:50%;border:0;background:var(--tinte-3);color:var(--papier);font-size:18px;line-height:1;cursor:pointer;flex:none}
.such-leeren[hidden]{display:none}
.such-zu{height:28px;padding:0 9px;border-radius:8px;border:1px solid var(--tinte-3);background:none;color:var(--papier-2);font:600 11px var(--f-text,inherit);letter-spacing:.06em;cursor:pointer;flex:none}
.such-zu:hover{color:var(--papier);border-color:var(--papier-2)}

.such-liste{overflow-y:auto;overscroll-behavior:contain;padding:4px 8px 12px;scroll-padding:44px 0 8px}
.such-kopf{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 4px;padding:10px 8px 6px;background:var(--tinte);font-family:var(--f-display);font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--akzent)}
.such-kopf--fremd{color:var(--papier-2);margin-top:14px;border-top:1px solid var(--tinte-3);padding-top:14px}
.such-kopf i{font-style:normal;min-width:24px;height:22px;padding:0 7px;border-radius:999px;display:grid;place-items:center;background:var(--tinte-2);color:var(--papier);font-size:12px;letter-spacing:0}

.such-treffer{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;width:100%;padding:8px 10px;border:0;border-radius:14px;background:none;color:var(--papier);text-align:left;cursor:pointer;font:inherit}
.such-treffer+.such-treffer{margin-top:2px}
.such-treffer.ist-aktiv{background:var(--tinte-2);box-shadow:inset 0 0 0 1px var(--tinte-3)}
.such-treffer:focus-visible{outline:2px solid var(--akzent);outline-offset:-2px}
.such-bild svg{width:42px;height:42px;border-radius:50%;display:block;box-shadow:0 0 0 2px var(--tinte-3)}
.such-text{display:grid;gap:2px;min-width:0}
.such-text b{font-family:var(--f-display);font-weight:700;font-size:16px;line-height:1.2}
.such-text>span{font-size:13px;line-height:1.35;color:var(--papier-2);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.such-feldname{color:var(--papier);opacity:.75}
.such-panel mark{background:color-mix(in srgb,var(--akzent) 30%,transparent);color:var(--papier);border-radius:3px;padding:0 1px}
.such-pfeil{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;color:var(--akzent);opacity:0;transition:opacity .15s}
.such-treffer.ist-aktiv .such-pfeil{opacity:1}
.such-myth{--ma:#8FB4FF;justify-self:end;white-space:nowrap;padding:4px 10px;border-radius:999px;font:700 12px var(--f-display);color:var(--ma);background:color-mix(in srgb,var(--ma) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ma) 40%,transparent)}
.such-nichts{margin:2px 10px 6px;font-size:14px;color:var(--papier-2)}
.such-mehr{display:block;margin:10px auto 2px;height:36px;padding:0 16px;border-radius:999px;border:1px solid var(--tinte-3);background:var(--tinte-2);color:var(--papier);font:600 13px var(--f-text,inherit);cursor:pointer}
.such-mehr:hover{border-color:var(--akzent)}

.such-leer{padding:8px 10px 6px}
.such-leer p{margin:0 0 12px;font-size:14px;line-height:1.5;color:var(--papier-2)}
.such-vorschlaege{display:flex;flex-wrap:wrap;gap:8px}
.such-chip{height:32px;padding:0 13px;border-radius:999px;border:1px solid var(--tinte-3);background:var(--tinte-2);color:var(--papier);font:600 13px var(--f-text,inherit);cursor:pointer}
.such-chip:hover{border-color:var(--akzent);color:var(--akzent)}

@media (max-width:860px){
  .such-knopf{width:38px;height:38px}
  .such-panel{left:12px;right:12px;width:auto;top:calc(var(--leiste) + 8px);max-height:calc(100dvh - var(--leiste) - 20px)}
  .such-zu{display:none}
  .such-eingabe{font-size:16px}
}
@media (max-width:480px){
  .such-treffer{grid-template-columns:auto 1fr;gap:10px}
  .such-bild{grid-row:span 2}
  .such-myth{grid-column:2;justify-self:start;margin-top:-2px;padding:2px 8px;font-size:11px}
  .such-pfeil{display:none}
  .such-bild svg{width:38px;height:38px}
}
@media (prefers-reduced-motion:reduce){ .such-panel{animation:none} }

/* ---------- „Wie verwandt?“ in der Suche (19.10.): eigener Kopfleisten-Knopf entfällt ---------- */
#k-rechner{display:none!important}
.such-knopf__text{display:none}
@media (min-width:1600px){ .such-knopf{width:auto!important;padding:0 14px 0 11px!important;gap:7px} .such-knopf__text{display:inline;font-weight:600} }
.such-verwandt{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin:2px 12px 6px;padding:8px 12px 8px 8px;border-radius:14px;cursor:pointer;text-align:left;font:inherit;
  color:var(--papier);background:var(--tinte-2);border:2px solid var(--kante,#0A0820);box-shadow:0 3px 0 var(--kante,#0A0820);transition:transform .25s var(--feder),box-shadow .25s var(--feder),background-color .2s}
.such-verwandt:hover{background:var(--tinte-3);transform:translateY(-2px);box-shadow:0 5px 0 var(--kante,#0A0820)}
.such-verwandt:focus-visible{outline:3px solid var(--akzent);outline-offset:2px}
.such-verwandt__ikon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--akzent);color:var(--akzent-text,#121028);border:2px solid var(--kante,#0A0820)}
.such-verwandt__ikon svg{width:21px;height:21px}
.such-verwandt__text{display:grid;gap:2px;min-width:0}
.such-verwandt__text b{font:600 15.5px/1.15 var(--f-display)}
.such-verwandt__text small{font-size:12.5px;line-height:1.3;color:var(--papier-2)}
@media (prefers-reduced-motion:reduce){ .such-verwandt{transition:none} }