/* Four finishes remain distinguishable with no hover, WebGL or motion. */
.art-card.rarity-N{--frame-color:#889599;--frame-width:1px;--frame-paint:linear-gradient(145deg,#839093,#455057 50%,#9aa4a4);border-color:#6c7b80;box-shadow:0 7px 18px #0005}
.art-card.rarity-R{--frame-color:#8ee7ff;--frame-width:2px;--frame-paint:linear-gradient(135deg,#e8ffff,#61c6f5 22%,#275b85 46%,#eaffff 64%,#6dc7eb 83%,#b2edff);border-color:#9ce7ff;box-shadow:0 0 0 1px #3f9abb66,0 0 16px #5dcdf01f,0 8px 24px #0005}
.art-card.rarity-SR{--frame-color:#d8a4ff;--frame-width:3px;--frame-paint:linear-gradient(135deg,#b3fbff,#a59cff 19%,#f6a3ef 39%,#fff5c8 53%,#83ebff 69%,#d6a5ff 87%,#ffb3e1);border-color:#d3afff;box-shadow:0 0 0 1px #c38aff88,0 0 21px #aa72e938,0 8px 24px #0006}
.art-card.rarity-SSR{--frame-color:#ffe198;--frame-width:5px;--frame-paint:linear-gradient(135deg,#fff7d4 2%,#e5bd65 14%,#926023 28%,#fff1b3 39%,#c99840 53%,#ffefbb 68%,#906027 82%,#f6d588 96%);border-color:#ffe3a0;box-shadow:0 0 0 1px #f2d38d,0 0 24px #eab34748,0 0 48px #e4aa3522,0 9px 30px #0007}
.art-card>.rarity-frame{position:absolute;inset:0;z-index:4;border-radius:inherit;padding:var(--frame-width);background:var(--frame-paint);pointer-events:none;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.art-card.rarity-N::after{inset:5px;z-index:4;border:1px solid #ffffff17;background:none}
.art-card.rarity-R::after{content:"";position:absolute;inset:7px;z-index:4;border:1px solid #a9efff70;border-radius:6px;background:none;box-shadow:inset 0 0 9px #95dfff16;pointer-events:none}
.art-card.rarity-SR::after{inset:8px;z-index:4;border:1px solid #edc1ff99;border-radius:5px;background:none;box-shadow:inset 0 0 12px #b087ff20}
.art-card.rarity-SSR::after{inset:9px;z-index:4;border:1px solid #ffe6a793;border-radius:4px;background:linear-gradient(#ffe4a7,#ffe4a7) left top/18px 2px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) left top/2px 18px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) right top/18px 2px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) right top/2px 18px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) left bottom/18px 2px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) left bottom/2px 18px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) right bottom/18px 2px no-repeat,linear-gradient(#ffe4a7,#ffe4a7) right bottom/2px 18px no-repeat;box-shadow:inset 0 0 16px #f9cb4d25}
.art-card>.rarity-fx{position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;mix-blend-mode:screen;opacity:0;mask-image:linear-gradient(#000 0%,#000 38%,transparent 76%)}
.rarity-R>.rarity-fx{opacity:.2;background:linear-gradient(115deg,transparent 20%,#90e0ff22 38%,#cdf7ff80 43%,transparent 51%),radial-gradient(ellipse at var(--light-x,28%) var(--light-y,22%),#b3ecff55,transparent 60%)}
.rarity-SR>.rarity-fx{opacity:.32;background:repeating-linear-gradient(125deg,#91f5ff00 0%,#91f5ff77 12%,#b58aff66 24%,#ff99dc66 36%,#ffe8a655 48%,#91f5ff00 60%),radial-gradient(ellipse at var(--light-x,35%) var(--light-y,30%),#f9d6ff88,transparent 58%);background-size:220% 180%,100% 100%;background-position:var(--light-x,35%) var(--light-y,30%),center}
.rarity-SSR>.rarity-fx{opacity:.7;background:radial-gradient(circle at 16% 18%,#fff8d9 0 1px,#ffd77a55 2px,transparent 5px),radial-gradient(circle at 82% 31%,#fff8d9 0 1px,#ffd77a66 2px,transparent 5px),radial-gradient(circle at 73% 11%,#fff7d5 0 1px,transparent 3px),radial-gradient(circle at 25% 49%,#fff7d5 0 1px,transparent 3px),radial-gradient(circle at 90% 56%,#fff7d5 0 1px,transparent 3px),radial-gradient(ellipse at var(--light-x,50%) var(--light-y,18%),#ffd07555,transparent 63%),linear-gradient(120deg,transparent 25%,#ffdfa432 42%,transparent 60%)}
.rarity-SSR>.rarity-fx::before,.rarity-SSR>.rarity-fx::after{content:"";position:absolute;width:20px;height:20px;left:13%;top:16%;background:linear-gradient(transparent,#fff4cf,transparent) center/1px 100% no-repeat,linear-gradient(90deg,transparent,#fff4cf,transparent) center/100% 1px no-repeat;filter:drop-shadow(0 0 3px #ffd17b)}
.rarity-SSR>.rarity-fx::after{left:80%;top:29%;width:14px;height:14px}
.art-card.holo-active.rarity-R>.rarity-fx{opacity:.4}
.art-card.holo-active.rarity-SR>.rarity-fx{opacity:.48}
.art-card.holo-active.rarity-SSR>.rarity-fx{opacity:.85}
.art-card .card-meta{align-items:flex-start;letter-spacing:.5px;gap:5px;z-index:5}
.art-card .card-meta>span:first-child{padding-top:5px;line-height:1.4;min-width:0}
.art-card .rarity-label{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:45px;flex-shrink:0;padding:4px 6px;border:1px solid var(--frame-color);border-radius:5px;color:var(--frame-color);background:#121b24e8;box-shadow:0 2px 7px #0006;line-height:1;font-size:11px;letter-spacing:.3px}
.rarity-label svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.rarity-label b{font-weight:800}
.art-card.rarity-N .rarity-label{border-color:#758389;color:#d0d8db;background:#1c272de8}
.art-card.rarity-R .rarity-label{background:linear-gradient(130deg,#18445d,#071b31);color:#c9f8ff}
.art-card.rarity-SR .rarity-label{background:linear-gradient(120deg,#4a2868,#273b72);color:#f6d9ff;box-shadow:0 0 10px #d29bff40}
.art-card.rarity-SSR .rarity-label{border-color:#fff0bd;background:linear-gradient(135deg,#fff0b8,#d5a64d 68%,#f7d889);color:#3b270b;box-shadow:0 0 12px #ffc95b5c}
.rarity-SSR .rarity-label svg{fill:#61420b25;stroke-width:1.9}
.art-card .finish-name{color:var(--frame-color);font-weight:650;letter-spacing:1.5px}
.art-card.rarity-N .finish-name{color:#bdc7ca}
.art-card.rarity-SSR .card-bottom{border-color:#e8c47770}
.art-card.rarity-SSR .art-title{color:#ffe8ad}
.card-footer{gap:7px;align-items:flex-start}
.card-footer>span:last-child{flex-shrink:0}
.collection-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px}
.collection-tools .holo-hint{margin:0}
.collection-tools .text-button{color:var(--lime);white-space:nowrap;font-size:12px;min-height:44px}
.rarity-dialog{width:min(1180px,96vw);padding:30px}
.comparison-note{font-size:12px;color:var(--muted);line-height:1.8}
.rarity-preview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;margin:28px 0 18px;padding:8px}
.rarity-example{min-width:0}
.rarity-example h3{margin:18px 0 3px;font:700 18px ui-monospace,monospace;color:var(--text)}
.rarity-example h3 span{font-size:12px;font-weight:400;color:var(--muted);margin-left:7px}
.rarity-example p{margin:0;color:var(--muted);font-size:11px}
.rarity-preview-grid .collectible{cursor:grab}
.rarity-example .card-name{font-size:22px}
@media(max-width:760px){.art-card .rarity-label{font-size:10px;min-width:40px;padding:4px;gap:3px}.rarity-label svg{width:11px;height:11px}.art-card .card-meta{font-size:8px;letter-spacing:.2px}.art-card .card-bottom{letter-spacing:.4px}.art-card .finish-name{letter-spacing:.6px}.collection-tools{gap:8px;align-items:flex-start}.collection-tools .holo-hint{max-width:60%;line-height:1.8}.collection-tools .text-button{font-size:10px}.rarity-dialog{padding:20px 14px}.rarity-dialog .dialog-header h2{font-size:20px}.rarity-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:23px 14px;margin:18px 0;padding:5px}.rarity-preview-grid .collectible{padding:12px}.rarity-example .card-name{font-size:17px}.rarity-example .card-tagline{font-size:8px;min-height:26px}.rarity-example .card-bottom{font-size:7px;margin-top:9px;padding-top:8px}.rarity-example .art-title{font-size:7px;letter-spacing:1px}.rarity-example h3{font-size:16px;margin-top:12px}.rarity-example p{font-size:9px}.comparison-note{font-size:10px}}