:root{--vd-green:#07884a;--vd-black:#07110e;--vd-paper:#f5f1e8;--vd-gold:#d4a62b}.vd-album-app{display:grid;grid-template-columns:minmax(270px,330px) 1fr;gap:22px;max-width:1500px;margin:30px auto;padding:0 18px}.vd-album-sidebar{background:var(--vd-black);color:#fff;border-radius:24px;padding:22px;align-self:start;position:sticky;top:24px;box-shadow:0 20px 50px #0003}.vd-side-head,.vd-album-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.vd-side-head h2{margin:0}.vd-side-head span{width:34px;height:34px;border:1px solid var(--vd-gold);border-radius:50%;display:grid;place-items:center}.vd-owned-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:16px 0;margin:14px 0;border-top:1px solid #ffffff22;border-bottom:1px solid #ffffff22}.vd-owned-card{border:2px solid transparent;background:#fff;border-radius:10px;padding:4px;cursor:grab;transition:.18s}.vd-owned-card:hover,.vd-owned-card.selected{transform:translateY(-3px) rotate(-1deg);border-color:var(--vd-green)}.vd-owned-card img{width:100%;display:block;border-radius:7px}.vd-progress{height:10px;background:#ffffff25;border-radius:999px;overflow:hidden}.vd-progress>div{height:100%;width:0;background:var(--vd-green);transition:.25s}.vd-btn{border:0;border-radius:10px;background:var(--vd-green);color:#fff;font-weight:800;padding:12px 18px;cursor:pointer}.vd-btn:disabled{opacity:.45;cursor:not-allowed}.vd-album-book{min-height:720px;background:linear-gradient(90deg,transparent 49.8%,#00000010 50%,transparent 50.2%),var(--vd-paper);border:12px solid #087447;border-radius:26px;padding:28px;box-shadow:0 24px 55px #0003}.vd-kicker{font-size:.78rem;letter-spacing:.14em;font-weight:900;color:var(--vd-green)}.vd-album-heading h1{margin:.2rem 0}.vd-album-sections{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:24px}.vd-section h2{color:var(--vd-green);text-transform:uppercase;font-size:1.12rem;border-bottom:2px solid #07884a22;padding-bottom:8px}.vd-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.vd-slot{aspect-ratio:3/4;border-radius:9px;overflow:hidden;display:grid;place-items:center;width:100%}.vd-slot.empty{border:1px dashed #0004;background:#fff5;cursor:pointer;transition:.18s}.vd-slot.empty:hover,.vd-slot.target{border-color:var(--vd-green);background:#07884a13;transform:scale(1.02)}.vd-slot.filled{background:#fff;box-shadow:0 4px 12px #0002;animation:stick .28s ease}.vd-slot.filled img{width:100%;height:100%;object-fit:cover}.vd-silhouette{max-width:82%;max-height:82%;filter:grayscale(1) brightness(.25);opacity:.12}.vd-generic{font-size:58px;opacity:.08}@keyframes stick{from{transform:scale(1.1) rotate(-2deg);opacity:.5}to{transform:none;opacity:1}}.vd-modal[hidden]{display:none!important}.vd-modal{position:fixed;inset:0;z-index:999999;background:#000a;display:grid;place-items:center;padding:20px;opacity:0;transition:.18s}.vd-modal.open{opacity:1}.vd-modal-card{position:relative;width:min(100%,560px);background:#fff;border-radius:24px;padding:34px;text-align:center;box-shadow:0 28px 80px #0006;transform:translateY(10px) scale(.98);transition:.18s}.vd-modal.open .vd-modal-card{transform:none}.vd-modal-close{position:absolute;top:12px;right:14px;border:0;background:none;font-size:28px;cursor:pointer}.vd-modal-card h2{font-size:2rem;margin:.3rem 0 1rem}.vd-modal-card h2 em{display:block;color:var(--vd-green)}.vd-crown{display:block;font-size:42px;color:var(--vd-gold)}#vd-start-form,#vd-recovery-form{display:grid;gap:12px;margin-top:20px}#vd-start-form input,#vd-recovery-form input{padding:14px 16px;border:1px solid #0002;border-radius:10px;font-size:1rem}.vd-link{border:0;background:none;color:var(--vd-green);font-weight:700;cursor:pointer;margin-top:14px}.vd-small{font-size:.78rem;opacity:.65}.vd-pack-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}.vd-reveal{animation:reveal .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d)}.vd-reveal img{width:100%;display:block;border-radius:12px;box-shadow:0 16px 32px #0003}.vd-ph{aspect-ratio:3/4;border:2px solid var(--vd-green);border-radius:12px;display:grid;place-items:center;background:var(--vd-paper)}@keyframes reveal{from{opacity:0;transform:translateY(20px) rotateY(70deg)}to{opacity:1;transform:none}}.vd-toast{position:fixed;left:50%;bottom:26px;z-index:1000000;background:var(--vd-black);color:#fff;padding:11px 18px;border-radius:999px;box-shadow:0 12px 35px #0004;opacity:0;pointer-events:none;transform:translate(-50%,20px);transition:.2s}.vd-toast.show{opacity:1;transform:translate(-50%,0)}.vd-muted{opacity:.62}@media(max-width:900px){.vd-album-app{grid-template-columns:1fr}.vd-album-sidebar{position:relative;top:0}.vd-album-sections{grid-template-columns:1fr}.vd-album-book{border-width:8px;padding:18px}}@media(max-width:520px){.vd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vd-pack-cards{grid-template-columns:1fr}.vd-reveal{max-width:220px;margin:auto}}

/* =========================================================
   Verdeando Álbum 0.1.3 · Pulido visual
   ========================================================= */

/* Blindaje frente a estilos globales del theme */
body.vd-album-page .vd-album-sidebar,
body.vd-album-page .vd-album-sidebar *,
body.vd-album-page .vd-pack-box,
body.vd-album-page .vd-pack-box * {
  box-sizing: border-box;
}

body.vd-album-page .vd-album-sidebar {
  background: #06110d !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.05);
}

body.vd-album-page .vd-album-sidebar h1,
body.vd-album-page .vd-album-sidebar h2,
body.vd-album-page .vd-album-sidebar h3,
body.vd-album-page .vd-album-sidebar h4,
body.vd-album-page .vd-album-sidebar p,
body.vd-album-page .vd-album-sidebar span,
body.vd-album-page .vd-album-sidebar strong,
body.vd-album-page .vd-album-sidebar label {
  color: #fff !important;
}

body.vd-album-page .vd-album-sidebar .vd-muted,
body.vd-album-page .vd-album-sidebar .vd-pack-box p {
  color: rgba(255,255,255,.70) !important;
}

body.vd-album-page .vd-album-sidebar__head h2 {
  font-size: clamp(2rem, 2.7vw, 3.6rem) !important;
  line-height: .96 !important;
  letter-spacing: -.035em;
  margin: 0 !important;
  max-width: 220px;
  font-weight: 900 !important;
}

body.vd-album-page .vd-pack-box h3 {
  font-size: clamp(1.6rem, 2vw, 2.5rem) !important;
  line-height: 1 !important;
  margin: 0 0 16px !important;
  font-weight: 900 !important;
}

body.vd-album-page #vd-owned-badge {
  color: #fff !important;
  border-color: #c7a52b !important;
  background: rgba(199,165,43,.06);
  font-weight: 800;
  flex: 0 0 auto;
}

/* Mejor jerarquía del panel */
body.vd-album-page .vd-album-sidebar {
  padding: 28px 30px 30px;
  border-radius: 30px;
  box-shadow: 0 18px 44px rgba(0,0,0,.16);
}

body.vd-album-page .vd-album-sidebar__head {
  min-height: 95px;
  align-items: flex-start;
}

body.vd-album-page .vd-owned-cards {
  gap: 12px;
  padding: 18px 0 22px;
  margin: 0 0 22px;
  border-color: rgba(255,255,255,.13);
}

body.vd-album-page .vd-owned-card {
  border-radius: 12px;
  padding: 5px;
  background: #f8f6ee;
  box-shadow: 0 8px 18px rgba(0,0,0,.15);
}

body.vd-album-page .vd-owned-card img {
  border-radius: 8px;
}

body.vd-album-page .vd-pack-box {
  border-top: 1px solid rgba(255,255,255,.12);
  padding-top: 22px;
}

body.vd-album-page .vd-pack-row {
  margin: 8px 0 14px;
}

body.vd-album-page .vd-progress {
  height: 12px;
  background: rgba(255,255,255,.16) !important;
  margin-top: 10px;
}

body.vd-album-page #vd-progress-bar {
  background: linear-gradient(90deg,#059255,#14b86d) !important;
}

body.vd-album-page .vd-pack-box > p {
  margin: 8px 0 16px !important;
}

body.vd-album-page .vd-pack-box .vd-btn {
  width: 100%;
  min-height: 52px;
  border-radius: 14px;
  font-size: 1rem;
  background: #07894f !important;
  color: #fff !important;
  box-shadow: none;
}

/* Libro / álbum */
body.vd-album-page .vd-album-book {
  position: relative;
  overflow: hidden;
  border: 14px solid #087a48 !important;
  border-radius: 32px 32px 20px 20px;
  padding: 44px 42px 52px;
  min-height: 760px;
  background:
    radial-gradient(circle at 12% 8%, rgba(0,128,70,.035), transparent 22%),
    radial-gradient(circle at 88% 80%, rgba(0,128,70,.025), transparent 25%),
    linear-gradient(90deg, transparent 49.82%, rgba(0,0,0,.08) 50%, transparent 50.18%),
    #f4efe3 !important;
  box-shadow: 0 24px 58px rgba(0,0,0,.18);
}

body.vd-album-page .vd-album-book::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image:
    linear-gradient(rgba(255,255,255,.35) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.25) 1px, transparent 1px);
  background-size: 18px 18px;
  mix-blend-mode: soft-light;
}

body.vd-album-page .vd-album-heading,
body.vd-album-page .vd-album-sections {
  position: relative;
  z-index: 1;
}

body.vd-album-page .vd-album-heading {
  margin-bottom: 22px;
}

body.vd-album-page .vd-album-heading h1 {
  color: #060b09 !important;
  font-size: clamp(2.8rem, 4.5vw, 5.7rem) !important;
  line-height: .9 !important;
  letter-spacing: -.04em;
  margin: 4px 0 0 !important;
  max-width: 850px;
  font-weight: 900 !important;
}

body.vd-album-page .vd-kicker {
  color: #07894f !important;
  font-size: .8rem;
  font-weight: 900;
  letter-spacing: .18em;
}

body.vd-album-page .vd-album-stats {
  min-width: 105px;
  color: #232725 !important;
}

body.vd-album-page .vd-album-stats strong,
body.vd-album-page .vd-album-stats span {
  color: #232725 !important;
}

/* Secciones: más compactas y legibles */
body.vd-album-page .vd-album-sections {
  gap: 34px 40px;
}

body.vd-album-page .vd-album-section h2 {
  color: #07894f !important;
  font-size: clamp(1.25rem, 1.45vw, 1.7rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -.02em;
  margin: 0 0 14px !important;
  padding-bottom: 10px;
  border-bottom: 3px solid rgba(7,137,79,.13);
  font-weight: 900 !important;
  text-transform: uppercase;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
}

/* Huecos más parecidos a página de cromos */
body.vd-album-page .vd-slot-grid {
  grid-template-columns: repeat(3, minmax(96px, 1fr));
  gap: 16px;
}

body.vd-album-page .vd-slot {
  aspect-ratio: 0.72;
  min-width: 0;
  border-radius: 12px;
}

body.vd-album-page .vd-slot.is-empty {
  border: 1.5px dashed rgba(25,60,42,.22) !important;
  background: rgba(255,255,255,.28) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.30);
}

body.vd-album-page .vd-slot.is-empty:hover,
body.vd-album-page .vd-slot.is-target {
  background: rgba(7,137,79,.08) !important;
  border-color: rgba(7,137,79,.6) !important;
}

body.vd-album-page .vd-slot.is-filled {
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(0,0,0,.12);
}

body.vd-album-page .vd-slot.is-filled img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.vd-album-page .vd-silhouette {
  max-width: 78%;
  max-height: 78%;
  object-fit: contain;
  filter: grayscale(1) brightness(.30) contrast(.75) !important;
  opacity: .11 !important;
}

/* Estado vacío del lateral */
body.vd-album-page .vd-owned-cards .vd-muted {
  font-size: 1rem;
  line-height: 1.5;
  margin: 6px 0;
}

/* Responsive */
@media (max-width: 1180px) {
  body.vd-album-page .vd-album-app {
    grid-template-columns: minmax(250px, 300px) 1fr;
  }

  body.vd-album-page .vd-album-book {
    padding: 34px 28px 42px;
  }

  body.vd-album-page .vd-slot-grid {
    grid-template-columns: repeat(2, minmax(90px,1fr));
  }
}

@media (max-width: 900px) {
  body.vd-album-page .vd-album-sidebar {
    position: relative;
    top: 0;
  }

  body.vd-album-page .vd-album-sidebar__head h2 {
    max-width: none;
  }

  body.vd-album-page .vd-album-book {
    border-width: 9px !important;
    border-radius: 22px;
    padding: 24px 18px 34px;
  }

  body.vd-album-page .vd-album-sections {
    grid-template-columns: 1fr;
  }

  body.vd-album-page .vd-slot-grid {
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
}

@media (max-width: 560px) {
  body.vd-album-page .vd-slot-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  body.vd-album-page .vd-album-heading {
    align-items: flex-start;
  }

  body.vd-album-page .vd-album-stats {
    min-width: auto;
  }
}

/* =========================================================
   Verdeando Álbum 0.1.5 · Siluetas y huecos limpios
   ========================================================= */
body.vd-album-page .vd-slot.empty.no-cutout{
  position:relative;
  overflow:hidden;
}
body.vd-album-page .vd-slot.empty.no-cutout::before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:10px;
  background:linear-gradient(180deg,rgba(0,0,0,.018),rgba(0,0,0,.035));
  opacity:.45;
}
body.vd-album-page .vd-generic-silhouette{
  position:relative;
  width:56%;
  height:68%;
  display:block;
  opacity:.22;
}
body.vd-album-page .vd-generic-silhouette::before,
body.vd-album-page .vd-generic-silhouette::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  background:rgba(20,28,24,.18);
}
body.vd-album-page .vd-generic-silhouette::before{
  top:0;
  width:34%;
  height:24%;
  border-radius:999px;
}
body.vd-album-page .vd-generic-silhouette::after{
  bottom:0;
  width:68%;
  height:52%;
  border-radius:18px 18px 10px 10px;
}
body.vd-album-page .vd-slot.empty.has-cutout{
  display:grid;
  place-items:center;
}
body.vd-album-page .vd-slot.empty.has-cutout .vd-silhouette{
  width:auto;
  max-width:74%;
  max-height:74%;
  object-fit:contain;
  filter:grayscale(1) brightness(.22) contrast(.9) !important;
  opacity:.18 !important;
  transform:translateY(1px);
}
body.vd-album-page .vd-slot.empty.no-cutout:hover .vd-generic-silhouette,
body.vd-album-page .vd-slot.empty.has-cutout:hover .vd-silhouette,
body.vd-album-page .vd-slot.target .vd-generic-silhouette,
body.vd-album-page .vd-slot.target .vd-silhouette{
  opacity:.28 !important;
}