[hidden] { display: none !important; }
:root {
  --bg: #05050d;
  --panel: rgba(18, 16, 39, 0.78);
  --panel2: rgba(255, 255, 255, 0.045);
  --line: rgba(255, 255, 255, 0.14);
  --line2: rgba(255, 255, 255, 0.24);
  --text: #f7f3ff;
  --muted: #b9afd7;
  --soft: #ded8f5;
  --purple: #6d3dff;
  --blue: #64d8ff;
  --pink: #ff5be7;
  --gold: #e6b847;
  --good: #82e7ab;
  --warn: #ffd166;
  --bad: #ff7f91;
  --shadow: 0 34px 90px rgba(0, 0, 0, 0.42);
}
* { box-sizing: border-box; }
html, body { min-height: 100%; margin: 0; }
body {
  font: 15px/1.45 "Segoe UI", Inter, Arial, sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 15% 20%, rgba(109, 61, 255, .33), transparent 30%),
    radial-gradient(circle at 86% 12%, rgba(100, 216, 255, .18), transparent 26%),
    radial-gradient(circle at 55% 92%, rgba(255, 91, 231, .18), transparent 34%),
    linear-gradient(145deg, #05050d 0%, #120c29 46%, #05050d 100%);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  opacity: .34;
  mask-image: radial-gradient(circle at center, black 35%, transparent 82%);
}
button, input, select { font: inherit; }
button {
  border: 1px solid var(--line2);
  border-radius: 12px;
  padding: 10px 13px;
  min-height: 42px;
  cursor: pointer;
  color: var(--text);
  background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.055));
}
button:hover:not(:disabled), button.active {
  border-color: rgba(100, 216, 255, .7);
  background: linear-gradient(180deg, rgba(100,216,255,.2), rgba(109,61,255,.14));
}
button:disabled { opacity: .55; cursor: not-allowed; }
button.primary { border-color: rgba(100, 216, 255, .72); background: linear-gradient(135deg, rgba(109,61,255,.72), rgba(100,216,255,.34)); font-weight: 900; }
input, select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 13px;
  padding: 12px;
  outline: none;
  color: var(--text);
  background: rgba(0,0,0,.32);
}
input:focus, select:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(100,216,255,.13); }
label { display: grid; gap: 7px; color: var(--soft); font-weight: 800; }
h1, h2, p { margin: 0; }
h1 { font-size: clamp(28px, 5vw, 56px); letter-spacing: -0.05em; }
h2 { font-size: 23px; }
.small { font-size: 12px; }
.muted { color: var(--muted); }
.eyebrow { color: var(--gold); text-transform: uppercase; letter-spacing: .14em; font-size: 12px; font-weight: 950; }
.pl-private-shell { position: relative; min-height: 100vh; padding: 24px; display: grid; place-items: center; }
.auth-card, .app-view { width: min(1180px, 100%); position: relative; z-index: 1; }
.auth-card {
  max-width: 640px;
  padding: clamp(24px, 5vw, 46px);
  border: 1px solid var(--line);
  border-radius: 32px;
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025)), var(--panel);
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow), 0 0 60px rgba(109, 61, 255, .2);
}
.brand-lockup { display: flex; gap: 16px; align-items: center; margin-bottom: 18px; }
.logo-mark {
  width: 58px; height: 58px; border-radius: 18px; flex: 0 0 auto;
  display: grid; place-items: center;
  color: #070611; font-weight: 950; letter-spacing: -.06em;
  background: linear-gradient(135deg, var(--gold), var(--blue) 56%, var(--pink));
}
.lead { color: var(--soft); margin: 20px 0; font-size: 17px; }
.auth-form, .account-form { display: grid; gap: 12px; margin-top: 18px; }
.mini-panel, .notice, .empty-state {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--panel2);
  padding: 14px;
}
.mini-panel { margin-top: 16px; color: var(--muted); }
.mini-panel strong { color: var(--text); }
.status { min-height: 22px; margin-top: 12px; }
.status.good { color: var(--good); }
.status.bad { color: var(--bad); }
.app-view { display: grid; gap: 16px; align-self: start; }
.topbar, .panel {
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025)), var(--panel);
  backdrop-filter: blur(18px);
  box-shadow: 0 18px 60px rgba(0,0,0,.28);
}
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px; border-radius: 24px; }
.top-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.notice { color: var(--warn); }
.panel { border-radius: 24px; padding: 18px; }
.panel-head { display: flex; gap: 14px; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; }
.filters { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.filters input { width: min(280px, 100%); }
.filters select { width: 150px; }
.binder-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); gap: 18px; }
.copy-stack { position: relative; isolation: isolate; }
.copy-stack::before, .copy-stack::after {
  content: "";
  position: absolute;
  inset: 9px 8px -8px 8px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  z-index: -1;
  transform: rotate(2.4deg);
}
.copy-stack::after { inset: 17px 15px -15px 15px; transform: rotate(-2deg); opacity: .62; }
.card-tile {
  min-height: 260px;
  border: 1px solid var(--line2);
  border-radius: 20px;
  overflow: hidden;
  background: rgba(0,0,0,.3);
  box-shadow: 0 20px 44px rgba(0,0,0,.28);
}
.card-art {
  height: 182px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(109,61,255,.9), rgba(255,91,231,.32)),
    radial-gradient(circle at 70% 20%, rgba(100,216,255,.56), transparent 34%);
}
.card-art strong { font-size: 23px; letter-spacing: -.04em; text-shadow: 0 2px 12px rgba(0,0,0,.55); }
.card-body { padding: 11px; display: grid; gap: 6px; }
.card-name { font-weight: 950; }
.card-meta { color: var(--muted); font-size: 12px; display: flex; gap: 6px; flex-wrap: wrap; }
.count-pill { position: absolute; top: 10px; right: 10px; border: 1px solid rgba(230,184,71,.6); color: var(--gold); background: rgba(0,0,0,.52); border-radius: 999px; padding: 4px 8px; font-weight: 950; }
.empty-state { color: var(--muted); }
@media (max-width: 760px) {
  .pl-private-shell { padding: 14px; }
  .topbar, .panel-head { flex-direction: column; align-items: stretch; }
  .top-actions, .filters { justify-content: stretch; }
  .top-actions button, .filters input, .filters select { width: 100%; }
}

/* v=binder-reorder-save-1
   Binder cards now render web-card layers directly when a composite has not
   been generated yet: art below, overlay above, signature above that. */
.card-art.card-preview {
  position: relative;
  height: auto;
  aspect-ratio: 2.5 / 3.5;
  overflow: hidden;
  padding: 0;
  border-bottom: 1px solid var(--line);
}
.card-art.card-preview.no-image {
  display: grid;
  place-items: center;
  padding: 12px;
}
.card-layer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}
.card-layer-art { z-index: 1; }
.card-layer-overlay { z-index: 2; }
.card-layer-signature { z-index: 3; }
.card-layer-composite { z-index: 1; }
.card-preview.finish-foil::after,
.card-preview.finish-holo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
  opacity: .16;
  mix-blend-mode: screen;
}
.card-preview.finish-foil::after {
  background: linear-gradient(115deg, transparent 0%, rgba(255,255,255,.32) 46%, transparent 72%);
}
.card-preview.finish-holo::after {
  background:
    linear-gradient(115deg, rgba(255,91,231,.22), rgba(100,216,255,.22), rgba(230,184,71,.18), rgba(109,61,255,.2)),
    linear-gradient(28deg, transparent 0%, rgba(255,255,255,.18) 48%, transparent 72%);
}
.asset-note {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}


/* v=binder-reorder-save-1
   Keep quantity visible over layered card art and add click/drag Binder ordering. */
.card-tile { position: relative; }
.count-pill {
  z-index: 30;
  pointer-events: none;
  box-shadow: 0 8px 18px rgba(0,0,0,.42);
  backdrop-filter: blur(10px);
}
.binder-order-tools {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
  margin: -4px 0 16px;
}
.binder-order-tools button { min-height: 36px; padding: 8px 10px; }
.binder-order-status {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  min-height: 18px;
}
.binder-order-status.good { color: var(--good); }
.binder-order-status.warn { color: var(--warn); }
.binder-order-status.bad { color: var(--bad); }
.copy-stack {
  cursor: grab;
  outline: none;
  transition: transform .14s ease, filter .14s ease;
}
.copy-stack:active { cursor: grabbing; }
.copy-stack:hover, .copy-stack:focus-visible {
  transform: translateY(-3px);
  filter: brightness(1.08);
}
.copy-stack.selected .card-tile {
  border-color: rgba(230,184,71,.85);
  box-shadow: 0 0 0 3px rgba(230,184,71,.18), 0 20px 44px rgba(0,0,0,.28);
}
.copy-stack.dragging {
  opacity: .5;
  transform: scale(.98);
}
.copy-stack.drop-target .card-tile {
  border-color: rgba(100,216,255,.9);
  box-shadow: 0 0 0 3px rgba(100,216,255,.18), 0 20px 44px rgba(0,0,0,.28);
}
.copy-stack.drop-target::before {
  background: rgba(100,216,255,.16);
  border-color: rgba(100,216,255,.5);
}
.binder-grid[data-reorderable="0"] .copy-stack {
  cursor: default;
}
.binder-grid[data-reorderable="0"] .copy-stack:hover {
  transform: none;
}
@media (max-width: 760px) {
  .binder-order-tools button { flex: 1 1 calc(50% - 8px); }
  .binder-order-status { flex-basis: 100%; }
}

/* v=binder-variant-window-1
   In-Binder variant window: click a stack to open owned variants, drag/sort
   variants, then save the per-card variant order. */
.binder-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgba(0, 0, 0, .66);
  backdrop-filter: blur(12px);
}
.binder-modal {
  width: min(1180px, 100%);
  max-height: min(88vh, 980px);
  overflow: auto;
  border: 1px solid var(--line2);
  border-radius: 28px;
  background:
    radial-gradient(circle at 80% 6%, rgba(100,216,255,.16), transparent 32%),
    radial-gradient(circle at 8% 10%, rgba(255,91,231,.16), transparent 28%),
    rgba(10, 9, 24, .96);
  box-shadow: var(--shadow);
  padding: 18px;
}
.binder-modal-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 12px;
}
.binder-modal-head h2 { margin: 0 0 4px; }
.variant-order-tools {
  margin: 0 0 16px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.04);
}
.compact-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.compact-label select { min-height: 36px; padding: 7px 10px; }
.variant-grid {
  grid-template-columns: repeat(auto-fill, minmax(172px, 1fr));
}
.variant-stack .card-tile { min-height: 246px; }
.variant-stack .card-name { font-size: 13px; }
.variant-stack .card-meta { font-size: 11px; }
.copy-stack.drop-target .card-tile {
  border-color: rgba(100,216,255,.9);
  box-shadow: 0 0 0 3px rgba(100,216,255,.17), 0 20px 44px rgba(0,0,0,.28);
}
.copy-stack.drop-target.drop-after .card-tile {
  border-color: rgba(255,91,231,.9);
  box-shadow: 0 0 0 3px rgba(255,91,231,.16), 0 20px 44px rgba(0,0,0,.28);
}
.copy-stack.dragging { opacity: .55; transform: scale(.985); }
@media (max-width: 760px) {
  .binder-modal-backdrop { padding: 10px; align-items: stretch; }
  .binder-modal { max-height: calc(100vh - 20px); border-radius: 20px; }
  .binder-modal-head { flex-direction: column; }
  .variant-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
}


/* v=binder-alt-overlay-finish-fx-1
   Finish effects are now real animated alpha layers, matching the SL model:
   art below, finish shimmer above art, frame overlay above finish, signature on top. */
.card-preview.finish-foil::after,
.card-preview.finish-holo::after {
  content: none !important;
}
.card-layer-art,
.card-layer-composite { z-index: 1; }
.finish-effect {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: .34;
  transform: translateZ(0);
}
.card-layer-overlay { z-index: 3; }
.card-layer-signature { z-index: 4; }
.finish-effect-foil {
  background:
    linear-gradient(115deg, transparent 0%, rgba(255,255,255,.10) 35%, rgba(255,255,255,.55) 50%, rgba(255,255,255,.08) 64%, transparent 100%),
    repeating-linear-gradient(100deg, rgba(255,255,255,.07) 0 2px, transparent 2px 8px);
  background-size: 230% 230%, 120% 120%;
  animation: plFoilSweep 2.7s linear infinite;
}
.finish-effect-holo {
  opacity: .42;
  background:
    linear-gradient(115deg, transparent 0%, rgba(255,255,255,.22) 42%, transparent 62%),
    linear-gradient(45deg, rgba(255,91,231,.42), rgba(100,216,255,.38), rgba(230,184,71,.30), rgba(109,61,255,.36), rgba(255,91,231,.42)),
    repeating-linear-gradient(135deg, rgba(255,255,255,.09) 0 1px, transparent 1px 7px);
  background-size: 240% 240%, 320% 320%, 110% 110%;
  animation: plHoloShift 3.4s linear infinite;
}
@keyframes plFoilSweep {
  0% { background-position: 220% 0%, 0 0; opacity: .18; }
  45% { opacity: .40; }
  100% { background-position: -120% 100%, 40px 0; opacity: .22; }
}
@keyframes plHoloShift {
  0% { background-position: 220% 0%, 0% 50%, 0 0; filter: hue-rotate(0deg); }
  50% { background-position: 20% 80%, 100% 50%, 28px 0; filter: hue-rotate(70deg); }
  100% { background-position: -120% 100%, 0% 50%, 56px 0; filter: hue-rotate(140deg); }
}
@media (prefers-reduced-motion: reduce) {
  .finish-effect-foil,
  .finish-effect-holo { animation: none; }
}

/* v=binder-zoom-fx-1
   Stronger browser-side Holo/Foil visibility and full-size card inspection. */
.card-preview .finish-effect,
.zoom-card-preview .finish-effect {
  display: block !important;
  visibility: visible !important;
}
.finish-effect {
  opacity: .58;
  mix-blend-mode: screen;
  filter: saturate(1.45) contrast(1.18);
}
.finish-effect::before,
.finish-effect::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.finish-effect-foil {
  background:
    linear-gradient(112deg, transparent 0%, rgba(255,255,255,.08) 28%, rgba(255,255,255,.72) 46%, rgba(255,255,255,.12) 60%, transparent 100%),
    repeating-linear-gradient(96deg, rgba(255,255,255,.12) 0 2px, rgba(255,255,255,0) 2px 9px),
    radial-gradient(circle at 25% 15%, rgba(255,255,255,.28), transparent 34%);
  background-size: 260% 260%, 130% 130%, 100% 100%;
  animation: plFoilSweepStrong 2.15s linear infinite;
}
.finish-effect-foil::after {
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  transform: translateX(-130%) skewX(-18deg);
  animation: plGlintPass 1.75s ease-in-out infinite;
}
.finish-effect-holo {
  opacity: .66;
  background:
    linear-gradient(118deg, transparent 0%, rgba(255,255,255,.25) 38%, transparent 61%),
    linear-gradient(45deg, rgba(255,0,200,.48), rgba(0,225,255,.46), rgba(255,230,80,.42), rgba(120,70,255,.48), rgba(255,0,200,.48)),
    repeating-linear-gradient(132deg, rgba(255,255,255,.14) 0 1px, transparent 1px 7px);
  background-size: 270% 270%, 360% 360%, 120% 120%;
  animation: plHoloShiftStrong 2.65s linear infinite;
}
.finish-effect-holo::before {
  background: radial-gradient(circle at 28% 24%, rgba(255,255,255,.28), transparent 18%), radial-gradient(circle at 74% 68%, rgba(255,255,255,.16), transparent 22%);
  animation: plHoloSparkle 1.8s ease-in-out infinite alternate;
}
@keyframes plFoilSweepStrong {
  0% { background-position: 230% 0%, 0 0, 0 0; opacity: .34; }
  45% { opacity: .70; }
  100% { background-position: -140% 100%, 44px 0, 0 0; opacity: .42; }
}
@keyframes plHoloShiftStrong {
  0% { background-position: 230% 0%, 0% 50%, 0 0; filter: hue-rotate(0deg) saturate(1.45) contrast(1.2); }
  50% { background-position: 20% 80%, 100% 50%, 32px 0; filter: hue-rotate(90deg) saturate(1.65) contrast(1.26); }
  100% { background-position: -140% 100%, 0% 50%, 64px 0; filter: hue-rotate(180deg) saturate(1.45) contrast(1.2); }
}
@keyframes plGlintPass {
  0%, 18% { transform: translateX(-130%) skewX(-18deg); opacity: 0; }
  46% { opacity: .75; }
  76%, 100% { transform: translateX(130%) skewX(-18deg); opacity: 0; }
}
@keyframes plHoloSparkle {
  from { opacity: .25; transform: translate3d(-1%, -1%, 0); }
  to { opacity: .75; transform: translate3d(1%, 1%, 0); }
}
.tile-action-row {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  padding-top: 4px;
}
.tile-action {
  min-height: 30px;
  padding: 5px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .02em;
  background: rgba(0,0,0,.34);
}
.card-zoom-btn {
  border-color: rgba(100,216,255,.62);
}
.card-variants-btn {
  border-color: rgba(230,184,71,.56);
}
.zoom-modal-backdrop {
  z-index: 300;
}
.zoom-modal {
  width: min(1220px, 100%);
  max-height: min(94vh, 1100px);
}
.zoom-head {
  position: sticky;
  top: 0;
  z-index: 5;
  padding-bottom: 10px;
  background: linear-gradient(180deg, rgba(10,9,24,.98), rgba(10,9,24,.82));
  backdrop-filter: blur(12px);
}
.zoom-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.zoom-body {
  display: grid;
  grid-template-columns: minmax(300px, 560px) minmax(260px, 1fr);
  gap: 18px;
  align-items: start;
}
.zoom-card-stage {
  display: grid;
  place-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: radial-gradient(circle at 50% 16%, rgba(100,216,255,.10), transparent 40%), rgba(255,255,255,.04);
}
.zoom-card-stage .card-preview {
  width: min(520px, 82vw, calc((86vh - 170px) * .7142857));
  max-height: calc(86vh - 170px);
  aspect-ratio: 2.5 / 3.5;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 22px;
  box-shadow: 0 30px 72px rgba(0,0,0,.55), 0 0 42px rgba(109,61,255,.20);
}
.zoom-card-stage .finish-effect {
  opacity: .72;
}
.zoom-info {
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 16px;
  background: rgba(255,255,255,.045);
  display: grid;
  gap: 12px;
}
.zoom-info h3 {
  margin: 0;
  font-size: clamp(22px, 4vw, 36px);
  letter-spacing: -.04em;
}
.zoom-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.zoom-detail {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px;
  background: rgba(0,0,0,.18);
}
.zoom-detail span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.zoom-detail strong {
  display: block;
  margin-top: 2px;
  word-break: break-word;
}
.zoom-tags {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
}
.zoom-tags span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 4px 8px;
  color: var(--muted);
  background: rgba(0,0,0,.22);
  font-size: 12px;
  font-weight: 850;
}
@media (max-width: 860px) {
  .zoom-body { grid-template-columns: 1fr; }
  .zoom-actions { justify-content: stretch; }
  .zoom-actions button { flex: 1 1 auto; }
  .zoom-card-stage .card-preview { width: min(420px, 88vw); max-height: none; }
}


/* v=binder-soft-finish-fx-1
   Softer, distinct finish effects:
   - Foil is a gentle sparkle/twinkle layer.
   - Holo is a slow, low-opacity pastel shimmer, not a screen wipe. */
.card-preview .finish-effect,
.zoom-card-preview .finish-effect {
  display: block !important;
  visibility: visible !important;
  pointer-events: none;
  mix-blend-mode: screen;
  filter: saturate(1.05) contrast(1.02);
}

.finish-effect,
.finish-effect::before,
.finish-effect::after {
  border-radius: inherit;
}

.finish-effect-foil {
  opacity: .24;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.70) 0 1px, transparent 2.4px),
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.48) 0 1px, transparent 2.2px),
    radial-gradient(circle at 38% 76%, rgba(255,255,255,.55) 0 1px, transparent 2.4px),
    radial-gradient(circle at 88% 62%, rgba(255,255,255,.42) 0 1px, transparent 2.2px),
    radial-gradient(circle at 57% 45%, rgba(255,255,255,.35) 0 .9px, transparent 2px),
    linear-gradient(135deg, rgba(255,255,255,.06), transparent 38%, rgba(255,255,255,.05) 66%, transparent);
  background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 100% 100%, 180% 180%;
  background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0% 50%;
  animation: plFoilTwinkleSoft 8.8s ease-in-out infinite;
}
.finish-effect-foil::before {
  opacity: .45;
  background:
    radial-gradient(circle at 29% 37%, rgba(255,255,255,.65) 0 .8px, transparent 2px),
    radial-gradient(circle at 66% 71%, rgba(255,255,255,.44) 0 .8px, transparent 2px),
    radial-gradient(circle at 83% 31%, rgba(255,255,255,.38) 0 .8px, transparent 2px),
    radial-gradient(circle at 12% 84%, rgba(255,255,255,.34) 0 .8px, transparent 2px);
  animation: plFoilSparkleSoft 5.6s ease-in-out infinite alternate;
}
.finish-effect-foil::after {
  opacity: .16;
  background: linear-gradient(115deg, transparent 15%, rgba(255,255,255,.18) 48%, transparent 78%);
  transform: none;
  animation: plFoilBreathSoft 10s ease-in-out infinite;
}

.finish-effect-holo {
  opacity: .18;
  background:
    linear-gradient(125deg, rgba(255,80,220,.18), rgba(70,220,255,.16), rgba(255,232,95,.12), rgba(140,95,255,.15), rgba(255,80,220,.18)),
    radial-gradient(circle at 24% 18%, rgba(255,255,255,.10), transparent 24%),
    radial-gradient(circle at 76% 72%, rgba(255,255,255,.08), transparent 28%);
  background-size: 360% 360%, 100% 100%, 100% 100%;
  background-position: 0% 50%, 0 0, 0 0;
  animation: plHoloShimmerSoft 12.5s ease-in-out infinite;
}
.finish-effect-holo::before {
  opacity: .18;
  background:
    linear-gradient(105deg, transparent 18%, rgba(255,255,255,.16) 49%, transparent 82%),
    repeating-linear-gradient(130deg, rgba(255,255,255,.035) 0 1px, transparent 1px 9px);
  background-size: 260% 260%, 120% 120%;
  background-position: 120% 0%, 0 0;
  animation: plHoloSheenSoft 14s ease-in-out infinite;
}
.finish-effect-holo::after {
  opacity: .10;
  background: radial-gradient(circle at 50% 35%, rgba(255,255,255,.16), transparent 40%);
  animation: plHoloBreathSoft 7.5s ease-in-out infinite alternate;
}

.zoom-card-preview .finish-effect-foil { opacity: .30; }
.zoom-card-preview .finish-effect-holo { opacity: .22; }
.zoom-card-preview .finish-effect-holo::before { opacity: .20; }
.zoom-card-preview .finish-effect-holo::after { opacity: .12; }

@keyframes plFoilTwinkleSoft {
  0%, 100% { opacity: .16; background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0% 50%; }
  22% { opacity: .27; }
  47% { opacity: .20; }
  72% { opacity: .32; background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 100% 50%; }
}
@keyframes plFoilSparkleSoft {
  from { opacity: .22; transform: translate3d(-.4%, .2%, 0); }
  to { opacity: .58; transform: translate3d(.5%, -.3%, 0); }
}
@keyframes plFoilBreathSoft {
  0%, 100% { opacity: .05; background-position: 0% 50%; }
  50% { opacity: .18; background-position: 100% 50%; }
}
@keyframes plHoloShimmerSoft {
  0%, 100% { background-position: 0% 50%, 0 0, 0 0; filter: hue-rotate(0deg) saturate(1.04); }
  50% { background-position: 100% 50%, 0 0, 0 0; filter: hue-rotate(32deg) saturate(1.12); }
}
@keyframes plHoloSheenSoft {
  0%, 18% { opacity: .06; background-position: 130% 0%, 0 0; }
  52% { opacity: .18; background-position: 48% 62%, 18px 0; }
  86%, 100% { opacity: .07; background-position: -25% 100%, 36px 0; }
}
@keyframes plHoloBreathSoft {
  from { opacity: .06; transform: translate3d(-.5%, -.5%, 0) scale(1.00); }
  to { opacity: .14; transform: translate3d(.5%, .5%, 0) scale(1.015); }
}

@media (prefers-reduced-motion: reduce) {
  .finish-effect-foil,
  .finish-effect-foil::before,
  .finish-effect-foil::after,
  .finish-effect-holo,
  .finish-effect-holo::before,
  .finish-effect-holo::after {
    animation: none !important;
  }
}

/* v=binder-visible-soft-fx-2
   Restore visible but tasteful finish effects.
   Foil: gentle sparse sparkles / twinkles, no sweep.
   Holo: slow low-opacity pastel shimmer, no screen-wipe band. */
.card-preview,
.zoom-card-preview {
  isolation: isolate;
}
.card-preview .finish-effect,
.zoom-card-preview .finish-effect {
  content: "";
  display: block !important;
  visibility: visible !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  pointer-events: none !important;
  border-radius: inherit;
  opacity: 1 !important;
  mix-blend-mode: screen !important;
  transform: translateZ(0);
  will-change: opacity, background-position, filter, transform;
}
.card-preview .finish-effect::before,
.card-preview .finish-effect::after,
.zoom-card-preview .finish-effect::before,
.zoom-card-preview .finish-effect::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit;
  display: block !important;
}

.card-preview .finish-effect-foil,
.zoom-card-preview .finish-effect-foil {
  opacity: .40 !important;
  background:
    radial-gradient(circle at 16% 24%, rgba(255,255,255,.72) 0 .9px, transparent 2.4px),
    radial-gradient(circle at 34% 72%, rgba(255,255,255,.52) 0 .8px, transparent 2.2px),
    radial-gradient(circle at 61% 38%, rgba(255,255,255,.44) 0 .8px, transparent 2.1px),
    radial-gradient(circle at 82% 64%, rgba(255,255,255,.58) 0 .9px, transparent 2.5px),
    radial-gradient(circle at 72% 18%, rgba(255,245,190,.42) 0 .8px, transparent 2.2px),
    linear-gradient(135deg, rgba(255,255,255,.055), transparent 45%, rgba(255,245,210,.05));
  background-size: 100% 100%;
  animation: plFoilVisibleTwinkle 6.8s ease-in-out infinite;
  filter: saturate(1.08) contrast(1.03);
}
.card-preview .finish-effect-foil::before,
.zoom-card-preview .finish-effect-foil::before {
  opacity: .48 !important;
  background:
    radial-gradient(circle at 24% 48%, rgba(255,255,255,.78) 0 .75px, transparent 2.2px),
    radial-gradient(circle at 48% 18%, rgba(255,255,255,.46) 0 .7px, transparent 2px),
    radial-gradient(circle at 56% 86%, rgba(255,255,255,.50) 0 .8px, transparent 2.2px),
    radial-gradient(circle at 90% 32%, rgba(255,255,255,.46) 0 .7px, transparent 2px);
  animation: plFoilVisibleSparkles 4.2s ease-in-out infinite alternate;
}
.card-preview .finish-effect-foil::after,
.zoom-card-preview .finish-effect-foil::after {
  opacity: .16 !important;
  background: radial-gradient(circle at 50% 52%, rgba(255,255,255,.22), transparent 46%);
  animation: plFoilVisibleBreath 9s ease-in-out infinite;
}

.card-preview .finish-effect-holo,
.zoom-card-preview .finish-effect-holo {
  opacity: .28 !important;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,120,230,.22), transparent 34%),
    radial-gradient(circle at 78% 28%, rgba(80,220,255,.20), transparent 36%),
    radial-gradient(circle at 42% 78%, rgba(255,230,95,.16), transparent 34%),
    linear-gradient(120deg, rgba(255,80,220,.16), rgba(70,220,255,.15), rgba(255,232,95,.11), rgba(140,95,255,.14), rgba(255,80,220,.16));
  background-size: 120% 120%, 120% 120%, 120% 120%, 420% 420%;
  background-position: 0% 0%, 100% 0%, 40% 100%, 0% 50%;
  animation: plHoloVisibleDrift 18s ease-in-out infinite;
  filter: saturate(1.18) contrast(1.04);
}
.card-preview .finish-effect-holo::before,
.zoom-card-preview .finish-effect-holo::before {
  opacity: .13 !important;
  background: repeating-linear-gradient(130deg, rgba(255,255,255,.11) 0 1px, transparent 1px 10px);
  background-size: 130% 130%;
  animation: plHoloVisibleLines 24s ease-in-out infinite;
}
.card-preview .finish-effect-holo::after,
.zoom-card-preview .finish-effect-holo::after {
  opacity: .18 !important;
  background:
    radial-gradient(circle at 33% 28%, rgba(255,255,255,.20), transparent 20%),
    radial-gradient(circle at 70% 70%, rgba(255,255,255,.11), transparent 26%);
  animation: plHoloVisibleBreath 10s ease-in-out infinite alternate;
}

.zoom-card-preview .finish-effect-foil { opacity: .48 !important; }
.zoom-card-preview .finish-effect-foil::before { opacity: .58 !important; }
.zoom-card-preview .finish-effect-holo { opacity: .34 !important; }
.zoom-card-preview .finish-effect-holo::before { opacity: .16 !important; }
.zoom-card-preview .finish-effect-holo::after { opacity: .22 !important; }

@keyframes plFoilVisibleTwinkle {
  0%, 100% { opacity: .28; filter: brightness(1.00) saturate(1.06); }
  18% { opacity: .44; }
  43% { opacity: .32; }
  67% { opacity: .50; filter: brightness(1.08) saturate(1.12); }
  82% { opacity: .35; }
}
@keyframes plFoilVisibleSparkles {
  0% { opacity: .22; transform: translate3d(-.25%, .18%, 0) scale(1); }
  45% { opacity: .56; }
  100% { opacity: .34; transform: translate3d(.24%, -.20%, 0) scale(1.004); }
}
@keyframes plFoilVisibleBreath {
  0%, 100% { opacity: .06; transform: scale(1); }
  50% { opacity: .17; transform: scale(1.012); }
}
@keyframes plHoloVisibleDrift {
  0%, 100% {
    background-position: 0% 0%, 100% 0%, 40% 100%, 0% 50%;
    filter: hue-rotate(0deg) saturate(1.14) contrast(1.02);
  }
  50% {
    background-position: 12% 8%, 88% 12%, 54% 88%, 100% 50%;
    filter: hue-rotate(28deg) saturate(1.24) contrast(1.05);
  }
}
@keyframes plHoloVisibleLines {
  0%, 100% { opacity: .07; background-position: 0 0; }
  50% { opacity: .14; background-position: 34px 18px; }
}
@keyframes plHoloVisibleBreath {
  0% { opacity: .10; transform: translate3d(-.35%, -.20%, 0) scale(1); }
  100% { opacity: .21; transform: translate3d(.35%, .25%, 0) scale(1.012); }
}

@media (prefers-reduced-motion: reduce) {
  .card-preview .finish-effect-foil,
  .card-preview .finish-effect-foil::before,
  .card-preview .finish-effect-foil::after,
  .card-preview .finish-effect-holo,
  .card-preview .finish-effect-holo::before,
  .card-preview .finish-effect-holo::after,
  .zoom-card-preview .finish-effect-foil,
  .zoom-card-preview .finish-effect-foil::before,
  .zoom-card-preview .finish-effect-foil::after,
  .zoom-card-preview .finish-effect-holo,
  .zoom-card-preview .finish-effect-holo::before,
  .zoom-card-preview .finish-effect-holo::after {
    animation-duration: 28s !important;
  }
}

/* v=binder-iridescent-fx-3
   Finish FX tuning pass:
   - Foil: sparse gold/white twinkle sparkles with small glints, no wipe.
   - Holo: slow low-opacity iridescent color drift, visible color without grey wash. */
.card-preview .finish-effect,
.zoom-card-preview .finish-effect {
  display: block !important;
  visibility: visible !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit;
  overflow: hidden;
  z-index: 2 !important;
  transform: translateZ(0);
  will-change: opacity, background-position, filter, transform;
}
.card-preview .finish-effect::before,
.card-preview .finish-effect::after,
.zoom-card-preview .finish-effect::before,
.zoom-card-preview .finish-effect::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  pointer-events: none !important;
  border-radius: inherit;
  transform: translateZ(0);
}

.card-preview .finish-effect-foil,
.zoom-card-preview .finish-effect-foil {
  opacity: .56 !important;
  mix-blend-mode: screen !important;
  background:
    radial-gradient(circle at 13% 18%, rgba(255,255,255,.92) 0 .85px, transparent 2.8px),
    radial-gradient(circle at 28% 67%, rgba(255,232,155,.82) 0 .8px, transparent 2.6px),
    radial-gradient(circle at 47% 31%, rgba(255,255,255,.70) 0 .75px, transparent 2.4px),
    radial-gradient(circle at 64% 82%, rgba(255,246,205,.76) 0 .9px, transparent 2.9px),
    radial-gradient(circle at 82% 44%, rgba(255,255,255,.68) 0 .7px, transparent 2.3px),
    radial-gradient(circle at 91% 76%, rgba(255,216,130,.64) 0 .75px, transparent 2.5px);
  background-size: 100% 100%;
  filter: drop-shadow(0 0 2px rgba(255,255,255,.72)) drop-shadow(0 0 5px rgba(255,210,95,.32));
  animation: plFoilTwinkleField3 7.5s steps(1, end) infinite;
}
.card-preview .finish-effect-foil::before,
.zoom-card-preview .finish-effect-foil::before {
  opacity: .45 !important;
  mix-blend-mode: screen !important;
  background:
    radial-gradient(circle at 20% 49%, rgba(255,255,255,.95) 0 .65px, transparent 2.2px),
    radial-gradient(circle at 39% 14%, rgba(255,235,165,.72) 0 .65px, transparent 2.15px),
    radial-gradient(circle at 58% 59%, rgba(255,255,255,.82) 0 .6px, transparent 2px),
    radial-gradient(circle at 74% 23%, rgba(255,245,205,.66) 0 .65px, transparent 2.15px),
    radial-gradient(circle at 88% 87%, rgba(255,255,255,.74) 0 .7px, transparent 2.35px);
  filter: drop-shadow(0 0 3px rgba(255,255,255,.85)) drop-shadow(0 0 6px rgba(255,215,120,.36));
  animation: plFoilSparklePop3 4.8s ease-in-out infinite alternate;
}
.card-preview .finish-effect-foil::after,
.zoom-card-preview .finish-effect-foil::after {
  opacity: .22 !important;
  mix-blend-mode: screen !important;
  background:
    linear-gradient(45deg, transparent 0 46%, rgba(255,255,255,.42) 49%, rgba(255,255,255,.62) 50%, rgba(255,255,255,.42) 51%, transparent 54% 100%),
    linear-gradient(135deg, transparent 0 46%, rgba(255,233,170,.34) 49%, rgba(255,255,255,.54) 50%, rgba(255,233,170,.34) 51%, transparent 54% 100%);
  background-size: 22px 22px, 22px 22px;
  background-position: 16% 18%, 16% 18%;
  filter: blur(.15px) drop-shadow(0 0 3px rgba(255,255,255,.7));
  animation: plFoilStarGlint3 6.2s ease-in-out infinite;
}
.zoom-card-preview .finish-effect-foil { opacity: .68 !important; }
.zoom-card-preview .finish-effect-foil::before { opacity: .58 !important; }
.zoom-card-preview .finish-effect-foil::after { opacity: .30 !important; }

.card-preview .finish-effect-holo,
.zoom-card-preview .finish-effect-holo {
  opacity: .34 !important;
  mix-blend-mode: screen !important;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,72,210,.22), transparent 30%),
    radial-gradient(circle at 80% 25%, rgba(40,225,255,.24), transparent 34%),
    radial-gradient(circle at 46% 82%, rgba(255,220,65,.18), transparent 32%),
    radial-gradient(circle at 72% 72%, rgba(120,80,255,.20), transparent 34%),
    linear-gradient(125deg,
      rgba(255,56,205,.18) 0%,
      rgba(70,220,255,.20) 26%,
      rgba(255,236,82,.15) 50%,
      rgba(126,85,255,.18) 74%,
      rgba(255,74,205,.16) 100%);
  background-size: 135% 135%, 140% 140%, 130% 130%, 145% 145%, 360% 360%;
  background-position: 0% 0%, 100% 8%, 35% 100%, 85% 86%, 0% 50%;
  background-blend-mode: screen;
  filter: saturate(1.55) brightness(1.05) contrast(1.02);
  animation: plHoloIridescentDrift3 22s ease-in-out infinite;
}
.card-preview .finish-effect-holo::before,
.zoom-card-preview .finish-effect-holo::before {
  opacity: .24 !important;
  mix-blend-mode: screen !important;
  background:
    repeating-linear-gradient(128deg,
      rgba(255,75,205,.12) 0 8px,
      rgba(55,220,255,.13) 8px 16px,
      rgba(255,232,90,.09) 16px 24px,
      rgba(135,90,255,.11) 24px 32px,
      transparent 32px 48px);
  background-size: 180% 180%;
  filter: saturate(1.35) blur(.12px);
  animation: plHoloColorBands3 28s ease-in-out infinite;
}
.card-preview .finish-effect-holo::after,
.zoom-card-preview .finish-effect-holo::after {
  opacity: .18 !important;
  mix-blend-mode: color-dodge !important;
  background:
    radial-gradient(ellipse at 30% 35%, rgba(255,105,230,.20), transparent 35%),
    radial-gradient(ellipse at 68% 60%, rgba(80,235,255,.18), transparent 38%),
    radial-gradient(ellipse at 50% 72%, rgba(255,230,110,.12), transparent 35%);
  filter: saturate(1.6) blur(.2px);
  animation: plHoloSoftPulse3 12s ease-in-out infinite alternate;
}
.zoom-card-preview .finish-effect-holo { opacity: .44 !important; }
.zoom-card-preview .finish-effect-holo::before { opacity: .30 !important; }
.zoom-card-preview .finish-effect-holo::after { opacity: .24 !important; }

@keyframes plFoilTwinkleField3 {
  0%, 100% { opacity: .36; filter: drop-shadow(0 0 1px rgba(255,255,255,.55)) drop-shadow(0 0 4px rgba(255,210,95,.22)); }
  12% { opacity: .64; }
  25% { opacity: .42; }
  39% { opacity: .72; }
  53% { opacity: .38; }
  68% { opacity: .60; }
  82% { opacity: .46; }
}
@keyframes plFoilSparklePop3 {
  0% { opacity: .18; transform: translate3d(-.12%, .10%, 0) scale(.998); }
  22% { opacity: .56; }
  48% { opacity: .24; }
  72% { opacity: .64; transform: translate3d(.10%, -.08%, 0) scale(1.004); }
  100% { opacity: .32; transform: translate3d(.16%, -.12%, 0) scale(1.001); }
}
@keyframes plFoilStarGlint3 {
  0%, 18%, 100% { opacity: .05; transform: scale(.985) rotate(0deg); }
  28% { opacity: .30; transform: scale(1.012) rotate(1deg); }
  44% { opacity: .08; }
  68% { opacity: .23; transform: scale(1.008) rotate(-.8deg); }
  84% { opacity: .07; }
}
@keyframes plHoloIridescentDrift3 {
  0%, 100% {
    background-position: 0% 0%, 100% 8%, 35% 100%, 85% 86%, 0% 50%;
    filter: hue-rotate(0deg) saturate(1.45) brightness(1.04) contrast(1.02);
  }
  35% {
    background-position: 7% 8%, 92% 14%, 44% 92%, 76% 80%, 58% 52%;
    filter: hue-rotate(16deg) saturate(1.62) brightness(1.06) contrast(1.03);
  }
  70% {
    background-position: 12% 3%, 86% 4%, 54% 88%, 70% 90%, 100% 48%;
    filter: hue-rotate(30deg) saturate(1.52) brightness(1.05) contrast(1.02);
  }
}
@keyframes plHoloColorBands3 {
  0%, 100% { opacity: .14; background-position: 0% 0%; transform: translate3d(-.2%, -.1%, 0); }
  50% { opacity: .27; background-position: 58% 42%; transform: translate3d(.2%, .12%, 0); }
}
@keyframes plHoloSoftPulse3 {
  0% { opacity: .10; transform: translate3d(-.25%, -.15%, 0) scale(1); }
  100% { opacity: .22; transform: translate3d(.25%, .18%, 0) scale(1.018); }
}

@media (prefers-reduced-motion: reduce) {
  .card-preview .finish-effect-foil,
  .card-preview .finish-effect-foil::before,
  .card-preview .finish-effect-foil::after,
  .card-preview .finish-effect-holo,
  .card-preview .finish-effect-holo::before,
  .card-preview .finish-effect-holo::after,
  .zoom-card-preview .finish-effect-foil,
  .zoom-card-preview .finish-effect-foil::before,
  .zoom-card-preview .finish-effect-foil::after,
  .zoom-card-preview .finish-effect-holo,
  .zoom-card-preview .finish-effect-holo::before,
  .zoom-card-preview .finish-effect-holo::after {
    animation-duration: 36s !important;
  }
}


/* v=binder-prism-random-fx-4
   Stronger finish identity pass:
   - Holo is real iridescent rainbow/prism color, not a grey veil.
   - Foil uses individual randomized white/gold twinkles generated by JS, not hatch lines. */
.card-preview .finish-effect,
.zoom-card-preview .finish-effect {
  display: block !important;
  visibility: visible !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit;
  overflow: hidden;
  z-index: 2 !important;
  transform: translateZ(0);
  will-change: opacity, background-position, filter, transform;
}
.card-preview .finish-effect::before,
.card-preview .finish-effect::after,
.zoom-card-preview .finish-effect::before,
.zoom-card-preview .finish-effect::after {
  content: "" !important;
  position: absolute !important;
  inset: -18% !important;
  display: block !important;
  pointer-events: none !important;
  border-radius: inherit;
  transform: translateZ(0);
}

.card-preview .finish-effect-holo,
.zoom-card-preview .finish-effect-holo {
  opacity: .62 !important;
  mix-blend-mode: screen !important;
  background:
    conic-gradient(from 215deg at 50% 48%,
      rgba(255, 40, 215, .40) 0deg,
      rgba(45, 225, 255, .45) 58deg,
      rgba(255, 235, 72, .33) 116deg,
      rgba(92, 85, 255, .42) 174deg,
      rgba(20, 255, 180, .30) 232deg,
      rgba(255, 86, 190, .36) 296deg,
      rgba(255, 40, 215, .40) 360deg),
    radial-gradient(circle at 18% 18%, rgba(255, 38, 218, .38), transparent 34%),
    radial-gradient(circle at 82% 24%, rgba(55, 232, 255, .42), transparent 36%),
    radial-gradient(circle at 48% 84%, rgba(255, 230, 80, .26), transparent 34%),
    radial-gradient(circle at 75% 78%, rgba(118, 82, 255, .34), transparent 36%);
  background-size: 180% 180%, 145% 145%, 150% 150%, 140% 140%, 155% 155%;
  background-position: 50% 50%, 0% 0%, 100% 5%, 36% 100%, 88% 88%;
  background-blend-mode: screen;
  filter: saturate(2.1) brightness(1.12) contrast(1.05);
  animation: plHoloPrismDrift4 18s ease-in-out infinite;
}
.card-preview .finish-effect-holo::before,
.zoom-card-preview .finish-effect-holo::before {
  opacity: .55 !important;
  mix-blend-mode: color-dodge !important;
  background:
    linear-gradient(115deg,
      transparent 0%,
      rgba(255, 50, 215, .00) 14%,
      rgba(255, 50, 215, .28) 24%,
      rgba(45, 225, 255, .32) 34%,
      rgba(255, 234, 82, .22) 46%,
      rgba(110, 90, 255, .30) 58%,
      rgba(45, 255, 180, .18) 70%,
      rgba(255, 50, 215, .18) 82%,
      transparent 100%);
  background-size: 260% 260%;
  filter: saturate(2.35) blur(.32px);
  animation: plHoloPrismBands4 24s ease-in-out infinite;
}
.card-preview .finish-effect-holo::after,
.zoom-card-preview .finish-effect-holo::after {
  opacity: .34 !important;
  mix-blend-mode: overlay !important;
  background:
    repeating-linear-gradient(132deg,
      rgba(255, 70, 220, .18) 0 10px,
      rgba(50, 230, 255, .18) 10px 20px,
      rgba(255, 232, 72, .14) 20px 30px,
      rgba(125, 95, 255, .18) 30px 40px,
      transparent 40px 64px),
    radial-gradient(ellipse at 42% 48%, rgba(255,255,255,.12), transparent 45%);
  background-size: 190% 190%, 100% 100%;
  filter: saturate(1.8) blur(.18px);
  animation: plHoloPrismTexture4 31s ease-in-out infinite alternate;
}
.zoom-card-preview .finish-effect-holo { opacity: .78 !important; }
.zoom-card-preview .finish-effect-holo::before { opacity: .66 !important; }
.zoom-card-preview .finish-effect-holo::after { opacity: .42 !important; }

.card-preview .finish-effect-foil,
.zoom-card-preview .finish-effect-foil {
  opacity: 1 !important;
  mix-blend-mode: screen !important;
  background: none !important;
  filter: none !important;
  animation: none !important;
}
.card-preview .finish-effect-foil::before,
.card-preview .finish-effect-foil::after,
.zoom-card-preview .finish-effect-foil::before,
.zoom-card-preview .finish-effect-foil::after {
  display: none !important;
  background: none !important;
  animation: none !important;
}
.foil-sparkle {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--s);
  height: var(--s);
  transform: translate(-50%, -50%) scale(.1) rotate(0deg);
  border-radius: 999px;
  opacity: 0;
  pointer-events: none;
  mix-blend-mode: screen;
  background: radial-gradient(circle,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,.95) 18%,
    rgba(255,235,170,.62) 36%,
    rgba(255,255,255,0) 70%);
  filter:
    drop-shadow(0 0 2px rgba(255,255,255,.95))
    drop-shadow(0 0 7px rgba(255,220,135,.44));
  animation: plFoilRandomTwinkle4 var(--dur) cubic-bezier(.4,0,.2,1) infinite;
  animation-delay: var(--delay);
}
.foil-sparkle-gold {
  background: radial-gradient(circle,
    rgba(255,255,255,.98) 0%,
    rgba(255,239,170,.96) 20%,
    rgba(255,198,76,.66) 42%,
    rgba(255,255,255,0) 74%);
  filter:
    drop-shadow(0 0 2px rgba(255,245,190,.92))
    drop-shadow(0 0 8px rgba(255,185,70,.50));
}
.foil-sparkle::before,
.foil-sparkle::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: calc(var(--s) * 2.9);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.92), transparent);
  transform: translate(-50%, -50%);
  opacity: 0;
}
.foil-sparkle::after {
  transform: translate(-50%, -50%) rotate(90deg);
  width: calc(var(--s) * 2.1);
}
.zoom-card-preview .foil-sparkle {
  filter:
    drop-shadow(0 0 2px rgba(255,255,255,1))
    drop-shadow(0 0 10px rgba(255,220,135,.58));
}
.zoom-card-preview .foil-sparkle::before,
.zoom-card-preview .foil-sparkle::after { opacity: .98; }

@keyframes plHoloPrismDrift4 {
  0%, 100% {
    background-position: 50% 50%, 0% 0%, 100% 5%, 36% 100%, 88% 88%;
    filter: hue-rotate(0deg) saturate(2.00) brightness(1.10) contrast(1.05);
    transform: translate3d(0,0,0) scale(1);
  }
  30% {
    background-position: 64% 44%, 8% 12%, 90% 14%, 46% 90%, 78% 80%;
    filter: hue-rotate(22deg) saturate(2.30) brightness(1.16) contrast(1.07);
    transform: translate3d(.25%, -.18%, 0) scale(1.012);
  }
  68% {
    background-position: 38% 60%, 15% 4%, 84% 2%, 54% 84%, 70% 94%;
    filter: hue-rotate(-18deg) saturate(2.18) brightness(1.13) contrast(1.06);
    transform: translate3d(-.22%, .2%, 0) scale(1.008);
  }
}
@keyframes plHoloPrismBands4 {
  0%, 100% { background-position: 0% 48%; transform: translate3d(-.4%, -.2%, 0) rotate(-1deg); }
  50% { background-position: 100% 52%; transform: translate3d(.35%, .22%, 0) rotate(1deg); }
}
@keyframes plHoloPrismTexture4 {
  0% { opacity: .22; background-position: 0% 0%, 50% 50%; }
  45% { opacity: .38; background-position: 56% 42%, 50% 50%; }
  100% { opacity: .28; background-position: 100% 88%, 50% 50%; }
}
@keyframes plFoilRandomTwinkle4 {
  0%, 17%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.15) rotate(0deg);
  }
  22% {
    opacity: .28;
    transform: translate(-50%, -50%) scale(.72) rotate(24deg);
  }
  25% {
    opacity: .96;
    transform: translate(-50%, -50%) scale(1.35) rotate(45deg);
  }
  29% {
    opacity: .12;
    transform: translate(-50%, -50%) scale(.62) rotate(74deg);
  }
  58% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.2) rotate(90deg);
  }
  64% {
    opacity: .62;
    transform: translate(-50%, -50%) scale(1.05) rotate(140deg);
  }
  68% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.34) rotate(170deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .card-preview .finish-effect-holo,
  .card-preview .finish-effect-holo::before,
  .card-preview .finish-effect-holo::after,
  .zoom-card-preview .finish-effect-holo,
  .zoom-card-preview .finish-effect-holo::before,
  .zoom-card-preview .finish-effect-holo::after,
  .foil-sparkle {
    animation-duration: 42s !important;
  }
}


/* v=binder-prism-shine-twinkle-fx-5
   Finish tuning:
   - Foil keeps the random white/gold sparkle system, with more sparkle points and faster random twinkles.
   - Holo is less opaque and less liquid: a thin iridescent prism sheen plus a slow glossy color-shift highlight. */
.card-preview .finish-effect-holo,
.zoom-card-preview .finish-effect-holo {
  opacity: .34 !important;
  mix-blend-mode: screen !important;
  background:
    linear-gradient(116deg,
      transparent 0%,
      rgba(255, 48, 210, .00) 15%,
      rgba(255, 48, 210, .22) 24%,
      rgba(40, 225, 255, .25) 34%,
      rgba(255, 232, 72, .17) 44%,
      rgba(110, 90, 255, .20) 54%,
      rgba(40, 255, 185, .14) 64%,
      rgba(255, 48, 210, .10) 74%,
      transparent 86% 100%),
    conic-gradient(from 210deg at 50% 50%,
      rgba(255, 45, 215, .16) 0deg,
      rgba(45, 225, 255, .20) 62deg,
      rgba(255, 235, 80, .13) 124deg,
      rgba(104, 86, 255, .18) 188deg,
      rgba(35, 255, 185, .12) 250deg,
      rgba(255, 65, 205, .15) 315deg,
      rgba(255, 45, 215, .16) 360deg);
  background-size: 280% 280%, 190% 190%;
  background-position: 6% 50%, 50% 50%;
  background-blend-mode: screen;
  filter: saturate(2.25) brightness(1.08) contrast(1.03);
  animation: plHoloPrismSheen5 24s ease-in-out infinite !important;
}
.card-preview .finish-effect-holo::before,
.zoom-card-preview .finish-effect-holo::before {
  opacity: .30 !important;
  mix-blend-mode: color-dodge !important;
  background:
    linear-gradient(116deg,
      transparent 0 35%,
      rgba(255,255,255,.00) 39%,
      rgba(255,255,255,.20) 44%,
      rgba(75,235,255,.20) 47%,
      rgba(255,85,220,.14) 50%,
      rgba(255,238,120,.12) 53%,
      rgba(255,255,255,.12) 57%,
      transparent 64% 100%);
  background-size: 230% 230%;
  filter: blur(.18px) saturate(1.65) brightness(1.12);
  animation: plHoloGlossGlide5 19s ease-in-out infinite !important;
}
.card-preview .finish-effect-holo::after,
.zoom-card-preview .finish-effect-holo::after {
  opacity: .16 !important;
  mix-blend-mode: screen !important;
  background:
    linear-gradient(28deg,
      rgba(255,70,220,.12),
      rgba(50,230,255,.10) 30%,
      rgba(255,232,90,.08) 52%,
      rgba(130,95,255,.10) 72%,
      rgba(45,255,190,.07)),
    radial-gradient(ellipse at 50% 50%, rgba(255,255,255,.10), transparent 58%);
  background-size: 170% 170%, 100% 100%;
  filter: saturate(1.8) blur(.12px);
  animation: plHoloPearlShift5 30s ease-in-out infinite alternate !important;
}
.zoom-card-preview .finish-effect-holo { opacity: .48 !important; }
.zoom-card-preview .finish-effect-holo::before { opacity: .40 !important; }
.zoom-card-preview .finish-effect-holo::after { opacity: .22 !important; }

@keyframes plHoloPrismSheen5 {
  0%, 100% {
    background-position: 4% 50%, 50% 50%;
    filter: hue-rotate(0deg) saturate(2.15) brightness(1.06) contrast(1.03);
    transform: translate3d(0,0,0) scale(1);
  }
  38% {
    background-position: 62% 48%, 56% 44%;
    filter: hue-rotate(18deg) saturate(2.45) brightness(1.10) contrast(1.04);
    transform: translate3d(.10%, -.08%, 0) scale(1.004);
  }
  72% {
    background-position: 96% 52%, 44% 58%;
    filter: hue-rotate(-14deg) saturate(2.30) brightness(1.08) contrast(1.03);
    transform: translate3d(-.08%, .10%, 0) scale(1.002);
  }
}
@keyframes plHoloGlossGlide5 {
  0%, 100% { opacity: .16; background-position: -60% 50%; transform: translate3d(-.3%, -.12%, 0) rotate(-.35deg); }
  45% { opacity: .34; background-position: 52% 50%; transform: translate3d(.15%, .08%, 0) rotate(.25deg); }
  70% { opacity: .24; background-position: 120% 50%; transform: translate3d(.28%, .14%, 0) rotate(.18deg); }
}
@keyframes plHoloPearlShift5 {
  0% { opacity: .10; background-position: 0% 40%, 50% 50%; }
  50% { opacity: .18; background-position: 62% 58%, 50% 50%; }
  100% { opacity: .13; background-position: 100% 44%, 50% 50%; }
}

/* Slightly more active random foil twinkles without reintroducing hatch/sweep patterns. */
.foil-sparkle {
  animation-name: plFoilRandomTwinkle5 !important;
  filter:
    drop-shadow(0 0 2px rgba(255,255,255,1))
    drop-shadow(0 0 7px rgba(255,220,135,.56)) !important;
}
.foil-sparkle::before,
.foil-sparkle::after { opacity: .72; }
.card-preview .finish-effect-foil { opacity: 1 !important; }
.zoom-card-preview .foil-sparkle::before,
.zoom-card-preview .foil-sparkle::after { opacity: 1; }
@keyframes plFoilRandomTwinkle5 {
  0%, 10%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(.12) rotate(0deg); }
  14% { opacity: .38; transform: translate(-50%, -50%) scale(.72) rotate(18deg); }
  17% { opacity: 1; transform: translate(-50%, -50%) scale(1.38) rotate(45deg); }
  20% { opacity: .08; transform: translate(-50%, -50%) scale(.58) rotate(72deg); }
  39% { opacity: 0; transform: translate(-50%, -50%) scale(.18) rotate(95deg); }
  44% { opacity: .50; transform: translate(-50%, -50%) scale(.94) rotate(130deg); }
  47% { opacity: .95; transform: translate(-50%, -50%) scale(1.20) rotate(155deg); }
  51% { opacity: 0; transform: translate(-50%, -50%) scale(.32) rotate(185deg); }
  72% { opacity: 0; transform: translate(-50%, -50%) scale(.14) rotate(210deg); }
  77% { opacity: .74; transform: translate(-50%, -50%) scale(1.05) rotate(250deg); }
  81% { opacity: 0; transform: translate(-50%, -50%) scale(.25) rotate(285deg); }
}
@media (prefers-reduced-motion: reduce) {
  .card-preview .finish-effect-holo,
  .card-preview .finish-effect-holo::before,
  .card-preview .finish-effect-holo::after,
  .zoom-card-preview .finish-effect-holo,
  .zoom-card-preview .finish-effect-holo::before,
  .zoom-card-preview .finish-effect-holo::after,
  .foil-sparkle {
    animation-duration: 48s !important;
  }
}


/* v=binder-holo-prism-glints-fx-6
   Holo: replace the broad translucent sheet with subtle iridescent prism glints and a faint angled sheen.
   Foil: keep the random white/gold twinkles, but add a little more twinkle density. */
.card-preview .finish-effect-holo,
.zoom-card-preview .finish-effect-holo {
  opacity: 1 !important;
  mix-blend-mode: screen !important;
  background:
    linear-gradient(116deg,
      transparent 0 28%,
      rgba(255, 42, 215, .00) 34%,
      rgba(255, 42, 215, .095) 39%,
      rgba(42, 235, 255, .115) 44%,
      rgba(255, 235, 86, .082) 48%,
      rgba(120, 82, 255, .092) 52%,
      rgba(55, 255, 190, .062) 57%,
      transparent 66% 100%),
    conic-gradient(from 215deg at 52% 48%,
      rgba(255, 55, 218, .030) 0deg,
      rgba(55, 235, 255, .055) 65deg,
      rgba(255, 236, 88, .040) 128deg,
      rgba(128, 88, 255, .052) 190deg,
      rgba(48, 255, 190, .036) 252deg,
      rgba(255, 55, 218, .030) 360deg);
  background-size: 260% 260%, 190% 190%;
  background-position: -20% 48%, 50% 50%;
  background-blend-mode: screen;
  filter: saturate(2.9) brightness(1.04) contrast(1.03);
  animation: plHoloPrismGlintDrift6 18s ease-in-out infinite alternate !important;
}
.card-preview .finish-effect-holo::before,
.zoom-card-preview .finish-effect-holo::before {
  opacity: .18 !important;
  mix-blend-mode: color-dodge !important;
  background:
    linear-gradient(112deg,
      transparent 0 39%,
      rgba(255,255,255,.00) 42%,
      rgba(255, 70, 220, .26) 45%,
      rgba(40, 235, 255, .30) 48%,
      rgba(255, 238, 100, .21) 51%,
      rgba(120, 88, 255, .18) 54%,
      rgba(255,255,255,.08) 57%,
      transparent 62% 100%);
  background-size: 250% 250%;
  background-position: -70% 50%;
  filter: saturate(2.4) brightness(1.10) blur(.08px);
  animation: plHoloPrismSheenPass6 12s ease-in-out infinite !important;
}
.card-preview .finish-effect-holo::after,
.zoom-card-preview .finish-effect-holo::after {
  opacity: .12 !important;
  mix-blend-mode: screen !important;
  background:
    radial-gradient(ellipse at 18% 24%, rgba(255,54,218,.12), transparent 30%),
    radial-gradient(ellipse at 78% 62%, rgba(52,232,255,.13), transparent 34%),
    radial-gradient(ellipse at 42% 82%, rgba(255,236,90,.09), transparent 32%);
  background-size: 120% 120%, 135% 135%, 140% 140%;
  animation: plHoloSoftColorBreath6 22s ease-in-out infinite alternate !important;
}
.zoom-card-preview .finish-effect-holo::before { opacity: .24 !important; }
.zoom-card-preview .finish-effect-holo::after { opacity: .16 !important; }

.holo-prism-glint {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--w);
  height: var(--h);
  border-radius: 999px;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transform: translate(-50%, -50%) rotate(var(--r)) scale(.22);
  transform-origin: 50% 50%;
  mix-blend-mode: screen;
  background:
    linear-gradient(90deg,
      transparent 0%,
      var(--c1) 18%,
      rgba(255,255,255,.78) 43%,
      var(--c2) 62%,
      var(--c3) 78%,
      transparent 100%);
  box-shadow:
    0 0 4px rgba(255,255,255,.42),
    0 0 10px rgba(80,225,255,.22),
    0 0 12px rgba(255,70,220,.16);
  filter: saturate(2.4) brightness(1.12);
  animation: plHoloPrismGlint6 var(--dur) ease-in-out var(--delay) infinite;
}
.holo-prism-glint::before,
.holo-prism-glint::after {
  content: "";
  position: absolute;
  inset: 45% -35%;
  border-radius: 999px;
  background: inherit;
  opacity: .28;
  transform: rotate(62deg);
}
.holo-prism-glint::after {
  opacity: .20;
  transform: rotate(-58deg);
}
.zoom-card-preview .holo-prism-glint {
  filter: saturate(2.8) brightness(1.18);
  box-shadow:
    0 0 5px rgba(255,255,255,.52),
    0 0 14px rgba(80,225,255,.30),
    0 0 18px rgba(255,70,220,.20);
}

.foil-sparkle {
  animation-duration: max(1.7s, calc(var(--dur) * .82)) !important;
}

@keyframes plHoloPrismGlint6 {
  0%, 11%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(var(--r)) scale(.18);
  }
  16% {
    opacity: .34;
    transform: translate(-50%, -50%) rotate(calc(var(--r) + 4deg)) scale(.72);
  }
  19% {
    opacity: .74;
    transform: translate(-50%, -50%) rotate(calc(var(--r) + 9deg)) scale(1.08);
  }
  24% {
    opacity: .10;
    transform: translate(-50%, -50%) rotate(calc(var(--r) + 16deg)) scale(.58);
  }
  54% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(calc(var(--r) + 30deg)) scale(.20);
  }
  71% {
    opacity: .28;
    transform: translate(-50%, -50%) rotate(calc(var(--r) - 7deg)) scale(.82);
  }
  76% {
    opacity: .58;
    transform: translate(-50%, -50%) rotate(calc(var(--r) - 13deg)) scale(1.0);
  }
  82% {
    opacity: 0;
    transform: translate(-50%, -50%) rotate(calc(var(--r) - 20deg)) scale(.34);
  }
}
@keyframes plHoloPrismGlintDrift6 {
  0% {
    background-position: -24% 48%, 50% 50%;
    filter: hue-rotate(0deg) saturate(2.7) brightness(1.035) contrast(1.03);
  }
  45% {
    background-position: 48% 50%, 57% 45%;
    filter: hue-rotate(14deg) saturate(3.1) brightness(1.055) contrast(1.035);
  }
  100% {
    background-position: 118% 52%, 44% 57%;
    filter: hue-rotate(-18deg) saturate(2.9) brightness(1.045) contrast(1.03);
  }
}
@keyframes plHoloPrismSheenPass6 {
  0%, 100% { opacity: .08; background-position: -90% 50%; }
  38% { opacity: .22; background-position: 32% 50%; }
  62% { opacity: .12; background-position: 108% 50%; }
}
@keyframes plHoloSoftColorBreath6 {
  0% { opacity: .08; transform: translate3d(-.4%, -.2%, 0) scale(1.01); filter: hue-rotate(0deg); }
  52% { opacity: .15; transform: translate3d(.28%, .18%, 0) scale(1.016); filter: hue-rotate(24deg); }
  100% { opacity: .10; transform: translate3d(-.12%, .35%, 0) scale(1.012); filter: hue-rotate(-16deg); }
}
@media (prefers-reduced-motion: reduce) {
  .holo-prism-glint,
  .card-preview .finish-effect-holo,
  .card-preview .finish-effect-holo::before,
  .card-preview .finish-effect-holo::after,
  .zoom-card-preview .finish-effect-holo,
  .zoom-card-preview .finish-effect-holo::before,
  .zoom-card-preview .finish-effect-holo::after,
  .foil-sparkle {
    animation-duration: 50s !important;
  }
}


/* v=binder-zoom-info-cleanup-7
   Cleaner zoom inspector: less repeated metadata, conditional finish/signature,
   friendlier art names, tag box, and safer modal margins. */
.zoom-modal-backdrop {
  padding: 32px !important;
  place-items: center !important;
}
.zoom-modal {
  width: min(1220px, calc(100vw - 64px)) !important;
  max-height: calc(100vh - 64px) !important;
  margin: 0 auto !important;
  padding: 18px !important;
}
.zoom-head-clean {
  justify-content: flex-end !important;
  align-items: center !important;
  min-height: 0 !important;
  margin-bottom: 14px !important;
  padding: 0 !important;
  background: transparent !important;
  backdrop-filter: none !important;
}
.zoom-title-sr {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.zoom-actions {
  padding: 0 4px 0 0 !important;
}
.zoom-info-title .eyebrow {
  display: inline-block;
  margin-bottom: 8px;
  padding: 4px 8px;
  border: 1px solid rgba(230,184,71,.25);
  border-radius: 999px;
  background: rgba(230,184,71,.10);
  color: var(--gold);
}
.zoom-info-title h3 {
  margin-bottom: 6px !important;
}
.zoom-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.zoom-detail-wide {
  grid-column: 1 / -1;
}
.zoom-tag-detail strong {
  display: inline-flex;
  margin: 6px 6px 0 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 9px;
  color: var(--text);
  background: rgba(0,0,0,.22);
  font-size: 12px;
  font-weight: 850;
  word-break: normal;
}
.zoom-tag-detail .zoom-tags {
  margin-top: 0;
}
.zoom-tip {
  margin: 0;
}
.variant-stack .card-name {
  min-height: 1.2em;
}
@media (max-width: 860px) {
  .zoom-modal-backdrop { padding: 14px !important; }
  .zoom-modal {
    width: calc(100vw - 28px) !important;
    max-height: calc(100vh - 28px) !important;
    padding: 14px !important;
  }
  .zoom-head-clean { align-items: stretch !important; }
  .zoom-actions { justify-content: stretch !important; padding: 0 !important; }
  .zoom-detail-grid { grid-template-columns: 1fr; }
}

/* Binder variant performance + clearer metadata pass */
.variant-owned-serials span {
  color: var(--text);
  font-weight: 750;
}
.variant-stack .card-meta.variant-owned-serials {
  color: var(--text);
}
#variantModal.is-reordering .finish-effect,
#binderGrid.is-reordering .finish-effect {
  opacity: .08 !important;
  animation-play-state: paused !important;
}
#variantModal.is-reordering .foil-sparkle,
#variantModal.is-reordering .holo-prism-glint,
#binderGrid.is-reordering .foil-sparkle,
#binderGrid.is-reordering .holo-prism-glint {
  animation-play-state: paused !important;
}


/* v=player-dashboard-locks-9
   Player dashboard, expanded Binder filters, set completion, and visual lock badges. */
.player-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.player-stat-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
  padding: 14px;
  min-height: 112px;
  display: grid;
  align-content: start;
  gap: 5px;
}
.player-stat-card span { color: var(--muted); font-size: 12px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.player-stat-card strong { font-size: 30px; line-height: 1; letter-spacing: -.04em; }
.player-stat-card em { color: var(--muted); font-size: 12px; font-style: normal; }
.dashboard-split { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(270px, .65fr); gap: 14px; }
.dashboard-panel { margin: 0; }
.mini-head { display: grid; gap: 2px; margin-bottom: 12px; }
.mini-head h3 { margin: 0; }
.set-progress-list { display: grid; gap: 10px; }
.set-progress-card {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 12px;
  background: rgba(0,0,0,.22);
}
.set-progress-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; margin-bottom: 8px; }
.set-progress-head span { color: var(--muted); font-weight: 800; font-size: 12px; }
.progress-track {
  height: 9px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.10);
  margin-bottom: 7px;
}
.progress-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--purple), var(--blue), var(--gold));
  box-shadow: 0 0 22px rgba(100,216,255,.28);
}
.shortcut-list { display: grid; gap: 8px; }
.shortcut-list button { width: 100%; justify-content: flex-start; text-align: left; }
.binder-dashboard-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin: -2px 0 12px;
}
.binder-mini-stats { display: flex; gap: 8px; flex-wrap: wrap; color: var(--muted); }
.binder-mini-stats span {
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(0,0,0,.23);
  padding: 5px 9px;
  font-size: 12px;
}
.binder-mini-stats strong { color: var(--text); }
.filters.binder-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) repeat(auto-fit, minmax(132px, .7fr));
  align-items: end;
  justify-content: stretch;
  margin: 0 0 14px;
}
.compact-label { gap: 5px; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.compact-label input, .compact-label select { padding: 10px 11px; min-height: 40px; }
.lock-pill {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 31;
  border: 1px solid rgba(100,216,255,.62);
  color: #dff8ff;
  background: rgba(0,0,0,.58);
  border-radius: 999px;
  padding: 4px 8px;
  font-weight: 950;
  font-size: 12px;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(0,0,0,.42), 0 0 20px rgba(100,216,255,.18);
  backdrop-filter: blur(10px);
  pointer-events: none;
}
.copy-stack.is-locked .card-tile {
  border-color: rgba(100,216,255,.42);
  box-shadow: 0 0 0 2px rgba(100,216,255,.10), 0 20px 44px rgba(0,0,0,.28);
}
.zoom-detail-lock {
  border-color: rgba(100,216,255,.42);
  background: rgba(100,216,255,.08);
}
@media (max-width: 840px) {
  .dashboard-split { grid-template-columns: 1fr; }
  .filters.binder-filters { grid-template-columns: 1fr; }
  .binder-dashboard-row { flex-direction: column; align-items: stretch; }
}


/* v=player-live-card-locks-11
   Player Binder cleanup:
   - Binder title simplified.
   - Binder filter controls use a real responsive grid so labels/selects do not collide.
   - Set labels stay name-first; numeric series IDs are hidden from the player UI. */
.filters.binder-filters {
  display: grid !important;
  grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(150px, 1fr)) !important;
  gap: 12px 14px !important;
  align-items: end !important;
  justify-content: stretch !important;
}
.filters.binder-filters .compact-label {
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: start !important;
  gap: 6px !important;
  min-width: 0 !important;
  width: 100% !important;
  white-space: nowrap;
}
.filters.binder-filters .compact-label input,
.filters.binder-filters .compact-label select {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
@media (max-width: 1040px) {
  .filters.binder-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  .filters.binder-filters {
    grid-template-columns: 1fr !important;
  }
}


/* v=player-lock-serial-tooltips-12
   Show exactly which owned serials are locked, especially inside variant stacks. */
.lock-pill {
  pointer-events: auto !important;
  cursor: help;
}
.variant-stack .lock-pill {
  top: 10px;
  left: 10px;
  padding: 5px 7px;
  font-size: 13px;
}
.variant-locked-serials {
  display: grid !important;
  gap: 5px;
  color: var(--text) !important;
}
.variant-locked-serials strong {
  color: #dff8ff;
  font-size: 12px;
  letter-spacing: .02em;
}
.locked-serial-list {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.locked-serial-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  border: 1px solid rgba(100,216,255,.42);
  border-radius: 999px;
  background: rgba(100,216,255,.10);
  color: #ecfbff;
  padding: 3px 7px;
  font-size: 11px;
  font-weight: 900;
  cursor: help;
}
.locked-serial-pill::before {
  content: "🔒";
  font-size: 10px;
}
.locked-serial-pill em {
  color: var(--muted);
  font-style: normal;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.zoom-detail-lock strong {
  white-space: pre-wrap;
}

/* v=player-sl-profile-button-190
   Creator profile links shown inside zoomed card detail view. */
.zoom-social-block {
  margin: 10px 0 14px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
}
.zoom-social-block > span {
  display: block;
  margin: 0 0 8px;
  color: var(--muted, #aeb6c8);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
}
.zoom-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.zoom-social-link {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(11, 16, 28, .76);
  color: #f6f8ff;
  text-decoration: none;
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
}
.zoom-social-link:hover,
.zoom-social-link:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.34);
  background: rgba(36, 48, 76, .86);
}
.zoom-social-link img {
  width: 28px;
  height: 28px;
  object-fit: contain;
  border-radius: 7px;
  display: block;
}

.zoom-social-secondlife img {
  border-radius: 9px;
  filter: drop-shadow(0 0 8px rgba(120, 235, 255, .25));
}
.zoom-social-link em,
.zoom-social-link strong {
  font-style: normal;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.zoom-social-secondlife strong,
.zoom-social-website strong {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  font-size: 11px;
  letter-spacing: .04em;
}
@media (max-width: 760px) {
  .zoom-social-link { flex: 1 1 calc(50% - 8px); justify-content: center; }
}

/* v=player-finish-inset-191
   Keep browser-side Holo/Foil effects inside the printed card bounds.
   The card art/frame layers stay full-size; only the animated finish layer is
   inset slightly so glow/drop-shadow/glint pixels do not bleed past the edge. */
.card-preview,
.zoom-card-preview,
.zoom-card-stage .card-preview {
  overflow: hidden !important;
  isolation: isolate;
}
.card-preview .finish-effect,
.zoom-card-preview .finish-effect {
  inset: 2.15% !important;
  width: auto !important;
  height: auto !important;
  border-radius: 17px !important;
  clip-path: inset(0 round 17px);
  transform: translateZ(0) scale(.985) !important;
  transform-origin: 50% 50% !important;
}
.zoom-card-preview .finish-effect,
.zoom-card-stage .card-preview .finish-effect {
  inset: 3.05% !important;
  border-radius: 20px !important;
  clip-path: inset(0 round 20px);
  transform: translateZ(0) scale(.975) !important;
}
.card-preview .finish-effect::before,
.card-preview .finish-effect::after,
.zoom-card-preview .finish-effect::before,
.zoom-card-preview .finish-effect::after {
  inset: -10% !important;
}
.card-preview .foil-sparkle,
.card-preview .holo-prism-glint,
.zoom-card-preview .foil-sparkle,
.zoom-card-preview .holo-prism-glint {
  max-width: 18% !important;
  max-height: 18% !important;
}


/* v=player-finish-layer-order-192
   Prefer layered web cards for Holo/Foil so the finish sits under the overlay.
   Composite fallback gets a stronger safe-zone crop because no overlay layer is
   available above it to hide the animated effect at the outside card edge. */
.card-preview.layered-web-card .finish-effect,
.zoom-card-preview.layered-web-card .finish-effect {
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  border-radius: inherit !important;
  clip-path: none !important;
  transform: translateZ(0) !important;
}
.card-preview.composite-finish-card .finish-effect {
  inset: 6.6% 6.8% 6.8% 6.8% !important;
  width: auto !important;
  height: auto !important;
  border-radius: 24px !important;
  clip-path: inset(0 round 24px) !important;
  transform: translateZ(0) scale(.99) !important;
}
.zoom-card-preview.composite-finish-card .finish-effect,
.zoom-card-stage .card-preview.composite-finish-card .finish-effect {
  inset: 6.9% 6.85% 6.9% 6.85% !important;
  border-radius: 28px !important;
  clip-path: inset(0 round 28px) !important;
  transform: translateZ(0) scale(.99) !important;
}
.zoom-card-stage .card-preview.finish-holo,
.zoom-card-stage .card-preview.finish-foil {
  box-shadow: 0 30px 72px rgba(0,0,0,.55) !important;
}


/* v=player-finish-safe-mask-193
   The previous layered-card fix restored correct art → finish → overlay order,
   but it also let the browser-generated finish layer occupy the full card.
   Crop the animated finish to a slightly smaller safe zone and clip its pseudo
   glints so the Holo/Foil effect cannot spill over the printed card frame. */
.card-preview .finish-effect,
.zoom-card-preview .finish-effect,
.zoom-card-stage .card-preview .finish-effect {
  overflow: hidden !important;
  contain: paint;
}
.card-preview.layered-web-card .finish-effect,
.zoom-card-preview.layered-web-card .finish-effect,
.zoom-card-stage .card-preview.layered-web-card .finish-effect {
  inset: 6.35% 6.55% 6.45% 6.55% !important;
  width: auto !important;
  height: auto !important;
  border-radius: 18px !important;
  clip-path: inset(0 round 18px) !important;
  transform: translateZ(0) scale(.992) !important;
  transform-origin: 50% 50% !important;
}
.zoom-card-preview.layered-web-card .finish-effect,
.zoom-card-stage .card-preview.layered-web-card .finish-effect {
  inset: 6.7% 6.75% 6.9% 6.75% !important;
  border-radius: 22px !important;
  clip-path: inset(0 round 22px) !important;
}
.card-preview.layered-web-card .finish-effect::before,
.card-preview.layered-web-card .finish-effect::after,
.zoom-card-preview.layered-web-card .finish-effect::before,
.zoom-card-preview.layered-web-card .finish-effect::after,
.zoom-card-stage .card-preview.layered-web-card .finish-effect::before,
.zoom-card-stage .card-preview.layered-web-card .finish-effect::after {
  inset: 0 !important;
}

/* v=player-finish-pseudo-layer-kill-194
   The legacy browser fallback used ::after on .finish-holo/.finish-foil across
   the entire card. That layer ignores the newer safe-zone mask and is what made
   Holo/Foil appear to spill across the frame. Keep the explicit .finish-effect
   layer only, where it can be masked and ordered under the overlay. */
.card-preview.finish-foil::after,
.card-preview.finish-holo::after,
.zoom-card-preview.finish-foil::after,
.zoom-card-preview.finish-holo::after,
.zoom-card-stage .card-preview.finish-foil::after,
.zoom-card-stage .card-preview.finish-holo::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  background: none !important;
}

/* Keep the actual animated finish effect inside the inner printed-art safe zone. */
.card-preview.layered-web-card .finish-effect,
.card-preview.composite-finish-card .finish-effect,
.zoom-card-preview.layered-web-card .finish-effect,
.zoom-card-preview.composite-finish-card .finish-effect,
.zoom-card-stage .card-preview.layered-web-card .finish-effect,
.zoom-card-stage .card-preview.composite-finish-card .finish-effect {
  inset: 7.25% 7.15% 10.65% 7.15% !important;
  width: auto !important;
  height: auto !important;
  border-radius: 10px !important;
  clip-path: inset(0 round 10px) !important;
  overflow: hidden !important;
  contain: paint;
  transform: translateZ(0) !important;
}
.card-preview.layered-web-card .finish-effect::before,
.card-preview.layered-web-card .finish-effect::after,
.card-preview.composite-finish-card .finish-effect::before,
.card-preview.composite-finish-card .finish-effect::after,
.zoom-card-preview.layered-web-card .finish-effect::before,
.zoom-card-preview.layered-web-card .finish-effect::after,
.zoom-card-preview.composite-finish-card .finish-effect::before,
.zoom-card-preview.composite-finish-card .finish-effect::after,
.zoom-card-stage .card-preview.layered-web-card .finish-effect::before,
.zoom-card-stage .card-preview.layered-web-card .finish-effect::after,
.zoom-card-stage .card-preview.composite-finish-card .finish-effect::before,
.zoom-card-stage .card-preview.composite-finish-card .finish-effect::after {
  inset: 0 !important;
}

/* v=player-transparent-image-stage-195
   Real card PNGs have transparent rounded-card corners. The older .card-art
   placeholder gradient was showing through those transparent pixels and looked
   like the Holo/Foil layer was spilling outside the card. For image-backed
   previews, the stage behind the image must be transparent/neutral; keep the
   purple gradient only for true no-image placeholders. */
.card-art.card-preview.has-image,
.card-art.card-preview.has-image.layered-web-card,
.card-art.card-preview.has-image.composite-web-card,
.card-art.card-preview.has-image.sl-fallback,
.zoom-card-stage .card-art.card-preview.has-image {
  background: transparent !important;
  background-color: transparent !important;
}
.card-art.card-preview.has-image::before,
.card-art.card-preview.has-image::after,
.zoom-card-stage .card-art.card-preview.has-image::before,
.zoom-card-stage .card-art.card-preview.has-image::after {
  background-color: transparent !important;
}
/* Remove the extra purple outer glow on zoomed finish cards; the finish is now
   represented by the masked in-card finish layer only. */
.zoom-card-stage .card-preview.finish-holo,
.zoom-card-stage .card-preview.finish-foil {
  box-shadow: 0 30px 72px rgba(0,0,0,.55) !important;
}

/* v=player-image-stage-outline-kill-196
   Image-backed card textures can have transparent/nonfilled edge pixels. Do not
   draw a separate preview-stage outline around them, because that makes the
   texture bounds visible. The card image itself should define the card edge. */
.card-art.card-preview.has-image,
.card-art.card-preview.has-image.layered-web-card,
.card-art.card-preview.has-image.composite-web-card,
.card-art.card-preview.has-image.sl-fallback,
.zoom-card-stage .card-art.card-preview.has-image,
.zoom-card-stage .card-preview.has-image,
.zoom-card-stage .card-preview.has-image.finish-holo,
.zoom-card-stage .card-preview.has-image.finish-foil {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

.zoom-card-stage .card-preview.has-image,
.zoom-card-stage .card-art.card-preview.has-image {
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* v=player-deck-legality-198 */
.deck-builder-head { align-items: center; }
.deck-head-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.deck-layout { display: grid; grid-template-columns: minmax(190px, 260px) minmax(0, 1fr); gap: 16px; align-items: start; }
.deck-sidebar, .deck-editor-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(0,0,0,.18);
  padding: 14px;
}
.deck-sidebar h3, .deck-editor-card h3 { margin: 0 0 10px; }
.deck-slot-list { display: grid; gap: 9px; }
.deck-slot-btn {
  width: 100%;
  min-height: 74px;
  text-align: left;
  display: grid;
  gap: 4px;
  align-content: center;
  border-radius: 16px;
}
.deck-slot-btn strong { font-size: 15px; }
.deck-slot-btn span { color: var(--muted); font-size: 12px; font-weight: 800; }
.deck-slot-btn.active { border-color: rgba(100,216,255,.78); box-shadow: 0 0 0 3px rgba(100,216,255,.12); }
.deck-slot-btn.valid { border-color: rgba(130,231,171,.46); }
.deck-slot-btn.invalid { border-color: rgba(255,209,102,.48); }
.deck-editor-toolbar { display: flex; gap: 10px; align-items: end; flex-wrap: wrap; margin-bottom: 12px; }
.deck-name-label { flex: 1 1 240px; }
.deck-count-pill {
  min-height: 50px;
  min-width: 110px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255,255,255,.045);
  padding: 8px 11px;
  display: grid;
  gap: 2px;
  align-content: center;
}
.deck-count-pill span { font-weight: 950; color: var(--text); }
.deck-count-pill em { font-style: normal; font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.deck-count-pill.valid em { color: var(--good); }
.deck-count-pill.invalid em { color: var(--warn); }
button.danger-lite { border-color: rgba(255,127,145,.45); color: #ffd7dc; background: rgba(90,37,48,.35); }
.deck-issues { display: grid; gap: 6px; margin: 8px 0 14px; }
.deck-issue { border: 1px solid rgba(255,209,102,.42); border-radius: 12px; background: rgba(255,209,102,.08); color: var(--warn); padding: 8px 10px; font-size: 12px; font-weight: 800; }
.deck-issue.error { border-color: rgba(255,127,145,.48); background: rgba(255,127,145,.09); color: var(--bad); }
.deck-issue.warning { border-color: rgba(255,209,102,.42); background: rgba(255,209,102,.08); color: var(--warn); }
.deck-issue.good { border-color: rgba(130,231,171,.44); background: rgba(130,231,171,.08); color: var(--good); }
.deck-builder-columns { display: grid; grid-template-columns: minmax(300px, .95fr) minmax(340px, 1.05fr); gap: 14px; }
.deck-list-panel, .deck-collection-panel { min-width: 0; }
.mini-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; margin-bottom: 10px; }
.mini-head h3 { margin: 0; }
.deck-card-list, .deck-collection-grid { display: grid; gap: 9px; }
.deck-card-row, .deck-add-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255,255,255,.04);
  padding: 8px;
}
.deck-card-row.invalid { border-color: rgba(255,127,145,.52); background: rgba(255,127,145,.08); }
.deck-card-thumb {
  width: 52px;
  aspect-ratio: 2.5 / 3.5;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.28);
  object-fit: cover;
  overflow: hidden;
}
.deck-card-thumb.placeholder { display: grid; place-items: center; color: var(--gold); font-weight: 950; }
.deck-card-info { min-width: 0; }
.deck-card-info strong { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.deck-card-info span { display: block; color: var(--muted); font-size: 12px; font-weight: 750; }
.deck-card-actions { display: flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }
.deck-card-actions button { min-height: 32px; padding: 6px 9px; border-radius: 10px; }
.deck-qty { color: var(--gold); font-weight: 950; min-width: 34px; text-align: center; }
.deck-search-row { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 8px; margin-bottom: 10px; }
.deck-collection-grid { max-height: 680px; overflow: auto; padding-right: 4px; }
.deck-add-row.disabled { opacity: .58; }
.deck-add-row .card-mini-meta { color: var(--muted); font-size: 12px; }
.deck-card-limit { color: var(--warn); }
@media (max-width: 1100px) {
  .deck-layout, .deck-builder-columns { grid-template-columns: 1fr; }
  .deck-slot-list { grid-template-columns: repeat(5, minmax(120px, 1fr)); }
}
@media (max-width: 760px) {
  .deck-slot-list, .deck-search-row { grid-template-columns: 1fr; }
  .deck-card-row, .deck-add-row { grid-template-columns: 44px minmax(0, 1fr); }
  .deck-card-actions { grid-column: 1 / -1; justify-content: flex-start; }
}


/* v=player-deck-layered-thumbs-200
   Deck Builder rows should preview the same visual stack as the Binder:
   art -> finish effect -> overlay -> signature. Keep the row thumbnail compact
   while letting the existing card preview renderer supply layers/effects. */
.deck-card-thumb.deck-card-preview-thumb {
  position: relative;
  display: block;
  padding: 0;
  background: transparent;
}
.deck-card-thumb.deck-card-preview-thumb .card-art.card-preview {
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
  border: 0 !important;
  border-radius: inherit;
  box-shadow: none !important;
}
.deck-card-thumb.deck-card-preview-thumb .card-layer {
  border-radius: inherit;
}
.deck-card-thumb.deck-card-preview-thumb .finish-effect {
  inset: 6.8% !important;
  border-radius: 7px !important;
  clip-path: inset(0 round 7px) !important;
}
.deck-card-thumb.deck-card-preview-thumb .foil-sparkle,
.deck-card-thumb.deck-card-preview-thumb .holo-prism-glint {
  max-width: 20% !important;
  max-height: 20% !important;
}

/* v=player-card-purchase-links-201
   Optional buy/location buttons for Prim and Attachment card zoom views. */
.zoom-purchase-block {
  border-color: rgba(156, 201, 255, .18);
  background: rgba(20, 35, 58, .42);
}
.zoom-purchase-marketplace strong,
.zoom-purchase-inworld strong {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
  font-size: 11px;
  letter-spacing: .04em;
}


/* v=player-salvage-economy-202 */
.salvage-head { align-items: flex-start; }
.salvage-stat-grid { display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:12px; margin:14px 0; }
.salvage-stat { border:1px solid var(--line); background:rgba(255,255,255,.035); border-radius:16px; padding:14px; display:flex; flex-direction:column; gap:3px; }
.salvage-stat strong { font-size:24px; }
.salvage-stat span { color:var(--muted); font-size:12px; }
.salvage-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:12px 0; }
.salvage-toolbar input { flex:1 1 260px; }
.salvage-preview-panel { border:1px solid var(--line); background:rgba(255,255,255,.035); border-radius:14px; padding:12px; margin:12px 0; }
.salvage-preview-panel.good { border-color:rgba(123,228,149,.4); color:#caffd4; }
.salvage-preview-panel.warn { border-color:rgba(255,209,102,.5); color:#ffe5a4; }
.salvage-copy-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap:14px; margin-top:14px; }
.salvage-copy-card { position:relative; border:1px solid var(--line); background:rgba(255,255,255,.035); border-radius:18px; padding:12px; display:flex; flex-direction:column; gap:10px; transition:border-color .15s ease, transform .15s ease, background .15s ease; }
.salvage-copy-card.selected { border-color:rgba(255,111,145,.75); background:rgba(255,111,145,.10); }
.salvage-copy-card:hover { transform: translateY(-1px); }
.salvage-select { display:flex; justify-content:flex-end; gap:6px; align-items:center; font-size:12px; color:var(--muted); }
.salvage-thumb { display:grid; place-items:center; }
.salvage-thumb .card-preview { width:min(100%, 160px); }
.salvage-copy-info { display:flex; flex-direction:column; gap:5px; }
.shard-pill { align-self:flex-start; border:1px solid rgba(100,216,255,.35); color:#cdefff; background:rgba(100,216,255,.08); border-radius:999px; padding:4px 8px; font-size:12px; }
button.danger { border-color:rgba(255,111,145,.55); color:#ffd6df; }
@media (max-width: 760px) { .salvage-stat-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* v=player-salvage-finish-economy-203
   Salvage cards are copy-specific, so make cosmetic identity visible even at
   small thumbnail sizes. */
.salvage-thumb { position: relative; }
.salvage-finish-badges {
  position: absolute;
  left: 50%;
  bottom: 6px;
  transform: translateX(-50%);
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: center;
  pointer-events: none;
  z-index: 8;
}
.salvage-finish-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  padding: 2px 6px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.40);
  background: rgba(9,10,18,.78);
  box-shadow: 0 0 14px rgba(0,0,0,.45);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.salvage-thumb .card-preview.finish-holo .finish-effect,
.salvage-thumb .card-preview.finish-foil .finish-effect {
  opacity: .82 !important;
}
.salvage-thumb .card-preview.finish-holo .finish-effect::before,
.salvage-thumb .card-preview.finish-foil .finish-effect::before {
  opacity: .50 !important;
}
.salvage-thumb .card-preview.finish-holo .finish-effect::after,
.salvage-thumb .card-preview.finish-foil .finish-effect::after {
  opacity: .36 !important;
}


/* v=public-polish-214 Player Area launch polish */
.top-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid var(--line2);
  border-radius: 12px;
  padding: 10px 13px;
  color: var(--text);
  text-decoration: none;
  background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.055));
}
.top-link:hover { border-color: rgba(100,216,255,.7); background: linear-gradient(180deg, rgba(100,216,255,.2), rgba(109,61,255,.14)); }
.global-shard-pill { margin-top: 6px; color: var(--gold); font-weight: 850; }
.salvage-warning-box {
  margin: -4px 0 14px;
  border: 1px solid rgba(255,209,102,.34);
  border-left: 4px solid var(--gold);
  border-radius: 18px;
  padding: 13px 14px;
  background: rgba(255,209,102,.075);
  color: var(--soft);
}
.salvage-warning-box strong { color: var(--gold); }
.panel-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.status.bad, .error-state, .notice.bad {
  border-color: rgba(255,127,145,.38);
}
@media (max-width: 820px) {
  .topbar { align-items: stretch; }
  .top-actions { justify-content: flex-start; }
  .top-actions button, .top-actions .top-link { flex: 1 1 140px; }
  .panel-head { display: grid; gap: 12px; }
  .panel-actions { justify-content: stretch; }
  .panel-actions button { flex: 1 1 160px; }
  .deck-editor-toolbar { grid-template-columns: 1fr !important; }
  .deck-builder-columns { grid-template-columns: 1fr !important; }
  .salvage-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 520px) {
  .salvage-stat-grid { grid-template-columns: 1fr !important; }
  .binder-grid, .deck-collection-grid, .salvage-copy-grid { grid-template-columns: 1fr !important; }
}

/* v=player-area-polish-224
   Unifies Binder / Decks / Salvage as one tighter player app. */
.app-view {
  width: min(1360px, 100%);
}
.topbar {
  position: sticky;
  top: 12px;
  z-index: 20;
  align-items: center;
}
.topbar h1 {
  font-size: clamp(28px, 3.5vw, 44px);
}
.global-shard-pill {
  display: inline-flex;
  align-items: center;
  width: max-content;
  min-height: 26px;
  margin-top: 8px;
  padding: 4px 10px;
  border: 1px solid rgba(230,184,71,.35);
  border-radius: 999px;
  background: rgba(230,184,71,.08);
  color: #ffe8a6;
  font-weight: 950;
}
.top-actions {
  padding: 4px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  background: rgba(0,0,0,.18);
}
.top-actions .tab,
.top-actions .top-link,
.top-actions #logoutBtn {
  border-radius: 14px;
  min-height: 38px;
  padding: 8px 11px;
}
.top-actions .tab.active {
  border-color: rgba(100,216,255,.84);
  box-shadow: inset 0 0 0 1px rgba(100,216,255,.18), 0 0 18px rgba(100,216,255,.10);
}
.panel {
  padding: clamp(16px, 2vw, 22px);
}
.panel-head {
  align-items: center;
}
.panel-head .muted,
.mini-head .muted {
  max-width: 58ch;
}
.mini-head p:empty {
  display: none;
}
.player-stat-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.player-stat-card {
  min-height: 104px;
  justify-content: center;
}
.player-stat-card em {
  display: none;
}
.dashboard-split {
  grid-template-columns: minmax(0, 1fr) minmax(230px, .42fr);
}
.shortcut-list {
  grid-template-columns: 1fr;
}
.shortcut-list button {
  min-height: 38px;
  padding: 8px 10px;
}
.binder-dashboard-row,
.binder-order-tools,
.deck-editor-toolbar,
.salvage-toolbar {
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 10px;
  background: rgba(0,0,0,.15);
}
.binder-order-tools {
  align-items: center;
}
.binder-order-status {
  flex: 1 1 260px;
}
.deck-layout {
  grid-template-columns: minmax(170px, 220px) minmax(0, 1fr);
}
.deck-sidebar,
.deck-editor-card,
.deck-list-panel,
.deck-collection-panel {
  border-color: rgba(255,255,255,.12);
}
.deck-builder-columns {
  grid-template-columns: minmax(360px, .92fr) minmax(360px, 1.08fr);
}
.deck-sidebar h3,
.deck-editor-card h3 {
  font-size: 15px;
}
.deck-slot-btn {
  min-height: 62px;
  padding: 10px 12px;
}
.deck-count-pill {
  min-height: 44px;
  min-width: 102px;
}
.deck-issues {
  margin: 6px 0 12px;
}
.deck-issue {
  padding: 7px 9px;
}
.deck-card-row,
.deck-add-row {
  grid-template-columns: 48px minmax(0, 1fr) auto;
  border-radius: 14px;
  padding: 7px;
}
.deck-card-thumb {
  width: 48px;
}
.deck-card-info strong {
  font-size: 13px;
}
.deck-card-info span {
  font-size: 11px;
}
.deck-card-actions {
  gap: 4px;
}
.deck-card-actions button {
  min-height: 30px;
  padding: 5px 8px;
  font-size: 12px;
}
.deck-collection-grid {
  max-height: min(70vh, 720px);
}
.salvage-warning-box {
  margin: -2px 0 12px;
  padding: 10px 12px;
  border-radius: 14px;
}
.salvage-stat-grid {
  grid-template-columns: repeat(4, minmax(120px, 1fr));
}
.salvage-stat {
  min-height: 88px;
  justify-content: center;
}
.salvage-stat strong {
  font-size: 28px;
}
.salvage-toolbar button {
  min-width: 120px;
}
.salvage-preview-panel {
  padding: 10px 12px;
}
.salvage-copy-grid {
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
}
.salvage-copy-card {
  border-radius: 16px;
  padding: 10px;
}
.salvage-select {
  justify-content: space-between;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  padding: 5px 9px;
  background: rgba(0,0,0,.16);
}
.salvage-thumb .card-preview {
  width: min(100%, 146px);
}
.shard-pill {
  color: #ffe8a6;
  border-color: rgba(230,184,71,.38);
  background: rgba(230,184,71,.08);
}
.status.good,
.status.warn,
.status.bad {
  font-weight: 850;
}
@media (max-width: 1180px) {
  .player-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .deck-layout,
  .deck-builder-columns,
  .dashboard-split { grid-template-columns: 1fr; }
  .deck-slot-list { grid-template-columns: repeat(5, minmax(110px, 1fr)); }
}
@media (max-width: 760px) {
  .topbar { position: static; }
  .top-actions { width: 100%; }
  .player-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .deck-slot-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .deck-card-row,
  .deck-add-row { grid-template-columns: 44px minmax(0, 1fr); }
  .deck-card-actions { grid-column: 1 / -1; justify-content: flex-start; }
  .salvage-stat-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 520px) {
  .player-stat-grid,
  .deck-slot-list,
  .salvage-stat-grid { grid-template-columns: 1fr !important; }
}

/* v=player-dashboard-desire-cleanup-225
   Cleaner player home dashboard: fewer stats, clickable locked state, compact set/quick filters. */
#homePanel .panel-head {
  margin-bottom: 12px;
}
#homePanel .panel-head h2 {
  font-size: clamp(28px, 3.8vw, 48px);
  letter-spacing: -.05em;
}
#homeStats.player-stat-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.player-stat-card.player-stat-button {
  color: var(--text);
  text-align: left;
  cursor: pointer;
  appearance: none;
  width: 100%;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.player-stat-card.player-stat-button:not(:disabled):hover,
.player-stat-card.player-stat-button:not(:disabled):focus-visible {
  transform: translateY(-1px);
  border-color: rgba(100,216,255,.55);
  background: linear-gradient(145deg, rgba(100,216,255,.13), rgba(255,255,255,.04));
  box-shadow: 0 12px 30px rgba(0,0,0,.24), 0 0 26px rgba(100,216,255,.12);
}
.player-stat-card.player-stat-button:disabled {
  cursor: default;
  opacity: .68;
}
.player-stat-card.player-stat-button em {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
}
.dashboard-lock-panel {
  margin: 0 0 14px;
  padding: 14px;
}
.dashboard-lock-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.dashboard-lock-head h3 {
  margin: 0;
}
.dashboard-lock-head button {
  min-height: 34px;
  padding: 7px 12px;
}
.dashboard-lock-list {
  display: grid;
  gap: 9px;
}
.dashboard-lock-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  background: rgba(0,0,0,.18);
  padding: 10px 12px;
}
.dashboard-lock-row strong {
  display: block;
  margin-bottom: 2px;
}
.dashboard-lock-row p {
  margin: 0 0 7px;
}
.dashboard-lock-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.set-progress-card.set-progress-button {
  display: block;
  width: 100%;
  color: var(--text);
  text-align: left;
  cursor: pointer;
  appearance: none;
}
.set-progress-card.set-progress-button:hover,
.set-progress-card.set-progress-button:focus-visible {
  border-color: rgba(100,216,255,.45);
  background: rgba(100,216,255,.08);
}
#homeShortcuts.shortcut-list {
  gap: 10px;
}
#homeShortcuts.shortcut-list button {
  min-height: 44px;
  border-radius: 15px;
  font-weight: 800;
}
#homeShortcuts button[data-shortcut-finish="holo"]::after,
#homeShortcuts button[data-shortcut-finish="foil"]::after {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  margin-left: auto;
  background: var(--gold);
  box-shadow: 0 0 16px rgba(240,207,108,.55);
}
@media (max-width: 980px) {
  #homeStats.player-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  #homeStats.player-stat-grid { grid-template-columns: 1fr; }
  .dashboard-lock-row { grid-template-columns: 1fr; }
  .dashboard-lock-row > button { justify-self: start; }
}


/* v=player-signature-easter-226: signatures are treated as an owned-card surprise, not a missing checklist slot. */
.signature-easter-filter[hidden] { display: none !important; }

/* v=player-dashboard-cleanup-230
   Player-facing dashboard polish: unique-first stats, highlights, friendlier collection wording. */
#homePanel .panel-head .eyebrow::after {
  content: none;
}
#homeStats.player-stat-grid {
  margin-bottom: 14px;
}
.player-stat-card.player-stat-button:first-child {
  background: linear-gradient(145deg, rgba(100,216,255,.16), rgba(255,255,255,.035));
  border-color: rgba(100,216,255,.34);
}
.player-stat-card.player-stat-button strong {
  font-size: clamp(30px, 4.4vw, 42px);
}
.player-stat-card.player-stat-button span {
  color: rgba(255,255,255,.72);
}
.dashboard-feature-panel {
  margin: 0 0 14px;
  padding: 14px;
  overflow: hidden;
}
.dashboard-feature-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}
.dashboard-feature-head p {
  margin: 3px 0 0;
}
.dashboard-highlight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.dashboard-highlight-card {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 118px;
  padding: 10px;
  color: var(--text);
  text-align: left;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(0,0,0,.17));
  cursor: pointer;
  overflow: hidden;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.dashboard-highlight-card:hover,
.dashboard-highlight-card:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(240,207,108,.45);
  background: linear-gradient(145deg, rgba(240,207,108,.12), rgba(100,216,255,.07));
  box-shadow: 0 14px 32px rgba(0,0,0,.25), 0 0 26px rgba(240,207,108,.10);
}
.dashboard-highlight-preview {
  width: 76px;
  aspect-ratio: 5 / 7;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 22px rgba(0,0,0,.34);
}
.dashboard-highlight-preview .card-preview {
  min-height: 0;
  height: 100%;
  border-radius: 12px;
}
.dashboard-highlight-preview .card-art.no-image {
  min-height: 100%;
}
.dashboard-highlight-body {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.dashboard-highlight-body strong,
.dashboard-highlight-body span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-highlight-body strong {
  font-size: 14px;
  letter-spacing: -.02em;
}
.dashboard-highlight-body span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}
.dashboard-highlight-badges {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.dashboard-highlight-badges em {
  font-style: normal;
  font-size: 10px;
  font-weight: 900;
  color: rgba(255,255,255,.82);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  padding: 3px 6px;
  background: rgba(255,255,255,.06);
}
.set-progress-head span {
  text-align: right;
}
#homeShortcuts button[data-shortcut-view="duplicates"]::after {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  margin-left: auto;
  background: var(--purple);
  box-shadow: 0 0 16px rgba(173,113,255,.45);
}
@media (max-width: 1180px) {
  .dashboard-highlight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .dashboard-highlight-grid { grid-template-columns: 1fr; }
  .dashboard-highlight-card { grid-template-columns: 66px minmax(0, 1fr); min-height: 104px; }
  .dashboard-highlight-preview { width: 66px; }
}


/* v=player-dashboard-polish-233
   Cache-busted polish: no duplicate eyebrow, clearer finish counts, featured-card hero, and set action buttons. */
#homePanel .panel-head .eyebrow::after {
  content: none;
}
.dashboard-feature-head h3 {
  font-size: 22px;
  letter-spacing: -.02em;
}
.dashboard-highlight-grid {
  grid-template-columns: minmax(320px, 1.35fr) repeat(3, minmax(180px, .85fr));
  align-items: stretch;
}
.dashboard-highlight-card.is-featured {
  grid-template-columns: 126px minmax(0, 1fr);
  min-height: 178px;
  padding: 14px;
  border-color: rgba(240,207,108,.34);
  background:
    radial-gradient(circle at 18% 18%, rgba(240,207,108,.18), transparent 42%),
    linear-gradient(145deg, rgba(100,216,255,.12), rgba(255,255,255,.045));
}
.dashboard-highlight-card.is-featured .dashboard-highlight-preview {
  width: 126px;
  border-radius: 15px;
}
.dashboard-highlight-card.is-featured .dashboard-highlight-preview .card-preview {
  border-radius: 15px;
}
.dashboard-highlight-card.is-featured .dashboard-highlight-body {
  gap: 6px;
}
.dashboard-highlight-body small {
  color: var(--gold);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.dashboard-highlight-card.is-featured .dashboard-highlight-body strong {
  font-size: 18px;
}
.dashboard-highlight-card.is-featured .dashboard-highlight-body span {
  font-size: 13px;
}
.set-progress-with-actions {
  display: grid;
  gap: 8px;
}
.set-progress-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 3px;
}
.set-progress-actions button {
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
}
.set-progress-actions button:first-child {
  border-color: rgba(100,216,255,.48);
}
#homeShortcuts.shortcut-list button {
  display: flex;
  align-items: center;
}
#homeShortcuts button[data-shortcut-view="all"]::after,
#homeShortcuts button[data-home-action="locks"]::after {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  margin-left: auto;
  background: var(--blue);
  box-shadow: 0 0 16px rgba(100,216,255,.45);
}
@media (max-width: 1180px) {
  .dashboard-highlight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-highlight-card.is-featured { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .dashboard-highlight-grid { grid-template-columns: 1fr; }
  .dashboard-highlight-card.is-featured { grid-template-columns: 92px minmax(0, 1fr); min-height: 132px; }
  .dashboard-highlight-card.is-featured .dashboard-highlight-preview { width: 92px; }
  .set-progress-actions { display: grid; grid-template-columns: 1fr; }
}

/* v=player-binder-polish-234
   Player Binder polish: quick chips, clearer collection language, richer card tiles, and less admin-feeling controls. */
.binder-panel-head {
  align-items: center;
}
.binder-panel-head .eyebrow {
  margin-bottom: 4px;
}
.binder-head-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.binder-quick-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 12px;
}
.binder-chip {
  min-height: 38px;
  padding: 7px 10px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft);
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.13);
  font-size: 13px;
  font-weight: 850;
}
.binder-chip strong {
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  color: var(--text);
  background: rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.10);
  font-size: 12px;
}
.binder-chip.active,
.binder-chip:hover,
.binder-chip:focus-visible {
  color: var(--text);
  border-color: rgba(100,216,255,.52);
  background: linear-gradient(145deg, rgba(100,216,255,.15), rgba(255,255,255,.06));
  box-shadow: 0 0 24px rgba(100,216,255,.10);
}
.binder-grid.binder-grid-polished {
  grid-template-columns: repeat(auto-fill, minmax(238px, 1fr));
  gap: 18px;
  align-items: stretch;
}
.binder-card-stack {
  min-width: 0;
}
.binder-card-stack::before {
  inset: 8px 8px -7px 8px;
  border-color: rgba(255,255,255,.10);
}
.binder-card-stack::after {
  inset: 15px 14px -13px 14px;
  opacity: .46;
}
.binder-card-tile {
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at 20% 0%, rgba(100,216,255,.10), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(0,0,0,.28));
  border-color: rgba(255,255,255,.13);
}
.binder-card-stack.finish-holo .binder-card-tile {
  border-color: rgba(100,216,255,.38);
  box-shadow: 0 20px 44px rgba(0,0,0,.28), 0 0 28px rgba(100,216,255,.10);
}
.binder-card-stack.finish-foil .binder-card-tile {
  border-color: rgba(240,207,108,.36);
  box-shadow: 0 20px 44px rgba(0,0,0,.28), 0 0 28px rgba(240,207,108,.09);
}
.binder-card-preview-wrap {
  position: relative;
  padding: 12px 12px 0;
}
.binder-card-preview-wrap .card-preview {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 15px;
  box-shadow: 0 16px 32px rgba(0,0,0,.30);
}
.binder-card-preview-wrap .card-preview.has-image,
.binder-card-preview-wrap .card-preview.no-image {
  overflow: hidden;
}
.binder-card-body {
  flex: 1 1 auto;
  padding: 12px;
  gap: 7px;
  display: flex;
  flex-direction: column;
  align-content: stretch;
}
.binder-card-kicker {
  color: var(--gold);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .10em;
  text-transform: uppercase;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.binder-card-name {
  font-size: 15px;
  line-height: 1.18;
  letter-spacing: -.02em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.binder-card-subtitle,
.binder-card-variant-line,
.binder-card-tag-line,
.binder-held-line {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
}
.binder-card-subtitle,
.binder-card-variant-line,
.binder-card-tag-line {
  min-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.binder-card-variant-line {
  color: var(--soft);
}
.binder-card-tag-line {
  color: rgba(211,200,241,.68);
}
.binder-card-tag-line.is-empty {
  opacity: 0;
}
.binder-card-badges {
  display: flex;
  gap: 5px;
  flex-wrap: nowrap;
  min-height: 25px;
  overflow: hidden;
}
.binder-card-badge {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  padding: 4px 7px;
  color: rgba(255,255,255,.84);
  background: rgba(255,255,255,.06);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.binder-card-badge.finish-holo {
  border-color: rgba(100,216,255,.36);
  background: rgba(100,216,255,.12);
}
.binder-card-badge.finish-foil {
  border-color: rgba(240,207,108,.36);
  background: rgba(240,207,108,.11);
}
.binder-card-badge.signed {
  border-color: rgba(255,91,231,.34);
  background: rgba(255,91,231,.10);
}
.binder-card-badge.rarity {
  border-color: rgba(173,113,255,.34);
  background: rgba(173,113,255,.10);
}
.binder-card-badge.base-art {
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.055);
}
.binder-held-line {
  margin-top: auto;
}
.binder-action-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 3px;
}
.binder-action-row .tile-action {
  min-height: 34px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  padding: 7px 8px;
}
.binder-action-row .card-zoom-btn {
  border-color: rgba(100,216,255,.42);
}
.binder-action-row .card-variants-btn {
  border-color: rgba(240,207,108,.32);
}
.binder-empty-state {
  grid-column: 1 / -1;
  display: grid;
  gap: 8px;
  justify-items: start;
  padding: 22px;
}
.binder-empty-state strong {
  color: var(--text);
  font-size: 18px;
}
.binder-empty-state button {
  min-height: 36px;
  padding: 8px 12px;
}
.binder-order-tools {
  color: var(--muted);
}
.binder-order-tools button:disabled {
  opacity: .46;
}
@media (max-width: 760px) {
  .binder-head-actions { width: 100%; }
  .binder-head-actions button { width: 100%; }
  .binder-grid.binder-grid-polished { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
  .binder-card-preview-wrap { padding: 10px 10px 0; }
}


/* v=player-binder-card-general-237
   Keep Binder card actions level across a row. The visual fields above can vary,
   but the footer is now a real bottom-anchored area inside a stretched grid tile. */
.binder-grid.binder-grid-polished {
  align-items: stretch;
  grid-auto-rows: 1fr;
}
.binder-grid.binder-grid-polished .binder-card-stack {
  display: flex;
  align-self: stretch;
  height: 100%;
  min-height: 100%;
}
.binder-grid.binder-grid-polished .binder-card-tile {
  width: 100%;
  height: 100%;
  min-height: 100%;
}
.binder-card-body {
  flex: 1 1 auto;
  min-height: 220px;
  display: flex;
  flex-direction: column;
}
.binder-card-info {
  display: grid;
  gap: 7px;
  min-width: 0;
}
.binder-card-footer {
  margin-top: auto;
  display: grid;
  gap: 9px;
  padding-top: 9px;
}
.binder-held-line {
  margin-top: 0;
  min-height: 18px;
}
.binder-action-row {
  margin-top: 0;
}
@media (max-width: 760px) {
  .binder-grid.binder-grid-polished { grid-auto-rows: auto; }
  .binder-card-body { min-height: 0; }
}


/* v=player-binder-card-general-237
   Binder tiles now describe the card and collection generally. Variant-specific
   finish/art/signature details are reserved for Zoom/Stack. */
.binder-card-subtitle,
.binder-card-collection-line,
.binder-card-tag-line {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
  min-height: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.binder-card-collection-line {
  color: rgba(211,200,241,.72);
}
.binder-card-collection-line.is-empty {
  opacity: .64;
}
.binder-card-badges {
  min-height: 25px;
}
.binder-card-badge.type {
  border-color: rgba(100,216,255,.28);
  background: rgba(100,216,255,.09);
}
.binder-card-badge.role {
  border-color: rgba(240,207,108,.28);
  background: rgba(240,207,108,.08);
}
.binder-card-footer {
  padding-top: 12px;
}


/* v=player-stack-bottom-anchor-238
   Variant Stack tiles now use the same fixed-zone layout as Binder tiles:
   preview on top, variant info above, lock details in the middle, and Zoom
   anchored to the bottom of every tile in the row. */
.variant-grid {
  align-items: stretch !important;
  grid-auto-rows: 1fr !important;
}
.variant-grid .variant-stack {
  display: flex !important;
  align-self: stretch !important;
  height: 100% !important;
  min-height: 100% !important;
}
.variant-stack .card-tile {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
}
.variant-stack .card-art.card-preview {
  flex: 0 0 auto !important;
}
.variant-card-body {
  flex: 1 1 auto !important;
  min-height: 190px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.variant-card-info {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}
.variant-card-locks {
  display: grid !important;
  gap: 6px !important;
  min-height: 0 !important;
}
.variant-card-footer {
  margin-top: auto !important;
  padding-top: 10px !important;
}
.variant-card-footer .tile-action-row {
  margin-top: 0 !important;
}
.variant-card-footer .tile-action {
  min-height: 38px !important;
}
@media (max-width: 760px) {
  .variant-grid { grid-auto-rows: auto !important; }
  .variant-card-body { min-height: 0 !important; }
}

/* v=player-set-checklist-240
   Self-contained set checklist: all live cards in a set and whether the player owns each one. */
.checklist-panel-head h2 {
  margin-bottom: 4px;
}
.checklist-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 14px;
}
.checklist-stat-card {
  display: grid;
  gap: 5px;
  min-height: 96px;
  padding: 15px 16px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(0,0,0,.22));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.checklist-stat-card span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.checklist-stat-card strong {
  color: var(--text);
  font-size: 28px;
  line-height: 1;
  letter-spacing: -.04em;
}
.checklist-stat-card em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 750;
}
.checklist-toolbar {
  display: grid;
  gap: 12px;
  margin: 0 0 16px;
}
.checklist-view-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.checklist-chip {
  min-height: 38px;
  padding: 7px 10px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--soft);
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.13);
  font-size: 13px;
  font-weight: 900;
}
.checklist-chip strong {
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  color: var(--text);
  background: rgba(0,0,0,.24);
  border: 1px solid rgba(255,255,255,.10);
  font-size: 12px;
}
.checklist-chip.active,
.checklist-chip:hover,
.checklist-chip:focus-visible {
  color: var(--text);
  border-color: rgba(100,216,255,.52);
  background: linear-gradient(145deg, rgba(100,216,255,.15), rgba(255,255,255,.06));
  box-shadow: 0 0 24px rgba(100,216,255,.10);
}
.filters.checklist-filters {
  display: grid;
  grid-template-columns: minmax(190px, .8fr) minmax(150px, .45fr) minmax(240px, 1fr);
  align-items: end;
  justify-content: stretch;
}
.filters.checklist-filters .compact-label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.filters.checklist-filters .compact-label input,
.filters.checklist-filters .compact-label select {
  width: 100%;
  min-height: 40px;
}
.checklist-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 14px;
  align-items: stretch;
}
.checklist-card {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  gap: 12px;
  min-height: 158px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at 20% 0%, rgba(100,216,255,.09), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.065), rgba(0,0,0,.24));
  box-shadow: 0 16px 36px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.05);
}
.checklist-card.is-owned {
  border-color: rgba(100,216,255,.25);
}
.checklist-card.is-missing {
  border-color: rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 20% 0%, rgba(173,113,255,.08), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.045), rgba(0,0,0,.30));
}
.checklist-card-preview {
  width: 86px;
  min-width: 86px;
}
.checklist-card-preview .card-preview {
  min-height: 120px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 12px 24px rgba(0,0,0,.28);
}
.checklist-card-preview.missing-preview .card-preview {
  filter: saturate(.72) brightness(.78);
  opacity: .78;
}
.checklist-card-preview.missing-preview .card-preview::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(145deg, rgba(8,7,19,.12), rgba(8,7,19,.42));
  pointer-events: none;
}
.checklist-card-body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.checklist-card-head {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  min-height: 24px;
}
.checklist-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 7px;
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  border: 1px solid rgba(255,255,255,.13);
  color: rgba(255,255,255,.86);
  background: rgba(255,255,255,.06);
}
.checklist-status.owned {
  border-color: rgba(100,216,255,.34);
  background: rgba(100,216,255,.11);
}
.checklist-status.missing {
  border-color: rgba(240,207,108,.28);
  background: rgba(240,207,108,.09);
}
.checklist-status.special {
  border-color: rgba(255,91,231,.30);
  background: rgba(255,91,231,.09);
}
.checklist-card-body strong {
  color: var(--text);
  font-size: 15px;
  line-height: 1.2;
  letter-spacing: -.02em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.checklist-subtitle,
.checklist-owned-line,
.checklist-tag-line {
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.checklist-owned-line {
  color: var(--soft);
}
.checklist-tag-line {
  color: rgba(211,200,241,.66);
}
.checklist-card-actions {
  display: none;
}
@media (max-width: 960px) {
  .checklist-stat-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .filters.checklist-filters { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .checklist-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .checklist-grid { grid-template-columns: 1fr; }
  .checklist-card { grid-template-columns: 78px minmax(0, 1fr); }
  .checklist-card-preview { width: 78px; min-width: 78px; }
}

/* v=player-set-checklist-241
   Checklist is now set-wide and self-contained: no public Cards handoff, no duplicate page eyebrow, click a card to inspect possible variants/finishes with owned ones bright and missing ones faded. */
#homePanel > .panel-head .eyebrow,
#binderPanel > .panel-head .eyebrow,
#checklistPanel > .panel-head .eyebrow {
  display: none !important;
}
#homePanel > .panel-head h2,
#binderPanel > .panel-head h2,
#checklistPanel > .panel-head h2 {
  margin-top: 0;
}
.checklist-card {
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease;
}
.checklist-card:hover,
.checklist-card:focus-visible,
.checklist-card.is-expanded {
  border-color: rgba(100,216,255,.38);
  box-shadow: 0 18px 40px rgba(0,0,0,.24), 0 0 28px rgba(100,216,255,.08), inset 0 1px 0 rgba(255,255,255,.06);
}
.checklist-expand-hint {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 4px 7px;
  font-size: 10px;
  font-weight: 950;
  line-height: 1;
  color: rgba(211,200,241,.78);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.045);
}
.checklist-card.is-expanded .checklist-expand-hint {
  color: var(--text);
  border-color: rgba(100,216,255,.30);
  background: rgba(100,216,255,.10);
}
.checklist-variant-panel {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
  margin-top: 2px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.10);
}
.checklist-variant-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
}
.checklist-variant-panel-head strong {
  color: var(--text);
  font-size: 13px;
  font-weight: 950;
  letter-spacing: -.01em;
}
.checklist-variant-panel-head span,
.checklist-variant-note {
  color: var(--muted);
  font-size: 11px;
  font-weight: 750;
}
.checklist-variant-note.is-error {
  color: var(--bad);
}
.checklist-variant-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(122px, 1fr));
  gap: 10px;
  align-items: stretch;
}
.checklist-variant-card {
  display: grid;
  gap: 8px;
  padding: 9px;
  min-width: 0;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.11);
  background: rgba(255,255,255,.045);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045);
  transition: opacity .16s ease, filter .16s ease, border-color .16s ease, background .16s ease;
}
.checklist-variant-card.is-owned {
  border-color: rgba(100,216,255,.38);
  background:
    radial-gradient(circle at 20% 0%, rgba(100,216,255,.12), transparent 46%),
    rgba(255,255,255,.06);
}
.checklist-variant-card.is-owned-only {
  border-color: rgba(240,207,108,.34);
}
.checklist-variant-card.is-unowned {
  opacity: .46;
  filter: saturate(.62) brightness(.76);
}
.checklist-variant-preview .card-preview {
  min-height: 150px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
}
.checklist-variant-meta {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.checklist-variant-meta strong {
  color: var(--text);
  font-size: 12px;
  font-weight: 950;
  line-height: 1.2;
}
.checklist-variant-meta span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
}
.checklist-variant-card.is-owned .checklist-variant-meta span {
  color: var(--soft);
}
.checklist-variant-serials {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (max-width: 640px) {
  .checklist-variant-panel-head { display: grid; }
  .checklist-variant-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .checklist-variant-preview .card-preview { min-height: 132px; }
}


/* v=player-set-checklist-clean-copy-242
   Remove leftover explanatory Checklist copy; the set selector, stats, and owned/missing grid carry the screen. */
#checklistSummaryText[hidden] { display: none !important; }


/* v=player-set-checklist-visual-243
   Checklist cleanup: remove instructional copy and let card previews carry the variant state. */
.checklist-variant-panel-head,
.checklist-expand-hint,
.checklist-subtitle,
.checklist-owned-line,
.checklist-tag-line,
.checklist-variant-meta {
  display: none !important;
}
.checklist-card-body {
  justify-content: center;
  gap: 8px;
}
.checklist-card-head {
  min-height: 0;
}
.checklist-variant-panel {
  padding-top: 10px;
}
.checklist-variant-grid {
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
}
.checklist-variant-card {
  position: relative;
  padding: 6px;
  gap: 0;
}
.checklist-variant-preview {
  position: relative;
}
.checklist-variant-preview .card-preview {
  min-height: 142px;
}
.checklist-variant-owned-badge {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 4;
  min-width: 28px;
  height: 24px;
  padding: 0 8px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  font-size: 12px;
  font-weight: 950;
  background: rgba(21,16,34,.86);
  border: 1px solid rgba(240,207,108,.42);
  box-shadow: 0 8px 18px rgba(0,0,0,.30);
}
@media (max-width: 640px) {
  .checklist-variant-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .checklist-variant-preview .card-preview { min-height: 118px; }
}

/* v=player-deck-builder-dynamic-rules-247
   Keeps deck rules dynamic while preserving the clean Deck Builder status and scroll layout. */
#decksPanel .panel-head p,
#decksPanel .mini-head p {
  display: none !important;
}
#decksPanel .deck-builder-head {
  align-items: center;
  margin-bottom: 12px;
}
#decksPanel .deck-layout {
  grid-template-columns: minmax(180px, 230px) minmax(0, 1fr) !important;
  gap: 16px;
}
#decksPanel .deck-sidebar,
#decksPanel .deck-editor-card {
  border-color: rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(0,0,0,.18));
}
#decksPanel .deck-sidebar h3,
#decksPanel .deck-editor-card h3,
#decksPanel .mini-head h3 {
  margin: 0;
  letter-spacing: .02em;
}
#decksPanel .deck-slot-list {
  gap: 10px;
}
#decksPanel .deck-slot-btn {
  position: relative;
  min-height: 68px;
  padding: 12px 13px;
  overflow: hidden;
}
#decksPanel .deck-slot-btn strong {
  font-size: 14px;
  line-height: 1.2;
}
#decksPanel .deck-slot-btn span {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .07em;
}
#decksPanel .deck-slot-btn.valid::after,
#decksPanel .deck-slot-btn.invalid::after,
#decksPanel .deck-slot-btn.draft::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: var(--muted);
}
#decksPanel .deck-slot-btn.valid::after { background: var(--good); }
#decksPanel .deck-slot-btn.invalid::after { background: var(--warn); }
#decksPanel .deck-editor-toolbar {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto auto auto auto auto;
  align-items: end;
  gap: 9px;
  margin-bottom: 12px;
}
#decksPanel .deck-count-pill {
  min-height: 46px;
  min-width: 106px;
  border-color: rgba(255,255,255,.14);
}
.deck-summary-strip {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 12px;
  align-items: stretch;
  margin: 0 0 12px;
}
.deck-cover-preview {
  min-height: 132px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  background: radial-gradient(circle at 50% 12%, rgba(255,209,102,.14), rgba(0,0,0,.22) 58%);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.deck-cover-preview .card-art.card-preview {
  width: 76px;
  max-width: 82%;
  aspect-ratio: 2.5 / 3.5;
}
.deck-cover-empty {
  color: var(--gold);
  font-size: 30px;
  font-weight: 950;
  letter-spacing: .12em;
  opacity: .62;
}
.deck-health-card {
  border: 1px solid rgba(255,255,255,.11);
  border-radius: 16px;
  background: rgba(0,0,0,.16);
  padding: 12px;
  display: grid;
  align-content: space-between;
  gap: 12px;
}
.deck-health-top {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}
.deck-health-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 11px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: var(--muted);
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 11px;
}
.deck-health-badge.valid { color: var(--good); border-color: rgba(130,231,171,.5); background: rgba(130,231,171,.08); }
.deck-health-badge.invalid { color: var(--warn); border-color: rgba(255,209,102,.48); background: rgba(255,209,102,.08); }
.deck-health-badge.unsaved { color: var(--gold); border-color: rgba(255,209,102,.48); background: rgba(255,209,102,.08); }
.deck-health-badge.draft { color: var(--muted); }
.deck-type-counts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.deck-type-counts span {
  min-height: 54px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  display: grid;
  place-items: center;
  gap: 2px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.deck-type-counts strong {
  display: block;
  color: var(--text);
  font-size: 18px;
  line-height: 1;
}
#decksPanel .deck-issues {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 2px;
  margin: 4px 0 12px;
}
#decksPanel .deck-issue {
  white-space: nowrap;
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 11px;
}
#decksPanel .deck-builder-columns {
  grid-template-columns: minmax(360px, 1fr) minmax(360px, 1fr) !important;
  gap: 14px;
}
#decksPanel .deck-list-panel,
#decksPanel .deck-collection-panel {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 12px;
  background: rgba(0,0,0,.14);
}
.deck-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 10px 0;
}
.deck-filter-chips button {
  min-height: 30px;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.deck-filter-chips button.active {
  border-color: rgba(100,216,255,.70);
  background: rgba(100,216,255,.14);
  color: var(--text);
}
#decksPanel .deck-search-row {
  grid-template-columns: 1fr !important;
  margin: 0 0 10px;
}
#decksPanel .deck-card-list,
#decksPanel .deck-collection-grid {
  gap: 8px;
}
#decksPanel .deck-collection-grid {
  max-height: min(70vh, 740px);
}
#decksPanel .deck-card-row,
#decksPanel .deck-add-row {
  grid-template-columns: 56px minmax(0, 1fr) auto !important;
  gap: 10px;
  align-items: center;
  border-radius: 16px;
  padding: 8px;
}
#decksPanel .deck-add-row:not(.disabled) {
  cursor: pointer;
}
#decksPanel .deck-add-row:not(.disabled):hover,
#decksPanel .deck-card-row:hover {
  border-color: rgba(100,216,255,.42);
  background: rgba(100,216,255,.055);
}
#decksPanel .deck-add-row.disabled {
  opacity: .45;
}
#decksPanel .deck-card-thumb {
  width: 56px;
  border-radius: 10px;
}
#decksPanel .deck-card-info strong {
  font-size: 13px;
  line-height: 1.2;
}
#decksPanel .deck-card-info span,
#decksPanel .deck-card-info em {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  font-weight: 800;
}
#decksPanel .deck-card-info em {
  color: var(--gold);
  opacity: .82;
}
#decksPanel .deck-card-actions {
  align-items: center;
  justify-content: flex-end;
  min-width: 124px;
}
#decksPanel .deck-card-actions button {
  min-height: 30px;
  padding: 5px 8px;
}
.deck-pool-count {
  min-width: 36px;
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  font-weight: 950;
}
#decksPanel .deck-qty {
  min-width: 30px;
}
@media (max-width: 1180px) {
  #decksPanel .deck-layout,
  #decksPanel .deck-builder-columns { grid-template-columns: 1fr !important; }
  #decksPanel .deck-slot-list { grid-template-columns: repeat(5, minmax(110px, 1fr)); }
  #decksPanel .deck-editor-toolbar { grid-template-columns: 1fr auto auto auto auto auto; }
}
@media (max-width: 820px) {
  #decksPanel .deck-editor-toolbar { grid-template-columns: 1fr 1fr; }
  #decksPanel .deck-name-label { grid-column: 1 / -1; }
  .deck-summary-strip { grid-template-columns: 78px minmax(0, 1fr); }
  .deck-cover-preview { min-height: 112px; }
  .deck-type-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #decksPanel .deck-card-row,
  #decksPanel .deck-add-row { grid-template-columns: 52px minmax(0, 1fr) !important; }
  #decksPanel .deck-card-actions { grid-column: 1 / -1; justify-content: flex-start; min-width: 0; }
}
@media (max-width: 520px) {
  #decksPanel .deck-slot-list { grid-template-columns: 1fr !important; }
  .deck-summary-strip { grid-template-columns: 1fr; }
  .deck-cover-preview .card-art.card-preview { width: 92px; }
}


/* v=player-deck-builder-dynamic-rules-247 overrides */
#decksPanel #deckStatus:empty {
  display: none;
}
#decksPanel #deckStatus {
  margin: 0 0 8px;
}
#decksPanel .deck-health-badge[hidden],
#decksPanel #deckValidText[hidden] {
  display: none !important;
}
#decksPanel .deck-health-top {
  justify-content: flex-end;
}
#decksPanel .deck-card-list {
  max-height: min(70vh, 740px);
  overflow-y: auto;
  padding-right: 4px;
}
#decksPanel .deck-list-panel,
#decksPanel .deck-collection-panel {
  min-height: 0;
}
#decksPanel .deck-builder-columns {
  align-items: start;
}
#decksPanel .deck-issues:empty {
  display: none;
}

/* v=player-salvage-safe-extras-249
   Safer, more visual player Salvage flow. */
#salvagePanel .panel-head h2 {
  margin-bottom: 0;
}
#salvagePanel .panel-actions button:disabled {
  opacity: .45;
  cursor: not-allowed;
}
.salvage-stat-grid {
  grid-template-columns: repeat(4, minmax(130px, 1fr)) !important;
}
.salvage-stat span {
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 900;
}
.salvage-toolbar {
  display: grid !important;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 10px;
}
.salvage-filter-chips {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.salvage-filter-chips .chip {
  min-height: 32px;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.salvage-filter-chips .chip.active {
  border-color: rgba(100,216,255,.72);
  color: #eefdff;
  background: linear-gradient(180deg, rgba(100,216,255,.20), rgba(109,61,255,.15));
}
.salvage-toolbar input {
  min-height: 42px;
}
.salvage-preview-panel[hidden] {
  display: none !important;
}
.salvage-preview-panel {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 12px 0 8px !important;
}
.salvage-copy-grid {
  max-height: min(68vh, 760px);
  overflow: auto;
  padding: 4px 4px 18px;
  align-items: stretch;
}
.salvage-copy-card {
  min-height: 398px;
  cursor: pointer;
}
.salvage-copy-card.selected {
  border-color: rgba(100,216,255,.82) !important;
  background: linear-gradient(180deg, rgba(100,216,255,.14), rgba(109,61,255,.08)) !important;
  box-shadow: inset 0 0 0 1px rgba(100,216,255,.16), 0 0 24px rgba(100,216,255,.08);
}
.salvage-copy-card.special {
  border-color: rgba(230,184,71,.24);
}
.salvage-select {
  align-self: flex-end;
  justify-content: center !important;
  min-width: 92px;
  min-height: 30px;
  border-radius: 999px !important;
  border-color: rgba(255,255,255,.18) !important;
  color: var(--soft) !important;
  background: rgba(0,0,0,.18) !important;
  font-weight: 900;
}
.salvage-copy-card.selected .salvage-select {
  border-color: rgba(100,216,255,.7) !important;
  color: #dff9ff !important;
  background: rgba(100,216,255,.14) !important;
}
.salvage-copy-info {
  margin-top: auto;
}
.salvage-copy-info strong {
  line-height: 1.18;
}
.shard-pill {
  margin-top: 3px;
}
@media (max-width: 820px) {
  .salvage-toolbar {
    grid-template-columns: 1fr;
  }
  .salvage-toolbar button,
  .salvage-toolbar input {
    width: 100%;
  }
}


/* v=player-salvage-safe-extras-249
   Keep Salvage extras-first and make unavailable preview details inspectable without implying full-collection salvage. */
.salvage-preview-panel .salvage-unavailable {
  margin-top: 8px;
}
.salvage-preview-panel .salvage-unavailable summary {
  cursor: pointer;
  color: var(--gold);
  font-weight: 800;
}
.salvage-preview-panel .salvage-unavailable p {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 6px 0 0;
}
.salvage-preview-panel .salvage-unavailable span {
  color: var(--muted);
  text-align: right;
}

/* v=player-pack-journal-250
   Player pack history: in-world pack openings only, collapsible entries, date/pack filters, and rarity-matrix best pull. */
.pack-journal-head {
  align-items: center;
  margin-bottom: 12px;
}
.pack-journal-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(160px, .7fr) minmax(150px, .55fr) minmax(150px, .55fr);
  gap: 10px;
  align-items: end;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 10px;
  background: rgba(0,0,0,.15);
  margin-bottom: 12px;
}
.pack-journal-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 12px 0;
}
.pack-journal-stat {
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.16));
  border-radius: 16px;
  padding: 14px;
  min-height: 82px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}
.pack-journal-stat strong {
  color: var(--text);
  font-size: 28px;
  line-height: 1;
}
.pack-journal-stat span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.pack-journal-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.pack-opening {
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(0,0,0,.18));
}
.pack-opening.is-open {
  border-color: rgba(100,216,255,.34);
  box-shadow: 0 0 0 3px rgba(100,216,255,.06);
}
.pack-opening-summary {
  width: 100%;
  min-height: 96px;
  display: grid;
  grid-template-columns: 38px minmax(170px, .75fr) minmax(260px, 1.25fr) auto;
  gap: 12px;
  align-items: center;
  text-align: left;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 12px 14px;
}
.pack-opening-summary:hover,
.pack-opening-summary:focus-visible {
  background: rgba(255,255,255,.04);
}
.pack-open-caret {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--gold);
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(240,207,108,.34);
  font-weight: 950;
  font-size: 18px;
}
.pack-open-title,
.pack-open-best,
.pack-open-count {
  min-width: 0;
}
.pack-open-title strong,
.pack-open-title em,
.pack-open-count strong,
.pack-open-count em,
.pack-open-best b,
.pack-open-best em {
  display: block;
}
.pack-open-title strong {
  color: var(--text);
  font-size: 16px;
  line-height: 1.15;
}
.pack-open-title em,
.pack-open-count em,
.pack-open-best em {
  color: var(--muted);
  font-style: normal;
  font-size: 12px;
  font-weight: 750;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pack-open-best {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}
.pack-best-thumb {
  width: 54px;
  aspect-ratio: 2.5 / 3.5;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 10px;
}
.pack-best-thumb .card-art.card-preview {
  width: 54px;
  min-height: 76px;
}
.pack-open-best b {
  color: var(--gold);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.pack-open-count {
  justify-self: end;
  min-width: 88px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  background: rgba(0,0,0,.16);
  text-align: center;
}
.pack-open-count strong {
  color: var(--text);
  font-size: 22px;
  line-height: 1;
}
.pack-pull-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
  padding: 14px;
  border-top: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
}
.pack-pull-card {
  position: relative;
  min-width: 0;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 16px;
  padding: 9px;
  background: rgba(255,255,255,.04);
  display: grid;
  gap: 6px;
}
.pack-pull-card.is-new {
  border-color: rgba(130,231,171,.42);
  box-shadow: inset 0 0 0 1px rgba(130,231,171,.10);
}
.pack-pull-card.is-signed {
  border-color: rgba(255,111,214,.38);
}
.pack-pull-card.finish-holo {
  box-shadow: inset 0 0 0 1px rgba(100,216,255,.14), 0 0 22px rgba(100,216,255,.06);
}
.pack-pull-card.finish-foil {
  box-shadow: inset 0 0 0 1px rgba(240,207,108,.14), 0 0 22px rgba(240,207,108,.06);
}
.pack-pull-preview {
  display: grid;
  place-items: center;
}
.pack-pull-preview .card-art.card-preview {
  width: min(100%, 128px);
  min-height: 178px;
}
.pack-pull-card strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.2;
}
.pack-pull-card span,
.pack-pull-card em {
  color: var(--muted);
  font-style: normal;
  font-size: 11px;
  font-weight: 750;
}
.pack-pull-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.pack-pull-badges span {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 3px 6px;
  border-radius: 999px;
  color: var(--soft);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  font-size: 10px;
  font-weight: 900;
}
/* v256 Pack Journal rarity pills: reuse the Public Cards rarity text treatment. */
.pack-pull-badges .pack-badge-new {
  color: var(--good);
  border-color: rgba(130,231,171,.42);
  background: rgba(130,231,171,.08);
}
.pack-pull-badges .pack-badge-holo {
  color: #8be7ff;
  border-color: rgba(100,216,255,.34);
  background: rgba(100,216,255,.07);
}
.pack-pull-badges .pack-badge-foil {
  color: #ffd166;
  border-color: rgba(230,184,71,.46);
  background: rgba(230,184,71,.10);
}
.pack-pull-badges .pack-badge-signed {
  color: #ff75df;
  border-color: rgba(255,117,223,.34);
  background: rgba(255,117,223,.08);
}
.pack-pull-badges .pack-rarity-common {
  color: #d8d7e9;
  text-shadow: 0 0 12px rgba(216,215,233,.13);
}
.pack-pull-badges .pack-rarity-uncommon {
  color: #51eaa2;
  border-color: rgba(81,234,162,.34);
  background: rgba(81,234,162,.07);
  text-shadow: 0 0 14px rgba(81,234,162,.24);
}
.pack-pull-badges .pack-rarity-rare {
  color: #b985ff;
  border-color: rgba(185,133,255,.36);
  background: rgba(185,133,255,.08);
  text-shadow: 0 0 16px rgba(185,133,255,.30);
}
.pack-pull-badges .pack-rarity-super {
  color: #ff75df;
  border-color: rgba(255,117,223,.34);
  background: rgba(255,117,223,.08);
  text-shadow: 0 0 18px rgba(255,117,223,.36);
}
.pack-pull-badges .pack-rarity-ultra {
  border-color: rgba(230,184,71,.46);
  background: rgba(230,184,71,.06);
  background-image: linear-gradient(90deg, #ffe58a, #8be7ff, #ff75df, #ffd166);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 18px rgba(255,209,102,.24);
}
@media (max-width: 1040px) {
  .pack-journal-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pack-opening-summary { grid-template-columns: 34px minmax(0, 1fr) auto; }
  .pack-open-best { grid-column: 2 / -1; }
}
@media (max-width: 640px) {
  .pack-journal-toolbar,
  .pack-journal-stat-grid { grid-template-columns: 1fr; }
  .pack-opening-summary { grid-template-columns: 32px minmax(0, 1fr); }
  .pack-open-count { justify-self: start; grid-column: 2; }
  .pack-open-best { grid-template-columns: 44px minmax(0, 1fr); }
  .pack-best-thumb,
  .pack-best-thumb .card-art.card-preview { width: 44px; }
  .pack-pull-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pack-pull-preview .card-art.card-preview { min-height: 142px; }
}

/* v=player-login-clean-258
   Player login now supports saved username/password credentials in addition
   to the Second Life one-time-code flow. */
.auth-method-card {
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.045);
  padding: 16px;
  margin-top: 14px;
}
.auth-method-primary {
  border-color: rgba(100,216,255,.34);
  background: linear-gradient(145deg, rgba(100,216,255,.09), rgba(109,61,255,.055));
}
.auth-method-head {
  display: grid;
  gap: 3px;
}
.auth-method-head h2 {
  font-size: 18px;
  letter-spacing: -.03em;
}
.auth-method-card .auth-form {
  margin-top: 12px;
}

.account-login-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  margin: 0 0 14px;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  background: rgba(255,255,255,0.035);
}
.account-login-panel > div {
  display: grid;
  gap: 4px;
}
.account-login-panel strong {
  font-size: 1.1rem;
  letter-spacing: 0.01em;
}
@media (max-width: 620px) {
  .account-login-panel { align-items: stretch; flex-direction: column; }
}


/* ==========================================================================
   Prim Legends Player Area — nightlife interface v276
   Functional selectors remain unchanged; this layer only changes structure
   and presentation so the private area matches the public brand.
   ========================================================================== */
:root {
  --bg: #070707;
  --panel: #0b0b0d;
  --panel2: #111113;
  --line: rgba(205,168,75,.27);
  --line2: rgba(205,168,75,.58);
  --text: #f5f1e9;
  --muted: #a8a0a5;
  --soft: #ded8d5;
  --purple: #76106f;
  --blue: #58c7ff;
  --pink: #ff2aa1;
  --gold: #cda84b;
  --good: #7ce0a8;
  --warn: #e6c663;
  --bad: #ff697d;
  --shadow: 0 30px 80px rgba(0,0,0,.62);
}
html, body { background: #070707; }
body {
  color: var(--text);
  background:
    radial-gradient(circle at 78% 4%, rgba(118,16,111,.18), transparent 28%),
    radial-gradient(circle at 18% 80%, rgba(205,168,75,.055), transparent 24%),
    #070707;
  font-family: "Segoe UI", Arial, sans-serif;
}
body::before {
  opacity: .16;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 4px),
    linear-gradient(90deg, transparent, rgba(118,16,111,.16) 52%, transparent);
  background-size: auto;
  mask-image: none;
}

.player-site-header {
  position: sticky;
  top: 0;
  z-index: 190;
  min-height: 72px;
  border-bottom: 1px solid rgba(205,168,75,.38);
  background: rgba(5,5,5,.96);
  box-shadow: 0 10px 32px rgba(0,0,0,.36);
}
.player-nav-shell {
  width: min(1500px, calc(100% - 40px));
  min-height: 72px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 240px 1fr auto;
  align-items: stretch;
  gap: 24px;
}
.player-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #e6c663;
  text-decoration: none;
  text-transform: uppercase;
  font: 900 15px/.92 "Arial Narrow", Arial, sans-serif;
  letter-spacing: .19em;
}
.player-brand-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  color: #e6c663;
  transform: skew(-7deg);
  font: italic 900 20px/1 Georgia, serif;
  letter-spacing: -.12em;
  text-shadow: 0 0 16px rgba(205,168,75,.34);
}
.player-public-links {
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: 42px;
}
.player-public-links a {
  position: relative;
  display: grid;
  place-items: center;
  color: #d7d1cf;
  text-decoration: none;
  font: 800 12px/1 "Arial Narrow", Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.player-public-links a::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: -1px;
  height: 2px;
  background: var(--gold);
  transition: .18s ease;
}
.player-public-links a:hover::after { left: 0; right: 0; }
.player-area-label {
  align-self: center;
  min-width: 160px;
  padding: 14px 22px;
  border: 1px solid #a21b94;
  color: white;
  background: linear-gradient(90deg,#62005d,#8f0a82);
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
  text-align: center;
  font: 900 12px/1 "Arial Narrow", Arial, sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.pl-private-shell {
  min-height: calc(100vh - 72px);
  padding: 30px 24px 54px;
  display: grid;
  place-items: start center;
}
.auth-card, .app-view { width: min(1500px, 100%); }
.auth-card {
  max-width: 720px;
  margin-top: 7vh;
  padding: clamp(28px, 5vw, 50px);
  border: 1px solid rgba(205,168,75,.56);
  border-radius: 4px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.025), transparent 42%),
    #0b0b0d;
  backdrop-filter: none;
  box-shadow: 0 34px 90px rgba(0,0,0,.56);
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
}
.brand-lockup { margin-bottom: 22px; }
.brand-lockup .logo-mark {
  width: 62px;
  height: 62px;
  border: 1px solid rgba(205,168,75,.66);
  border-radius: 0;
  color: var(--gold);
  background: #080809;
  font: italic 900 22px/1 Georgia, serif;
  transform: skew(-6deg);
}
.brand-lockup h1,
.topbar h1,
.panel-head h2,
.auth-method-card h2 {
  font-family: "Arial Narrow", Impact, sans-serif;
  text-transform: uppercase;
  letter-spacing: -.025em;
}
.brand-lockup h1 { font-size: clamp(44px, 8vw, 72px); line-height: .88; }
.lead { color: #d4ced0; }

button,
.top-link {
  min-height: 42px;
  border: 1px solid rgba(205,168,75,.42);
  border-radius: 0;
  color: #eee9e5;
  background: #101012;
  box-shadow: none;
  clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 7px 100%, 0 calc(100% - 7px));
  font: 800 11px/1 "Arial Narrow", Arial, sans-serif;
  letter-spacing: .065em;
  text-transform: uppercase;
}
button:hover:not(:disabled),
button.active,
.top-link:hover {
  border-color: var(--gold);
  color: white;
  background: #1a171a;
}
button.primary {
  border-color: #a21b94;
  color: white;
  background: linear-gradient(90deg,#62005d,#8f0a82);
}
input, select {
  min-height: 44px;
  border: 1px solid rgba(205,168,75,.34);
  border-radius: 0;
  color: var(--text);
  background: #09090a;
}
input:focus, select:focus {
  border-color: var(--gold);
  box-shadow: 0 0 0 2px rgba(205,168,75,.11);
}

.auth-method-card,
.mini-panel,
.notice,
.empty-state,
.panel,
.topbar,
.card-tile,
.deck-editor-card,
.deck-sidebar,
.checklist-card,
.pack-journal-entry,
.account-card {
  border-color: rgba(205,168,75,.27);
  border-radius: 4px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.022), transparent 42%),
    #0b0b0d;
  backdrop-filter: none;
  box-shadow: 0 18px 48px rgba(0,0,0,.28);
}
.auth-method-card { padding: 18px; margin-top: 16px; }
.auth-method-primary { border-left: 3px solid var(--pink); }

.app-view { gap: 18px; }
.topbar {
  position: sticky;
  top: 90px;
  z-index: 120;
  display: grid;
  grid-template-columns: minmax(220px, auto) 1fr;
  align-items: center;
  gap: 24px;
  padding: 18px 20px;
  border-color: rgba(205,168,75,.45);
  background: rgba(8,8,9,.96);
}
.topbar h1 { margin: 0; font-size: clamp(30px, 4vw, 48px); line-height: .9; }
.global-shard-pill { color: var(--gold); }
.top-actions {
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  gap: 0;
  overflow-x: auto;
}
.top-actions button,
.top-actions .top-link {
  min-width: max-content;
  min-height: 52px;
  padding: 10px 16px;
  border-width: 0 0 2px 0;
  border-color: transparent;
  clip-path: none;
  background: transparent;
}
.top-actions button + button,
.top-actions .top-link { border-left: 1px solid rgba(205,168,75,.18); }
.top-actions button.active {
  border-bottom-color: var(--pink);
  color: white;
  background: rgba(118,16,111,.2);
}
.top-actions #logoutBtn { color: #e8c4ca; }

.panel { padding: 22px; }
.panel-head {
  padding-bottom: 16px;
  margin-bottom: 18px;
  border-bottom: 1px solid rgba(205,168,75,.23);
}
.panel-head h2 { font-size: clamp(28px, 4vw, 46px); line-height: .9; }
.mini-head h3,
.dashboard-panel h3 { text-transform: uppercase; letter-spacing: .02em; }
.dashboard-split.dashboard-single { grid-template-columns: 1fr; }
.player-stat-card,
.binder-mini-stat,
.checklist-stat,
.pack-journal-stat {
  border-radius: 0;
  border-color: rgba(205,168,75,.24);
  background: #0f0f11;
}
.player-stat-card strong,
.binder-mini-stat strong,
.checklist-stat strong,
.pack-journal-stat strong { color: var(--gold); }
.progress-track,
.collection-progress-track { border-radius: 0; background: #050505; }
.progress-track i,
.collection-progress-track i { border-radius: 0; background: linear-gradient(90deg,var(--purple),var(--pink)); }

.filters,
.checklist-toolbar,
.pack-journal-toolbar,
.binder-dashboard-row {
  border-radius: 0;
}
.compact-label { color: var(--gold); text-transform: uppercase; letter-spacing: .06em; font-size: 10px; }
.binder-quick-chips button,
.checklist-view-chips button { border-radius: 0; }
.copy-stack::before,
.copy-stack::after { border-radius: 5px; background: #111113; }
.card-tile { border-radius: 5px; background: #080809; }
.card-art.card-preview { border-radius: 4px 4px 0 0; }
.count-pill {
  border-radius: 0;
  border-color: rgba(205,168,75,.72);
  color: var(--gold);
  background: rgba(5,5,5,.9);
  backdrop-filter: none;
}
.binder-modal-backdrop { background: rgba(0,0,0,.82); backdrop-filter: blur(8px); }
.binder-modal {
  border-radius: 5px;
  border-color: rgba(205,168,75,.55);
  background: #09090b;
}

@media (max-width: 1050px) {
  .player-nav-shell { grid-template-columns: 1fr auto; }
  .player-public-links { display: none; }
  .topbar { position: static; grid-template-columns: 1fr; }
  .top-actions { justify-content: flex-start; }
}
@media (max-width: 680px) {
  .player-nav-shell { width: min(100% - 24px, 1500px); grid-template-columns: 1fr; gap: 0; padding: 10px 0; }
  .player-area-label { width: 100%; }
  .pl-private-shell { padding: 16px 12px 36px; }
  .auth-card { margin-top: 18px; }
  .top-actions button { flex: 1 0 auto; }
  .panel { padding: 15px; }
}

/* ==========================================================================
   Prim Legends Facon PL mark treatment v288
   Facon is used only for the gold PL monogram in the private player area.
   The written-out Prim Legends name keeps the normal site typography.
   ========================================================================== */
.player-brand-mark,
.brand-lockup .logo-mark {
  position: relative;
  overflow: hidden;
  color: transparent !important;
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
  transform: none;
}

.player-brand-mark::before,
.brand-lockup .logo-mark::before {
  content: "";
  display: block;
  width: 88%;
  height: 88%;
  margin: 6%;
  background-color: #e6c663;
  -webkit-mask: url("/assets/pl-facon-mark.svg") center / contain no-repeat;
  mask: url("/assets/pl-facon-mark.svg") center / contain no-repeat;
}

.player-brand,
.player-brand > span:last-child,
.brand-lockup h1,
.pl-gold-wordmark {
  font-family: "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
  font-style: normal;
}

.player-brand {
  letter-spacing: .16em;
  font-weight: 900;
}

.player-brand > span:last-child {
  line-height: .92;
}