#mount-system{
  z-index:2147482500!important;
  padding:clamp(8px,2vw,24px);
  background:radial-gradient(circle at 50% 20%,rgba(30,126,116,.22),rgba(1,7,10,.86) 55%,rgba(0,0,0,.94));
}
#mount-system .mount-window{
  width:min(1180px,96vw);
  max-height:min(900px,94vh);
  overflow:hidden;
  border:1px solid #3a877f;
  border-radius:20px;
  background:linear-gradient(145deg,#0e252b 0%,#07171d 58%,#061116 100%);
  box-shadow:0 28px 80px #000c,0 0 0 1px #e8c65a22 inset;
}
#mount-system .mount-window>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:20px 24px;
  border-bottom:1px solid #28505a;
  background:linear-gradient(90deg,#123847,#0b242b 65%,#1f281c);
}
#mount-system .mount-window>header small,.mount-collection-hero small{
  display:block;
  color:#68e7d0;
  font:800 11px/1.1 Arial,sans-serif;
  letter-spacing:.17em;
}
#mount-system .mount-window>header h2{
  margin:4px 0 2px;
  color:#ffe06b;
  font:900 clamp(22px,3vw,34px)/1 Georgia,serif;
}
#mount-system .mount-window>header p{margin:6px 0 0;color:#a9c7ce;font-size:13px}
#mount-system .mount-window>header button{
  width:46px;height:46px;flex:0 0 auto;border:1px solid #a37d18;border-radius:13px;
  color:#ffe477;background:#2b2108;font-size:28px;cursor:pointer;
}
.mount-collection-hero{
  display:grid;
  grid-template-columns:minmax(180px,.75fr) minmax(220px,1fr) minmax(280px,1.4fr);
  gap:14px;
  align-items:center;
  margin:18px 20px 10px;
  padding:16px 18px;
  border:1px solid #796522;
  border-radius:15px;
  background:linear-gradient(115deg,#122f33,#10272c 58%,#2a250e);
}
.mount-collection-hero>div{display:grid;gap:6px}
.mount-collection-hero strong{color:#fff0a0;font-size:20px}
.mount-collection-hero span,.mount-collection-hero p{color:#b8d1d5;font-size:12px}
.mount-collection-hero p{margin:0;line-height:1.55}.mount-collection-hero p b{color:#ffe579}
.mount-progress{height:8px;overflow:hidden;border-radius:99px;background:#071216;box-shadow:0 0 0 1px #34545c inset}
.mount-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#25d2ac,#ffe165);transition:width .3s ease}
.mount-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:11px;
  max-height:calc(min(900px,94vh) - 230px);
  overflow:auto;
  padding:10px 20px 22px;
  scrollbar-color:#4dcdb4 #07171c;
}
.mount-card{
  position:relative;
  display:grid;
  grid-template-columns:94px minmax(0,1fr);
  grid-template-rows:1fr auto;
  column-gap:10px;
  min-height:150px;
  padding:10px;
  border:1px solid #284a54;
  border-radius:14px;
  background:linear-gradient(145deg,#102c34,#08191f);
  box-shadow:0 8px 22px #0005;
}
.mount-card.owned{border-color:#3e9b8a}.mount-card.active{border-color:#ffe05b;box-shadow:0 0 22px #d3ad2640,0 8px 22px #0006}
.mount-card canvas{align-self:center;width:94px;height:94px;image-rendering:pixelated;filter:drop-shadow(0 8px 7px #0008)}
.mount-card.locked canvas{filter:grayscale(.72) brightness(.55) drop-shadow(0 8px 7px #0008)}
.mount-card>div{display:flex;min-width:0;flex-direction:column;justify-content:center;gap:5px}
.mount-card strong{overflow:hidden;color:#f5fbfc;font-size:15px;text-overflow:ellipsis;white-space:nowrap}
.mount-card small{color:#86b9c1;font-size:10px;line-height:1.35}.mount-card span{color:#67dfc8;font:900 10px/1 Arial,sans-serif;letter-spacing:.08em}.mount-card.locked span{color:#f5cf55}
.mount-card button{
  grid-column:1/-1;
  min-height:36px;
  margin-top:8px;
  border:1px solid #3c9c89;
  border-radius:9px;
  color:#dffff8;
  background:#146453;
  font:900 10px/1 Arial,sans-serif;
  letter-spacing:.06em;
  cursor:pointer;
}
.mount-card.locked button{border-color:#9e7a1b;color:#fff0a1;background:#4a380b}.mount-card.active button{border-color:#d2ab2c;color:#ffe780;background:#5d4710}.mount-card button:disabled{opacity:.5;cursor:wait}
.diamond-mount-preview{width:96px!important;height:96px!important;image-rendering:pixelated;filter:drop-shadow(0 8px 8px #0008)}

@media(max-width:900px){
  .mount-collection-hero{grid-template-columns:1fr 1fr}.mount-collection-hero>p{grid-column:1/-1}
  .mount-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  #mount-system{padding:4px}.mount-collection-hero{grid-template-columns:1fr;margin:8px;padding:12px}.mount-collection-hero>p{grid-column:auto}
  .mount-grid{grid-template-columns:1fr;max-height:calc(100vh - 275px);padding:8px}.mount-card{min-height:132px}
  #mount-system .mount-window>header{padding:12px 14px}.mount-window>header p{display:none}
}
