/* Original PSD frames, with editable type and stats layered above them. */
[data-faction]{--faction-color:#0c60e8;--card-frame:url('/assets/artist/frames/market-makers.png')}
[data-faction="Market Makers"]{--faction-color:#0c60e8;--card-frame:url('/assets/artist/frames/market-makers.png')}
[data-faction="Community Leaders"]{--faction-color:#00a958;--card-frame:url('/assets/artist/frames/community-leaders.png')}
[data-faction="Traders & Speculators"]{--faction-color:#c90922;--card-frame:url('/assets/artist/frames/traders.png')}
[data-faction="Crypto Creatures"]{--faction-color:#960de0;--card-frame:url('/assets/artist/frames/crypto-creatures.png')}
[data-faction="Creators"]{--faction-color:#ed6b08;--card-frame:url('/assets/artist/frames/creators.png')}
[data-faction="Idle Earners"]{--faction-color:#efd91b;--card-frame:url('/assets/artist/frames/idle-earners.png')}
[data-faction="Specials"]{--faction-color:#3c3c3c;--card-frame:url('/assets/artist/frames/specials.png')}
.hand-card,.hand-card.rarity-rare,.hand-card.rarity-epic,.hand-card.rarity-legendary,.collection-card,.studio-card{background:var(--card-frame) center/100% 100% no-repeat;image-rendering:pixelated;border:0;outline:none;box-shadow:3px 5px #0008;padding:0;color:white;isolation:isolate}
.hand-card .card-title{position:absolute;left:7%;top:3.3%;width:75%;height:8.7%;min-height:0;padding:0;margin:0;font:16px/.9 VT323;text-shadow:1px 1px #000;overflow:hidden;text-transform:none}
.hand-card.long-name .card-title{font-size:14px;line-height:.88;min-height:0;height:9%;overflow-wrap:normal}
.hand-card .card-cost{top:3.7%;right:6%;left:auto;width:20px;height:20px;font:20px/16px VT323;border:2px solid #473717;background:#efa42c;color:white;box-shadow:inset 1px 1px #ffe982}
.hand-card .card-art,.hand-card.long-name .card-art{position:absolute;left:3.8%;top:13.4%;width:92.4%;height:52.3%;border:0;margin:0;background:#ffe86b;overflow:hidden}
.hand-card .card-art canvas{width:100%;height:100%;object-fit:contain;max-height:none}
.hand-card .card-ability{position:absolute;top:66%;left:6%;width:88%;height:6%;padding:0;justify-content:flex-start;text-align:left;font:12px/1 VT323;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hand-text{position:absolute;left:8%;top:74%;right:8%;height:14%;font:14px/.92 VT323;overflow:hidden;text-align:left;color:#f2ecde;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.hand-card .card-stats{position:absolute;bottom:3.4%;left:8%;right:8%;height:9%;padding:0;background:transparent;display:flex;justify-content:flex-start;gap:4px}
.hand-card .card-stats .health{order:1}.hand-card .card-stats .attack{order:0}.hand-card .card-stats .type{order:2;margin-left:auto;font:12px VT323;text-transform:uppercase;color:#c9ba81}
.hand-card .card-stats .health,.hand-card .card-stats .attack{font:21px/.8 VT323;min-width:21px;height:21px;box-shadow:inset 1px 1px #fff6;border:1px solid #000}
.hand-card.playable{filter:drop-shadow(0 0 2px #81fbd4)}
.hand-card:hover,.hand-card:focus-visible{outline:2px solid #ffe76a;outline-offset:2px;filter:drop-shadow(0 0 4px #ffe76a)}
.hand-card.selected{outline:3px solid #ff4b91;outline-offset:2px}
[data-faction="Idle Earners"] .card-title,[data-faction="Idle Earners"] .card-ability,[data-faction="Idle Earners"] h3,[data-faction="Idle Earners"] .studio-card-title,[data-faction="Idle Earners"] .studio-card-type{color:#1a180c;text-shadow:none}
.collection-card{border:0;padding:0;box-shadow:none;background:none}
.collection-inspect{display:block;position:relative;width:100%;aspect-ratio:212/306;height:auto;padding:0;background:var(--card-frame) center/100% 100% no-repeat;image-rendering:pixelated}
.collection-card h3,.collection-card.long-name h3{position:absolute;top:3.5%;left:7%;width:76%;height:8%;min-height:0;margin:0;padding:0;font:20px/.9 VT323;overflow:hidden;text-transform:none;overflow-wrap:normal}
.collection-card.long-name h3{font-size:18px}
.collection-card .card-cost{top:4%;right:6%;width:24px;height:24px;font-size:23px;border-width:2px}
.collection-card .collection-art{position:absolute;top:13.4%;left:3.8%;width:92.4%;height:52.3%;min-height:0;border:0;margin:0;background:#ffe86b}
.collection-card .collection-art canvas{width:100%;height:100%;max-height:none;object-fit:contain}
.collection-card .collection-faction{position:absolute;top:66.8%;left:7%;right:7%;height:5%;font:14px/1 VT323;padding:0;margin:0;background:none;text-align:left;overflow:hidden;white-space:nowrap}
.collection-card .rarity-gem{display:none}
.collection-card .collection-inspect>p{position:absolute;top:73%;left:8%;right:8%;height:16%;min-height:0;margin:0;padding:0;background:none;font:17px/1 VT323;text-align:left;overflow:hidden}
.collection-card .collection-stats{position:absolute;bottom:3.5%;left:8%;right:8%;height:8%;min-height:0;margin:0;padding:0;background:none;display:flex;justify-content:flex-start;gap:6px;align-items:center}
.collection-stats b{font:26px/.8 VT323;padding:3px;background:#ed3c4e;color:white;min-width:28px;border:1px solid #000;box-shadow:inset 1px 1px #fff5}
.collection-stats b:nth-child(2){background:#14bc5a}.collection-stats small{font-size:12px}.collection-stats .spell-label{font-size:16px;background:transparent;border:0;box-shadow:none}
.copy-control{margin-top:4px;border:2px solid #3b4860;background:#10182a}
.studio-card{border:0;aspect-ratio:212/306;height:auto;min-height:0;position:relative;overflow:hidden;transition:transform .15s}
.studio-card:hover{transform:translateY(-4px)}
.studio-card .studio-card-title{position:absolute;left:7%;top:3.5%;right:17%;height:8%;font:20px/.95 VT323;overflow:hidden;padding:0;min-height:0}
.studio-card .studio-cost{position:absolute;right:6%;top:4%;font:22px VT323;width:24px;height:24px;padding:0;border-width:1px}
.studio-card .studio-art{position:absolute;left:3.8%;top:13.4%;width:92.4%;height:52.3%;margin:0;background:#ffe86b;border:0}
.studio-card .studio-art canvas{width:100%;height:100%;max-height:none;object-fit:contain}
.studio-card .studio-card-type{position:absolute;top:66%;left:7%;right:7%;height:6%;padding:0;overflow:hidden;font:14px/1 VT323;white-space:nowrap}
.studio-card .studio-card-text{position:absolute;top:74%;left:8%;right:8%;height:14%;min-height:0;padding:0;margin:0;overflow:hidden;font:17px/1 VT323;background:none}
.studio-card .studio-card-stats{position:absolute;left:8%;right:8%;bottom:3%;height:8%;padding:0;min-height:0;background:none}
@media(max-width:800px){.hand-card .card-title{font-size:14px}.hand-card.long-name .card-title{font-size:13px}.hand-card .card-cost{width:17px;height:17px;font-size:17px;line-height:14px}.hand-text{font-size:12px}.hand-card .card-stats .health,.hand-card .card-stats .attack{font-size:17px;height:17px;min-width:17px}.hand-card .card-stats .type{font-size:11px}.hand-card .card-ability{font-size:11px}.collection-card .collection-inspect>p{font-size:16px}}
@media(max-width:560px){.collection-card h3{font-size:18px}.collection-card.long-name h3{font-size:16px}.collection-card .collection-faction{font-size:12px}.collection-card .collection-inspect>p{font-size:15px}.hand-card .card-title{font-size:13px}.hand-card.long-name .card-title{font-size:12px}}

.mulligan-card{background:var(--faction-color,#1461d1)}
.mulligan-card.replace{background:#9a345a}
.collection-card .card-cost{left:auto}

.detail-card .collection-card h3{font:22px/.9 VT323;height:8%;min-height:0}
.detail-card .collection-card.long-name h3{font-size:18px;height:8%;min-height:0}
