/* Collection ownership (M1): a locked card reads as locked at a glance: softened art and a lock badge on the picture,
   before its Shop link or source line is scrolled into view. Text keeps the 11px floor and 4.5:1 contrast. */
:is(.skin-card,.balloon-card,.trail-card)[data-locked=true]{position:relative}
.skin-card[data-locked=true] .character-card-art,.balloon-card[data-locked=true] .balloon-card-art,.trail-card[data-locked=true] canvas{filter:grayscale(.55) brightness(.94)}
:is(.skin-card,.balloon-card,.trail-card)[data-locked=true]::after{content:"";position:absolute;top:10px;right:10px;z-index:4;width:30px;height:30px;border-radius:50%;
 background:#fffbe8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b4312' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3'/%3E%3Crect x='5' y='10' width='14' height='11' rx='2'/%3E%3C/svg%3E") center/17px no-repeat;
 border:2px solid #f3d98e;box-shadow:0 2px 0 #c79d4c;pointer-events:none}
.collection-lock-icon{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
[data-collection-shop]{display:inline-flex;align-items:center;justify-content:center;gap:5px;background:linear-gradient(#ffe39a,#f7b54b)!important;border-color:#fff3c9!important;color:#5b3208!important;box-shadow:0 3px 0 #bf7a26!important;font-weight:900}
.collection-source{display:flex;align-items:center;justify-content:center;gap:5px;margin:8px 5px 0;min-height:38px;padding:6px 8px;border-radius:10px;background:#eef3f6;border:1px dashed #9db6c2;color:#3d5563;font:800 11px/1.25 'Nunito Sans',sans-serif;text-align:center}
.trail-card>.collection-source,.balloon-card>.collection-source{margin-top:auto}
/* Outfit cards carry a rarity stamp across their top, so their lock badge sits just below it. */
.skin-card[data-locked=true]::after{top:48px;right:12px}
/* Baseline fix (V31 already clipped the Collection's action row at 1366x768; Fable baseline-v31 06-collection-skins):
   on screens at least 601px wide and tall the card row takes the height left under the heading and the art shrinks, so
   Equip, Get in Shop and the source line are always in view. Short phone screens keep their scrolling list. */
@media (min-width:601px) and (min-height:601px){
 #profile-dialog .skins-choice{display:flex;flex-direction:column;gap:10px;min-height:0;overflow:hidden}
 #profile-dialog .skins-cards{flex:1 1 0;min-height:0;height:auto;align-items:stretch}
 #profile-dialog .skins-cards .skin-card{display:flex;flex-direction:column;min-height:0}
 #profile-dialog .skins-cards .character-card-art{flex:1 1 0;min-height:80px;aspect-ratio:auto}
 #profile-dialog .skin-description{flex:none;margin:0}
}