/* One page width; hero artwork/type treatment remains owned by adventure-menu.css. */
.collection-page:has(.adventure-hero),.learning-journal{
 box-sizing:border-box;width:100%;max-width:1320px;
 padding-inline:28px;
 padding-bottom:max(108px,calc(92px + env(safe-area-inset-bottom)));
}
.collection-page .adventure-hero,.learning-journal .adventure-hero{max-width:none}
.collection-page .collection-grid{
 display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;align-items:stretch;
}
.collection-page .collection-card{
 --rarity-edge:#c4a476;--edge:var(--rarity-edge);--wash:#fffaf0;--glow:#b7996521;
 gap:5px;padding:12px 10px 10px;scroll-margin-block:90px 100px;
 border:1.5px solid var(--edge);border-radius:18px 15px 18px 16px;
 background:radial-gradient(ellipse at 50% 24%,#fffdf7,var(--wash) 75%);
 box-shadow:0 3px 0 #9c7a4923,0 5px 12px #79604413;
 transition:transform 160ms ease,box-shadow 160ms ease,border-color 160ms ease;
}
.collection-page .collection-card[data-rarity=Rare]{--rarity-edge:#82b9cf;--wash:#eff8fb;--glow:#82b9cf36}
.collection-page .collection-card[data-rarity=Epic]{--rarity-edge:#b99bd1;--wash:#f8f0fc;--glow:#b99bd13b}
.collection-page .collection-card[data-rarity=Legendary]{--rarity-edge:#c6a054;--wash:#fff3d6;--glow:#d8b25c45}
.collection-page .collection-card::before{inset:4px;border:1px solid var(--edge);opacity:.65;border-radius:13px 11px 14px 12px}
.collection-page .collection-card::after{
 inset:7px;background:var(--edge);opacity:.55;
 mask:url('assets/collectibles/card-ornaments.svg') center/100% 100% no-repeat;
}
.collection-page .collection-card[data-rarity=Legendary]::after{opacity:.85}
.collection-art-stage{
 display:grid;place-items:center;position:relative;isolation:isolate;
 width:100%;height:120px;margin:0;overflow:hidden;border-radius:12px;
}
.collection-art-stage::before{
 content:'';position:absolute;inset:5%;z-index:-1;border-radius:50%;
 background:radial-gradient(ellipse,#fffef7e6,var(--glow) 55%,transparent 72%);
 transition:opacity 160ms ease;opacity:.65;
}
.collection-page .collection-card .collection-art{width:100%;height:100%;max-height:120px;aspect-ratio:auto;object-fit:contain;transition:transform 160ms ease,filter 160ms ease}
.collection-page .collection-card .collection-art-button{width:100%;padding:0;min-height:44px;margin:0}
.collection-page .collection-card h3{
 align-self:stretch;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:38px;
 min-height:38px;margin:0;padding:3px 7px;font-size:12px;line-height:1.2;
 background:#fffaf0a6;border:1px solid #b7a08042;border-radius:9px 11px 8px 10px;
 color:#244665;overflow-wrap:anywhere;
}
.collection-page .collection-card .collection-tags{min-height:20px;gap:4px}
.collection-page .collection-card .collection-rarity{font-size:10px;padding:2px 8px;border:1px solid #b7a08066}
.collection-page .collection-card .collection-price{margin:0;min-height:20px;font-size:11px;line-height:1.2;color:#69502f}
.collection-page .collection-card .collection-price .collection-coin{width:16px;height:16px}
.collection-page .collection-card>.collection-button{
 min-height:44px;padding:7px 5px;font-size:12px;line-height:1.2;
 border:1px solid #2f4d3b;background:#3E5948;color:#fffaf0;
 border-radius:10px 12px 9px 11px;box-shadow:0 2px 0 #263f3280;
}
.collection-page .collection-card>.collection-button:disabled{background:#ece8dd;border-color:#bcb2a2;color:#5f584c;box-shadow:inset 0 1px 2px #79604418;cursor:default}
.collection-page .collection-card[data-state=owned]>.collection-button:disabled{background:#DCE8CF;color:#3E5948;border-color:#A4BD9A}
.collection-page .collection-card .collection-owned{
 position:absolute;z-index:3;top:8px;right:8px;
 display:flex;align-items:center;gap:3px;margin:0;padding:2px 6px 2px 2px;
 background:#eff5e5;border:1px solid #a4bd9a;border-radius:12px 14px 11px 13px;
 pointer-events:none;font-size:9px;line-height:1;font-weight:900;color:#3E5948;box-shadow:0 2px 3px #7960441a;
}
.collection-state-icon{display:block;width:29px;height:29px;flex-shrink:0}
.collection-lock{position:absolute;z-index:3;top:8px;right:8px;width:33px;height:33px;padding:3px;background:#f4eee3;border:1px solid #b7a080;border-radius:50%;box-shadow:0 2px 3px #79604418}
.collection-lock .collection-state-icon{width:25px;height:25px}
.collection-page .collection-card[data-state=insufficient]{--edge:color-mix(in srgb,var(--rarity-edge) 55%,#b9b0a0);--wash:#f5f1e8;--glow:#b9b0a01a}
.collection-page .collection-card[data-state=insufficient] .collection-art{filter:saturate(.5)}
.collection-page .collection-card:focus-within{outline:2px solid #3E5948;outline-offset:3px;box-shadow:0 5px 14px var(--glow)}
.collection-page .collection-card :focus-visible{outline:3px solid #3E5948;outline-offset:2px}
@media(hover:hover) and (pointer:fine){
 .collection-page .collection-card:is([data-state=available],[data-state=owned]):hover{transform:translateY(-4px);box-shadow:0 5px 0 #9c7a4923,0 10px 20px var(--glow)}
 .collection-page .collection-card:is([data-state=available],[data-state=owned]):hover .collection-art{transform:scale(1.04)}
 .collection-page .collection-card:hover .collection-art-stage::before{opacity:1}
 .collection-page .collection-card>.collection-button:hover:not(:disabled){background:#496b54;transform:none;box-shadow:0 2px 0 #263f3280}
}
.collection-page .collection-card[data-state]:active,.collection-page .collection-card[data-state].is-pressed{transform:translateY(1px);box-shadow:inset 0 1px 3px #79604425,0 2px 5px var(--glow)}
.collection-page .collection-card>.collection-button:active:not(:disabled){background:#304b3a;box-shadow:inset 0 2px 3px #172c2740}
@media(max-width:1199px){
 .collection-page .collection-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:601px) and (max-width:1100px){
 .collection-page .collection-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
 .collection-art-stage{height:108px}.collection-page .collection-card .collection-art{max-height:108px}
}
@media(min-width:601px) and (max-width:1400px) and (any-pointer:coarse){
 .collection-page .collection-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
 .collection-page:has(.adventure-hero),.learning-journal{padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right))}
}
@media(max-width:600px){
 .collection-page .collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .collection-page .collection-card{padding:9px 8px 8px;gap:4px}
 .collection-art-stage{height:92px}.collection-page .collection-card .collection-art{max-height:92px}
 .collection-page .collection-card h3{min-height:38px;font-size:11px;padding:3px 5px}
 .collection-page .collection-card .collection-tags{min-height:19px}
 .collection-page .collection-card>.collection-button{font-size:11px;padding:6px 3px}
 .collection-page .collection-card .collection-owned{font-size:9px;top:6px;right:6px;padding-right:4px;gap:1px}
 .collection-state-icon{width:24px;height:24px}
}
@media(prefers-reduced-motion:reduce){
 .collection-page .collection-card,.collection-page .collection-card .collection-art,.collection-art-stage::before{transition:none!important}
 .collection-page .collection-card:hover,.collection-page .collection-card:active,.collection-page .collection-card.is-pressed,.collection-page .collection-card:hover .collection-art{transform:none!important}
}