*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#060504;--text:#e8e3da;--muted:#58524c;--dim:#1e1a16;--red:#7a1515;--mono:'Courier New',Courier,monospace;--serif:'IM Fell English',serif}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--mono);font-size:clamp(15px,1.35vw,18px);line-height:1.75;min-height:100vh;overflow-x:hidden}#bg-img{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;opacity:.07;z-index:0;pointer-events:none;display:none}#bg-img.loaded{display:block}#wave-canvas{position:fixed;inset:0;pointer-events:none;z-index:1}.site{position:relative;z-index:2;max-width:1100px;margin:0 auto;padding:0 clamp(24px,5vw,80px)}header{padding:clamp(60px,8vw,130px) 0 clamp(48px,5vw,80px);border-bottom:1px solid var(--dim)}h1.site-name{font-family:var(--serif);font-size:clamp(3.2rem,7vw,6rem);font-weight:400;letter-spacing:.02em;line-height:1;margin-bottom:clamp(14px,1.5vw,22px);cursor:pointer;display:inline-block;transition:opacity .2s}h1.site-name:hover{opacity:.7}.site-tagline{font-size:clamp(11px,1vw,14px);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:clamp(36px,4vw,60px)}.site-nav{display:flex;gap:0;flex-wrap:wrap;align-items:flex-start}.nav-btn{background:none;border:none;border-bottom:2px solid transparent;color:var(--muted);font-family:var(--mono);font-size:clamp(15px,1.35vw,19px);letter-spacing:.12em;cursor:pointer;padding:clamp(5px,.5vw,8px) clamp(18px,2vw,30px) clamp(5px,.5vw,8px) 0;transition:color .2s,border-color .2s;text-decoration:none;display:inline-block}.nav-btn:hover,.nav-btn.active{color:var(--text);border-bottom-color:var(--red)}body.is-inner header{padding-top:clamp(38px,5vw,78px);padding-bottom:clamp(32px,4vw,58px)}body.is-inner h1.site-name{opacity:.36;font-size:clamp(2.4rem,5vw,4.2rem)}body.is-inner h1.site-name:hover{opacity:.72}body.is-inner .site-tagline{opacity:.55}.page{display:block;padding:clamp(52px,6vw,100px) 0 clamp(100px,12vw,200px)}.feed-grid{columns:3;column-gap:5px}.feed-card{break-inside:avoid;margin-bottom:5px;position:relative;background:var(--dim);overflow:hidden;color:inherit;text-decoration:none;display:block}.feed-card.type-img{cursor:pointer}.feed-card img{width:100%;display:block;filter:saturate(.85);transition:filter .4s,opacity .3s}.feed-card:hover img{filter:saturate(1);opacity:.85}.pin-badge{position:absolute;top:8px;left:8px;background:var(--red);color:#f0ece3;font-size:9px;padding:2px 7px;letter-spacing:.07em;text-transform:uppercase;z-index:4;pointer-events:none}.card-label{position:absolute;bottom:0;left:0;right:0;padding:14px 14px 10px;font-family:var(--serif);font-style:italic;font-size:clamp(.95rem,1.1vw,1.1rem);color:var(--text);background:linear-gradient(to top,rgba(6,5,4,.92),transparent);transform:translateY(100%);transition:transform .28s;pointer-events:none}.feed-card:hover .card-label{transform:translateY(0)}.feed-card.type-text{padding:clamp(20px,2.5vw,32px) clamp(18px,2vw,28px)}.text-title{font-family:var(--serif);font-size:clamp(1.2rem,1.5vw,1.45rem);margin-bottom:10px;line-height:1.3}.text-body{font-size:clamp(13px,1vw,15px);color:#9a9590;line-height:1.85}.list-section{display:flex;flex-direction:column;max-width:760px;margin:0 auto}.list-item{padding:clamp(36px,4vw,60px) 0;border-bottom:1px solid var(--dim)}.list-item:first-child{border-top:1px solid var(--dim)}.list-item-name{font-family:var(--serif);font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:400;margin-bottom:10px;line-height:1.2}.list-item-sub{font-size:clamp(13px,1.1vw,15px);color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin-bottom:20px}.list-item a,.entity-content a{display:inline-block;color:var(--muted);text-decoration:none;font-size:clamp(15px,1.25vw,17px);letter-spacing:.06em;border-bottom:1px dashed var(--dim);padding-bottom:1px;margin-right:24px;transition:color .15s,border-color .15s}.list-item a:hover,.entity-content a:hover{color:var(--text);border-color:var(--muted)}.entity-wrap{max-width:860px;margin:0 auto}.entity-tabs{display:flex;flex-wrap:wrap;gap:10px 18px;margin-bottom:clamp(32px,4vw,58px);border-bottom:1px solid var(--dim);padding-bottom:18px}.entity-tab{color:var(--muted);font-family:var(--mono);font-size:clamp(14px,1.15vw,17px);letter-spacing:.08em;text-decoration:none;border-bottom:1px solid transparent;padding:4px 0}.entity-tab:hover,.entity-tab.active{color:var(--text);border-color:var(--red)}.entity-content{color:#b4aea8;font-size:clamp(17px,1.45vw,20px);line-height:2.05}.entity-content h2{font-family:var(--serif);color:var(--text);font-weight:400;font-size:clamp(2rem,3vw,3rem);line-height:1.1;margin-bottom:12px}.entity-sub{color:var(--muted);font-size:clamp(13px,1.1vw,15px);letter-spacing:.12em;text-transform:uppercase;margin-bottom:28px}.entity-content p{margin-bottom:22px}.entity-gallery{columns:2;column-gap:8px;margin-top:clamp(30px,4vw,54px)}.entity-gallery-item{break-inside:avoid;margin-bottom:8px;background:var(--dim)}.entity-gallery-item img{width:100%;display:block;filter:saturate(.88)}.about-header{margin-bottom:clamp(40px,5vw,70px);padding-bottom:clamp(30px,3vw,44px);border-bottom:1px solid var(--dim)}.about-contact{font-size:clamp(15px,1.2vw,18px);color:#9a9590;line-height:2.1;margin-bottom:20px}.about-contact strong{color:var(--text);font-weight:400;letter-spacing:.05em}.about-contact a{color:var(--muted);text-decoration:none;border-bottom:1px dashed var(--dim);transition:color .15s}.about-contact a:hover{color:var(--text)}footer{padding:clamp(28px,3vw,44px) 0 clamp(60px,8vw,100px);color:var(--dim);font-size:11px;letter-spacing:.07em;border-top:1px solid var(--dim)}.empty{color:var(--dim);font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:70px 0}.seo-intro{max-width:760px;margin:0 auto clamp(34px,4vw,56px);color:#9a9590;font-size:clamp(15px,1.25vw,18px);line-height:2}.seo-intro strong{color:var(--text);font-weight:400}@media(max-width:800px){.feed-grid{columns:2}}@media(max-width:700px){.site{padding:0 clamp(18px,5vw,30px)}header{padding-top:54px;padding-bottom:42px}h1.site-name{font-size:clamp(3rem,15vw,4.6rem)}body.is-inner h1.site-name{font-size:clamp(2.4rem,12vw,3.6rem)}.site-tagline{font-size:12px;line-height:1.6}.nav-btn{font-size:17px;letter-spacing:.08em;padding:7px 18px 7px 0}.list-section,.entity-wrap{max-width:100%}.list-item{padding:34px 0}.list-item-name{font-size:1.85rem}.list-item-sub{font-size:14px;line-height:1.7}.entity-tabs{gap:8px 16px}.entity-tab{font-size:16px}.entity-content{font-size:18px;line-height:2.05}.entity-content h2{font-size:2.2rem}.entity-gallery{columns:1}.card-label{transform:translateY(0);font-size:1rem}.seo-intro{font-size:17px;line-height:2.05}}@media(max-width:480px){.feed-grid{columns:1}}
.gallery-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 auto clamp(30px,4vw,52px);
  max-width: 860px;
}
.gallery-search,
.gallery-select {
  background: #0d0b09;
  border: 1px solid var(--dim);
  color: var(--text);
  font-family: var(--mono);
  font-size: 15px;
  padding: 10px 12px;
}
.gallery-search { flex: 1 1 260px; }
.gallery-select { flex: 0 1 150px; }
.gallery-count {
  max-width: 860px;
  margin: -22px auto 30px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.gallery-more {
  display: block;
  margin: 38px auto 0;
  background: none;
  border: 1px solid var(--dim);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 14px;
  letter-spacing: .08em;
  padding: 12px 22px;
  cursor: pointer;
}
.gallery-more:hover { border-color: var(--red); color: var(--text); }
.card-meta {
  font-family: var(--mono);
  font-style: normal;
  font-size: 11px;
  letter-spacing: .08em;
  color: var(--muted);
  margin-top: 4px;
}
@media(max-width:700px){
  .gallery-search,.gallery-select{font-size:16px;width:100%}
  .gallery-controls{display:block}
  .gallery-controls > *{margin-bottom:10px}
}


.music-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(clamp(260px, 32vw, 420px), 1fr));
  gap: clamp(18px, 2.4vw, 32px);
}
.music-card {
  border-bottom: 1px solid var(--dim);
  padding-bottom: 28px;
}
.music-card h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.5rem,2vw,2rem);
  margin: 14px 0 8px;
}
.music-card p {
  color: #b4aea8;
  line-height: 1.9;
  margin: 12px 0;
}
.music-play {
  position: relative;
  width: 100%;
  border: none;
  padding: 0;
  background: var(--dim);
  cursor: pointer;
  display: block;
}
.music-play img {
  width: 100%;
  display: block;
  filter: saturate(.85);
}
.music-play span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(2rem,5vw,4rem);
  color: var(--text);
  background: rgba(6,5,4,.18);
}
.site-player {
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 800;
  background: rgba(6,5,4,.96);
  border: 1px solid var(--dim);
  display: grid;
  grid-template-columns: 1fr minmax(220px, 360px) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
}
.site-player[hidden] { display: none; }
.site-player iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  border: 0;
}
.site-player-title {
  color: var(--text);
  font-family: var(--serif);
  font-size: clamp(1rem,1.5vw,1.35rem);
  padding-left: 8px;
}
#site-player-close {
  background: none;
  border: 1px solid var(--dim);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 22px;
  width: 38px;
  height: 38px;
  cursor: pointer;
}
#site-player-close:hover { color: var(--text); border-color: var(--red); }
@media(max-width:700px){
  .site-player {
    grid-template-columns: 1fr auto;
  }
  .site-player iframe {
    grid-column: 1 / -1;
    order: 2;
  }
  .site-player-title { font-size: 1rem; }
}


.image-lightbox {
  position: fixed;
  inset: 0;
  z-index: 900;
  background: rgba(3,2,1,.96);
  display: flex;
  align-items: center;
  justify-content: center;
}
.image-lightbox[hidden] { display: none; }
.image-lightbox-backdrop {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  cursor: zoom-out;
}
#image-lightbox-img {
  max-width: 92vw;
  max-height: 90vh;
  object-fit: contain;
  transform: scale(1) translate(0,0);
  transform-origin: center center;
  transition: transform .16s ease;
  user-select: none;
  cursor: grab;
}
.image-lightbox-close {
  position: fixed;
  top: 18px;
  right: 24px;
  z-index: 904;
  background: none;
  border: 1px solid var(--dim);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 26px;
  width: 42px;
  height: 42px;
  cursor: pointer;
}
.image-lightbox-close:hover { color: var(--text); border-color: var(--red); }
.image-lightbox-tools {
  position: fixed;
  right: 24px;
  bottom: 24px;
  display: flex;
  gap: 8px;
  z-index: 904;
}
.image-lightbox-tools button {
  background: rgba(6,5,4,.88);
  border: 1px solid var(--dim);
  color: var(--muted);
  font-family: var(--mono);
  min-width: 40px;
  height: 40px;
  cursor: pointer;
}
.image-lightbox-tools button:hover { color: var(--text); border-color: var(--red); }

.entity-gallery-item.lightbox-link {
  display: block;
  text-decoration: none;
  border: 0;
  cursor: zoom-in;
}
.entity-gallery-item.lightbox-link img {
  transition: opacity .2s, filter .2s;
}
.entity-gallery-item.lightbox-link:hover img {
  opacity: .86;
  filter: saturate(1);
}


/* PATCH: Links sichtbarer */
.list-item a,
.entity-content a,
.music-card a {
  color: #d7c8ad !important;
  border-bottom: 1px solid rgba(215, 200, 173, .75) !important;
  background: rgba(122, 21, 21, .16);
  padding: 2px 5px;
  margin-top: 6px;
}
.list-item a:hover,
.entity-content a:hover,
.music-card a:hover {
  color: var(--text) !important;
  background: rgba(122, 21, 21, .34);
  border-color: var(--red) !important;
}

/* PATCH: ruhige, blockweise Bildergalerie */
.gallery-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 auto clamp(30px,4vw,52px);
  max-width: 860px;
}
.gallery-search,
.gallery-select {
  background: #0d0b09;
  border: 1px solid var(--dim);
  color: var(--text);
  font-family: var(--mono);
  font-size: 15px;
  padding: 10px 12px;
}
.gallery-search { flex: 1 1 260px; }
.gallery-select { flex: 0 1 150px; }
.gallery-count {
  max-width: 860px;
  margin: -22px auto 30px;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.gallery-more {
  display: block;
  margin: 38px auto 0;
  background: none;
  border: 1px solid var(--dim);
  color: var(--muted);
  font-family: var(--mono);
  font-size: 14px;
  letter-spacing: .08em;
  padding: 12px 22px;
  cursor: pointer;
}
.gallery-more:hover { border-color: var(--red); color: var(--text); }
.card-meta {
  font-family: var(--mono);
  font-style: normal;
  font-size: 11px;
  letter-spacing: .08em;
  color: var(--muted);
  margin-top: 4px;
}

/* Bilder ruhiger einblenden */
.feed-card.type-img img {
  opacity: 0;
  transition: opacity .45s ease, filter .4s ease;
}
.feed-card.type-img img.loaded {
  opacity: 1;
}

@media(max-width:700px){
  .gallery-search,.gallery-select{font-size:16px;width:100%}
  .gallery-controls{display:block}
  .gallery-controls > *{margin-bottom:10px}
}

/* === STABLE ROLLBACK FIX 2026-06-27 === */

/* Bilder dürfen nie unsichtbar bleiben */
.feed-card img,
.feed-card.type-img img,
.entity-gallery-item img,
.list-item-cover img {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

/* Header klein/hell */
html body .site header h1.site-name,
html body.is-inner .site header h1.site-name {
  font-size: clamp(1.15rem, 1.38vw, 1.55rem) !important;
  line-height: 1.05 !important;
  letter-spacing: .09em !important;
  color: #f2eee8 !important;
  opacity: 1 !important;
  margin-bottom: 7px !important;
  white-space: nowrap !important;
}

/* Tagline heller + eine Zeile */
html body .site header .site-tagline,
html body.is-inner .site header .site-tagline {
  color: #e0d9d1 !important;
  opacity: 1 !important;
  white-space: nowrap !important;
  font-size: clamp(9px, .75vw, 11px) !important;
  letter-spacing: .115em !important;
  margin-bottom: clamp(20px, 2.4vw, 32px) !important;
}

/* Tabs heller */
html body .site-nav .nav-btn {
  color: #bdb6ae !important;
}
html body .site-nav .nav-btn:hover,
html body .site-nav .nav-btn.active {
  color: #f2eee8 !important;
}

/* Untertitel in Listen nicht umbrechen */
.list-item-sub,
.entity-sub {
  white-space: nowrap !important;
  overflow: visible !important;
  max-width: none !important;
}

/* Musikseite */
.music-list-section {
  margin-top: clamp(36px, 5vw, 70px) !important;
}

/* Bücher-/Listenbilder klein links */
.list-section {
  max-width: 900px !important;
}
.list-item-with-image {
  display: grid !important;
  grid-template-columns: 140px minmax(0, 1fr) !important;
  gap: clamp(18px, 3vw, 34px) !important;
  align-items: start !important;
}
.list-item-cover,
.list-item-cover img {
  width: 140px !important;
  max-width: 140px !important;
  height: auto !important;
  object-fit: contain !important;
}

@media (max-width:700px) {
  html body .site header h1.site-name,
  html body.is-inner .site header h1.site-name {
    font-size: 1.25rem !important;
  }
  html body .site header .site-tagline,
  html body.is-inner .site header .site-tagline {
    font-size: 9px !important;
    letter-spacing: .075em !important;
  }
  .list-item-sub,
  .entity-sub {
    white-space: normal !important;
  }
  .list-item-with-image {
    grid-template-columns: 1fr !important;
  }
}


/* Suche */
.site-search {
  position: relative;
  max-width: 680px;
  margin: 22px auto 0;
}
#search-input {
  width: 100%;
  background: rgba(13,11,9,.82);
  border: 1px solid var(--dim);
  color: var(--text);
  font-family: var(--mono);
  font-size: 14px;
  padding: 12px 14px;
  outline: none;
}
#search-input:focus {
  border-color: var(--red);
}
.search-results {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  z-index: 700;
  background: rgba(6,5,4,.98);
  border: 1px solid var(--dim);
  max-height: 62vh;
  overflow: auto;
  box-shadow: 0 18px 50px rgba(0,0,0,.45);
}
.search-result {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--dim);
  text-decoration: none;
  color: var(--text);
}
.search-result:hover {
  background: rgba(122,21,21,.16);
}
.search-result img {
  width: 58px;
  height: 58px;
  object-fit: cover;
  background: var(--dim);
  display: block;
}
.search-result.no-img {
  grid-template-columns: 1fr;
}
.search-result-title {
  font-family: var(--serif);
  font-size: 1.12rem;
  line-height: 1.2;
}
.search-result-meta {
  color: var(--muted);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-top: 3px;
}
.search-result-text {
  color: #aaa39c;
  font-size: 13px;
  line-height: 1.5;
  margin-top: 5px;
}
.search-empty {
  padding: 16px;
  color: var(--muted);
}
@media(max-width:700px){
  .site-search {
    margin-top: 18px;
  }
  #search-input {
    font-size: 16px;
  }
  .search-results {
    position: fixed;
    left: 14px;
    right: 14px;
    top: 120px;
    max-height: 70vh;
  }
}


/* Restore/force image visibility and raw image lightbox behavior */
.feed-card img,
.feed-card.type-img img,
.entity-gallery-item img,
.list-item-cover img {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}

.search-image-result {
  cursor: zoom-in;
}

/* Links/Buttons fit text width */
.list-item a,
.entity-content a,
.music-card a,
.about-contact a {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: none !important;
  white-space: nowrap !important;
  line-height: 1.35 !important;
  gap: .35em !important;
  padding: 5px 8px !important;
}


/* SEO-Werkseiten: zusätzlich zur Galerie */
.werk-detail {
  display: grid;
  grid-template-columns: minmax(260px, 560px) 1fr;
  gap: clamp(24px, 4vw, 58px);
  margin-top: clamp(22px, 3vw, 42px);
  align-items: start;
}
.werk-image {
  display: block;
  background: var(--dim);
  cursor: zoom-in;
  border: 0;
  text-decoration: none;
}
.werk-image img {
  width: 100%;
  display: block;
  filter: saturate(.92);
}
.werk-text h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1.1;
  margin-bottom: 12px;
}
.werk-text p {
  color: #b4aea8;
  line-height: 2;
  margin-bottom: 18px;
}
@media(max-width:800px){
  .werk-detail {
    grid-template-columns: 1fr;
  }
}


/* v1.5 – automatische Querverweise und verwandte Inhalte */
.auto-link {
  color: #d7c8ad !important;
  border-bottom: 1px solid rgba(215,200,173,.55);
  text-decoration: none;
  background: rgba(122,21,21,.10);
  padding: 0 .12em;
}
.auto-link:hover {
  color: var(--text) !important;
  background: rgba(122,21,21,.24);
  border-color: var(--red);
}
.related-block {
  margin-top: clamp(38px,5vw,72px);
  border-top: 1px solid var(--dim);
  padding-top: clamp(20px,3vw,34px);
}
.related-block h3 {
  font-family: var(--mono);
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 12px;
  font-weight: 400;
  margin-bottom: 16px;
}
.related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 12px;
}
.related-card {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--dim);
  padding: 10px;
  text-decoration: none;
  background: rgba(255,255,255,.015);
}
.related-card:hover {
  border-color: var(--red);
  background: rgba(122,21,21,.12);
}
.related-card img {
  width: 54px;
  height: 54px;
  object-fit: cover;
  display: block;
  background: var(--dim);
}
.related-card span {
  min-width: 0;
}
.related-card strong {
  display: block;
  color: var(--text);
  font-family: var(--serif);
  font-size: 1.02rem;
  line-height: 1.2;
}
.related-card em {
  display: block;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 11px;
  font-style: normal;
  letter-spacing: .06em;
  margin-top: 3px;
}
.related-card:not(:has(img)) {
  grid-template-columns: 1fr;
}


/* v1.6 – ausgebautes Werkarchiv */
.werk-section-title {
  font-family: var(--mono);
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 12px;
  font-weight: 400;
  margin: 28px 0 10px;
}
.werk-facts {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 7px 14px;
  border-top: 1px solid var(--dim);
  border-bottom: 1px solid var(--dim);
  padding: 16px 0;
  margin: 26px 0;
}
.werk-facts dt {
  color: var(--muted);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.werk-facts dd {
  margin: 0;
  color: #c9c1b8;
}
.werk-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 20px 0 28px;
}
.werk-tags span {
  border: 1px solid var(--dim);
  color: #bdb6ae;
  font-family: var(--mono);
  font-size: 12px;
  padding: 4px 8px;
  background: rgba(255,255,255,.018);
}


/* v1.7 – Tags und Knowledge-Graph-Themen */
.tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 24px;
}
.tag-cloud a,
.werk-tags a {
  border: 1px solid var(--dim);
  color: #cfc7be;
  font-family: var(--mono);
  font-size: 12px;
  padding: 5px 9px;
  background: rgba(255,255,255,.018);
  text-decoration: none;
}
.tag-cloud a:hover,
.werk-tags a:hover {
  border-color: var(--red);
  color: var(--text);
  background: rgba(122,21,21,.14);
}
.tag-results {
  margin-top: 26px;
}

/* === v1.8 Header Karten Fotos === */

/* Header: direkt kontrollierte Wordmark, etwas größer als zuletzt */
html body .site > header .site-wordmark,
html body .site > header h1.site-name.site-wordmark,
html body.is-inner .site > header h1.site-name.site-wordmark {
  display: block !important;
  width: max-content !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  margin-bottom: 8px !important;
  padding: 0 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  color: #f0ebe4 !important;
  opacity: 1 !important;
}

html body .site > header .site-wordmark span,
html body .site > header h1.site-name.site-wordmark span {
  display: inline-block !important;
  font-family: var(--serif) !important;
  font-size: clamp(1.52rem, 2.02vw, 2.32rem) !important;
  line-height: 1 !important;
  letter-spacing: .072em !important;
  transform: none !important;
  color: #f0ebe4 !important;
  opacity: 1 !important;
}

html body .site > header .site-subline,
html body .site > header p.site-tagline.site-subline,
html body.is-inner .site > header p.site-tagline.site-subline {
  display: block !important;
  width: max-content !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  color: #9d958d !important;
  opacity: 1 !important;
  white-space: nowrap !important;
  font-size: clamp(9px, .74vw, 11px) !important;
  letter-spacing: .115em !important;
  line-height: 1.4 !important;
}

/* Karten/Related: Text darf nicht mehr aus Box laufen */
html body .related-card {
  overflow: hidden !important;
  min-width: 0 !important;
}

html body .related-card span {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  display: block !important;
}

html body .related-card strong,
html body .search-result-title,
html body .feed-card .card-label,
html body .feed-card .text-title {
  font-family: var(--mono) !important;
  font-size: clamp(10px, .72vw, 12px) !important;
  line-height: 1.24 !important;
  letter-spacing: .025em !important;
  text-transform: none !important;
  font-weight: 700 !important;
  color: #e8e1d8 !important;

  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  line-clamp: 2 !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  max-width: 100% !important;
}

html body .related-card em,
html body .search-result-meta,
html body .search-result-text,
html body .feed-card .text-body {
  font-family: var(--mono) !important;
  font-size: clamp(9px, .62vw, 11px) !important;
  line-height: 1.28 !important;
  color: #8f877f !important;
  letter-spacing: .025em !important;

  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  line-clamp: 2 !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}

/* Related Cards bekommen etwas mehr nutzbare Textbreite */
html body .related-grid {
  grid-template-columns: repeat(auto-fit, minmax(225px, 1fr)) !important;
}

html body .related-card {
  grid-template-columns: 48px minmax(0, 1fr) !important;
  gap: 9px !important;
  padding: 9px !important;
}

html body .related-card img {
  width: 48px !important;
  height: 48px !important;
}

/* Bei Hover zeigt der Browser den kompletten Titel per title-Attribut.
   Zusätzlich: kein Layout-Sprung. */
html body .feed-card,
html body .related-card {
  position: relative !important;
}

/* Buttons/Links bleiben sauber in einer Zeile */
html body .list-item a,
html body .entity-content a,
html body .music-card a,
html body .about-contact a,
html body .werk-text a {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  line-height: 1.35 !important;
  gap: .35em !important;
  padding: 5px 8px !important;
}

/* Mobile */
@media (max-width:700px) {
  html body .site > header .site-wordmark span,
  html body .site > header h1.site-name.site-wordmark span {
    font-size: 1.52rem !important;
    letter-spacing: .055em !important;
  }

  html body .site > header .site-subline,
  html body .site > header p.site-tagline.site-subline {
    font-size: 9px !important;
    letter-spacing: .065em !important;
  }

  html body .related-grid {
    grid-template-columns: 1fr !important;
  }
}

/* === v1.9 LLM SEO Book Hero === */

.book-hero {
  display: grid;
  grid-template-columns: minmax(96px, 150px) minmax(0, 1fr);
  gap: clamp(18px, 3vw, 34px);
  align-items: center;
  max-width: 860px;
  margin: 0 auto clamp(34px, 5vw, 64px);
  padding: clamp(16px, 2.5vw, 26px);
  border: 1px solid rgba(122,21,21,.55);
  background: linear-gradient(135deg, rgba(122,21,21,.18), rgba(255,255,255,.012));
  box-shadow: 0 18px 55px rgba(0,0,0,.22);
}

.book-hero-cover {
  display: block;
  border: 0;
  text-decoration: none;
}

.book-hero-cover img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
}

.book-hero-kicker {
  font-family: var(--mono);
  color: #a89f97;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.book-hero h2 {
  font-family: var(--serif);
  font-size: clamp(1.65rem, 3vw, 3rem);
  line-height: 1.04;
  margin: 0 0 12px;
  color: #f0ebe4;
}

.book-hero p {
  color: #c5bdb4;
  line-height: 1.75;
  margin: 0 0 18px;
  max-width: 62ch;
}

.book-hero-button {
  display: inline-flex;
  width: auto;
  max-width: 100%;
  white-space: nowrap;
  border: 1px solid #7a1515;
  color: #f0ebe4;
  background: rgba(122,21,21,.22);
  padding: 8px 12px;
  text-decoration: none;
  font-family: var(--mono);
}

.book-hero-button:hover {
  background: rgba(122,21,21,.38);
}

/* Related-Card-Texte endgültig in Box halten */
html body .related-card {
  overflow: hidden !important;
}

html body .related-card span {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

html body .related-card strong,
html body .related-card em {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

html body .related-card strong {
  font-family: var(--mono) !important;
  font-size: 11px !important;
  line-height: 1.22 !important;
  letter-spacing: .02em !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  line-clamp: 2 !important;
}

html body .related-card em {
  font-size: 10px !important;
  line-height: 1.25 !important;
  display: block !important;
  white-space: nowrap !important;
}

@media (max-width: 700px) {
  .book-hero {
    grid-template-columns: 92px 1fr;
    padding: 14px;
  }

  .book-hero h2 {
    font-size: 1.55rem;
  }

  .book-hero p {
    font-size: 13px;
    line-height: 1.55;
  }

  .book-hero-button {
    white-space: normal;
  }
}

/* === v1.9.1 Book-Hero Fix === */

/* Buch-Hero darf nie über die ganze Seite ausbrechen */
html body .book-hero {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: clamp(16px, 2.5vw, 28px) !important;
  align-items: center !important;
  width: min(760px, calc(100vw - 40px)) !important;
  max-width: 760px !important;
  margin: 0 auto clamp(28px, 4vw, 52px) !important;
  padding: clamp(14px, 2vw, 22px) !important;
  overflow: hidden !important;
}

html body .book-hero-cover {
  display: block !important;
  width: 112px !important;
  max-width: 112px !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: hidden !important;
  border: 0 !important;
}

html body .book-hero-cover img {
  display: block !important;
  width: 112px !important;
  max-width: 112px !important;
  height: auto !important;
  max-height: 170px !important;
  object-fit: contain !important;
  object-position: center !important;
}

html body .book-hero-text {
  min-width: 0 !important;
  max-width: 100% !important;
}

html body .book-hero h2 {
  font-size: clamp(1.3rem, 2.25vw, 2.05rem) !important;
  line-height: 1.08 !important;
  overflow-wrap: anywhere !important;
}

html body .book-hero p {
  font-size: clamp(13px, .95vw, 15px) !important;
  line-height: 1.65 !important;
  max-width: 58ch !important;
}

html body .book-hero-kicker {
  color: #a89f97 !important;
}

@media (max-width:700px) {
  html body .book-hero {
    grid-template-columns: 84px minmax(0, 1fr) !important;
    width: calc(100vw - 28px) !important;
    padding: 12px !important;
  }

  html body .book-hero-cover,
  html body .book-hero-cover img {
    width: 84px !important;
    max-width: 84px !important;
  }

  html body .book-hero-cover img {
    max-height: 130px !important;
  }

  html body .book-hero h2 {
    font-size: 1.28rem !important;
  }
}


/* v2 Admin/Lexikon UX */
.sortbar {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin: 0 0 18px;
  color: var(--muted);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.sortbar a {
  border:1px solid var(--dim);
  padding:5px 8px;
  color: #aaa39b;
  text-decoration:none;
}
.sortbar a.active,
.sortbar a:hover {
  border-color: var(--red);
  color: var(--text);
  background: rgba(122,21,21,.14);
}
.admin-sortbar {
  margin-top: 14px;
}
.ajax-status {
  color: #a8d69b !important;
}
.size-helper {
  background: rgba(255,255,255,.012);
}
.canvas-size-row {
  margin-top: 8px;
}

/* === v2.0 Stable Book-Hero === */

/*
  Wichtig:
  Der Hero verwendet KEIN <img> mehr für das Cover.
  Das Cover ist ein background-image in einem fixen Container.
  Dadurch kann es nicht mehr riesig werden.
*/

html body .book-hero-v20 {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) !important;
  gap: clamp(16px, 2.5vw, 26px) !important;
  align-items: center !important;
  width: min(760px, calc(100vw - 40px)) !important;
  max-width: 760px !important;
  margin: 0 auto clamp(30px, 4.5vw, 56px) !important;
  padding: clamp(14px, 2vw, 22px) !important;
  border: 1px solid rgba(122,21,21,.55) !important;
  background: linear-gradient(135deg, rgba(122,21,21,.18), rgba(255,255,255,.012)) !important;
  overflow: hidden !important;
}

html body .book-hero-v20 .book-hero-thumb {
  display: block !important;
  width: 118px !important;
  height: 176px !important;
  min-width: 118px !important;
  max-width: 118px !important;
  max-height: 176px !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  border: 0 !important;
  text-decoration: none !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.32) !important;
  overflow: hidden !important;
}

html body .book-hero-v20 .book-hero-text {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

html body .book-hero-v20 .book-hero-kicker {
  font-family: var(--mono) !important;
  color: #a89f97 !important;
  font-size: 11px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}

html body .book-hero-v20 h2 {
  font-family: var(--serif) !important;
  font-size: clamp(1.35rem, 2.35vw, 2.15rem) !important;
  line-height: 1.08 !important;
  margin: 0 0 12px !important;
  color: #f0ebe4 !important;
  overflow-wrap: anywhere !important;
}

html body .book-hero-v20 p {
  color: #c5bdb4 !important;
  font-size: clamp(13px, .95vw, 15px) !important;
  line-height: 1.65 !important;
  margin: 0 0 18px !important;
  max-width: 58ch !important;
}

html body .book-hero-v20 .book-hero-button {
  display: inline-flex !important;
  width: auto !important;
  max-width: 100% !important;
  white-space: nowrap !important;
  border: 1px solid #7a1515 !important;
  color: #f0ebe4 !important;
  background: rgba(122,21,21,.22) !important;
  padding: 8px 12px !important;
  text-decoration: none !important;
  font-family: var(--mono) !important;
}

html body .book-hero-v20 .book-hero-button:hover {
  background: rgba(122,21,21,.38) !important;
}

@media (max-width:700px) {
  html body .book-hero-v20 {
    grid-template-columns: 84px minmax(0, 1fr) !important;
    gap: 14px !important;
    width: calc(100vw - 28px) !important;
    padding: 12px !important;
    margin-bottom: 34px !important;
  }

  html body .book-hero-v20 .book-hero-thumb {
    width: 84px !important;
    height: 126px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    max-height: 126px !important;
  }

  html body .book-hero-v20 h2 {
    font-size: 1.3rem !important;
  }

  html body .book-hero-v20 p {
    font-size: 13px !important;
    line-height: 1.55 !important;
  }

  html body .book-hero-v20 .book-hero-button {
    white-space: normal !important;
  }
}