/* ===== 我的图标库 v1.0 ===== */

/* 基础类 */
.mi {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* 图标定义 - 使用 data URI 嵌入 SVG */
.mi-java {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23e76f00' d='M8.85 18.17s-.94.55.66.74c1.96.23 2.96.2 5.13-.22 0 0 .57.35 1.36.66-4.86 2.08-11.01-.12-7.15-1.18zm-.56-2.67s-1.05.78.55.94c2.07.21 3.7.23 6.52-.31 0 0 .4.4 1.02.62-5.79 1.7-12.24.13-8.09-1.25z'/%3E%3C/svg%3E");
}

.mi-python {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233776AB' d='M14.25.18l.9.2.73.26.59.3.45.32.34.34.25.34.16.33.1.3.04.26.02.2-.01.13V8.5l-.05.63-.13.55-.21.46-.26.38-.3.31-.33.25-.35.19-.35.14-.33.1-.3.07-.26.04-.21.02H8.83l-.69.05-.59.14-.5.22-.41.27-.33.32-.27.35-.2.36-.15.37-.1.35-.07.32-.04.27-.02.21v3.06H3.23l-.21-.03-.28-.07-.32-.12-.35-.18-.36-.26-.36-.36-.35-.46-.32-.59-.28-.73-.21-.88-.14-1.05L0 11.97l.06-1.22.16-1.04.24-.87.32-.71.36-.57.4-.44.42-.33.42-.24.4-.16.36-.1.32-.05.24-.01h.16l.06.01h8.16v-.83H6.24l-.01-2.75-.02-.37.05-.34.11-.31.17-.28.25-.26.31-.23.38-.2.44-.18.51-.15.58-.12.64-.1.71-.06.77-.04.84-.02 1.27.05 1.07.13zm-6.3 1.98l-.23.33-.08.41.08.41.23.34.33.22.41.09.41-.09.33-.22.23-.34.08-.41-.08-.41-.23-.33-.33-.22-.41-.09-.41.09-.33.22zM24 11.8v.63l-.05.64-.13.55-.21.46-.26.38-.3.31-.33.25-.35.19-.35.14-.33.1-.3.07-.26.04-.21.02h-3.17v2.75l.02.37-.05.34-.11.31-.17.28-.25.26-.31.23-.38.2-.44.18-.51.15-.58.12-.64.1-.71.06-.77.04-.84.02-1.27-.05-1.07-.13-.9-.2-.73-.26-.59-.3-.45-.32-.34-.34-.25-.34-.16-.33-.1-.3-.04-.25-.02-.2.01-.13v-5.34l.05-.64.13-.55.21-.46.26-.38.3-.31.33-.25.35-.19.35-.14.33-.1.3-.07.26-.04.21-.02h3.17V6.2l-.02-.37.05-.34.11-.31.17-.28.25-.26.31-.23.38-.2.44-.18.51-.15.58-.12.64-.1.71-.06.77-.04.84-.02 1.27.05 1.07.13.9.2.73.26.59.3.45.32.34.34.25.34.16.33.1.3.04.25.02.2-.01.13V11.8zm-6.35 3.84l-.23.34-.33.22-.41.09-.41-.09-.33-.22-.23-.34-.08-.41.08-.41.23-.33.33-.22.41-.09.41.09.33.22.23.33.08.41-.08.41zm6.35-6.35l-.23.33-.08.41.08.41.23.34.33.22.41.09.41-.09.33-.22.23-.34.08-.41-.08-.41-.23-.33-.33-.22-.41-.09-.41.09-.33.22z'/%3E%3C/svg%3E");
}

.mi-code {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M9.4 16.6L4.8 12l4.6-4.6L8 6l-6 6 6 6 1.4-1.4zm5.2 0l4.6-4.6-4.6-4.6L16 6l6 6-6 6-1.4-1.4z'/%3E%3C/svg%3E");
}

.mi-bug {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M19 8h-1.81c-.45-.78-1.07-1.45-1.82-1.96l.93-.93a.996.996 0 0 0-1.41-1.41l-1.47 1.47C12.96 5.06 12.49 5 12 5s-.96.06-1.41.17L9.11 3.7A.996.996 0 0 0 7.7 5.11l.93.93c-.74.51-1.36 1.18-1.81 1.96H5c-.55 0-1 .45-1 1s.45 1 1 1h1.09c-.05.33-.09.66-.09 1v1H5c-.55 0-1 .45-1 1s.45 1 1 1h1v1c0 .34.04.67.09 1H5c-.55 0-1 .45-1 1s.45 1 1 1h1.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H19c.55 0 1-.45 1-1s-.45-1-1-1h-1.09c.05-.33.09-.66.09-1v-1h1c.55 0 1-.45 1-1s-.45-1-1-1h-1v-1c0-.34-.04-.67-.09-1H19c.55 0 1-.45 1-1s-.45-1-1-1zm-6 8h-2c-.55 0-1-.45-1-1s.45-1 1-1h2c.55 0 1 .45 1 1s-.45 1-1 1zm0-4h-2c-.55 0-1-.45-1-1s.45-1 1-1h2c.55 0 1 .45 1 1s-.45 1-1 1z'/%3E%3C/svg%3E");
}

.mi-lua {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='%23000080'/%3E%3Ccircle cx='17.5' cy='6.5' r='1.2' fill='white'/%3E%3Ctext x='12' y='16.5' font-family='Arial, sans-serif' font-size='8' fill='white' text-anchor='middle' font-weight='bold'%3ELua%3C/text%3E%3C/svg%3E");
}

.mi-cocos {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2355c3e0' d='M12 2c-1 0-2 0-3 1l-1 1-1-1c-1 0-2 1-3 2l-1 2-2-1c0 2 0 4 1 6l1 2-1 1c1 2 2 4 4 5l2 1 1 2c1 0 2 1 3 1s2-1 3-1l1-2 2-1c2-1 3-3 4-5l-1-1 1-2c1-2 1-4 1-6l-2 1-1-2c-1-1-2-2-3-2l-1 1-1-1c-1-1-2-1-3-1z'/%3E%3Cpath fill='none' stroke='white' stroke-width='1.5' stroke-linecap='round' d='M12 6v3M8 7l2 2M16 7l-2 2M7 11h3M14 11h3'/%3E%3Ccircle cx='9' cy='13' r='2' fill='%23333'/%3E%3Ccircle cx='15' cy='13' r='2' fill='%23333'/%3E%3Ccircle cx='9' cy='13' r='0.8' fill='%2355c3e0'/%3E%3Ccircle cx='15' cy='13' r='0.8' fill='%2355c3e0'/%3E%3C/svg%3E");
}

.mi-cocos-simple {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2344aadd' d='M12 2C7 2 3 7 3 13c0 5 4 9 9 9s9-4 9-9c0-6-4-11-9-11zm0 2c1 0 2 1 3 2l-3 2-3-2c1-1 2-2 3-2zm-5 7c0-1 1-2 2-2l2 1-1 2-2-1c-.5 0-1 0-1 1zm2 5c-1 0-2-1-2-2l1-2 2 1-1 2c0 1-1 2-2 2zm6 0c-1 0-2-1-2-2l1-2 2 1-1 2c0 1-1 2-2 2zm2-5l-2 1-1-2 2-1c1 0 2 1 2 2 0 1-1 1-1 1z'/%3E%3Ccircle cx='9.5' cy='11' r='1' fill='white'/%3E%3Ccircle cx='14.5' cy='11' r='1' fill='white'/%3E%3C/svg%3E");
}

.mi-design {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23e67e22' d='M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z'/%3E%3C/svg%3E");
}

.mi-pattern {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%239b59b6' d='M4 4h6v6H4V4zm10 0h6v6h-6V4zM4 14h6v6H4v-6zm10 0h6v6h-6v-6z'/%3E%3C/svg%3E");
}

.mi-design-pattern {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%239b59b6' d='M4 4h5v5H4V4zm11 0h5v5h-5V4zM4 15h5v5H4v-5zm11 0h5v5h-5v-5z'/%3E%3Cpath fill='%23e67e22' d='M14.5 8.5l-2-2-5 5 2 2 5-5zM12 6l2 2 1.5-1.5-2-2L12 6z'/%3E%3C/svg%3E");
}

.mi-design2 {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='7' height='7' fill='%239b59b6'/%3E%3Crect x='13' y='4' width='7' height='7' fill='%239b59b6'/%3E%3Crect x='4' y='13' width='7' height='7' fill='%239b59b6'/%3E%3Crect x='13' y='13' width='7' height='7' fill='%239b59b6'/%3E%3Cpath d='M14 10l-2-2-5 5 2 2 5-5z' fill='%23e74c3c'/%3E%3C/svg%3E");
}

.mi-path {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%233498db' stroke-width='2' stroke-dasharray='4 2' d='M4 20L9 15L13 15L17 11L17 6'/%3E%3Ccircle cx='4' cy='20' r='3' fill='%232ecc71'/%3E%3Ccircle cx='17' cy='6' r='3' fill='%23e74c3c'/%3E%3C/svg%3E");
}
.mi-route {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233498db' d='M12 2L9 5h2v6h2V5h2L12 2zM6 13c-2 0-4 2-4 4s2 4 4 4 4-2 4-4-2-4-4-4zm0 6c-1 0-2-1-2-2s1-2 2-2 2 1 2 2-1 2-2 2zm12-6c-2 0-4 2-4 4s2 4 4 4 4-2 4-4-2-4-4-4zm0 6c-1 0-2-1-2-2s1-2 2-2 2 1 2 2-1 2-2 2z'/%3E%3Cpath fill='none' stroke='%23999' stroke-width='2' d='M10 15l4-4'/%3E%3C/svg%3E");
}
.mi-maze {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M4 4h16v16H4V4zm4 0v16m8-16v16M4 12h8m0-4h8'/%3E%3Cpath fill='%23e74c3c' d='M6 6h2v2H6V6zm10 10h2v2h-2v-2z'/%3E%3C/svg%3E");
}

.mi-typescript {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='2' width='20' height='20' rx='2' fill='%233178c6'/%3E%3Ctext x='12' y='17' font-family='Arial, sans-serif' font-size='10' fill='white' text-anchor='middle' font-weight='bold'%3ETS%3C/text%3E%3C/svg%3E");
}
.mi-ts {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='2' width='20' height='20' rx='3' fill='%233178c6'/%3E%3Cpath fill='white' d='M8 7h8v2h-3v8h-2V9H8V7z'/%3E%3Cpath fill='white' d='M13 13.5c0-1.5 1-2 2.5-2s2.5.5 2.5 2v.5h-2v-.3c0-.4-.2-.7-.5-.7s-.5.3-.5.7c0 1.5 3 1.2 3 3.8 0 1.5-1 2-2.5 2s-2.5-.5-2.5-2V16h2v.5c0 .4.2.7.5.7s.5-.3.5-.7c0-1.5-3-1.2-3-3.8z'/%3E%3C/svg%3E");
}

.mi-dashboard {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23333' d='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2zm0 18c-4.4 0-8-3.6-8-8s3.6-8 8-8 8 3.6 8 8-3.6 8-8 8z'/%3E%3Cpath fill='%23333' d='M12 6c-3.3 0-6 2.7-6 6h2c0-2.2 1.8-4 4-4V6z'/%3E%3Cpath fill='%23e74c3c' d='M12 12l4-4-1-1-4 4 1 1z'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='%23333'/%3E%3C/svg%3E");
}
.mi-gauge {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M4 12a8 8 0 1 1 16 0'/%3E%3Cpath fill='%23e74c3c' d='M12 12L7 7l1-1 5 5-1 1z'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='%23333'/%3E%3C/svg%3E");
}
/* 尺寸 */
.mi-2x { width: 2em; height: 2em; }
.mi-3x { width: 3em; height: 3em; }

/* 颜色通过父元素 color 控制 */
.mi-code { color: #333; }