/* SakuraFubuki 设计语言 · 樱花粉 × 金色 × 扁平卡片 */
:root {
  /* 樱花粉主色 */
  --sakura-50: #FFF0F3;
  --sakura-100: #FFE4E8;
  --sakura-200: #FFB7C5;
  --sakura-300: #E8909A;
  --sakura-400: #D4728A;
  --sakura-500: #B85C75;
  /* 金色 CTA */
  --gold-100: #FFF5D6;
  --gold-200: #FFD700;
  --gold-300: #E6B800;
  /* 中性色 */
  --neutral-50: #FAFAFA;
  --neutral-100: #F5F5F5;
  --neutral-200: #EAEAEA;
  --neutral-300: #BFBFBF;
  --neutral-500: #6B6B6B;
  --neutral-700: #3D3D3D;
  --neutral-900: #1A1A1A;
  /* 语义色 */
  --success: #7ECF99;
  --warning: #FFB74D;
  --error: #E57373;
  --info: #64B5F6;
  /* 圆角 */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;
  /* 4px 间距基准 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  /* 扁平阴影 */
  --shadow-card: 0 0 0 1px rgba(0, 0, 0, 0.04);
  --shadow-card-hover: 0 4px 16px rgba(255, 183, 197, 0.15);
  --shadow-glow: 0 0 20px rgba(255, 215, 0, 0.35), 0 0 40px rgba(255, 215, 0, 0.1);

  /* Element Plus 主色映射 */
  --el-color-primary: #FFB7C5;
  --el-color-primary-light-3: #E8909A;
  --el-color-primary-light-5: #F0A7B3;
  --el-color-primary-light-7: #F8CBD4;
  --el-color-primary-light-8: #FBD9DF;
  --el-color-primary-light-9: #FFE9ED;
  --el-color-primary-dark-2: #D4728A;
  --el-color-success: #7ECF99;
  --el-color-warning: #FFB74D;
  --el-color-danger: #E57373;
  --el-color-info: #64B5F6;
  --el-border-radius-base: 8px;
  --el-border-radius-small: 4px;
  --el-border-radius-round: 20px;
  --el-text-color-primary: #1A1A1A;
  --el-text-color-regular: #3D3D3D;
  --el-text-color-secondary: #6B6B6B;
  --el-border-color: #EAEAEA;
  --el-fill-color-light: #FFF0F3;
  --el-bg-color-page: #FFF0F3;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: linear-gradient(160deg, var(--sakura-50) 0%, var(--neutral-50) 65%);
  color: var(--neutral-700);
  -webkit-font-smoothing: antialiased;
}

/* ---------- 通用布局 ---------- */
.panel-card { margin-bottom: var(--space-6); }
.panel-card .el-card__body { padding: var(--space-5); }
.section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--space-4);
}
.section-title { font-size: 16px; font-weight: 600; color: var(--neutral-900); }

/* 网格（统一对齐） */
.grid-flow {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--space-6);
  align-items: start;
}

/* ---------- Element Plus 组件覆写 ---------- */
.el-button { border-radius: var(--radius-md); font-weight: 500; }
.el-button--primary {
  background: linear-gradient(135deg, #FFB7C5, #E8909A);
  border: none;
  color: #FFFFFF;
  font-weight: 600;
  transition: all .2s ease;
}
.el-button--primary:hover {
  background: linear-gradient(135deg, #FFC6D1, #F09CA6);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 183, 197, 0.4);
}
.el-button--primary:active { transform: scale(0.98); }

.btn-cta {
  background: linear-gradient(135deg, #FFD700, #FFC125) !important;
  color: #1A1A1A !important;
  border: none !important;
  border-radius: var(--radius-full) !important;
  font-weight: 700 !important;
  padding: 10px 32px !important;
  transition: all .2s ease;
}
.btn-cta:hover { box-shadow: var(--shadow-glow); filter: brightness(1.03); }
.btn-cta:active { transform: scale(0.96); }

.el-card {
  border-radius: var(--radius-lg);
  border: 1px solid var(--neutral-200);
  box-shadow: var(--shadow-card);
  transition: all .3s ease;
}
.el-card:hover { box-shadow: var(--shadow-card-hover); }
.el-tag { border-radius: var(--radius-full); }
.el-input__wrapper, .el-textarea__inner { border-radius: var(--radius-sm); }
.el-dialog { border-radius: var(--radius-xl); }
.el-form-item__label { color: var(--neutral-500); }

/* 侧边栏 */
.aside { background: linear-gradient(180deg, #fff 0%, var(--sakura-50) 100%); display: flex; flex-direction: column; border-right: 1px solid rgba(234, 234, 234, 0.6); }
.brand {
  display: flex; align-items: center; gap: var(--space-3);
  padding: var(--space-4) var(--space-5);
  font-weight: 700; font-size: 16px; color: var(--neutral-900);
}
.brand img { width: 34px; height: 34px; border-radius: var(--radius-md); object-fit: contain; }
.aside .el-menu { border-right: none; flex: 1; background: transparent; }
.aside .el-menu-item { border-radius: var(--radius-sm); margin: 2px 12px; height: 44px; }
.aside .el-menu-item.is-active { background: rgba(255, 183, 197, 0.16); color: var(--sakura-300); font-weight: 600; }
.aside-footer { padding: var(--space-4); text-align: center; }

/* 图片卡片 */
.img-card { overflow: hidden; }
.img-card .thumb {
  width: 100%; height: 160px; background: #000; display: block;
  object-fit: cover; border-radius: 0;
}
.img-card .meta { padding: var(--space-3) var(--space-4); }
.img-card .meta .t { font-size: 13px; font-weight: 600; color: var(--neutral-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: var(--space-1); }
.img-card .meta .s { font-size: 12px; color: var(--neutral-500); display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); }
.img-card .meta .acts { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); }
.img-card.is-selected { border: 2px solid var(--sakura-200); }

/* 滚动日志 */
.log-box {
  background: #1E1E1E; color: #D4D4D4; padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-sm); font-family: 'SF Mono', 'Fira Code', Consolas, monospace;
  font-size: 12px; line-height: 1.7; height: 420px; overflow-y: auto;
  white-space: pre-wrap; word-break: break-all;
}
.log-line { display: block; }
.log-line.info { color: #D4D4D4; }
.log-line.error { color: #E57373; }
.log-line.warning { color: #FFB74D; }

/* 登录页 */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: var(--space-4); }
.login-card { width: 400px; max-width: 100%; }
.login-brand { text-align: center; margin-bottom: var(--space-6); }
.login-brand img { width: 64px; height: 64px; border-radius: var(--radius-lg); }
.login-brand h1 { color: var(--neutral-900); font-size: 24px; margin: var(--space-3) 0 var(--space-1); }
.login-brand p { color: var(--neutral-500); margin: 0; font-size: 13px; }

/* 选中徽标对齐 */
.status-pill { display: inline-flex; align-items: center; gap: 4px; }