/* v111 – Waifu design 1:1 port for normal customs / vault drops */

:root{
  --waifu-wine:#5d1729;
  --waifu-wine-2:#7b2138;
  --waifu-wine-dark:#17070d;
  --waifu-ink:#11080a;
  --waifu-cream:#fff4df;
  --waifu-cream-2:#f4dfbf;
  --waifu-gold:#d8b15f;
  --waifu-gold-2:#f1d993;
  --waifu-rose:#d7749a;
  --waifu-shadow:rgba(0,0,0,.48);
}

/* Entire product section uses the Waifu dark gallery atmosphere */
html body.vault-page #vault-products{
  position:relative!important;
  overflow:hidden!important;
  border:1px solid rgba(216,177,95,.20)!important;
  border-radius:34px!important;
  padding:28px 18px 22px!important;
  background:
    radial-gradient(circle at 12% 8%,rgba(241,217,147,.20),transparent 28%),
    radial-gradient(circle at 88% 12%,rgba(215,116,154,.16),transparent 30%),
    radial-gradient(circle at 72% 80%,rgba(123,33,56,.36),transparent 38%),
    linear-gradient(145deg,#250b13 0%,#090406 48%,#1b070e 100%)!important;
  box-shadow:0 34px 120px var(--waifu-shadow), inset 0 1px 0 rgba(255,255,255,.08)!important;
  color:var(--waifu-cream)!important;
}
html body.vault-page #vault-products::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  background-image:
    linear-gradient(115deg,rgba(255,255,255,.04),transparent 28%,rgba(216,177,95,.05) 44%,transparent 60%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 8px)!important;
  mix-blend-mode:screen!important;
  opacity:.55!important;
  z-index:0!important;
}
html body.vault-page #vault-products::after{
  content:"艶 夢 花 雅 夜 影"!important;
  position:absolute!important;
  inset:auto -4vw 5vh auto!important;
  width:92vw!important;
  pointer-events:none!important;
  font-family:Georgia,serif!important;
  font-size:clamp(4.5rem,15vw,14rem)!important;
  line-height:1.05!important;
  letter-spacing:.16em!important;
  color:rgba(255,244,223,.035)!important;
  transform:rotate(-9deg)!important;
  z-index:0!important;
  white-space:pre-wrap!important;
  text-align:right!important;
}
html body.vault-page #vault-products > *{position:relative!important;z-index:1!important;}

/* Toolbar = waifu toolbar */
html body.vault-page #vault-products .vault-toolbar,
html body.vault-page #vault-products .vault-filter-panel,
html body.vault-page #vault-products .vault-search-wrap{
  display:flex!important;
  gap:12px!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  background:rgba(255,244,223,.06)!important;
  border:1px solid rgba(216,177,95,.20)!important;
  border-radius:24px!important;
  padding:12px!important;
  margin-bottom:22px!important;
  backdrop-filter:blur(16px)!important;
  box-shadow:none!important;
}
html body.vault-page #vault-products .vault-toolbar h2,
html body.vault-page #vault-products .vault-group-head h2,
html body.vault-page #vault-products .vault-group-head h3{color:var(--waifu-cream)!important;}
html body.vault-page #vault-products .vault-toolbar p,
html body.vault-page #vault-products .vault-group-head p,
html body.vault-page #vault-products .vault-group-kicker,
html body.vault-page #vault-products .vault-kicker{color:rgba(255,244,223,.72)!important;}

html body.vault-page #vault-products .vault-search,
html body.vault-page #vault-products input[type="search"],
html body.vault-page #vault-products input[type="text"]{
  flex:1 1 260px!important;
  min-height:46px!important;
  border-radius:999px!important;
  border:1px solid rgba(216,177,95,.28)!important;
  background:rgba(15,7,9,.55)!important;
  color:var(--waifu-cream)!important;
  outline:none!important;
  padding:0 18px!important;
  font-weight:800!important;
}
html body.vault-page #vault-products .vault-search::placeholder,
html body.vault-page #vault-products input::placeholder{color:rgba(255,244,223,.45)!important;}
html body.vault-page #vault-products .vault-filter{
  border:1px solid rgba(216,177,95,.30)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,rgba(216,177,95,.18),rgba(255,244,223,.07))!important;
  color:var(--waifu-cream)!important;
  font-weight:950!important;
  padding:13px 16px!important;
  cursor:pointer!important;
}
html body.vault-page #vault-products .vault-filter.active,
html body.vault-page #vault-products .vault-filter:hover{
  background:linear-gradient(135deg,var(--waifu-wine),#8a2644)!important;
  color:var(--waifu-cream)!important;
  box-shadow:0 14px 34px rgba(93,23,41,.34)!important;
}

/* Group wrappers toned down so cards dominate, but still readable */
html body.vault-page #vault-products .vault-product-group,
html body.vault-page #vault-products .luxury-product-group{
  margin:26px 0!important;
  padding:18px 12px 16px!important;
  border-radius:30px!important;
  border:1px solid rgba(216,177,95,.14)!important;
  background:rgba(255,244,223,.035)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
html body.vault-page #vault-products .vault-group-head{
  background:transparent!important;
  border:0!important;
  padding:0 6px 14px!important;
  margin-bottom:12px!important;
  box-shadow:none!important;
}
html body.vault-page #vault-products .vault-group-pills span,
html body.vault-page #vault-products .vault-group-count{
  display:inline-flex!important;
  border:1px solid rgba(216,177,95,.16)!important;
  background:rgba(255,255,255,.08)!important;
  border-radius:999px!important;
  padding:9px 13px!important;
  font-weight:900!important;
  color:#f6e6c6!important;
  font-size:.88rem!important;
}

/* Card grid + cards = waifu item 1:1 */
html body.vault-page #vault-products .vault-card-grid{gap:clamp(14px,2.1vw,24px)!important;}
html body.vault-page #vault-products .vault-card{
  position:relative!important;
  border:1px solid rgba(216,177,95,.24)!important;
  border-radius:30px!important;
  background:linear-gradient(180deg,rgba(255,244,223,.11),rgba(255,244,223,.045))!important;
  box-shadow:0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08)!important;
  padding:12px!important;
  overflow:hidden!important;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease!important;
}
html body.vault-page #vault-products .vault-card:hover{
  transform:translateY(-4px)!important;
  border-color:rgba(241,217,147,.58)!important;
  box-shadow:0 34px 90px rgba(0,0,0,.36)!important;
}
html body.vault-page #vault-products .vault-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 38%,rgba(216,177,95,.08))!important;
  pointer-events:none!important;
  z-index:0!important;
}
html body.vault-page #vault-products .vault-card > *{position:relative!important; z-index:1!important;}

/* Art shell / zoom frame 1:1 */
html body.vault-page #vault-products .vault-img-wrap{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  place-items:center!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:linear-gradient(145deg,#130609,#2a0d15)!important;
  box-shadow:inset 0 0 0 1px rgba(216,177,95,.24)!important;
  aspect-ratio:1699/2176!important;
  padding:0!important;
}
html body.vault-page #vault-products .vault-img-wrap img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  display:block!important;
  margin:auto!important;
  transition:transform .28s ease!important;
  background:radial-gradient(circle at 50% 38%,rgba(255,244,223,.09),transparent 54%),#120608!important;
}
html body.vault-page #vault-products .vault-card:hover .vault-img-wrap img{transform:scale(1.018)!important;}

/* Remove top-left beige/status clutter from image area */
html body.vault-page #vault-products .vault-badge{display:none!important;}

/* Back button styled to fit */
html body.vault-page #vault-products .vault-back-toggle{
  width:42px!important;
  height:42px!important;
  top:8px!important;
  right:8px!important;
  border-radius:12px!important;
  border:1px solid rgba(216,177,95,.30)!important;
  background:rgba(255,244,223,.96)!important;
  box-shadow:0 10px 22px rgba(0,0,0,.28)!important;
}
html body.vault-page #vault-products .vault-back-toggle img{
  width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important;border-radius:10px!important;background:none!important;
}
html body.vault-page #vault-products .vault-back-toggle::after{
  width:18px!important;height:18px!important;right:-4px!important;bottom:-4px!important;font-size:10px!important;
}

/* Body copy = waifu item body */
html body.vault-page #vault-products .vault-card-body{
  position:relative!important;
  z-index:1!important;
  padding:14px 4px 4px!important;
  background:transparent!important;
  border-top:0!important;
}
html body.vault-page #vault-products .vault-card-body h3{
  font-size:1.05rem!important;
  margin:8px 0 6px!important;
  color:#fff8e8!important;
  letter-spacing:-.02em!important;
  text-shadow:none!important;
}
html body.vault-page #vault-products .vault-sub,
html body.vault-page #vault-products .vault-card-body > p{
  margin:0 0 13px!important;
  color:rgba(255,244,223,.65)!important;
  font-size:.86rem!important;
  line-height:1.45!important;
  text-shadow:none!important;
}

/* Item top/price line approximate waifu top */
html body.vault-page #vault-products .vault-topline,
html body.vault-page #vault-products .vault-meta-top,
html body.vault-page #vault-products .vault-stock-line:first-child{
  color:rgba(255,244,223,.66)!important;
}

/* Meta box darker but elegant */
html body.vault-page #vault-products .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;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
html body.vault-page #vault-products .vault-meta div,
html body.vault-page #vault-products .vault-stock-line{color:rgba(255,244,223,.76)!important;}
html body.vault-page #vault-products .vault-meta b,
html body.vault-page #vault-products .vault-stock-line b{color:var(--waifu-gold-2)!important;}

/* Buttons 1:1 feeling */
html body.vault-page #vault-products .vault-btn.primary,
html body.vault-page #vault-products .vault-btn.secondary{
  width:100%!important;
  border:0!important;
  border-radius:999px!important;
  font-weight:950!important;
  padding:13px 16px!important;
}
html body.vault-page #vault-products .vault-btn.primary{
  background:linear-gradient(135deg,var(--waifu-wine),#8a2644)!important;
  color:var(--waifu-cream)!important;
  box-shadow:0 14px 34px rgba(93,23,41,.34)!important;
}
html body.vault-page #vault-products .vault-btn.secondary{
  background:linear-gradient(135deg,rgba(216,177,95,.18),rgba(255,244,223,.07))!important;
  color:var(--waifu-cream)!important;
  border:1px solid rgba(216,177,95,.30)!important;
}

/* Mobile exactly analogous */
@media (max-width:760px){
  html body.vault-page #vault-products{padding:18px 12px 18px!important;border-radius:30px!important;}
  html body.vault-page #vault-products .vault-product-group{padding:14px 8px 14px!important;border-radius:22px!important;}
  html body.vault-page #vault-products .vault-card{border-radius:22px!important;padding:8px!important;}
  html body.vault-page #vault-products .vault-img-wrap{border-radius:18px!important;}
  html body.vault-page #vault-products .vault-card-body{padding:12px 2px 4px!important;}
}