.set-gallery-page { max-width: 1500px; margin: 86px auto 60px; padding: 24px; color: #25252d; overflow-x: clip; }
.set-gallery-hero { max-width: 900px; margin: 0 auto 24px; text-align: center; }
.set-gallery-back { display: flex; width: fit-content; min-height: 44px; gap: 8px; margin: 0 auto 24px; text-decoration: none; }
.set-gallery-back:focus-visible { outline: 3px solid #7543c5; outline-offset: 5px; }
.set-gallery-hero > span { display: inline-block; padding: 5px 10px; background: #25252d; color: white; font-weight: 900; letter-spacing: .12em; transform: rotate(-2deg); }
.set-gallery-hero h1 { margin: 18px 0 8px; font-size: clamp(2.4rem, 7vw, 5rem); line-height: .95; }
.set-gallery-hero p { font-weight: 650; }
.set-gallery-stats { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }
.set-gallery-stats > * { padding: 8px 12px; border: 2px solid #25252d; border-radius: 8px; background: white; box-shadow: 3px 3px 0 #25252d; }
.set-gallery-stats b { background: #9bf6ff; }
.set-gallery-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; margin: 26px auto 38px; font-size: .8rem; font-weight: 850; }
.set-gallery-legend span { display: flex; align-items: center; gap: 7px; }
.set-gallery-legend i { width: 24px; height: 24px; display: grid; place-items: center; border: 2px solid #25252d; border-radius: 5px; background: #fff; font-style: normal; }
.set-gallery-legend .legend-missing { opacity: .35; }
.set-gallery-legend .legend-unknown { background: #25252d; color: white; }
.set-gallery { display: grid; gap: 46px; }
.set-rarity-group > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; padding-bottom: 10px; border-bottom: 4px solid var(--rarity-color); }
.set-rarity-group h2 { margin: 0; font-size: 1.8rem; }
.set-rarity-group > header span { font-weight: 850; }
.set-rarity-group.rarity-unique > header { border-image: linear-gradient(90deg, #17131f, #ff3cac 72%, #4deeea) 1; }
.set-rarity-group.rarity-mythical > header { border-image: linear-gradient(90deg, #1b080b, #d8243f 72%, #ee4939) 1; }
.set-rarity-group.rarity-celestial > header { border-image: linear-gradient(90deg, #35256d, #776de8 65%, #8edfff) 1; }
.set-rarity-group.rarity-gilded { --rarity-color: #FFD700; }
.set-rarity-group > div { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 265px), 1fr)); gap: 42px 30px; align-items: start; }
.set-gallery-card { display: flex; flex-direction: column; box-sizing: border-box; aspect-ratio: 4 / 7; overflow: hidden; position: relative; border: 2px solid #25252d; border-radius: 11px; background: white; box-shadow: 5px 5px 0 var(--rarity-color), 7px 7px 0 #25252d; }
.set-gallery-card > .card-rarity { display: flex; align-items: center; justify-content: space-between; min-height: 30px; gap: 6px; padding: 0 11px; background: var(--rarity-color); color: #fff; font-size: 12px; font-weight: 750; }
.set-gallery-card > .card-rarity b { font: 600 12px ui-monospace, monospace; }
.set-gallery-card .set-gallery-card-body { flex: 1; display: flex; flex-direction: column; }
.set-gallery-card .set-card-unknown { flex: 1; aspect-ratio: auto; }
.set-gallery-card-body { transition: opacity .2s; }
.set-gallery-card.state-missing .set-gallery-card-body { opacity: .32; }
.set-gallery-card.state-failed { --rarity-color: #b21f3d; background: #ffe4e8; }
.set-gallery-card.rarity-unique:not(.state-failed) { --rarity-color: #ff3cac; box-shadow: 7px 7px 0 #ff3cac, 10px 10px 0 #17131f, 0 0 24px rgba(77, 238, 234, .4); }
.set-gallery-card.rarity-mythical:not(.state-failed) { --rarity-color: #d8243f; box-shadow: 7px 7px 0 #d8243f, 10px 10px 0 #1b080b, 0 0 26px #e244386e; }
.set-gallery-card.rarity-celestial:not(.state-failed) { --rarity-color: #776de8; box-shadow: 7px 7px 0 #776de8, 10px 10px 0 #35256d, 0 0 28px #8edfff80; }
.set-gallery-card.rarity-gilded:not(.state-failed) { --rarity-color: #FFD700; }
.set-gallery-card img, .set-card-unknown { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-bottom: 3px solid #25252d; }
.set-gallery-card.full-card-image img { aspect-ratio: 3 / 4; object-fit: contain; border: 0; }
.set-gallery-card.full-card-image.state-missing .set-gallery-card-body { opacity: 1; }
.set-gallery-card.full-card-image.rarity-unique img { filter: drop-shadow(0 0 10px rgba(77, 238, 234, .7)) drop-shadow(7px 7px 0 #ff3cac); }
.set-gallery-card.full-card-image.rarity-mythical img { filter: drop-shadow(0 0 12px #e2443899) drop-shadow(7px 7px 0 #d8243f); }
.set-gallery-card.full-card-image.rarity-celestial img { filter: drop-shadow(0 0 13px #8edfffaa) drop-shadow(7px 7px 0 #776de8); }
.set-gallery-card.full-card-image.state-missing img { opacity: .32; filter: grayscale(1); }
.set-card-unknown { display: grid; place-items: center; background: #25252d; color: white; font-size: 4rem; font-weight: 1000; }
.set-gallery-card h3 { margin: 12px 12px 4px; font-size: 1rem; }
.set-gallery-card p { margin: 0 12px 14px; font-size: .75rem; font-weight: 700; opacity: .7; }
@media (max-width: 560px) {
    .set-gallery-card h3 { font-size: .8rem; }
}
.set-gallery-item { min-width: 0; width: 100%; max-width: 340px; justify-self: center; display: grid; align-content: start; gap: 12px; }
.set-gallery-item > .card-preview-button { width: 100%; color: inherit; text-decoration: none; }
.set-card-owner { margin: 0; font-size: .85rem; font-weight: 750; text-align: center; overflow-wrap: anywhere; }
.set-card-owner a { color: inherit; text-decoration: underline; text-underline-offset: .15em; }
.set-card-owner a:focus-visible { outline: 3px solid #ff5d8f; outline-offset: 3px; }
.set-gallery-item .trading-card { width: 100%; }
.set-gallery-item.state-missing .card-art { opacity: .32; }
.set-sale-link { display: block; padding: 10px; border: 2px solid #25252d; border-radius: 7px; background: #9bf6ff; color: #25252d; font-weight: 850; text-align: center; }
.set-sale-link:focus-visible { outline: 3px solid #ff5d8f; outline-offset: 3px; }

.set-wishlist-toggle { display: inline-block; padding: 8px 14px; border: 3px solid #25252d; border-radius: 8px; background: #fff; font: inherit; font-weight: 900; cursor: pointer; box-shadow: 3px 3px 0 #25252d; }
.set-wishlist-toggle[aria-pressed="true"] { background: #ffd6a5; }
.set-wishlist-toggle:disabled { cursor: progress; opacity: .6; }

.set-completion { display: grid; gap: 12px; margin: 22px 0; padding: 18px 20px; border: 3px solid #25252d; border-radius: 12px; background: #fff; box-shadow: 5px 5px 0 #25252d; }
.set-completion h2 { font-size: 1.2rem; font-weight: 1000; }
.set-completion header p { color: #625c6d; font-weight: 800; }
.set-completion-list { display: grid; gap: 8px; max-height: 320px; overflow-y: auto; }
.set-completion-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 12px; border: 2px solid #25252d; border-radius: 8px; font-weight: 900; cursor: pointer; }
.set-completion-card.is-unavailable { color: #625c6d; cursor: default; opacity: .7; }
.set-completion-card input { width: 18px; height: 18px; accent-color: #25252d; }
.set-completion-card span { display: grid; gap: 2px; min-width: 0; }
.set-completion-card small { color: #625c6d; font-size: .74rem; font-weight: 800; text-transform: capitalize; }
.set-completion-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.set-completion-actions strong { font-weight: 1000; }
#setCompletionAdd { padding: 10px 18px; border: 3px solid #25252d; border-radius: 8px; background: #b9fbc0; font: inherit; font-weight: 1000; cursor: pointer; box-shadow: 3px 3px 0 #25252d; }
#setCompletionAdd:disabled { cursor: not-allowed; opacity: .55; }