/* The illustration IS the frame. No CSS/SVG ornamental frame is rendered. */
.collection-page .collection-card[data-rarity]{
 --frame-glow:#bda57838;--edge:transparent;
 box-sizing:border-box;width:100%;aspect-ratio:3/4;min-height:0;
 display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 30px 22px 44px;
 align-items:center;justify-items:center;gap:4px;padding:18.6% 16% 18%;
 border:0;border-radius:0;background:none;box-shadow:none;
 filter:drop-shadow(0 3px 3px #79604424);
 transition:transform 160ms ease,filter 160ms ease;
}
.collection-page .collection-card[data-rarity=Rare]{--frame-glow:#69bfd649}
.collection-page .collection-card[data-rarity=Epic]{--frame-glow:#bc8be356}
.collection-page .collection-card[data-rarity=Legendary]{--frame-glow:#eac35763}
.collection-page .collection-card[data-rarity]::before,
.collection-page .collection-card[data-rarity]::after,
.collection-page .collection-card .collection-art-stage::before{content:none}
.collection-page .collection-card .collection-frame-image{
 position:absolute;inset:0;z-index:-1;display:block;width:100%;height:100%;max-height:none;
 object-fit:contain;pointer-events:none;user-select:none;filter:none;transform:none;
}
.collection-page .collection-card .collection-art-stage{
 grid-row:1;grid-column:1;align-self:stretch;width:100%;height:auto;min-height:0;margin:0;overflow:hidden;background:none;
}
.collection-page .collection-card .collection-art-button{grid-row:1;grid-column:1;align-self:stretch;position:relative;height:auto;width:100%;min-height:44px}
.collection-page .collection-card .collection-art-button .collection-art-stage{position:absolute;inset:0}
.collection-page .collection-card .collection-art{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:contain;padding:3px}
.collection-page .collection-card h3{
 grid-row:2;grid-column:1;align-self:center;min-height:0;max-height:30px;max-width:80%;margin:0;padding:0;
 border:0;border-radius:0;background:none;box-shadow:none;font-size:12px;line-height:15px;
}
.collection-card-meta{grid-row:3;grid-column:1;display:flex;align-items:center;justify-content:center;gap:6px;max-width:100%;white-space:nowrap}
.collection-page .collection-card .collection-tags{min-height:0;gap:3px;flex-wrap:nowrap}
.collection-page .collection-card .collection-rarity{font-size:10px;padding:1px 7px;line-height:15px}
.collection-page .collection-card .collection-plus{font-size:9px;padding:1px 4px;line-height:15px}
.collection-page .collection-card .collection-price{min-height:0;font-size:11px;line-height:16px;white-space:nowrap;gap:3px}
.collection-price-unit{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* 70% of the card canvas; the painted 38px face sits within a 44px hit area. */
.collection-page .collection-card[data-rarity][data-state]>.collection-button{
 grid-row:4;grid-column:1;align-self:stretch;min-width:44px;min-height:44px;width:102.941176%;max-width:none;
 position:relative;margin:0;padding:4px 3px;border:0;background:none;box-shadow:none;isolation:isolate;
 font-size:11px;line-height:1.2;color:#fffaf0;
}
.collection-page .collection-card>.collection-button::before{
 content:'';position:absolute;inset:3px 4%;z-index:-1;border:1px solid #2f4d3b;border-radius:10px 12px 9px 11px;
 background:#3e5948;box-shadow:0 2px 0 #263f3260;pointer-events:none;
}
.collection-page .collection-card>.collection-button:hover:not(:disabled)::before{background:#496b54}
.collection-page .collection-card>.collection-button:active:not(:disabled)::before{background:#304b3a;box-shadow:inset 0 2px 3px #172c2740}
.collection-page .collection-card[data-rarity][data-state]>.collection-button:disabled{color:#5f584c}
.collection-page .collection-card>.collection-button:disabled::before{background:#ece8dd;border-color:#bcb2a2;box-shadow:inset 0 1px 2px #79604418}
.collection-page .collection-card[data-rarity][data-state=owned]>.collection-button{width:auto;min-width:88px;color:#3e5948}
.collection-page .collection-card[data-state=owned]>.collection-button::before{content:none}
.collection-page .collection-card .collection-owned{
 position:static;display:flex;align-items:center;justify-content:center;gap:3px;margin:0;
 padding:2px 4px;max-width:100%;font-size:10px;line-height:1.1;box-shadow:none;pointer-events:none;
}
.collection-page .collection-card[data-rarity]>.collection-button .collection-owned{background:#eff5e5;border:1px solid #a4bd9a;padding:2px 6px;min-height:28px;border-radius:12px 14px 11px 13px}
.collection-page .collection-card .collection-state-icon{width:22px;height:22px}
.collection-page .collection-card .collection-lock{top:23%;right:14%;width:30px;height:30px;padding:2px}
.collection-page .collection-card .collection-lock .collection-state-icon{width:24px;height:24px}
.collection-page .collection-card[data-owned-view]{grid-template-rows:minmax(0,1fr) 30px 22px 28px}
.collection-page .collection-card[data-owned-view]>.collection-owned{grid-row:4;grid-column:1;justify-self:center}
.collection-page .collection-card[data-rarity]:focus-within{outline:2px solid #3E5948;outline-offset:2px;box-shadow:none}
@media(hover:hover) and (pointer:fine){
 .collection-page .collection-card[data-rarity]:is([data-state=available],[data-state=owned]):hover{transform:translateY(-4px);box-shadow:none;filter:drop-shadow(0 5px 4px #7960442a) drop-shadow(0 0 6px var(--frame-glow))}
}
.collection-page .collection-card[data-rarity][data-state]:active,
.collection-page .collection-card[data-rarity][data-state].is-pressed{transform:translateY(1px);box-shadow:none;filter:drop-shadow(0 1px 2px #79604430)}
/* Cap wider tracks so 3:4 masters remain compact instead of growing on landscape tablets. */
@media(min-width:1101px) and (max-width:1199px){
 .collection-page .collection-grid{max-width:1010px;margin-inline:auto}
}
@media(min-width:601px) and (max-width:1100px){
 .collection-page .collection-grid{max-width:760px;margin-inline:auto}
}
@media(min-width:601px) and (max-width:1400px) and (any-pointer:coarse){
 .collection-page .collection-grid{max-width:760px;margin-inline:auto}
}
@media(max-width:600px){
 .collection-page .collection-card[data-rarity]{padding-block:14% 14%;gap:2px;grid-template-rows:minmax(0,1fr) 26px 18px 44px}
 .collection-page .collection-card h3{font-size:11px;line-height:13px;max-height:26px}
 .collection-page .collection-card[data-owned-view]{grid-template-rows:minmax(0,1fr) 26px 18px 26px}
 .collection-card-meta{gap:3px}
 .collection-page .collection-card .collection-rarity{font-size:9px;padding-inline:4px;line-height:14px}
 .collection-page .collection-card .collection-plus{font-size:8px;padding-inline:3px}
 .collection-page .collection-card .collection-price{font-size:10px;line-height:15px}
 .collection-page .collection-card .collection-price .collection-coin{width:14px;height:14px}
 .collection-page .collection-card .collection-owned{font-size:9px}
 .collection-page .collection-card .collection-lock{top:23%;right:14%}
}
@media(prefers-reduced-motion:reduce){
 .collection-page .collection-card[data-rarity]{transition:none!important}
 .collection-page .collection-card[data-rarity]:hover,.collection-page .collection-card[data-rarity]:active,.collection-page .collection-card[data-rarity].is-pressed{transform:none!important}
}