/* =============================================================
   青鸟·EchoLink 后台  —  Ant Design 5 设计系统 (Design Tokens)
   视觉基准：Ant Design 5 + Ant Design Pro 后台框架
   主色 #1677ff / 深色侧栏 #001529 / 内容区浅色
   WCAG AA：正文 rgba(0,0,0,.88) on #fff = 16.7:1
   ============================================================= */

:root {
  /* ---- 品牌主色 (蚂蚁蓝) ---- */
  --ant-primary: #1677ff;
  --ant-primary-hover: #4096ff;
  --ant-primary-active: #0958d9;
  --ant-primary-bg: #e6f4ff;
  --ant-primary-border: #91caff;

  /* ---- 语义色 ---- */
  --ant-success: #52c41a;
  --ant-success-bg: #f6ffed;
  --ant-success-border: #b7eb8f;
  --ant-warning: #faad14;
  --ant-warning-bg: #fffbe6;
  --ant-warning-border: #ffe58f;
  --ant-error: #ff4d4f;
  --ant-error-hover: #ff7875;
  --ant-error-bg: #fff2f0;
  --ant-error-border: #ffccc7;
  --ant-info: #1677ff;

  /* ---- 文字 ---- */
  --ant-text: rgba(0, 0, 0, 0.88);
  --ant-text-secondary: rgba(0, 0, 0, 0.65);
  --ant-text-tertiary: rgba(0, 0, 0, 0.45);
  --ant-text-disabled: rgba(0, 0, 0, 0.25);
  --ant-text-inverse: rgba(255, 255, 255, 0.95);
  --ant-text-inverse-secondary: rgba(255, 255, 255, 0.65);

  /* ---- 边框 / 分割 / 背景 ---- */
  --ant-border: #d9d9d9;
  --ant-border-secondary: #f0f0f0;
  --ant-bg-layout: #f0f2f5;   /* 内容区背景 */
  --ant-bg-container: #ffffff;
  --ant-bg-elevated: #ffffff;
  --ant-bg-mask: rgba(0, 0, 0, 0.45);
  --ant-bg: #fafafa;
  --ant-fill: rgba(0, 0, 0, 0.04);
  --ant-fill-secondary: rgba(0, 0, 0, 0.06);
  --ant-fill-tertiary: rgba(0, 0, 0, 0.10);

  /* ---- 侧栏深色 ---- */
  --ant-sider-bg: #001529;
  --ant-sider-bg-hover: #ffffff14;
  --ant-sider-menu-selected: #1677ff;

  /* ---- 字阶 (AntD 5) ---- */
  --ant-font-size: 14px;
  --ant-font-size-sm: 12px;
  --ant-font-size-lg: 16px;
  --ant-font-size-title-sm: 20px;
  --ant-font-size-title: 24px;
  --ant-font-size-title-lg: 30px;
  --ant-font-size-display: 38px;
  --ant-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue",
    Arial, sans-serif;
  --ant-font-family-code: "SFMono-Regular", Consolas, "Liberation Mono", Menlo,
    Courier, monospace;
  --ant-line-height: 1.5714;

  /* ---- 间距 (4 基准) ---- */
  --ant-space-xs: 4px;
  --ant-space-sm: 8px;
  --ant-space-md: 12px;
  --ant-space-lg: 16px;
  --ant-space-xl: 24px;
  --ant-space-2xl: 32px;
  --ant-space-3xl: 48px;

  /* ---- 圆角 ---- */
  --ant-radius-sm: 4px;
  --ant-radius: 6px;
  --ant-radius-lg: 8px;
  --ant-radius-xl: 12px;
  --ant-radius-round: 50%;

  /* ---- 阴影 ---- */
  --ant-shadow-1: 0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02),
    0 2px 4px 0 rgba(0, 0, 0, 0.02);
  --ant-shadow-2: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12),
    0 9px 28px 8px rgba(0, 0, 0, 0.05);
  --ant-shadow-3: 0 6px 16px 0 rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.08);

  /* ---- 动效 ---- */
  --ant-motion-duration-slow: 0.3s;
  --ant-motion-duration-mid: 0.2s;
  --ant-motion-duration-fast: 0.1s;
  --ant-motion-ease: cubic-bezier(0.645, 0.045, 0.355, 1);
  --ant-motion-ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
}

/* ============================ Reset ============================ */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  font-family: var(--ant-font-family);
  font-size: var(--ant-font-size);
  line-height: var(--ant-line-height);
  color: var(--ant-text);
  background: var(--ant-bg-layout);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--ant-primary); text-decoration: none; }
a:hover { color: var(--ant-primary-hover); }
h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; color: var(--ant-text); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.18); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, 0.3); }
[hidden] { display: none !important; }

/* ============================ Layout ============================ */
.ant-layout { display: flex; min-height: 100vh; }
.ant-layout-sider {
  width: 232px; background: var(--ant-sider-bg); flex: 0 0 232px;
  transition: width var(--ant-motion-duration-mid) var(--ant-motion-ease);
  position: sticky; top: 0; height: 100vh; overflow: hidden;
}
.ant-layout-sider-collapsed { width: 64px; flex: 0 0 64px; }
.ant-layout-main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.ant-layout-header {
  height: 56px; background: var(--ant-bg-container); padding: 0 var(--ant-space-xl);
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid var(--ant-border-secondary);
  position: sticky; top: 0; z-index: 10;
}
.ant-layout-content { padding: var(--ant-space-xl); flex: 1; }

/* ---- Logo ---- */
.ant-logo {
  height: 56px; display: flex; align-items: center; gap: var(--ant-space-md);
  padding: 0 var(--ant-space-lg); color: #fff; overflow: hidden; white-space: nowrap;
}
.ant-logo .logo-mark {
  width: 30px; height: 30px; border-radius: var(--ant-radius); flex: 0 0 30px;
  background: linear-gradient(135deg, #1677ff, #69b1ff);
  display: flex; align-items: center; justify-content: center; font-weight: 700; color: #fff;
}
.ant-logo .logo-text { font-size: 16px; font-weight: 600; letter-spacing: 0.5px; }
.ant-layout-sider-collapsed .logo-text { display: none; }

/* ---- Menu ---- */
.ant-menu { background: transparent; padding: var(--ant-space-sm) 0; list-style: none; margin: 0; }
.ant-menu-item {
  display: flex; align-items: center; gap: var(--ant-space-md); height: 44px; margin: 4px var(--ant-space-sm);
  padding: 0 var(--ant-space-lg); border-radius: var(--ant-radius); color: rgba(255, 255, 255, 0.75);
  cursor: pointer; white-space: nowrap; user-select: none; font-size: 14px;
  transition: background var(--ant-motion-duration-fast), color var(--ant-motion-duration-fast);
}
.ant-menu-item .mi-icon { width: 18px; text-align: center; flex: 0 0 18px; font-size: 16px; }
.ant-menu-item:hover { background: var(--ant-sider-bg-hover); color: #fff; }
.ant-menu-item.active { background: var(--ant-sider-menu-selected); color: #fff; }
.ant-layout-sider-collapsed .mi-label { display: none; }

/* ---- Breadcrumb ---- */
.ant-breadcrumb { font-size: 14px; color: var(--ant-text-tertiary); display: flex; align-items: center; gap: 6px; }
.ant-breadcrumb .sep { color: var(--ant-text-disabled); }
.ant-breadcrumb .cur { color: var(--ant-text); }

/* ---- Header right ---- */
.ant-header-right { display: flex; align-items: center; gap: var(--ant-space-lg); }
.ant-user { display: flex; align-items: center; gap: var(--ant-space-sm); cursor: pointer; }
.ant-avatar {
  width: 32px; height: 32px; border-radius: var(--ant-radius-round); background: var(--ant-primary);
  color: #fff; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600;
}

/* ============================ Page header ============================ */
.page { display: none; }
.page.active { display: block; animation: antFadeIn var(--ant-motion-duration-mid) var(--ant-motion-ease); }
@keyframes antFadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.page-head { margin-bottom: var(--ant-space-xl); }
.page-head h2 { font-size: var(--ant-font-size-title); margin-bottom: var(--ant-space-xs); }
.page-head .sub { color: var(--ant-text-tertiary); font-size: var(--ant-font-size); }

/* ============================ Card ============================ */
.ant-card {
  background: var(--ant-bg-container); border-radius: var(--ant-radius-lg);
  box-shadow: var(--ant-shadow-1); border: 1px solid var(--ant-border-secondary);
  transition: box-shadow var(--ant-motion-duration-mid) var(--ant-motion-ease);
}
.ant-card-hover:hover { box-shadow: var(--ant-shadow-2); }
.ant-card-body { padding: var(--ant-space-xl); }
.ant-card-head {
  padding: var(--ant-space-md) var(--ant-space-xl); border-bottom: 1px solid var(--ant-border-secondary);
  display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: 16px;
}
.ant-card-compact .ant-card-body { padding: var(--ant-space-lg); }

/* ============================ Statistic (统计卡) ============================ */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--ant-space-lg); margin-bottom: var(--ant-space-xl); }
.ant-statistic { background: var(--ant-bg-container); border-radius: var(--ant-radius-lg); padding: var(--ant-space-xl); box-shadow: var(--ant-shadow-1); border: 1px solid var(--ant-border-secondary); }
.ant-statistic .stat-title { color: var(--ant-text-tertiary); font-size: var(--ant-font-size); margin-bottom: var(--ant-space-sm); display:flex; align-items:center; gap:6px; }
.ant-statistic .stat-value { font-size: 30px; font-weight: 600; line-height: 1.1; color: var(--ant-text); }
.ant-statistic .stat-value .unit { font-size: 16px; color: var(--ant-text-tertiary); margin-left: 2px; }
.ant-statistic .stat-foot { margin-top: var(--ant-space-sm); font-size: var(--ant-font-size-sm); color: var(--ant-text-tertiary); }
.ant-statistic .stat-foot .up { color: var(--ant-success); }
.ant-statistic .stat-foot .down { color: var(--ant-error); }

/* ============================ Button ============================ */
.ant-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 32px; padding: 0 15px; font-size: var(--ant-font-size); font-weight: 400;
  border-radius: var(--ant-radius); border: 1px solid var(--ant-border); background: #fff;
  color: var(--ant-text); cursor: pointer; user-select: none; white-space: nowrap;
  transition: all var(--ant-motion-duration-fast) var(--ant-motion-ease);
  font-family: inherit; line-height: 1;
}
.ant-btn:hover { color: var(--ant-primary-hover); border-color: var(--ant-primary-hover); }
.ant-btn:active { color: var(--ant-primary-active); border-color: var(--ant-primary-active); }
.ant-btn:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--ant-primary-border); }
.ant-btn-primary { background: var(--ant-primary); border-color: var(--ant-primary); color: #fff; }
.ant-btn-primary:hover { background: var(--ant-primary-hover); border-color: var(--ant-primary-hover); color: #fff; }
.ant-btn-primary:active { background: var(--ant-primary-active); border-color: var(--ant-primary-active); }
.ant-btn-dashed { border-style: dashed; }
.ant-btn-link { border: none; background: none; padding: 0 4px; height: auto; color: var(--ant-primary); }
.ant-btn-link:hover { color: var(--ant-primary-hover); }
.ant-btn-text { border: none; background: none; }
.ant-btn-text:hover { background: var(--ant-fill); color: var(--ant-text); }
.ant-btn-danger { color: var(--ant-error); border-color: var(--ant-error-border); background: #fff; }
.ant-btn-danger:hover { color: #fff; background: var(--ant-error); border-color: var(--ant-error); }
.ant-btn-sm { height: 24px; padding: 0 7px; font-size: var(--ant-font-size-sm); }
.ant-btn-lg { height: 40px; padding: 0 19px; font-size: var(--ant-font-size-lg); }
.ant-btn-block { width: 100%; }
.ant-btn:disabled, .ant-btn[disabled] { cursor: not-allowed; color: var(--ant-text-disabled); border-color: var(--ant-border-secondary); background: var(--ant-fill-secondary); }
.ant-btn-primary:disabled { color: #fff; background: var(--ant-primary-border); border-color: var(--ant-primary-border); opacity: 0.7; }
.ant-btn-loading { pointer-events: none; opacity: 0.75; }
.ant-btn .spinner { width: 12px; height: 12px; }

/* ============================ Form ============================ */
.ant-form-item { margin-bottom: var(--ant-space-lg); }
.ant-form-item-label { display: block; margin-bottom: 6px; font-size: var(--ant-font-size); color: var(--ant-text); font-weight: 500; }
.ant-input, .ant-select, .ant-textarea {
  width: 100%; height: 32px; padding: 4px 11px; font-size: var(--ant-font-size);
  border: 1px solid var(--ant-border); border-radius: var(--ant-radius); background: #fff; color: var(--ant-text);
  transition: all var(--ant-motion-duration-fast) var(--ant-motion-ease); font-family: inherit;
}
.ant-textarea { height: auto; min-height: 80px; padding: 8px 11px; resize: vertical; line-height: 1.5; }
.ant-input:hover, .ant-select:hover, .ant-textarea:hover { border-color: var(--ant-primary-hover); }
.ant-input:focus, .ant-select:focus-within, .ant-textarea:focus {
  border-color: var(--ant-primary); outline: none; box-shadow: 0 0 0 2px var(--ant-primary-border);
}
.ant-input::placeholder, .ant-textarea::placeholder { color: var(--ant-text-disabled); }
.ant-input-affix { position: relative; }
.ant-input-affix .ant-input { padding-left: 34px; }
.ant-input-prefix { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--ant-text-tertiary); }
.ant-input-suffix { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); color: var(--ant-text-tertiary); cursor: pointer; }
.ant-field-error { color: var(--ant-error); font-size: var(--ant-font-size-sm); margin-top: 4px; }
.ant-input-error { border-color: var(--ant-error); }
.ant-input-error:focus { box-shadow: 0 0 0 2px var(--ant-error-border); }

/* ---- Select 下拉面板 ---- */
.ant-select { position: relative; }
.ant-select-trigger { display: flex; align-items: center; justify-content: space-between; cursor: pointer; }
.ant-select-trigger .ph { color: var(--ant-text-disabled); }
.ant-select.ant-open .ant-select-panel { display: block; }
.ant-select-panel {
  display: none; position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 50;
  background: #fff; border-radius: var(--ant-radius); box-shadow: var(--ant-shadow-2);
  border: 1px solid var(--ant-border-secondary); padding: 4px; max-height: 256px; overflow: auto;
}
.ant-select-option { padding: 6px 11px; border-radius: var(--ant-radius-sm); cursor: pointer; font-size: 14px; }
.ant-select-option:hover { background: var(--ant-fill); }
.ant-select-option.selected { background: var(--ant-primary-bg); color: var(--ant-primary); font-weight: 500; }

/* ============================ Table ============================ */
.ant-table-wrap { background: #fff; border-radius: var(--ant-radius-lg); box-shadow: var(--ant-shadow-1); border: 1px solid var(--ant-border-secondary); overflow-x: auto; overflow-y: hidden; }
.ant-table { width: 100%; border-collapse: collapse; font-size: var(--ant-font-size); }
.ant-table--wide { min-width: 1320px; }
.ant-table thead th {
  background: #fafafa; text-align: left; padding: 12px var(--ant-space-lg); font-weight: 600;
  color: var(--ant-text); border-bottom: 1px solid var(--ant-border-secondary); white-space: nowrap;
}
.ant-table tbody td { padding: 12px var(--ant-space-lg); border-bottom: 1px solid var(--ant-border-secondary); color: var(--ant-text-secondary); vertical-align: middle; }
.ant-table tbody tr:last-child td { border-bottom: none; }
.ant-table tbody tr:hover { background: var(--ant-primary-bg); }
.ant-table .col-main { color: var(--ant-text); font-weight: 500; }
.ant-table .nowrap { white-space: nowrap; }
.ant-table .cell-cover-wrap { width: 64px; }
.cell-cover { width: 48px; height: 48px; object-fit: cover; border-radius: var(--ant-radius-sm, 6px); background: var(--ant-fill, #fafafa); display: block; float: left; margin-right: 10px; flex-shrink: 0; }
.cell-cover-none { font-size: 12px; }
.cell-title { color: var(--ant-text); font-weight: 500; max-width: 340px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cell-sub { color: #8c8c8c; font-size: 12px; margin-top: 2px; }
.ant-table .link { color: var(--ant-primary); cursor: pointer; }
.ant-table .link:hover { color: var(--ant-primary-hover); }
.ant-table .row-expand { background: var(--ant-fill); }
.ant-table-empty td { text-align: center; padding: 48px 0; }

/* ============================ Tag / Badge ============================ */
.ant-tag {
  display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border-radius: var(--ant-radius-sm);
  font-size: var(--ant-font-size-sm); line-height: 20px; border: 1px solid; background: var(--ant-fill);
  color: var(--ant-text-secondary); border-color: var(--ant-border-secondary); white-space: nowrap;
}
.ant-tag-success { color: var(--ant-success); background: var(--ant-success-bg); border-color: var(--ant-success-border); }
.ant-tag-warning { color: #d48806; background: var(--ant-warning-bg); border-color: var(--ant-warning-border); }
.ant-tag-error { color: var(--ant-error); background: var(--ant-error-bg); border-color: var(--ant-error-border); }
.ant-tag-processing { color: var(--ant-primary); background: var(--ant-primary-bg); border-color: var(--ant-primary-border); }
.ant-tag-magenta { color: #c41d7f; background: #fff0f6; border-color: #ffadd2; }
.ant-tag-volcano { color: #d4380d; background: #fff2e8; border-color: #ffbb96; }
.ant-tag-gold { color: #d48806; background: #fffbe6; border-color: #ffe58f; }
.ant-tag-cyan { color: #08979c; background: #e6fffb; border-color: #87e8de; }
.ant-tag-blue { color: var(--ant-primary); background: var(--ant-primary-bg); border-color: var(--ant-primary-border); }
.ant-tag-default { color: var(--ant-text-secondary); }

/* ============================ Progress ============================ */
.ant-progress { display: flex; align-items: center; gap: 8px; }
.ant-progress-outer { flex: 1; height: 8px; background: var(--ant-fill-tertiary); border-radius: var(--ant-radius-round); overflow: hidden; }
.ant-progress-inner { height: 100%; background: var(--ant-primary); border-radius: var(--ant-radius-round); transition: width var(--ant-motion-duration-slow) var(--ant-motion-ease); }
.ant-progress-inner.success { background: var(--ant-success); }
.ant-progress-inner.warning { background: var(--ant-warning); }
.ant-progress-inner.danger { background: var(--ant-error); }
.ant-progress-text { font-size: var(--ant-font-size-sm); color: var(--ant-text-secondary); min-width: 36px; text-align: right; }

/* ---- 审价条 ---- */
.budget-bar { height: 10px; background: var(--ant-fill-tertiary); border-radius: var(--ant-radius-round); overflow: hidden; }
.budget-bar > span { display: block; height: 100%; background: var(--ant-primary); transition: width var(--ant-motion-duration-slow); }
.budget-bar.over > span { background: var(--ant-error); }

/* ============================ Modal / Drawer ============================ */
.ant-modal-mask, .ant-drawer-mask {
  position: fixed; inset: 0; background: var(--ant-bg-mask); z-index: 1000;
  display: flex; align-items: flex-start; justify-content: center; padding: 100px 16px;
  animation: antFadeIn var(--ant-motion-duration-fast);
}
.ant-drawer-mask { justify-content: flex-end; align-items: stretch; padding: 0; }
.ant-modal {
  background: #fff; border-radius: var(--ant-radius-lg); box-shadow: var(--ant-shadow-3);
  width: 100%; max-width: 520px; overflow: hidden; animation: antZoomIn var(--ant-motion-duration-mid) var(--ant-motion-ease);
}
@keyframes antZoomIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: none; } }
.ant-modal-head { padding: var(--ant-space-lg) var(--ant-space-xl); border-bottom: 1px solid var(--ant-border-secondary); font-size: 16px; font-weight: 600; }
.ant-modal-body { padding: var(--ant-space-xl); max-height: 60vh; overflow: auto; }
.ant-modal-foot { padding: var(--ant-space-md) var(--ant-space-xl); border-top: 1px solid var(--ant-border-secondary); display: flex; justify-content: flex-end; gap: var(--ant-space-sm); }
.ant-drawer {
  background: #fff; box-shadow: var(--ant-shadow-3); height: 100%; width: 720px; max-width: 92vw;
  display: flex; flex-direction: column; animation: antSlideIn var(--ant-motion-duration-mid) var(--ant-motion-ease);
}
@keyframes antSlideIn { from { transform: translateX(100%); } to { transform: none; } }
.ant-drawer-head { padding: var(--ant-space-lg) var(--ant-space-xl); border-bottom: 1px solid var(--ant-border-secondary); font-size: 16px; font-weight: 600; display: flex; justify-content: space-between; align-items:center; }
.ant-drawer-body { padding: var(--ant-space-xl); overflow: auto; flex: 1; }

/* ============================ Spin / Loading ============================ */
.ant-spin { display: inline-block; width: 18px; height: 18px; border: 2px solid var(--ant-primary-border); border-top-color: var(--ant-primary); border-radius: 50%; animation: antSpin 0.8s linear infinite; vertical-align: -3px; }
.ant-spin-lg { width: 32px; height: 32px; border-width: 3px; }
.ant-spin-sm { width: 12px; height: 12px; border-width: 2px; }
@keyframes antSpin { to { transform: rotate(360deg); } }
.ant-spin-center { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--ant-space-md); padding: 64px 0; color: var(--ant-text-tertiary); }
.ant-spin-overlay { position: absolute; inset: 0; background: rgba(255, 255, 255, 0.6); display: flex; align-items: center; justify-content: center; z-index: 20; }

/* ============================ Empty ============================ */
.ant-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 0; color: var(--ant-text-tertiary); gap: var(--ant-space-md); }
.ant-empty .ant-empty-icon { font-size: 40px; opacity: 0.4; }
.ant-empty .ant-empty-text { font-size: var(--ant-font-size); }

/* ============================ Message (Toast) ============================ */
.ant-message-container { position: fixed; top: 24px; left: 0; right: 0; z-index: 2000; display: flex; flex-direction: column; align-items: center; gap: 10px; pointer-events: none; }
.ant-message {
  pointer-events: auto; display: flex; align-items: center; gap: 8px; background: #fff;
  padding: 9px 16px; border-radius: var(--ant-radius); box-shadow: var(--ant-shadow-2);
  font-size: var(--ant-font-size); color: var(--ant-text); animation: antMsgIn var(--ant-motion-duration-mid);
  border: 1px solid var(--ant-border-secondary);
}
@keyframes antMsgIn { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }
.ant-message .ic-success { color: var(--ant-success); }
.ant-message .ic-error { color: var(--ant-error); }
.ant-message .ic-warning { color: var(--ant-warning); }
.ant-message .ic-info { color: var(--ant-primary); }

/* ============================ Tabs ============================ */
.ant-tabs-nav { display: flex; gap: var(--ant-space-xl); border-bottom: 1px solid var(--ant-border-secondary); margin-bottom: var(--ant-space-lg); }
.ant-tabs-tab { padding: 10px 0; cursor: pointer; color: var(--ant-text-secondary); position: relative; font-size: 14px; }
.ant-tabs-tab:hover { color: var(--ant-primary); }
.ant-tabs-tab.active { color: var(--ant-primary); font-weight: 500; }
.ant-tabs-tab.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--ant-primary); border-radius: 2px; }
.ant-tabs-content { display: none; }
.ant-tabs-content.active { display: block; }

/* 媒体库分类 tab（全部 / 门户媒体 / 自媒体） */
.ant-tabs { display: flex; gap: var(--ant-space-md); margin: 4px 0 var(--ant-space-md); }
.ant-tab { padding: 7px 16px; border: 1px solid var(--ant-border-secondary); background: var(--ant-bg); color: var(--ant-text-secondary); border-radius: var(--ant-radius-md); font-size: 14px; cursor: pointer; transition: all .15s; display: inline-flex; align-items: center; gap: 6px; }
.ant-tab:hover { color: var(--ant-primary); border-color: var(--ant-primary); }
.ant-tab.active { color: #fff; background: var(--ant-primary); border-color: var(--ant-primary); font-weight: 500; }
.ant-tab-badge { display: inline-block; min-width: 18px; padding: 0 6px; line-height: 18px; font-size: 12px; text-align: center; border-radius: 9px; background: var(--ant-fill); color: var(--ant-text-tertiary); }
.ant-tab.active .ant-tab-badge { background: rgba(255,255,255,.22); color: #fff; }

/* ============================ Toolbar / 工具条 ============================ */
.ant-toolbar { display: flex; align-items: center; gap: var(--ant-space-md); flex-wrap: wrap; margin-bottom: var(--ant-space-lg); }
.ant-toolbar .spacer { flex: 1; }
.ant-toolbar .ant-input, .ant-toolbar .ant-select { width: auto; min-width: 180px; }

/* ============================ 分屏决策台 ============================ */
.decision-split { display: grid; grid-template-columns: 380px 1fr; gap: var(--ant-space-lg); align-items: start; }
@media (max-width: 1100px) { .decision-split { grid-template-columns: 1fr; } }
.decision-article { position: sticky; top: 72px; }
.article-meta { font-size: var(--ant-font-size-sm); color: var(--ant-text-tertiary); display: flex; flex-direction: column; gap: 6px; }
.article-excerpt { color: var(--ant-text-secondary); line-height: 1.7; margin-top: var(--ant-space-md); }
.article-html { margin-top: var(--ant-space-md); max-height: 300px; overflow: auto; border: 1px solid var(--ant-border-secondary); border-radius: var(--ant-radius); padding: var(--ant-space-md); background: #fafafa; font-size: 13px; }
.article-html img { max-width: 100%; border-radius: var(--ant-radius-sm); }
/* 编辑模式 */
.article-html.editing { outline: 2px solid var(--ant-primary); background: #fff; max-height: none; min-height: 200px; }
.article-excerpt.editing { outline: 2px solid var(--ant-primary); padding: 8px; border-radius: var(--ant-radius); min-height: 40px; }
#rec-article-title.editing { outline: 2px solid var(--ant-primary); padding: 4px 8px; border-radius: var(--ant-radius); min-width: 300px; display: inline-block; }

/* ============================ 推荐卡片 ============================ */
.rec-list { display: flex; flex-direction: column; gap: var(--ant-space-md); }
.rec-card { border: 1px solid var(--ant-border-secondary); border-radius: var(--ant-radius-lg); padding: var(--ant-space-lg); background: #fff; transition: all var(--ant-motion-duration-fast); }
.rec-card:hover { border-color: var(--ant-primary-border); box-shadow: var(--ant-shadow-1); }
.rec-card.selected { border-color: var(--ant-primary); background: var(--ant-primary-bg); }
.rec-card-head { display: flex; align-items: center; justify-content: space-between; gap: var(--ant-space-md); margin-bottom: var(--ant-space-sm); }
.rec-card-title { font-weight: 600; color: var(--ant-text); display: flex; align-items: center; gap: 8px; }
.rec-card-metrics { display: flex; gap: var(--ant-space-lg); flex-wrap: wrap; font-size: var(--ant-font-size-sm); color: var(--ant-text-secondary); }
.rec-card-metrics b { color: var(--ant-text); }
.rec-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--ant-space-sm); }
.media-level { display: inline-flex; align-items: center; flex-shrink: 0; padding: 0 8px; border-radius: 4px; font-size: 12px; font-weight: 600; line-height: 20px; }
.media-level-official { color: #fff; background: #d4380d; }
.media-level-weight { color: #fff; background: #1677ff; }
.media-level-zimeiti { color: #531dab; background: #f9f0ff; border: 1px solid #d3adf7; }
.media-level-portal { color: #0050b3; background: #f0f5ff; border: 1px solid #adc6ff; }
.rec-check { width: 18px; height: 18px; accent-color: var(--ant-primary); cursor: pointer; }

/* ============================ 看板 ============================ */
.board-card { border: 1px solid var(--ant-border-secondary); border-radius: var(--ant-radius-lg); padding: var(--ant-space-lg); background: #fff; margin-bottom: var(--ant-space-md); }
.board-card-head { display: flex; align-items: center; justify-content: space-between; gap: var(--ant-space-md); margin-bottom: var(--ant-space-sm); }
.board-card-meta { font-size: var(--ant-font-size-sm); color: var(--ant-text-tertiary); display: flex; gap: var(--ant-space-lg); flex-wrap: wrap; }
.board-items { margin-top: var(--ant-space-md); border-top: 1px dashed var(--ant-border-secondary); padding-top: var(--ant-space-md); }
.board-item { display: flex; align-items: center; gap: var(--ant-space-md); padding: 8px 0; border-bottom: 1px solid var(--ant-border-secondary); font-size: var(--ant-font-size-sm); }
.board-item:last-child { border-bottom: none; }
.board-item .bi-main { flex: 1; color: var(--ant-text); }
.board-item .bi-link { color: var(--ant-primary); font-size: 12px; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ============================ 登录页 ============================ */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #001529 0%, #1677ff 100%); padding: 16px; }
.ant-login-card { width: 100%; max-width: 400px; background: #fff; border-radius: var(--ant-radius-xl); box-shadow: var(--ant-shadow-3); padding: 40px 36px; }
.ant-login-card .brand { display: flex; align-items: center; gap: 12px; margin-bottom: 28px; }
.ant-login-card .brand .logo-mark { width: 40px; height: 40px; font-size: 20px; }
.ant-login-card .brand .name { font-size: 20px; font-weight: 600; color: var(--ant-text); }
.ant-login-card .brand .sub { font-size: 13px; color: var(--ant-text-tertiary); }
.ant-login-card h1 { font-size: 22px; margin-bottom: 6px; }
.ant-login-card .desc { color: var(--ant-text-tertiary); margin-bottom: var(--ant-space-xl); }

/* ============================ 杂项 ============================ */
.row { display: flex; align-items: center; gap: var(--ant-space-md); }
.col { display: flex; flex-direction: column; gap: var(--ant-space-md); }
.wrap { flex-wrap: wrap; }
.gap-sm { gap: var(--ant-space-sm); }
.gap-lg { gap: var(--ant-space-lg); }
.mt-sm { margin-top: var(--ant-space-sm); }
.mt-md { margin-top: var(--ant-space-md); }
.mt-lg { margin-top: var(--ant-space-lg); }
.mt-xl { margin-top: var(--ant-space-xl); }
.mb-md { margin-bottom: var(--ant-space-md); }
.mb-lg { margin-bottom: var(--ant-space-lg); }
.text-secondary { color: var(--ant-text-secondary); }
.text-tertiary { color: var(--ant-text-tertiary); }
.text-error { color: var(--ant-error); }
.text-success { color: var(--ant-success); }
.text-primary { color: var(--ant-primary); }
.fw-600 { font-weight: 600; }
.fs-sm { font-size: var(--ant-font-size-sm); }
.fs-lg { font-size: var(--ant-font-size-lg); }
.nowrap { white-space: nowrap; }
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flex-1 { flex: 1; min-width: 0; }
.text-right { text-align: right; }
.divider { height: 1px; background: var(--ant-border-secondary); margin: var(--ant-space-lg) 0; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ant-space-lg); }
.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--ant-space-lg); }
@media (max-width: 768px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }
.muted-card { background: var(--ant-fill); border-radius: var(--ant-radius); padding: var(--ant-space-md); font-size: 13px; color: var(--ant-text-secondary); line-height: 1.7; }

/* ============================ 响应式 ============================ */
@media (max-width: 768px) {
  .ant-layout-sider { position: fixed; left: 0; top: 0; z-index: 100; transform: translateX(-100%); transition: transform var(--ant-motion-duration-mid); }
  .ant-layout-sider.mobile-open { transform: none; }
  .ant-layout-content { padding: var(--ant-space-lg); }
  .ant-layout-header { padding: 0 var(--ant-space-lg); }
  .stat-grid { grid-template-columns: 1fr 1fr; }
  .ant-table-wrap { overflow-x: auto; }
}

/* ============================ 媒体详情 Descriptions ============================ */
.ant-descriptions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 var(--ant-space-lg);
}
@media (max-width: 768px) { .ant-descriptions { grid-template-columns: 1fr; } }
.ant-descriptions-item {
  display: flex;
  gap: var(--ant-space-sm);
  padding: var(--ant-space-sm) 0;
  border-bottom: 1px dashed var(--ant-border-secondary);
}
.ant-descriptions-label {
  flex: 0 0 116px;
  color: var(--ant-text-tertiary);
  font-size: 13px;
}
.ant-descriptions-value {
  flex: 1;
  min-width: 0;
  color: var(--ant-text);
  word-break: break-word;
}

/* ============================ 表单：行内 / 提示 ============================ */
.ant-form-item-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ant-space-md);
}
.ant-form-item-hint {
  font-size: 12px;
  color: var(--ant-text-tertiary);
  margin-top: 6px;
  line-height: 1.6;
}
.ant-tip {
  cursor: help;
  color: var(--ant-primary);
  font-weight: 700;
}

/* ============================ 开关 Switch ============================ */
.ant-switch {
  position: relative;
  display: inline-block;
  width: 44px;
  height: 22px;
  border-radius: 22px;
  background: var(--ant-text-tertiary);
  cursor: pointer;
  transition: background var(--ant-motion-duration-mid) var(--ant-motion-ease);
  flex: 0 0 auto;
}
.ant-switch .ant-switch-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.2);
  transition: left var(--ant-motion-duration-mid) var(--ant-motion-ease);
}
.ant-switch.ant-switch-on { background: var(--ant-primary); }
.ant-switch.ant-switch-on .ant-switch-thumb { left: 24px; }

/* ======================== 媒体库翻页 ======================== */
.ant-pagination {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 4px 4px;
  border-top: 1px solid var(--ant-border, #f0f0f0);
  margin-top: 4px;
}
.ant-pagination .mp-info {
  font-size: 13px;
  color: var(--ant-text-secondary, #666);
  margin-right: 6px;
}
.ant-pagination .mp-btn {
  min-width: 34px;
  height: 32px;
  padding: 0 10px;
  font-size: 13px;
  line-height: 1;
  border: 1px solid var(--ant-border, #d9d9d9);
  background: #fff;
  color: var(--ant-text, #333);
  border-radius: 6px;
  cursor: pointer;
  transition: all var(--ant-motion-duration-mid, .2s) var(--ant-motion-ease, ease);
}
.ant-pagination .mp-btn:hover:not([disabled]):not(.mp-cur) {
  color: var(--ant-primary, #1677ff);
  border-color: var(--ant-primary, #1677ff);
}
.ant-pagination .mp-btn[disabled] {
  color: #bfbfbf;
  cursor: not-allowed;
  background: #f5f5f5;
}
.ant-pagination .mp-btn.mp-cur {
  color: #fff;
  background: var(--ant-primary, #1677ff);
  border-color: var(--ant-primary, #1677ff);
  font-weight: 600;
}
.ant-pagination .mp-ellipsis {
  color: #999;
  padding: 0 2px;
}
.ant-pagination .mp-size {
  height: 32px;
  margin-left: auto;
  padding: 0 8px;
}

/* ============ 媒体库高级筛选面板（v1.5.1） ============ */
.ant-adv-filter {
  background: var(--ant-bg);
  border: 1px solid var(--ant-border-secondary);
  border-radius: var(--ant-radius-lg);
  margin-bottom: var(--ant-space-lg);
  overflow: hidden;
}
.aaf-bar {
  display: flex;
  align-items: center;
  gap: var(--ant-space-md);
  padding: 10px 16px;
  background: var(--ant-fill-quaternary, #fafafa);
  border-bottom: 1px solid transparent;
}
.aaf-bar .aaf-title { font-weight: 600; color: var(--ant-text); font-size: 14px; }
.aaf-bar .aaf-summary { color: var(--ant-primary); font-size: 12px; }
.aaf-bar .spacer { flex: 1; }
.aaf-bar .ant-btn-link { padding: 2px 6px; font-size: 13px; }
.ant-adv-filter.open .aaf-bar { border-bottom-color: var(--ant-border-secondary); }
.aaf-body { padding: 14px 16px; display: flex; flex-direction: column; gap: 14px; }
.aaf-row { display: flex; flex-direction: column; gap: 8px; }
.aaf-row.aaf-inline { flex-direction: row; flex-wrap: wrap; gap: 18px 28px; align-items: flex-end; }
.aaf-label { font-size: 13px; color: var(--ant-text-secondary); font-weight: 500; }
.aaf-group { display: flex; flex-direction: column; gap: 8px; }
.aaf-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.aaf-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; font-size: 12.5px; line-height: 20px;
  border: 1px solid var(--ant-border-secondary);
  border-radius: 14px; color: var(--ant-text-secondary);
  background: var(--ant-bg); cursor: pointer; user-select: none;
  transition: all .15s;
}
.aaf-chip:hover { color: var(--ant-primary); border-color: var(--ant-primary); }
.aaf-chip.selected {
  color: #fff; background: var(--ant-primary);
  border-color: var(--ant-primary); font-weight: 500;
  box-shadow: 0 2px 6px var(--ant-primary-shadow, rgba(22,119,255,.25));
}
.aaf-chip-cnt {
  font-size: 11px; padding: 0 5px; line-height: 16px; border-radius: 8px;
  background: var(--ant-fill-secondary, #eee); color: var(--ant-text-tertiary);
}
.aaf-chip.selected .aaf-chip-cnt { background: rgba(255,255,255,.25); color: #fff; }
.aaf-field { display: flex; align-items: center; gap: 6px; }
.aaf-field-label { font-size: 13px; color: var(--ant-text-secondary); white-space: nowrap; }
.aaf-field .ant-input { height: 32px; }
.aaf-dash { color: var(--ant-text-tertiary); }