/* v100 – centered holo look for normal customs / vault cards
   Ziel: gleiche zentrierte Kartenwirkung wie bei den Waifu Cards,
   aber ohne Gruppierung / Filter / Struktur umzubauen. */

body.vault-page .vault-card{
  position:relative!important;
  border-radius:30px!important;
  padding:12px!important;
  overflow:hidden!important;
  background:linear-gradient(180deg,rgba(255,244,223,.11),rgba(255,244,223,.045))!important;
  border:1px solid rgba(216,177,95,.24)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.08)!important;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease!important;
}
body.vault-page .vault-card:hover{
  transform:translateY(-4px)!important;
  border-color:rgba(241,217,147,.58)!important;
  box-shadow:0 34px 90px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
body.vault-page .vault-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 38%,rgba(216,177,95,.08));
  z-index:0;
}
body.vault-page .vault-card > *{position:relative;z-index:1;}

body.vault-page .vault-img-wrap{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  place-items:center!important;
  aspect-ratio:1699/2176!important;
  min-height:0!important;
  padding:10px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 38%,rgba(255,244,223,.09),transparent 54%),
    linear-gradient(145deg,#130609,#2a0d15)!important;
  box-shadow:inset 0 0 0 1px rgba(216,177,95,.24)!important;
}
body.vault-page .vault-img-wrap::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 10%,rgba(255,255,255,.08),transparent 24%),
    linear-gradient(135deg,rgba(255,255,255,.05),transparent 34%,rgba(216,177,95,.05));
  z-index:1;
}
body.vault-page .vault-img-wrap::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:3;
  background:linear-gradient(115deg,transparent 0 40%,rgba(255,255,255,.12) 46%,rgba(255,255,255,.34) 50%,rgba(216,177,95,.18) 54%,transparent 60%);
  transform:translateX(-135%);
  opacity:0;
  transition:transform .72s ease,opacity .72s ease;
}
body.vault-page .vault-card:hover .vault-img-wrap::after{
  transform:translateX(135%);
  opacity:1;
}
body.vault-page .vault-img-wrap > img{
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  display:block!important;
  margin:auto!important;
  border-radius:18px!important;
  filter:drop-shadow(0 16px 28px rgba(0,0,0,.18));
  transition:transform .28s ease,filter .28s ease!important;
  image-rendering:auto!important;
}
body.vault-page .vault-card:hover .vault-img-wrap > img{
  transform:scale(1.018)!important;
  filter:drop-shadow(0 20px 32px rgba(0,0,0,.22)) contrast(1.05) saturate(1.05) brightness(1.02)!important;
}

body.vault-page .vault-card-body{
  position:relative!important;
  z-index:1!important;
  margin-top:0!important;
  padding:14px 4px 4px!important;
  background:transparent!important;
  border-top:0!important;
}
body.vault-page .vault-card-body h3{
  color:#fff8e8!important;
  font-size:1.05rem!important;
  margin:8px 0 6px!important;
  letter-spacing:-.02em!important;
}
body.vault-page .vault-sub{
  color:rgba(255,244,223,.72)!important;
  font-size:.86rem!important;
  line-height:1.45!important;
  font-weight:700!important;
}
body.vault-page .vault-meta{
  margin-top:12px!important;
  padding:12px 14px!important;
  border-radius:20px!important;
  border:1px solid rgba(216,177,95,.16)!important;
  background:rgba(255,244,223,.06)!important;
  color:rgba(255,244,223,.76)!important;
}
body.vault-page .vault-meta b,
body.vault-page .vault-stock-line b{
  color:#f3dca4!important;
}
body.vault-page .vault-badge{
  top:12px!important;
  left:12px!important;
  background:rgba(91,30,45,.92)!important;
  color:#fff4e6!important;
  border:1px solid rgba(212,176,106,.42)!important;
  box-shadow:0 10px 28px rgba(22,19,17,.18)!important;
}

body.vault-page .vault-back-toggle{
  top:12px!important;
  right:12px!important;
  width:54px!important;
  height:54px!important;
  border-radius:16px!important;
  border:2px solid rgba(216,177,95,.92)!important;
  background:linear-gradient(145deg,rgba(255,249,238,.98),rgba(233,211,172,.96))!important;
  box-shadow:0 12px 32px rgba(41,16,15,.28),0 0 0 3px rgba(91,23,41,.08)!important;
  z-index:4!important;
}
body.vault-page .vault-back-toggle img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  border-radius:12px!important;
  display:block!important;
  background:linear-gradient(145deg,#130609,#2a0d15)!important;
  padding:2px!important;
}
body.vault-page .vault-back-toggle::after{
  width:23px!important;
  height:23px!important;
  right:-6px!important;
  bottom:-6px!important;
}

body.vault-page .vault-btn.primary,
body.vault-page .vault-btn.secondary{
  border-radius:999px!important;
}

@media (max-width:760px){
  body.vault-page .vault-card{border-radius:22px!important;padding:8px!important;}
  body.vault-page .vault-img-wrap{border-radius:18px!important;padding:8px!important;}
  body.vault-page .vault-img-wrap > img{border-radius:14px!important;}
  body.vault-page .vault-card-body{padding:12px 2px 4px!important;}
  body.vault-page .vault-card-body h3{font-size:.96rem!important;line-height:1.2!important;}
  body.vault-page .vault-meta{padding:10px 12px!important;border-radius:16px!important;}
}