/* ============================================================
 * AI 创作中心 · 深度 UI 融合（v2）
 *
 * 设计目标（四字方针：简洁 · 专业 · 高端 · 漂亮）
 *
 *   · 色彩：翠绿 #0ea572 主调（与 admin_spa 一致）；白底 / 极浅灰 #f8fafc 为主底
 *   · 字体：Inter + PingFang SC；字号 12/13/14/16/18/22 分级
 *   · 圆角：sm 6 · md 10 · lg 12 · xl 16（与 admin_spa 一致）
 *   · 阴影：四级递进；主要场景用 sm（细卡片）+ md（悬浮）+ lg（modal）
 *   · 动效：0.15s/0.2s 过渡；hover 微提亮 / focus 绿色光晕环
 *
 * 实现分层（由低到高）：
 *   L0 · 设计 tokens（:root 覆盖 Mantine + lovart 自定义变量）
 *   L1 · 基础层（body / html / 滚动条 / 选中态）
 *   L2 · lovart 自定义 Tailwind utilities（bg-lo-* / text-lo-* / border-lo-*）
 *   L3 · Mantine 组件：按钮 / 输入 / 卡片 / Modal / Menu / Tooltip / Badge
 *   L4 · 布局：顶栏 / 导航 / 面包屑 / 工作区底
 *   L5 · 微交互：hover / focus / 过渡 / 加载态
 *   L6 · 深色 scheme 覆盖（与 admin_spa dark 主题对齐）
 *   L7 · 品牌替换钩子（.lv-brand-* / [data-brand-replaced]）
 *
 * 不破坏原则：
 *   · 不改变任何元素布局结构（display / position / grid / flex 布局方向）
 *   · 不改变尺寸（width / height）—— 仅调 padding / margin / radius / color
 *   · 不动画布 canvas 内部交互区（tldraw SVG 层）
 *   · 对 minified JS bundle 和 chunk URL 零依赖
 * ============================================================ */

/* =====================================================
 * L0 · 设计 tokens（lovart + Mantine 核心变量 override）
 * ===================================================== */
:root,
[data-mantine-color-scheme='light'] {
  /* admin_spa 设计语言（内部使用） */
  --ac-brand-50:  #ecfaf3;
  --ac-brand-100: #d1f2e2;
  --ac-brand-200: #a6e4c5;
  --ac-brand-300: #6fd3a8;
  --ac-brand-400: #34c08b;
  --ac-brand-500: #14b981;
  --ac-brand-600: #0ea572;  /* 主 */
  --ac-brand-700: #0b855b;
  --ac-brand-800: #086044;
  --ac-brand-900: #064f37;

  --ac-gray-50:  #f8fafc;
  --ac-gray-100: #f1f5f9;
  --ac-gray-200: #e2e8f0;
  --ac-gray-300: #cbd5e1;
  --ac-gray-400: #94a3b8;
  --ac-gray-500: #64748b;
  --ac-gray-600: #475569;
  --ac-gray-700: #334155;
  --ac-gray-800: #1e293b;
  --ac-gray-900: #0f172a;

  --ac-text-primary:   var(--ac-gray-900);
  --ac-text-secondary: var(--ac-gray-600);
  --ac-text-tertiary:  var(--ac-gray-400);
  --ac-text-inverse:   #ffffff;

  --ac-bg-page:       var(--ac-gray-50);
  --ac-bg-card:       #ffffff;
  --ac-bg-subtle:     var(--ac-gray-50);
  --ac-bg-muted:      var(--ac-gray-100);
  --ac-bg-overlay:    rgba(15, 23, 42, 0.04);

  --ac-border-color:  var(--ac-gray-200);
  --ac-border-light:  var(--ac-gray-100);
  --ac-border-hover:  var(--ac-gray-300);

  --ac-radius-sm: 6px;
  --ac-radius-md: 10px;
  --ac-radius-lg: 12px;
  --ac-radius-xl: 16px;

  --ac-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --ac-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px -20px rgba(15, 23, 42, 0.18);
  --ac-shadow-md: 0 12px 28px -18px rgba(15, 23, 42, 0.22), 0 2px 8px -6px rgba(15, 23, 42, 0.08);
  --ac-shadow-lg: 0 24px 48px -16px rgba(15, 23, 42, 0.18), 0 8px 18px -12px rgba(15, 23, 42, 0.12);

  --ac-font-sans: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',
                  'Hiragino Sans GB', 'Microsoft YaHei', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --ac-font-mono: 'SF Mono', 'Fira Code', 'Roboto Mono', ui-monospace, monospace;

  --ac-transition-fast:   0.15s ease;
  --ac-transition-normal: 0.2s ease;
  --ac-transition-slow:   0.3s cubic-bezier(0.4, 0, 0.2, 1);

  --ac-focus-ring:    0 0 0 3px rgba(14, 165, 114, 0.18);
  --ac-focus-glow:    0 0 0 4px rgba(14, 165, 114, 0.08);
  --ac-primary-soft:  rgba(14, 165, 114, 0.08);
  --ac-primary-soft2: rgba(14, 165, 114, 0.14);
  --ac-primary-grad:  linear-gradient(135deg, var(--ac-brand-500) 0%, var(--ac-brand-600) 100%);
  --ac-primary-grad2: linear-gradient(135deg, var(--ac-brand-600) 0%, var(--ac-brand-700) 100%);

  /* ---- 覆盖 lovart 自定义变量（若存在则胜出） ---- */
  --lo-bg-body:              var(--ac-bg-page);
  --lo-bg-overlay:           var(--ac-bg-card);
  --lo-bg-overlay-hover:     var(--ac-gray-50);
  --lo-bg-overlay-active:    var(--ac-gray-100);
  --lo-bg-invert:            var(--ac-gray-900);
  --lo-bg-invert-hover:      var(--ac-gray-800);
  --lo-bg-invert-active:     var(--ac-gray-700);
  --lo-bg-invert-disabled:   var(--ac-gray-200);
  --lo-text-default:         var(--ac-text-primary);
  --lo-text-secondary:       var(--ac-text-secondary);
  --lo-text-tertiary:        var(--ac-text-tertiary);
  --lo-text-disabled:        var(--ac-gray-300);
  --lo-icon-default:         var(--ac-gray-600);
  --lo-icon-disabled:        var(--ac-gray-300);
  --lo-icon-onbrand:         #ffffff;
  --lo-border-neutral-l:     var(--ac-border-color);
  --lo-neutral-l:            var(--ac-border-color);

  /* ---- 覆盖 Mantine 主品牌色梯度（lovart-green-*） ---- */
  --mantine-color-lovart-green-0: var(--ac-brand-50);
  --mantine-color-lovart-green-1: var(--ac-brand-100);
  --mantine-color-lovart-green-2: var(--ac-brand-200);
  --mantine-color-lovart-green-3: var(--ac-brand-300);
  --mantine-color-lovart-green-4: var(--ac-brand-400);
  --mantine-color-lovart-green-5: var(--ac-brand-500);
  --mantine-color-lovart-green-6: var(--ac-brand-600);
  --mantine-color-lovart-green-7: var(--ac-brand-700);
  --mantine-color-lovart-green-8: var(--ac-brand-800);
  --mantine-color-lovart-green-9: var(--ac-brand-900);

  --mantine-color-lovart-green-filled:       var(--ac-brand-600);
  --mantine-color-lovart-green-filled-hover: var(--ac-brand-700);
  --mantine-color-lovart-green-light:        var(--ac-primary-soft);
  --mantine-color-lovart-green-light-hover:  var(--ac-primary-soft2);
  --mantine-color-lovart-green-light-color:  var(--ac-brand-700);
  --mantine-color-lovart-green-outline:      var(--ac-brand-600);
  --mantine-color-lovart-green-outline-hover: rgba(14, 165, 114, 0.04);
  --mantine-color-lovart-green-text:         var(--ac-brand-700);

  /* ---- Mantine 核心全局 tokens ---- */
  --mantine-color-body:           var(--ac-bg-page);
  --mantine-color-text:           var(--ac-text-primary);
  --mantine-color-bright:         var(--ac-text-primary);
  --mantine-color-dimmed:         var(--ac-text-secondary);
  --mantine-color-placeholder:    var(--ac-gray-400);
  --mantine-color-anchor:         var(--ac-brand-600);
  --mantine-color-default:        var(--ac-bg-card);
  --mantine-color-default-hover:  var(--ac-gray-50);
  --mantine-color-default-color:  var(--ac-text-primary);
  --mantine-color-default-border: var(--ac-border-color);
  --mantine-primary-color-filled:        var(--ac-brand-600);
  --mantine-primary-color-filled-hover:  var(--ac-brand-700);
  --mantine-primary-color-light:         var(--ac-primary-soft);
  --mantine-primary-color-light-hover:   var(--ac-primary-soft2);
  --mantine-primary-color-light-color:   var(--ac-brand-700);
  --mantine-primary-color-contrast:      #ffffff;

  --mantine-radius-xs:      4px;
  --mantine-radius-sm:      var(--ac-radius-sm);
  --mantine-radius-md:      var(--ac-radius-md);
  --mantine-radius-lg:      var(--ac-radius-lg);
  --mantine-radius-xl:      var(--ac-radius-xl);
  --mantine-radius-default: var(--ac-radius-md);

  --mantine-shadow-xs: var(--ac-shadow-xs);
  --mantine-shadow-sm: var(--ac-shadow-sm);
  --mantine-shadow-md: var(--ac-shadow-md);
  --mantine-shadow-lg: var(--ac-shadow-lg);

  --mantine-font-family:          var(--ac-font-sans);
  --mantine-font-family-headings: var(--ac-font-sans);
  --mantine-font-family-monospace: var(--ac-font-mono);

  --mantine-font-size-xs: 12px;
  --mantine-font-size-sm: 13px;
  --mantine-font-size-md: 14px;
  --mantine-font-size-lg: 16px;
  --mantine-font-size-xl: 18px;
}

/* =====================================================
 * L1 · 基础层（body / 全局字体 / 滚动条 / 选中）
 * ===================================================== */
html,
body {
  background: var(--ac-bg-page) !important;
  color: var(--ac-text-primary) !important;
  font-family: var(--ac-font-sans) !important;
  font-feature-settings: 'cv11', 'ss01', 'ss03';
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  letter-spacing: -0.005em;
}

body ::selection {
  background: var(--ac-primary-soft2);
  color: var(--ac-brand-700);
}

/* 全局滚动条细条风格（Chromium / Safari） */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--ac-gray-300) transparent;
}
*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background-color: var(--ac-gray-200);
  border-radius: 10px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover {
  background-color: var(--ac-brand-400);
}

/* 链接 */
a {
  color: var(--ac-brand-700);
  transition: color var(--ac-transition-fast);
}
a:hover {
  color: var(--ac-brand-600);
  text-decoration: none;
}

/* 默认 focus（除有特殊 focus ring 的元素） */
:focus-visible {
  outline: none;
  box-shadow: var(--ac-focus-ring);
  border-radius: var(--ac-radius-sm);
}

/* =====================================================
 * L2 · lovart Tailwind 自定义 utilities 深度对齐
 * ===================================================== */
/* 页面底色：从 lovart 原深灰白混搭 → admin 翠绿底 */
.bg-lo-bg-body { background-color: var(--ac-bg-page) !important; }

/* 悬浮/下拉 overlay：白卡 */
.bg-lo-bg-overlay          { background-color: var(--ac-bg-card) !important; }
.bg-lo-bg-overlay-hover    { background-color: var(--ac-gray-50) !important; }
.bg-lo-bg-overlay-active   { background-color: var(--ac-gray-100) !important; }
.hover\:bg-lo-bg-overlay-hover:hover   { background-color: var(--ac-gray-50) !important; }
.active\:bg-lo-bg-overlay-active:active { background-color: var(--ac-gray-100) !important; }

/* 反色（暗按钮底）：翠绿渐变替代纯黑 */
.bg-lo-bg-invert           { background: var(--ac-primary-grad) !important; color: #fff !important; }
.bg-lo-bg-invert-hover,
.hover\:bg-lo-bg-invert-hover:hover { background: var(--ac-primary-grad2) !important; color: #fff !important; }
.bg-lo-bg-invert-active,
.active\:bg-lo-bg-invert-active:active { background: linear-gradient(135deg, var(--ac-brand-700), var(--ac-brand-800)) !important; }
.bg-lo-bg-invert-disabled  { background: var(--ac-gray-200) !important; color: var(--ac-gray-400) !important; }

/* 文字色层级 */
.text-lo-text-default      { color: var(--ac-text-primary) !important; }
.text-lo-text-secondary    { color: var(--ac-text-secondary) !important; }
.text-lo-text-tertiary     { color: var(--ac-text-tertiary) !important; }
.text-lo-text-disabled     { color: var(--ac-gray-300) !important; }
.text-lo-body-lg           { font-size: 15px !important; line-height: 1.6 !important; color: var(--ac-text-primary) !important; }
.text-lo-icon-default      { color: var(--ac-gray-600) !important; }
.text-lo-icon-disabled     { color: var(--ac-gray-300) !important; }
.text-lo-icon-onbrand      { color: #ffffff !important; }

/* 边框 */
.border-lo-border-neutral-l,
.border-lo-neutral-l { border-color: var(--ac-border-color) !important; }

/* =====================================================
 * L3 · Mantine 组件层
 * ===================================================== */

/* ---- Button（主按钮：翠绿渐变 + 柔和阴影 + hover 提亮） ---- */
[class*='mantine-Button-root'],
button[data-variant='filled'],
[data-variant='filled'][class*='Button'] {
  font-family: var(--ac-font-sans) !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  border-radius: var(--ac-radius-md) !important;
  transition: background var(--ac-transition-fast),
              box-shadow var(--ac-transition-fast),
              transform var(--ac-transition-fast) !important;
}
[data-variant='filled'][class*='Button']:not([data-disabled]) {
  background: var(--ac-primary-grad) !important;
  color: #fff !important;
  box-shadow: 0 1px 2px rgba(14, 165, 114, 0.25),
              inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}
[data-variant='filled'][class*='Button']:not([data-disabled]):hover {
  background: var(--ac-primary-grad2) !important;
  box-shadow: 0 4px 14px -4px rgba(14, 165, 114, 0.42) !important;
  transform: translateY(-1px);
}
[data-variant='filled'][class*='Button']:not([data-disabled]):active {
  transform: translateY(0);
  box-shadow: 0 1px 2px rgba(14, 165, 114, 0.25) !important;
}

/* 次按钮：白底绿字绿边 + hover 淡绿底 */
[data-variant='default'][class*='Button'],
[data-variant='outline'][class*='Button'] {
  background: var(--ac-bg-card) !important;
  color: var(--ac-text-primary) !important;
  border: 1px solid var(--ac-border-color) !important;
  border-radius: var(--ac-radius-md) !important;
}
[data-variant='default'][class*='Button']:hover,
[data-variant='outline'][class*='Button']:hover {
  border-color: var(--ac-brand-600) !important;
  color: var(--ac-brand-700) !important;
  background: var(--ac-primary-soft) !important;
}

/* 幽灵按钮 / subtle */
[data-variant='subtle'][class*='Button'],
[data-variant='transparent'][class*='Button'] {
  color: var(--ac-text-secondary) !important;
  background: transparent !important;
}
[data-variant='subtle'][class*='Button']:hover {
  background: var(--ac-primary-soft) !important;
  color: var(--ac-brand-700) !important;
}

/* ---- Input / TextInput / Textarea / Select ---- */
[class*='mantine-Input-input'],
[class*='mantine-TextInput-input'],
[class*='mantine-Textarea-input'],
[class*='mantine-Select-input'],
[class*='mantine-NumberInput-input'],
[class*='mantine-PasswordInput-input'] {
  background: var(--ac-bg-card) !important;
  border: 1px solid var(--ac-border-color) !important;
  border-radius: var(--ac-radius-md) !important;
  color: var(--ac-text-primary) !important;
  font-family: var(--ac-font-sans) !important;
  transition: border-color var(--ac-transition-fast),
              box-shadow var(--ac-transition-fast) !important;
}
[class*='mantine-Input-input']:hover,
[class*='mantine-TextInput-input']:hover,
[class*='mantine-Textarea-input']:hover,
[class*='mantine-Select-input']:hover {
  border-color: var(--ac-border-hover) !important;
}
[class*='mantine-Input-input']:focus,
[class*='mantine-Input-input']:focus-within,
[class*='mantine-TextInput-input']:focus,
[class*='mantine-Textarea-input']:focus,
[class*='mantine-Select-input']:focus-within {
  border-color: var(--ac-brand-600) !important;
  box-shadow: var(--ac-focus-ring) !important;
  outline: none !important;
}

/* ---- Paper / Card（所有卡片容器） ---- */
[class*='mantine-Paper-root'],
[class*='mantine-Card-root'] {
  background: var(--ac-bg-card) !important;
  border-radius: var(--ac-radius-lg) !important;
  border: 1px solid var(--ac-border-light) !important;
  box-shadow: var(--ac-shadow-xs) !important;
  transition: box-shadow var(--ac-transition-normal),
              border-color var(--ac-transition-normal) !important;
}
[class*='mantine-Card-root']:hover {
  box-shadow: var(--ac-shadow-sm) !important;
  border-color: var(--ac-border-color) !important;
}

/* ---- Modal / Drawer ---- */
[class*='mantine-Modal-content'],
[class*='mantine-Drawer-content'] {
  border-radius: var(--ac-radius-lg) !important;
  box-shadow: var(--ac-shadow-lg), 0 1px 0 rgba(255, 255, 255, 0.6) inset !important;
  background: var(--ac-bg-card) !important;
  border: 1px solid var(--ac-border-light) !important;
}
[class*='mantine-Modal-overlay'],
[class*='mantine-Drawer-overlay'] {
  background: rgba(15, 23, 42, 0.42) !important;
  backdrop-filter: blur(6px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(6px) saturate(120%) !important;
}
[class*='mantine-Modal-header'],
[class*='mantine-Drawer-header'] {
  border-bottom: 1px solid var(--ac-border-light) !important;
  padding: 16px 20px !important;
}
[class*='mantine-Modal-title'],
[class*='mantine-Drawer-title'] {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--ac-text-primary) !important;
}

/* ---- Menu / Popover / HoverCard / Dropdown ---- */
[class*='mantine-Menu-dropdown'],
[class*='mantine-Popover-dropdown'],
[class*='mantine-HoverCard-dropdown'],
[class*='mantine-Combobox-dropdown'],
[class*='mantine-Select-dropdown'] {
  background: var(--ac-bg-card) !important;
  border: 1px solid var(--ac-border-light) !important;
  border-radius: var(--ac-radius-md) !important;
  box-shadow: var(--ac-shadow-md) !important;
  padding: 6px !important;
}
[class*='mantine-Menu-item'],
[class*='mantine-Combobox-option'] {
  border-radius: var(--ac-radius-sm) !important;
  padding: 7px 10px !important;
  font-size: 13px !important;
  color: var(--ac-text-primary) !important;
  transition: background var(--ac-transition-fast), color var(--ac-transition-fast) !important;
}
[class*='mantine-Menu-item']:hover,
[class*='mantine-Combobox-option']:hover,
[class*='mantine-Combobox-option'][data-hovered] {
  background: var(--ac-primary-soft) !important;
  color: var(--ac-brand-700) !important;
}
[class*='mantine-Combobox-option'][data-selected] {
  background: var(--ac-primary-soft2) !important;
  color: var(--ac-brand-700) !important;
  font-weight: 500;
}

/* ---- Tooltip（小提示） ---- */
[class*='mantine-Tooltip-tooltip'] {
  background: var(--ac-gray-900) !important;
  color: #fff !important;
  border-radius: var(--ac-radius-sm) !important;
  font-size: 12px !important;
  padding: 6px 10px !important;
  box-shadow: var(--ac-shadow-md) !important;
}

/* ---- Badge / Tag / Chip ---- */
[class*='mantine-Badge-root'] {
  border-radius: var(--ac-radius-full, 9999px) !important;
  font-weight: 500 !important;
  font-size: 11px !important;
  letter-spacing: 0.2px;
  padding: 0 10px !important;
}
[class*='mantine-Badge-root'][data-variant='light'] {
  background: var(--ac-primary-soft) !important;
  color: var(--ac-brand-700) !important;
}

/* ---- Avatar ---- */
[class*='mantine-Avatar-root'] {
  border-radius: var(--ac-radius-md) !important;
}
[class*='mantine-Avatar-placeholder'] {
  background: var(--ac-primary-grad) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

/* ---- Tabs ---- */
[class*='mantine-Tabs-tab'] {
  font-family: var(--ac-font-sans) !important;
  font-weight: 500 !important;
  color: var(--ac-text-secondary) !important;
  border-radius: var(--ac-radius-md) !important;
  transition: color var(--ac-transition-fast), background var(--ac-transition-fast) !important;
}
[class*='mantine-Tabs-tab']:hover {
  color: var(--ac-brand-700) !important;
  background: var(--ac-primary-soft) !important;
}
[class*='mantine-Tabs-tab'][data-active] {
  color: var(--ac-brand-700) !important;
  background: var(--ac-primary-soft) !important;
}

/* ---- Divider ---- */
[class*='mantine-Divider-root'] {
  border-color: var(--ac-border-light) !important;
}

/* ---- Progress / Loader ---- */
[class*='mantine-Progress-bar'],
[class*='mantine-Progress-section'] {
  background: var(--ac-primary-grad) !important;
}
[class*='mantine-Loader-root'] svg circle,
[class*='mantine-Loader-root'] svg path {
  stroke: var(--ac-brand-600) !important;
  fill: var(--ac-brand-600) !important;
}

/* ---- Switch ---- */
[class*='mantine-Switch-track'][data-checked] {
  background-color: var(--ac-brand-600) !important;
  border-color: var(--ac-brand-600) !important;
}

/* ---- Checkbox / Radio ---- */
[class*='mantine-Checkbox-input']:checked + *,
[class*='mantine-Checkbox-input']:checked {
  background-color: var(--ac-brand-600) !important;
  border-color: var(--ac-brand-600) !important;
}
[class*='mantine-Radio-radio']:checked {
  background-color: var(--ac-brand-600) !important;
  border-color: var(--ac-brand-600) !important;
}

/* ---- Slider ---- */
[class*='mantine-Slider-bar'] {
  background: var(--ac-primary-grad) !important;
}
[class*='mantine-Slider-thumb'] {
  border-color: var(--ac-brand-600) !important;
  background: #fff !important;
  box-shadow: 0 2px 6px rgba(14, 165, 114, 0.35) !important;
}

/* =====================================================
 * L4 · 布局语义元素（lovart 自定义）
 * ===================================================== */

/* 主容器：沉浸白底 */
.home-layout-box {
  background: var(--ac-bg-page) !important;
}

/* 移动顶栏：白卡 + 细边 */
.mobile-top-nav {
  background: var(--ac-bg-card) !important;
  border-bottom: 1px solid var(--ac-border-light) !important;
  backdrop-filter: blur(12px) saturate(140%);
  -webkit-backdrop-filter: blur(12px) saturate(140%);
}

/* 工作区主体 container（lovart 画布外壳） */
[class*='workspace'],
[class*='Workspace'] {
  background: var(--ac-bg-page) !important;
}

/* Next.js 生成的 nav / aside 结构（通用白卡+细边+细阴影） */
body > div > nav,
body > div > aside,
header[class*='header'] {
  background: var(--ac-bg-card) !important;
  border-bottom: 1px solid var(--ac-border-light) !important;
}

/* =====================================================
 * L5 · 微交互（动效、焦点、过渡）
 * ===================================================== */

/* 全局过渡——仅对颜色、背景、边框、阴影类 property，不影响 transform/layout */
* {
  transition-property: background-color, border-color, color, box-shadow, opacity;
  transition-duration: var(--ac-transition-fast);
  transition-timing-function: ease;
}

/* 按钮类元素加 active 时的微缩 */
button:not(:disabled):active,
[role='button']:not([aria-disabled='true']):active {
  transform: translateY(0.5px);
}

/* 可交互元素 focus-visible 统一绿色光晕 */
button:focus-visible,
[role='button']:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: none !important;
  box-shadow: var(--ac-focus-ring) !important;
}

/* 骨架屏 / Skeleton 统一柔和绿渐变扫动 */
[class*='mantine-Skeleton-root']::before,
[class*='Skeleton']::before {
  background: linear-gradient(90deg,
    var(--ac-gray-100) 0%,
    var(--ac-primary-soft) 50%,
    var(--ac-gray-100) 100%) !important;
}

/* =====================================================
 * L6 · 深色 scheme（与 admin_spa dark 主题对齐）
 * ===================================================== */
[data-mantine-color-scheme='dark'] {
  --ac-text-primary:   #f8fafc;
  --ac-text-secondary: #94a3b8;
  --ac-text-tertiary:  #64748b;

  --ac-bg-page:   #0f172a;
  --ac-bg-card:   #1e293b;
  --ac-bg-subtle: #0f172a;
  --ac-bg-muted:  #16223a;

  --ac-border-color: #334155;
  --ac-border-light: #1e293b;
  --ac-border-hover: #475569;

  --mantine-color-body:           var(--ac-bg-page);
  --mantine-color-text:           var(--ac-text-primary);
  --mantine-color-dimmed:         var(--ac-text-secondary);
  --mantine-color-default:        var(--ac-bg-card);
  --mantine-color-default-hover:  #283246;
  --mantine-color-default-border: var(--ac-border-color);

  --lo-bg-body:              var(--ac-bg-page);
  --lo-bg-overlay:           var(--ac-bg-card);
  --lo-bg-overlay-hover:     #283246;
  --lo-text-default:         var(--ac-text-primary);
  --lo-text-secondary:       var(--ac-text-secondary);
  --lo-border-neutral-l:     var(--ac-border-color);

  /* 深色场景下卡片需要更暗的阴影 */
  --ac-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.20);
  --ac-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.28);
  --ac-shadow-md: 0 12px 28px rgba(0, 0, 0, 0.38);
  --ac-shadow-lg: 0 24px 48px rgba(0, 0, 0, 0.48);
}

/* =====================================================
 * L7 · 品牌替换钩子（保留，供 brand-overrides.js 使用）
 * ===================================================== */
.lv-brand-mark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--ac-font-sans);
}
.lv-brand-mark__icon {
  width: 28px;
  height: 28px;
  border-radius: 7px;
  background: var(--ac-primary-grad);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  flex-shrink: 0;
  letter-spacing: -0.5px;
  box-shadow: 0 2px 6px rgba(14, 165, 114, 0.25);
}
.lv-brand-mark__text {
  font-size: 14px;
  font-weight: 600;
  color: var(--ac-text-primary);
  letter-spacing: 0.2px;
  white-space: nowrap;
}

/* JS 打上 data-brand-replaced 的元素：原图标隐藏 + 显示我们的 logo */
[data-brand-replaced] img,
[data-brand-replaced] svg:not(.lv-brand-keep) {
  display: none !important;
}
[data-brand-replaced]::before {
  content: '';
  display: inline-block;
  width: 28px;
  height: 28px;
  vertical-align: middle;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><defs><linearGradient id='g' x1='0%25' y1='0%25' x2='100%25' y2='100%25'><stop offset='0%25' stop-color='%230ea572'/><stop offset='100%25' stop-color='%2322d3a0'/></linearGradient></defs><rect width='64' height='64' rx='14' fill='url(%23g)'/><text x='50%25' y='54%25' text-anchor='middle' dominant-baseline='middle' font-family='-apple-system, PingFang SC, sans-serif' font-size='34' font-weight='700' fill='%23fff'>创</text></svg>");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 6px;
}

/* ============================================================
 * 结束：以上覆盖了 Mantine + lovart Tailwind + 布局 + 交互
 * 任何缺失的场景可继续在 brand-overrides.js 通过 class 注入扩展
 * ============================================================ */