/* === MRU-style активы для стакана === */
.assets{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
  margin-top: 12px;
}

.asset{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 18px;
  border-radius: 12px;
  font-weight: 900;
  letter-spacing: .7px;
  text-transform: uppercase;
  cursor: pointer;
  user-select: none;
  transition: all .25s ease;
  overflow: hidden;
}

/* === ЗОЛОТО (XAUUSDT) === */
.asset.gold{
  --c:#FFD700;
  color:#FFD700;
  border:2px solid var(--c);
  background:linear-gradient(135deg,#2c2500,#5a4d00,#FFD700);
  background-size:250% 250%;
  animation:goldFlow 4s ease-in-out infinite, borderPulseGold 2s ease-in-out infinite;
  box-shadow:0 0 14px rgba(255,215,0,.25);
}
@keyframes goldFlow{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
@keyframes borderPulseGold{
  0%,100%{box-shadow:0 0 0 rgba(0,0,0,0);}
  50%{box-shadow:0 0 22px rgba(255,215,0,.8);}
}

/* === БИТКОИН (BTCUSDT) === */
.asset.btc{
  --c:#FFA500;
  color:#FFA500;
  border:2px solid var(--c);
  background:linear-gradient(135deg,#3a2000,#994f00,#FFA500);
  background-size:250% 250%;
  animation:btcFlow 4s ease-in-out infinite, borderPulseBTC 2s ease-in-out infinite;
  box-shadow:0 0 14px rgba(255,165,0,.25);
}
@keyframes btcFlow{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
@keyframes borderPulseBTC{
  0%,100%{box-shadow:0 0 0 rgba(0,0,0,0);}
  50%{box-shadow:0 0 22px rgba(255,165,0,.8);}
}

/* === СОЛАНА (SOLUSDT) === */
.asset.sol{
  --c:#1E90FF;
  color:#1E90FF;
  border:2px solid var(--c);
  background:linear-gradient(135deg,#001d3d,#0055a8,#1E90FF);
  background-size:250% 250%;
  animation:solFlow 4s ease-in-out infinite, borderPulseSOL 2s ease-in-out infinite;
  box-shadow:0 0 14px rgba(30,144,255,.25);
}
@keyframes solFlow{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
@keyframes borderPulseSOL{
  0%,100%{box-shadow:0 0 0 rgba(0,0,0,0);}
  50%{box-shadow:0 0 22px rgba(30,144,255,.8);}
}

/* === TON (TONUSDT) === */
.asset.ton{
  --c:#00BFFF;
  color:#00BFFF;
  border:2px solid var(--c);
  background:linear-gradient(135deg,#002d3d,#0078a8,#00BFFF);
  background-size:250% 250%;
  animation:tonFlow 4s ease-in-out infinite, borderPulseTON 2s ease-in-out infinite;
  box-shadow:0 0 14px rgba(0,191,255,.25);
}
@keyframes tonFlow{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
@keyframes borderPulseTON{
  0%,100%{box-shadow:0 0 0 rgba(0,0,0,0);}
  50%{box-shadow:0 0 22px rgba(0,191,255,.8);}
}

/* 🖱 Наведение и клик — эффект MRU */
.asset:hover{
  transform:scale(1.04);
  box-shadow:0 0 22px var(--c), inset 0 0 14px rgba(255,255,255,.1);
}
.asset:active{
  transform:scale(1.1);
  filter:brightness(1.25);
}