/* ============================================================
   图标系统 icons.css —— 与 icons.js 配套
   规则：尺寸跟随 font-size（1em），颜色跟随 currentColor
   ============================================================ */

.ic {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  flex: none;
  overflow: visible;
}

/* emoji 兜底（旧配置或未收录图标名） */
.ic-emoji {
  width: auto;
  height: auto;
  line-height: 1;
  vertical-align: -0.1em;
  font-style: normal;
}
.ic-miss { opacity: .5; }

/* ---------- 双色调：两片叠放 ---------- */
.ic-duo {
  position: relative;
  display: inline-flex;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
}
.ic-duo > svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.ic-duo > .ic-duo-front { position: relative; }

/* ---------- 尺寸档位 ---------- */
.ic-sm { width: .9em; height: .9em; }
.ic-lg { width: 1.35em; height: 1.35em; vertical-align: -.2em; }
.ic-xl { width: 1.9em; height: 1.9em; vertical-align: -.32em; }

/* ---------- 语义着色（可选，跟随版式主题） ---------- */
.ic-accent  { color: var(--ui-accent, currentColor); }
.ic-deep    { color: var(--ui-deep, currentColor); }
.ic-muted   { color: var(--ui-muted, currentColor); }
.ic-danger  { color: var(--ui-danger, currentColor); }
.ic-success { color: var(--ui-success, currentColor); }
.ic-warn    { color: var(--ui-warn, currentColor); }
.ic-on-accent { color: var(--ui-on-accent, #fff); }

/* 图标与文字混排时留一点空隙（仅当图标紧跟中文时生效，避免破坏既有间距） */
.ic + .ic-gap { margin-left: .15em; }

/* ---------- 分类图标块：让 SVG 在旧 emoji 位置自然居中 ---------- */
.c-brand-icon .ic,
.m-logo-icon .ic,
.p-col-ic .ic,
.s-brand em .ic,
.b-ic .ic,
.b-rail-logo .ic,
.cr-nav-item .ic,
.c-item i .ic,
.i-cat .ic {
  width: 1.05em;
  height: 1.05em;
  vertical-align: -.16em;
}

/* 图标在按钮/徽章内不被压缩 */
.tag .ic, .btn .ic, .chip .ic, .badge .ic {
  width: 1.1em;
  height: 1.1em;
  vertical-align: -.18em;
  margin-right: .22em;
}