/* R4X v2859 · vollständiges Hochformat-Cover und korrigierter Umschlag */
.r4x-decoder-preview-button{
  position:relative;
  display:grid;
  place-items:center;
  min-width:0;
  margin:0;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(212,175,55,.38);
  border-radius:16px;
  background:
    radial-gradient(circle at 50% 42%,rgba(212,175,55,.18),transparent 58%),
    linear-gradient(145deg,#11151d,#050609);
  box-shadow:0 16px 34px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.06);
  color:#fff;
  cursor:zoom-in;
  isolation:isolate;
}
.r4x-decoder-preview-button::after{
  content:"+";
  position:absolute;
  right:8px;
  bottom:8px;
  display:grid;
  width:30px;
  height:30px;
  padding:0;
  place-items:center;
  border:1px solid rgba(245,210,122,.34);
  border-radius:999px;
  background:rgba(4,6,10,.82);
  color:#f5d27a;
  font:500 22px/1 "Open Sans",system-ui,sans-serif;
  opacity:.88;
  z-index:2;
  transition:opacity .18s ease,transform .18s ease;
}
.r4x-decoder-preview-button:hover::after,
.r4x-decoder-preview-button:focus-visible::after{opacity:1;transform:translateY(-1px)}
.r4x-decoder-preview-button:focus-visible{outline:3px solid rgba(212,175,55,.38);outline-offset:3px}
.r4x-decoder-preview-button img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 14px 18px rgba(0,0,0,.38));
  transition:transform .2s ease;
}
.r4x-decoder-preview-button:hover img{transform:scale(1.035)}

.r4x-decoder-lightbox{
  width:min(98vw,1280px);
  max-width:1280px;
  max-height:96vh;
  margin:auto;
  padding:0;
  overflow:auto;
  border:1px solid rgba(212,175,55,.42);
  border-radius:22px;
  background:#0a0b0f;
  box-shadow:0 28px 90px rgba(0,0,0,.68);
}
.r4x-decoder-lightbox::backdrop{background:rgba(2,4,8,.82);backdrop-filter:blur(6px)}
.r4x-decoder-lightbox__figure{margin:0;padding:clamp(12px,2vw,24px);display:grid;place-items:center}
.r4x-decoder-lightbox__figure img{display:block;width:min(100%,1220px);height:auto;max-height:calc(96vh - 48px);object-fit:contain;background:#fff;border-radius:7px;filter:drop-shadow(0 20px 28px rgba(0,0,0,.5))}
.r4x-decoder-lightbox__close{
  position:absolute;
  top:10px;
  right:10px;
  z-index:2;
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  border:1px solid rgba(245,210,122,.38);
  border-radius:50%;
  background:rgba(4,6,10,.9);
  color:#fff;
  font:500 24px/1 system-ui,sans-serif;
  cursor:pointer;
}

/* Orientierungshilfe: aus dem kleinen Listen-Icon wird eine echte Produktkarte. */
.more-item.oh-decoder-product{border-color:rgba(212,175,55,.52);background:linear-gradient(135deg,#fffdf8,#fbf4e3)}
.oh-decoder-product__layout{display:grid;grid-template-columns:116px minmax(0,1fr);gap:20px;align-items:center}
.oh-decoder-product__visual{width:104px;height:156px;justify-self:center;padding:0;border-radius:11px}
.oh-decoder-product__copy{min-width:0}
.oh-decoder-product__copy .more-main{margin-bottom:8px}
.oh-decoder-product__copy .more-desc{margin-top:0}

/* Wissen und Hilfsmittel: echte Produktspalte statt leerer 16:9-Bildfläche. */
body.cockpit .r4x-decoder-product-card{border-color:rgba(212,175,55,.32)!important;box-shadow:0 22px 52px rgba(0,0,0,.22)!important}
body.cockpit[data-page="tools"] .r4x-library-special-card--book.r4x-decoder-product-card,
body.cockpit[data-page="knowledge"] .r4x-knowledge-book-card.r4x-decoder-product-card{grid-template-columns:minmax(230px,280px) minmax(0,1fr)!important;align-items:stretch!important;overflow:hidden!important}
body.cockpit[data-page="tools"] .r4x-library-special-card--book.r4x-decoder-product-card .r4x-decoder-preview-button,
body.cockpit[data-page="knowledge"] .r4x-knowledge-book-card.r4x-decoder-product-card .r4x-decoder-preview-button{width:100%!important;max-width:none!important;height:220px!important;min-height:220px!important;aspect-ratio:auto!important;align-self:center!important;border:0;border-radius:0!important;background:radial-gradient(circle at 50% 44%,rgba(212,175,55,.17),transparent 55%),linear-gradient(145deg,#10131a,#050609)}
body.cockpit[data-page="tools"] .r4x-library-special-card--book.r4x-decoder-product-card .r4x-decoder-preview-button img.r4x-krypto-decoder-cover--library,
body.cockpit[data-page="knowledge"] .r4x-knowledge-book-card.r4x-decoder-product-card .r4x-decoder-preview-button img{display:block!important;width:auto!important;height:190px!important;max-width:calc(100% - 44px)!important;max-height:calc(100% - 24px)!important;padding:0!important;object-fit:contain!important;object-position:center!important;transform:none!important;filter:drop-shadow(0 14px 20px rgba(0,0,0,.42))!important}
body.cockpit .r4x-decoder-product-card .r4x-decoder-preview-button::after{right:12px;bottom:12px}

/* Beginner: Produktmotiv größer, ohne den Lernpfad zu verdrängen. */
.r4x-book-alt-card.r4x-decoder-product-card{border-color:rgba(245,210,122,.35);box-shadow:0 20px 46px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.045)}
.r4x-book-alt-card .r4x-decoder-preview-button.r4x-book-alt-card__icon--cover{width:96px;height:144px;padding:0;border-radius:12px}
.r4x-book-alt-card .r4x-decoder-preview-button.r4x-book-alt-card__icon--cover img{width:100%;height:100%;max-width:none;padding:0;object-fit:contain}

@media(max-width:700px){
  .oh-decoder-product__layout{grid-template-columns:90px minmax(0,1fr);gap:14px;align-items:start}
  .oh-decoder-product__visual{width:82px;height:123px}
  .r4x-decoder-preview-button::after{content:"+";right:6px;bottom:6px;width:28px;height:28px;padding:0;font-size:20px}
  .r4x-book-alt-card .r4x-decoder-preview-button.r4x-book-alt-card__icon--cover{width:82px;height:123px}
}
@media(max-width:460px){
  .oh-decoder-product__layout{grid-template-columns:1fr}
  .oh-decoder-product__visual{width:96px;height:144px;justify-self:center}
  .oh-decoder-product__copy .more-main{align-items:flex-start}
}
@media(max-width:980px){
  body.cockpit[data-page="tools"] .r4x-library-special-card--book.r4x-decoder-product-card,
  body.cockpit[data-page="knowledge"] .r4x-knowledge-book-card.r4x-decoder-product-card{grid-template-columns:1fr!important}
  body.cockpit[data-page="tools"] .r4x-library-special-card--book.r4x-decoder-product-card .r4x-decoder-preview-button,
  body.cockpit[data-page="knowledge"] .r4x-knowledge-book-card.r4x-decoder-product-card .r4x-decoder-preview-button{height:230px!important;min-height:230px!important;border-radius:0!important}
  body.cockpit[data-page="tools"] .r4x-library-special-card--book.r4x-decoder-product-card .r4x-decoder-preview-button img.r4x-krypto-decoder-cover--library,
  body.cockpit[data-page="knowledge"] .r4x-knowledge-book-card.r4x-decoder-product-card .r4x-decoder-preview-button img{height:204px!important}
}
@media(max-width:520px){
  .r4x-decoder-lightbox{width:100vw;max-height:100vh;border-radius:0;border-left:0;border-right:0}
  .r4x-decoder-lightbox__figure{padding:46px 8px 10px}
  .r4x-decoder-lightbox__figure img{max-height:calc(100vh - 56px);border-radius:4px}
}
@media(prefers-reduced-motion:reduce){
  .r4x-decoder-preview-button img,.r4x-decoder-preview-button::after{transition:none}
}