:root { color-scheme: dark; }
body { background:
  radial-gradient(1200px 500px at 10% -10%, rgba(201,162,39,0.08), transparent 40%),
  #0c0b09; }
.nav-link { color: rgba(232,224,208,0.75); }
.nav-link:hover { color: #c9a227; }
.btn-gold {
  background: #c9a227; color: #0c0b09; font-weight: 600;
  padding: 0.55rem 1rem; border-radius: 0.6rem;
}
.btn-gold:hover { filter: brightness(1.08); }
.btn-ghost {
  border: 1px solid rgba(201,162,39,0.35); color: #e8e0d0;
  padding: 0.4rem 0.75rem; border-radius: 0.5rem; font-size: 0.85rem;
}
.input, select.input, textarea.input {
  width: 100%; margin-top: 0.25rem; border-radius: 0.5rem;
  border: 1px solid rgba(201,162,39,0.25); background: #0c0b09;
  color: #e8e0d0; padding: 0.5rem 0.7rem;
}
.flash { border-radius: 0.6rem; padding: 0.6rem 0.8rem; font-size: 0.9rem; }
.flash-success { background: rgba(61,139,90,0.2); border: 1px solid #3d8b5a; }
.flash-error { background: rgba(179,58,58,0.2); border: 1px solid #b33a3a; }
.flash-info, .flash-warning { background: rgba(201,162,39,0.12); border: 1px solid #c9a227; }
.owned-ring { box-shadow: 0 0 0 2px #3d8b5a; }
.missing-ring { box-shadow: 0 0 0 2px #b33a3a; }
.badge-owned, .badge-missing {
  width: 1.35rem; height: 1.35rem; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.7rem; font-weight: 700;
}
.badge-owned { background: #3d8b5a; color: #0c0b09; }
.badge-missing { background: #b33a3a; color: #fff; }
.card-tile { background: #161410; border: 1px solid rgba(201,162,39,0.15); border-radius: 0.9rem; overflow: hidden; }
.dropzone {
  border: 1px dashed rgba(201,162,39,0.4); border-radius: 0.9rem;
  padding: 1.2rem; text-align: center; background: rgba(12,11,9,0.5);
}
.dropzone.drag { border-color: #c9a227; background: rgba(201,162,39,0.08); }
.modal-backdrop {
  position: fixed; inset: 0; background: rgba(0,0,0,0.72);
  display: flex; align-items: center; justify-content: center; z-index: 50; padding: 1rem;
}
.zoom-1 img.thumb { max-height: 8rem; }
.zoom-2 img.thumb { max-height: 11rem; }
.zoom-3 img.thumb { max-height: 14rem; }
.zoom-4 img.thumb { max-height: 18rem; }
.zoom-5 img.thumb { max-height: 22rem; }
.zoom-6 img.thumb { max-height: 26rem; }