/**
 * 全站 UI 强调色（顶栏、边框、按钮、爱心）
 * 由 uiAccent.js 根据设置写入 CSS 变量
 */
:root {
  --ui-accent-bar: #efbfd6;
  --ui-accent-border: #efbfd6;
  --ui-accent-btn: #f3a7bc;
  --ui-accent-btn-hot: #f58a90;
  --ui-accent-heart: #f7b3c4;

  --m-pink: var(--ui-accent-bar);
  --m-border: var(--ui-accent-border);
  --m-pink-btn: var(--ui-accent-btn);
  --m-pink-btn-hot: var(--ui-accent-btn-hot);
  --chat-heart-tint-1: var(--ui-accent-bar, #ffd6e4);
  --chat-heart-tint-2: var(--ui-accent-btn, #ffb6cc);
  --chat-heart-tint-3: var(--ui-accent-btn-hot, #f8a8c6);
  --chat-heart-glow: color-mix(in srgb, var(--ui-accent-btn-hot, #f58a90) 24%, transparent);
}

.ui-accent-preview {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.ui-accent-preview-bar {
  width: 48px;
  height: 22px;
  border-radius: 8px;
  background: var(--ui-accent-bar, #efbfd6);
  border: 1px solid color-mix(in srgb, var(--ui-accent-border, #efbfd6) 80%, #000 5%);
}

.ui-accent-preview-border {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: #fff;
  border: 3px solid var(--ui-accent-border, #efbfd6);
}

.ui-accent-preview-btn {
  width: 36px;
  height: 22px;
  border-radius: 999px;
  background: var(--ui-accent-btn, #f3a7bc);
}

.ui-accent-preview-heart {
  font-size: 1.35rem;
  line-height: 1;
  color: var(--ui-accent-heart, #f7b3c4);
}