#showcase-gallery { width:min(1260px,calc(100vw - 28px)); max-width:none; max-height:calc(100dvh - 36px); border:1px solid #6582ac55; border-radius:20px; padding:24px; background:radial-gradient(ellipse at 50% 0,#233650,#0c1627 75%); color:#edf2ff; text-align:center; overflow:auto; }
#showcase-gallery::backdrop { background:#030812cf; backdrop-filter:blur(5px); }
.showcase-gallery-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; text-align:left; }
.showcase-gallery-heading h2 { margin:0; font-size:25px; }
.showcase-gallery-heading p { margin:6px 0 0; }
#showcase-gallery-close { margin:0; padding:5px 12px; font-size:25px; background:#ffffff09; color:#d5e3f9; border-color:#ffffff22; }
.showcase-gallery-help { margin:20px 0; color:#aebfd6; font-size:13px; }
.showcase-gallery-slots { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); align-items:start; gap:18px; margin:28px 0 12px; }
.showcase-slot { min-width:0; }
.showcase-slab { position:relative; border:2px solid #d7edff85; border-radius:14px; padding:10px 10px 18px; background:linear-gradient(115deg,#e1f0ff35,#c6deff0b 26%,#ffffff24 50%,#a0c9f014 72%,#d7eaff36); box-shadow:inset 0 0 0 3px #f1f8ff15,inset 0 0 14px #fff2,0 14px 23px #0005; }
.showcase-slab::before { content:''; position:absolute; inset:5px; border:1px solid #ffffff27; border-radius:9px; pointer-events:none; }
.showcase-slab::after { content:''; position:absolute; left:22%; right:22%; bottom:7px; height:3px; border-radius:5px; background:#dcefff33; pointer-events:none; }
.slab-label { display:flex; flex-direction:column; justify-content:center; gap:5px; min-height:90px; margin-bottom:12px; padding:9px 5px; border:1px solid #d9eaff80; border-radius:3px; background:linear-gradient(140deg,#172235e6,#263e52c9); text-align:center; }
.slab-rgb { color:#c0dbff; background:linear-gradient(100deg,#ffabc8,#ffe6a2,#b3f5cc,#9cdcff,#cdb5ff,#ffabc8); background-size:250% 100%; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:slab-rainbow 7s linear infinite; }
.slab-rarity { font-weight:800; font-size:12px; line-height:1.3; }
.slab-set { font-size:11px; line-height:1.3; font-weight:600; }
.slab-info { font-size:9px; line-height:1.45; overflow-wrap:anywhere; }
.showcase-slab .slab-card { display:block; width:100%; aspect-ratio:367/512; min-height:0; padding:0; margin:0; border:0; border-radius:6px; background:#0c1424; }
.slab-card .card-art { position:absolute; inset:0; width:100%; height:100%; min-height:0; border-radius:inherit; background:transparent; }
.slab-card .full-scan { width:100%; height:100%; object-fit:contain; }
.slab-card[data-showcased="true"] .card-art { opacity:0; }
.slab-empty { display:grid; place-items:center; width:100%; min-height:300px; margin:0; padding:16px; border:1px dashed #7f9abd70; border-radius:14px; background:#ffffff03; color:#a9bdd9; font-size:13px; font-weight:500; }
.slab-empty:hover { background:#ffffff08; }
.slab-remove { margin:10px 0 0; padding:6px 12px; border:0; background:transparent; color:#9fb4d0; font-size:11px; font-weight:400; }
.slab-remove:hover { color:#e8f1ff; background:#ffffff08; }
#showcase-pin { margin:12px 0 0; padding:9px 16px; border-color:#7da7ce66; background:#233a53; color:#dfedff; font-size:12px; }
#showcase-pin-status { min-height:16px; margin:6px 0 0; font-size:11px; }
#card-showcase:not([data-state="open"]) :is(#showcase-pin, #showcase-pin-status) { visibility:hidden; pointer-events:none; }
@keyframes slab-rainbow { to { background-position:250% 0; } }
@media(max-width:1000px) { .showcase-gallery-slots { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:650px) { #showcase-gallery { padding:18px 14px; } .showcase-gallery-slots { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } .slab-label { min-height:86px; } .slab-empty { min-height:265px; } }
@media(max-width:370px) { .showcase-gallery-slots { grid-template-columns:minmax(0,250px); justify-content:center; } }
@media(prefers-reduced-motion:reduce) { .slab-rgb { animation:none; } #showcase-gallery::backdrop { backdrop-filter:none; } }