/* Wunderkammer-Design (optional, Einstellung „Erscheinungsbild“). Überlagert public.css nur unter html[data-design="wunderkammer"].
   Palette: Pergament (Fläche), Eichenholz (Text/Knöpfe), Schiefer (Kopf/Fuß), Messing (Akzente). Kontraste (WCAG 2.1 AA, gerechnet):
   Text #2a2118 auf Pergament #f4ecd8 ≈ 13:1 · Messingtext #6b4b0f auf Pergament ≈ 6:1 · Pergament auf Schiefer #2b3238 ≈ 11:1 · Messing #d9b46a auf Schiefer ≈ 7:1.
   Schriften lokal (SIL OFL), keine Anfragen an Dritte. */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/wk/cormorant-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/wk/cormorant-garamond-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/wk/cormorant-garamond-latin-500-italic.woff2) format("woff2")}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/wk/work-sans-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Work Sans";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/wk/work-sans-latin-600-normal.woff2) format("woff2")}

html[data-design="wunderkammer"]{
  --bg:#e9dfc6;--flaeche:#f4ecd8;--text:#2a2118;--text2:#4a3b2a;--linie:#b9a57c;--akzent:#4a3523;--sand:#2b3238;--fokus:#8a5a00;
  --messing:#b88a35;--messing-hell:#d9b46a;--messing-text:#6b4b0f;--eiche:#4a3523;--eiche-hell:#6b4c30;--schiefer:#2b3238;--pergament:#f4ecd8;--pergament-dunkel:#e3d5b2;
  --serif:"Cormorant Garamond","Palatino Linotype",Palatino,Georgia,serif;--grotesk:"Work Sans","Segoe UI",system-ui,sans-serif}
html[data-design="wunderkammer"] body{background:var(--bg) radial-gradient(ellipse at top,#f1e7cf 0,#e6dabb 60%,#ddcfa9 100%) fixed;color:var(--text);font:16px/1.55 var(--grotesk)}
html[data-design="wunderkammer"] a{color:var(--messing-text)}
html[data-design="wunderkammer"] a:hover{color:var(--eiche)}
html[data-design="wunderkammer"] :focus-visible{outline:3px solid var(--fokus);outline-offset:2px;box-shadow:0 0 0 5px rgba(244,236,216,.9)}
/* Kopf: Schieferplatte mit Messingkante */
html[data-design="wunderkammer"] .kopf{background:linear-gradient(#323a41,#2b3238);border-bottom:3px solid var(--messing);box-shadow:0 2px 0 #1d2226}
html[data-design="wunderkammer"] .marke,html[data-design="wunderkammer"] nav a{color:var(--pergament)}
html[data-design="wunderkammer"] nav a{font-family:var(--grotesk);font-weight:600;letter-spacing:.03em;border-bottom:2px solid transparent;padding:.35rem 0}
html[data-design="wunderkammer"] nav a:hover,html[data-design="wunderkammer"] nav a[aria-current]{border-bottom-color:var(--messing-hell);color:#fff}
html[data-design="wunderkammer"] .menueknopf,html[data-design="wunderkammer"] .linkknopf{color:var(--pergament)}
/* Überschriften: Antiqua mit Zierlinie */
html[data-design="wunderkammer"] h1,html[data-design="wunderkammer"] h2,html[data-design="wunderkammer"] .seitentitel{font-family:var(--serif);font-weight:600;color:var(--eiche);letter-spacing:.01em}
html[data-design="wunderkammer"] .seitentitel{font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1.15;border-bottom:1px solid var(--linie);padding-bottom:.35rem;position:relative}
html[data-design="wunderkammer"] .seitentitel::after{content:"";position:absolute;left:0;bottom:-3px;width:5.5rem;height:3px;background:var(--messing)}
html[data-design="wunderkammer"] .inv-gross{font-family:var(--grotesk);color:var(--text2)}
/* Flächen: Pergament mit Eichenrand */
html[data-design="wunderkammer"] .infoleiste,html[data-design="wunderkammer"] .filter,html[data-design="wunderkammer"] .tabelle-rahmen,html[data-design="wunderkammer"] .karte-obj,html[data-design="wunderkammer"] .facetten details{background:var(--flaeche);border:1px solid var(--linie);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 1px 3px rgba(60,40,10,.12)}
html[data-design="wunderkammer"] .karte-obj{border-radius:3px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
html[data-design="wunderkammer"] .karte-obj:hover,html[data-design="wunderkammer"] .karte-obj:focus-within{transform:translateY(-3px);border-color:var(--messing);box-shadow:0 8px 18px rgba(60,40,10,.22)}
html[data-design="wunderkammer"] .bildlink{border:2px solid var(--eiche);background:#14181b;outline:1px solid var(--messing);outline-offset:-5px}
html[data-design="wunderkammer"] .bildlink img{transition:transform .35s ease}
html[data-design="wunderkammer"] .karte-obj:hover .bildlink img{transform:scale(1.04)}
html[data-design="wunderkammer"] .tabelle th{background:var(--eiche);color:var(--pergament);font-family:var(--grotesk);border-bottom:2px solid var(--messing)}
html[data-design="wunderkammer"] .tabelle tr:hover td{background:#efe4c8}
/* Knöpfe und Felder */
html[data-design="wunderkammer"] .knopf{background:var(--eiche);color:var(--pergament);border:1px solid #2b1d10;border-radius:3px;font-family:var(--grotesk);font-weight:600;min-height:44px;display:inline-flex;align-items:center;transition:background .15s,border-color .15s,transform .1s}
html[data-design="wunderkammer"] .knopf:hover{background:var(--eiche-hell);color:#fff;border-color:var(--messing)}
html[data-design="wunderkammer"] .knopf:active{transform:translateY(1px)}
html[data-design="wunderkammer"] .knopf.zweit{background:var(--pergament);color:var(--eiche);border-color:var(--linie)}
html[data-design="wunderkammer"] .knopf.zweit:hover{background:var(--pergament-dunkel)}
html[data-design="wunderkammer"] input,html[data-design="wunderkammer"] select,html[data-design="wunderkammer"] textarea{background:#fbf6e8;border:1px solid #7d6a45;color:var(--text);min-height:44px;border-radius:2px}
html[data-design="wunderkammer"] label{color:var(--eiche)}
/* Status-Plaketten */
html[data-design="wunderkammer"] .status{background:var(--pergament-dunkel);border-color:var(--linie);color:var(--text);font-family:var(--grotesk)}
/* Facetten (Katalog) */
html[data-design="wunderkammer"] .facetten{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.6rem;margin:.8rem 0}
html[data-design="wunderkammer"] .facetten summary{cursor:pointer;font-family:var(--serif);font-weight:600;font-size:1.1rem;padding:.4rem .7rem;color:var(--eiche);min-height:44px;display:flex;align-items:center}
html[data-design="wunderkammer"] .facetten ul{list-style:none;margin:0;padding:.2rem .7rem .6rem}
html[data-design="wunderkammer"] .facetten li a{display:block;padding:.3rem 0;min-height:32px}
html[data-design="wunderkammer"] .facetten [aria-current]{font-weight:600;border-left:3px solid var(--messing);padding-left:.4rem}
/* Fuß */
html[data-design="wunderkammer"] .fuss{background:var(--schiefer);color:#d8cfb8;border-top:3px solid var(--messing);max-width:none;margin:2rem 0 0;padding:1rem}
html[data-design="wunderkammer"] .fuss a{color:var(--messing-hell)}
html[data-design="wunderkammer"] .rechtstext{max-width:70ch;font-family:var(--serif);font-size:1.2rem;line-height:1.6}
@media (prefers-reduced-motion:reduce){html[data-design="wunderkammer"] *,html[data-design="wunderkammer"] *::before{transition:none!important;animation:none!important}
  html[data-design="wunderkammer"] .karte-obj:hover{transform:none}html[data-design="wunderkammer"] .karte-obj:hover .bildlink img{transform:none}}
@media (forced-colors:active){html[data-design="wunderkammer"] .knopf{border:2px solid ButtonText}}
/* Logo (dunkle Schrift, transparenter Grund) liegt auf einer Pergamentplakette; Zusatztext in Messing */
html[data-design="wunderkammer"] .marke-logo{background:var(--pergament);padding:3px 8px;border-radius:3px;border:1px solid var(--messing)}
html[data-design="wunderkammer"] .marke small,html[data-design="wunderkammer"] .marke .zusatz{color:var(--messing-hell)}
